From c2dde252297c94036221d5d9971781182bc2998e Mon Sep 17 00:00:00 2001
From: kailong321200875 <321200875@qq.com>
Date: Sat, 6 Jan 2024 15:25:03 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E5=9B=BE=E6=A0=87=E9=80=89=E6=8B=A9?=
 =?UTF-8?q?=E5=99=A8=E9=80=BB=E8=BE=91=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/IconPicker/src/IconPicker.vue | 11 +++++++++--
 src/views/Components/IconPicker.vue          |  2 +-
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/components/IconPicker/src/IconPicker.vue b/src/components/IconPicker/src/IconPicker.vue
index 53ca688..57ec4b9 100644
--- a/src/components/IconPicker/src/IconPicker.vue
+++ b/src/components/IconPicker/src/IconPicker.vue
@@ -90,6 +90,11 @@ const popoverShow = () => {
 }
 
 const iconSelect = (icon: string) => {
+  // 如果是同一个icon则不做处理，则相当于点击了清空按钮
+  if (icon === unref(modelValue)) {
+    modelValue.value = ''
+    return
+  }
   modelValue.value = icon
 }
 
@@ -106,7 +111,7 @@ const inputClear = () => {
 
 <template>
   <div :class="prefixCls" class="flex justify-center items-center box">
-    <ElInput disabled v-model="modelValue" />
+    <ElInput disabled v-model="modelValue" clearable />
     <ElPopover
       placement="bottom"
       trigger="click"
@@ -144,8 +149,10 @@ const inputClear = () => {
                     icon === modelValue ? 'var(--el-color-primary)' : 'var(--el-border-color)'
                   }`,
                   boxSizing: 'border-box',
-                  margin: '2px'
+                  margin: '2px',
+                  transition: 'all 0.3s'
                 }"
+                class="hover:border-color-[var(--el-color-primary)]!"
                 @click="iconSelect(icon)"
               >
                 <Icon
diff --git a/src/views/Components/IconPicker.vue b/src/views/Components/IconPicker.vue
index 8da8d4b..6643f94 100644
--- a/src/views/Components/IconPicker.vue
+++ b/src/views/Components/IconPicker.vue
@@ -6,7 +6,7 @@ import { useI18n } from '@/hooks/web/useI18n'
 
 const { t } = useI18n()
 
-const currentIcon = ref('tdesign:book-open')
+const currentIcon = ref('')
 </script>
 
 <template>