【新增】字典选择器组件

Signed-off-by: CyberShen123 <8096927+CyberShen123@user.noreply.gitee.com>

snowy-admin-web/src/components/DictSelect/README.md

@@ -0,0 +1,34 @@
+## 小诺字典选择器组件
+
+字典选择器，支持下拉框和按钮组两种组件。
+
+
+
+### 使用示例
+
+```vue
+<xn-dict-select v-model:value="formData.category" dict-type="ORG_CATEGORY" option-type="dropdown" allow-clear />
+```
+
+
+
+### API
+
+#### props
+
+| 参数           | 说明                                                    | 类型    | 默认值     |
+| -------------- | ------------------------------------------------------- | ------- | ---------- |
+| value(v-model) | 指定当前选中的条目                                      | string  | -          |
+| dictType       | 字典名称                                                | string  | -          |
+| optionType     | 组件形式：下拉框或按钮组('dropdown'\|'radio'\|'button') | string  | 'dropdown' |
+| disabled       | 禁用组件                                                | boolean | false      |
+| size           | 组件尺寸（'small'\|'middle'\|'large'）                  | string  | 'middle'   |
+| allowClear     | 支持清除(仅支持'dropdown'组件)                          | boolean | false      |
+| placeholder    | 选择框默认文字(仅支持'dropdown'组件)                    | string  | -          |
+
+#### 事件
+
+| 事件名称 | 说明                 | 回调参数        |
+| -------- | -------------------- | --------------- |
+| change   | 选中option调用此函数 | function(value) |
+

snowy-admin-web/src/components/DictSelect/index.vue

@@ -0,0 +1,91 @@
+<template>
+  <a-select 
+    v-if="props.optionType === 'dropdown'"
+    :model-value="props.value" 
+    :placeholder="props.placeholder" 
+    :options="dictOptions" 
+    :disabled="props.disabled"
+    :size="props.size"
+    :allowClear="props.allowClear"
+    @change="handleChange" 
+  />
+
+  <a-radio-group 
+    v-if="props.optionType === 'radio' || props.optionType === 'button'"
+    :model-value="props.value" 
+    :optionType="props.optionType" 
+    :options="dictOptions" 
+    :disabled="props.disabled"
+    :size="props.size"
+    @change="handleChange"
+  />
+</template>
+
+<script setup>
+import tool from '@/utils/tool'
+
+
+const props = defineProps({
+  optionType: {
+    type: String,
+    default: 'dropdown',
+    required: false,
+    validator(value) {
+        return ['dropdown', 'button', 'radio'].includes(value)
+    }
+  },
+  dictType: {
+    type: String,
+    default: '',
+    required: true
+  },
+  allowClear: {        // 仅限于下拉框有效
+    type: Boolean,
+    default: true,
+    required: false
+  },
+  placeholder: {      // 仅限于下拉框有效
+    type: String,
+    default: '',
+    required: false
+  },
+  size: {
+    type: String,
+    default: 'middle',
+    required: false,
+    validator(value) {
+        return ['small', 'middle', 'large'].includes(value)
+    }
+  },
+  value: {
+    type: [String, null],
+    default: null,
+    required: true,
+  },
+  disabled: {
+    type: Boolean,
+    default: false,
+    required: false
+  },
+})
+
+const emit = defineEmits(['update:value', 'change'])
+
+const dictOptions = ref([])
+
+onMounted(() => {
+  dictOptions.value = tool.dictList(props.dictType)
+})
+
+
+const handleChange = (e) => {
+  if (props.optionType === 'dropdown') {
+    emit('update:value', e)
+    emit('change', e)
+  }
+  else{
+    emit('update:value', e.target.value)
+    emit('change', e.target.value)
+  } 
+}
+</script>