openatc-components 0.2.77 → 0.2.79

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>
@@ -246,10 +240,12 @@ export default {
       default: ''
     },
     choosedDirection: {
-      type: Array
+      type: Array,
+      default: () => []
     },
     choosedPedDirection: {
-      type: Array
+      type: Array,
+      default: () => []
     },
     isVipRoute: { // 区分普通路口和VIP路口，如果是vip路口（特勤路线和分组管控），才需要获取通道和处理通道冲突，并显示已选方向
       type: Boolean,
@@ -262,6 +258,10 @@ export default {
     isThirdSignal: {
       type: Boolean,
       default: false
+    },
+    channelType: {
+      type: Boolean,
+      default: false
     }
   },
   // computed: {
@@ -279,10 +279,20 @@ export default {
       handler: function (val, oldVal) {
         // 路口状态数据
         this.statusData = JSON.parse(JSON.stringify(val))
-        this.phaseStatusList = val.phase
-        this.overlapStatusList = val.overlap
         // 默认显示相位数据（包括黄闪、全红、关灯状态下，或者匝道，均不做比对跟随相位的处理）
         this.drawDefaultPhaseIcon()
+        if (this.channelType) {
+          this.channelStatusList = val.channellamp
+          // 显示实时通道状态
+          this.createChannelStatusMap()
+          this.getChannelPhaseStatus()
+          // this.getChannelPedStatus()
+          // this.getChannelCountdown()
+          return
+        }
+
+        this.phaseStatusList = val.phase
+        this.overlapStatusList = val.overlap
         if (val.control === 1 || val.control === 2 || val.control === 3) {
           // 黄闪、全红、关灯属于特殊控制，优先级最高，直接改变灯色，不用判断phase里的type，也不需要考虑跟随相位的灯色优先级
           if (val.control === 1) {
@@ -382,15 +392,8 @@ export default {
       comdireOverlapPhaseData: [], // 对比相同方向车道跟随相位数据后，被删减的唯一direction的数组
       busPhaseData: [], // 公交相位数据
       comdireBusPhaseData: [], //  对比相同方向公交车道数据后，被删减的唯一direction的数组
-      phaseDirMap: new Map(),
-      xdrData: {
-        left: '5px',
-        top: '4px'
-      },
-      xdrpedData: {
-        left: '1px',
-        top: '1px'
-      }
+      channelStatusMap: new Map(), // 通道实时状态映射
+      channelStatusList: [] // 通道实时状态列表
     }
   },
   methods: {
@@ -642,7 +645,6 @@ export default {
     getCurPhaseCountdown () {
       // 获取当前相位倒计时颜色
       this.phaseCountdownList = []
-      this.isHasCountdown = false
       this.curPhase.forEach(curP => {
         this.phaseStatusList.forEach(phaseInfo => {
           if (phaseInfo.id === curP) {
@@ -650,35 +652,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'
@@ -709,8 +687,11 @@ export default {
           this.getChannelInfo()
           return
         }
+        if (this.channelType) {
+          this.getChannelInfo()
+          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()
@@ -1085,7 +1066,7 @@ export default {
     async drawPhaseIcon () {
       const targetIds = [4, 8, 12, 16] // 掉头相位后画
       this.LanePhaseData = this.LanePhaseData.filter(item => !targetIds.includes(item.id)).concat(this.LanePhaseData.filter(item => targetIds.includes(item.id)))
-      if (!this.isThirdSignal) {
+      if (!this.isThirdSignal && this.isVipRoute) {
         await this.getConflictList()
         this.handleClickedPhase()
         this.compLanePhaseData = JSON.parse(JSON.stringify(this.LanePhaseData))
@@ -1195,6 +1176,34 @@ export default {
           // console.log(this.LanePhaseData)
         }
       })
+    },
+    createChannelStatusMap () {
+      // 生成相位id和相位状态对应数据结构
+      this.channelStatusList.map(channel => {
+        let channelId = channel.id
+        let channelInfo = {
+          type: channel.light
+        }
+        this.channelStatusMap.set(channelId, channelInfo)
+      })
+    },
+    getChannelPhaseStatus () {
+      this.comdirePhaseData = []
+      let curLanePhaseData = []
+      for (let i = 0; i < this.LanePhaseData.length; i++) {
+        let curPhaseStatus = this.channelStatusMap.get(this.LanePhaseData[i].channelid)
+        if (!curPhaseStatus) continue
+        const data = {
+          ...this.LanePhaseData[i],
+          type: curPhaseStatus.type,
+          color: this.ColorMap.get(curPhaseStatus.type),
+          // phaseCountdown: curPhaseStatus.phaseCountdown,
+          flag: 'channel' // 车道相位数据标识
+        }
+        curLanePhaseData.push(data)
+      }
+      this.LanePhaseData = JSON.parse(JSON.stringify(curLanePhaseData))
+      this.compLanePhaseData = JSON.parse(JSON.stringify(this.LanePhaseData))
     }
   },
   mounted () {
@@ -1227,8 +1236,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 +1246,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/IntersectionMap/crossDirection/phaseIcon/LphaseIconSvg.vue

@@ -12,11 +12,11 @@
 <template>
   <div :id="Data.key" :style="{position: 'absolute', left: Data.left, top: Data.top}">
     <div :class="Data.id < 9 ? '' : 'hide'">
-      <svg v-if="Data.id === 4 || Data.id === 8" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 18.1 14.5" :width="IconLenghDiaoTou" :height="IconWdithDiaoTou">
+      <!-- <svg v-if="Data.id === 4 || Data.id === 8" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 18.1 14.5" :width="IconLenghDiaoTou" :height="IconWdithDiaoTou">
         <path id="东掉头" :class="Data.name === '东掉头' ? '' : 'invisible'" d="M4.876,3.054H8.5V0.039L16.07,4.276,8.411,8.513V5.5H4.792C3.53,5.5,2.436,6.883,2.436,8.513s1.094,3.015,2.357,3.015H18.006v2.444H4.876A5.2,5.2,0,0,1-.005,8.513,5.2,5.2,0,0,1,4.876,3.054Z" transform="translate(0 -0.031)" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
         <path id="西掉头" :class="Data.name === '西掉头' ? '' : 'invisible'" d="M13.124,10.964H9.5v3.028L1.93,9.736,9.589,5.48V8.508h3.619c1.262,0,2.357-1.391,2.357-3.028S14.47,2.452,13.208,2.452H-0.006V0H13.124c2.693,0,4.881,2.455,4.881,5.483S15.817,10.964,13.124,10.964Z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
-      </svg>
-      <svg v-else version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+      </svg> -->
+      <svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
         viewBox="0 0 36 26" style="enable-background:new 0 0 36 26;" xml:space="preserve" :width="IconLengh" :height="IconWdith">
           <!-- 东相位 -->
           <path id="东左转" :class="Data.name === '东左转' ? '' : 'invisible'" d="M11,7.1h24v-3H10.9c-3.1,0-5.7,2.6-5.8,5.7l-0.4,2.9L1,12.2l3.9,9.7l6.5-8.2l-3.7-0.5l0.5-3.3
@@ -24,24 +24,22 @@
           <path id="东右转" :class="Data.name === '东右转' ? '' : 'invisible'" d="M8.1,15.8l-0.4-3l3.7-0.5L4.9,4.1L1,13.8l3.7-0.5l0.4,2.9c0,3.2,2.6,5.7,5.8,5.7H35v-3H10.9
             c-1.5,0-2.8-1.3-2.8-2.8V15.8z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
           <polygon id="东直行" :class="Data.name === '东直行' ? '' : 'invisible'" points="35,11.5 10.1,11.5 10.1,7.8 0.9,13 10.1,18.2 10.1,14.5 35,14.5 " :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
-          <!-- <path id="东掉头" :class="Data.name === '东掉头' ? '' : 'invisible'" d="M13.6,15.2c0,3.7,2.6,6.7,5.8,6.7H35v-3H19.4c-1.5,0-2.8-1.7-2.8-3.7s1.3-3.7,2.8-3.7h4.3v3.7
-l9.1-5.2l-9.1-5.2v3.7h-4.3C16.2,8.5,13.6,11.5,13.6,15.2z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/> -->
+          <path id="东掉头" :class="Data.name === '东掉头' ? '' : 'invisible'" d="M1.1,14.5c0,3.7,2.6,6.7,5.8,6.7H35v-3H6.8c-1.5,0-2.8-1.7-2.8-3.7s1.3-3.7,2.8-3.7h4.3v3.7l9.1-5.2l-9-5.2v3.7H6.9C3.7,7.8,1.1,10.8,1.1,14.5z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
           <!-- 西相位 -->
           <path id="西左转" :class="Data.name === '西左转' ? '' : 'invisible'" d="M25,18.9H1v3h24.1c3.1,0,5.7-2.6,5.8-5.7l0.4-2.9l3.7,0.5l-3.9-9.7l-6.5,8.2l3.7,0.5l-0.5,3.3
             C27.8,17.6,26.6,18.9,25,18.9L25,18.9z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
           <path id="西右转" :class="Data.name === '西右转' ? '' : 'invisible'" d="M27.9,10.2l0.4,3l-3.7,0.5l6.5,8.2l3.9-9.7l-3.7,0.5l-0.4-2.9c0-3.2-2.6-5.7-5.8-5.7H1v3h24.1
             c1.5,0,2.8,1.3,2.8,2.8V10.2z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
           <polygon id="西直行" :class="Data.name === '西直行' ? '' : 'invisible'" points="1,14.5 26,14.5 26,18.2 35.1,13 26,7.8 26,11.5 1,11.5 " :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
-          <!-- <path id="西掉头" :class="Data.name === '西掉头' ? '' : 'invisible'" d="M22.4,10.8c0-3.7-2.6-6.7-5.8-6.7H1v3h15.7c1.5,0,2.8,1.7,2.8,3.7s-1.3,3.7-2.8,3.7h-4.3v-3.7
-L3.3,16l9,5.3v-3.8h4.3C19.8,17.5,22.4,14.5,22.4,10.8z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/> -->
+          <path id="西掉头" :class="Data.name === '西掉头' ? '' : 'invisible'" d="M34.9,10.8c0-3.7-2.6-6.7-5.8-6.7H0.9v3h28.3c1.5,0,2.8,1.7,2.8,3.7s-1.3,3.7-2.8,3.7h-4.3v-3.7L15.8,16l9,5.2v-3.7h4.3C32.3,17.5,34.9,14.5,34.9,10.8z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
         </svg>
       </div>
       <div :class="Data.id >= 9 ? '' : 'hide'">
-        <svg v-if="Data.id === 12 || Data.id === 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 14.5 18.1" :width="IconWdithDiaoTou" :height="IconLenghDiaoTou">
+        <!-- <svg v-if="Data.id === 12 || Data.id === 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 14.5 18.1" :width="IconWdithDiaoTou" :height="IconLenghDiaoTou">
           <path id="南掉头" :class="Data.name === '南掉头' ? '' : 'invisible'"  d="M10.946,4.876V8.5h3.015L9.724,16.07,5.487,8.411H8.5V4.792c0-1.262-1.385-2.357-3.015-2.357S2.472,3.53,2.472,4.792V18.006H0.028V4.876A5.2,5.2,0,0,1,5.487-.005,5.2,5.2,0,0,1,10.946,4.876Z" transform="translate(-0.031)" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
           <path id="北掉头" :class="Data.name === '北掉头' ? '' : 'invisible'" d="M3.036,13.124V9.5H0.008L4.264,1.93,8.52,9.589H5.492v3.619c0,1.262,1.391,2.357,3.028,2.357s3.028-1.094,3.028-2.357V-0.006H14V13.124c0,2.693-2.455,4.881-5.483,4.881S3.036,15.817,3.036,13.124Z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
-        </svg>
-        <svg  v-else version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+        </svg> -->
+        <svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
           viewBox="0 0 26 36" style="enable-background:new 0 0 26 36;" xml:space="preserve" :width="IconWdith" :height="IconLengh">
           <!-- 南相位 -->
           <path id="南左转" :class="Data.name === '南左转' ? '' : 'invisible'" d="M18.9,11v24h3V10.9c0-3.1-2.6-5.7-5.7-5.8l-2.9-0.4L13.8,1L4.1,4.9l8.2,6.5l0.5-3.7l3.3,0.5
@@ -49,16 +47,14 @@ L3.3,16l9,5.3v-3.8h4.3C19.8,17.5,22.4,14.5,22.4,10.8z" :fill="this.FlashColor ?
           <path id="南右转" :class="Data.name === '南右转' ? '' : 'invisible'" d="M10.2,8.1l3-0.4l0.5,3.7l8.2-6.5L12.2,1l0.5,3.7L9.8,5.1c-3.2,0-5.7,2.6-5.7,5.8V35h3V10.9
             c0-1.5,1.3-2.8,2.8-2.8H10.2z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
           <polygon id="南直行" :class="Data.name === '南直行' ? '' : 'invisible'" points="14.5,35 14.5,10.1 18.2,10.1 13,0.9 7.8,10.1 11.5,10.1 11.5,35 " :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
-          <!-- <path id="南掉头" :class="Data.name === '南掉头' ? '' : 'invisible'" d="M10.8,13.6c-3.7,0-6.7,2.6-6.7,5.8V35h3V19.4c0-1.5,1.7-2.8,3.7-2.8s3.7,1.3,3.7,2.8v4.3h-3.7
-l5.2,9.1l5.2-9.1h-3.8v-4.3C17.4,16.2,14.4,13.6,10.8,13.6z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/> -->
+          <path id="南掉头" :class="Data.name === '南掉头' ? '' : 'invisible'" d="M11.5,1.1c-3.7,0-6.7,2.6-6.7,5.8V35h3V6.8C7.8,5.3,9.5,4,11.5,4s3.7,1.3,3.7,2.8v4.3h-3.7l5.2,9.1l5.2-9h-3.7V6.9C18.2,3.7,15.2,1.1,11.5,1.1z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
           <!-- 北相位 -->
             <path id="北左转" :class="Data.name === '北左转' ? '' : 'invisible'" d="M7.1,25V1h-3v24.1c0,3.1,2.6,5.7,5.7,5.8l2.9,0.4L12.2,35l9.7-3.9l-8.2-6.5l-0.5,3.7l-3.3-0.5
               C8.4,27.8,7.1,26.6,7.1,25L7.1,25z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
             <path id="北右转" :class="Data.name === '北右转' ? '' : 'invisible'" d="M15.8,27.9l-3,0.4l-0.5-3.7l-8.2,6.5l9.7,3.9l-0.5-3.7l2.9-0.4c3.2,0,5.7-2.6,5.7-5.8V1h-3v24.1
               c0,1.5-1.3,2.8-2.8,2.8H15.8z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
             <polygon id="北直行" :class="Data.name === '北直行' ? '' : 'invisible'" points="11.5,0.9 11.5,25.9 7.8,25.9 13,35 18.2,25.9 14.5,25.9 14.5,0.9 " :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
-            <!-- <path id="北掉头" :class="Data.name === '北掉头' ? '' : 'invisible'" d="M15.2,22.4c3.7,0,6.7-2.6,6.7-5.8V1h-3v15.7c0,1.5-1.7,2.8-3.7,2.8s-3.7-1.3-3.7-2.8v-4.3h3.7
-L10,3.3l-5.2,9h3.7v4.3C8.5,19.8,11.5,22.4,15.2,22.4z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/> -->
+            <path id="北掉头" :class="Data.name === '北掉头' ? '' : 'invisible'" d="M14.5,34.9c3.7,0,6.7-2.6,6.7-5.8V0.9h-3v28.3c0,1.5-1.7,2.8-3.7,2.8s-3.7-1.3-3.7-2.8v-4.3h3.7l-5.2-9.1l-5.2,9h3.7v4.3C7.8,32.3,10.8,34.9,14.5,34.9z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
         </svg>
       </div>
   </div>
@@ -140,8 +136,9 @@ export default {
   },
   methods: {
     handleClick (e) {
-      let clickedPath = e.target
-      // console.log(clickedPath)
+      let clickedSvg = e.currentTarget
+      // console.log(clickedSvg)
+      let clickedPath = clickedSvg.querySelector(`#${this.Data.name}`)
       if (clickedPath) {
         // 在这里对找到的元素进行操作
         if (clickedPath.getAttribute('disabled') === 'true') {
@@ -173,9 +170,12 @@ export default {
     },
     IconAddEvent () {
       let IconDom = document.getElementById(this.Data.key)
-      let DirDom = IconDom.querySelector(`#${this.Data.name}`)
-      if (this.clickMode && DirDom.getAttribute('class') !== 'invisible') {
-        DirDom.addEventListener('click', this.handleClick)
+      // let DirDom = IconDom.querySelector(`#${this.Data.name}`)
+      // if (this.clickMode && DirDom.getAttribute('class') !== 'invisible') {
+      //   DirDom.addEventListener('click', this.handleClick)
+      // }
+      if (this.clickMode) {
+        IconDom.addEventListener('click', this.handleClick)
       }
     }
   },

package/package/kisscomps/components/IntersectionMap/crossDirection/phaseIcon/phaseIconSvg.vue

@@ -12,35 +12,33 @@
 <template>
   <div :id="Data.key" :style="{position: 'absolute', left: Data.left, top: Data.top}">
     <div :class="Data.id < 9 ? '' : 'hide'">
-      <svg v-if="Data.id === 4 || Data.id === 8" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 14" :width="IconLenghDiaoTou" :height="IconWdithDiaoTou">
+      <!-- <svg v-if="Data.id === 4 || Data.id === 8" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 14" :width="IconLenghDiaoTou" :height="IconWdithDiaoTou">
         <path id="东掉头" :class="Data.name === '东掉头' ? '' : 'invisible'" d="M4.876,10.981H8.5v3.042L16.07,9.748,8.411,5.474V8.515H4.792c-1.262,0-2.357-1.4-2.357-3.042S3.53,2.432,4.792,2.432H18.006V-0.034H4.876c-2.693,0-4.881,2.466-4.881,5.508S2.183,10.981,4.876,10.981Z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
         <path id="西掉头" :class="Data.name === '西掉头' ? '' : 'invisible'" d="M13.124,3.036H9.5V0.008L1.93,4.264,9.589,8.52V5.492h3.619c1.262,0,2.357,1.391,2.357,3.028s-1.094,3.028-2.357,3.028H-0.006V14H13.124c2.693,0,4.881-2.455,4.881-5.483S15.817,3.036,13.124,3.036Z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
-      </svg>
-      <svg v-else xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 36 26" :width="IconLengh" :height="IconWdith">
+      </svg> -->
+      <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 36 26" :width="IconLengh" :height="IconWdith">
           <!-- 东相位 -->
           <path id="东左转" :class="Data.name === '东左转' ? '' : 'invisible'" d="M11,7.1h24v-3H10.9c-3.1,0-5.7,2.6-5.8,5.7l-0.4,2.9L1,12.2l3.9,9.7l6.5-8.2l-3.7-0.5l0.5-3.3
             C8.2,8.4,9.4,7.1,11,7.1L11,7.1z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
           <path id="东右转" :class="Data.name === '东右转' ? '' : 'invisible'" d="M8.1,15.8l-0.4-3l3.7-0.5L4.9,4.1L1,13.8l3.7-0.5l0.4,2.9c0,3.2,2.6,5.7,5.8,5.7H35v-3H10.9
             c-1.5,0-2.8-1.3-2.8-2.8V15.8z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
           <polygon id="东直行" :class="Data.name === '东直行' ? '' : 'invisible'" points="35,11.5 10.1,11.5 10.1,7.8 0.9,13 10.1,18.2 10.1,14.5 35,14.5 " :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
-          <!-- <path id="东掉头" :class="Data.name === '东掉头' ? '' : 'invisible'" d="M19.4,17.5h4.3v3.7l9.1-5.2l-9.1-5.2v3.7h-4.3c-1.5,0-2.8-1.7-2.8-3.7s1.3-3.7,2.8-3.7H35v-3H19.4
-            c-3.2,0-5.8,3-5.8,6.7C13.6,14.5,16.2,17.5,19.4,17.5z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/> -->
+          <path id="东掉头" :class="Data.name === '东掉头' ? '' : 'invisible'" d="M6.9,17.5h4.3v3.7l9-5.2l-9.1-5.2v3.7H6.8c-1.5,0-2.8-1.7-2.8-3.7s1.3-3.7,2.8-3.7H35v-3H6.9c-3.2,0-5.8,3-5.8,6.7C1.1,14.5,3.7,17.5,6.9,17.5z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
           <!-- 西相位 -->
           <path id="西左转" :class="Data.name === '西左转' ? '' : 'invisible'" d="M25,18.9H1v3h24.1c3.1,0,5.7-2.6,5.8-5.7l0.4-2.9l3.7,0.5l-3.9-9.7l-6.5,8.2l3.7,0.5l-0.5,3.3
             C27.8,17.6,26.6,18.9,25,18.9L25,18.9z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
           <path id="西右转" :class="Data.name === '西右转' ? '' : 'invisible'" d="M27.9,10.2l0.4,3l-3.7,0.5l6.5,8.2l3.9-9.7l-3.7,0.5l-0.4-2.9c0-3.2-2.6-5.7-5.8-5.7H1v3h24.1
             c1.5,0,2.8,1.3,2.8,2.8V10.2z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
           <polygon id="西直行" :class="Data.name === '西直行' ? '' : 'invisible'" points="1,14.5 26,14.5 26,18.2 35.1,13 26,7.8 26,11.5 1,11.5 " :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
-          <!-- <path id="西掉头" :class="Data.name === '西掉头' ? '' : 'invisible'" d="M16.6,8.5h-4.3V4.7L3.3,10l9.1,5.2v-3.7h4.3c1.5,0,2.8,1.7,2.8,3.7s-1.3,3.7-2.8,3.7H1v3h15.6
-            c3.2,0,5.8-3,5.8-6.7C22.4,11.5,19.8,8.5,16.6,8.5z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/> -->
+          <path id="西掉头" :class="Data.name === '西掉头' ? '' : 'invisible'" d="M29.1,8.5h-4.3V4.8l-9,5.2l9.1,5.2v-3.7h4.3c1.5,0,2.8,1.7,2.8,3.7s-1.3,3.7-2.8,3.7H0.9v3h28.2c3.2,0,5.8-3,5.8-6.7C34.9,11.5,32.3,8.5,29.1,8.5z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
         </svg>
       </div>
       <div :class="Data.id >= 9 ? '' : 'hide'">
-        <svg v-if="Data.id === 12 || Data.id === 16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 14 18" :width="IconWdithDiaoTou" :height="IconLenghDiaoTou">
+        <!-- <svg v-if="Data.id === 12 || Data.id === 16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 14 18" :width="IconWdithDiaoTou" :height="IconLenghDiaoTou">
           <path id="南掉头" :class="Data.name === '南掉头' ? '' : 'invisible'" d="M3.036,4.876V8.5H0.008L4.264,16.07,8.52,8.411H5.492V4.792c0-1.262,1.391-2.357,3.028-2.357s3.028,1.094,3.028,2.357V18.006H14V4.876C14,2.183,11.548-.005,8.52-0.005S3.036,2.183,3.036,4.876Z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)" />
           <path id="北掉头" :class="Data.name === '北掉头' ? '' : 'invisible'" d="M10.981,13.124V9.5h3.042L9.748,1.93,5.474,9.589H8.515v3.619c0,1.262-1.4,2.357-3.042,2.357S2.432,14.47,2.432,13.208V-0.006H-0.034V13.124c0,2.693,2.466,4.881,5.508,4.881S10.981,15.817,10.981,13.124Z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)" />
-        </svg>
-        <svg v-else xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
+        </svg> -->
+        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
           viewBox="0 0 26 36" style="enable-background:new 0 0 26 36;" xml:space="preserve" :width="IconWdith" :height="IconLengh">
           <!-- 南相位 -->
           <path id="南左转" :class="Data.name === '南左转' ? '' : 'invisible'" d="M18.9,11v24h3V10.9c0-3.1-2.6-5.7-5.7-5.8l-2.9-0.4L13.8,1L4.1,4.9l8.2,6.5l0.5-3.7l3.3,0.5
@@ -48,16 +46,14 @@
           <path id="南右转" :class="Data.name === '南右转' ? '' : 'invisible'" d="M10.2,8.1l3-0.4l0.5,3.7l8.2-6.5L12.2,1l0.5,3.7L9.8,5.1c-3.2,0-5.7,2.6-5.7,5.8V35h3V10.9
             c0-1.5,1.3-2.8,2.8-2.8H10.2z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
           <polygon id="南直行" :class="Data.name === '南直行' ? '' : 'invisible'" points="14.5,35 14.5,10.1 18.2,10.1 13,0.9 7.8,10.1 11.5,10.1 11.5,35 " :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
-          <!-- <path id="南掉头" :class="Data.name === '南掉头' ? '' : 'invisible'" d="M8.5,19.4v4.3H4.7l5.2,9.1l5.2-9.1h-3.7v-4.3c0-1.5,1.7-2.8,3.7-2.8s3.7,1.3,3.7,2.8V35h3V19.4
-            c0-3.2-3-5.8-6.7-5.8C11.5,13.6,8.5,16.2,8.5,19.4z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/> -->
+          <path id="南掉头" :class="Data.name === '南掉头' ? '' : 'invisible'" d="M8.5,6.9v4.3H4.8l5.2,9l5.2-9.1h-3.7V6.8c0-1.5,1.7-2.8,3.7-2.8s3.7,1.3,3.7,2.8V35h3V6.9c0-3.2-3-5.8-6.7-5.8C11.5,1.1,8.5,3.7,8.5,6.9z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
           <!-- 北相位 -->
             <path id="北左转" :class="Data.name === '北左转' ? '' : 'invisible'" d="M7.1,25V1h-3v24.1c0,3.1,2.6,5.7,5.7,5.8l2.9,0.4L12.2,35l9.7-3.9l-8.2-6.5l-0.5,3.7l-3.3-0.5
               C8.4,27.8,7.1,26.6,7.1,25L7.1,25z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
             <path id="北右转" :class="Data.name === '北右转' ? '' : 'invisible'" d="M15.8,27.9l-3,0.4l-0.5-3.7l-8.2,6.5l9.7,3.9l-0.5-3.7l2.9-0.4c3.2,0,5.7-2.6,5.7-5.8V1h-3v24.1
               c0,1.5-1.3,2.8-2.8,2.8H15.8z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
             <polygon id="北直行" :class="Data.name === '北直行' ? '' : 'invisible'" points="11.5,0.9 11.5,25.9 7.8,25.9 13,35 18.2,25.9 14.5,25.9 14.5,0.9 " :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
-            <!-- <path id="北掉头" :class="Data.name === '北掉头' ? '' : 'invisible'" d="M17.5,16.6v-4.3h3.7L16,3.3l-5.2,9.1h3.7v4.3c0,1.5-1.7,2.8-3.7,2.8s-3.7-1.3-3.7-2.8V1h-3v15.6
-              c0,3.2,3,5.8,6.7,5.8C14.5,22.4,17.5,19.8,17.5,16.6z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/> -->
+            <path id="北掉头" :class="Data.name === '北掉头' ? '' : 'invisible'" d="M17.5,29.1v-4.3h3.7l-5.2-9l-5.2,9.1h3.7v4.3c0,1.5-1.7,2.8-3.7,2.8s-3.7-1.3-3.7-2.8V0.9h-3v28.2c0,3.2,3,5.8,6.7,5.8C14.5,34.9,17.5,32.3,17.5,29.1z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
         </svg>
       </div>
   </div>
@@ -139,8 +135,9 @@ export default {
   },
   methods: {
     handleClick (e) {
-      let clickedPath = e.target
-      // console.log(clickedPath)
+      let clickedSvg = e.currentTarget
+      // console.log(clickedSvg)
+      let clickedPath = clickedSvg.querySelector(`#${this.Data.name}`)
       if (clickedPath) {
         // 在这里对找到的元素进行操作
         if (clickedPath.getAttribute('disabled') === 'true') {
@@ -172,9 +169,12 @@ export default {
     },
     IconAddEvent () {
       let IconDom = document.getElementById(this.Data.key)
-      let DirDom = IconDom.querySelector(`#${this.Data.name}`)
-      if (this.clickMode && DirDom.getAttribute('class') !== 'invisible') {
-        DirDom.addEventListener('click', this.handleClick)
+      // let DirDom = IconDom.querySelector(`#${this.Data.name}`)
+      // if (this.clickMode && DirDom.getAttribute('class') !== 'invisible') {
+      //   DirDom.addEventListener('click', this.handleClick)
+      // }
+      if (this.clickMode) {
+        IconDom.addEventListener('click', this.handleClick)
       }
     }
   },

package/package/kisscomps/components/IntersectionMap/crossDirection/posJson/phasePos.json

@@ -24,8 +24,8 @@
       "id": 4,
       "name": "东掉头",
       "ename": "East-Back",
-      "x": "602px",
-      "y": "300px"
+      "x": "588px",
+      "y": "325px"
     },
     {
       "id": 5,
@@ -52,8 +52,8 @@
       "id": 8,
       "name": "西掉头",
       "ename": "West-Back",
-      "x": "247px",
-      "y": "333px"
+      "x": "244px",
+      "y": "300px"
     },
     {
       "id": 9,
@@ -80,8 +80,8 @@
       "id": 12,
       "name": "北掉头",
       "ename": "North-Back",
-      "x": "412px",
-      "y": "137px"
+      "x": "436px",
+      "y": "134px"
     },
     {
       "id": 13,
@@ -108,8 +108,8 @@
       "id": 16,
       "name": "南掉头",
       "ename": "South-Back",
-      "x": "444px",
-      "y": "489px"
+      "x": "412px",
+      "y": "476px"
     }
   ]
 }

package/package/kisscomps/components/IntersectionMap/crossDirection/posJson/phasePos.left.json

@@ -24,8 +24,8 @@
       "id": 4,
       "name": "东掉头",
       "ename": "East-Back",
-      "x": "604px",
-      "y": "334px"
+      "x": "591px",
+      "y": "301px"
     },
     {
       "id": 5,
@@ -52,8 +52,8 @@
       "id": 8,
       "name": "西掉头",
       "ename": "West-Back",
-      "x": "248px",
-      "y": "301px"
+      "x": "246px",
+      "y": "325px"
     },
     {
       "id": 9,
@@ -80,8 +80,8 @@
       "id": 12,
       "name": "北掉头",
       "ename": "North-Back",
-      "x": "446px",
-      "y": "138px"
+      "x": "412px",
+      "y": "135px"
     },
     {
       "id": 13,
@@ -108,8 +108,8 @@
       "id": 16,
       "name": "南掉头",
       "ename": "South-Back",
-      "x": "412px",
-      "y": "495px"
+      "x": "436px",
+      "y": "481px"
     }
   ]
 }

package/package/kisscomps/components/IntersectionMap/intersectionmap.vue

@@ -40,6 +40,7 @@
       :isVipRoute="isVipRoute"
       :clickMode="clickMode"
       :isThirdSignal="isThirdSignal"
+      :channelType="channelType"
       @handleClickCrossIcon="handleClickCrossIcon" />
   </div>
 </div>
@@ -125,6 +126,10 @@ export default {
     isThirdSignal: {
       type: Boolean,
       default: false
+    },
+    channelType: {
+      type: Boolean,
+      default: false
     }
   },
   watch: {
@@ -143,6 +148,13 @@ export default {
           this.reset = true
         }
       }
+    },
+    channelType: {
+      handler: function (val, oldVal) {
+        if (val) {
+          this.reset = true
+        }
+      }
     }
   },
   created () {
@@ -152,7 +164,7 @@ export default {
   },
   mounted () {
     this.getParentSize()
-    if (this.isVipRoute) {
+    if (this.isVipRoute || this.channelType) {
       this.reset = true
     }
   },

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="(this.controlData && this.controlData.curTime && cycle && cycle>0 && this.isControl) || (this.controlData && newCycle && newCycle>0 && this.isControl)">
+        <div v-show="(cycle && cycle>0 && this.isControl) || (newCycle && newCycle>0 && this.isControl)">
           <div class="curTimeDiv" :style="{'left':paddingLeft }">{{ timeNumDevide }}</div>
           <div class="curTimeLine" :style="{'left':paddingLeft, 'height':barrierHeight}"></div>
         </div>
@@ -84,15 +84,6 @@
               <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>
@@ -112,7 +103,6 @@ export default {
   data () {
     return {
       barrierHeight: '',
-      stageCycle: '',
       barrierList: [],
       newCycle: this.cycles,
       patternIds: this.patternId,
@@ -187,19 +177,6 @@ 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) {
@@ -440,7 +417,6 @@ 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">