openatc-components 0.2.7 → 0.2.8

package/src/kisscomps/components/StageBord/StageBord.vue

@@ -1,20 +1,9 @@
-/**
- * Copyright (c) 2020 kedacom
- * OpenATC is licensed under Mulan PSL v2.
- * You can use this software according to the terms and conditions of the Mulan PSL v2.
- * You may obtain a copy of Mulan PSL v2 at:
- * http://license.coscl.org.cn/MulanPSL2
- * THIS SOFTWARE IS PROVIDED ON AN "AS IS" BASIS, WITHOUT WARRANTIES OF ANY KIND,
- * EITHER EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO NON-INFRINGEMENT,
- * MERCHANTABILITY OR FIT FOR A PARTICULAR PURPOSE.
- * See the Mulan PSL v2 for more details.
- **/
 <template>
 <div class="components-container board">
   <div class="common-board-column">
     <div class="common-board-column-header" style="position:relative">
       <span>{{$t('openatccomponents.pattern.stage')+(subIndex+1)}}</span>
-      <span v-if="isRing" style="position: absolute;right: 0;">
+      <span v-if="this.contrloType === 'stage'" style="position: absolute;right: 0;">
         <el-button type="primary" @click="deleteStage(subIndex)" icon="el-icon-close"></el-button>
       </span>
     </div>
@@ -28,8 +17,7 @@
           </el-col>
           <el-col :span="12">
             <el-input-number
-              v-if="isRing"
-              class="stage-value"
+              v-if="this.contrloType === 'stage'"
               :controls="false"
               size="small"
               :disabled="true"
@@ -37,8 +25,7 @@
               v-model.number="stage.stageSplit">
             </el-input-number>
             <el-input-number
-              v-if="!isRing"
-              class="stage-value"
+              v-if="this.contrloType === 'ring' || !this.contrloType"
               :controls="false"
               size="small"
               v-model.number="stage.split"
@@ -53,74 +40,57 @@
             {{this.$t('openatccomponents.pattern.phase')}}
           </el-col>
           <el-col :span="12">
-            <SelectCrossPhase
-            v-if="isRing"
-            type="phases"
-            :pattern="false"
-            :phaseOption="coordphaseOption"
-            multiple
-            :row="stage"
-            style="width:100%;">
-          </SelectCrossPhase>
-            <!-- <el-select v-if="isRing" v-model="stage.phases" multiple :placeholder="$t('openatccomponents.common.select')">
+            <el-select v-if="this.contrloType === 'stage'" v-model="stage.stages" multiple :placeholder="$t('openatccomponents.common.select')">
               <el-option
                 v-for="item in coordphaseOption"
                 :key="item.value"
                 :label="$t('openatccomponents.pattern.phase') + item.value"
                 :value="item.value">
               </el-option>
-            </el-select> -->
+            </el-select>
             <el-input
-              v-if="!isRing"
-              class="stage-value"
+              v-if="this.contrloType === 'ring' || !this.contrloType"
               size="small"
-              :value="stage.phases.join(',')"
+              :value="stage.stageKanban?stage.stageKanban.join(','):''"
               ref="type"
-              style="width:100%;align:left;"
               :disabled="true">
             </el-input>
           </el-col>
         </el-row>
-        <el-row :gutter="0" v-if="isRing">
+        <el-row :gutter="0" v-if="this.contrloType === 'stage'">
           <el-col :span="12">
             {{this.$t('openatccomponents.pattern.green')}}
           </el-col>
           <el-col :span="12">
             <el-input-number
-              class="stage-value"
               size="small"
               :controls="false"
-              :min="0"
               v-model.number="stage.green"
               @change="stageSplitChange">
             </el-input-number>
           </el-col>
         </el-row>
-        <el-row :gutter="0" v-if="isRing">
+        <el-row :gutter="0" v-if="this.contrloType === 'stage'">
           <el-col :span="12">
             {{this.$t('openatccomponents.pattern.yellow')}}
           </el-col>
           <el-col :span="12">
             <el-input-number
