任务编辑页面添加未保存提示，时间选择添加条件判断

src/views/CommandInfo.vue

@@ -8,6 +8,13 @@
       </div>
       <div class="btn-group">
         <van-icon name="question-o" size="24" @click="showHelpDoc = true" />
+        <van-button
+          type="primary"
+          size="small"
+          :disabled="!crtCommand!.stepList.length && !isExistCnt"
+          @click="handleSaveCommand"
+          >保存</van-button
+        >
       </div>
     </div>
     <div class="container" ref="stepListRef">
@@ -83,6 +90,14 @@
                         style="width: 60%"
                         @click="showSelect('timeLabel', index, cIndex, 'label', cItem.label)"
                       />
+                      <van-field
+                        v-model="cItem.operation"
+                        is-link
+                        readonly
+                        placeholder="请选择"
+                        style="width: 35%"
+                        @click="showSelect('timeOperation', index, cIndex, 'operation', cItem.operation!)"
+                      />
                       <van-field
                         v-model="cItem.value"
                         is-link
@@ -127,9 +142,6 @@
       <div class="empty" v-else>当前没有可执行任务</div>
       <div class="footer" v-if="crtCommand!.stepList.length || isExistCnt">
         <div class="tip">如果没有执行命令，则本条任务不会被编译；如果条件不满足，将会从第一步开始重新执行</div>
-        <van-button type="primary" :disabled="!crtCommand!.stepList.length && !isExistCnt" @click="handleSaveCommand()"
-          >保存</van-button
-        >
       </div>
     </div>
 
@@ -189,6 +201,15 @@
         </div>
       </van-form>
     </van-popup>
+
+    <van-popup v-model:show="showUnsaveTipPopup" round :style="{ width: '80%' }" :close-on-click-overlay="false">
+      <div class="label">当前页面内容未保存，是否保存？</div>
+      <div class="btn-group">
+        <van-button size="small" @click="handleExit">退出</van-button>
+        <van-button size="small" type="primary" @click="handleSaveCommand">保存</van-button>
+        <van-button size="small" type="success" @click="handeSaveAndExit">保存并退出</van-button>
+      </div>
+    </van-popup>
   </div>
 </template>
 
@@ -283,6 +304,11 @@ const columnsMap: Record<string, any> = {
     { text: '=', value: '=' },
     { text: '≠', value: '≠' }
   ],
