From 72e4cd9fb35ad437436826dbf67c03fe87533910 Mon Sep 17 00:00:00 2001 From: RuoYi <yzz_ivy@163.com> Date: 星期三, 29 十一月 2023 12:40:47 +0800 Subject: [PATCH] 优化字典标签支持自定义分隔符 --- ruoyi-ui/src/components/DictTag/index.vue | 49 +++++++++++++++++++++++-------------------------- 1 files changed, 23 insertions(+), 26 deletions(-) diff --git a/ruoyi-ui/src/components/DictTag/index.vue b/ruoyi-ui/src/components/DictTag/index.vue index 1ef13b9..6b5b230 100644 --- a/ruoyi-ui/src/components/DictTag/index.vue +++ b/ruoyi-ui/src/components/DictTag/index.vue @@ -7,7 +7,7 @@ :key="item.value" :index="index" :class="item.raw.cssClass" - >{{ item.label + " " }}</span + >{{ item.label + ' ' }}</span > <el-tag v-else @@ -17,7 +17,7 @@ :type="item.raw.listClass == 'primary' ? '' : item.raw.listClass" :class="item.raw.cssClass" > - {{ item.label + " " }} + {{ item.label + ' ' }} </el-tag> </template> </template> @@ -40,6 +40,10 @@ showValue: { type: Boolean, default: true, + }, + separator: { + type: String, + default: "," } }, data() { @@ -49,39 +53,32 @@ }, computed: { values() { - if (this.value !== null && typeof this.value !== "undefined") { - return Array.isArray(this.value) ? this.value : [String(this.value)]; - } else { - return []; - } + if (this.value === null || typeof this.value === 'undefined' || this.value === '') return [] + return Array.isArray(this.value) ? this.value.map(item => '' + item) : String(this.value).split(this.separator) }, unmatch() { - this.unmatchArray = []; - if (this.value !== null && typeof this.value !== "undefined") { - // 传入值为非数组 - if (!Array.isArray(this.value)) { - if (this.options.some((v) => v.value == this.value)) return false; - this.unmatchArray.push(this.value); - return true; - } - // 传入值为Array - this.value.forEach((item) => { - if (!this.options.some((v) => v.value == item)) - this.unmatchArray.push(item); - }); - return true; - } + this.unmatchArray = [] // 没有value不显示 - return false; + if (this.value === null || typeof this.value === 'undefined' || this.value === '' || this.options.length === 0) return false + // 传入值为数组 + let unmatch = false // 添加一个标志来判断是否有未匹配项 + this.values.forEach(item => { + if (!this.options.some(v => v.value === item)) { + this.unmatchArray.push(item) + unmatch = true // 如果有未匹配项,将标志设置为true + } + }) + return unmatch // 返回标志的值 }, + }, filters: { handleArray(array) { - if (array.length === 0) return ""; + if (array.length === 0) return ''; return array.reduce((pre, cur) => { - return pre + " " + cur; + return pre + ' ' + cur; }) - } + }, } }; </script> -- Gitblit v1.9.2