Jelajahi Sumber

fix: 默认添加算法不启用 + 取消和切换配置添加二次确认弹框

sunhongyao341504 1 tahun lalu
induk
melakukan
beeeb1312c

+ 1 - 2
src/views/cameras/preview/components/AlgorithmsSetting/AddAlgoDialog.vue

@@ -77,9 +77,8 @@
       cameraId: cameraDetailStore.cameraId,
     }).then((res) => {
       console.log('createAlgo ok', res);
-      selectedAlgoId.value = selectedIds.value?.[0];
+      // selectedAlgoId.value = selectedIds.value?.[0];
       getCameraAlgoList(cameraDetailStore.cameraId);
-      visible.value = false;
       ElMessage.success('添加成功,请完成算法参数配置后生效');
       visible.value = false;
     });

+ 1 - 1
src/views/cameras/preview/components/AlgorithmsSetting/AlgoParamsCard.vue

@@ -224,7 +224,7 @@
         ];
       }
       if (param.type === 'confidence') {
-        rule[`${param.label}.confidence`] = [
+        rule[`${param.label}${param.label ? '.' : ''}confidence`] = [
           {
             required: true,
             message: '请输入检测置信度',

+ 28 - 13
src/views/cameras/preview/components/AlgorithmsSetting/AlgoSettingCard.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="algoCardWrapper">
+  <div id="algoCardWrapper" class="algoCardWrapper">
     <div class="algoCardTitle">
       <div>{{ selectedAlgoDetail?.algoInfo?.name }}</div>
       <div style="display: flex; align-items: center">
@@ -111,21 +111,12 @@
           size="small"
           style="width: 186px"
           placeholder="请输入允许的最长时间"
+          @blur="checkTimeWindowValid"
         />
         <span style="font-size: 12px; margin-left: 5px">S</span>
       </div>
       <div style="display: flex; justify-content: flex-end">
-        <el-popconfirm
-          title="确认取消算法配置吗? 取消后配置的参数将不会被保存。"
-          confirm-button-text="确定"
-          cancel-button-text="取消"
-          @confirm="handleRemoveAlgo"
-          width="300px"
-        >
-          <template #reference>
-            <ElButton size="small" :disabled="!selectedAlgoId">取消</ElButton>
-          </template>
-        </el-popconfirm>
+        <ElButton size="small" :disabled="!selectedAlgoId" @click="handleRemoveAlgo">取消</ElButton>
         <ElButton size="small" type="primary" @click="handleSave" :disabled="!selectedAlgoId"
           >保存</ElButton
         >
@@ -141,6 +132,7 @@
     ElInputNumber,
     ElTimePicker,
     ElMessage,
+    ElMessageBox,
   } from 'element-plus';
   import { CircleCloseFilled, Plus } from '@element-plus/icons-vue';
   import { storeToRefs } from 'pinia';
@@ -239,6 +231,10 @@
     );
   };
 
+  const checkTimeWindowValid = () => {
+    selectedAlgoDetail.value.timeWindow = Math.ceil(selectedAlgoDetail.value.timeWindow || 1);
+  };
+
   const handleSave = async () => {
     //判断时间段是否合格
     if (markedTimeRangeIds.value.length > 0) {
@@ -345,7 +341,22 @@
 
   const handleRemoveAlgo = () => {
     if (!selectedAlgoId.value) return;
-    emits('onCancel', selectedAlgoId.value);
+    const el = document.getElementById('algoCardWrapper') as HTMLElement;
+    ElMessageBox.confirm(
+      '<strong>确认取消算法配置吗?</strong><br />取消后配置的参数将不会被保存。',
+      '',
+      {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+        dangerouslyUseHTMLString: true,
+        appendTo: el,
+      },
+    )
+      .then(() => {
+        emits('onCancel', selectedAlgoId.value!);
+      })
+      .catch(() => {});
   };
 </script>
 <style scoped>
@@ -425,4 +436,8 @@
   :deep(.ml-4) {
     margin-left: 0 !important;
   }
+  :deep(.el-message-box__status.el-icon) {
+    top: 0 !important;
+    transform: none !important;
+  }
 </style>

+ 38 - 5
src/views/cameras/preview/components/AlgorithmsSetting/AlgorithmsSetting.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div id="algoSetting">
     <div style="font-size: 14px; font-weight: bold">算法配置</div>
     <div style="display: flex">
       <div class="algoTagWrapper">
@@ -36,7 +36,7 @@
     updateCameraAlgoApi,
     FENCE_ENBALED_STATUS,
   } from '@/api/camera/camera-preview';
-  import { ElMessage } from 'element-plus';
+  import { ElMessage, ElMessageBox } from 'element-plus';
   import AlgoTag from './AlgoTag.vue';
   import useFenceStore from '../../store/useFenceStore';
   import useCameraDetailStore from '../../store/useCameraDetailStore';
@@ -47,6 +47,7 @@
     getDetectionJSON,
     getDetectionTimeJSON,
     getInferCode,
+    getAlgoType,
     getMetaValues,
     getExtraCommonInfo,
     getDetectionTime,
@@ -63,7 +64,29 @@
   const cameraDetailStore = useCameraDetailStore();
 
   const handleSelectAlgo = (algoId: number) => {
-    if (algoId !== selectedAlgoId.value) {
+    if (selectedAlgoId.value === algoId) {
+      return;
+    }
+    if (selectedAlgoId.value) {
+      const el = document.getElementById('algoSetting') as HTMLElement;
+      ElMessageBox.confirm(
+        '<strong>确认切换算法配置吗?</strong><br />切换后未保存的算法配置将被丢弃。',
+        'warning',
+        {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning',
+          dangerouslyUseHTMLString: true,
+          appendTo: el,
+        },
+      )
+        .then(() => {
+          if (algoId !== selectedAlgoId.value) {
+            selectedAlgoId.value = algoId;
+          }
+        })
+        .catch(() => {});
+    } else {
       selectedAlgoId.value = algoId;
     }
   };
@@ -103,7 +126,7 @@
     });
 
     //是否有窗口时间
-    if (commonInfo.timeWindow || commonInfo.timeWindow == 0) {
+    if (commonInfo.timeWindow) {
       selectedAlgoDetail.value.timeWindow = commonInfo.timeWindow;
     }
   });
