Bläddra i källkod

步进模式下切换阶段联动锁定时间选项

  - mock数据为每个阶段(P1-P4)配置独立的锁定时间选项
  - 新增syncLocktimeByStage方法,切换阶段时自动更新锁定时间下拉选项并重置选中值
  - 步进模式下切换阶段自动重新显示锁定时间面板(关闭后切换阶段可恢复)
  - 提交数据lockConfig新增stage字段标识当前锁定阶段
画安 2 veckor sedan
förälder
incheckning
6307c45d99
2 ändrade filer med 29 tillägg och 0 borttagningar
  1. 21 0
      src/components/ui/CrossingDetailPanel.vue
  2. 8 0
      src/mock/api.js

+ 21 - 0
src/components/ui/CrossingDetailPanel.vue

@@ -247,12 +247,20 @@ export default {
             // 需求4:切换步进方案策略时,出现锁定时间弹窗
             if (newVal === 'step') {
                 this.showLockTime = true;
+                this.syncLocktimeByStage();
             } else {
                 this.showLockTime = false;
             }
 
             // 模拟需求1:根据不同模式,切换对应的控制方案数据 (Mock 逻辑)
             this.updateSchemeDataByMethod(newVal);
+        },
+        // 步进模式下切换阶段时,更新锁定时间选项并重新显示面板
+        currentStage() {
+            if (this.currentMethod === 'step') {
+                this.showLockTime = true;
+                this.syncLocktimeByStage();
+            }
         }
     },
     mounted() {
@@ -267,6 +275,18 @@ export default {
         if (this._ro) this._ro.disconnect();
     },
     methods: {
+        // 根据当前选中阶段同步锁定时间选项
+        syncLocktimeByStage() {
+            const stage = this.currentStageList.find(s => s.value === this.currentStage);
+            if (stage && stage.locktimeOptions) {
+                this.locktimeOptions = stage.locktimeOptions;
+                // 如果当前值不在新选项中,重置为第一个
+                const hasValue = this.locktimeOptions.some(o => o.value === this.currentLocktime);
+                if (!hasValue) {
+                    this.currentLocktime = this.locktimeOptions[0]?.value || null;
+                }
+            }
+        },
         stagePercent(time) {
             const total = this.currentStageList.reduce((s, item) => s + (item.time || 0), 0);
             if (!total) return '0%';
@@ -482,6 +502,7 @@ export default {
                 scheme: this.currentScheme,
                 stages: this.currentMethod === 'temp' ? this.currentStageList : null,
                 lockConfig: this.currentMethod === 'step' ? {
+                    stage: this.currentStage,
                     type: this.lockTimeType,
                     time: this.lockTimeType === 'timer' ? this.currentLocktime : null
                 } : null

+ 8 - 0
src/mock/api.js

@@ -902,12 +902,20 @@ export async function apiGetCrossingDetailData(id, { iconMode = 'default' } = {}
   // 从相位数据中提取阶段列表(优先上轨道绿灯相位,单轨道时取 track 0,最多4个)
   const hasTrack1 = phaseData.some(p => p[0] === 1)
   const greenPhases = phaseData.filter(p => p[0] === (hasTrack1 ? 1 : 0) && p[5] === 'green').slice(0, 4)
+  // 每个阶段的锁定时间选项(不同阶段时长不同,锁定选项也不同)
+  const stageLockOptions = [
+    [{ label: '20', value: 20 }, { label: '30', value: 30 }, { label: '45', value: 45 }, { label: '60', value: 60 }],
+    [{ label: '15', value: 15 }, { label: '25', value: 25 }, { label: '35', value: 35 }, { label: '50', value: 50 }],
+    [{ label: '20', value: 20 }, { label: '30', value: 30 }, { label: '45', value: 45 }, { label: '60', value: 60 }],
+    [{ label: '10', value: 10 }, { label: '20', value: 20 }, { label: '30', value: 30 }, { label: '40', value: 40 }],
+  ]
   const stageList = greenPhases.map((p, i) => ({
     value: String(i + 1),
     time: p[8],
     phaseName: p[3],
     direction: p[6],
     img: ARROWS[i],
+    locktimeOptions: stageLockOptions[i] || stageLockOptions[0],
   }))
 
   // 控制方式选项 + 根据路口选择不同的当前控制方式