openatc-components 0.2.74 → 0.2.76

package/package/kisscomps/components/IntersectionMap/crossDirection/crossDiagram.vue

@@ -32,14 +32,11 @@
     <div class="right-dir-road" v-if="roadDir === 'right'">
       <div class="centerText" v-if="crossType !== 'Customroads' && isHasPhase">
       <!-- 相位倒计时 -->
-      <div class="phaseCountdown" v-show="isShowInterval" v-if="isLoaded && isHasPhase && isHasCountdown" :class="{'countdownBg': isLoaded}">
+      <div class="phaseCountdown" v-show="isShowInterval" v-if="isLoaded && isHasPhase" :class="{'countdownBg': isLoaded}">
         <div v-for="curPhase in phaseCountdownList" :key="curPhase.id" :style="{color: curPhase.phaseCountdownColor}">
-          <div v-if="curPhase.phaseCountdown !== undefined && curPhase.phaseCountdown !== -1" style="overflow: hidden;margin-bottom: 4px;">
-            <span style="float: left;width: 42px;height: 42px;position: relative;border: 1px solid rgba(255, 255, 255, 0.1);margin-right: 5px;">
-              <xdr-dir-selector :Data="xdrData" :Datas="xdrpedData" Width="55px" Height="55px" Widths="55px" Heights="55px" :showlist="curPhase.showlist" :roadDirection="roadDirection"></xdr-dir-selector>
-            </span>
-            <span style="float: left;color: #fff;margin-right: 8px;width: 30px;">P{{curPhase.id}}:</span>
-            <span style="float: left;font-size: 25px;">{{curPhase.phaseCountdown}}</span>
+          <div v-if="curPhase.phaseCountdown !== -1">
+            <span style="float: left;font-size: 20px;color: #fff;width: 70px;">{{$t('openatccomponents.overview.phase')}}{{curPhase.id}}:</span>
+            <span style="float: left;">{{curPhase.phaseCountdown}}</span>
           </div>
         </div>
       </div>
@@ -97,14 +94,11 @@
     <div class="left-dir-road" v-if="roadDir === 'left'">
       <div class="centerText" v-if="mainType === '100' || mainType === '101'" :class="{'countdownBg': isLoaded}">
         <!-- 相位倒计时 -->
-        <div class="phaseCountdown" v-show="isShowInterval" v-if="isLoaded && isHasPhase && isHasCountdown" :class="{'countdownBg': isLoaded}">
+        <div class="phaseCountdown" v-if="isLoaded && isHasPhase">
           <div v-for="curPhase in phaseCountdownList" :key="curPhase.id" :style="{color: curPhase.phaseCountdownColor}">
-            <div v-if="curPhase.phaseCountdown !== undefined && curPhase.phaseCountdown !== -1" style="overflow: hidden;margin-bottom: 4px;">
-              <span style="float: left;width: 42px;height: 42px;position: relative;border: 1px solid rgba(255, 255, 255, 0.1);margin-right: 5px;">
-                <xdr-dir-selector :Data="xdrData" :Datas="xdrpedData" Width="55px" Height="55px" Widths="55px" Heights="55px" :showlist="curPhase.showlist" :roadDirection="roadDirection"></xdr-dir-selector>
-              </span>
-              <span style="float: left;color: #fff;margin-right: 8px;width: 30px;">P{{curPhase.id}}:</span>
-              <span style="float: left;font-size: 25px;">{{curPhase.phaseCountdown}}</span>
+            <div v-if="curPhase.phaseCountdown !== -1">
+              <span style="float: left;font-size: 20px;color: #fff;width: 70px;">{{$t('openatccomponents.overview.phase')}}{{curPhase.id}}:</span>
+              <span style="float: left;">{{curPhase.phaseCountdown}}</span>
             </div>
           </div>
         </div>
