From 9f704fb8ffad0592aadda82b69b2aab37f98c79c Mon Sep 17 00:00:00 2001 From: puhui999 Date: Mon, 6 May 2024 02:12:09 +0800 Subject: [PATCH] =?UTF-8?q?form-create:=20=E5=AD=97=E4=BD=93=E5=9B=BE?= =?UTF-8?q?=E6=A0=87=E6=89=A9=E5=B1=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/config/useDictSelectRule.ts | 2 +- .../FormCreate/src/config/useSelectRule.ts | 2 +- src/components/FormCreate/src/type/index.ts | 1 + .../FormCreate/src/useFormCreateDesigner.ts | 13 +++++++++-- src/styles/FormCreate/fonts/fontello.woff | Bin 0 -> 4252 bytes src/styles/FormCreate/index.scss | 22 ++++++++++++++++++ src/styles/index.scss | 1 + 7 files changed, 37 insertions(+), 4 deletions(-) create mode 100644 src/styles/FormCreate/fonts/fontello.woff create mode 100644 src/styles/FormCreate/index.scss diff --git a/src/components/FormCreate/src/config/useDictSelectRule.ts b/src/components/FormCreate/src/config/useDictSelectRule.ts index d158842c..3db630bc 100644 --- a/src/components/FormCreate/src/config/useDictSelectRule.ts +++ b/src/components/FormCreate/src/config/useDictSelectRule.ts @@ -22,7 +22,7 @@ export const useDictSelectRule = () => { })) ?? [] }) return { - icon: 'icon-select', + icon: 'icon-doc-text', label, name, rule() { diff --git a/src/components/FormCreate/src/config/useSelectRule.ts b/src/components/FormCreate/src/config/useSelectRule.ts index 93c6e8d5..732c5269 100644 --- a/src/components/FormCreate/src/config/useSelectRule.ts +++ b/src/components/FormCreate/src/config/useSelectRule.ts @@ -11,7 +11,7 @@ export const useSelectRule = (option: SelectRuleOption) => { const label = option.label const name = option.name return { - icon: 'icon-select', + icon: option.icon, label, name, rule() { diff --git a/src/components/FormCreate/src/type/index.ts b/src/components/FormCreate/src/type/index.ts index 07e011cf..42dccc76 100644 --- a/src/components/FormCreate/src/type/index.ts +++ b/src/components/FormCreate/src/type/index.ts @@ -45,5 +45,6 @@ export interface ApiSelectProps { export interface SelectRuleOption { label: string // label 名称 name: string // 组件名称 + icon: string // 组件图标 props?: any[] // 组件规则 } diff --git a/src/components/FormCreate/src/useFormCreateDesigner.ts b/src/components/FormCreate/src/useFormCreateDesigner.ts index 266739c7..69c8f314 100644 --- a/src/components/FormCreate/src/useFormCreateDesigner.ts +++ b/src/components/FormCreate/src/useFormCreateDesigner.ts @@ -48,12 +48,21 @@ export const useFormCreateDesigner = async (designer: Ref) => { }) } - const userSelectRule = useSelectRule({ name: 'UserSelect', label: '用户选择器' }) - const deptSelectRule = useSelectRule({ name: 'DeptSelect', label: '部门选择器' }) + const userSelectRule = useSelectRule({ + name: 'UserSelect', + label: '用户选择器', + icon: 'icon-user-o' + }) + const deptSelectRule = useSelectRule({ + name: 'DeptSelect', + label: '部门选择器', + icon: 'icon-address-card-o' + }) const dictSelectRule = useDictSelectRule() const apiSelectRule0 = useSelectRule({ name: 'ApiSelect', label: '接口选择器', + icon: 'icon-server', props: [...apiSelectRule] }) diff --git a/src/styles/FormCreate/fonts/fontello.woff b/src/styles/FormCreate/fonts/fontello.woff new file mode 100644 index 0000000000000000000000000000000000000000..1e00f4995b27e72b52d7d0fcf602d0206c3d6c89 GIT binary patch literal 4252 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 literal 0 HcmV?d00001 diff --git a/src/styles/FormCreate/index.scss b/src/styles/FormCreate/index.scss new file mode 100644 index 00000000..bb620005 --- /dev/null +++ b/src/styles/FormCreate/index.scss @@ -0,0 +1,22 @@ +// 使用字体图标来源 https://fontello.com/ + +@font-face { + font-family: 'fc-icon'; + src: url('@/styles/FormCreate/fonts/fontello.woff') format('woff'); +} + +.icon-doc-text:before { + content: '\f0f6'; +} + +.icon-server:before { + content: '\f233'; +} + +.icon-address-card-o:before { + content: '\f2bc'; +} + +.icon-user-o:before { + content: '\f2c0'; +} diff --git a/src/styles/index.scss b/src/styles/index.scss index 0952bd07..fbe76f23 100644 --- a/src/styles/index.scss +++ b/src/styles/index.scss @@ -1,4 +1,5 @@ @import './var.css'; +@import './FormCreate/index.scss'; @import 'element-plus/theme-chalk/dark/css-vars.css'; .reset-margin [class*='el-icon'] + span {