Kaynağa Gözat

perf(views): 优化“创建协议”步骤逻辑

1. 支持本地增删改查标准和自定义参数
2. 支持校验协议参数个数,至少需要1条
wangcong 1 ay önce
ebeveyn
işleme
090970f47a

+ 3 - 0
src/i18n/locales/zh.json

@@ -360,12 +360,15 @@
     "manuallyMatch": "手动匹配",
     "nextDataReadDelay": "下条数据读取延时",
     "nextRoundDataReadDelay": "下轮数据读取延时",
+    "paramAlreadyExists": "该参数已经存在,请勿重复添加",
     "paramList": "参数列表",
+    "paramsHaveFilteredOut": "已过滤掉部分重复的参数",
     "parityBit": "校验位",
     "plzEnterParamOrCode": "请输入参数名称或编码",
     "plzSelectAtLeastOneParam": "请至少选择一个参数",
     "plzSelectProtocolFile": "请选择协议文件",
     "plzSelectProtocolType": "请选择协议类型",
+    "protocolAtLeastOneParam": "协议必须至少配置一条参数",
     "protocolConfigCompleted": "已完成协议配置",
     "protocolDisplayName": "{name}协议",
     "protocolName": "协议名称",

+ 2 - 0
src/views/setup-protocol/CreateProtocol.vue

