diff --git a/src/components/ListTable/index.vue b/src/components/ListTable/index.vue index 626e65ec2..e79d69d10 100644 --- a/src/components/ListTable/index.vue +++ b/src/components/ListTable/index.vue @@ -91,7 +91,7 @@ export default { }, search(attrs) { this.$emit('TagSearch', attrs) - return this.dataTable.search(attrs, true) + return this.dataTable?.search(attrs, true) }, filter(attrs) { this.$emit('TagFilter', attrs) diff --git a/src/components/TagSearch/index.vue b/src/components/TagSearch/index.vue index 7f12806a9..6850fe3fc 100644 --- a/src/components/TagSearch/index.vue +++ b/src/components/TagSearch/index.vue @@ -100,6 +100,25 @@ export default { // }, // deep: true // } + options: { + handler(val) { + if (val && val.length > 0) { + const routeFilter = this.checkInTableColumns() + const asFilterTags = _.cloneDeep(this.filterTags) + this.filterTags = { + ...asFilterTags, + ...routeFilter + } + if (Object.keys(routeFilter).length > 0) { + setTimeout(() => { + return this.$emit('tagSearch', this.filterMaps) + }, 490) + } + } + }, + immediate: true, + deep: true + } }, mounted() { setTimeout(() => { @@ -111,6 +130,39 @@ export default { // this.$nextTick(() => this.$emit('tagSearch', this.filterMaps)) }, methods: { + // 判断url中的查询条件 + checkInTableColumns() { + const routeQuery = this.$route?.query + const routeQueryKeys = Object.keys(routeQuery) + const keys = {} + if (routeQueryKeys.length < 1) return keys + if (routeQueryKeys.length > 0) { + for (let i = 0; i < routeQueryKeys.length; i++) { + const key = routeQueryKeys[i] + const valueDecode = decodeURI(routeQuery[key]) + const isSearch = key !== 'search' + for (let k = 0, len = this.options.length; k < len; k++) { + const cur = this.options[k] + if (key === cur.value || !isSearch) { + const curChildren = cur.children || [] + keys[key] = { + key, + label: isSearch ? cur.label : '', + value: valueDecode + } + if (isSearch && curChildren.length > 0) { + curChildren.forEach(item => { + if (valueDecode === item.value) { + keys[key].valueLabel = item.label + } + }) + } + } + } + } + } + return keys + }, getValueLabel(key, value) { for (const field of this.options) { if (field.value !== key) { @@ -143,6 +195,7 @@ export default { this.$nextTick(() => this.$refs.Cascade.handleClear()) }, handleTagClose(evt) { + this.checkUrlFilds(evt) this.$delete(this.filterTags, evt) this.$emit('tagSearch', this.filterMaps) return true @@ -154,6 +207,11 @@ export default { const tag = { key: this.filterKey, label: this.keyLabel, value: this.filterValue, valueLabel: this.valueLabel } this.$set(this.filterTags, this.filterKey, tag) this.$emit('tagSearch', this.filterMaps) + + let newQuery = _.cloneDeep(this.$route.query) + newQuery = { ...newQuery, [this.filterKey]: encodeURI(this.filterValue) } + this.$router.replace({ query: newQuery }) + this.filterKey = '' this.filterValue = '' this.valueLabel = '' @@ -180,6 +238,11 @@ export default { this.filterKey = v.key this.filterValue = v.value this.$refs.SearchInput.focus() + }, + // 删除查询条件时改变url + checkUrlFilds(evt) { + const newQuery = _.omit(this.$route.query, evt) + this.$router.replace({ query: newQuery }) } } }