openatc-components 0.5.4 → 0.5.6

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

@@ -11,46 +11,11 @@
  **/
 <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 style="cursor: pointer">
-                  <div class="ring-phase" style="float: unset">
-                    <xdrdirselector
-                      v-if="item.direction && item.direction.length > 0"
-                      Width="60px"
-                      Height="60px"
-                      :showlist="item.direction"
-                    ></xdrdirselector>
-                      </div>
-                    </div>
-                  <div
-                    class="box"
-                    style="position: absolute; width:40px; left: 40px; 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) && patternType !== 'rcp'">
+      <div v-if="this.contrloType === 'ring' || !this.contrloType">
         <div class="ring-first" v-for="(list, index1) in patternInfo" :key="index1">
           <draggable :move="move" @end="endDrag(index1)" :disabled="isMove" :list="list">
-            <div class="cell-click-area" @click="cellClick(item.id)" style="position: relative;" :style="{'height': '35px','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' : isBorder ? 'hovercell' : ''">
+            <div style="position: relative;" :style="{'height': '35px','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' : isBorder ? 'hovercell' : ''">
               <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'}">
                 <el-tooltip placement="top-start" effect="light">
                   <div slot="content">{{$t('openatccomponents.phase.phase')}}{{item.id}}:{{item.split}}</div>
@@ -63,7 +28,7 @@
                       <div @click="focusInput(item.id)" class="ring-nums">{{$t('openatccomponents.phase.phase')}}{{item.id}}</div>
                       <div v-if="isMove" class="ring-nums">{{item.split}}</div>
                       <el-input-number
-                        v-if="!isMove && !controlStates[item.id]"
+                        v-if="!isMove"
                         class="ring-nums"
                         :ref="'inputNumbers' + item.id"
                         size="small"
@@ -77,21 +42,6 @@
                     </div>
                   </div>
                 </el-tooltip>
-                 <div
-                v-if="isShowTip"
-                class="boxs"
-                style="position: absolute; width:40px;left: 35px; top: 1px;z-index:999"
-              >
-              <el-input-number
-                  v-if="controlStates[item.id]"
-                  :ref="'inputNumbers' + item.id"
-                  size="small"
-                  :min="0"
-                  :step="1"
-                  v-model.number="item.split"
-                  @change="handleEdit(item)"
-                ></el-input-number>
-                </div>
                 <div style="width:50px;" v-for="(bus,index3) in busPhaseData" :key="index3">
                   <i class="iconfont icon-lukouzhilu" style="position: absolute;top: 8px;left:70px;font-size:12px;color:#454545;" v-if="bus.controltype === 1 && bus.phaseid===item.id"></i>
                   <i class="iconfont icon-BRT" style="position: absolute;top: 8px;left:70px;font-size:12px;color:#454545;" v-if="bus.controltype === 4 && bus.phaseid===item.id"></i>
