openatc-components 0.2.79 → 0.2.80

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

@@ -12,33 +12,35 @@
 <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 xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 36 26" :width="IconLengh" :height="IconWdith">
+      </svg>
+      <svg v-else 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="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="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="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="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)"/>
+          <!-- <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)"/> -->
         </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 xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
+        </svg>
+        <svg v-else 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
@@ -46,14 +48,16 @@
           <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,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="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="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,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)"/>
+            <!-- <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)"/> -->
         </svg>
       </div>
   </div>
@@ -135,9 +139,8 @@ export default {
   },
   methods: {
     handleClick (e) {
-      let clickedSvg = e.currentTarget
-      // console.log(clickedSvg)
-      let clickedPath = clickedSvg.querySelector(`#${this.Data.name}`)
+      let clickedPath = e.target
+      // console.log(clickedPath)
       if (clickedPath) {
         // 在这里对找到的元素进行操作
         if (clickedPath.getAttribute('disabled') === 'true') {
@@ -169,12 +172,9 @@ 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)
-      // }
-      if (this.clickMode) {
-        IconDom.addEventListener('click', this.handleClick)
+      let DirDom = IconDom.querySelector(`#${this.Data.name}`)
+      if (this.clickMode && DirDom.getAttribute('class') !== 'invisible') {
+        DirDom.addEventListener('click', this.handleClick)
       }
     }
   },

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

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

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

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

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

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

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

@@ -11,8 +11,33 @@
  **/
 <template>
     <div class="main-patternstatus">
+      <!-- rcp模式 -->
+      <div v-if="patternType === 'rcp'">
+        <div class="ring-first" v-for="(list, index1) in patternRcp" :key="index1">
+          <div style="position: relative" :style="{height: '34px',paddingRight: '1px',float: 'left',width:
+              ((item.split + (item.sum ? item.sum : 0)) /(item.cycle > cycles ? item.cycle : cycles)) *100 +'%',}"
+              v-for="(item, index2) in list" :key="index2">
+            <div class="first-1" :style="{ width:
+                  (Number(item.greenWidth.replace('%', '')) /
+                    Number((((item.split + (item.sum ? item.sum : 0)) /
+                  (item.cycle > cycles ? item.cycle : cycles)) * 100 + '%').replace('%', ''))) * 100 + '%', height: '34px',background: '#7ccc66'}">
+            </div>
+            <el-tooltip placement="top-start" effect="light">
+                <div v-if="item.id" slot="content">P{{ item.id }}:{{ item.split }}</div>
+                <div v-if="item.id" style="cursor: pointer">
+                  <div
+                    class="box"
+                    style="position: absolute; width:40px; left: 0; top: 5px"
+                  >
+                    <div class="ring-nums">P{{ item.id }}:{{ item.split }}</div>
+                  </div>
+                </div>
+              </el-tooltip>
+          </div>
+      </div>
+      </div>
       <!-- 环模式true -->
-      <div v-if="this.contrloType === 'ring' || !this.contrloType">
+      <div v-if="(this.contrloType === 'ring' || !this.contrloType) && patternType !== 'rcp'">
         <div class="ring-first" v-for="(list, index1) in patternInfo" :key="index1">
           <div style="position: relative;" :style="{'height': '34px','float':'left','width':((item.split+(item.sum?item.sum:0)) / (max?max:item.cycle) * 100) + '%'}"  v-for="(item,index2) in list" :key="index2" :class="item.mode===7?'direction': ''">
             <div class="first-1" :class="item.mode === 8 ? 'mask' : item.mode === 9 ? 'yellowClass' : ''" :style="{'width':Number(item.greenWidth.replace('%', ''))/Number((((item.split+(item.sum?item.sum:0)) / (max?max:item.cycle) * 100) + '%').replace('%', ''))*100+'%','height':'34px','background':'#7ccc66'}">
@@ -48,7 +73,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.curtime>0 && cycle && cycle>0 && this.isControl) || (this.curtime>0 && newCycle && newCycle>0 && this.isControl)">
           <div class="curTimeDiv" :style="{'left':paddingLeft }">{{ timeNumDevide }}</div>
           <div class="curTimeLine" :style="{'left':paddingLeft, 'height':barrierHeight}"></div>
         </div>
