浏览代码

新增字典组件

tongshangming 2 年之前
父节点
当前提交
a7634eebbf
共有 4 个文件被更改,包括 38 次插入2 次删除
  1. 1 0
      src/components.d.ts
  2. 28 0
      src/components/ElDict.vue
  3. 2 0
      src/components/index.ts
  4. 7 2
      src/views/form/Basic.vue

+ 1 - 0
src/components.d.ts

@@ -10,6 +10,7 @@ declare module '@vue/runtime-core' {
     AdvancedForm: typeof import('./components/form/AdvancedForm.vue')['default']
     BasicForm: typeof import('./components/form/BasicForm.vue')['default']
     DialogForm: typeof import('./components/form/DialogForm.vue')['default']
+    ElDict: typeof import('./components/ElDict.vue')['default']
     ElEditor: typeof import('./components/ElEditor.vue')['default']
     Exception: typeof import('./components/Exception.vue')['default']
     FormComp: typeof import('./components/form/FormComp.vue')['default']

+ 28 - 0
src/components/ElDict.vue

@@ -0,0 +1,28 @@
+<script lang="ts" setup>
+import { getDict } from '@/utils/dict'
+
+interface Props {
+  modelValue: any
+  type: string
+}
+const props = defineProps<Props>()
+const emits = defineEmits(['update:modelValue'])
+
+const modelValue = computed({
+  get: () => props.modelValue,
+  set: value => emits('update:modelValue', value)
+})
+
+const options = ref<any>([])
+getDict(props.type).then(res => {
+  options.value = res
+})
+</script>
+
+<template>
+  <el-select v-model="modelValue">
+    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
+  </el-select>
+</template>
+
+<style lang="scss" scoped></style>

+ 2 - 0
src/components/index.ts

@@ -1,8 +1,10 @@
 import type { App } from 'vue'
 import ElEditor from './ElEditor.vue'
+import ElDict from './ElDict.vue'
 
 function registerCopmponent(app: App): void {
   app.component('ElEditor', ElEditor)
+  app.component('ElDict', ElDict)
 }
 
 export default registerCopmponent

+ 7 - 2
src/views/form/Basic.vue

@@ -41,10 +41,15 @@ const formConfig = reactive<BasicForm>({
       }
     },
     {
-      label: '字段名',
+      label: '字',
       value: '',
       name: 'field1',
-      type: 'input'
+      type: 'dict',
+      props: {
+        type: 'task_from',
+        clearable: true,
+        multiple: true
+      }
     },
     {
       label: '字段名',