From 61a8904e522f1bdc60a4589bac3a2e3653b78f63 Mon Sep 17 00:00:00 2001
From: JEECG <445654970@qq.com>
Date: Wed, 16 Apr 2025 18:42:22 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90issues/8097=E3=80=91icon=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6svg=E5=9B=BE=E6=A0=87=E6=98=BE=E7=A4=BA=E7=A9=BA?=
 =?UTF-8?q?=E7=99=BD=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/Icon/src/IconList.vue      |  3 +-
 .../src/components/Icon/src/IconPicker.vue    | 81 ++++++++++---------
 2 files changed, 44 insertions(+), 40 deletions(-)

diff --git a/jeecgboot-vue3/src/components/Icon/src/IconList.vue b/jeecgboot-vue3/src/components/Icon/src/IconList.vue
index 7ceebd22..6a37961a 100644
--- a/jeecgboot-vue3/src/components/Icon/src/IconList.vue
+++ b/jeecgboot-vue3/src/components/Icon/src/IconList.vue
@@ -185,11 +185,10 @@
   }
   ul span {
     font-size: 1.5rem !important;
-    border: 1px solid #f1f1f1;
     padding: 0.2rem;
     margin: 0.3rem;
   }
-  .icon-border span {
+  .icon-border {
     border: 1px solid rgba(24, 144, 255) !important;
   }
   .justify-content-right {
diff --git a/jeecgboot-vue3/src/components/Icon/src/IconPicker.vue b/jeecgboot-vue3/src/components/Icon/src/IconPicker.vue
index dfe969f7..d724642d 100644
--- a/jeecgboot-vue3/src/components/Icon/src/IconPicker.vue
+++ b/jeecgboot-vue3/src/components/Icon/src/IconPicker.vue
@@ -20,44 +20,49 @@
       />
     </template>
   </a-input>
-  <a-modal :bodyStyle="{ padding: '24px'}" v-bind="$attrs" v-model:open="iconOpen" :keyboard="false" :width="800" @ok="handleOk" :ok-text="t('common.okText')" :cancel-text="t('common.cancelText')">
-    <a-tabs style="padding-left: 15px;padding-right: 15px">
-      <a-tab-pane tab="方向性图标" key="1">
-        <a-form-item-rest>
-          <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-svg-mode="isSvgMode" :current-list="directionIcons" v-model:value="selectIcon" />
-        </a-form-item-rest>
-      </a-tab-pane>
-      <a-tab-pane tab="指示性图标" key="2">
-        <a-form-item-rest>
-          <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-svg-mode="isSvgMode" :current-list="suggestionIcons" v-model:value="selectIcon" />
-        </a-form-item-rest>
-      </a-tab-pane>
-      <a-tab-pane tab="编辑类图标" key="3">
-        <a-form-item-rest>
-          <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-svg-mode="isSvgMode" :current-list="editIcons" v-model:value="selectIcon" />
-        </a-form-item-rest>
-      </a-tab-pane>
-      <a-tab-pane tab="数据类图标" key="4">
-        <a-form-item-rest>
-          <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-svg-mode="isSvgMode" :current-list="dataIcons" v-model:value="selectIcon" />
-        </a-form-item-rest>
-      </a-tab-pane>
-      <a-tab-pane tab="网站通用图标" key="5">
-        <a-form-item-rest>
-          <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-svg-mode="isSvgMode" :current-list="webIcons" v-model:value="selectIcon" />
-        </a-form-item-rest>
-      </a-tab-pane>
-      <a-tab-pane tab="品牌和标识" key="6">
-        <a-form-item-rest>
-          <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-svg-mode="isSvgMode" :current-list="logoIcons" v-model:value="selectIcon" />
-        </a-form-item-rest>
-      </a-tab-pane>
-      <a-tab-pane tab="其他" key="7">
-        <a-form-item-rest>
-          <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-page="true" :is-search="true" :is-svg-mode="isSvgMode" :current-list="otherIcons" v-model:value="selectIcon" />
-        </a-form-item-rest>
-      </a-tab-pane>
-    </a-tabs>
+  <a-modal :bodyStyle="{ padding: '24px', paddingTop: mode === 'svg' ? '48px' : '24px'}" v-bind="$attrs" v-model:open="iconOpen" :keyboard="false" :width="800" @ok="handleOk" :ok-text="t('common.okText')" :cancel-text="t('common.cancelText')">
+    <template v-if="mode === 'iconify'">
+      <a-tabs style="padding-left: 15px;padding-right: 15px">
+        <a-tab-pane tab="方向性图标" key="1">
+          <a-form-item-rest>
+            <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-svg-mode="isSvgMode" :current-list="directionIcons" v-model:value="selectIcon" />
+          </a-form-item-rest>
+        </a-tab-pane>
+        <a-tab-pane tab="指示性图标" key="2">
+          <a-form-item-rest>
+            <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-svg-mode="isSvgMode" :current-list="suggestionIcons" v-model:value="selectIcon" />
+          </a-form-item-rest>
+        </a-tab-pane>
+        <a-tab-pane tab="编辑类图标" key="3">
+          <a-form-item-rest>
+            <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-svg-mode="isSvgMode" :current-list="editIcons" v-model:value="selectIcon" />
+          </a-form-item-rest>
+        </a-tab-pane>
+        <a-tab-pane tab="数据类图标" key="4">
+          <a-form-item-rest>
+            <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-svg-mode="isSvgMode" :current-list="dataIcons" v-model:value="selectIcon" />
+          </a-form-item-rest>
+        </a-tab-pane>
+        <a-tab-pane tab="网站通用图标" key="5">
+          <a-form-item-rest>
+            <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-svg-mode="isSvgMode" :current-list="webIcons" v-model:value="selectIcon" />
+          </a-form-item-rest>
+        </a-tab-pane>
+        <a-tab-pane tab="品牌和标识" key="6">
+          <a-form-item-rest>
+            <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-svg-mode="isSvgMode" :current-list="logoIcons" v-model:value="selectIcon" />
+          </a-form-item-rest>
+        </a-tab-pane>
+        <a-tab-pane tab="其他" key="7">
+          <a-form-item-rest>
+            <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-page="true" :is-search="true" :is-svg-mode="isSvgMode" :current-list="otherIcons" v-model:value="selectIcon" />
+          </a-form-item-rest>
+        </a-tab-pane>
+      </a-tabs>
+    </template>
+    <template v-else>
+      <icon-list ref="iconListRef" :clear-select="clearSelect" :copy="copy" :is-page="true" :is-search="true" :is-svg-mode="isSvgMode" :current-list="otherIcons" v-model:value="selectIcon" />
+    </template>
   </a-modal>
 </template>
 <script lang="ts" setup name="icon-picker">