refactor: 公告类型适配字典数据

1.新增 <dict-tag> 自定义组件，用于回显字典标签
2.重构 useDict 方法，支持查询字典数据
3.优化部分字典相关数据类型

continew-admin-ui/src/components/dict-tag/index.vue

@@ -0,0 +1,50 @@
+<template>
+  <span v-if="!dictItem"></span>
+  <span v-else-if="!dictItem.color">{{ dictItem.label }}</span>
+  <a-tag v-else-if="dictItem.color === 'primary'" color="arcoblue">{{
+    dictItem.label
+  }}</a-tag>
+  <a-tag v-else-if="dictItem.color === 'success'" color="green">{{
+    dictItem.label
+  }}</a-tag>
+  <a-tag v-else-if="dictItem.color === 'warning'" color="orangered">{{
+    dictItem.label
+  }}</a-tag>
+  <a-tag v-else-if="dictItem.color === 'error'" color="red">{{
+    dictItem.label
+  }}</a-tag>
+  <a-tag v-else-if="dictItem.color === 'default'" color="gray">{{
+    dictItem.label
+  }}</a-tag>
+  <a-tag v-else :color="dictItem.color">{{ dictItem.label }}</a-tag>
+</template>
+
+<script lang="ts" setup>
+  import { computed } from 'vue';
+  import { LabelValueState } from '@/store/modules/dict/types';
+
+  const props = defineProps({
+    dict: {
+      type: Array<LabelValueState>,
+      required: true,
+    },
+    value: {
+      type: [Number, String],
+      required: true,
+    },
+  });
+
+  const dictItem = computed(() =>
+    props.dict.find(
+      (d) => d.value === String(props.value) || d.value === Number(props.value)
+    )
+  );
+</script>
+
+<script lang="ts">
+  export default {
+    name: 'DictTag',
+  };
+</script>
+
+<style scoped lang="less"></style>

continew-admin-ui/src/components/index.ts

@@ -12,6 +12,7 @@ import {
 import Chart from './chart/index.vue';
 import Breadcrumb from './breadcrumb/index.vue';
 import DateRangePicker from './date-range-picker/index.vue';
+import DictTag from './dict-tag/index.vue';
 import RightToolbar from './right-toolbar/index.vue';
 import SvgIcon from './svg-icon/index.vue';
 import IconSelect from './icon-select/index.vue';
@@ -41,6 +42,7 @@ export default {
     Vue.component('Chart', Chart);
     Vue.component('Breadcrumb', Breadcrumb);
     Vue.component('DateRangePicker', DateRangePicker);
+    Vue.component('DictTag', DictTag);
     Vue.component('RightToolbar', RightToolbar);
     Vue.component('SvgIcon', SvgIcon);
     Vue.component('IconSelect', IconSelect);