@@ -180,12 +130,10 @@ export default {
       barrierHeight: '',
       stageCycle: '',
       barrierList: [],
-      controlStates: {},
       barrierArr: [],
       newCycle: this.cycles,
       patternIds: this.patternId,
       newPatterns: [],
-      patternRcp: [],
       newList: [],
       isControl: true,
       contrloCycle: 0,
@@ -208,9 +156,6 @@ export default {
       type: Boolean,
       default: true
     },
-    stage: {
-      type: Array
-    },
     cycleChange: {
       type: Boolean,
       default: true
@@ -225,9 +170,6 @@ export default {
     controlPhase: {
       type: Object
     },
-    patternType: {
-      type: String
-    },
     contrloType: {
       type: String
     },
@@ -400,9 +342,6 @@ export default {
     cycles: {
       handler: function (val, oldVal) {
         this.newCycle = this.cycles
-        if (this.patternType === 'rcp') {
-          this.handleRcp(this.patternStatusList)
-        }
       },
       // 深度观察监听
       deep: true
@@ -427,9 +366,6 @@ export default {
     },
     patternStatusList: {
       handler: function (val, oldVal) {
-        if (this.patternType === 'rcp') {
-          this.handleRcp(this.patternStatusList)
-        }
         this.handleBarrierHeight() // 计算屏障高度
         if (this.patternStatusList && this.newCycle) {
           // setTimeout(() => {
@@ -442,12 +378,6 @@ export default {
       // 深度观察监听
       deep: true
     }
-  },
-   mounted () {
-    document.addEventListener('click', this.handleDocumentClick)
-  },
-  beforeDestroy () {
-    document.removeEventListener('click', this.handleDocumentClick)
   },
   created () {
     this.globalParamModel = this.$store.getters.globalParamModel
@@ -468,34 +398,8 @@ export default {
     if (this.contrloType === 'stage') {
       this.getStage()
     }
-    if (this.patternType === 'rcp') {
-      this.handleRcp(this.patternStatusList)
-    }
   },
   methods: {
-    cellClick (itemId) {
-      for (const key in this.controlStates) {
-        if (key !== itemId) {
-          this.$set(this.controlStates, key, false)
-        }
-      }
-      this.$set(this.controlStates, itemId, !this.controlStates[itemId])
-    },
-    handleDocumentClick (event) {
-      const path = event.composedPath ? event.composedPath() : []
-      const clickedInsideCell = path.some(el => {
-        return el.classList && (el.classList.contains('cell-click-area') || el.classList.contains('ring-first'))
-      })
-
-      if (clickedInsideCell) {
-        return
-      }
-      for (const key in this.controlStates) {
-        if (this.controlStates[key]) {
-          this.$set(this.controlStates, key, false)
-        }
-      }
-    },
     move (e) {
       // 这里的e表示即将停靠的元素。
       let result = this.barrierArr.filter(item => item.includes(e.relatedContext.element.id))[0]
@@ -537,63 +441,6 @@ export default {
       // this.handleCurrentChange(this.patternStatusList)
       this.$emit('handleSplitMove', this.patternId)
     },
-    getPedDirection (data) {
-      let ped = []
-      for (let stg of data) {
-        let peddirections = []
-        let currPhase = this.phaseList.filter((item) => {
-          return item.Index === stg
-        })[0]
-        if (!currPhase) continue
-        if (!currPhase.peddirection) continue
-        for (let walk of this.sidewalkPhaseData) {
-          for (let ped of currPhase.peddirection) {
-            let objs = {}
-            objs.name = walk.name
-            objs.id = walk.id
-            if (ped === walk.id) {
-              peddirections.push(objs)
-              peddirections = Array.from(new Set(peddirections))
-            }
-          }
-        }
-        ped.push(...peddirections)
-      }
-      return ped
-    },
-    handleStageDataDerection (data) {
-      if (!data) return
-      let peddirections = this.getPedDirection(data)
-      let stagesTemp = []
-      let tempList = []
-      for (let stg of data) {
-        let directionList = []
-        let currPhase = this.phaseList.filter((item) => {
-          return item.Index === stg
-        })[0]
-        if (currPhase !== undefined) {
-          directionList.push(...currPhase.direction)
-          directionList = Array.from(new Set(directionList))
-        }
-        if (directionList.length === 0) {
-          tempList.push({
-            id: '',
-            color: '#454545',
-            peddirection: peddirections
-          })
-        } else {
-          tempList = directionList.map(dir => ({
-            id: dir,
-            color: '#454545',
-            peddirection: peddirections
-          }))
-        }
-        let newTemp = tempList.filter(item => item.id !== '')
-        stagesTemp.push(...newTemp)
-      }
-      console.log(stagesTemp, 'stagesTemp')
-      return stagesTemp
-    },
     getMaxCycle (pattern) {
       // let rings = pattern.rings
       let maxCycle = 0
@@ -638,53 +485,6 @@ 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
-          let currPhase = this.stage.filter((item) => {
-            return item.Index === ring.phases
-          })[0]
-          if (!currPhase) return
-          obj.direction = this.handleStageDataDerection(currPhase.IncludedPhase)
-          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)