Initial prettier formatted files
This commit is contained in:
Dmitry Yankowski
@@ -4,7 +4,7 @@
|
||||
<ul>
|
||||
<li>
|
||||
<div class="flex-wrap">
|
||||
<h3 class="title">{{ $t("new_collection") }}</h3>
|
||||
<h3 class="title">{{ $t('new_collection') }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
@@ -31,10 +31,10 @@
|
||||
<span></span>
|
||||
<span>
|
||||
<button class="icon" @click="hideModal">
|
||||
{{ $t("cancel") }}
|
||||
{{ $t('cancel') }}
|
||||
</button>
|
||||
<button class="icon primary" @click="addNewCollection">
|
||||
{{ $t("save") }}
|
||||
{{ $t('save') }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
@@ -43,44 +43,42 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fb } from "../../functions/fb";
|
||||
import { fb } from '../../functions/fb'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
show: Boolean
|
||||
show: Boolean,
|
||||
},
|
||||
components: {
|
||||
modal: () => import("../../components/modal")
|
||||
modal: () => import('../../components/modal'),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
name: undefined
|
||||
};
|
||||
name: undefined,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collections))
|
||||
);
|
||||
fb.writeCollections(JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)))
|
||||
}
|
||||
}
|
||||
},
|
||||
addNewCollection() {
|
||||
if (!this.$data.name) {
|
||||
this.$toast.info($t("invalid_collection_name"));
|
||||
return;
|
||||
this.$toast.info($t('invalid_collection_name'))
|
||||
return
|
||||
}
|
||||
this.$store.commit("postwoman/addNewCollection", {
|
||||
name: this.$data.name
|
||||
});
|
||||
this.$emit("hide-modal");
|
||||
this.syncCollections();
|
||||
this.$store.commit('postwoman/addNewCollection', {
|
||||
name: this.$data.name,
|
||||
})
|
||||
this.$emit('hide-modal')
|
||||
this.syncCollections()
|
||||
},
|
||||
hideModal() {
|
||||
this.$emit("hide-modal");
|
||||
}
|
||||
}
|
||||
};
|
||||
this.$emit('hide-modal')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<ul>
|
||||
<li>
|
||||
<div class="flex-wrap">
|
||||
<h3 class="title">{{ $t("new_folder") }}</h3>
|
||||
<h3 class="title">{{ $t('new_folder') }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
@@ -31,10 +31,10 @@
|
||||
<span></span>
|
||||
<span>
|
||||
<button class="icon" @click="hideModal">
|
||||
{{ $t("cancel") }}
|
||||
{{ $t('cancel') }}
|
||||
</button>
|
||||
<button class="icon primary" @click="addNewFolder">
|
||||
{{ $t("save") }}
|
||||
{{ $t('save') }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
@@ -47,27 +47,27 @@ export default {
|
||||
props: {
|
||||
show: Boolean,
|
||||
collection: Object,
|
||||
collectionIndex: Number
|
||||
collectionIndex: Number,
|
||||
},
|
||||
components: {
|
||||
modal: () => import("../../components/modal")
|
||||
modal: () => import('../../components/modal'),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
name: undefined
|
||||
};
|
||||
name: undefined,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addNewFolder() {
|
||||
this.$store.commit("postwoman/addNewFolder", {
|
||||
this.$store.commit('postwoman/addNewFolder', {
|
||||
folder: { name: this.$data.name },
|
||||
collectionIndex: this.$props.collectionIndex
|
||||
});
|
||||
this.hideModal();
|
||||
collectionIndex: this.$props.collectionIndex,
|
||||
})
|
||||
this.hideModal()
|
||||
},
|
||||
hideModal() {
|
||||
this.$emit("hide-modal");
|
||||
}
|
||||
}
|
||||
};
|
||||
this.$emit('hide-modal')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -17,23 +17,19 @@
|
||||
<div>
|
||||
<button class="icon" @click="$emit('add-folder')" v-close-popover>
|
||||
<i class="material-icons">create_new_folder</i>
|
||||
<span>{{ $t("new_folder") }}</span>
|
||||
<span>{{ $t('new_folder') }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<button
|
||||
class="icon"
|
||||
@click="$emit('edit-collection')"
|
||||
v-close-popover
|
||||
>
|
||||
<button class="icon" @click="$emit('edit-collection')" v-close-popover>
|
||||
<i class="material-icons">create</i>
|
||||
<span>{{ $t("edit") }}</span>
|
||||
<span>{{ $t('edit') }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<button class="icon" @click="removeCollection" v-close-popover>
|
||||
<i class="material-icons">delete</i>
|
||||
<span>{{ $t("delete") }}</span>
|
||||
<span>{{ $t('delete') }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
@@ -51,12 +47,8 @@
|
||||
@edit-request="$emit('edit-request', $event)"
|
||||
/>
|
||||
</li>
|
||||
<li
|
||||
v-if="
|
||||
collection.folders.length === 0 && collection.requests.length === 0
|
||||
"
|
||||
>
|
||||
<label>{{ $t("collection_empty") }}</label>
|
||||
<li v-if="collection.folders.length === 0 && collection.requests.length === 0">
|
||||
<label>{{ $t('collection_empty') }}</label>
|
||||
</li>
|
||||
</ul>
|
||||
<ul>
|
||||
@@ -71,7 +63,7 @@
|
||||
request,
|
||||
collectionIndex,
|
||||
folderIndex: undefined,
|
||||
requestIndex: index
|
||||
requestIndex: index,
|
||||
})
|
||||
"
|
||||
/>
|
||||
@@ -97,32 +89,32 @@ ul li {
|
||||
<script>
|
||||
export default {
|
||||
components: {
|
||||
folder: () => import("./folder"),
|
||||
request: () => import("./request")
|
||||
folder: () => import('./folder'),
|
||||
request: () => import('./request'),
|
||||
},
|
||||
props: {
|
||||
collectionIndex: Number,
|
||||
collection: Object
|
||||
collection: Object,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showChildren: false,
|
||||
selectedFolder: {}
|
||||
};
|
||||
selectedFolder: {},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
toggleShowChildren() {
|
||||
this.showChildren = !this.showChildren;
|
||||
this.showChildren = !this.showChildren
|
||||
},
|
||||
removeCollection() {
|
||||
if (!confirm("Are you sure you want to remove this Collection?")) return;
|
||||
this.$store.commit("postwoman/removeCollection", {
|
||||
collectionIndex: this.collectionIndex
|
||||
});
|
||||
if (!confirm('Are you sure you want to remove this Collection?')) return
|
||||
this.$store.commit('postwoman/removeCollection', {
|
||||
collectionIndex: this.collectionIndex,
|
||||
})
|
||||
},
|
||||
editFolder(collectionIndex, folder, folderIndex) {
|
||||
this.$emit("edit-folder", { collectionIndex, folder, folderIndex });
|
||||
}
|
||||
}
|
||||
};
|
||||
this.$emit('edit-folder', { collectionIndex, folder, folderIndex })
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<ul>
|
||||
<li>
|
||||
<div class="flex-wrap">
|
||||
<h3 class="title">{{ $t("edit_collection") }}</h3>
|
||||
<h3 class="title">{{ $t('edit_collection') }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
@@ -31,10 +31,10 @@
|
||||
<span></span>
|
||||
<span>
|
||||
<button class="icon" @click="hideModal">
|
||||
{{ $t("cancel") }}
|
||||
{{ $t('cancel') }}
|
||||
</button>
|
||||
<button class="icon primary" @click="saveCollection">
|
||||
{{ $t("save") }}
|
||||
{{ $t('save') }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
@@ -47,35 +47,35 @@ export default {
|
||||
props: {
|
||||
show: Boolean,
|
||||
editingCollection: Object,
|
||||
editingCollectionIndex: Number
|
||||
editingCollectionIndex: Number,
|
||||
},
|
||||
components: {
|
||||
modal: () => import("../../components/modal")
|
||||
modal: () => import('../../components/modal'),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
name: undefined
|
||||
};
|
||||
name: undefined,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
saveCollection() {
|
||||
if (!this.$data.name) {
|
||||
this.$toast.info($t("invalid_collection_name"));
|
||||
return;
|
||||
this.$toast.info($t('invalid_collection_name'))
|
||||
return
|
||||
}
|
||||
const collectionUpdated = {
|
||||
...this.$props.editingCollection,
|
||||
name: this.$data.name
|
||||
};
|
||||
this.$store.commit("postwoman/editCollection", {
|
||||
name: this.$data.name,
|
||||
}
|
||||
this.$store.commit('postwoman/editCollection', {
|
||||
collection: collectionUpdated,
|
||||
collectionIndex: this.$props.editingCollectionIndex
|
||||
});
|
||||
this.$emit("hide-modal");
|
||||
collectionIndex: this.$props.editingCollectionIndex,
|
||||
})
|
||||
this.$emit('hide-modal')
|
||||
},
|
||||
hideModal() {
|
||||
this.$emit("hide-modal");
|
||||
}
|
||||
}
|
||||
};
|
||||
this.$emit('hide-modal')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<ul>
|
||||
<li>
|
||||
<div class="flex-wrap">
|
||||
<h3 class="title">{{ $t("edit_folder") }}</h3>
|
||||
<h3 class="title">{{ $t('edit_folder') }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
@@ -17,12 +17,7 @@
|
||||
<div slot="body">
|
||||
<ul>
|
||||
<li>
|
||||
<input
|
||||
type="text"
|
||||
v-model="name"
|
||||
:placeholder="folder.name"
|
||||
@keyup.enter="editFolder"
|
||||
/>
|
||||
<input type="text" v-model="name" :placeholder="folder.name" @keyup.enter="editFolder" />
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -31,10 +26,10 @@
|
||||
<span></span>
|
||||
<span>
|
||||
<button class="icon" @click="hideModal">
|
||||
{{ $t("cancel") }}
|
||||
{{ $t('cancel') }}
|
||||
</button>
|
||||
<button class="icon primary" @click="editFolder">
|
||||
{{ $t("save") }}
|
||||
{{ $t('save') }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
@@ -49,28 +44,28 @@ export default {
|
||||
collection: Object,
|
||||
collectionIndex: Number,
|
||||
folder: Object,
|
||||
folderIndex: Number
|
||||
folderIndex: Number,
|
||||
},
|
||||
components: {
|
||||
modal: () => import("../../components/modal")
|
||||
modal: () => import('../../components/modal'),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
name: undefined
|
||||
};
|
||||
name: undefined,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
editFolder() {
|
||||
this.$store.commit("postwoman/editFolder", {
|
||||
this.$store.commit('postwoman/editFolder', {
|
||||
collectionIndex: this.$props.collectionIndex,
|
||||
folder: { ...this.$props.folder, name: this.$data.name },
|
||||
folderIndex: this.$props.folderIndex
|
||||
});
|
||||
this.hideModal();
|
||||
folderIndex: this.$props.folderIndex,
|
||||
})
|
||||
this.hideModal()
|
||||
},
|
||||
hideModal() {
|
||||
this.$emit("hide-modal");
|
||||
}
|
||||
}
|
||||
};
|
||||
this.$emit('hide-modal')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<ul>
|
||||
<li>
|
||||
<div class="flex-wrap">
|
||||
<h3 class="title">{{ $t("edit_request") }}</h3>
|
||||
<h3 class="title">{{ $t('edit_request') }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
@@ -17,7 +17,7 @@
|
||||
<div slot="body">
|
||||
<ul>
|
||||
<li>
|
||||
<label for="selectLabel">{{ $t("label") }}</label>
|
||||
<label for="selectLabel">{{ $t('label') }}</label>
|
||||
<input
|
||||
type="text"
|
||||
id="selectLabel"
|
||||
@@ -25,24 +25,14 @@
|
||||
@keyup.enter="saveRequest"
|
||||
:placeholder="request.name"
|
||||
/>
|
||||
<label for="selectCollection">{{ $t("collection") }}</label>
|
||||
<label for="selectCollection">{{ $t('collection') }}</label>
|
||||
<span class="select-wrapper">
|
||||
<select
|
||||
type="text"
|
||||
id="selectCollection"
|
||||
v-model="requestUpdateData.collectionIndex"
|
||||
>
|
||||
<select type="text" id="selectCollection" v-model="requestUpdateData.collectionIndex">
|
||||
<option :key="undefined" :value="undefined" hidden disabled selected>{{
|
||||
$t('current_collection')
|
||||
}}</option>
|
||||
<option
|
||||
:key="undefined"
|
||||
:value="undefined"
|
||||
hidden
|
||||
disabled
|
||||
selected
|
||||
>{{ $t("current_collection") }}</option
|
||||
>
|
||||
<option
|
||||
v-for="(collection, index) in $store.state.postwoman
|
||||
.collections"
|
||||
v-for="(collection, index) in $store.state.postwoman.collections"
|
||||
:key="index"
|
||||
:value="index"
|
||||
>
|
||||
@@ -50,19 +40,11 @@
|
||||
</option>
|
||||
</select>
|
||||
</span>
|
||||
<label for="selectFolder">{{ $t("folder") }}</label>
|
||||
<label for="selectFolder">{{ $t('folder') }}</label>
|
||||
<span class="select-wrapper">
|
||||
<select
|
||||
type="text"
|
||||
id="selectFolder"
|
||||
v-model="requestUpdateData.folderIndex"
|
||||
>
|
||||
<select type="text" id="selectFolder" v-model="requestUpdateData.folderIndex">
|
||||
<option :key="undefined" :value="undefined">/</option>
|
||||
<option
|
||||
v-for="(folder, index) in folders"
|
||||
:key="index"
|
||||
:value="index"
|
||||
>
|
||||
<option v-for="(folder, index) in folders" :key="index" :value="index">
|
||||
{{ folder.name }}
|
||||
</option>
|
||||
</select>
|
||||
@@ -75,10 +57,10 @@
|
||||
<span></span>
|
||||
<span>
|
||||
<button class="icon" @click="hideModal">
|
||||
{{ $t("cancel") }}
|
||||
{{ $t('cancel') }}
|
||||
</button>
|
||||
<button class="icon primary" @click="saveRequest">
|
||||
{{ $t("save") }}
|
||||
{{ $t('save') }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
@@ -93,42 +75,39 @@ export default {
|
||||
collectionIndex: Number,
|
||||
folderIndex: Number,
|
||||
request: Object,
|
||||
requestIndex: Number
|
||||
requestIndex: Number,
|
||||
},
|
||||
components: {
|
||||
modal: () => import("../../components/modal")
|
||||
modal: () => import('../../components/modal'),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
requestUpdateData: {
|
||||
name: undefined,
|
||||
collectionIndex: undefined,
|
||||
folderIndex: undefined
|
||||
}
|
||||
};
|
||||
folderIndex: undefined,
|
||||
},
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
"requestUpdateData.collectionIndex": function resetFolderIndex() {
|
||||
'requestUpdateData.collectionIndex': function resetFolderIndex() {
|
||||
// if user choosen some folder, than selected other collection, which doesn't have any folders
|
||||
// than `requestUpdateData.folderIndex` won't be reseted
|
||||
this.$data.requestUpdateData.folderIndex = undefined;
|
||||
}
|
||||
this.$data.requestUpdateData.folderIndex = undefined
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
folders() {
|
||||
const userSelectedAnyCollection =
|
||||
this.$data.requestUpdateData.collectionIndex !== undefined;
|
||||
if (!userSelectedAnyCollection) return [];
|
||||
const userSelectedAnyCollection = this.$data.requestUpdateData.collectionIndex !== undefined
|
||||
if (!userSelectedAnyCollection) return []
|
||||
|
||||
return this.$store.state.postwoman.collections[
|
||||
this.$data.requestUpdateData.collectionIndex
|
||||
].folders;
|
||||
}
|
||||
return this.$store.state.postwoman.collections[this.$data.requestUpdateData.collectionIndex]
|
||||
.folders
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
saveRequest() {
|
||||
const userSelectedAnyCollection =
|
||||
this.$data.requestUpdateData.collectionIndex !== undefined;
|
||||
const userSelectedAnyCollection = this.$data.requestUpdateData.collectionIndex !== undefined
|
||||
|
||||
const requestUpdated = {
|
||||
...this.$props.request,
|
||||
@@ -136,25 +115,25 @@ export default {
|
||||
collection: userSelectedAnyCollection
|
||||
? this.$data.requestUpdateData.collectionIndex
|
||||
: this.$props.collectionIndex,
|
||||
folder: this.$data.requestUpdateData.folderIndex
|
||||
};
|
||||
folder: this.$data.requestUpdateData.folderIndex,
|
||||
}
|
||||
|
||||
// pass data separately to don't depend on request's collection, folder fields
|
||||
// probably, they should be deprecated because they don't describe request itself
|
||||
this.$store.commit("postwoman/editRequest", {
|
||||
this.$store.commit('postwoman/editRequest', {
|
||||
requestOldCollectionIndex: this.$props.collectionIndex,
|
||||
requestOldFolderIndex: this.$props.folderIndex,
|
||||
requestOldIndex: this.$props.requestIndex,
|
||||
requestNew: requestUpdated,
|
||||
requestNewCollectionIndex: requestUpdated.collection,
|
||||
requestNewFolderIndex: requestUpdated.folder
|
||||
});
|
||||
requestNewFolderIndex: requestUpdated.folder,
|
||||
})
|
||||
|
||||
this.hideModal();
|
||||
this.hideModal()
|
||||
},
|
||||
hideModal() {
|
||||
this.$emit("hide-modal");
|
||||
}
|
||||
}
|
||||
};
|
||||
this.$emit('hide-modal')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -17,13 +17,13 @@
|
||||
<div>
|
||||
<button class="icon" @click="editFolder" v-close-popover>
|
||||
<i class="material-icons">edit</i>
|
||||
<span>{{ $t("edit") }}</span>
|
||||
<span>{{ $t('edit') }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<button class="icon" @click="removeFolder" v-close-popover>
|
||||
<i class="material-icons">delete</i>
|
||||
<span>{{ $t("delete") }}</span>
|
||||
<span>{{ $t('delete') }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
@@ -43,13 +43,13 @@
|
||||
request,
|
||||
collectionIndex,
|
||||
folderIndex,
|
||||
requestIndex: index
|
||||
requestIndex: index,
|
||||
})
|
||||
"
|
||||
/>
|
||||
</li>
|
||||
<li v-if="folder.requests.length === 0">
|
||||
<label>{{ $t("folder_empty") }}</label>
|
||||
<label>{{ $t('folder_empty') }}</label>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -74,33 +74,33 @@ export default {
|
||||
props: {
|
||||
folder: Object,
|
||||
collectionIndex: Number,
|
||||
folderIndex: Number
|
||||
folderIndex: Number,
|
||||
},
|
||||
components: {
|
||||
request: () => import("./request")
|
||||
request: () => import('./request'),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showChildren: false
|
||||
};
|
||||
showChildren: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
toggleShowChildren() {
|
||||
this.showChildren = !this.showChildren;
|
||||
this.showChildren = !this.showChildren
|
||||
},
|
||||
selectRequest(request) {
|
||||
this.$store.commit("postwoman/selectRequest", { request });
|
||||
this.$store.commit('postwoman/selectRequest', { request })
|
||||
},
|
||||
removeFolder() {
|
||||
if (!confirm("Are you sure you want to remove this folder?")) return;
|
||||
this.$store.commit("postwoman/removeFolder", {
|
||||
if (!confirm('Are you sure you want to remove this folder?')) return
|
||||
this.$store.commit('postwoman/removeFolder', {
|
||||
collectionIndex: this.collectionIndex,
|
||||
folderIndex: this.folderIndex
|
||||
});
|
||||
folderIndex: this.folderIndex,
|
||||
})
|
||||
},
|
||||
editFolder() {
|
||||
this.$emit("edit-folder");
|
||||
}
|
||||
}
|
||||
};
|
||||
this.$emit('edit-folder')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -14,18 +14,12 @@
|
||||
<div class="flex-wrap">
|
||||
<span
|
||||
v-tooltip="{
|
||||
content: !fb.currentUser
|
||||
? $t('login_first')
|
||||
: $t('replace_current')
|
||||
content: !fb.currentUser ? $t('login_first') : $t('replace_current'),
|
||||
}"
|
||||
>
|
||||
<button
|
||||
:disabled="!fb.currentUser"
|
||||
class="icon"
|
||||
@click="syncCollections"
|
||||
>
|
||||
<button :disabled="!fb.currentUser" class="icon" @click="syncCollections">
|
||||
<i class="material-icons">folder_shared</i>
|
||||
<span>{{ $t("import_from_sync") }}</span>
|
||||
<span>{{ $t('import_from_sync') }}</span>
|
||||
</button>
|
||||
</span>
|
||||
<button
|
||||
@@ -34,7 +28,7 @@
|
||||
v-tooltip="$t('replace_current')"
|
||||
>
|
||||
<i class="material-icons">create_new_folder</i>
|
||||
<span>{{ $t("replace_json") }}</span>
|
||||
<span>{{ $t('replace_json') }}</span>
|
||||
<input
|
||||
type="file"
|
||||
@change="replaceWithJSON"
|
||||
@@ -49,7 +43,7 @@
|
||||
v-tooltip="$t('preserve_current')"
|
||||
>
|
||||
<i class="material-icons">folder_special</i>
|
||||
<span>{{ $t("import_json") }}</span>
|
||||
<span>{{ $t('import_json') }}</span>
|
||||
<input
|
||||
type="file"
|
||||
@change="importFromJSON"
|
||||
@@ -70,14 +64,10 @@
|
||||
<span></span>
|
||||
<span>
|
||||
<button class="icon" @click="hideModal">
|
||||
{{ $t("cancel") }}
|
||||
{{ $t('cancel') }}
|
||||
</button>
|
||||
<button
|
||||
class="icon primary"
|
||||
@click="exportJSON"
|
||||
v-tooltip="$t('download_file')"
|
||||
>
|
||||
{{ $t("export") }}
|
||||
<button class="icon primary" @click="exportJSON" v-tooltip="$t('download_file')">
|
||||
{{ $t('export') }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
@@ -86,239 +76,211 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fb } from "../../functions/fb";
|
||||
import { fb } from '../../functions/fb'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
fb
|
||||
};
|
||||
fb,
|
||||
}
|
||||
},
|
||||
props: {
|
||||
show: Boolean
|
||||
show: Boolean,
|
||||
},
|
||||
components: {
|
||||
modal: () => import("../../components/modal")
|
||||
modal: () => import('../../components/modal'),
|
||||
},
|
||||
computed: {
|
||||
collectionJson() {
|
||||
return JSON.stringify(this.$store.state.postwoman.collections, null, 2);
|
||||
}
|
||||
return JSON.stringify(this.$store.state.postwoman.collections, null, 2)
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
hideModal() {
|
||||
this.$emit("hide-modal");
|
||||
this.$emit('hide-modal')
|
||||
},
|
||||
openDialogChooseFileToReplaceWith() {
|
||||
this.$refs.inputChooseFileToReplaceWith.click();
|
||||
this.$refs.inputChooseFileToReplaceWith.click()
|
||||
},
|
||||
openDialogChooseFileToImportFrom() {
|
||||
this.$refs.inputChooseFileToImportFrom.click();
|
||||
this.$refs.inputChooseFileToImportFrom.click()
|
||||
},
|
||||
replaceWithJSON() {
|
||||
let reader = new FileReader();
|
||||
let reader = new FileReader()
|
||||
reader.onload = event => {
|
||||
let content = event.target.result;
|
||||
let collections = JSON.parse(content);
|
||||
let content = event.target.result
|
||||
let collections = JSON.parse(content)
|
||||
if (collections[0]) {
|
||||
let [name, folders, requests] = Object.keys(collections[0]);
|
||||
if (
|
||||
name === "name" &&
|
||||
folders === "folders" &&
|
||||
requests === "requests"
|
||||
) {
|
||||
let [name, folders, requests] = Object.keys(collections[0])
|
||||
if (name === 'name' && folders === 'folders' && requests === 'requests') {
|
||||
// Do nothing
|
||||
}
|
||||
} else if (
|
||||
collections.info &&
|
||||
collections.info.schema.includes("v2.1.0")
|
||||
) {
|
||||
collections = this.parsePostmanCollection(collections);
|
||||
} else if (collections.info && collections.info.schema.includes('v2.1.0')) {
|
||||
collections = this.parsePostmanCollection(collections)
|
||||
} else {
|
||||
return this.failedImport();
|
||||
return this.failedImport()
|
||||
}
|
||||
this.$store.commit("postwoman/importCollections", collections);
|
||||
this.fileImported();
|
||||
};
|
||||
reader.readAsText(this.$refs.inputChooseFileToReplaceWith.files[0]);
|
||||
this.$store.commit('postwoman/importCollections', collections)
|
||||
this.fileImported()
|
||||
}
|
||||
reader.readAsText(this.$refs.inputChooseFileToReplaceWith.files[0])
|
||||
},
|
||||
importFromJSON() {
|
||||
let reader = new FileReader();
|
||||
let reader = new FileReader()
|
||||
reader.onload = event => {
|
||||
let content = event.target.result;
|
||||
let collections = JSON.parse(content);
|
||||
let content = event.target.result
|
||||
let collections = JSON.parse(content)
|
||||
if (collections[0]) {
|
||||
let [name, folders, requests] = Object.keys(collections[0]);
|
||||
if (
|
||||
name === "name" &&
|
||||
folders === "folders" &&
|
||||
requests === "requests"
|
||||
) {
|
||||
let [name, folders, requests] = Object.keys(collections[0])
|
||||
if (name === 'name' && folders === 'folders' && requests === 'requests') {
|
||||
// Do nothing
|
||||
}
|
||||
} else if (
|
||||
collections.info &&
|
||||
collections.info.schema.includes("v2.1.0")
|
||||
) {
|
||||
collections = this.parsePostmanCollection(collections);
|
||||
} else if (collections.info && collections.info.schema.includes('v2.1.0')) {
|
||||
collections = this.parsePostmanCollection(collections)
|
||||
} else {
|
||||
return this.failedImport();
|
||||
return this.failedImport()
|
||||
}
|
||||
this.$store.commit("postwoman/importCollections", collections);
|
||||
this.fileImported();
|
||||
};
|
||||
reader.readAsText(this.$refs.inputChooseFileToImportFrom.files[0]);
|
||||
this.$store.commit('postwoman/importCollections', collections)
|
||||
this.fileImported()
|
||||
}
|
||||
reader.readAsText(this.$refs.inputChooseFileToImportFrom.files[0])
|
||||
},
|
||||
exportJSON() {
|
||||
let text = this.collectionJson;
|
||||
text = text.replace(/\n/g, "\r\n");
|
||||
let text = this.collectionJson
|
||||
text = text.replace(/\n/g, '\r\n')
|
||||
let blob = new Blob([text], {
|
||||
type: "text/json"
|
||||
});
|
||||
let anchor = document.createElement("a");
|
||||
anchor.download = "postwoman-collection.json";
|
||||
anchor.href = window.URL.createObjectURL(blob);
|
||||
anchor.target = "_blank";
|
||||
anchor.style.display = "none";
|
||||
document.body.appendChild(anchor);
|
||||
anchor.click();
|
||||
document.body.removeChild(anchor);
|
||||
this.$toast.success(this.$t("download_started"), {
|
||||
icon: "done"
|
||||
});
|
||||
type: 'text/json',
|
||||
})
|
||||
let anchor = document.createElement('a')
|
||||
anchor.download = 'postwoman-collection.json'
|
||||
anchor.href = window.URL.createObjectURL(blob)
|
||||
anchor.target = '_blank'
|
||||
anchor.style.display = 'none'
|
||||
document.body.appendChild(anchor)
|
||||
anchor.click()
|
||||
document.body.removeChild(anchor)
|
||||
this.$toast.success(this.$t('download_started'), {
|
||||
icon: 'done',
|
||||
})
|
||||
},
|
||||
syncCollections() {
|
||||
this.$store.commit("postwoman/replaceCollections", fb.currentCollections);
|
||||
this.fileImported();
|
||||
this.$store.commit('postwoman/replaceCollections', fb.currentCollections)
|
||||
this.fileImported()
|
||||
},
|
||||
fileImported() {
|
||||
this.$toast.info(this.$t("file_imported"), {
|
||||
icon: "folder_shared"
|
||||
});
|
||||
this.$toast.info(this.$t('file_imported'), {
|
||||
icon: 'folder_shared',
|
||||
})
|
||||
},
|
||||
failedImport() {
|
||||
this.$toast.error(this.$t("import_failed"), {
|
||||
icon: "error"
|
||||
});
|
||||
this.$toast.error(this.$t('import_failed'), {
|
||||
icon: 'error',
|
||||
})
|
||||
},
|
||||
parsePostmanCollection(collection, folders = true) {
|
||||
let postwomanCollection = folders
|
||||
? [
|
||||
{
|
||||
name: "",
|
||||
name: '',
|
||||
folders: [],
|
||||
requests: []
|
||||
}
|
||||
requests: [],
|
||||
},
|
||||
]
|
||||
: {
|
||||
name: "",
|
||||
requests: []
|
||||
};
|
||||
name: '',
|
||||
requests: [],
|
||||
}
|
||||
for (let collectionItem of collection.item) {
|
||||
if (collectionItem.request) {
|
||||
if (postwomanCollection[0]) {
|
||||
postwomanCollection[0].name = collection.info
|
||||
? collection.info.name
|
||||
: "";
|
||||
postwomanCollection[0].requests.push(
|
||||
this.parsePostmanRequest(collectionItem)
|
||||
);
|
||||
postwomanCollection[0].name = collection.info ? collection.info.name : ''
|
||||
postwomanCollection[0].requests.push(this.parsePostmanRequest(collectionItem))
|
||||
} else {
|
||||
postwomanCollection.name = collection.name ? collection.name : "";
|
||||
postwomanCollection.requests.push(
|
||||
this.parsePostmanRequest(collectionItem)
|
||||
);
|
||||
postwomanCollection.name = collection.name ? collection.name : ''
|
||||
postwomanCollection.requests.push(this.parsePostmanRequest(collectionItem))
|
||||
}
|
||||
} else if (collectionItem.item) {
|
||||
if (collectionItem.item[0]) {
|
||||
postwomanCollection[0].folders.push(
|
||||
this.parsePostmanCollection(collectionItem, false)
|
||||
);
|
||||
postwomanCollection[0].folders.push(this.parsePostmanCollection(collectionItem, false))
|
||||
}
|
||||
}
|
||||
}
|
||||
return postwomanCollection;
|
||||
return postwomanCollection
|
||||
},
|
||||
parsePostmanRequest(requestObject) {
|
||||
let pwRequest = {
|
||||
url: "",
|
||||
path: "",
|
||||
method: "",
|
||||
auth: "",
|
||||
httpUser: "",
|
||||
httpPassword: "",
|
||||
passwordFieldType: "password",
|
||||
bearerToken: "",
|
||||
url: '',
|
||||
path: '',
|
||||
method: '',
|
||||
auth: '',
|
||||
httpUser: '',
|
||||
httpPassword: '',
|
||||
passwordFieldType: 'password',
|
||||
bearerToken: '',
|
||||
headers: [],
|
||||
params: [],
|
||||
bodyParams: [],
|
||||
rawParams: "",
|
||||
rawParams: '',
|
||||
rawInput: false,
|
||||
contentType: "",
|
||||
requestType: "",
|
||||
name: ""
|
||||
};
|
||||
contentType: '',
|
||||
requestType: '',
|
||||
name: '',
|
||||
}
|
||||
|
||||
pwRequest.name = requestObject.name;
|
||||
pwRequest.name = requestObject.name
|
||||
let requestObjectUrl = requestObject.request.url.raw.match(
|
||||
/^(.+:\/\/[^\/]+|{[^\/]+})(\/[^\?]+|).*$/
|
||||
);
|
||||
pwRequest.url = requestObjectUrl[1];
|
||||
pwRequest.path = requestObjectUrl[2] ? requestObjectUrl[2] : "";
|
||||
pwRequest.method = requestObject.request.method;
|
||||
let itemAuth = requestObject.request.auth
|
||||
? requestObject.request.auth
|
||||
: "";
|
||||
let authType = itemAuth ? itemAuth.type : "";
|
||||
if (authType === "basic") {
|
||||
pwRequest.auth = "Basic Auth";
|
||||
)
|
||||
pwRequest.url = requestObjectUrl[1]
|
||||
pwRequest.path = requestObjectUrl[2] ? requestObjectUrl[2] : ''
|
||||
pwRequest.method = requestObject.request.method
|
||||
let itemAuth = requestObject.request.auth ? requestObject.request.auth : ''
|
||||
let authType = itemAuth ? itemAuth.type : ''
|
||||
if (authType === 'basic') {
|
||||
pwRequest.auth = 'Basic Auth'
|
||||
pwRequest.httpUser =
|
||||
itemAuth.basic[0].key === "username"
|
||||
? itemAuth.basic[0].value
|
||||
: itemAuth.basic[1].value;
|
||||
itemAuth.basic[0].key === 'username' ? itemAuth.basic[0].value : itemAuth.basic[1].value
|
||||
pwRequest.httpPassword =
|
||||
itemAuth.basic[0].key === "password"
|
||||
? itemAuth.basic[0].value
|
||||
: itemAuth.basic[1].value;
|
||||
} else if (authType === "oauth2") {
|
||||
pwRequest.auth = "OAuth 2.0";
|
||||
itemAuth.basic[0].key === 'password' ? itemAuth.basic[0].value : itemAuth.basic[1].value
|
||||
} else if (authType === 'oauth2') {
|
||||
pwRequest.auth = 'OAuth 2.0'
|
||||
pwRequest.bearerToken =
|
||||
itemAuth.oauth2[0].key === "accessToken"
|
||||
itemAuth.oauth2[0].key === 'accessToken'
|
||||
? itemAuth.oauth2[0].value
|
||||
: itemAuth.oauth2[1].value;
|
||||
} else if (authType === "bearer") {
|
||||
pwRequest.auth = "Bearer Token";
|
||||
pwRequest.bearerToken = itemAuth.bearer[0].value;
|
||||
: itemAuth.oauth2[1].value
|
||||
} else if (authType === 'bearer') {
|
||||
pwRequest.auth = 'Bearer Token'
|
||||
pwRequest.bearerToken = itemAuth.bearer[0].value
|
||||
}
|
||||
let requestObjectHeaders = requestObject.request.header;
|
||||
let requestObjectHeaders = requestObject.request.header
|
||||
if (requestObjectHeaders) {
|
||||
pwRequest.headers = requestObjectHeaders;
|
||||
pwRequest.headers = requestObjectHeaders
|
||||
for (let header of pwRequest.headers) {
|
||||
delete header.name;
|
||||
delete header.type;
|
||||
delete header.name
|
||||
delete header.type
|
||||
}
|
||||
}
|
||||
let requestObjectParams = requestObject.request.url.query;
|
||||
let requestObjectParams = requestObject.request.url.query
|
||||
if (requestObjectParams) {
|
||||
pwRequest.params = requestObjectParams;
|
||||
pwRequest.params = requestObjectParams
|
||||
for (let param of pwRequest.params) {
|
||||
delete param.disabled;
|
||||
delete param.disabled
|
||||
}
|
||||
}
|
||||
if (requestObject.request.body) {
|
||||
if (requestObject.request.body.mode === "urlencoded") {
|
||||
let params = requestObject.request.body.urlencoded;
|
||||
pwRequest.bodyParams = params ? params : [];
|
||||
if (requestObject.request.body.mode === 'urlencoded') {
|
||||
let params = requestObject.request.body.urlencoded
|
||||
pwRequest.bodyParams = params ? params : []
|
||||
for (let param of pwRequest.bodyParams) {
|
||||
delete param.type;
|
||||
delete param.type
|
||||
}
|
||||
} else if (requestObject.request.body.mode === "raw") {
|
||||
pwRequest.rawInput = true;
|
||||
pwRequest.rawParams = requestObject.request.body.raw;
|
||||
} else if (requestObject.request.body.mode === 'raw') {
|
||||
pwRequest.rawInput = true
|
||||
pwRequest.rawParams = requestObject.request.body.raw
|
||||
}
|
||||
}
|
||||
return pwRequest;
|
||||
}
|
||||
}
|
||||
};
|
||||
return pwRequest
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -43,12 +43,12 @@ TODO:
|
||||
<div>
|
||||
<button class="icon" @click="displayModalAdd(true)">
|
||||
<i class="material-icons">add</i>
|
||||
<span>{{ $t("new") }}</span>
|
||||
<span>{{ $t('new') }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<button class="icon" @click="displayModalImportExport(true)">
|
||||
{{ $t("import_export") }}
|
||||
{{ $t('import_export') }}
|
||||
</button>
|
||||
<!-- <a
|
||||
href="https://github.com/liyasthomas/postwoman/wiki/Collections"
|
||||
@@ -89,7 +89,7 @@ TODO:
|
||||
<nuxt-link :to="localePath('doc')" :aria-label="$t('documentation')">
|
||||
<button class="icon">
|
||||
<i class="material-icons">books</i>
|
||||
<span>{{ $t("generate_docs") }}</span>
|
||||
<span>{{ $t('generate_docs') }}</span>
|
||||
</button>
|
||||
</nuxt-link>
|
||||
</pw-section>
|
||||
@@ -107,20 +107,20 @@ ul {
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import collection from "./collection";
|
||||
import { fb } from "../../functions/fb";
|
||||
import collection from './collection'
|
||||
import { fb } from '../../functions/fb'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
collection,
|
||||
"pw-section": () => import("../section"),
|
||||
addCollection: () => import("./addCollection"),
|
||||
addFolder: () => import("./addFolder"),
|
||||
editCollection: () => import("./editCollection"),
|
||||
editFolder: () => import("./editFolder"),
|
||||
editRequest: () => import("./editRequest"),
|
||||
importExportCollections: () => import("./importExportCollections"),
|
||||
VirtualList: () => import("vue-virtual-scroll-list")
|
||||
'pw-section': () => import('../section'),
|
||||
addCollection: () => import('./addCollection'),
|
||||
addFolder: () => import('./addFolder'),
|
||||
editCollection: () => import('./editCollection'),
|
||||
editFolder: () => import('./editFolder'),
|
||||
editRequest: () => import('./editRequest'),
|
||||
importExportCollections: () => import('./importExportCollections'),
|
||||
VirtualList: () => import('vue-virtual-scroll-list'),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@@ -135,100 +135,98 @@ export default {
|
||||
editingFolder: undefined,
|
||||
editingFolderIndex: undefined,
|
||||
editingRequest: undefined,
|
||||
editingRequestIndex: undefined
|
||||
};
|
||||
editingRequestIndex: undefined,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
collections() {
|
||||
return this.$store.state.postwoman.collections;
|
||||
}
|
||||
return this.$store.state.postwoman.collections
|
||||
},
|
||||
},
|
||||
async mounted() {
|
||||
this._keyListener = function(e) {
|
||||
if (e.key === "Escape") {
|
||||
e.preventDefault();
|
||||
this.showModalAdd = this.showModalEdit = this.showModalImportExport = this.showModalAddFolder = this.showModalEditFolder = this.showModalEditRequest = false;
|
||||
if (e.key === 'Escape') {
|
||||
e.preventDefault()
|
||||
this.showModalAdd = this.showModalEdit = this.showModalImportExport = this.showModalAddFolder = this.showModalEditFolder = this.showModalEditRequest = false
|
||||
}
|
||||
};
|
||||
document.addEventListener("keydown", this._keyListener.bind(this));
|
||||
}
|
||||
document.addEventListener('keydown', this._keyListener.bind(this))
|
||||
},
|
||||
methods: {
|
||||
displayModalAdd(shouldDisplay) {
|
||||
this.showModalAdd = shouldDisplay;
|
||||
this.showModalAdd = shouldDisplay
|
||||
},
|
||||
displayModalEdit(shouldDisplay) {
|
||||
this.showModalEdit = shouldDisplay;
|
||||
this.showModalEdit = shouldDisplay
|
||||
|
||||
if (!shouldDisplay) this.resetSelectedData();
|
||||
if (!shouldDisplay) this.resetSelectedData()
|
||||
},
|
||||
displayModalImportExport(shouldDisplay) {
|
||||
this.showModalImportExport = shouldDisplay;
|
||||
this.showModalImportExport = shouldDisplay
|
||||
},
|
||||
displayModalAddFolder(shouldDisplay) {
|
||||
this.showModalAddFolder = shouldDisplay;
|
||||
this.showModalAddFolder = shouldDisplay
|
||||
|
||||
if (!shouldDisplay) this.resetSelectedData();
|
||||
if (!shouldDisplay) this.resetSelectedData()
|
||||
},
|
||||
displayModalEditFolder(shouldDisplay) {
|
||||
this.showModalEditFolder = shouldDisplay;
|
||||
this.showModalEditFolder = shouldDisplay
|
||||
|
||||
if (!shouldDisplay) this.resetSelectedData();
|
||||
if (!shouldDisplay) this.resetSelectedData()
|
||||
},
|
||||
displayModalEditRequest(shouldDisplay) {
|
||||
this.showModalEditRequest = shouldDisplay;
|
||||
this.showModalEditRequest = shouldDisplay
|
||||
|
||||
if (!shouldDisplay) this.resetSelectedData();
|
||||
if (!shouldDisplay) this.resetSelectedData()
|
||||
},
|
||||
editCollection(collection, collectionIndex) {
|
||||
this.$data.editingCollection = collection;
|
||||
this.$data.editingCollectionIndex = collectionIndex;
|
||||
this.displayModalEdit(true);
|
||||
this.syncCollections();
|
||||
this.$data.editingCollection = collection
|
||||
this.$data.editingCollectionIndex = collectionIndex
|
||||
this.displayModalEdit(true)
|
||||
this.syncCollections()
|
||||
},
|
||||
addFolder(collection, collectionIndex) {
|
||||
this.$data.editingCollection = collection;
|
||||
this.$data.editingCollectionIndex = collectionIndex;
|
||||
this.displayModalAddFolder(true);
|
||||
this.syncCollections();
|
||||
this.$data.editingCollection = collection
|
||||
this.$data.editingCollectionIndex = collectionIndex
|
||||
this.displayModalAddFolder(true)
|
||||
this.syncCollections()
|
||||
},
|
||||
editFolder(payload) {
|
||||
const { collectionIndex, folder, folderIndex } = payload;
|
||||
this.$data.editingCollection = collection;
|
||||
this.$data.editingCollectionIndex = collectionIndex;
|
||||
this.$data.editingFolder = folder;
|
||||
this.$data.editingFolderIndex = folderIndex;
|
||||
this.displayModalEditFolder(true);
|
||||
this.syncCollections();
|
||||
const { collectionIndex, folder, folderIndex } = payload
|
||||
this.$data.editingCollection = collection
|
||||
this.$data.editingCollectionIndex = collectionIndex
|
||||
this.$data.editingFolder = folder
|
||||
this.$data.editingFolderIndex = folderIndex
|
||||
this.displayModalEditFolder(true)
|
||||
this.syncCollections()
|
||||
},
|
||||
editRequest(payload) {
|
||||
const { request, collectionIndex, folderIndex, requestIndex } = payload;
|
||||
this.$data.editingCollectionIndex = collectionIndex;
|
||||
this.$data.editingFolderIndex = folderIndex;
|
||||
this.$data.editingRequest = request;
|
||||
this.$data.editingRequestIndex = requestIndex;
|
||||
this.displayModalEditRequest(true);
|
||||
this.syncCollections();
|
||||
const { request, collectionIndex, folderIndex, requestIndex } = payload
|
||||
this.$data.editingCollectionIndex = collectionIndex
|
||||
this.$data.editingFolderIndex = folderIndex
|
||||
this.$data.editingRequest = request
|
||||
this.$data.editingRequestIndex = requestIndex
|
||||
this.displayModalEditRequest(true)
|
||||
this.syncCollections()
|
||||
},
|
||||
resetSelectedData() {
|
||||
this.$data.editingCollection = undefined;
|
||||
this.$data.editingCollectionIndex = undefined;
|
||||
this.$data.editingFolder = undefined;
|
||||
this.$data.editingFolderIndex = undefined;
|
||||
this.$data.editingRequest = undefined;
|
||||
this.$data.editingRequestIndex = undefined;
|
||||
this.$data.editingCollection = undefined
|
||||
this.$data.editingCollectionIndex = undefined
|
||||
this.$data.editingFolder = undefined
|
||||
this.$data.editingFolderIndex = undefined
|
||||
this.$data.editingRequest = undefined
|
||||
this.$data.editingRequestIndex = undefined
|
||||
},
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collections))
|
||||
);
|
||||
fb.writeCollections(JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)))
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
beforeDestroy() {
|
||||
document.removeEventListener("keydown", this._keyListener);
|
||||
}
|
||||
};
|
||||
document.removeEventListener('keydown', this._keyListener)
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -1,11 +1,7 @@
|
||||
<template>
|
||||
<div class="flex-wrap">
|
||||
<div>
|
||||
<button
|
||||
class="icon"
|
||||
@click="selectRequest()"
|
||||
v-tooltip="$t('use_request')"
|
||||
>
|
||||
<button class="icon" @click="selectRequest()" v-tooltip="$t('use_request')">
|
||||
<i class="material-icons">insert_drive_file</i>
|
||||
<span>{{ request.name }}</span>
|
||||
</button>
|
||||
@@ -18,13 +14,13 @@
|
||||
<div>
|
||||
<button class="icon" @click="$emit('edit-request')" v-close-popover>
|
||||
<i class="material-icons">edit</i>
|
||||
<span>{{ $t("edit") }}</span>
|
||||
<span>{{ $t('edit') }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<div>
|
||||
<button class="icon" @click="removeRequest" v-close-popover>
|
||||
<i class="material-icons">delete</i>
|
||||
<span>{{ $t("delete") }}</span>
|
||||
<span>{{ $t('delete') }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
@@ -51,20 +47,20 @@ export default {
|
||||
request: Object,
|
||||
collectionIndex: Number,
|
||||
folderIndex: Number,
|
||||
requestIndex: Number
|
||||
requestIndex: Number,
|
||||
},
|
||||
methods: {
|
||||
selectRequest() {
|
||||
this.$store.commit("postwoman/selectRequest", { request: this.request });
|
||||
this.$store.commit('postwoman/selectRequest', { request: this.request })
|
||||
},
|
||||
removeRequest() {
|
||||
if (!confirm("Are you sure you want to remove this request?")) return;
|
||||
this.$store.commit("postwoman/removeRequest", {
|
||||
if (!confirm('Are you sure you want to remove this request?')) return
|
||||
this.$store.commit('postwoman/removeRequest', {
|
||||
collectionIndex: this.collectionIndex,
|
||||
folderIndex: this.folderIndex,
|
||||
requestIndex: this.requestIndex
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
requestIndex: this.requestIndex,
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<ul>
|
||||
<li>
|
||||
<div class="flex-wrap">
|
||||
<h3 class="title">{{ $t("save_request_as") }}</h3>
|
||||
<h3 class="title">{{ $t('save_request_as') }}</h3>
|
||||
<div>
|
||||
<button class="icon" @click="hideModal">
|
||||
<i class="material-icons">close</i>
|
||||
@@ -17,7 +17,7 @@
|
||||
<div slot="body">
|
||||
<ul>
|
||||
<li>
|
||||
<label for="selectLabel">{{ $t("label") }}</label>
|
||||
<label for="selectLabel">{{ $t('label') }}</label>
|
||||
<input
|
||||
type="text"
|
||||
id="selectLabel"
|
||||
@@ -25,24 +25,14 @@
|
||||
:placeholder="defaultRequestName"
|
||||
@keyup.enter="saveRequestAs"
|
||||
/>
|
||||
<label for="selectCollection">{{ $t("collection") }}</label>
|
||||
<label for="selectCollection">{{ $t('collection') }}</label>
|
||||
<span class="select-wrapper">
|
||||
<select
|
||||
type="text"
|
||||
id="selectCollection"
|
||||
v-model="requestData.collectionIndex"
|
||||
>
|
||||
<select type="text" id="selectCollection" v-model="requestData.collectionIndex">
|
||||
<option :key="undefined" :value="undefined" hidden disabled selected>{{
|
||||
$t('select_collection')
|
||||
}}</option>
|
||||
<option
|
||||
:key="undefined"
|
||||
:value="undefined"
|
||||
hidden
|
||||
disabled
|
||||
selected
|
||||
>{{ $t("select_collection") }}</option
|
||||
>
|
||||
<option
|
||||
v-for="(collection, index) in $store.state.postwoman
|
||||
.collections"
|
||||
v-for="(collection, index) in $store.state.postwoman.collections"
|
||||
:key="index"
|
||||
:value="index"
|
||||
>
|
||||
@@ -50,36 +40,20 @@
|
||||
</option>
|
||||
</select>
|
||||
</span>
|
||||
<label for="selectFolder">{{ $t("folder") }}</label>
|
||||
<label for="selectFolder">{{ $t('folder') }}</label>
|
||||
<span class="select-wrapper">
|
||||
<select
|
||||
type="text"
|
||||
id="selectFolder"
|
||||
v-model="requestData.folderIndex"
|
||||
>
|
||||
<select type="text" id="selectFolder" v-model="requestData.folderIndex">
|
||||
<option :key="undefined" :value="undefined">/</option>
|
||||
<option
|
||||
v-for="(folder, index) in folders"
|
||||
:key="index"
|
||||
:value="index"
|
||||
>
|
||||
<option v-for="(folder, index) in folders" :key="index" :value="index">
|
||||
{{ folder.name }}
|
||||
</option>
|
||||
</select>
|
||||
</span>
|
||||
<label for="selectRequest">{{ $t("request") }}</label>
|
||||
<label for="selectRequest">{{ $t('request') }}</label>
|
||||
<span class="select-wrapper">
|
||||
<select
|
||||
type="text"
|
||||
id="selectRequest"
|
||||
v-model="requestData.requestIndex"
|
||||
>
|
||||
<select type="text" id="selectRequest" v-model="requestData.requestIndex">
|
||||
<option :key="undefined" :value="undefined">/</option>
|
||||
<option
|
||||
v-for="(folder, index) in requests"
|
||||
:key="index"
|
||||
:value="index"
|
||||
>
|
||||
<option v-for="(folder, index) in requests" :key="index" :value="index">
|
||||
{{ folder.name }}
|
||||
</option>
|
||||
</select>
|
||||
@@ -92,10 +66,10 @@
|
||||
<span></span>
|
||||
<span>
|
||||
<button class="icon" @click="hideModal">
|
||||
{{ $t("cancel") }}
|
||||
{{ $t('cancel') }}
|
||||
</button>
|
||||
<button class="icon primary" @click="saveRequestAs">
|
||||
{{ $t("save") }}
|
||||
{{ $t('save') }}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
@@ -104,123 +78,113 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fb } from "../../functions/fb";
|
||||
import { fb } from '../../functions/fb'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
show: Boolean,
|
||||
editingRequest: Object
|
||||
editingRequest: Object,
|
||||
},
|
||||
components: {
|
||||
modal: () => import("../../components/modal")
|
||||
modal: () => import('../../components/modal'),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
defaultRequestName: "My Request",
|
||||
defaultRequestName: 'My Request',
|
||||
requestData: {
|
||||
name: undefined,
|
||||
collectionIndex: undefined,
|
||||
folderIndex: undefined,
|
||||
requestIndex: undefined
|
||||
}
|
||||
};
|
||||
requestIndex: undefined,
|
||||
},
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
"requestData.collectionIndex": function resetFolderAndRequestIndex() {
|
||||
'requestData.collectionIndex': function resetFolderAndRequestIndex() {
|
||||
// if user choosen some folder, than selected other collection, which doesn't have any folders
|
||||
// than `requestUpdateData.folderIndex` won't be reseted
|
||||
this.$data.requestData.folderIndex = undefined;
|
||||
this.$data.requestData.requestIndex = undefined;
|
||||
this.$data.requestData.folderIndex = undefined
|
||||
this.$data.requestData.requestIndex = undefined
|
||||
},
|
||||
'requestData.folderIndex': function resetRequestIndex() {
|
||||
this.$data.requestData.requestIndex = undefined
|
||||
},
|
||||
"requestData.folderIndex": function resetRequestIndex() {
|
||||
this.$data.requestData.requestIndex = undefined;
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
folders() {
|
||||
const userSelectedAnyCollection =
|
||||
this.$data.requestData.collectionIndex !== undefined;
|
||||
if (!userSelectedAnyCollection) return [];
|
||||
const userSelectedAnyCollection = this.$data.requestData.collectionIndex !== undefined
|
||||
if (!userSelectedAnyCollection) return []
|
||||
|
||||
const noCollectionAvailable =
|
||||
this.$store.state.postwoman.collections[
|
||||
this.$data.requestData.collectionIndex
|
||||
] !== undefined;
|
||||
if (!noCollectionAvailable) return [];
|
||||
this.$store.state.postwoman.collections[this.$data.requestData.collectionIndex] !==
|
||||
undefined
|
||||
if (!noCollectionAvailable) return []
|
||||
|
||||
return this.$store.state.postwoman.collections[
|
||||
this.$data.requestData.collectionIndex
|
||||
].folders;
|
||||
return this.$store.state.postwoman.collections[this.$data.requestData.collectionIndex].folders
|
||||
},
|
||||
requests() {
|
||||
const userSelectedAnyCollection =
|
||||
this.$data.requestData.collectionIndex !== undefined;
|
||||
if (!userSelectedAnyCollection) return [];
|
||||
const userSelectedAnyCollection = this.$data.requestData.collectionIndex !== undefined
|
||||
if (!userSelectedAnyCollection) return []
|
||||
|
||||
const userSelectedAnyFolder =
|
||||
this.$data.requestData.folderIndex !== undefined;
|
||||
const userSelectedAnyFolder = this.$data.requestData.folderIndex !== undefined
|
||||
if (userSelectedAnyFolder) {
|
||||
const collection = this.$store.state.postwoman.collections[
|
||||
this.$data.requestData.collectionIndex
|
||||
];
|
||||
const folder = collection.folders[this.$data.requestData.folderIndex];
|
||||
const requests = folder.requests;
|
||||
return requests;
|
||||
]
|
||||
const folder = collection.folders[this.$data.requestData.folderIndex]
|
||||
const requests = folder.requests
|
||||
return requests
|
||||
} else {
|
||||
const collection = this.$store.state.postwoman.collections[
|
||||
this.$data.requestData.collectionIndex
|
||||
];
|
||||
]
|
||||
const noCollectionAvailable =
|
||||
this.$store.state.postwoman.collections[
|
||||
this.$data.requestData.collectionIndex
|
||||
] !== undefined;
|
||||
if (!noCollectionAvailable) return [];
|
||||
this.$store.state.postwoman.collections[this.$data.requestData.collectionIndex] !==
|
||||
undefined
|
||||
if (!noCollectionAvailable) return []
|
||||
|
||||
const requests = collection.requests;
|
||||
return requests;
|
||||
const requests = collection.requests
|
||||
return requests
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
syncCollections() {
|
||||
if (fb.currentUser !== null) {
|
||||
if (fb.currentSettings[0].value) {
|
||||
fb.writeCollections(
|
||||
JSON.parse(JSON.stringify(this.$store.state.postwoman.collections))
|
||||
);
|
||||
fb.writeCollections(JSON.parse(JSON.stringify(this.$store.state.postwoman.collections)))
|
||||
}
|
||||
}
|
||||
},
|
||||
saveRequestAs() {
|
||||
const userDidntSpecifyCollection =
|
||||
this.$data.requestData.collectionIndex === undefined;
|
||||
const userDidntSpecifyCollection = this.$data.requestData.collectionIndex === undefined
|
||||
if (userDidntSpecifyCollection) {
|
||||
this.$toast.error(this.$t("select_collection"), {
|
||||
icon: "error"
|
||||
});
|
||||
return;
|
||||
this.$toast.error(this.$t('select_collection'), {
|
||||
icon: 'error',
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
const requestUpdated = {
|
||||
...this.$props.editingRequest,
|
||||
name: this.$data.requestData.name || this.$data.defaultRequestName,
|
||||
collection: this.$data.requestData.collectionIndex
|
||||
};
|
||||
collection: this.$data.requestData.collectionIndex,
|
||||
}
|
||||
|
||||
this.$store.commit("postwoman/saveRequestAs", {
|
||||
this.$store.commit('postwoman/saveRequestAs', {
|
||||
request: requestUpdated,
|
||||
collectionIndex: this.$data.requestData.collectionIndex,
|
||||
folderIndex: this.$data.requestData.folderIndex,
|
||||
requestIndex: this.$data.requestData.requestIndex
|
||||
});
|
||||
requestIndex: this.$data.requestData.requestIndex,
|
||||
})
|
||||
|
||||
this.hideModal();
|
||||
this.syncCollections();
|
||||
this.hideModal()
|
||||
this.syncCollections()
|
||||
},
|
||||
hideModal() {
|
||||
this.$emit("hide-modal");
|
||||
this.$emit("hide-model"); // for backward compatibility // TODO: use fixed event
|
||||
}
|
||||
}
|
||||
};
|
||||
this.$emit('hide-modal')
|
||||
this.$emit('hide-model') // for backward compatibility // TODO: use fixed event
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user