@@ -116,10 +139,15 @@
     inferParams.regionJudge = param.regionJudge;
     inferParams.criticalCounts = param.criticalCounts;
     inferParams.judge = param.judge;
+    inferParams.algoCode = selectedAlgoDetail.value.algoInfo.code;
+    inferParams.algoType = getAlgoType(selectedAlgoDetail.value.algoInfo.extra);
+    if (param.timeWindow) {
+      inferParams.timeWindow = param.timeWindow;
+    }
     const extraValue = {
       inferCode: param.inferCode,
       inferParams: [inferParams],
-    };
+    } as any;
     const newParam = {
       cameraId: cameraId,
       electronicFence: param.electronicFence,
@@ -161,4 +189,9 @@
     min-width: 150px;
     margin-right: 15px;
   }
+
+  :deep(.el-message-box__status.el-icon) {
+    top: 0 !important;
+    transform: none !important;
+  }
 </style>

+ 9 - 1
src/views/cameras/preview/components/AlgorithmsSetting/utils.ts

@@ -104,6 +104,14 @@ export const getInferCode = (extra: string | undefined | null) => {
   return extraObj?.inferCode || '';
 };
 
+export const getAlgoType = (extra: string | undefined | null) => {
+  if (!extra) return 0;
+  const extraObj = JSON.parse(extra);
+  const infers = extraObj?.inferParams;
+  if (!infers || infers.length === 0) return 0;
+  return infers[0]?.algoType || 0;
+};
+
 export const getCriticalCounts = (extra: string | undefined | null) => {
   if (!extra) return [];
   const extraObj = JSON.parse(extra);
@@ -142,7 +150,7 @@ const getCommonInfo = (extra: string | undefined | null): CommonInfo => {
   if (judge || judge == 0) {
     ret.judge = judge;
   }
-  if (timeWindow || timeWindow == 0) {
+  if (timeWindow) {
     ret.timeWindow = timeWindow;
   }
   return ret;