-              class="stage-value"
               size="small"
               :controls="false"
-              :min="0"
               v-model.number="stage.yellow"
               @change="stageSplitChange">
             </el-input-number>
           </el-col>
         </el-row>
-        <el-row :gutter="0" v-if="isRing">
+        <el-row :gutter="0" v-if="this.contrloType === 'stage'">
           <el-col :span="12">
             {{this.$t('openatccomponents.pattern.red')}}
           </el-col>
           <el-col :span="12">
             <el-input-number
-              class="stage-value"
               size="small"
               :controls="false"
-              :min="0"
               v-model.number="stage.red"
               @change="stageSplitChange">
             </el-input-number>
@@ -133,12 +103,11 @@
 </template>
 <script>
 import draggable from 'vuedraggable'
-import SelectCrossPhase from '../SelectCrossPhase/index.vue'
+
 export default {
-  name: 'stage-bord',
+  name: 'stage-board',
   components: {
-    draggable,
-    SelectCrossPhase
+    draggable
   },
   data () {
     return {
@@ -158,8 +127,8 @@ export default {
         return []
       }
     },
-    isRing: {
-      type: Boolean
+    contrloType: {
+      type: String
     },
     options: {
       type: Object,
@@ -172,7 +141,7 @@ export default {
       default () {
         return {
           split: 0,
-          // stages: [],
+          stages: [],
           phases: [],
           stageSplit: 0,
           green: 0,
@@ -193,30 +162,23 @@ export default {
   created () {
   },
   watch: {
-    // stage: {
-    //   handler: function () {
-    //     if (this.isRing) {
-    //       let n = this.rowIndex
-    //       const globalParamModel = this.$store.getters.globalParamModel
-    //       let pattern = globalParamModel.getParamsByType('patternList')[n]
-    //       globalParamModel.getParamsByType('patternList')[n].cycle = this.getMaxCycle(pattern)
-    //     }
-    //   },
-    //   deep: true
-    // }
+    stage: {
+      handler: function () {
+        if (this.contrloType) {
+          let n = this.rowIndex
+          const globalParamModel = this.$store.getters.globalParamModel
+          let pattern = globalParamModel.getParamsByType('patternList')[n]
+          globalParamModel.getParamsByType('patternList')[n].cycle = this.getMaxCycle(pattern)
+        }
+      },
+      deep: true
+    }
   },
   mounted () {
   },
   methods: {
     deleteStage (index) {
       this.stageInfo.splice(index, 1)
-      this.stageInfo.forEach((item, index) => {
-        item.key = index
-      })
-      // let n = this.rowIndex
-      // const globalParamModel = this.$store.getters.globalParamModel
-      // let pattern = globalParamModel.getParamsByType('patternList')[n]
-      // globalParamModel.getParamsByType('patternList')[n].cycle = this.getMaxCycle(pattern)
     },
     getMaxCycle (pattern) {
       let rings = pattern.stagesList
@@ -265,23 +227,16 @@ export default {
     width: 100%;
     height: auto;
     margin: 5px 0;
-    text-align: left;
     line-height: 40px;
+    // color: #FFFFFF;
     padding: 1px 1px;
     box-sizing: border-box;
   }
   .el-button--primary:hover, .el-button--primary:focus{
     background: #299BCC;
     border-color: #299BCC;
-    color: #FFFFFF;
-  }
-  .stage-value {
-    text-align: left;
-    width: 100%;
+    // color: #FFFFFF;
   }
 </style>
 <style lang="scss">
-.stage-value .el-input__inner {
-    text-align: center;
-  }
 </style>

package/src/kisscomps/components/patternList/patternList.vue

@@ -11,7 +11,6 @@
     :patternList="patternList"
     :controlPhase="controlPhase"
     :showCondition="showCondition"
-    :allPatternList="allPatternList"
     :localPatternList="localPatternList"
     :phaseList="phaseList"
     :showBarrier="showBarrier"
@@ -508,9 +507,6 @@ export default {
       type: Boolean,
       default: false
     },
-    allPatternList: {
-      type: Array
-    },
     controlPhase: {
       type: Object
     },

package/static/styles/schemeconfig.scss

@@ -333,7 +333,7 @@
   }
 }
 .tentativeplan-control{
-  // height: 100%;
+  height: 100%;
   padding: 21PX 0PX 21PX 28PX;
   min-width: 360PX;
   overflow: hidden !important;

package/src/kisscomps/components/SelectCrossPhase/index.vue

@@ -1,417 +0,0 @@
-<template>
-  <div>
-    <el-select
-      v-model="valuess"
-      :multiple="multiple"
-      :disabled="disabled"
-      @visible-change="visibleChange($event)"
-      :clearable="clearable"
-      :filterable="filterable"
-      :placeholder="$t('openatccomponents.common.select')"
-      @change="onChange"
-      @focus="onFocus"
-    >
-      <el-option
-        id="aaa"
-        v-for="(item, index) in Options"
-        :key="index"
-        :label="getLable(item.label)"
-        :value="item.value"
-      >
-        <div class="single-model" @click="selectStages(item.value)">
-          <xdrdirselector
-            Width="60px"
-            Height="60px"
-            :showlist="item.item"
-          ></xdrdirselector>
-          <span
-            style="
-              float: right;
-              margin-left: 10px;
-              color: #8492a6;
-              font-size: 13px;
-            "
-            >{{ item.label }}</span
-          >
-        </div>
-      </el-option>
-    </el-select>
-    <span v-if="pattern">{{ getIncludedPhasesDesc(valuess) }}</span>
-    <!-- <span id="xrd"></span> -->
-    <!-- <xdrdirselector :Data="Data" :Datas="Datas" Width="60px" Height="60px" :showlist="dirArr"></xdrdirselector> -->
-  </div>
-</template>
-<script>
-import { getTscControl } from '../../../api/control'
-import { getPhaseDesc } from '../../../utils/phasedesc.js'
-// import { uploadSingleTscParam } from '../../api/param'
-import { getMessageByCode } from '../../../utils/responseMessage'
-import xdrdirselector from '../XRDDirSelector/XRDDirSelector.vue'
-import PhaseDataModel from '../IntersectionMap/crossDirection/utils'
-// import CrossDiagramMgr from '@/EdgeMgr/controller/crossDiagramMgr'
-// import { getDirName } from './utils.js'
-import { getTheme } from '../../../utils/auth'
-export default {
-  name: 'SelectCrossPhase',
-  components: {
-    xdrdirselector
-  },
-  props: {
-    multiple: {
-      type: Boolean,
-      default: false
-    },
-    pattern: {
-      type: Boolean,
-      default: false
-    },
-    filterable: {
-      type: Boolean,
-      default: false
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    row: {
-      type: Object
-    },
-    valueModel: {
-      type: Array
-    },
-    type: {
-      type: String || Array
-    },
-    phaseOption: {
-      type: Array,
-      default: () => []
-    },
-    // placeholder: {
-    //   type: String,
-    //   default: ''
-    // },
-    bizType: {
-      type: String,
-      default: ''
-    },
-    agentid: {
-      type: String,
-      default: '10501'
-    },
-    clearable: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data () {
-    return {
-      list: [],
-      valuess: [],
-      Data: {
-        left: '60px',
-        top: '10px'
-      },
-      Datas: {
-        left: '60px',
-        top: '10px'
-      },
-      Options: [],
-      phaseList: [],
-      dirArr: [],
-      sidewalkPhaseData: []
-    }
-  },
-  watch: {
-    phaseOption: {
-      handler (val) {
-        this.phaseOption = val
-        this.getPhase()
-        this.showxdr(this.valuess)
-      },
-      deep: true
-    },
-    agentid (val) {
-      // this.value = ''
-      this.Options = []
-      // this.onLoad()
-    }
-  },
-  created () {
-    this.PhaseDataModel = new PhaseDataModel()
-    this.onLoad()
-  },
-  methods: {
-    getLable (str) {
-      const match = str.match(/\d+/)
-      if (match) {
-        return this.getPhaseDescs(Number(match[0]))
-      }
-    },
-    // getXrd (data) {
-    //   let Profile = Vue.extend({
-    //     // template: 'xdrdirselector',
-    //     components: {
-    //       xdrdirselector
-    //     },
-    //     render (h) {
-    //       return h('xdrdirselector', {
-    //         props: {
-    //           Width: '60px',
-    //           Height: '60px',
-    //           showlist: data,
-    //           Data: {
-    //             left: '60px',
-    //             top: '10px'
-    //           },
-    //           Datas: {
-    //             left: '60px',
-    //             top: '10px'
-    //           }
-    //         }
-    //       })
-    //     }
-    //   })
-    //   let profile = new Profile()
-    //   profile.$mount('#xrd')
-    // },
-    getPhaseDescs (id) {
-      let phasedesc = this.phaseOption.filter((item) => {
-        return item.id === id
-      })[0].direction
-      if (phasedesc.length === 0) return id
-      let description = getPhaseDesc(phasedesc, this.$i18n.locale)
-      return id + '-' + description
-    },
-    showxdr (data) {
-      let color = getTheme() === 'light' ? '#1E1E1E' : '#F1F3F4'
-      this.dirArr = []
-      this.phaseOption.filter((item) => {
-        if (item.id === data) {
-          if (item.direction.length === 0) {
-            let recd = {
-              id: 0,
-              peddirection: this.getPed(item.peddirection),
-              color: color
-            }
-            this.dirArr.push(recd)
-          } else {
-            for (let rec of item.direction) {
-              let recd = {
-                id: rec,
-                peddirection: this.getPed(item.peddirection),
-                color: color
-              }
-              this.dirArr.push(recd)
-            }
-          }
-        }
-      })
-    },
-    onFocus () {
-      if (!this.Options || this.Options.length === 0) {
-        this.onLoad()
-      }
-    },
-    onLoad () {
-      this.getPhase()
-      // this.initData()
-    },
-    setOption (list) {
-      if (this.row.callphase) {
-        this.valuess = this.row.callphase
-        this.showxdr(this.valuess)
-      }
-      if (this.row.phases) {
-        this.valuess = this.row.phases
-      }
-      if (this.row.linkphase) {
-        this.valuess = this.row.linkphase
-        this.showxdr(this.valuess)
-      }
-      if (this.row.includedphases) {
-        this.valuess = this.row.includedphases
-      }
-      if (this.row.data && this.row.data.phase) {
-        this.valuess = this.row.data.phase
-        this.showxdr(this.valuess)
-      }
-      let color = getTheme() === 'light' ? '#1E1E1E' : '#F1F3F4'
-      this.Options = list.map((item, index) => {
-        let dirArr = []
-        if (item.direction.length === 0) {
-          let recd = {
-            id: 0,
-            peddirection: this.getPed(item.peddirection),
-            color: color
-          }
-          dirArr.push(recd)
-        } else {
-          for (let rec of item.direction) {
-            let recd = {
-              id: rec,
-              peddirection: this.getPed(item.peddirection),
-              color: color
-            }
-            dirArr.push(recd)
-          }
-        }
-        let name = ''
-        name = this.$t('openatccomponents.pattern.phase') + item.id
-        // name = this.getPhaseDescs(item.id)
-        return {
-          label: name,
-          item: dirArr,
-          value: item.id
-        }
-      })
-    },
-    visibleChange (status) {
-      if (!status) {
-        this.showxdr(this.valuess)
-      }
-    },
-    onChange (value) {
-      if (this.type === 'callphase') {
-        this.row.callphase = this.valuess
-      } else if (this.type === 'linkphase') {
-        this.row.linkphase = this.valuess
-      } else if (this.type === 'phase') {
-        this.row.data.phase = this.valuess
-      } else if (this.multiple && this.type === 'phases') {
-        this.row.phases = this.valuess
-      } else if (this.multiple && this.type === 'includedphases') {
-        this.row.includedphases = this.valuess
-      }
-      let option = this.Options.filter(item => item.value === value)[0]
-      this.$emit('onChange', value, option, this.agentid, this.bizType)
-    },
-    selectStages (value) {
-      this.$emit('selectStages', value)
-    },
-    getPhase () {
-      this.getPedPhasePos(this.phaseOption)
-      this.setOption(this.phaseOption)
-    },
-    initData () {
-      let agentId = this.agentid
-      getTscControl(agentId).then((data) => {
-        if (!data.data.success) {
-          if (data.data.code === '4003') {
-            this.devStatus = 2
-            this.$message.error(this.$t('openatccomponents.errorTip.devicenotonline'))
-            return
-          }
-          this.$message.error(getMessageByCode(data.data.code, this.$i18n.locale))
-          return
-        }
-        let TscData = JSON.parse(JSON.stringify(data.data.data.data))
-        this.handleStageData(TscData) // 处理阶段（驻留）stage数据
-      }).catch(error => {
-        this.$message.error(error)
-        console.log(error)
-      })
-    },
-    getPed (data) {
-      let ped = []
-      let peddirections = []
-      let color = getTheme() === 'light' ? '#1E1E1E' : '#F1F3F4'
-      for (let walk of this.sidewalkPhaseData) {
-        for (let ped of data) {
-          let objs = {}
-          objs.name = walk.name
-          objs.id = walk.id
-          objs.color = color
-          if (ped === walk.id) {
-            peddirections.push(objs)
-            peddirections = Array.from(new Set(peddirections))
-          }
-        }
-      }
-      ped.push(...peddirections)
-      return ped
-    },
-    getPedPhasePos (phaseList) {
-      // 行人相位信息
-      this.sidewalkPhaseData = []
-      phaseList.forEach((ele, i) => {
-        if (ele.peddirection) {
-          ele.peddirection.forEach((dir, index) => {
-            // 行人相位
-            if (this.PhaseDataModel.getSidePos(dir)) {
-              this.sidewalkPhaseData.push({
-                // key: this.CrossDiagramMgr.getUniqueKey('pedphase'),
-                phaseid: ele.id, // 相位id，用于对应相位状态
-                id: dir,
-                name: this.PhaseDataModel.getSidePos(dir).name
-              })
-            }
-          })
-        }
-      })
-      return this.sidewalkPhaseData
-    },
-    handleStageData (data) {
-      this.stagesList = []
-      let stages = data.stages
-      for (let stage of stages) {
-        let tempList = []
-        let directionList = []
-        for (let stg of stage) {
-          let currPhase = this.phaseList.filter((item) => {
-            return item.id === stg
-          })[0]
-          if (currPhase !== undefined) {
-            directionList = [...currPhase.direction, ...directionList]
-          }
-          // directionList = [...currPhase.direction, ...directionList]
-        }
-        directionList = [...new Set(directionList)]
-        tempList = directionList.map(dir => ({
-          id: dir,
-          color: '#606266'
-        }))
-        this.stagesList.push(tempList)
-      }
-      this.list = this.stagesList
-      // this.setOption()
-    },
-    // init (val) {
-    //   let target = val
-    //   if (this.multiple) {
-    //     target = [val]
-    //   }
-    //   this.value = target
-    // },
-    getNameById (id) {
-      let res = ''
-      for (const item of this.Options) {
-        if (id === item.agentid) {
-          res = item.name
-          break
-        }
-      }
-      return res
-    },
-    getIncludedPhasesDesc (ids) {
-      let str = ''
-      for (let id of ids) {
-        str = str + this.getPhaseDescs(id) + ' '
-      }
-      return str
-    }
-  }
-}
-</script>
-<style lang="scss">
-
-.el-select-dropdown__wrap {
-  max-height: 500px !important;
-}
-
-#aaa{
-  // :deep(.el-select-dropdown__item){
-    margin: 10px 0 !important;
-  // }
-}
-
-</style>