+  timeOperation: [
+    { text: '等于', value: '等于' },
+    { text: '早于', value: '早于' },
+    { text: '晚于', value: '晚于' }
+  ],
   timeLabel: [
     { text: '每天', value: '每天' },
     { text: '特定某一天', value: '特定某一天' },
@@ -401,10 +427,10 @@ const handleEditCommand = (type: string, index: number, cIndex?: number) => {
       break
     case 'delay':
       crtCommand.value.stepList[index].list!.push({
-        id: uuid4(),
+        id: '' + Date.now(),
         type: 'time',
         label: '每天',
-        operation: '=',
+        operation: '等于',
         value: '08:00',
         x,
         y
@@ -514,6 +540,9 @@ const handleAddCommand = async (type: string) => {
 
 const handleSaveCommand = () => {
   console.log(crtCommand.value)
+  if (showUnsaveTipPopup.value) {
+    showUnsaveTipPopup.value = false
+  }
 
   let isExistNull = false
   crtCommand.value!.stepList.forEach((item) => {
@@ -549,7 +578,7 @@ const handleSaveCommand = () => {
       project!.isCompiled = isCompiled
     }
     if (command) {
-      command.stepList = crtCommand.value!.stepList
+      command.stepList = deepClone(crtCommand.value!.stepList)
       showSuccessToast('保存成功')
     }
   }
@@ -580,7 +609,61 @@ const handleCancel = async () => {
   await nextTick()
   newCommandName.value = ''
 }
-const showBtnGroup = ref(false)
+const showBtnGroup = ref(true)
+
+const showUnsaveTipPopup = ref(false)
+let toRouterPath = ''
+let isExit = false
+onBeforeRouteLeave((to, from, next) => {
+  console.log(to, from)
+  if (isExit) return next()
+  const project = projectList.value.find((item) => item.id === route.params.pid)
+  if (!project) return next()
+  const isCompiled = deepEqual(
+    project.commandList.find((item) => item.id === crtCommand.value?.id),
+    crtCommand.value
+  )
+  if (isCompiled) return next()
+  showUnsaveTipPopup.value = true
+  toRouterPath = to.path
+})
+const handleExit = () => {
+  showUnsaveTipPopup.value = false
+  isExit = true
+  router.push(toRouterPath)
+}
+const handeSaveAndExit = () => {
+  handleSaveCommand()
+  handleExit()
+}
+
+const handleBeforeUnload = (e: BeforeUnloadEvent) => {
+  const project = projectList.value.find((item) => item.id === route.params.pid)
+  if (project) {
+    const isCompiled = deepEqual(
+      project.commandList.find((item) => item.id === crtCommand.value?.id),
+      crtCommand.value
+    )
+    if (!isCompiled) {
+      e.preventDefault()
+    }
+  }
+}
+
+onMounted(() => {
+  window.addEventListener('beforeunload', handleBeforeUnload)
+  document.addEventListener('visibilitychange', (e) => {
+    if (document.visibilityState === 'hidden') {
+      console.log('页面被隐藏或关闭')
+      handleBeforeUnload(e)
+      // 在这里执行保存或其他操作
+    }
+  })
+})
+
+onUnmounted(() => {
+  window.removeEventListener('beforeunload', handleBeforeUnload)
+})
 </script>
 
 <style scoped>
@@ -607,6 +690,9 @@ const showBtnGroup = ref(false)
   align-items: center;
   gap: 8px;
 }
+.btn-group .van-button {
+  padding: 2px 16px;
+}
 .card {
   padding: 16px;
   margin-bottom: 8px;
@@ -756,4 +842,13 @@ const showBtnGroup = ref(false)
 .pack:active {
   background: #efefef;
 }
+.van-popup .label {
+  margin: 24px;
+  font-size: 18px;
+}
+.van-popup .btn-group {
+  margin: 24px;
+  display: flex;
+  justify-content: flex-end;
+}
 </style>

src/views/ProjectInfo.vue

@@ -1529,6 +1529,11 @@ const get_c_code = () => {
     '≥': '>=',
     '≠': '!='
   }
+  const timeOperationMap: Record<string, number> = {
+    等于: 0,
+    早于: 1,
+    晚于: 2
+  }
   let c_code = ''
   if (crtProject.value) {
     c_code = `#include "iec_def.h"
@@ -1574,20 +1579,21 @@ static PT_THREAD(PROGRAM${index}_body(struct pt *pt, TIME *pt_delay))
                     1000
                 )
                 const operation = weekMap[cItem.label!]
+                const timeOperation = timeOperationMap[cItem.operation!]
 
                 if ((operation || operation === 0) && operation !== 8) {
-                  condition_code += `time_compare(${sec}, 0, 0, ${operation})${linkStr}`
+                  condition_code += `time_compare(${sec},${timeOperation}, 0, 0, ${operation})${linkStr}`
                 } else if (cItem.label.includes('-')) {
                   // 自定义时间
                   const dateArr = cItem.label!.split('-')
                   const start = Math.floor(new Date(dateArr[0]).getTime() / 1000)
                   const end = Math.floor(new Date(dateArr[1]).getTime() / 1000)
-                  condition_code += `time_compare(${sec}, ${start}, ${end}, 8)${linkStr}`
+                  condition_code += `time_compare(${sec},${timeOperation}, ${start}, ${end}, 8)${linkStr}`
                   console.log(condition_code)
                 } else {
                   // 特定某一天
                   const start = Math.floor(new Date(cItem.label).getTime() / 1000)
-                  condition_code += `time_compare(${sec}, ${start}, ${start + 24 * 60 * 60}, 8)${linkStr}`
+                  condition_code += `time_compare(${sec},${timeOperation}, ${start}, ${start + 24 * 60 * 60}, 8)${linkStr}`
                 }
               }
             } else if (sItem.type === 'exec') {