@@ -31,11 +31,13 @@ const protocolContentRef = useTemplateRef('protocolContent');
 
 const finish = async () => {
   await protocolContentRef.value?.validateProtocolInfo();
+  protocolContentRef.value?.isAtLeastOneParam();
 
   if (props.form.protocolInfo.id) {
     await updateProtocolBaseInfo(props.form.protocolInfo);
   } else {
     props.form.protocolInfo.id = await addProtocolBaseInfo(props.form.protocolInfo);
+    await protocolContentRef.value?.submitLocalParams();
   }
 
   await completeProtocolConfig(props.form.protocolInfo.id as number);

+ 13 - 0
src/views/setup-protocol/CustomParams.vue

@@ -24,6 +24,8 @@ interface Props {
 const props = defineProps<Props>();
 
 const emit = defineEmits<{
+  addLocalParam: [param: Partial<ProtocolParamInfo>];
+  editLocalParam: [param: Partial<ProtocolParamInfo>];
   refreshList: [];
 }>();
 
@@ -194,6 +196,17 @@ const handleOk = () => {
   formRef.value
     ?.validate()
     .then(() => {
+      if (!props.protocolId) {
+        if (isAddParams.value) {
+          emit('addLocalParam', { ...customParamsForm });
+        } else {
+          emit('editLocalParam', { ...customParamsForm });
+        }
+
+        hideView();
+        return;
+      }
+
       handleRequest(async () => {
         if (isAddParams.value) {
           await addProtocolParam({

+ 80 - 2
src/views/setup-protocol/ProtocolContent.vue

@@ -7,7 +7,13 @@ import SvgIcon from '@/components/SvgIcon.vue';
 import { useDictData } from '@/hooks/dict-data';
 import { useRequest } from '@/hooks/request';
 import { t } from '@/i18n';
-import { batchDeleleProtocolParam, getProtocolParamList, getProtocolStandardParam, updateProtocolParam } from '@/api';
+import {
+  addProtocolParam,
+  batchDeleleProtocolParam,
+  getProtocolParamList,
+  getProtocolStandardParam,
+  updateProtocolParam,
+} from '@/api';
 import { DictCode, ProtocolRecognitionResult, ProtocolType } from '@/constants';
 
 import CustomParams from './CustomParams.vue';
@@ -25,6 +31,7 @@ import type {
   ProtocolBaseInfo,
   ProtocolCandidateResult,
   ProtocolParamInfo,
+  ProtocolStandardParam,
 } from '@/types';
 
 interface Props {
@@ -291,7 +298,12 @@ const deleteSelectedParams = () => {
     title: t('setupProtocol.confirmDeleteParams'),
     async onOk() {
       try {
-        await batchDeleleProtocolParam(selectedParamIds.value);
+        if (props.info.id) {
+          await batchDeleleProtocolParam(selectedParamIds.value);
+        } else {
+          deleteLocalParams();
+        }
+
         selectedParamIds.value = [];
         message.success(t('setupProtocol.deleteParamsSuccessful'));
 
@@ -354,8 +366,71 @@ const changeToStandardParams = (params: ProtocolParamInfo) => {
   selectStandardParamsRef.value?.showView();
 };
 
+const addLocalStandardParams = (params: ProtocolStandardParam[]) => {
+  const allParamIds = paramList.value.map((item) => item.id);
+  const nonRepeatingParams = params.filter((item) => !allParamIds.includes(item.id));
+  paramList.value.push(...(nonRepeatingParams as unknown as ProtocolParamInfo[]));
+
+  if (nonRepeatingParams.length < params.length) {
+    message.info(t('setupProtocol.paramsHaveFilteredOut'));
+  }
+};
+
+const editLocalStandardParam = (param: ProtocolStandardParam) => {
+  const allParamIds = paramList.value.map((item) => item.id);
+
+  if (allParamIds.includes(param.id)) {
+    message.error(t('setupProtocol.paramAlreadyExists'));
+    return;
+  }
+
+  const selectedParamIndex = paramList.value.findIndex((item) => item.id === selectedParamId.value);
+  paramList.value.splice(selectedParamIndex, 1, param as unknown as ProtocolParamInfo);
+};
+
+const addLocalCustomParam = (param: Partial<ProtocolParamInfo>) => {
+  paramList.value.push({
+    ...param,
+    id: Date.now(),
+  } as ProtocolParamInfo);
+};
+
+const deleteLocalParams = () => {
+  paramList.value = paramList.value.filter((item) => !selectedParamIds.value.includes(item.id));
+};
+
+const submitLocalParams = async () => {
+  if (props.info.id) {
+    for (const item of paramList.value) {
+      await addProtocolParam({
+        ...item,
+        baseInfoId: props.info.id,
+      });
+    }
+  }
+};
+
+/**
+ * 协议必须至少配置一条参数,此函数用于提供给外部进行判断是否可以提交协议的创建、修改等操作
+ */
+const isAtLeastOneParam = () => {
+  let isAtLeastOne: boolean;
+
+  if (props.info.id) {
+    isAtLeastOne = paramTotal.value > 0;
+  } else {
+    isAtLeastOne = paramList.value.length > 0;
+  }
+
+  if (!isAtLeastOne) {
+    throw new Error(t('setupProtocol.protocolAtLeastOneParam'));
+  }
+};
+
 defineExpose({
   validateProtocolInfo,
+  isAtLeastOneParam,
+  submitLocalParams,
 });
 </script>
 
@@ -768,12 +843,15 @@ defineExpose({
       :is-modbus-rtu-protocol="isModbusRtuProtocol"
       :is-modbus-tcp-protocol="isModbusTcpProtocol"
       :is-s7-protocol="isS7Protocol"
+      @add-local-param="addLocalCustomParam"
       @refresh-list="getCurrentProtocolParams"
     />
     <SelectStandardParams
       ref="selectStandardParams"
       :protocol-id="info.id"
       :param-id="selectedParamId"
+      @add-local-params="addLocalStandardParams"
+      @edit-local-param="editLocalStandardParam"
       @refresh-list="getCurrentProtocolParams"
     />
   </div>

+ 13 - 0
src/views/setup-protocol/SelectStandardParams.vue

@@ -20,6 +20,8 @@ interface Props {
 const props = defineProps<Props>();
 
 const emit = defineEmits<{
+  addLocalParams: [params: ProtocolStandardParam[]];
+  editLocalParam: [param: ProtocolStandardParam];
   refreshList: [];
 }>();
 
@@ -106,6 +108,17 @@ const handleOk = () => {
     return;
   }
 
+  if (!props.protocolId) {
+    if (isAddParams.value) {
+      emit('addLocalParams', selectedParams.value);
+    } else {
+      emit('editLocalParam', selectedParams.value[0]);
+    }
+
+    hideView();
+    return;
+  }
+
   handleAddParamRequest(async () => {
     if (isAddParams.value) {
       for (const item of selectedParams.value) {