feat: 代码生成预览 图标改为本地
This commit is contained in:
parent
2cc82a0c05
commit
09b9569ce3
@ -2,14 +2,22 @@
|
|||||||
import type { Recordable } from '@vben/types';
|
import type { Recordable } from '@vben/types';
|
||||||
import type { Key } from 'ant-design-vue/es/vc-tree/interface';
|
import type { Key } from 'ant-design-vue/es/vc-tree/interface';
|
||||||
|
|
||||||
import { ref } from 'vue';
|
import { type Component, ref } from 'vue';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
CodeMirror,
|
CodeMirror,
|
||||||
type LanguageSupport,
|
type LanguageSupport,
|
||||||
useVbenModal,
|
useVbenModal,
|
||||||
} from '@vben/common-ui';
|
} from '@vben/common-ui';
|
||||||
import { IconifyIcon } from '@vben/icons';
|
import {
|
||||||
|
DefaultFileIcon,
|
||||||
|
FolderIcon,
|
||||||
|
JavaIcon,
|
||||||
|
SqlIcon,
|
||||||
|
TsIcon,
|
||||||
|
VueIcon,
|
||||||
|
XmlIcon,
|
||||||
|
} from '@vben/icons';
|
||||||
|
|
||||||
import { useClipboard } from '@vueuse/core';
|
import { useClipboard } from '@vueuse/core';
|
||||||
import { Skeleton, Tree } from 'ant-design-vue';
|
import { Skeleton, Tree } from 'ant-design-vue';
|
||||||
@ -20,7 +28,7 @@ interface TreeNode {
|
|||||||
children: TreeNode[];
|
children: TreeNode[];
|
||||||
title: string;
|
title: string;
|
||||||
key: string;
|
key: string;
|
||||||
icon: string; // 树左边图标
|
icon: Component; // 树左边图标
|
||||||
}
|
}
|
||||||
|
|
||||||
const treeData = ref<TreeNode[]>([]);
|
const treeData = ref<TreeNode[]>([]);
|
||||||
@ -90,16 +98,16 @@ function convertToTree(paths: string[]): TreeNode[] {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const iconMap = [
|
const iconMap = [
|
||||||
{ key: 'java', value: 'skill-icons:java-light' },
|
{ key: 'java', value: JavaIcon },
|
||||||
{ key: 'xml', value: 'tabler:file-type-xml' },
|
{ key: 'xml', value: XmlIcon },
|
||||||
{ key: 'sql', value: 'carbon:sql' },
|
{ key: 'sql', value: SqlIcon },
|
||||||
{ key: 'ts', value: 'skill-icons:typescript' },
|
{ key: 'ts', value: TsIcon },
|
||||||
{ key: 'vue', value: 'logos:vue' },
|
{ key: 'vue', value: VueIcon },
|
||||||
{ key: 'folder', value: 'flat-color-icons:folder' },
|
{ key: 'folder', value: FolderIcon },
|
||||||
];
|
];
|
||||||
function findIcon(path: string) {
|
function findIcon(path: string) {
|
||||||
const defaultFileIcon = 'bx:file';
|
const defaultFileIcon = DefaultFileIcon;
|
||||||
const defaultFolderIcon = 'flat-color-icons:folder';
|
const defaultFolderIcon = FolderIcon;
|
||||||
if (path.endsWith('.vm')) {
|
if (path.endsWith('.vm')) {
|
||||||
const realPath = path.slice(0, -3);
|
const realPath = path.slice(0, -3);
|
||||||
// 是否为指定拓展名
|
// 是否为指定拓展名
|
||||||
@ -172,7 +180,7 @@ const { copy } = useClipboard({ legacy: true });
|
|||||||
>
|
>
|
||||||
<template #title="{ title, icon }">
|
<template #title="{ title, icon }">
|
||||||
<div class="flex items-center gap-[16px]">
|
<div class="flex items-center gap-[16px]">
|
||||||
<IconifyIcon :icon="icon" />
|
<component :is="icon" />
|
||||||
<span>{{ title }}</span>
|
<span>{{ title }}</span>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -45,9 +45,11 @@
|
|||||||
"@iconify/icons-material-symbols": "^1.2.58",
|
"@iconify/icons-material-symbols": "^1.2.58",
|
||||||
"@iconify/icons-mdi": "^1.2.48",
|
"@iconify/icons-mdi": "^1.2.48",
|
||||||
"@iconify/icons-mingcute": "^1.2.9",
|
"@iconify/icons-mingcute": "^1.2.9",
|
||||||
|
"@iconify/icons-noto": "^1.2.10",
|
||||||
"@iconify/icons-ph": "^1.2.5",
|
"@iconify/icons-ph": "^1.2.5",
|
||||||
"@iconify/icons-ri": "^1.2.10",
|
"@iconify/icons-ri": "^1.2.10",
|
||||||
"@iconify/icons-simple-icons": "^1.2.74",
|
"@iconify/icons-simple-icons": "^1.2.74",
|
||||||
|
"@iconify/icons-skill-icons": "^1.2.1",
|
||||||
"@iconify/icons-solar": "^1.2.3",
|
"@iconify/icons-solar": "^1.2.3",
|
||||||
"@iconify/icons-streamline": "^1.2.3",
|
"@iconify/icons-streamline": "^1.2.3",
|
||||||
"@iconify/icons-tabler": "^1.2.95",
|
"@iconify/icons-tabler": "^1.2.95",
|
||||||
|
@ -4,6 +4,8 @@ import githubOutlined from '@iconify/icons-ant-design/github-outlined';
|
|||||||
import inboxIcon from '@iconify/icons-ant-design/inbox-outlined';
|
import inboxIcon from '@iconify/icons-ant-design/inbox-outlined';
|
||||||
import userOutlined from '@iconify/icons-ant-design/user-outlined';
|
import userOutlined from '@iconify/icons-ant-design/user-outlined';
|
||||||
import ucIcon from '@iconify/icons-arcticons/uc-browser';
|
import ucIcon from '@iconify/icons-arcticons/uc-browser';
|
||||||
|
import defaultFileIcon from '@iconify/icons-bx/file';
|
||||||
|
import sqlIcon from '@iconify/icons-carbon/sql';
|
||||||
import linuxIcon from '@iconify/icons-devicon/linux';
|
import linuxIcon from '@iconify/icons-devicon/linux';
|
||||||
import windowsIcon from '@iconify/icons-devicon/windows8';
|
import windowsIcon from '@iconify/icons-devicon/windows8';
|
||||||
import alipayIcon from '@iconify/icons-fa-brands/alipay';
|
import alipayIcon from '@iconify/icons-fa-brands/alipay';
|
||||||
@ -19,6 +21,7 @@ import operaIcon from '@iconify/icons-logos/opera';
|
|||||||
import quarkIcon from '@iconify/icons-logos/quarkus-icon';
|
import quarkIcon from '@iconify/icons-logos/quarkus-icon';
|
||||||
import redisIcon from '@iconify/icons-logos/redis';
|
import redisIcon from '@iconify/icons-logos/redis';
|
||||||
import safariIcon from '@iconify/icons-logos/safari';
|
import safariIcon from '@iconify/icons-logos/safari';
|
||||||
|
import vueIcon from '@iconify/icons-logos/vue';
|
||||||
import iphoneIcon from '@iconify/icons-majesticons/iphone-x-apps-line';
|
import iphoneIcon from '@iconify/icons-majesticons/iphone-x-apps-line';
|
||||||
import menuIcon from '@iconify/icons-material-symbols/menu';
|
import menuIcon from '@iconify/icons-material-symbols/menu';
|
||||||
import okButtonIcon from '@iconify/icons-mdi/button-pointer';
|
import okButtonIcon from '@iconify/icons-mdi/button-pointer';
|
||||||
@ -30,6 +33,9 @@ import dingtalkIcon from '@iconify/icons-ri/dingding-line';
|
|||||||
import taobaoIconFill from '@iconify/icons-ri/taobao-fill';
|
import taobaoIconFill from '@iconify/icons-ri/taobao-fill';
|
||||||
import giteeIcon from '@iconify/icons-simple-icons/gitee';
|
import giteeIcon from '@iconify/icons-simple-icons/gitee';
|
||||||
import qqIcon from '@iconify/icons-simple-icons/tencentqq';
|
import qqIcon from '@iconify/icons-simple-icons/tencentqq';
|
||||||
|
import javaIcon from '@iconify/icons-skill-icons/java-light';
|
||||||
|
import tsIcon from '@iconify/icons-skill-icons/typescript';
|
||||||
|
import xmlIcon from '@iconify/icons-tabler/file-type-xml';
|
||||||
import githubOAuthIcon from '@iconify/icons-uiw/github';
|
import githubOAuthIcon from '@iconify/icons-uiw/github';
|
||||||
import excelIcon from '@iconify/icons-vscode-icons/file-type-excel';
|
import excelIcon from '@iconify/icons-vscode-icons/file-type-excel';
|
||||||
import osxIcon from '@iconify/icons-wpf/macos';
|
import osxIcon from '@iconify/icons-wpf/macos';
|
||||||
@ -159,3 +165,22 @@ export const MenuIcon = createIconifyOfflineIcon(
|
|||||||
'material-symbols:menu',
|
'material-symbols:menu',
|
||||||
menuIcon,
|
menuIcon,
|
||||||
);
|
);
|
||||||
|
|
||||||
|
export const JavaIcon = createIconifyOfflineIcon(
|
||||||
|
'skill-icons:java-light',
|
||||||
|
javaIcon,
|
||||||
|
);
|
||||||
|
export const XmlIcon = createIconifyOfflineIcon(
|
||||||
|
'tabler:file-type-xml',
|
||||||
|
xmlIcon,
|
||||||
|
);
|
||||||
|
export const SqlIcon = createIconifyOfflineIcon('carbon:sql', sqlIcon);
|
||||||
|
export const TsIcon = createIconifyOfflineIcon(
|
||||||
|
'skill-icons:typescript',
|
||||||
|
tsIcon,
|
||||||
|
);
|
||||||
|
export const VueIcon = createIconifyOfflineIcon('logos:vue', vueIcon);
|
||||||
|
export const DefaultFileIcon = createIconifyOfflineIcon(
|
||||||
|
'flat-color-icons:folder',
|
||||||
|
defaultFileIcon,
|
||||||
|
);
|
||||||
|
Loading…
Reference in New Issue
Block a user