Remove GraphQL SaveRequest component
This commit is contained in:
Andrew Bastin
@@ -1,253 +0,0 @@
|
|||||||
<template>
|
|
||||||
<SmartModal v-if="show" @close="hideModal">
|
|
||||||
<div slot="header">
|
|
||||||
<div class="row-wrapper">
|
|
||||||
<h3 class="title">{{ $t("save_request_as") }}</h3>
|
|
||||||
<div>
|
|
||||||
<button class="icon" @click="hideModal">
|
|
||||||
<i class="material-icons">close</i>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div slot="body" class="flex flex-col">
|
|
||||||
<label for="selectLabel">{{ $t("token_req_name") }}</label>
|
|
||||||
<input
|
|
||||||
id="selectLabel"
|
|
||||||
v-model="requestData.name"
|
|
||||||
type="text"
|
|
||||||
@keyup.enter="saveRequestAs"
|
|
||||||
/>
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<label for="selectCollection">{{ $t("collection") }}</label>
|
|
||||||
<span class="select-wrapper">
|
|
||||||
<select
|
|
||||||
id="selectCollection"
|
|
||||||
v-model="requestData.collectionIndex"
|
|
||||||
type="text"
|
|
||||||
>
|
|
||||||
<option
|
|
||||||
:key="undefined"
|
|
||||||
:value="undefined"
|
|
||||||
hidden
|
|
||||||
disabled
|
|
||||||
selected
|
|
||||||
>
|
|
||||||
{{ $t("select_collection") }}
|
|
||||||
</option>
|
|
||||||
<option
|
|
||||||
v-for="(collection, index) in $store.state.postwoman
|
|
||||||
.collectionsGraphql"
|
|
||||||
:key="index"
|
|
||||||
:value="index"
|
|
||||||
>
|
|
||||||
{{ collection.name }}
|
|
||||||
</option>
|
|
||||||
</select>
|
|
||||||
</span>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<label>{{ $t("folder") }}</label>
|
|
||||||
<SmartAutoComplete
|
|
||||||
v-model="requestData.folderName"
|
|
||||||
:placeholder="$t('search')"
|
|
||||||
:source="folders"
|
|
||||||
:spellcheck="false"
|
|
||||||
/>
|
|
||||||
<ul>
|
|
||||||
<li>
|
|
||||||
<label for="selectRequest">{{ $t("request") }}</label>
|
|
||||||
<span class="select-wrapper">
|
|
||||||
<select
|
|
||||||
id="selectRequest"
|
|
||||||
v-model="requestData.requestIndex"
|
|
||||||
type="text"
|
|
||||||
>
|
|
||||||
<option :key="undefined" :value="undefined">/</option>
|
|
||||||
<option
|
|
||||||
v-for="(folder, index) in requests"
|
|
||||||
:key="index"
|
|
||||||
:value="index"
|
|
||||||
>
|
|
||||||
{{ folder.name }}
|
|
||||||
</option>
|
|
||||||
</select>
|
|
||||||
</span>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div slot="footer">
|
|
||||||
<div class="row-wrapper">
|
|
||||||
<span></span>
|
|
||||||
<span>
|
|
||||||
<button class="icon" @click="hideModal">
|
|
||||||
{{ $t("cancel") }}
|
|
||||||
</button>
|
|
||||||
<button class="icon primary" @click="saveRequestAs">
|
|
||||||
{{ $t("save") }}
|
|
||||||
</button>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</SmartModal>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { fb } from "~/helpers/fb"
|
|
||||||
|
|
||||||
export default {
|
|
||||||
props: {
|
|
||||||
show: Boolean,
|
|
||||||
editingRequest: { type: Object, default: () => {} },
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
defaultRequestName: "Untitled Request",
|
|
||||||
requestData: {
|
|
||||||
name: undefined,
|
|
||||||
collectionIndex: undefined,
|
|
||||||
folderName: undefined,
|
|
||||||
requestIndex: undefined,
|
|
||||||
},
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
folders() {
|
|
||||||
const collections = this.$store.state.postwoman.collectionsGraphql
|
|
||||||
const collectionIndex = this.$data.requestData.collectionIndex
|
|
||||||
const userSelectedAnyCollection = collectionIndex !== undefined
|
|
||||||
if (!userSelectedAnyCollection) return []
|
|
||||||
|
|
||||||
const noCollectionAvailable = collections[collectionIndex] !== undefined
|
|
||||||
if (!noCollectionAvailable) return []
|
|
||||||
|
|
||||||
return getFolderNames(collections[collectionIndex].folders, [])
|
|
||||||
},
|
|
||||||
requests() {
|
|
||||||
const collections = this.$store.state.postwoman.collectionsGraphql
|
|
||||||
const collectionIndex = this.$data.requestData.collectionIndex
|
|
||||||
const folderName = this.$data.requestData.folderName
|
|
||||||
|
|
||||||
const userSelectedAnyCollection = collectionIndex !== undefined
|
|
||||||
if (!userSelectedAnyCollection) {
|
|
||||||
return []
|
|
||||||
}
|
|
||||||
|
|
||||||
const userSelectedAnyFolder =
|
|
||||||
folderName !== undefined && folderName !== ""
|
|
||||||
|
|
||||||
if (userSelectedAnyFolder) {
|
|
||||||
const collection = collections[collectionIndex]
|
|
||||||
const folder = findFolder(folderName, collection)
|
|
||||||
return folder.requests
|
|
||||||
} else {
|
|
||||||
const collection = collections[collectionIndex]
|
|
||||||
const noCollectionAvailable = collection !== undefined
|
|
||||||
|
|
||||||
if (!noCollectionAvailable) {
|
|
||||||
return []
|
|
||||||
}
|
|
||||||
|
|
||||||
return collection.requests
|
|
||||||
}
|
|
||||||
},
|
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
"requestData.collectionIndex": function resetFolderAndRequestIndex() {
|
|
||||||
// if user has chosen some folder, than selected other collection, which doesn't have any folders
|
|
||||||
// than `requestUpdateData.folderName` won't be reseted
|
|
||||||
this.$data.requestData.folderName = undefined
|
|
||||||
this.$data.requestData.requestIndex = undefined
|
|
||||||
},
|
|
||||||
"requestData.folderName": function resetRequestIndex() {
|
|
||||||
this.$data.requestData.requestIndex = undefined
|
|
||||||
},
|
|
||||||
editingRequest({ name }) {
|
|
||||||
this.$data.requestData.name = name || this.$data.defaultRequestName
|
|
||||||
},
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
syncCollections() {
|
|
||||||
if (fb.currentUser !== null && fb.currentSettings[0]) {
|
|
||||||
if (fb.currentSettings[0].value) {
|
|
||||||
fb.writeCollections(
|
|
||||||
JSON.parse(
|
|
||||||
JSON.stringify(this.$store.state.postwoman.collectionsGraphql)
|
|
||||||
),
|
|
||||||
"collectionsGraphql"
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
saveRequestAs() {
|
|
||||||
const userDidntSpecifyCollection =
|
|
||||||
this.$data.requestData.collectionIndex === undefined
|
|
||||||
if (userDidntSpecifyCollection) {
|
|
||||||
this.$toast.error(this.$t("select_collection"), {
|
|
||||||
icon: "error",
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if (this.$data.requestData.name.length === 0) {
|
|
||||||
this.$toast.error(this.$t("empty_req_name"), {
|
|
||||||
icon: "error",
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
const requestUpdated = {
|
|
||||||
...this.$props.editingRequest,
|
|
||||||
name: this.$data.requestData.name,
|
|
||||||
collection: this.$data.requestData.collectionIndex,
|
|
||||||
}
|
|
||||||
|
|
||||||
this.$store.commit("postwoman/saveRequestAs", {
|
|
||||||
request: requestUpdated,
|
|
||||||
collectionIndex: this.$data.requestData.collectionIndex,
|
|
||||||
folderName: this.$data.requestData.folderName,
|
|
||||||
requestIndex: this.$data.requestData.requestIndex,
|
|
||||||
flag: "graphql",
|
|
||||||
})
|
|
||||||
|
|
||||||
this.hideModal()
|
|
||||||
this.syncCollections()
|
|
||||||
},
|
|
||||||
hideModal() {
|
|
||||||
this.$emit("hide-modal")
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
|
|
||||||
function getFolderNames(folders, namesList) {
|
|
||||||
if (folders.length) {
|
|
||||||
folders.forEach((folder) => {
|
|
||||||
namesList.push(folder.name)
|
|
||||||
if (folder.folders && folder.folders.length) {
|
|
||||||
getFolderNames(folder.folders, namesList)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
return namesList
|
|
||||||
}
|
|
||||||
|
|
||||||
function findFolder(folderName, currentFolder) {
|
|
||||||
let selectedFolder
|
|
||||||
let result
|
|
||||||
|
|
||||||
if (folderName === currentFolder.name) {
|
|
||||||
return currentFolder
|
|
||||||
}
|
|
||||||
|
|
||||||
for (let i = 0; i < currentFolder.folders.length; i++) {
|
|
||||||
selectedFolder = currentFolder.folders[i]
|
|
||||||
|
|
||||||
result = findFolder(folderName, selectedFolder)
|
|
||||||
|
|
||||||
if (result !== false) {
|
|
||||||
return result
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
Reference in New Issue
Block a user