修改一些告警

src/components/DictTag/src/DictTag.vue

@@ -1,60 +1,77 @@
 <script lang="tsx">
-import { defineComponent, PropType, ref } from 'vue'
+import { defineComponent, PropType, computed } from 'vue'
 import { isHexColor } from '@/utils/color'
 import { ElTag } from 'element-plus'
-import { DictDataType, getDictOptions } from '@/utils/dict'
+import { getDictOptions, getDictObj } from '@/utils/dict'
+import type { CSSProperties } from 'vue'
 
 export default defineComponent({
   name: 'DictTag',
   props: {
+    // 字典类型
     type: {
-      type: String as PropType<string>,
+      type: String,
       required: true
     },
+    // 字典值
     value: {
-      type: [String, Number, Boolean] as PropType<string | number | boolean>,
+      type: [String, Number, Boolean],
       required: true
+    },
+    // 自定义 Tag 的样式
+    style: {
+      type: Object as PropType<CSSProperties>,
+      default: () => ({})
     }
   },
   setup(props) {
-    const dictData = ref<DictDataType>()
-    const getDictObj = (dictType: string, value: string) => {
-      const dictOptions = getDictOptions(dictType)
-      dictOptions.forEach((dict: DictDataType) => {
-        if (dict.value === value) {
-          if (dict.colorType + '' === 'primary' || dict.colorType + '' === 'default') {
-            dict.colorType = ''
-          }
-          dictData.value = dict
-        }
-      })
-    }
-    const rederDictTag = () => {
-      if (!props.type) {
+    // 获取字典数据
+    const dictOptions = computed(() => {
+      return getDictOptions(props.type)
+    })
+
+    // 获取字典对象
+    const dictObj = computed(() => {
+      if (props.value === undefined || props.value === null) {
         return null
       }
-      // 解决自定义字典标签值为零时标签不渲染的问题
-      if (props.value === undefined || props.value === null) {
+      return getDictObj(props.type, props.value.toString())
+    })
+
+    // 标签文本
+    const label = computed(() => {
+      return dictObj.value?.label || ''
+    })
+
+    // 标签类型
+    const type = computed(() => {
+      return dictObj.value?.tag || ''
+    })
+
+    // 标签颜色
+    const color = computed(() => {
+      return dictObj.value?.color || ''
+    })
+
+    // 渲染函数
+    return () => {
+      if (!props.type || props.value === undefined || props.value === null) {
         return null
       }
-      getDictObj(props.type, props.value.toString())
+
+      // 只有当 type 有值且是有效的类型时才传递 type 属性
+      const validTypes = ['primary', 'success', 'info', 'warning', 'danger']
+      const tagProps = type.value && validTypes.includes(type.value) ? { type: type.value } : { type: 'info' } // 默认使用 info 类型
+
       // 添加标签的文字颜色为白色，解决自定义背景颜色时标签文字看不清的问题
+      const style = color.value && isHexColor(color.value) ? { ...props.style, color: '#fff' } : props.style
+
       return (
-        <ElTag
-          style={dictData.value?.cssClass ? 'color: #fff' : ''}
-          type={dictData.value?.colorType}
-          color={
-            dictData.value?.cssClass && isHexColor(dictData.value?.cssClass)
-              ? dictData.value?.cssClass
-              : ''
-          }
-          disableTransitions={true}
-        >
-          {dictData.value?.label}
+        <ElTag style={style} {...tagProps} color={color.value && isHexColor(color.value) ? color.value : ''} disableTransitions={true}>
+          {label.value}
         </ElTag>
       )
     }
-    return () => rederDictTag()
   }
 })
 </script>

src/views/mall/coupon/Form.vue

@@ -1,37 +1,23 @@
 <template>
   <Dialog :title="dialogTitle" v-model="dialogVisible">
-    <el-form
-      ref="formRef"
-      :model="formData"
-      :rules="formRules"
-      label-width="120px"
-      v-loading="formLoading"
-    >
+    <el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px" v-loading="formLoading">
       <el-form-item :label="t('mall.showStores')" prop="shopId">
-        <el-select
-          v-model="formData.shopId"
-          :placeholder="t('mall.selectStore')"
-        >
-          <el-option
-            v-for="item in shopList"
-            :key="item.id"
-            :label="item.name"
-            :value="item.id"
-          />
+        <el-select v-model="formData.shopId" :placeholder="t('mall.selectStore')">
+          <el-option v-for="item in shopList" :key="item.id" :label="item.name" :value="item.id" />
         </el-select>
       </el-form-item>
       <el-form-item :label="t('mall.availableType')" prop="type">
         <el-radio-group v-model="formData.type">
-          <el-radio :label="0">{{t('mall.generalPurpose')}}</el-radio>
-          <el-radio :label="1">{{t('mall.used')}}</el-radio>
-          <el-radio :label="2">{{t('mall.unused')}}</el-radio>
+          <el-radio :value="0">{{ t('mall.generalPurpose') }}</el-radio>
+          <el-radio :value="1">{{ t('mall.used') }}</el-radio>
+          <el-radio :value="2">{{ t('mall.unused') }}</el-radio>
         </el-radio-group>
       </el-form-item>
       <el-form-item :label="t('mall.redeemCode')" prop="exchangeCode">
         <el-input v-model="formData.exchangeCode" :placeholder="t('mall.pleaseEnterTheRedemptionCode')" />
       </el-form-item>
       <el-form-item :label="t('mall.picture')" prop="image">
-          <Materials v-model="formData.image" num="1" type="image" />
+        <Materials v-model="formData.image" num="1" type="image" />
       </el-form-item>
       <el-form-item :label="t('mall.couponName')" prop="title">
         <el-input v-model="formData.title" :placeholder="t('mall.pleaseEnterTheNameOfTheCoupon')" />
@@ -43,20 +29,10 @@
         <el-input v-model="formData.value" :placeholder="t('mall.pleaseEnterTheAmountOfTheCoupon')" />
       </el-form-item>
       <el-form-item :label="t('mall.startTime')" prop="startTime">
-        <el-date-picker
-          v-model="formData.startTime"
-          type="date"
-          value-format="x"
-          :placeholder="t('mall.selectStartTime')"
-        />
+        <el-date-picker v-model="formData.startTime" type="date" value-format="x" :placeholder="t('mall.selectStartTime')" />
       </el-form-item>
       <el-form-item :label="t('mall.closingTime')" prop="endTime">
-        <el-date-picker
-          v-model="formData.endTime"
-          type="date"
-          value-format="x"
-          :placeholder="t('mall.selectTheEndTime')"
-        />
+        <el-date-picker v-model="formData.endTime" type="date" value-format="x" :placeholder="t('mall.selectTheEndTime')" />
       </el-form-item>
       <el-form-item :label="t('mall.numberOfIssues')" prop="distribute">
         <el-input v-model="formData.distribute" :placeholder="t('mall.pleaseEnterTheNumberOfIssues')" />
@@ -68,18 +44,18 @@
         <el-input v-model="formData.limit" :placeholder="t('mall.pleaseEnterTheQuantityLimit')" />
       </el-form-item>
       <el-form-item :label="t('mall.instructionsForUse')" prop="instructions">
-        <el-input type="textarea" rows="5"  v-model="formData.instructions" :placeholder="t('mall.pleaseEnterTheInstructionsForUse')" />
+        <el-input type="textarea" rows="5" v-model="formData.instructions" :placeholder="t('mall.pleaseEnterTheInstructionsForUse')" />
       </el-form-item>
       <el-form-item :label="t('mall.whetherItIsOnTheShelfOrNot')" prop="isSwitch">
         <el-radio-group v-model="formData.isSwitch">
-          <el-radio :label="1">{{t('common.yes')}}</el-radio>
-          <el-radio :label="0">{{t('common.no')}}</el-radio>
+          <el-radio :value="1">{{ t('common.yes') }}</el-radio>
+          <el-radio :value="0">{{ t('common.no') }}</el-radio>
         </el-radio-group>
       </el-form-item>
     </el-form>
     <template #footer>
-      <el-button @click="submitForm" type="primary" :disabled="formLoading">{{t('common.confirm')}}</el-button>
-      <el-button @click="dialogVisible = false">{{t('common.cancel')}}</el-button>
+      <el-button @click="submitForm" type="primary" :disabled="formLoading">{{ t('common.confirm') }}</el-button>
+      <el-button @click="dialogVisible = false">{{ t('common.cancel') }}</el-button>
     </template>
   </Dialog>
 </template>
@@ -178,9 +154,7 @@ const getList = async () => {
   try {
     const data = await ShopApi.getShopList()
     shopList.value = data
-
   } finally {
-    
   }
 }
 /** 重置表单 */

src/views/system/menu/MenuForm.vue

@@ -1,12 +1,6 @@
 <template>
   <Dialog v-model="dialogVisible" :title="dialogTitle">
-    <el-form
-      ref="formRef"
-      v-loading="formLoading"
-      :model="formData"
-      :rules="formRules"
-      label-width="100px"
-    >
+    <el-form ref="formRef" v-loading="formLoading" :model="formData" :rules="formRules" label-width="100px">
       <el-form-item :label="t('system.parentMenu')">
         <el-tree-select
           v-model="formData.parentId"
@@ -28,11 +22,7 @@
       </el-form-item>
       <el-form-item :label="t('system.menuType')" prop="type">
         <el-radio-group v-model="formData.type">
-          <el-radio-button
-            v-for="dict in getIntDictOptions(DICT_TYPE.SYSTEM_MENU_TYPE)"
-            :key="dict.label"
-            :label="dict.value"
-          >
+          <el-radio-button v-for="dict in getIntDictOptions(DICT_TYPE.SYSTEM_MENU_TYPE)" :key="dict.label" :label="dict.value">
             {{ dict.label }}
           </el-radio-button>
         </el-radio-group>
@@ -42,10 +32,7 @@
       </el-form-item>
       <el-form-item v-if="formData.type !== 3" :label="t('system.routeAddress')" prop="path">
         <template #label>
-          <Tooltip
-            message="t('system.cache5')"
-            title="t('system.routeAddress')"
-          />
+          <Tooltip message="t('system.cache5')" title="t('system.routeAddress')" />
         </template>
         <el-input v-model="formData.path" clearable :placeholder="t('system.pleaseEnterRouteAddress')" />
       </el-form-item>
@@ -57,10 +44,7 @@
       </el-form-item>
       <el-form-item v-if="formData.type !== 1" :label="t('system.permissionIdentity')" prop="permission">
         <template #label>
-          <Tooltip
-            message="t('system.cache4')"
-            :title="t('system.permissionIdentity')"
-          />
+          <Tooltip message="t('system.cache4')" :title="t('system.permissionIdentity')" />
         </template>
         <el-input v-model="formData.permission" clearable :placeholder="t('system.pleaseEnterPermissionIdentity')" />
       </el-form-item>
@@ -69,11 +53,7 @@
       </el-form-item>
       <el-form-item :label="t('system.menuStatus')" prop="status">
         <el-radio-group v-model="formData.status">
-          <el-radio
-            v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
-            :key="dict.label"
-            :label="dict.value"
-          >
+          <el-radio v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)" :key="dict.label" :label="dict.value">
             {{ dict.label }}
           </el-radio>
         </el-radio-group>
@@ -83,38 +63,32 @@
           <Tooltip :message="t('system.cache3')" />
         </template>
         <el-radio-group v-model="formData.visible">
-          <el-radio key="true" :label="true" border>{{t('mall.display')}}</el-radio>
-          <el-radio key="false" :label="false" border>{{ t('mall.hide') }}</el-radio>
+          <el-radio :value="'0'">{{ t('mall.display') }}</el-radio>
+          <el-radio :value="'1'">{{ t('mall.hide') }}</el-radio>
         </el-radio-group>
       </el-form-item>
       <el-form-item v-if="formData.type !== 3" :label="t('system.alwaysDisplay')" prop="alwaysShow">
         <template #label>
-          <Tooltip
-            :message="t('system.cache2')"
-            :title="t('system.alwaysDisplay')"
-          />
+          <Tooltip :message="t('system.cache2')" :title="t('system.alwaysDisplay')" />
         </template>
         <el-radio-group v-model="formData.alwaysShow">
-          <el-radio key="true" :label="true" border>{{t('system.always')}}</el-radio>
-          <el-radio key="false" :label="false" border>{{t('system.no1')}}</el-radio>
+          <el-radio :value="'0'">{{ t('system.always') }}</el-radio>
+          <el-radio :value="'1'">{{ t('system.no1') }}</el-radio>
         </el-radio-group>
       </el-form-item>
       <el-form-item v-if="formData.type === 2" :label="t('system.cacheStatus')" prop="keepAlive">
         <template #label>
-          <Tooltip
-            :message="t('system.cache1')"
-            :title="t('system.cacheStatus')"
-          />
+          <Tooltip :message="t('system.cache1')" :title="t('system.cacheStatus')" />
         </template>
         <el-radio-group v-model="formData.keepAlive">
-          <el-radio key="true" :label="true" border>{{t('system.cache')}}</el-radio>
-          <el-radio key="false" :label="false" border>{{t('system.noCache')}}</el-radio>
+          <el-radio :value="'0'">{{ t('system.cache') }}</el-radio>
+          <el-radio :value="'1'">{{ t('system.noCache') }}</el-radio>
         </el-radio-group>
       </el-form-item>
     </el-form>
     <template #footer>
-      <el-button :disabled="formLoading" type="primary" @click="submitForm">{{t('common.confirm')}}</el-button>
-      <el-button @click="dialogVisible = false">{{t('common.cancel')}}</el-button>
+      <el-button :disabled="formLoading" type="primary" @click="submitForm">{{ t('common.confirm') }}</el-button>
+      <el-button @click="dialogVisible = false">{{ t('common.cancel') }}</el-button>
     </template>
   </Dialog>
 </template>
@@ -194,10 +168,7 @@ const submitForm = async () => {
   // 提交请求
   formLoading.value = true
   try {
-    if (
-      formData.value.type === SystemMenuTypeEnum.DIR ||
-      formData.value.type === SystemMenuTypeEnum.MENU
-    ) {
+    if (formData.value.type === SystemMenuTypeEnum.DIR || formData.value.type === SystemMenuTypeEnum.MENU) {
       if (!isExternal(formData.value.path)) {
         if (formData.value.parentId === 0 && formData.value.path.charAt(0) !== '/') {
           message.error(t('system.thePathMustStartWith'))