feat(消息管理): 消息管理国际化

frontend/src/assets/style/arco-reset.less

@@ -213,6 +213,7 @@
   background-color: var(--color-text-fff);
   &:not(:disabled):hover {
     border-color: rgb(var(--primary-5));
+    background-color: white;
   }
   input::placeholder {
     color: var(--color-text-brand);
@@ -306,7 +307,7 @@
   }
 }
 .arco-form-item-label {
-  color: var(--clolor-text-1) !important;
+  color: var(--color-text-1) !important;
 }
 .arco-form-item-label-required-symbol {
   @apply inline-flex;
@@ -497,7 +498,7 @@
 }
 
 /** 全局容器 **/
-.ms-contentiner {
+.ms-container {
   height: calc(100vh - 84px);
 }
 

frontend/src/hooks/usePathMap.ts

@@ -37,8 +37,6 @@ export default function usePathMap() {
    * @param openNewPage 是否在新页面打开
    */
   const jumpRouteByMapKey = (key: PathMapRoute, routeQuery?: Record<string, any>, openNewPage = false) => {
-    console.log(router);
-
     const pathNode = findNodeByKey<PathMapItem>(pathMap, key as unknown as string);
     if (pathNode) {
       if (openNewPage) {

frontend/src/hooks/useSelect.ts

@@ -50,6 +50,11 @@ export default function useSelect(config: UseSelectOption) {
         if (lastWidth === 0) {
           maxTagCount.value = tagCount || 1;
         }
+        if (tagCount <= 1 && values.length > 0) {
+          singleTagMaxWidth.value = innerViewWidth - 100; // 100px 是 60px + 标签边距边框和 x 图标等40px
+        } else {
+          singleTagMaxWidth.value = 0;
+        }
       }
     });
   }

frontend/src/main.ts

@@ -1,12 +1,12 @@
 /* eslint-disable simple-import-sort/imports */
 import { createApp } from 'vue';
 import ArcoVue from '@arco-design/web-vue';
+import '@arco-themes/vue-ms-theme-default/index.less';
 
 import MsIcon from '@/components/pure/ms-icon-font/index.vue';
 import SvgIcon from '@/components/pure/svg-icon/index.vue';
 import App from './App.vue';
 
-import '@arco-themes/vue-ms-theme-default/index.less';
 // eslint-disable-next-line import/no-unresolved
 import 'virtual:svg-icons-register';
 import directive from './directive';

frontend/src/views/project-management/messageManagement/components/messageList.vue

@@ -178,7 +178,7 @@
       title: 'project.messageManagement.receiver',
       dataIndex: 'receiver',
       slotName: 'receiver',
-      width: 200,
+      width: 208,
       fixed: 'left',
     },
   ];
@@ -195,7 +195,7 @@
         title: robotOptions.value.find((e) => e.id === robotId)?.label,
         dataIndex: robotId,
         slotName: 'robot',
-        width: 150,
+        width: 180,
       });
     }
     return tempArr;

frontend/src/views/project-management/messageManagement/components/robotList.vue

@@ -17,7 +17,7 @@
       >
         <div ref="robotListRef" class="robot-list">
           <div v-for="robot of botList" :key="robot.id" class="robot-card">
-            <div class="flex">
+            <div class="flex items-center">
               <MsIcon
                 :type="IconMap[robot.platform]"
                 class="mr-[8px] h-[40px] w-[40px] bg-[var(--color-text-n9)] p-[8px] text-[rgb(var(--primary-5))]"
@@ -27,7 +27,7 @@
                 <div v-if="['IN_SITE', 'MAIL'].includes(robot.platform)" class="text-[12px] text-[var(--color-text-4)]">
                   {{ robot.description }}
                 </div>
