diff --git a/package-lock.json b/package-lock.json index ed5c6e3bc..02259171a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10139,12 +10139,12 @@ "integrity": "sha512-ER5moSbLZuNSMBFnEBVGhQ1uCBNJslH9W/Dw2W7GZN23UQA69uapP5GTT9Vm8Trc0PzBSVt6LzF3hGjmv41xcg==" }, "vuex-persist": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/vuex-persist/-/vuex-persist-2.0.1.tgz", - "integrity": "sha512-V3WSBYmxcAP6ei0VVt2lxGloeWJZgk1Ao4r+iOxLMhAv+UYIK91qbjwvqk6Xr3tAi052jzSwn8aoamtuz8ArsQ==", + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/vuex-persist/-/vuex-persist-2.1.0.tgz", + "integrity": "sha512-H9RqXHeynBQG60rUrsinYNLoRFXkSxh2Xx8kTVFuvLRQ9jZd3HLMvm713m2r1dN/pVZBUgiIzTu6uj5hBsAOqg==", "requires": { "flatted": "^2.0.0", - "lodash.merge": "^4.6.1" + "lodash.merge": "^4.6.2" } }, "watchpack": { diff --git a/package.json b/package.json index 504627fc6..38aa43656 100644 --- a/package.json +++ b/package.json @@ -19,7 +19,7 @@ "nuxt": "^2.9.2", "vue-virtual-scroll-list": "^1.4.2", "vuejs-auto-complete": "^0.9.0", - "vuex-persist": "^2.0.1" + "vuex-persist": "^2.1.0" }, "devDependencies": { "node-sass": "^4.12.0", diff --git a/pages/index.vue b/pages/index.vue index bcaabfbb1..3863711a3 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -275,14 +275,14 @@ }, previewEnabled: false, - /** - * These are content types that can be automatically - * serialized by postwoman. - */ - knownContentTypes: [ - 'application/json', - 'application/x-www-form-urlencoded' - ], + /** + * These are content types that can be automatically + * serialized by postwoman. + */ + knownContentTypes: [ + 'application/json', + 'application/x-www-form-urlencoded' + ], /** * These are a list of Content Types known to Postwoman. @@ -298,8 +298,8 @@ } }, watch: { - contentType (val) { - this.rawInput = !this.knownContentTypes.includes(val); + contentType(val) { + this.rawInput = !this.knownContentTypes.includes(val); } }, computed: { @@ -321,7 +321,7 @@ } = this if (this.contentType === 'application/json') { try { - const obj = JSON.parse(`{${bodyParams.filter(({ key }) => !!key).map(({ key, value }) => ` + const obj = JSON.parse(`{${bodyParams.filter(({key}) => !!key).map(({key, value}) => ` "${key}": "${value}" `).join()}}`) return JSON.stringify(obj) @@ -561,9 +561,23 @@ } } }, + setRouteQueryState() { + const flat = key => this[key] !== '' ? `${key}=${this[key]}&` : '' + const deep = key => { + const haveItems = [...this[key]].length + if (haveItems && this[key]['value'] !== '') { + return `${key}=${JSON.stringify(this[key])}&` + } else return '' + } + let flats = ['method', 'url', 'path', 'auth', 'httpUser', 'httpPassword', 'bearerToken', 'contentType'].map(item => flat(item)) + let deeps = ['headers', 'params', 'bodyParams'].map(item => deep(item)) + this.$router.replace('/?' + flats.concat(deeps).join('').slice(0, -1)) + }, setRouteQueries(queries) { + if (typeof (queries) !== 'object') throw new Error('Route query parameters must be a Object') for (const key in queries) { - if (this[key]) this[key] = queries[key]; + if (key === 'headers' || key === 'params' || key === 'bodyParams') this[key] = JSON.parse(queries[key]) + else if (typeof (this[key]) === 'string') this[key] = queries[key]; } }, observeRequestButton() { @@ -573,16 +587,32 @@ entries.forEach(entry => { sendButtonElement.classList.toggle('show'); }); - }, { threshold: 1 }); + }, {threshold: 1}); observer.observe(requestElement); } }, - created() { - if (Object.keys(this.$route.query).length) this.setRouteQueries(this.$route.query); - }, mounted() { this.observeRequestButton(); + }, + created() { + if (Object.keys(this.$route.query).length) this.setRouteQueries(this.$route.query); + this.$watch(vm => [ + vm.method, + vm.url, + vm.auth, + vm.path, + vm.httpUser, + vm.httpPassword, + vm.bearerToken, + vm.headers, + vm.params, + vm.bodyParams, + vm.contentType + ], val => { + this.setRouteQueryState() + }) + } }