From dcebda7ca605ebbd3c7faddc4672603c5ad8c1b8 Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Mon, 23 Sep 2024 17:56:55 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E4=B8=80=E4=BA=9B?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../system/dict/data/tag-style-picker.vue     | 23 +++++++++++++------
 1 file changed, 16 insertions(+), 7 deletions(-)

diff --git a/apps/web-antd/src/views/system/dict/data/tag-style-picker.vue b/apps/web-antd/src/views/system/dict/data/tag-style-picker.vue
index b118b9f0..754b52f7 100644
--- a/apps/web-antd/src/views/system/dict/data/tag-style-picker.vue
+++ b/apps/web-antd/src/views/system/dict/data/tag-style-picker.vue
@@ -10,6 +10,13 @@ import {
 
 import { tagSelectOptions } from '#/components/dict';
 
+/**
+ * 需要禁止透传
+ * 不禁止会有奇怪的bug 会绑定到selectType上
+ * TODO: 未知原因 有待研究
+ */
+defineOptions({ inheritAttrs: false });
+
 defineEmits<{ deselect: [] }>();
 
 const options = [
@@ -31,21 +38,22 @@ const selectType = defineModel('selectType', {
   type: String as PropType<SelectType>,
 });
 
+/**
+ * color必须为hex颜色或者undefined
+ */
 const color = defineModel('value', {
-  default: '',
-  type: String,
+  default: undefined,
+  type: String as PropType<string | undefined>,
 });
 
 function handleSelectTypeChange(e: RadioChangeEvent) {
-  // 必须给默认hex颜色  不能为空字符串
-  if (e.target.value === 'custom') {
-    color.value = '#FFFFFF';
-  }
+  // 必须给默认hex颜色 不能为空字符串
+  color.value = e.target.value === 'custom' ? '#000000' : undefined;
 }
 </script>
 
 <template>
-  <div class="flex items-center gap-[6px]">
+  <div class="flex flex-1 items-center gap-[6px]">
     <RadioGroup
       v-model:value="selectType"
       :options="computedOptions"
@@ -55,6 +63,7 @@ function handleSelectTypeChange(e: RadioChangeEvent) {
     />
     <Select
       v-if="selectType === 'default'"
+      v-model:value="color"
       :allow-clear="true"
       :options="tagSelectOptions()"
       class="flex-1"