feat(sj_1.0.0): 优化通知人列表和查询

src/constants/business.ts

@@ -42,3 +42,11 @@ export const idGeneratorModeRecord: Record<Api.GroupConfig.IdGeneratorModeType,
   '1': 'page.groupConfig.idMode.segment',
   '2': 'page.groupConfig.idMode.idWorker'
 };
+
+export const alarmTypeRecord: Record<Api.NotifyRecipient.AlarmType, App.I18n.I18nKey> = {
+  '1': 'page.notifyRecipient.dingDing',
+  '2': 'page.notifyRecipient.email',
+  '3': 'page.notifyRecipient.weCom',
+  '4': 'page.notifyRecipient.lark'
+};
+export const alarmTypeRecordOptions = transformRecordToOption(alarmTypeRecord);

src/locales/langs/en-us.ts

@@ -549,25 +549,29 @@ const local: App.I18n.Schema = {
     },
     notifyRecipient: {
       title: 'Notify Recipient List',
-      recipientName: 'Recipient name',
+      recipientName: 'Recipient Name',
-      notifyType: 'Notification type',
+      notifyType: 'Notification Type',
-      notifyAttribute: 'Attribute information',
+      notifyAttribute: 'Attribute Information',
-      description: 'Describe',
+      description: 'Description',
       form: {
-        description: 'Please enter Describe',
+        description: 'Please enter description',
-        notifyAttribute: 'Please enter Attribute information',
+        notifyAttribute: 'Please enter attribute information',
-        recipientName: 'Please enter Recipient name',
+        recipientName: 'Please enter recipient name',
-        notifyType: 'lease select Notification type',
+        notifyType: 'Please select notification type',
-        dingdingAts: "请输入被{'@'}人手机号或钉钉号",
+        dingDingAts: "Please enter the {'@'} phone number or DingTalk ID",
-        qiYeWechatAts: "请输入被{'@'}人企业微信用户id",
+        weComAts: "Please enter the {'@'} Enterprise WeChat user ID",
-        larkAts: "请输入被{'@'}人open_id",
+        larkAts: "Please enter the {'@'} open_id",
-        webhookUrl: '请输入URL'
+        webhookUrl: 'Please enter URL'
       },
-      addNotifyRecipient: 'Add Notify recipients',
+      addNotifyRecipient: 'Add Notify Recipient',
-      editNotifyRecipient: 'Add Notify recipients',
+      editNotifyRecipient: 'Edit Notify Recipient',
-      ats: "{'@'}通知人",
+      ats: "{'@'} Notification Recipient",
-      webhookUrl: '通知地址',
+      webhookUrl: 'Notification Address',
-      tos: '通知人邮箱地址'
+      tos: 'Recipient Email Address',
+      dingDing: 'DingTalk',
+      email: 'Email',
+      weCom: 'WeCom',
+      lark: 'Lark'
     }
   },
   form: {

src/locales/langs/zh-cn.ts

@@ -544,7 +544,7 @@ const local: App.I18n.Schema = {
       editNotifyConfig: '编辑告警通知'
     },
     notifyRecipient: {
-      title: 'NotifyRecipient 列表',
+      title: '通知人列表',
       recipientName: '接收人名称',
       notifyType: '通知类型',
       notifyAttribute: '属性信息',
@@ -554,8 +554,8 @@ const local: App.I18n.Schema = {
         notifyAttribute: '请输入属性信息',
         recipientName: '请输入接收人名称',
         notifyType: '请选择通知类型',
-        dingdingAts: "请输入被{'@'}人手机号或钉钉号",
+        dingDingAts: "请输入被{'@'}人手机号或钉钉号",
-        qiYeWechatAts: "请输入被{'@'}人企业微信用户id",
+        weComAts: "请输入被{'@'}人企业微信用户id",
         larkAts: "请输入被{'@'}人open_id",
         webhookUrl: '请输入URL'
       },
@@ -563,7 +563,11 @@ const local: App.I18n.Schema = {
       editNotifyRecipient: '编辑通知接收人',
       ats: "{'@'}通知人",
       webhookUrl: '通知地址',
-      tos: '通知人邮箱地址'
+      tos: '通知人邮箱地址',
+      dingDing: '钉钉',
+      email: '邮箱',
+      weCom: '企业微信',
+      lark: '飞书'
     }
   },
   form: {

src/typings/api.d.ts

@@ -590,6 +590,6 @@ declare namespace Api {
     type NotifyRecipientList = Common.PaginatingQueryRecord<NotifyRecipient>;
 
     /** 1: 钉钉通知 2: 邮件通知 3: 企业通知 4: 飞书 */
-    type AlarmType = 1 | 2 | 3 | 4;
+    type AlarmType = '1' | '2' | '3' | '4';
   }
 }

src/typings/app.d.ts

@@ -729,8 +729,8 @@ declare namespace App {
             notifyAttribute: string;
             recipientName: string;
             notifyType: string;
-            dingdingAts: string;
+            dingDingAts: string;
-            qiYeWechatAts: string;
+            weComAts: string;
             larkAts: string;
             webhookUrl: string;
           };
@@ -739,6 +739,10 @@ declare namespace App {
           ats: string;
           webhookUrl: string;
           tos: string;
+          dingDing: string;
+          email: string;
+          weCom: string;
+          lark: string;
         };
       };
       form: {

src/views/notify/recipient/index.vue

@@ -1,9 +1,10 @@
 <script setup lang="tsx">
-import { NButton, NPopconfirm } from 'naive-ui';
+import { NButton, NPopconfirm, NTag } from 'naive-ui';
 import { fetchGetNotifyRecipientList } from '@/service/api';
 import { $t } from '@/locales';
 import { useAppStore } from '@/store/modules/app';
 import { useTable, useTableOperate } from '@/hooks/common/table';
+import { alarmTypeRecord } from '@/constants/business';
 import NotifyRecipientOperateDrawer from './modules/notify-recipient-operate-drawer.vue';
 import NotifyRecipientSearch from './modules/notify-recipient-search.vue';
 
@@ -41,13 +42,11 @@ const { columns, columnChecks, data, getData, loading, mobilePagination, searchP
       key: 'notifyType',
       title: $t('page.notifyRecipient.notifyType'),
       align: 'left',
-      minWidth: 120
+      minWidth: 120,
-    },
+      render: row => {
-    {
+        const label = $t(alarmTypeRecord[row.notifyType!]);
-      key: 'notifyAttribute',
+        return <NTag type="primary">{label}</NTag>;
-      title: $t('page.notifyRecipient.notifyAttribute'),
+      }
-      align: 'left',
-      minWidth: 120
     },
     {
       key: 'description',

src/views/notify/recipient/modules/dingding-form.vue

@@ -27,7 +27,7 @@ function createDefaultModel(): Model {
   return {
     id: '',
     recipientName: '',
-    notifyType: 1,
+    notifyType: '1',
     webhookUrl: '',
     ats: [],
     description: ''

src/views/notify/recipient/modules/email-form.vue

@@ -24,7 +24,7 @@ function createDefaultModel(): Model {
   return {
     id: '',
     recipientName: '',
-    notifyType: 2,
+    notifyType: '2',
     tos: [],
     description: ''
   };

src/views/notify/recipient/modules/lark-form.vue

@@ -27,7 +27,7 @@ function createDefaultModel(): Model {
   return {
     id: '',
     recipientName: '',
-    notifyType: 4,
+    notifyType: '4',
     webhookUrl: '',
     ats: [],
     description: ''

src/views/notify/recipient/modules/notify-recipient-operate-drawer.vue

@@ -7,7 +7,7 @@ import { fetchAddNotifyRecipient, fetchEditNotifyRecipient } from '@/service/api
 import DingDingForm from './dingding-form.vue';
 import LarkForm from './lark-form.vue';
 import EmailForm from './email-form.vue';
-import QiyeWechtForm from './qiye-wecht-form.vue';
+import WeComForm from './wecom-form.vue';
 
 defineOptions({
   name: 'NotifyRecipientOperateDrawer'
@@ -100,16 +100,16 @@ watch(visible, () => {
 <template>
   <OperateDrawer v-model="visible" :title="title" @handle-submit="handleSubmit">
     <NTabs v-model:value="defaultTabPane" type="segment" animated>
-      <NTabPane name="1" tab="钉钉">
+      <NTabPane name="1" :tab="$t('page.notifyRecipient.dingDing')">
         <DingDingForm ref="CommonRef" @fetch-add="commonFetchAdd" @fetch-update="commonFetchUpdate" />
       </NTabPane>
-      <NTabPane name="2" tab="邮箱">
+      <NTabPane name="2" :tab="$t('page.notifyRecipient.email')">
         <EmailForm ref="CommonRef" @fetch-add="commonFetchAdd" @fetch-update="commonFetchUpdate" />
       </NTabPane>
-      <NTabPane name="3" tab="企业微信">
+      <NTabPane name="3" :tab="$t('page.notifyRecipient.weCom')">
-        <QiyeWechtForm ref="CommonRef" @fetch-add="commonFetchAdd" @fetch-update="commonFetchUpdate" />
+        <WeComForm ref="CommonRef" @fetch-add="commonFetchAdd" @fetch-update="commonFetchUpdate" />
       </NTabPane>
-      <NTabPane name="4" tab="飞书">
+      <NTabPane name="4" :tab="$t('page.notifyRecipient.lark')">
         <LarkForm ref="CommonRef" @fetch-add="commonFetchAdd" @fetch-update="commonFetchUpdate" />
       </NTabPane>
     </NTabs>

src/views/notify/recipient/modules/notify-recipient-search.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import { $t } from '@/locales';
 import SearchForm from '@/components/common/search-form.vue';
+import { alarmTypeRecordOptions } from '@/constants/business';
+import { translateOptions } from '@/utils/common';
 
 defineOptions({
   name: 'NotifyRecipientSearch'
@@ -36,7 +38,12 @@ function search() {
       <NInput v-model:value="model.recipientName" :placeholder="$t('page.notifyRecipient.form.recipientName')" />
     </NFormItemGi>
     <NFormItemGi span="24 s:12 m:6" :label="$t('page.notifyRecipient.notifyType')" path="userName" class="pr-24px">
-      <NSelect v-model:value="model.notifyType" :placeholder="$t('page.notifyRecipient.notifyType')" clearable />
+      <NSelect
+        v-model:value="model.notifyType"
+        :options="translateOptions(alarmTypeRecordOptions)"
+        :placeholder="$t('page.notifyRecipient.notifyType')"
+        clearable
+      />
     </NFormItemGi>
   </SearchForm>
 </template>

src/views/notify/recipient/modules/wecom-form.vue

@@ -27,7 +27,7 @@ function createDefaultModel(): Model {
   return {
     id: '',
     recipientName: '',
-    notifyType: 3,
+    notifyType: '3',
     webhookUrl: '',
     ats: [],
     description: ''
@@ -96,7 +96,7 @@ defineExpose({
             <template #trigger>
               {{ $t('page.notifyRecipient.ats') }}
             </template>
-            {{ $t('page.notifyRecipient.form.qiYeWechatAts') }}
+            {{ $t('page.notifyRecipient.form.weComAts') }}
           </NTooltip>
         </a>
       </template>