From 9d29270cc532bd16046520d57e4808bf5a7433d7 Mon Sep 17 00:00:00 2001
From: "WANGFAN\\wangf" <15871339963@163.com>
Date: Sun, 27 Oct 2024 14:59:43 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=9B=BE=E6=A0=87=E9=80=89=E6=8B=A9?=
 =?UTF-8?q?=E5=99=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/select-icon/index.vue          |  2 +-
 src/lang/modules/enUS.ts                      |  2 +-
 src/lang/modules/zhCN.ts                      |  2 +-
 src/router/route.ts                           |  8 ++++----
 .../icon-selector.vue}                        | 19 ++++++++++---------
 5 files changed, 17 insertions(+), 16 deletions(-)
 rename src/views/common-component/{icon-component/icon-component.vue => icon-selector/icon-selector.vue} (73%)

diff --git a/src/components/select-icon/index.vue b/src/components/select-icon/index.vue
index 48211ca..b39cb50 100644
--- a/src/components/select-icon/index.vue
+++ b/src/components/select-icon/index.vue
@@ -57,7 +57,7 @@ const onIcon = (iconName: string) => {
   emit("select", iconName);
 };
 
-const visible = ref(false);
+const visible = ref<boolean>(false);
 const open = () => {
   searchName.value = "";
   visible.value = true;
diff --git a/src/lang/modules/enUS.ts b/src/lang/modules/enUS.ts
index e1492be..e8402bd 100644
--- a/src/lang/modules/enUS.ts
+++ b/src/lang/modules/enUS.ts
@@ -28,7 +28,7 @@ export default {
     ["draggable"]: "draggable",
     ["editor"]: "editor",
     ["newbie"]: "newbie",
-    ["icon-component"]: "icon component",
+    ["icon-selector"]: "icon selector",
     ["user-center"]: "user center",
     ["markdown"]: "Markdown",
     ["custom-instruction"]: "custom instruction",
diff --git a/src/lang/modules/zhCN.ts b/src/lang/modules/zhCN.ts
index 595354d..1bb8273 100644
--- a/src/lang/modules/zhCN.ts
+++ b/src/lang/modules/zhCN.ts
@@ -28,7 +28,7 @@ export default {
     ["draggable"]: "拖拽",
     ["editor"]: "富文本",
     ["newbie"]: "新手指引",
-    ["icon-component"]: "icon组件",
+    ["icon-selector"]: "图标选择器",
     ["user-center"]: "用户中心",
     ["markdown"]: "Markdown",
     ["custom-instruction"]: "自定义指令",
diff --git a/src/router/route.ts b/src/router/route.ts
index 8a20771..3a06c37 100644
--- a/src/router/route.ts
+++ b/src/router/route.ts
@@ -389,11 +389,11 @@ export const dynamicRoutes: RouteRecordRaw[] = [
             }
           },
           {
-            path: "/common-component/icon-component",
-            name: "icon-component",
-            component: () => import("@/views/common-component/icon-component/icon-component.vue"),
+            path: "/common-component/icon-selector",
+            name: "icon-selector",
+            component: () => import("@/views/common-component/icon-selector/icon-selector.vue"),
             meta: {
-              title: "icon-component",
+              title: "icon-selector",
               hide: false,
               disable: false,
               keepAlive: true,
diff --git a/src/views/common-component/icon-component/icon-component.vue b/src/views/common-component/icon-selector/icon-selector.vue
similarity index 73%
rename from src/views/common-component/icon-component/icon-component.vue
rename to src/views/common-component/icon-selector/icon-selector.vue
index 7a02ca3..5fc8422 100644
--- a/src/views/common-component/icon-component/icon-component.vue
+++ b/src/views/common-component/icon-selector/icon-selector.vue
@@ -2,17 +2,13 @@
   <div class="snow-page">
     <div class="snow-inner-page">
       <div class="title">图标选择器</div>
-      <a-input
-        :style="{ width: '400px' }"
-        placeholder="请选择图标"
-        allow-clear
-        v-model="iconName"
-        @focus="onFocus"
-        @clear="onClear"
-      >
+      <a-input ref="inputRef" :style="{ width: '400px' }" placeholder="请选择图标" v-model="iconName" @focus="onFocus">
         <template #suffix v-if="iconName">
           <component :is="iconName"></component>
         </template>
+        <template #append>
+          <span class="icon-reset" @click="reset">重置</span>
+        </template>
       </a-input>
       <a-divider />
       <div class="target-title">当前选择的图标：</div>
@@ -26,10 +22,12 @@
 <script setup lang="ts">
 const iconName = ref<string>("");
 const SelectIconRef = ref();
+
 const onFocus = () => {
   SelectIconRef.value.open();
 };
-const onClear = () => {
+
+const reset = () => {
   iconName.value = "";
 };
 
@@ -47,4 +45,7 @@ const select = (icon: string) => {
 .target-title {
   margin-bottom: $margin;
 }
+.icon-reset {
+  cursor: pointer;
+}
 </style>