From 14538ce399667e659419f393ea159efc91ff8dee Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=8A=93=E8=9B=99=E5=B8=88?= <770492966@qq.com>
Date: Fri, 8 Sep 2023 18:35:17 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=AD=97=E5=85=B8=E6=A0=87?=
 =?UTF-8?q?=E7=AD=BE=E6=94=AF=E6=8C=81=E6=95=B0=E7=BB=84=E5=92=8C=E5=A4=9A?=
 =?UTF-8?q?=E6=A0=87=E7=AD=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/DictTag/index.vue  | 57 ++++++++++++++-----------------
 src/views/system/client/index.vue |  6 +---
 2 files changed, 26 insertions(+), 37 deletions(-)

diff --git a/src/components/DictTag/index.vue b/src/components/DictTag/index.vue
index 08aef21..0fe0581 100644
--- a/src/components/DictTag/index.vue
+++ b/src/components/DictTag/index.vue
@@ -2,7 +2,8 @@
   <div>
     <template v-for="(item, index) in options">
       <template v-if="values.includes(item.value)">
-        <span v-if="item.elTagType == 'default' || item.elTagType == ''" :key="item.value" :index="index" :class="item.elTagClass">
+        <span v-if="item.elTagType == 'default' || item.elTagType == ''" :key="item.value" :index="index"
+              :class="item.elTagClass">
           {{ item.label + " " }}
         </span>
         <el-tag
@@ -24,7 +25,7 @@
 </template>
 
 <script setup lang="ts">
-import { propTypes } from '@/utils/propTypes';
+import {propTypes} from '@/utils/propTypes';
 
 
 const props = defineProps({
@@ -37,46 +38,38 @@ const props = defineProps({
   value: [Number, String, Array] as PropType<number | string | Array<number | string>>,
   // 当未找到匹配的数据时，显示value
   showValue: propTypes.bool.def(true),
-});
-
-const values = computed(() => {
-  if (props.value !== null && typeof props.value !== "undefined") {
-    return Array.isArray(props.value) ? props.value : [String(props.value)];
-  } else {
-    return [];
+  separator: {
+    type: String,
+    default: ','
   }
 });
+const values = computed(() => {
+  if (props.value === '' || props.value === null || typeof props.value === "undefined") return []
+  let valu= Array.isArray(props.value) ? props.value.map(item => '' + item) : String(props.value).split(props.separator);
+  console.log("valu",valu)
+  return valu
+});
 
 const unmatch = computed(() => {
-  if (props.value !== null && typeof props.value !== "undefined") {
-    // 传入值为非数组
-    if (!Array.isArray(props.value)) {
-      if (props.options.some((v) => v.value == props.value)) {
-        return false;
-      }
-      return true;
+  if (props.options?.length == 0 || props.value === '' || props.value === null || typeof props.value === "undefined") return false
+  // 传入值为非数组
+  values.value.forEach(item => {
+    if (!props.options.some(v => v.value === item)) {
+      return true // 如果有未匹配项，将标志设置为true
     }
-    return true;
-  }
-  // 没有value不显示
-  return false;
+  })
+  return false // 返回标志的值
 });
 
 const unmatchArray = computed(() => {
 // 记录未匹配的项
   const itemUnmatchArray: Array<string | number> = [];
-  if (props.value !== null && typeof props.value !== "undefined") {
-    // 传入值为非数组
-    if (!Array.isArray(props.value)) {
-      itemUnmatchArray.push(props.value);
-    } else {
-      // 传入值为Array
-      props.value.forEach((item) => {
-        if (!props.options.some((v) => v.value == item)) {
-          itemUnmatchArray.push(item);
-        }
-      });
-    }
+  if (props.value !== '' && props.value !== null && typeof props.value !== "undefined") {
+    values.value.forEach(item => {
+      if (!props.options.some(v => v.value === item)) {
+        itemUnmatchArray.push(item);
+      }
+    })
   }
   // 没有value不显示
   return handleArray(itemUnmatchArray);
diff --git a/src/views/system/client/index.vue b/src/views/system/client/index.vue
index 827eaf2..0780c82 100644
--- a/src/views/system/client/index.vue
+++ b/src/views/system/client/index.vue
@@ -53,11 +53,7 @@
         <el-table-column label="客户端秘钥" align="center" prop="clientSecret" />
         <el-table-column label="授权类型" align="center">
           <template #default="scope">
-            <div>
-              <template v-for="(type, index) in scope.row.grantTypeList" :key="index">
-                <dict-tag class="el-check-tag" :options="sys_grant_type" :value="type" />
-              </template>
-            </div>
+            <dict-tag :options="sys_grant_type" :value="scope.row.grantTypeList" />
           </template>
         </el-table-column>
         <el-table-column label="设备类型" align="center">