kingecg
/
gohttpdUi
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

wip: IconPicker 开发中

This commit is contained in:
kailong321200875 2023-09-22 14:33:59 +08:00
parent aa5deb1390
commit 1098790ee9
12 changed files with 2431 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
mock/role/index.ts
View File

@ -230,6 +230,14 @@ const adminList = [
title: 'router.icon'
}
},
{
path: 'icon-picker',
component: 'views/Components/IconPicker',
name: 'IconPicker',
meta: {
title: 'router.iconPicker'
}
},
{
path: 'echart',
component: 'views/Components/Echart',
@ -602,6 +610,7 @@ const testList: string[] = [
'/components/image-viewer',
'/components/dialog',
'/components/icon',
'/components/iconPicker',
'/components/echart',
'/components/count-to',
'/components/qrcode',

9
package.json
View File

@ -23,7 +23,8 @@
"lint:style": "stylelint --fix \"**/*.{vue,less,postcss,css,scss}\" --cache --cache-location node_modules/.cache/stylelint/",
"lint:lint-staged": "lint-staged -c ./.husky/lintstagedrc.js",
"prepare": "husky install",
"p": "plop"
"p": "plop",
"icon": "esno ./scripts/icon.ts"
},
"dependencies": {
"@iconify/iconify": "^3.1.1",
@ -60,6 +61,8 @@
"@iconify/json": "^2.2.101",
"@intlify/unplugin-vue-i18n": "^0.12.2",
"@purge-icons/generated": "^0.9.0",
"@types/fs-extra": "^11.0.2",
"@types/inquirer": "^9.0.3",
"@types/lodash-es": "^4.17.8",
"@types/node": "^20.4.10",
"@types/nprogress": "^0.2.0",
@ -73,13 +76,17 @@
"@vitejs/plugin-vue": "^4.2.3",
"@vitejs/plugin-vue-jsx": "^3.0.1",
"autoprefixer": "^10.4.14",
"chalk": "^5.3.0",
"consola": "^3.2.3",
"eslint": "^8.47.0",
"eslint-config-prettier": "^9.0.0",
"eslint-define-config": "^1.23.0",
"eslint-plugin-prettier": "^5.0.0",
"eslint-plugin-vue": "^9.17.0",
"esno": "^0.17.0",
"fs-extra": "^11.1.1",
"husky": "^8.0.3",
"inquirer": "^9.2.11",
"less": "^4.2.0",
"lint-staged": "^13.2.3",
"plop": "^3.1.2",

78
scripts/icon.ts Normal file
View File

@ -0,0 +1,78 @@
import path from 'path'
import fs from 'fs-extra'
import inquirer from 'inquirer'
import chalk from 'chalk'
import pkg from '../package.json'
interface Icon {
name: string
prefix: string
icons: string[]
}
async function generateIcon() {
const dir = path.resolve(process.cwd(), 'node_modules/@iconify/json')
const raw = await fs.readJSON(path.join(dir, 'collections.json'))
const collections = Object.entries(raw).map(([id, v]) => ({
...(v as any),
id
}))
const choices = collections.map((item) => ({ key: item.id, value: item.id, name: item.name }))
inquirer
.prompt([
// {
// type: 'list',
// name: 'useType',
// choices: [
// { key: 'local', value: 'local', name: 'Local' },
// { key: 'onLine', value: 'onLine', name: 'OnLine' },
// ],
// message: 'How to use icons?',
// },
{
type: 'list',
name: 'iconSet',
choices: choices,
message: 'Select the icon set that needs to be generated?'
}
// {
// type: 'input',
// name: 'output',
// message: 'Select the icon set that needs to be generated?',
// default: 'src/components/Icon/data',
// },
])
// ↓命令行问答的答案
.then(async (answers) => {
const { iconSet } = answers
const outputDir = path.resolve(process.cwd(), 'src/components/IconPicker/src/data')
fs.ensureDir(outputDir)
const genCollections = collections.filter((item) => [iconSet].includes(item.id))
const prefixSet: string[] = []
for (const info of genCollections) {
const data = await fs.readJSON(path.join(dir, 'json', `${info.id}.json`))
if (data) {
const { prefix } = data
const icons = Object.keys(data.icons).map((item) => `${prefix}:${item}`)
await fs.writeFileSync(
path.join('src/components/IconPicker/src/data', `icons.${prefix}.ts`),
`export default ${JSON.stringify({ name: info.name, prefix, icons })}`
)
// ↓分类处理完成，push类型名称
prefixSet.push(prefix)
}
}
// 将vite的缓存清空
// fs.emptyDir(path.join(process.cwd(), 'node_modules/.vite'))
console.log(
`✨ ${chalk.cyan(`[${pkg.name}]`)}` + ' - Icon generated successfully:' + `[${prefixSet}]`
)
})
}
generateIcon()

3
src/components/IconPicker/index.ts Normal file
View File

@ -0,0 +1,3 @@
import IconPicker from './src/IconPicker.vue'
export { IconPicker }

11
src/components/IconPicker/src/IconPicker.vue Normal file
View File

@ -0,0 +1,11 @@
<script setup lang="ts">
import epIcons from './data/icons.ep'
import antIcons from './data/icons.ant-design'
import tIcons from './data/icons.tdesign'
console.log(epIcons, antIcons, tIcons)
</script>
<template>
<div> 2222 </div>
</template>

795
src/components/IconPicker/src/data/icons.ant-design.ts Normal file
View File

@ -0,0 +1,795 @@
export default {
name: 'Ant Design Icons',
prefix: 'ant-design',
icons: [
'ant-design:account-book-filled',
'ant-design:account-book-outlined',
'ant-design:account-book-twotone',
'ant-design:aim-outlined',
'ant-design:alert-filled',
'ant-design:alert-outlined',
'ant-design:alert-twotone',
'ant-design:alibaba-outlined',
'ant-design:align-center-outlined',
'ant-design:align-left-outlined',
'ant-design:align-right-outlined',
'ant-design:alipay-circle-filled',
'ant-design:alipay-circle-outlined',
'ant-design:alipay-outlined',
'ant-design:alipay-square-filled',
'ant-design:aliwangwang-filled',
'ant-design:aliwangwang-outlined',
'ant-design:aliyun-outlined',
'ant-design:amazon-circle-filled',
'ant-design:amazon-outlined',
'ant-design:amazon-square-filled',
'ant-design:android-filled',
'ant-design:android-outlined',
'ant-design:ant-cloud-outlined',
'ant-design:ant-design-outlined',
'ant-design:apartment-outlined',
'ant-design:api-filled',
'ant-design:api-outlined',
'ant-design:api-twotone',
'ant-design:apple-filled',
'ant-design:apple-outlined',
'ant-design:appstore-add-outlined',
'ant-design:appstore-filled',
'ant-design:appstore-outlined',
'ant-design:appstore-twotone',
'ant-design:area-chart-outlined',
'ant-design:arrow-down-outlined',
'ant-design:arrow-left-outlined',
'ant-design:arrow-right-outlined',
'ant-design:arrow-up-outlined',
'ant-design:arrows-alt-outlined',
'ant-design:audio-filled',
'ant-design:audio-muted-outlined',
'ant-design:audio-outlined',
'ant-design:audio-twotone',
'ant-design:audit-outlined',
'ant-design:backward-filled',
'ant-design:backward-outlined',
'ant-design:bank-filled',
'ant-design:bank-outlined',
'ant-design:bank-twotone',
'ant-design:bar-chart-outlined',
'ant-design:barcode-outlined',
'ant-design:bars-outlined',
'ant-design:behance-circle-filled',
'ant-design:behance-outlined',
'ant-design:behance-square-filled',
'ant-design:behance-square-outlined',
'ant-design:bell-filled',
'ant-design:bell-outlined',
'ant-design:bell-twotone',
'ant-design:bg-colors-outlined',
'ant-design:block-outlined',
'ant-design:bold-outlined',
'ant-design:book-filled',
'ant-design:book-outlined',
'ant-design:book-twotone',
'ant-design:border-bottom-outlined',
'ant-design:border-horizontal-outlined',
'ant-design:border-inner-outlined',
'ant-design:border-left-outlined',
'ant-design:border-outer-outlined',
'ant-design:border-outlined',
'ant-design:border-right-outlined',
'ant-design:border-top-outlined',
'ant-design:border-verticle-outlined',
'ant-design:borderless-table-outlined',
'ant-design:box-plot-filled',
'ant-design:box-plot-outlined',
'ant-design:box-plot-twotone',
'ant-design:branches-outlined',
'ant-design:bug-filled',
'ant-design:bug-outlined',
'ant-design:bug-twotone',
'ant-design:build-filled',
'ant-design:build-outlined',
'ant-design:build-twotone',
'ant-design:bulb-filled',
'ant-design:bulb-outlined',
'ant-design:bulb-twotone',
'ant-design:calculator-filled',
'ant-design:calculator-outlined',
'ant-design:calculator-twotone',
'ant-design:calendar-filled',
'ant-design:calendar-outlined',
'ant-design:calendar-twotone',
'ant-design:camera-filled',
'ant-design:camera-outlined',
'ant-design:camera-twotone',
'ant-design:car-filled',
'ant-design:car-outlined',
'ant-design:car-twotone',
'ant-design:caret-down-filled',
'ant-design:caret-down-outlined',
'ant-design:caret-left-filled',
'ant-design:caret-left-outlined',
'ant-design:caret-right-filled',
'ant-design:caret-right-outlined',
'ant-design:caret-up-filled',
'ant-design:caret-up-outlined',
'ant-design:carry-out-filled',
'ant-design:carry-out-outlined',
'ant-design:carry-out-twotone',
'ant-design:check-circle-filled',
'ant-design:check-circle-outlined',
'ant-design:check-circle-twotone',
'ant-design:check-outlined',
'ant-design:check-square-filled',
'ant-design:check-square-outlined',
'ant-design:check-square-twotone',
'ant-design:chrome-filled',
'ant-design:chrome-outlined',
'ant-design:ci-circle-filled',
'ant-design:ci-circle-outlined',
'ant-design:ci-circle-twotone',
'ant-design:ci-outlined',
'ant-design:ci-twotone',
'ant-design:clear-outlined',
'ant-design:clock-circle-filled',
'ant-design:clock-circle-outlined',
'ant-design:clock-circle-twotone',
'ant-design:close-circle-filled',
'ant-design:close-circle-outlined',
'ant-design:close-circle-twotone',
'ant-design:close-outlined',
'ant-design:close-square-filled',
'ant-design:close-square-outlined',
'ant-design:close-square-twotone',
'ant-design:cloud-download-outlined',
'ant-design:cloud-filled',
'ant-design:cloud-outlined',
'ant-design:cloud-server-outlined',
'ant-design:cloud-sync-outlined',
'ant-design:cloud-twotone',
'ant-design:cloud-upload-outlined',
'ant-design:cluster-outlined',
'ant-design:code-filled',
'ant-design:code-outlined',
'ant-design:code-sandbox-circle-filled',
'ant-design:code-sandbox-outlined',
'ant-design:code-sandbox-square-filled',
'ant-design:code-twotone',
'ant-design:codepen-circle-filled',
'ant-design:codepen-circle-outlined',
'ant-design:codepen-outlined',
'ant-design:codepen-square-filled',
'ant-design:coffee-outlined',
'ant-design:column-height-outlined',
'ant-design:column-width-outlined',
'ant-design:comment-outlined',
'ant-design:compass-filled',
'ant-design:compass-outlined',
'ant-design:compass-twotone',
'ant-design:compress-outlined',
'ant-design:console-sql-outlined',
'ant-design:contacts-filled',
'ant-design:contacts-outlined',
'ant-design:contacts-twotone',
'ant-design:container-filled',
'ant-design:container-outlined',
'ant-design:container-twotone',
'ant-design:control-filled',
'ant-design:control-outlined',
'ant-design:control-twotone',
'ant-design:copy-filled',
'ant-design:copy-outlined',
'ant-design:copy-twotone',
'ant-design:copyright-circle-filled',
'ant-design:copyright-circle-outlined',
'ant-design:copyright-circle-twotone',
'ant-design:copyright-outlined',
'ant-design:copyright-twotone',
'ant-design:credit-card-filled',
'ant-design:credit-card-outlined',
'ant-design:credit-card-twotone',
'ant-design:crown-filled',
'ant-design:crown-outlined',
'ant-design:crown-twotone',
'ant-design:customer-service-filled',
'ant-design:customer-service-outlined',
'ant-design:customer-service-twotone',
'ant-design:dash-outlined',
'ant-design:dashboard-filled',
'ant-design:dashboard-outlined',
'ant-design:dashboard-twotone',
'ant-design:database-filled',
'ant-design:database-outlined',
'ant-design:database-twotone',
'ant-design:delete-column-outlined',
'ant-design:delete-filled',
'ant-design:delete-outlined',
'ant-design:delete-row-outlined',
'ant-design:delete-twotone',
'ant-design:delivered-procedure-outlined',
'ant-design:deployment-unit-outlined',
'ant-design:desktop-outlined',
'ant-design:diff-filled',
'ant-design:diff-outlined',
'ant-design:diff-twotone',
'ant-design:dingding-outlined',
'ant-design:dingtalk-circle-filled',
'ant-design:dingtalk-outlined',
'ant-design:dingtalk-square-filled',
'ant-design:disconnect-outlined',
'ant-design:dislike-filled',
'ant-design:dislike-outlined',
'ant-design:dislike-twotone',
'ant-design:dollar-circle-filled',
'ant-design:dollar-circle-outlined',
'ant-design:dollar-circle-twotone',
'ant-design:dollar-outlined',
'ant-design:dollar-twotone',
'ant-design:dot-chart-outlined',
'ant-design:double-left-outlined',
'ant-design:double-right-outlined',
'ant-design:down-circle-filled',
'ant-design:down-circle-outlined',
'ant-design:down-circle-twotone',
'ant-design:down-outlined',
'ant-design:down-square-filled',
'ant-design:down-square-outlined',
'ant-design:down-square-twotone',
'ant-design:download-outlined',
'ant-design:drag-outlined',
'ant-design:dribbble-circle-filled',
'ant-design:dribbble-outlined',
'ant-design:dribbble-square-filled',
'ant-design:dribbble-square-outlined',
'ant-design:dropbox-circle-filled',
'ant-design:dropbox-outlined',
'ant-design:dropbox-square-filled',
'ant-design:edit-filled',
'ant-design:edit-outlined',
'ant-design:edit-twotone',
'ant-design:ellipsis-outlined',
'ant-design:enter-outlined',
'ant-design:environment-filled',
'ant-design:environment-outlined',
'ant-design:environment-twotone',
'ant-design:euro-circle-filled',
'ant-design:euro-circle-outlined',
'ant-design:euro-circle-twotone',
'ant-design:euro-outlined',
'ant-design:euro-twotone',
'ant-design:exception-outlined',
'ant-design:exclamation-circle-filled',
'ant-design:exclamation-circle-outlined',
'ant-design:exclamation-circle-twotone',
'ant-design:exclamation-outlined',
'ant-design:expand-alt-outlined',
'ant-design:expand-outlined',
'ant-design:experiment-filled',
'ant-design:experiment-outlined',
'ant-design:experiment-twotone',
'ant-design:export-outlined',
'ant-design:eye-filled',
'ant-design:eye-invisible-filled',
'ant-design:eye-invisible-outlined',
'ant-design:eye-invisible-twotone',
'ant-design:eye-outlined',
'ant-design:eye-twotone',
'ant-design:facebook-filled',
'ant-design:facebook-outlined',
'ant-design:fall-outlined',
'ant-design:fast-backward-filled',
'ant-design:fast-backward-outlined',
'ant-design:fast-forward-filled',
'ant-design:fast-forward-outlined',
'ant-design:field-binary-outlined',
'ant-design:field-number-outlined',
'ant-design:field-string-outlined',
'ant-design:field-time-outlined',
'ant-design:file-add-filled',
'ant-design:file-add-outlined',
'ant-design:file-add-twotone',
'ant-design:file-done-outlined',
'ant-design:file-excel-filled',
'ant-design:file-excel-outlined',
'ant-design:file-excel-twotone',
'ant-design:file-exclamation-filled',
'ant-design:file-exclamation-outlined',
'ant-design:file-exclamation-twotone',
'ant-design:file-filled',
'ant-design:file-gif-outlined',
'ant-design:file-image-filled',
'ant-design:file-image-outlined',
'ant-design:file-image-twotone',
'ant-design:file-jpg-outlined',
'ant-design:file-markdown-filled',
'ant-design:file-markdown-outlined',
'ant-design:file-markdown-twotone',
'ant-design:file-outlined',
'ant-design:file-pdf-filled',
'ant-design:file-pdf-outlined',
'ant-design:file-pdf-twotone',
'ant-design:file-ppt-filled',
'ant-design:file-ppt-outlined',
'ant-design:file-ppt-twotone',
'ant-design:file-protect-outlined',
'ant-design:file-search-outlined',
'ant-design:file-sync-outlined',
'ant-design:file-text-filled',
'ant-design:file-text-outlined',
'ant-design:file-text-twotone',
'ant-design:file-twotone',
'ant-design:file-unknown-filled',
'ant-design:file-unknown-outlined',
'ant-design:file-unknown-twotone',
'ant-design:file-word-filled',
'ant-design:file-word-outlined',
'ant-design:file-word-twotone',
'ant-design:file-zip-filled',
'ant-design:file-zip-outlined',
'ant-design:file-zip-twotone',
'ant-design:filter-filled',
'ant-design:filter-outlined',
'ant-design:filter-twotone',
'ant-design:fire-filled',
'ant-design:fire-outlined',
'ant-design:fire-twotone',
'ant-design:flag-filled',
'ant-design:flag-outlined',
'ant-design:flag-twotone',
'ant-design:folder-add-filled',
'ant-design:folder-add-outlined',
'ant-design:folder-add-twotone',
'ant-design:folder-filled',
'ant-design:folder-open-filled',
'ant-design:folder-open-outlined',
'ant-design:folder-open-twotone',
'ant-design:folder-outlined',
'ant-design:folder-twotone',
'ant-design:folder-view-outlined',
'ant-design:font-colors-outlined',
'ant-design:font-size-outlined',
'ant-design:fork-outlined',
'ant-design:form-outlined',
'ant-design:format-painter-filled',
'ant-design:format-painter-outlined',
'ant-design:forward-filled',
'ant-design:forward-outlined',
'ant-design:frown-filled',
'ant-design:frown-outlined',
'ant-design:frown-twotone',
'ant-design:fullscreen-exit-outlined',
'ant-design:fullscreen-outlined',
'ant-design:function-outlined',
'ant-design:fund-filled',
'ant-design:fund-outlined',
'ant-design:fund-projection-screen-outlined',
'ant-design:fund-twotone',
'ant-design:fund-view-outlined',
'ant-design:funnel-plot-filled',
'ant-design:funnel-plot-outlined',
'ant-design:funnel-plot-twotone',
'ant-design:gateway-outlined',
'ant-design:gif-outlined',
'ant-design:gift-filled',
'ant-design:gift-outlined',
'ant-design:gift-twotone',
'ant-design:github-filled',
'ant-design:github-outlined',
'ant-design:gitlab-filled',
'ant-design:gitlab-outlined',
'ant-design:global-outlined',
'ant-design:gold-filled',
'ant-design:gold-outlined',
'ant-design:gold-twotone',
'ant-design:golden-filled',
'ant-design:google-circle-filled',
'ant-design:google-outlined',
'ant-design:google-plus-circle-filled',
'ant-design:google-plus-outlined',
'ant-design:google-plus-square-filled',
'ant-design:google-square-filled',
'ant-design:group-outlined',
'ant-design:hdd-filled',
'ant-design:hdd-outlined',
'ant-design:hdd-twotone',
'ant-design:heart-filled',
'ant-design:heart-outlined',
'ant-design:heart-twotone',
'ant-design:heat-map-outlined',
'ant-design:highlight-filled',
'ant-design:highlight-outlined',
'ant-design:highlight-twotone',
'ant-design:history-outlined',
'ant-design:holder-outlined',
'ant-design:home-filled',
'ant-design:home-outlined',
'ant-design:home-twotone',
'ant-design:hourglass-filled',
'ant-design:hourglass-outlined',
'ant-design:hourglass-twotone',
'ant-design:html5-filled',
'ant-design:html5-outlined',
'ant-design:html5-twotone',
'ant-design:idcard-filled',
'ant-design:idcard-outlined',
'ant-design:idcard-twotone',
'ant-design:ie-circle-filled',
'ant-design:ie-outlined',
'ant-design:ie-square-filled',
'ant-design:import-outlined',
'ant-design:inbox-outlined',
'ant-design:info-circle-filled',
'ant-design:info-circle-outlined',
'ant-design:info-circle-twotone',
'ant-design:info-outlined',
'ant-design:insert-row-above-outlined',
'ant-design:insert-row-below-outlined',
'ant-design:insert-row-left-outlined',
'ant-design:insert-row-right-outlined',
'ant-design:instagram-filled',
'ant-design:instagram-outlined',
'ant-design:insurance-filled',
'ant-design:insurance-outlined',
'ant-design:insurance-twotone',
'ant-design:interaction-filled',
'ant-design:interaction-outlined',
'ant-design:interaction-twotone',
'ant-design:issues-close-outlined',
'ant-design:italic-outlined',
'ant-design:key-outlined',
'ant-design:laptop-outlined',
'ant-design:layout-filled',
'ant-design:layout-outlined',
'ant-design:layout-twotone',
'ant-design:left-circle-filled',
'ant-design:left-circle-outlined',
'ant-design:left-circle-twotone',
'ant-design:left-outlined',
'ant-design:left-square-filled',
'ant-design:left-square-outlined',
'ant-design:left-square-twotone',
'ant-design:like-filled',
'ant-design:like-outlined',
'ant-design:like-twotone',
'ant-design:line-chart-outlined',
'ant-design:line-height-outlined',
'ant-design:line-outlined',
'ant-design:link-outlined',
'ant-design:linkedin-filled',
'ant-design:linkedin-outlined',
'ant-design:loading-3-quarters-outlined',
'ant-design:loading-outlined',
'ant-design:lock-filled',
'ant-design:lock-outlined',
'ant-design:lock-twotone',
'ant-design:login-outlined',
'ant-design:logout-outlined',
'ant-design:mac-command-filled',
'ant-design:mac-command-outlined',
'ant-design:mail-filled',
'ant-design:mail-outlined',
'ant-design:mail-twotone',
'ant-design:man-outlined',
'ant-design:medicine-box-filled',
'ant-design:medicine-box-outlined',
'ant-design:medicine-box-twotone',
'ant-design:medium-circle-filled',
'ant-design:medium-outlined',
'ant-design:medium-square-filled',
'ant-design:medium-workmark-outlined',
'ant-design:meh-filled',
'ant-design:meh-outlined',
'ant-design:meh-twotone',
'ant-design:menu-fold-outlined',
'ant-design:menu-outlined',
'ant-design:menu-unfold-outlined',
'ant-design:merge-cells-outlined',
'ant-design:message-filled',
'ant-design:message-outlined',
'ant-design:message-twotone',
'ant-design:minus-circle-filled',
'ant-design:minus-circle-outlined',
'ant-design:minus-circle-twotone',
'ant-design:minus-outlined',
'ant-design:minus-square-filled',
'ant-design:minus-square-outlined',
'ant-design:minus-square-twotone',
'ant-design:mobile-filled',
'ant-design:mobile-outlined',
'ant-design:mobile-twotone',
'ant-design:money-collect-filled',
'ant-design:money-collect-outlined',
'ant-design:money-collect-twotone',
'ant-design:monitor-outlined',
'ant-design:more-outlined',
'ant-design:node-collapse-outlined',
'ant-design:node-expand-outlined',
'ant-design:node-index-outlined',
'ant-design:notification-filled',
'ant-design:notification-outlined',
'ant-design:notification-twotone',
'ant-design:number-outlined',
'ant-design:one-to-one-outlined',
'ant-design:ordered-list-outlined',
'ant-design:paper-clip-outlined',
'ant-design:partition-outlined',
'ant-design:pause-circle-filled',
'ant-design:pause-circle-outlined',
'ant-design:pause-circle-twotone',
'ant-design:pause-outlined',
'ant-design:pay-circle-filled',
'ant-design:pay-circle-outlined',
'ant-design:percentage-outlined',
'ant-design:phone-filled',
'ant-design:phone-outlined',
'ant-design:phone-twotone',
'ant-design:pic-center-outlined',
'ant-design:pic-left-outlined',
'ant-design:pic-right-outlined',
'ant-design:picture-filled',
'ant-design:picture-outlined',
'ant-design:picture-twotone',
'ant-design:pie-chart-filled',
'ant-design:pie-chart-outlined',
'ant-design:pie-chart-twotone',
'ant-design:play-circle-filled',
'ant-design:play-circle-outlined',
'ant-design:play-circle-twotone',
'ant-design:play-square-filled',
'ant-design:play-square-outlined',
'ant-design:play-square-twotone',
'ant-design:plus-circle-filled',
'ant-design:plus-circle-outlined',
'ant-design:plus-circle-twotone',
'ant-design:plus-outlined',
'ant-design:plus-square-filled',
'ant-design:plus-square-outlined',
'ant-design:plus-square-twotone',
'ant-design:pound-circle-filled',
'ant-design:pound-circle-outlined',
'ant-design:pound-circle-twotone',
'ant-design:pound-outlined',
'ant-design:poweroff-outlined',
'ant-design:printer-filled',
'ant-design:printer-outlined',
'ant-design:printer-twotone',
'ant-design:profile-filled',
'ant-design:profile-outlined',
'ant-design:profile-twotone',
'ant-design:project-filled',
'ant-design:project-outlined',
'ant-design:project-twotone',
'ant-design:property-safety-filled',
'ant-design:property-safety-outlined',
'ant-design:property-safety-twotone',
'ant-design:pull-request-outlined',
'ant-design:pushpin-filled',
'ant-design:pushpin-outlined',
'ant-design:pushpin-twotone',
'ant-design:qq-circle-filled',
'ant-design:qq-outlined',
'ant-design:qq-square-filled',
'ant-design:qrcode-outlined',
'ant-design:question-circle-filled',
'ant-design:question-circle-outlined',
'ant-design:question-circle-twotone',
'ant-design:question-outlined',
'ant-design:radar-chart-outlined',
'ant-design:radius-bottomleft-outlined',
'ant-design:radius-bottomright-outlined',
'ant-design:radius-setting-outlined',
'ant-design:radius-upleft-outlined',
'ant-design:radius-upright-outlined',
'ant-design:read-filled',
'ant-design:read-outlined',
'ant-design:reconciliation-filled',
'ant-design:reconciliation-outlined',
'ant-design:reconciliation-twotone',
'ant-design:red-envelope-filled',
'ant-design:red-envelope-outlined',
'ant-design:red-envelope-twotone',
'ant-design:reddit-circle-filled',
'ant-design:reddit-outlined',
'ant-design:reddit-square-filled',
'ant-design:redo-outlined',
'ant-design:reload-outlined',
'ant-design:rest-filled',
'ant-design:rest-outlined',
'ant-design:rest-twotone',
'ant-design:retweet-outlined',
'ant-design:right-circle-filled',
'ant-design:right-circle-outlined',
'ant-design:right-circle-twotone',
'ant-design:right-outlined',
'ant-design:right-square-filled',
'ant-design:right-square-outlined',
'ant-design:right-square-twotone',
'ant-design:rise-outlined',
'ant-design:robot-filled',
'ant-design:robot-outlined',
'ant-design:rocket-filled',
'ant-design:rocket-outlined',
'ant-design:rocket-twotone',
'ant-design:rollback-outlined',
'ant-design:rotate-left-outlined',
'ant-design:rotate-right-outlined',
'ant-design:safety-certificate-filled',
'ant-design:safety-certificate-outlined',
'ant-design:safety-certificate-twotone',
'ant-design:safety-outlined',
'ant-design:save-filled',
'ant-design:save-outlined',
'ant-design:save-twotone',
'ant-design:scan-outlined',
'ant-design:schedule-filled',
'ant-design:schedule-outlined',
'ant-design:schedule-twotone',
'ant-design:scissor-outlined',
'ant-design:search-outlined',
'ant-design:security-scan-filled',
'ant-design:security-scan-outlined',
'ant-design:security-scan-twotone',
'ant-design:select-outlined',
'ant-design:send-outlined',
'ant-design:setting-filled',
'ant-design:setting-outlined',
'ant-design:setting-twotone',
'ant-design:shake-outlined',
'ant-design:share-alt-outlined',
'ant-design:shop-filled',
'ant-design:shop-outlined',
'ant-design:shop-twotone',
'ant-design:shopping-cart-outlined',
'ant-design:shopping-filled',
'ant-design:shopping-outlined',
'ant-design:shopping-twotone',
'ant-design:shrink-outlined',
'ant-design:signal-filled',
'ant-design:sisternode-outlined',
'ant-design:sketch-circle-filled',
'ant-design:sketch-outlined',
'ant-design:sketch-square-filled',
'ant-design:skin-filled',
'ant-design:skin-outlined',
'ant-design:skin-twotone',
'ant-design:skype-filled',
'ant-design:skype-outlined',
'ant-design:slack-circle-filled',
'ant-design:slack-outlined',
'ant-design:slack-square-filled',
'ant-design:slack-square-outlined',
'ant-design:sliders-filled',
'ant-design:sliders-outlined',
'ant-design:sliders-twotone',
'ant-design:small-dash-outlined',
'ant-design:smile-filled',
'ant-design:smile-outlined',
'ant-design:smile-twotone',
'ant-design:snippets-filled',
'ant-design:snippets-outlined',
'ant-design:snippets-twotone',
'ant-design:solution-outlined',
'ant-design:sort-ascending-outlined',
'ant-design:sort-descending-outlined',
'ant-design:sound-filled',
'ant-design:sound-outlined',
'ant-design:sound-twotone',
'ant-design:split-cells-outlined',
'ant-design:star-filled',
'ant-design:star-outlined',
'ant-design:star-twotone',
'ant-design:step-backward-filled',
'ant-design:step-backward-outlined',
'ant-design:step-forward-filled',
'ant-design:step-forward-outlined',
'ant-design:stock-outlined',
'ant-design:stop-filled',
'ant-design:stop-outlined',
'ant-design:stop-twotone',
'ant-design:strikethrough-outlined',
'ant-design:subnode-outlined',
'ant-design:swap-left-outlined',
'ant-design:swap-outlined',
'ant-design:swap-right-outlined',
'ant-design:switcher-filled',
'ant-design:switcher-outlined',
'ant-design:switcher-twotone',
'ant-design:sync-outlined',
'ant-design:table-outlined',
'ant-design:tablet-filled',
'ant-design:tablet-outlined',
'ant-design:tablet-twotone',
'ant-design:tag-filled',
'ant-design:tag-outlined',
'ant-design:tag-twotone',
'ant-design:tags-filled',
'ant-design:tags-outlined',
'ant-design:tags-twotone',
'ant-design:taobao-circle-filled',
'ant-design:taobao-circle-outlined',
'ant-design:taobao-outlined',
'ant-design:taobao-square-filled',
'ant-design:team-outlined',
'ant-design:thunderbolt-filled',
'ant-design:thunderbolt-outlined',
'ant-design:thunderbolt-twotone',
'ant-design:to-top-outlined',
'ant-design:tool-filled',
'ant-design:tool-outlined',
'ant-design:tool-twotone',
'ant-design:trademark-circle-filled',
'ant-design:trademark-circle-outlined',
'ant-design:trademark-circle-twotone',
'ant-design:trademark-outlined',
'ant-design:transaction-outlined',
'ant-design:translation-outlined',
'ant-design:trophy-filled',
'ant-design:trophy-outlined',
'ant-design:trophy-twotone',
'ant-design:twitter-circle-filled',
'ant-design:twitter-outlined',
'ant-design:twitter-square-filled',
'ant-design:underline-outlined',
'ant-design:undo-outlined',
'ant-design:ungroup-outlined',
'ant-design:unlock-filled',
'ant-design:unlock-outlined',
'ant-design:unlock-twotone',
'ant-design:unordered-list-outlined',
'ant-design:up-circle-filled',
'ant-design:up-circle-outlined',
'ant-design:up-circle-twotone',
'ant-design:up-outlined',
'ant-design:up-square-filled',
'ant-design:up-square-outlined',
'ant-design:up-square-twotone',
'ant-design:upload-outlined',
'ant-design:usb-filled',
'ant-design:usb-outlined',
'ant-design:usb-twotone',
'ant-design:user-add-outlined',
'ant-design:user-delete-outlined',
'ant-design:user-outlined',
'ant-design:user-switch-outlined',
'ant-design:usergroup-add-outlined',
'ant-design:usergroup-delete-outlined',
'ant-design:verified-outlined',
'ant-design:vertical-align-bottom-outlined',
'ant-design:vertical-align-middle-outlined',
'ant-design:vertical-align-top-outlined',
'ant-design:vertical-left-outlined',
'ant-design:vertical-right-outlined',
'ant-design:video-camera-add-outlined',
'ant-design:video-camera-filled',
'ant-design:video-camera-outlined',
'ant-design:video-camera-twotone',
'ant-design:wallet-filled',
'ant-design:wallet-outlined',
'ant-design:wallet-twotone',
'ant-design:warning-filled',
'ant-design:warning-outlined',
'ant-design:warning-twotone',
'ant-design:wechat-filled',
'ant-design:wechat-outlined',
'ant-design:weibo-circle-filled',
'ant-design:weibo-circle-outlined',
'ant-design:weibo-outlined',
'ant-design:weibo-square-filled',
'ant-design:weibo-square-outlined',
'ant-design:whats-app-outlined',
'ant-design:wifi-outlined',
'ant-design:windows-filled',
'ant-design:windows-outlined',
'ant-design:woman-outlined',
'ant-design:yahoo-filled',
'ant-design:yahoo-outlined',
'ant-design:youtube-filled',
'ant-design:youtube-outlined',
'ant-design:yuque-filled',
'ant-design:yuque-outlined',
'ant-design:zhihu-circle-filled',
'ant-design:zhihu-outlined',
'ant-design:zhihu-square-filled',
'ant-design:zoom-in-outlined',
'ant-design:zoom-out-outlined'
]
}

299
src/components/IconPicker/src/data/icons.ep.ts Normal file
View File

@ -0,0 +1,299 @@
export default {
name: 'Element Plus',
prefix: 'ep',
icons: [
'ep:add-location',
'ep:aim',
'ep:alarm-clock',
'ep:apple',
'ep:arrow-down',
'ep:arrow-down-bold',
'ep:arrow-left',
'ep:arrow-left-bold',
'ep:arrow-right',
'ep:arrow-right-bold',
'ep:arrow-up',
'ep:arrow-up-bold',
'ep:avatar',
'ep:back',
'ep:baseball',
'ep:basketball',
'ep:bell',
'ep:bell-filled',
'ep:bicycle',
'ep:bottom',
'ep:bottom-left',
'ep:bottom-right',
'ep:bowl',
'ep:box',
'ep:briefcase',
'ep:brush',
'ep:brush-filled',
'ep:burger',
'ep:calendar',
'ep:camera',
'ep:camera-filled',
'ep:caret-bottom',
'ep:caret-left',
'ep:caret-right',
'ep:caret-top',
'ep:cellphone',
'ep:chat-dot-round',
'ep:chat-dot-square',
'ep:chat-line-round',
'ep:chat-line-square',
'ep:chat-round',
'ep:chat-square',
'ep:check',
'ep:checked',
'ep:cherry',
'ep:chicken',
'ep:chrome-filled',
'ep:circle-check',
'ep:circle-check-filled',
'ep:circle-close',
'ep:circle-close-filled',
'ep:circle-plus',
'ep:circle-plus-filled',
'ep:clock',
'ep:close',
'ep:close-bold',
'ep:cloudy',
'ep:coffee',
'ep:coffee-cup',
'ep:coin',
'ep:cold-drink',
'ep:collection',
'ep:collection-tag',
'ep:comment',
'ep:compass',
'ep:connection',
'ep:coordinate',
'ep:copy-document',
'ep:cpu',
'ep:credit-card',
'ep:crop',
'ep:d-arrow-left',
'ep:d-arrow-right',
'ep:d-caret',
'ep:data-analysis',
'ep:data-board',
'ep:data-line',
'ep:delete',
'ep:delete-filled',
'ep:delete-location',
'ep:dessert',
'ep:discount',
'ep:dish',
'ep:dish-dot',
'ep:document',
'ep:document-add',
'ep:document-checked',
'ep:document-copy',
'ep:document-delete',
'ep:document-remove',
'ep:download',
'ep:drizzling',
'ep:edit',
'ep:edit-pen',
'ep:eleme',
'ep:eleme-filled',
'ep:element-plus',
'ep:expand',
'ep:failed',
'ep:female',
'ep:files',
'ep:film',
'ep:filter',
'ep:finished',
'ep:first-aid-kit',
'ep:flag',
'ep:fold',
'ep:folder',
'ep:folder-add',
'ep:folder-checked',
'ep:folder-delete',
'ep:folder-opened',
'ep:folder-remove',
'ep:food',
'ep:football',
'ep:fork-spoon',
'ep:fries',
'ep:full-screen',
'ep:goblet',
'ep:goblet-full',
'ep:goblet-square',
'ep:goblet-square-full',
'ep:gold-medal',
'ep:goods',
'ep:goods-filled',
'ep:grape',
'ep:grid',
'ep:guide',
'ep:handbag',
'ep:headset',
'ep:help',
'ep:help-filled',
'ep:hide',
'ep:histogram',
'ep:home-filled',
'ep:hot-water',
'ep:house',
'ep:ice-cream',
'ep:ice-cream-round',
'ep:ice-cream-square',
'ep:ice-drink',
'ep:ice-tea',
'ep:info-filled',
'ep:iphone',
'ep:key',
'ep:knife-fork',
'ep:lightning',
'ep:link',
'ep:list',
'ep:loading',
'ep:location',
'ep:location-filled',
'ep:location-information',
'ep:lock',
'ep:lollipop',
'ep:magic-stick',
'ep:magnet',
'ep:male',
'ep:management',
'ep:map-location',
'ep:medal',
'ep:memo',
'ep:menu',
'ep:message',
'ep:message-box',
'ep:mic',
'ep:microphone',
'ep:milk-tea',
'ep:minus',
'ep:money',
'ep:monitor',
'ep:moon',
'ep:moon-night',
'ep:more',
'ep:more-filled',
'ep:mostly-cloudy',
'ep:mouse',
'ep:mug',
'ep:mute',
'ep:mute-notification',
'ep:no-smoking',
'ep:notebook',
'ep:notification',
'ep:odometer',
'ep:office-building',
'ep:open',
'ep:operation',
'ep:opportunity',
'ep:orange',
'ep:paperclip',
'ep:partly-cloudy',
'ep:pear',
'ep:phone',
'ep:phone-filled',
'ep:picture',
'ep:picture-filled',
'ep:picture-rounded',
'ep:pie-chart',
'ep:place',
'ep:platform',
'ep:plus',
'ep:pointer',
'ep:position',
'ep:postcard',
'ep:pouring',
'ep:present',
'ep:price-tag',
'ep:printer',
'ep:promotion',
'ep:quartz-watch',
'ep:question-filled',
'ep:rank',
'ep:reading',
'ep:reading-lamp',
'ep:refresh',
'ep:refresh-left',
'ep:refresh-right',
'ep:refrigerator',
'ep:remove',
'ep:remove-filled',
'ep:right',
'ep:scale-to-original',
'ep:school',
'ep:scissor',
'ep:search',
'ep:select',
'ep:sell',
'ep:semi-select',
'ep:service',
'ep:set-up',
'ep:setting',
'ep:share',
'ep:ship',
'ep:shop',
'ep:shopping-bag',
'ep:shopping-cart',
'ep:shopping-cart-full',
'ep:shopping-trolley',
'ep:smoking',
'ep:soccer',
'ep:sold-out',
'ep:sort',
'ep:sort-down',
'ep:sort-up',
'ep:stamp',
'ep:star',
'ep:star-filled',
'ep:stopwatch',
'ep:success-filled',
'ep:sugar',
'ep:suitcase',
'ep:suitcase-line',
'ep:sunny',
'ep:sunrise',
'ep:sunset',
'ep:switch',
'ep:switch-button',
'ep:switch-filled',
'ep:takeaway-box',
'ep:ticket',
'ep:tickets',
'ep:timer',
'ep:toilet-paper',
'ep:tools',
'ep:top',
'ep:top-left',
'ep:top-right',
'ep:trend-charts',
'ep:trophy',
'ep:trophy-base',
'ep:turn-off',
'ep:umbrella',
'ep:unlock',
'ep:upload',
'ep:upload-filled',
'ep:user',
'ep:user-filled',
'ep:van',
'ep:video-camera',
'ep:video-camera-filled',
'ep:video-pause',
'ep:video-play',
'ep:view',
'ep:wallet',
'ep:wallet-filled',
'ep:warn-triangle-filled',
'ep:warning',
'ep:warning-filled',
'ep:watch',
'ep:watermelon',
'ep:wind-power',
'ep:zoom-in',
'ep:zoom-out'
]
}

1209
src/components/IconPicker/src/data/icons.tdesign.ts Normal file
View File

File diff suppressed because it is too large Load Diff

3
src/locales/en.ts
View File

@ -174,7 +174,8 @@ export default {
permission: 'Permission test page',
function: 'Function',
multipleTabs: 'Multiple tabs',
details: 'Details'
details: 'Details',
iconPicker: 'Icon picker'
},
permission: {
hasPermission: 'Please set the operation permission value'

3
src/locales/zh-CN.ts
View File

@ -172,7 +172,8 @@ export default {
permission: '权限测试页',
function: '功能',
multipleTabs: '多开标签页',
details: '详情页'
details: '详情页',
iconPicker: '图标选择器'
},
permission: {
hasPermission: '请设置操作权限值'

8
src/router/index.ts
View File

@ -271,6 +271,14 @@ export const asyncRouterMap: AppRouteRecordRaw[] = [
title: t('router.icon')
}
},
{
path: 'icon-picker',
component: () => import('@/views/Components/IconPicker.vue'),
name: 'IconPicker',
meta: {
title: t('router.iconPicker')
}
},
{
path: 'echart',
component: () => import('@/views/Components/Echart.vue'),

7
src/views/Components/IconPicker.vue Normal file
View File

@ -0,0 +1,7 @@
<script setup lang="ts">
import { IconPicker } from '@/components/IconPicker'
</script>
<template>
<IconPicker />
</template>