-                <div v-else class="flex items-center text-[12px] text-[var(--color-text-4)]">
+                <div v-else class="flex flex-wrap items-center text-[12px] text-[var(--color-text-4)]">
                   <div class="mr-[16px]">
                     <a-tooltip position="tl" mini :content="robot.createUser">{{ robot.createUser }}</a-tooltip>
                     {{

frontend/src/views/project-management/messageManagement/edit.vue

@@ -20,9 +20,7 @@
         <div class="flex items-center">
           <div class="font-medium text-[var(--color-text-1)]">{{ t('project.messageManagement.messageScript') }}</div>
           <a-tooltip :content="t('project.messageManagement.scriptTip')" position="tl" mini>
-            <icon-question-circle
+            <icon-question-circle class="ml-[4px] text-[var(--color-text-4)] hover:text-[rgb(var(--primary-6))]" />
-              class="mb-[2px] ml-[4px] text-[var(--color-text-4)] hover:text-[rgb(var(--primary-6))]"
-            />
           </a-tooltip>
         </div>
         <a-select v-model:model-value="fieldType" class="my-[8px]" :options="fieldTypeOptions"></a-select>
@@ -61,8 +59,8 @@
           <div class="font-medium text-[var(--color-text-1)]">
             {{ t('project.messageManagement.messageTemplate') }}
           </div>
-          <icon-exclamation-circle class="mb-[2px] ml-[8px] mr-[4px] text-[rgb(var(--warning-6))]" />
+          <div class="flex whitespace-nowrap text-[rgb(var(--warning-6))]">
-          <div class="text-[rgb(var(--warning-6))]">
+            <icon-exclamation-circle class="mr-[4px] mt-[2px] text-[rgb(var(--warning-6))]" />
             {{
               currentLocale === 'zh-CN'
                 ? '引用消息变量格式为：${变量名称}'

frontend/src/views/project-management/messageManagement/locale/en-US.ts

@@ -1 +1,101 @@
-export default {};
+export default {
+  'project.messageManagement': 'Message management',
+  'project.messageManagement.config': 'Message settings',
+  'project.messageManagement.botList': 'Robot list',
+  'project.messageManagement.robot': 'Robot',
+  'project.messageManagement.botListTips': `The robot's opening and closing status is synchronized with the message setting list robot; for example, if the site message is turned on, the message list page will display the site message notification bar.`,
+  'project.messageManagement.notRemind': `Don't remind again`,
+  'project.messageManagement.createBot': 'Create a bot',
+  'project.messageManagement.updateBot': 'Update bot',
+  'project.messageManagement.createAt': 'Created at',
+  'project.messageManagement.updateAt': 'Updated at',
+  'project.messageManagement.status': 'Status',
+  'project.messageManagement.statusTipOn': 'Enable: display and use in message notification list',
+  'project.messageManagement.statusTipOff': 'Close: Do not use the robot for the time being',
+  'project.messageManagement.choosePlatform': 'Select configuration platform',
+  'project.messageManagement.WE_COM': 'Enterprise WeChat',
+  'project.messageManagement.DING_TALK': 'DingTalk',
+  'project.messageManagement.LARK': 'Lark',
+  'project.messageManagement.CUSTOM': 'custom',
+  'project.messageManagement.business': '(Enterprise Edition)',
+  'project.messageManagement.name': 'Robot name',
+  'project.messageManagement.nameRequired': 'Robot name cannot be empty',
+  'project.messageManagement.namePlaceholder': 'Please enter the robot name',
+  'project.messageManagement.webhook': 'Webhook',
+  'project.messageManagement.webhookRequired': 'Webhook cannot be empty',
+  'project.messageManagement.webhookPlaceholder': 'In the {type} group, click "Robot" to get it directly',
+  'project.messageManagement.webhookCustomPlaceholder': 'Please enter the webhook',
+  'project.messageManagement.dingTalkType': 'Robot type',
+  'project.messageManagement.ENTERPRISE': 'Internal applications',
+  'project.messageManagement.dingTalkCustomTip': 'DingTalk custom robot product offline announcement',
+  'project.messageManagement.noticeDetail': 'Announcement details',
+  'project.messageManagement.dingTalkCustomTitle': 'Things to note when adding DingTalk custom robot scenes',
+  'project.messageManagement.dingTalkCustomContent1':
+    '1. If you use a DingTalk robot with security verification, please select "Custom Keyword" verification, and the key word is "Message Notification";',
+  'project.messageManagement.dingTalkCustomContent2':
+    '2. If the {at} function is used, the recipient must be a user in the group where the robot belongs;',
+  'project.messageManagement.dingTalkCustomContent3':
+    '3. If mobile notification is used, the recipient’s mobile phone number must be the mobile phone number used by DingTalk.',
+  'project.messageManagement.expand': 'Expand',
+  'project.messageManagement.close': 'Close',
+  'project.messageManagement.dingTalkEnterpriseTip': 'Add internal application documents',
+  'project.messageManagement.helpDoc': 'Help documentation',
+  'project.messageManagement.dingTalkEnterpriseTitle':
+    'Things to note when adding robot scenarios within the enterprise',
+  'project.messageManagement.dingTalkEnterpriseContent1':
+    '1. If the {at} function is used, the recipient must be a user in the group where the robot belongs;',
+  'project.messageManagement.dingTalkEnterpriseContent2':
+    '2. If mobile notification is used, the recipient’s mobile phone number must be the mobile phone number used by DingTalk.',
+  'project.messageManagement.appKey': 'AppKey',
+  'project.messageManagement.appKeyPlaceholder': 'Open the help document to get it directly',
+  'project.messageManagement.appKeyRequired': 'AppKey cannot be empty',
+  'project.messageManagement.appSecret': 'AppSecret',
+  'project.messageManagement.appSecretPlaceholder': 'Open the help document to get it directly',
+  'project.messageManagement.appSecretRequired': 'AppSecret cannot be empty',
+  'project.messageManagement.disableTitle': 'Are you sure you want to close {name}?',
+  'project.messageManagement.disableContent':
+    'After closing, it will no longer receive in-site message notifications and will not be displayed on the message list page.',
+  'project.messageManagement.disableConfirm': 'Confirm close',
+  'project.messageManagement.disableSuccess': 'Closed successfully',
+  'project.messageManagement.enableTitle': 'Turn on {name}',
+  'project.messageManagement.enableContent':
+    'After turning it on, site messages will be displayed in the message settings list, and the notification type needs to be manually set.',
+  'project.messageManagement.enableConfirm': 'Confirm to open',
+  'project.messageManagement.enableSuccess': 'Opened successfully',
+  'project.messageManagement.deleteTitle': 'Confirm to delete {name}?',
+  'project.messageManagement.deleteContent':
+    'After deleting the robot, the bound message events will no longer be pushed.',
+  'project.messageManagement.function': 'Function',
+  'project.messageManagement.noticeEvent': 'Notification scene',
+  'project.messageManagement.receiver': 'Notify recipients',
+  'project.messageManagement.receiverPlaceholder': 'Please select recipient',
+  'project.messageManagement.inSite': 'Site message',
+  'project.messageManagement.email': 'Email',
+  'project.messageManagement.emailSendTime': 'Time:',
+  'project.messageManagement.emailSender': 'Sender: <sender’s email address>',
+  'project.messageManagement.emailReceiver': 'Recipient: <recipient email address>',
+  'project.messageManagement.groupName': 'Group name',
+  'project.messageManagement.internalRobot': 'Internal robot',
+  'project.messageManagement.customRobot': 'Custom robot',
+  'project.messageManagement.larkRobotTip': 'Push custom service messages to Lark through webhook',
+  'project.messageManagement.editMessage': 'Update template',
+  'project.messageManagement.messageScript': 'Message script',
+  'project.messageManagement.scriptTip':
+    'Display the specific content of the message notification and the referenced message variables',
+  'project.messageManagement.messageTemplate': 'Update template',
+  'project.messageManagement.updatePreview': 'Update preview',
+  'project.messageManagement.title': 'Title',
+  'project.messageManagement.titlePlaceholder': 'Please enter notification title',
+  'project.messageManagement.titleMax': 'Title length cannot exceed 64 characters',
+  'project.messageManagement.content': 'Content',
+  'project.messageManagement.contentTip': 'Click Add Name Edit Notification Template on the left',
+  'project.messageManagement.contentMax': 'Content length cannot exceed 500 characters',
+  'project.messageManagement.var': 'Variable',
+  'project.messageManagement.desc': 'Description',
+  'project.messageManagement.saveSuccess': 'Template saved successfully',
+  'project.messageManagement.enableRobotSuccess': '{name} is enabled',
+  'project.messageManagement.saveReceiverSuccess': 'Recipient modified successfully',
+  'project.messageManagement.unsetReceiverTip': 'Please set up message recipients before enabling the robot',
+  'project.messageManagement.receiverNotNull': 'Please set at least one message recipient',
+  'project.messageManagement.noMatchField': 'No matching fields yet',
+};

frontend/src/views/project-management/messageManagement/locale/zh-CN.ts

@@ -70,7 +70,7 @@ export default {
   'project.messageManagement.groupName': '群名称',
   'project.messageManagement.internalRobot': '内部机器人',
   'project.messageManagement.customRobot': '自定义机器人',
-  'project.messageManagement.larkRobotTip': '通过webhook将自定义服务的消息推送致飞书',
+  'project.messageManagement.larkRobotTip': '通过webhook将自定义服务的消息推送至飞书',
   'project.messageManagement.editMessage': '更新模版',
   'project.messageManagement.messageScript': '消息脚本',
   'project.messageManagement.scriptTip': '展示消息通知的具体内容，以及引用的消息变量',