fix: 整体图标调整

5 years ago · 5dc8226ce1
19 changed files with 45 additions and 47 deletions
--- a/mock/sys/menu.ts
+++ b/mock/sys/menu.ts
@ -9,7 +9,7 @@ const dashboardRoute = {
  meta: {
    title: 'routes.dashboard.welcome',
    affix: true,
-    icon: 'ant-design:home-outlined',
+    icon: 'bx:bx-home',
  },
 };

--- a/src/components/Upload/src/BasicUpload.vue
+++ b/src/components/Upload/src/BasicUpload.vue
@ -1,7 +1,7 @@
 <template>
  <div>
    <a-button-group>
-      <a-button type="primary" @click="openUploadModal" preIcon="ant-design:cloud-upload-outlined">
+      <a-button type="primary" @click="openUploadModal" preIcon="carbon:cloud-upload">
        {{ t('component.upload.upload') }}
      </a-button>
      <Tooltip placement="bottom" v-if="showPreview">
@ -10,7 +10,7 @@
          <template v-if="fileListRef.length">{{ fileListRef.length }}</template>
        </template>
        <a-button @click="openPreviewModal">
-          <Icon icon="ant-design:eye-outlined" />
+          <Icon icon="bi:eye" />
          <template v-if="fileListRef.length && showPreviewNumber">
            {{ fileListRef.length }}
          </template>
--- a/src/layouts/default/header/UserDropdown.tsx
+++ b/src/layouts/default/header/UserDropdown.tsx
@ -103,7 +103,7 @@ export default defineComponent({
              <MenuItem
                key="loginOut"
                text={t('layout.header.dropdownItemLoginOut')}
-                icon="ant-design:poweroff-outlined"
+                icon="carbon:power"
              />
            </>
          )}