@@ -381,16 +375,7 @@ export default {
       comdirePhaseData: [], // 对比相同方向车道相位数据后，被删减的唯一direction的数组
       comdireOverlapPhaseData: [], // 对比相同方向车道跟随相位数据后，被删减的唯一direction的数组
       busPhaseData: [], // 公交相位数据
-      comdireBusPhaseData: [], //  对比相同方向公交车道数据后，被删减的唯一direction的数组
-      phaseDirMap: new Map(),
-      xdrData: {
-        left: '5px',
-        top: '4px'
-      },
-      xdrpedData: {
-        left: '1px',
-        top: '1px'
-      }
+      comdireBusPhaseData: [] //  对比相同方向公交车道数据后，被删减的唯一direction的数组
     }
   },
   methods: {
@@ -642,7 +627,6 @@ export default {
     getCurPhaseCountdown () {
       // 获取当前相位倒计时颜色
       this.phaseCountdownList = []
-      this.isHasCountdown = false
       this.curPhase.forEach(curP => {
         this.phaseStatusList.forEach(phaseInfo => {
           if (phaseInfo.id === curP) {
@@ -650,35 +634,11 @@ export default {
             countdownObj.id = phaseInfo.id
             countdownObj.phaseCountdown = phaseInfo.countdown
             countdownObj.phaseCountdownColor = this.ColorMap.get(phaseInfo.type)
-            let curphasedir = this.phaseDirMap.get(phaseInfo.id)
-            if (curphasedir !== undefined) {
-              countdownObj.showlist = curphasedir.direction.map(dir => {
-                return {
-                  id: dir,
-                  peddirection: this.getshowped(curphasedir.peddirection),
-                  color: '#fff'
-                }
-              })
-            } else {
-              countdownObj.showlist = []
-            }
-
             this.phaseCountdownList.push(countdownObj)
-            if (phaseInfo.countdown !== undefined && phaseInfo.countdown !== -1) {
-              this.isHasCountdown = true
-            }
           }
         })
       })
     },
-    getshowped (peddirection) {
-      let peddirarr = peddirection.map(peddir => ({
-        id: peddir,
-        name: this.PhaseDataModel.getSidePos(peddir).name,
-        color: 'rgba(255, 255, 255, 0.4)'
-      }))
-      return peddirarr
-    },
     getIntersectionInfo () {
       // 获取路口信息
       const agentid = this.agentId || '0'
@@ -710,7 +670,6 @@ export default {
           return
         }
         this.crossInfo = res.data.data.param
-        this.crossInfo.phaseList.forEach(cross => this.phaseDirMap.set(cross.id, {direction: cross.direction, peddirection: cross.peddirection}))
         if (this.mainType === '100' || this.mainType === '101' || this.mainType === '104') {
           // 城市道路加载车道相位坐标和人行道坐标
           this.getPhasePos()
@@ -1227,8 +1186,8 @@ export default {
   /* padding-left: 16px; */
 }
 .phaseCountdown {
-  line-height: 42PX;
-  font-size: 18px;
+  line-height: 40px;
+  font-size: 30px;
   font-weight: normal;
   font-stretch: normal;
   letter-spacing: 0px;
@@ -1237,16 +1196,14 @@ export default {
   margin: 0 auto;
 }
 .countdownBg {
-  border-radius: 10PX;
+  border-radius: 10px;
   background-color: rgba(94, 90, 90, 0.8);
-  padding-left: 14PX;
-  padding-top: 10PX;
-  padding-bottom: 10PX;
+  padding-left: 16px;
 }
 .centerText .text {
   display: inline-block;
   color: #299BCC;
-  margin-top: 20PX;
+  margin-top: 20px;
 }
 
 .baseImg {

package/package/kisscomps/components/PatternStatus/PatternStatus.vue

@@ -48,7 +48,7 @@
             <div class="divider" :style="{'left':item, 'height':barrierHeight}"></div>
           </div>
         </div>
-        <div v-show="(cycle && cycle>0 && this.isControl) || (newCycle && newCycle>0 && this.isControl)">
+        <div v-show="(this.controlData && this.controlData.curTime && cycle && cycle>0 && this.isControl) || (this.controlData && newCycle && newCycle>0 && this.isControl)">
           <div class="curTimeDiv" :style="{'left':paddingLeft }">{{ timeNumDevide }}</div>
           <div class="curTimeLine" :style="{'left':paddingLeft, 'height':barrierHeight}"></div>
         </div>
@@ -84,6 +84,15 @@
               <div class="first-1" :style="{'width':list.yellowWidth,'height':'34px','background':'#f9dc6a'}"></div>
               <div class="first-1" :style="{'width':list.redWidth,'height':'34px','background':'#f27979'}"></div>
             </div>
+            <div v-if="this.controlData && this.controlData.curTime">
+            <div class="curTimeDiv" :style="{ left: paddingLefts }">
+              {{ timeNumDevides }}
+            </div>
+            <div
+              class="curTimeLine"
+              :style="{ left: paddingLefts, height: '56px' }"
+            ></div>
+          </div>
           </div>
         <!-- </div> -->
       </div>
@@ -103,6 +112,7 @@ export default {
   data () {
     return {
       barrierHeight: '',
+      stageCycle: '',
       barrierList: [],
       newCycle: this.cycles,
       patternIds: this.patternId,
@@ -177,6 +187,19 @@ export default {
     }
   },
   computed: {
+    paddingLefts () {
+      let res = '0%'
+      let curPercent = this.curtime / this.stageCycle
+      if (curPercent >= 1) {
+        curPercent = 1
+      }
+      res = curPercent * 100 + '%'
+      return res
+    },
+    timeNumDevides () {
+      let res = this.curtime
+      return res
+    },
     paddingLeft () {
       let res = '0%'
       if (this.contrloCycle > 0) {
@@ -417,6 +440,7 @@ export default {
           let stageMaxCyle = stageCycleList.reduce((a, b) => {
             return a + b
           }, 0)
+          this.stageCycle = stageMaxCyle
           this.stageLists = this.localPatternList[i].stagesList.map(item => {
             return {
               ...item,

package/package/kisscomps/components/SchemeConfig/realtimeStatusModal/index.vue

@@ -49,14 +49,6 @@
       <div style="float: left;" class="cross-name">{{$t('openatccomponents.overview.platform')}}:</div>
       <div style="margin-left: 85px;" class="cross-value">{{platform}}</div>
     </div>
-    <div class="cross-content" v-if="controlData.current_stagecd !== undefined">
-      <div style="float: left;" class="cross-name">{{$t('openatccomponents.overview.stagecountdown')}}:</div>
-      <div style="margin-left: 85px;" class="cross-value">{{controlData.current_stagecd}}</div>
-    </div>
-    <div class="cross-content" v-if="controlData.stages_len">
-      <div style="float: left;" class="cross-name">{{$t('openatccomponents.overview.stageduration')}}:</div>
-      <div style="margin-left: 85px;" class="cross-value">{{controlData.stages_len + ''}}</div>
-    </div>
     <div class="cross-content">
       <div style="float: left;" class="cross-name">{{$t('openatccomponents.overview.faultinfo')}}:</div>
       <div style="margin-left: 85px;" v-if="curFaultList.length">