@@ -107,6 +132,7 @@ export default {
       newCycle: this.cycles,
       patternIds: this.patternId,
       newPatterns: [],
+      patternRcp: [],
       newList: [],
       isControl: true,
       contrloCycle: 0,
@@ -131,6 +157,9 @@ export default {
     controlPhase: {
       type: Object
     },
+    patternType: {
+      type: String
+    },
     contrloType: {
       type: String
     },
@@ -213,7 +242,7 @@ export default {
   watch: {
     controlPhase: {
       handler: function (val, oldVal) {
-        if ((val && val.curTime) || val.curTime === 0) {
+        if (val && val.curTime) {
           this.curtime = val.curTime
           if (val.control === 4 || val.control === 16 || val.control === 22) {
             this.isControl = false
@@ -242,7 +271,7 @@ export default {
           }
           this.handleBarrierHeight()
         }
-        if ((val && val.curTime) || val.curTime === 0) {
+        if (val && val.curTime) {
           this.curtime = val.curTime
           if (val.control === 4 || val.control === 16 || val.control === 22) {
             this.isControl = false
@@ -290,6 +319,9 @@ export default {
     cycles: {
       handler: function (val, oldVal) {
         this.newCycle = this.cycles
+        if (this.patternType === 'rcp') {
+          this.handleRcp(this.patternStatusList)
+        }
       },
       // 深度观察监听
       deep: true
@@ -314,6 +346,9 @@ export default {
     },
     patternStatusList: {
       handler: function (val, oldVal) {
+        if (this.patternType === 'rcp') {
+          this.handleRcp(this.patternStatusList)
+        }
         this.handleBarrierHeight() // 计算屏障高度
         if (this.patternStatusList && this.newCycle) {
           setTimeout(() => {
@@ -346,6 +381,9 @@ export default {
     if (this.contrloType === 'stage') {
       this.getStage()
     }
+    if (this.patternType === 'rcp') {
+      this.handleRcp(this.patternStatusList)
+    }
   },
   methods: {
     getPed (data) {
@@ -374,6 +412,48 @@ export default {
       }
       return ped
     },
+    handleRcp (val) {
+      this.patternRcp = []
+      let valSplit = val.map(item => {
+        return item.map(val => {
+          return val.splitchain
+        })
+      })
+      let splitCycle = valSplit.length > 0 ? valSplit.map(item => {
+        return item.length > 0 ? item.reduce((a, b) => {
+          return a + b
+        }) : 0
+      }) : 0
+      let cycle = Math.max(...splitCycle)// 每个环的周期最大值
+      for (let rings of val) {
+        if (rings.length === 0) continue
+        let list = []
+        for (let ring of rings) {
+          if (ring.splitchain === 0) continue
+          let obj = {}
+          let split = ring.splitchain
+          obj.split = split
+          obj.cycle = cycle
+          obj.id = ring.phases
+          // if (ring.sum) {
+          //   obj.sum = ring.sum
+          //   obj.redWidth = ((currPhase.redclear + ring.sum) / (this.fixCycle ? this.fixCycle : this.max ? this.max : this.newCycle) * 100) + '%'
+          // } else {
+          //   obj.redWidth = (currPhase.redclear / (this.fixCycle ? this.fixCycle : this.max ? this.max : this.newCycle) * 100) + '%'
+          // }
+          // obj.mode = ring.mode
+          obj.greenWidth = (split / (cycle > this.cycles ? cycle : this.cycles)) * 100 + '%'
+          // obj.flashgreen = (currPhase.flashgreen / (this.fixCycle ? this.fixCycle : this.max ? this.max : this.newCycle) * 100) + '%'
+          // obj.yellowWidth = (currPhase.yellow / (this.fixCycle ? this.fixCycle : this.max ? this.max : this.newCycle) * 100) + '%'
+          // 忽略相位不显示
+          // let mode = ring.mode
+          // if (mode !== 7) { // 忽略相位不显示
+          list.push(obj)
+          // }
+        }
+        this.patternRcp.push(list)
+      }
+    },
     handleStageData (data) {
       if (!data) return
       let peddirections = this.getPed(data)
@@ -610,7 +690,6 @@ export default {
                 // if (stg === walk.phaseid) {
                 let objs = {}
                 objs.name = walk.name
-                objs.color = 'rgba(48,49,51,0.6)'
                 objs.id = walk.id
                 if (ped === walk.id) {
                   peddirections.push(objs)
@@ -626,7 +705,7 @@ export default {
             obj.direction = ring.desc.map(item => { // 虚相位desc为空
               return {
                 id: item.id,
-                color: '#303133'
+                color: '#454545'
               }
             })
           } else {
@@ -635,14 +714,14 @@ export default {
                 return {
                   id: item,
                   peddirection: peddirections,
-                  color: '#303133'
+                  color: '#454545'
                 }
               })
             } else {
               obj.direction = [
                 {
                   id: '',
-                  color: '#303133',
+                  color: '#454545',
                   peddirection: peddirections
                 }
               ]
@@ -863,7 +942,6 @@ export default {
                 let objs = {}
                 objs.name = walk.name
                 objs.id = walk.id
-                objs.color = 'rgba(48,49,51,0.6)'
                 if (ped === walk.id) {
                   peddirections.push(objs)
                   peddirections = Array.from(new Set(peddirections))
@@ -878,7 +956,7 @@ export default {
             obj.direction = ring.desc.map(item => { // 虚相位desc为空
               return {
                 id: item.id,
-                color: '#303133'
+                color: '#454545'
               }
             })
           } else {
@@ -887,14 +965,14 @@ export default {
                 return {
                   id: item,
                   peddirection: peddirections,
-                  color: '#303133'
+                  color: '#454545'
                 }
               })
             } else {
               obj.direction = [
                 {
                   id: '',
-                  color: '#303133',
+                  color: '#454545',
                   peddirection: peddirections
                 }
               ]
@@ -1091,7 +1169,6 @@ export default {
                 let objs = {}
                 objs.name = walk.name
                 objs.id = walk.id
-                objs.color = 'rgba(48,49,51,0.6)'
                 if (ped === walk.id) {
                   peddirections.push(objs)
                   peddirections = Array.from(new Set(peddirections))
@@ -1106,7 +1183,7 @@ export default {
             obj.direction = ring.desc.map(item => { // 虚相位desc为空
               return {
                 id: item.id,
-                color: '#303133',
+                color: '#454545',
                 peddirection: peddirections
               }
             })
@@ -1115,7 +1192,7 @@ export default {
               obj.direction = currPhase.direction.map(item => {
                 return {
                   id: item,
-                  color: '#303133',
+                  color: '#454545',
                   peddirection: peddirections
                 }
               })
@@ -1123,7 +1200,7 @@ export default {
               obj.direction = [
                 {
                   id: '',
-                  color: '#303133',
+                  color: '#454545',
                   peddirection: peddirections
                 }
               ]
@@ -1372,7 +1449,7 @@ export default {
 <style lang="scss" scoped>
 .main-patternstatus {
   position: relative;
-  /* margin-bottom: 20px; */
+  margin-bottom: 20px;
 }
 .main-patternstatus {
   position: relative;

package/src/kisscomps/components/SchemeConfig/SchemeConfig.vue

@@ -38,7 +38,6 @@
               :overlap="overlap"
               :patternSelect="patternSelect"
               :allPatternList="allPatternList"
-              :isShowBack="isShowBack"
               @closeManualModal="closeManualModal"
               @selectModel="selectModel"
               @selectStages="selectStages"
@@ -46,8 +45,76 @@
               @closePhaseBack="closePhaseBack"
               @closePhaseControl="closePhaseControl"
               @selectSpecialModel="selectSpecialModelNew" />
+             <!-- <ManualControlModal
+               :controlData="controlData"
+               :modelList="modelList"
+               :patternSelect="patternSelect"
+               :patternAll="patternAll"
+               :crossStatusData="crossStatusData"
+               :phaseList="phaseList"
+               :specialcontrolList="specialcontrolList"
+               :currModel="currModel"
+               :preselectModel="preselectModel"
+               :preselectStages="preselectStages"
+               :realtimeStatusModalvisible="realtimeStatusModalvisible"
+               :funcSort="funcSort"
+               :roadDirection="roadDirection"
+               @closeManualModal="closeManualModal"
+               @selectModel="selectModel"
+               @selectStages="selectStages"
+               @patternCommit="patternCommit"
+               @selectSpecialModel="selectSpecialModel" /> -->
             </div>
           </transition>
+          <!-- <transition name="fade-left" mode="out-in"
+          enter-active-class="animated fadeInRight"
+          leave-active-class="animated fadeOutRight">
+            <div style="position: absolute;width: 100%;height:100%" v-show="(isOperation && isClosePhase)">
+              <ClosePhaseControlModal
+                v-if="specialPage === 'closephase'"
+                :controlData="controlData"
+                :closePhaseRings="phaseRings"
+                :sidewalkPhaseData="sidewalkPhaseData"
+                :realtimeStatusModalvisible="realtimeStatusModalvisible"
+                :roadDirection="roadDirection"
+                @closePhaseBack="closePhaseBack"
+                @closePhaseControl="closePhaseControl" /> -->
+              <!-- <LockingPhaseControlModal
+                v-if="specialPage === 'lockingphase'"
+                :roadDirection="roadDirection"
+                :phaseList="phaseList"
+                :patternStatus="statusData"
+                :lockPhaseBtnName="lockPhaseBtnName"
+                @closePhaseBack="closePhaseBack"
+                @closePhaseControl="closePhaseControl" /> -->
+                <!-- <TentativePlanControlModal
+                 v-if="specialPage === 'tentativeplan'"
+                 :realtimeStatusModalvisible="realtimeStatusModalvisible"
+                 :controlData="controlData"
+                 :phaseList="phaseList"
+                 :overlap="overlap"
+                 :patternSelect="patternSelect"
+                 :allPatternList="allPatternList"
+                 @closePhaseBack="closePhaseBack"
+                 @closePhaseControl="closePhaseControl"
+                />
+                <priorityControl
+                v-if="specialPage === 'prioritycontrol'"
+                :realtimeStatusModalvisible="realtimeStatusModalvisible"
+                :phaseList="phaseList"
+                 @closePhaseBack="closePhaseBack"
+                 @closePhaseControl="closePhaseControl"
+                /> -->
+                <!-- <AzimuthLocking
+                v-if="specialPage === 'azimuthlocking'"
+                :realtimeStatusModalvisible="realtimeStatusModalvisible"
+                :phaseList="phaseList"
+                :patternStatus="statusData"
+                 @closePhaseBack="closePhaseBack"
+                 @closePhaseControl="closePhaseControl"
+                /> -->
+            <!-- </div>
+          </transition> -->
 
           <transition name="fade-left" mode="out-in"
           enter-active-class="animated fadeInLeft"
@@ -173,10 +240,6 @@ export default {
     isFromAtc: {
       type: Boolean,
       default: true
-    },
-    isShowBack: {
-      type: Boolean,
-      default: true
     }
   },
   data () {
@@ -410,6 +473,32 @@ export default {
       faultvisible: false,
       isClosePhase: false, // 是否在相位关断
       toPage: 1, // 与哪一个页面交互，1 代表路口信息页面，3代表 相位关断页面
+      specialcontrolList: [{ // 特殊控制
+        id: 23,
+        isShow: true,
+        permission: 'configer:manual:optimize',
+        iconClass: 'closephase'
+      }, {
+        id: 22,
+        isShow: true,
+        permission: 'configer:manual:optimize',
+        iconClass: 'lockingphase'
+      }, {
+        id: 100,
+        isShow: true,
+        permission: 'configer:manual:optimize',
+        iconClass: 'tentativeplan'
+      }, {
+        id: 24,
+        isShow: true,
+        permission: 'configer:manual:preempt',
+        iconClass: 'prioritycontrol'
+      }, {
+        id: 25,
+        permission: 'configer:manual:optimize',
+        isShow: this.realtimeStatusModalvisible,
+        iconClass: 'azimuthlocking'
+      }],
       phaseRings: [],
       curFaultList: [],
       confirmedFault: [],
@@ -773,6 +862,10 @@ export default {
       }
     },
     closePhaseBack () {
+      // if (!this.realtimeStatusModalvisible) {
+      //   this.$emit('closePhaseBack')
+      //   return
+      // }
       this.toPage = 3
       this.isClosePhase = false
     },