--- a/src/layouts/default/multitabs/useTabDropdown.ts
+++ b/src/layouts/default/multitabs/useTabDropdown.ts
@ -62,40 +62,40 @@ export function useTabDropdown(tabContentProps: TabContentProps) {
      index === tabStore.getTabsState.length - 1 && tabStore.getLastDragEndIndexState >= 0;
    const dropMenuList: DropMenu[] = [
      {
-        icon: 'ant-design:reload-outlined',
+        icon: 'ion:reload-sharp',
        event: MenuEventEnum.REFRESH_PAGE,
        text: t('layout.multipleTab.redo'),
        disabled: refreshDisabled,
      },
      {
-        icon: 'ant-design:close-outlined',
+        icon: 'clarity:close-line',
        event: MenuEventEnum.CLOSE_CURRENT,
        text: t('layout.multipleTab.close'),
        disabled: meta?.affix || disabled,
        divider: true,
      },
      {
-        icon: 'ant-design:pic-left-outlined',
+        icon: 'line-md:arrow-close-left',
        event: MenuEventEnum.CLOSE_LEFT,
        text: t('layout.multipleTab.closeLeft'),
        disabled: closeLeftDisabled,
        divider: false,
      },
      {
-        icon: 'ant-design:pic-right-outlined',
+        icon: 'line-md:arrow-close-right',
        event: MenuEventEnum.CLOSE_RIGHT,
        text: t('layout.multipleTab.closeRight'),
        disabled: closeRightDisabled,
        divider: true,
      },
      {
-        icon: 'ant-design:pic-center-outlined',
+        icon: 'dashicons:align-center',
        event: MenuEventEnum.CLOSE_OTHER,
        text: t('layout.multipleTab.closeOther'),
        disabled: disabled,
      },
      {
-        icon: 'ant-design:line-outlined',
+        icon: 'clarity:minus-line',
        event: MenuEventEnum.CLOSE_ALL,
        text: t('layout.multipleTab.closeAll'),
        disabled: disabled,
--- a/src/router/routes/index.ts
+++ b/src/router/routes/index.ts
@ -20,7 +20,7 @@ const MainRoute: AppRouteModule = {
  component: LAYOUT,
  redirect: PageEnum.BASE_HOME,
  meta: {
-    icon: 'ant-design:home-outlined',
+    icon: 'bx:bx-home',
    title: 'routes.dashboard.dashboard',
  },
 };
--- a/src/router/routes/modules/dashboard.ts
+++ b/src/router/routes/modules/dashboard.ts
@ -8,7 +8,7 @@ const dashboard: AppRouteModule = {
  component: LAYOUT,
  redirect: '/dashboard/welcome',
  meta: {
-    icon: 'ant-design:home-outlined',
+    icon: 'bx:bx-home',
    title: 'routes.dashboard.dashboard',
  },
  children: [
--- a/src/router/routes/modules/demo/charts.ts
+++ b/src/router/routes/modules/demo/charts.ts
@ -8,7 +8,7 @@ const charts: AppRouteModule = {
  component: LAYOUT,
  redirect: '/charts/apexChart',
  meta: {
-    icon: 'ant-design:area-chart-outlined',
+    icon: 'vaadin:spline-area-chart',
    title: 'routes.demo.charts.charts',
  },
  children: [
--- a/src/router/routes/modules/demo/comp.ts
+++ b/src/router/routes/modules/demo/comp.ts
@ -8,7 +8,7 @@ const comp: AppRouteModule = {
  component: LAYOUT,
  redirect: '/comp/basic',
  meta: {
-    icon: 'ant-design:table-outlined',
+    icon: 'ic:outline-settings-input-component',
    title: 'routes.demo.comp.comp',
  },

--- a/src/router/routes/modules/demo/editor.ts
+++ b/src/router/routes/modules/demo/editor.ts
@ -8,7 +8,7 @@ const editor: AppRouteModule = {
  component: LAYOUT,
  redirect: '/editor/markdown',
  meta: {
-    icon: 'ant-design:table-outlined',
+    icon: 'carbon:table-split',
    title: 'routes.demo.editor.editor',
  },
  children: [
--- a/src/router/routes/modules/demo/form.ts
+++ b/src/router/routes/modules/demo/form.ts
@ -8,7 +8,7 @@ const form: AppRouteModule = {
  component: LAYOUT,
  redirect: '/form/basic',
  meta: {
-    icon: 'ant-design:table-outlined',
+    icon: 'mdi:form-select',
    title: 'routes.demo.form.form',
  },
  children: [
--- a/src/router/routes/modules/demo/table.ts
+++ b/src/router/routes/modules/demo/table.ts
@ -8,7 +8,7 @@ const table: AppRouteModule = {
  component: LAYOUT,
  redirect: '/table/basic',
  meta: {
-    icon: 'ant-design:table-outlined',
+    icon: 'carbon:table-split',
    title: 'routes.demo.table.table',
  },

--- a/src/router/routes/modules/home.ts
+++ b/src/router/routes/modules/home.ts
@ -8,7 +8,7 @@ const dashboard: AppRouteModule = {
  component: LAYOUT,
  redirect: '/home/welcome',
  meta: {
-    icon: 'ant-design:home-outlined',
+    icon: 'bx:bx-home',
    title: 'routes.dashboard.welcome',
  },
  children: [
@ -19,7 +19,7 @@ const dashboard: AppRouteModule = {
      meta: {
        title: 'routes.dashboard.welcome',
        affix: true,
-        icon: 'ant-design:home-outlined',
+        icon: 'bx:bx-home',
      },
    },
  ],
--- a/src/views/demo/feat/context-menu/index.vue
+++ b/src/views/demo/feat/context-menu/index.vue
@ -25,14 +25,14 @@
          items: [
            {
              label: 'New',
-              icon: 'ant-design:plus-outlined',
+              icon: 'bi:plus',
              handler: () => {
                createMessage.success('click new');
              },
            },
            {
              label: 'Open',
-              icon: 'ant-design:folder-open-filled',
+              icon: 'bx:bxs-folder-open',
              handler: () => {
                createMessage.success('click open');
              },
@ -47,12 +47,12 @@
          items: [
            {
              label: 'New',
-              icon: 'ant-design:plus-outlined',
+              icon: 'bi:plus',

              children: [
                {
                  label: 'New1-1',
-                  icon: 'ant-design:plus-outlined',
+                  icon: 'bi:plus',
                  divider: true,
                  children: [
                    {
@ -69,7 +69,7 @@
                },
                {
                  label: 'New1-2',
-                  icon: 'ant-design:plus-outlined',
+                  icon: 'bi:plus',
                },
              ],
            },
--- a/src/views/demo/page/account/center/data.tsx
+++ b/src/views/demo/page/account/center/data.tsx
@ -19,10 +19,10 @@ export const tags: string[] = [
  '前端开发',
  'vue3',
 ];
-
+<span class="iconify" data-icon="jam:codepen-circle" data-inline="false"></span>;
 export const teams: ListItem[] = [
  {
-    icon: 'ant-design:alipay-circle-outlined',
+    icon: 'ri:alipay-fill',
    title: '科学搬砖组',
    color: '#ff4000',
  },
@ -32,22 +32,22 @@ export const teams: ListItem[] = [
    color: '#7c51b8',
  },
  {
-    icon: 'ant-design:alipay-circle-outlined',
+    icon: 'ri:alipay-fill',
    title: '高逼格设计',
    color: '#00adf7',
  },
  {
-    icon: 'ant-design:codepen-circle-filled',
+    icon: 'jam:codepen-circle',
    title: '程序员日常',
    color: '#00adf7',
  },
  {
-    icon: 'ant-design:behance-square-filled',
+    icon: 'fa:behance-square',
    title: '科学搬砖组',
    color: '#7c51b8',
  },
  {
-    icon: 'ant-design:dribbble-circle-filled',
+    icon: 'jam:codepen-circle',
    title: '程序员日常',
    color: '#ff4000',
  },
@ -55,15 +55,15 @@ export const teams: ListItem[] = [

 export const details: ListItem[] = [
  {
-    icon: 'ant-design:contacts-outlined',
+    icon: 'ic:outline-contacts',
    title: '交互专家',
  },
  {
-    icon: 'ant-design:cluster-outlined',
+    icon: 'grommet-icons:cluster',
    title: '某某某事业群',
  },
  {
-    icon: 'ant-design:home-outlined',
+    icon: 'bx:bx-home-circle',
    title: '福建省厦门市',
  },
 ];
@ -87,9 +87,9 @@ export const achieveList: TabItem[] = [
 ];

 export const actions: any[] = [
-  { icon: 'ant-design:star-outlined', text: '156', color: '#018ffb' },
-  { icon: 'ant-design:like-filled', text: '156', color: '#459ae8' },
-  { icon: 'ant-design:message-filled', text: '2', color: '#42d27d' },
+  { icon: 'clarity:star-line', text: '156', color: '#018ffb' },
+  { icon: 'bx:bxs-like', text: '156', color: '#459ae8' },
+  { icon: 'bx:bxs-message-dots', text: '2', color: '#42d27d' },
 ];

 export const articleList = (() => {
--- a/src/views/demo/page/account/setting/BaseSetting.vue
+++ b/src/views/demo/page/account/setting/BaseSetting.vue
@ -9,9 +9,7 @@
          <div class="mb-2">头像</div>
          <img width="140" :src="headerImg" />
          <Upload :showUploadList="false">
-            <Button type="ghost" class="ml-5">
-              <Icon icon="ant-design:upload-outlined" />更换头像
-            </Button>
+            <Button type="ghost" class="ml-5"> <Icon icon="feather:upload" />更换头像 </Button>
          </Upload>
        </div>
      </a-col>
--- a/src/views/demo/page/account/setting/data.ts
+++ b/src/views/demo/page/account/setting/data.ts
@ -108,7 +108,7 @@ export const accountBindList: ListItem[] = [
    title: '绑定淘宝',
    description: '当前未绑定淘宝账号',
    extra: '绑定',
-    avatar: 'ant-design:taobao-outlined',
+    avatar: 'ri:taobao-fill',
    color: '#ff4000',
  },
  {
@ -116,7 +116,7 @@ export const accountBindList: ListItem[] = [
    title: '绑定支付宝',
    description: '当前未绑定支付宝账号',
    extra: '绑定',
-    avatar: 'ant-design:alipay-outlined',
+    avatar: 'fa-brands:alipay',
    color: '#2eabff',
  },
  {
--- a/src/views/demo/page/list/search/data.tsx
+++ b/src/views/demo/page/list/search/data.tsx
@ -15,9 +15,9 @@ export const searchList = (() => {
 })();

 export const actions: any[] = [
-  { icon: 'ant-design:star-outlined', text: '156', color: '#018ffb' },
-  { icon: 'ant-design:like-filled', text: '156', color: '#459ae8' },
-  { icon: 'ant-design:message-filled', text: '2', color: '#42d27d' },
+  { icon: 'clarity:star-line', text: '156', color: '#018ffb' },
+  { icon: 'bx:bxs-like', text: '156', color: '#459ae8' },
+  { icon: 'bx:bxs-message-dots', text: '2', color: '#42d27d' },
 ];

 export const schemas: FormSchema[] = [
--- a/src/views/demo/table/FixedColumn.vue
+++ b/src/views/demo/table/FixedColumn.vue
@ -6,7 +6,7 @@
          :actions="[
            {
              label: '删除',
-              icon: 'ant-design:area-chart-outlined',
+              icon: 'ic:outline-delete-outline',
              onClick: handleDelete.bind(null, record),
            },
          ]"
--- a/src/views/demo/tree/EditTree.vue
+++ b/src/views/demo/tree/EditTree.vue
@ -29,14 +29,14 @@
            handler: () => {
              console.log('点击了新增', node);
            },
-            icon: 'ant-design:plus-outlined',
+            icon: 'bi:plus',
          },
          {
            label: '删除',
            handler: () => {
              console.log('点击了删除', node);
            },
-            icon: 'ant-design:folder-open-filled',
+            icon: 'bx:bxs-folder-open',
          },
        ];
      }