openatc-components 0.1.190 → 0.1.192

package/src/kisscomps/components/DirectionListConfiguration/DirectionListConfiguration.vue

@@ -0,0 +1,436 @@
+/**
+ * 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="direction-list-configuration">
+    <div class="dir-config-row">
+      <div class="label" :style="{width: labelWidth}">{{$t('openatccomponents.phase.desc')}}：</div>
+      <div class="dir-btn lane-dir">
+        <div class="each-icon" v-for="(item, index) in laneList" :key="index" :class="item.disabled ? 'disabled-icon': ''">
+          <el-tooltip class="item" effect="dark" :content="item.name" placement="bottom-start">
+            <div class="single-icon"
+              @click="selectDire(item, 'lane')"
+              :class="!item.disabled && preselectDirection.indexOf(item.id) !== -1 ? 'single-icon-select' : ''">
+              <i :class="item.iconclass"></i>
+              <div class="single-icon-name">{{item.name}}</div>
+            </div>
+          </el-tooltip>
+        </div>
+      </div>
+    </div>
+    <div class="dir-config-row">
+      <div class="label" :style="{width: labelWidth}">{{$t('openatccomponents.phase.peddesc')}}：</div>
+      <div class="dir-btn ped-dir">
+        <div class="each-icon" v-for="(item, index) in pedList" :key="index" :class="item.disabled ? 'disabled-icon': ''">
+          <el-tooltip class="item" effect="dark" :content="item.name" placement="bottom-start">
+            <div class="single-icon ped-icon"
+            @click="selectDire(item, 'ped')"
+            :class="!item.disabled && preselectPedDirection.indexOf(item.id) !== -1 ? 'single-icon-select' : ''">
+              <PedSvg :pedId="item.id" />
+              <div class="single-icon-name" style="margin-top: 5px;">{{item.name}}</div>
+            </div>
+          </el-tooltip>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import xdrdirselector from '../XRDDirSelector/XRDDirSelector'
+import { uploadSingleTscParam } from '../../../api/param.js'
+import { getMessageByCode } from '../../../utils/responseMessage.js'
+import { getIntersectionInfo } from '../../../api/template.js'
+import CrossDiagramMgr from '../../../EdgeMgr/controller/crossDiagramMgr.js'
+import PhaseDataModel from '../IntersectionMap/crossDirection/utils.js'
+// import { getTheme } from '../../../utils/auth'
+import { images } from '../../../utils/phasedesc.js'
+import PedSvg from './svg/pedSvg'
+
+import CrossDirectionConflictList from '../../../utils/conflictList.js'
+
+export default {
+  name: 'direction-list-configuration',
+  data () {
+    return {
+      laneList: [],
+      pedList: [],
+      preselectDirection: [], // 预选方向
+      preselectPedDirection: [] // 预选行人方向
+    }
+  },
+  components: {
+    xdrdirselector,
+    PedSvg
+  },
+  props: {
+    labelWidth: {
+      type: String,
+      default: '130px'
+    },
+    agentId: {
+      type: String
+    },
+    list: {
+      type: Array,
+      default () {
+        return []
+      }
+    },
+    roadDirection: {
+      type: String,
+      default: 'right'
+    },
+    isThirdSignal: {
+      type: Boolean,
+      default: false
+    },
+    choosedDirection: {
+      type: Array
+    },
+    choosedPedDirection: {
+      type: Array
+    }
+  },
+  methods: {
+    init () {
+      this.CrossDiagramMgr = new CrossDiagramMgr()
+      this.PhaseDataModel = new PhaseDataModel(this.roadDirection)
+      this.getIntersectionInfo() // 获取路口信息
+    },
+    getIntersectionInfo () {
+      // 获取路口信息
+      const agentid = this.agentId || '0'
+      getIntersectionInfo(agentid).then(res => {
+        if (!res.data.success) {
+          this.isLoaded = false
+          let commomMsg = this.$t('openatccomponents.overview.signalID') + ' : ' + agentid
+          let msg = getMessageByCode(res.data.code, this.$i18n.locale)
+          if (res.data.data) {
+            // 子类型错误
+            let childErrorCode = res.data.data.errorCode
+            if (childErrorCode) {
+              let childerror = getMessageByCode(res.data.data.errorCode, this.$i18n.locale)
+              msg = msg + ' - ' + childerror
+            }
+          }
+          msg = msg + ' - ' + commomMsg
+          this.$message.error(msg)
+          return
+        }
+        this.tempType = res.data.data.type
+        // 获取车道相位、行人相位信息（坐标、名称）
+        this.mainType = this.tempType.split('-')[0]
+        this.mainDirection = this.tempType.split('-')[1]
+        if (!this.isThirdSignal) {
+          // 可点击模式下，非第三方设备，按通道显示相位方向
+          this.getChannelInfo()
+          return
+        }
+        this.crossInfo = res.data.data.param
+        // 城市道路加载车道相位坐标和人行道坐标
+        this.getPhasePos()
+        this.getOverlapPhasePos()
+        this.getPedPhasePos()
+        this.getOverlapPedPhasePos()
+        if (this.isThirdSignal) {
+          // 第三方设备，按相位方向显示相位方向
+          this.compLanePhaseData = this.CrossDiagramMgr.compare(this.LanePhaseData, this.overlapLanePhaseData, 'type', 'nostatus')
+          this.compSidewalkPhaseData = this.CrossDiagramMgr.compare(this.sidewalkPhaseData, this.overlapsidewalkPhaseData, 'pedtype', 'nostatus')
+          let allDir = this.compLanePhaseData.map(ele => ele.id)
+          let allPedDir = this.compSidewalkPhaseData.map(ele => ele.id)
+          this.inneChoosedDirection = this.choosedDirection.filter(dir => allDir.indexOf(dir) !== -1)
+          this.inneChoosedPedDirection = this.choosedPedDirection.filter(dir => allPedDir.indexOf(dir) !== -1)
+          this.drawPhaseIcon()
+        }
+      })
+    },
+    getPhasePos () {
+      // 车道相位信息
+      this.LanePhaseData = []
+      this.crossInfo.phaseList.forEach((ele, i) => {
+        if (ele.controltype === undefined || ele.controltype <= 2) {
+          ele.direction.forEach((dir, index) => {
+            let dirinfo = this.PhaseDataModel.getPhase(dir)
+            if (dir <= 16) {
+            // 车道相位
+              this.LanePhaseData.push({
+                key: this.CrossDiagramMgr.getUniqueKey('phase'),
+                phaseid: ele.id, // 相位id，用于对应相位状态
+                id: dir, // 接口返回的dir字段，对应前端定义的相位方向id，唯一标识
+                name: dirinfo.name
+              })
+            }
+          })
+        }
+      })
+    },
+    getOverlapPhasePos () {
+      // 车道跟随相位信息
+      if (!this.crossInfo.overlaplList) return
+      this.overlapLanePhaseData = []
+      this.crossInfo.overlaplList.forEach((ele, i) => {
+        if (ele.direction) {
+          ele.direction.forEach((dir, index) => {
+            this.overlapLanePhaseData.push({
+              key: this.CrossDiagramMgr.getUniqueKey('overlapphase'),
+              phaseid: ele.id, // 相位id，用于对应相位状态
+              id: dir, // 接口返回的dir字段，对应前端定义的相位方向id，唯一标识
+              name: this.PhaseDataModel.getPhase(dir).name,
+              left: this.PhaseDataModel.getPhase(dir).x,
+              top: this.PhaseDataModel.getPhase(dir).y
+            })
+          })
+        }
+      })
+    },
+    getPedPhasePos () {
+      // 行人相位信息
+      this.sidewalkPhaseData = []
+      this.crossInfo.phaseList.forEach((ele, i) => {
+        if (ele.peddirection) {
+          ele.peddirection.forEach((dir, index) => {
+          // 行人相位
+            let dirinfo = this.PhaseDataModel.getSidePos(dir)
+            if (dir <= 16) {
+              let key = this.CrossDiagramMgr.getUniqueKey('pedphase')
+              if (this.isVipRoute && this.isThirdSignal) {
+                key = this.CrossDiagramMgr.getUniqueKey('pedphase') + `-${this.agentId}`
+              }
+              this.sidewalkPhaseData.push({
+                key,
+                phaseid: ele.id, // 相位id，用于对应相位状态
+                id: dir,
+                name: dirinfo.name
+              })
+            }
+          })
+        }
+      })
+    },
+    getOverlapPedPhasePos () {
+      // 行人跟随相位信息
+      if (!this.crossInfo.overlaplList) return
+      this.overlapsidewalkPhaseData = []
+      this.crossInfo.overlaplList.forEach((ele, i) => {
+        if (ele.peddirection) {
+          ele.peddirection.forEach((dir, index) => {
+            if (this.PhaseDataModel.getSidePos(dir)) {
+              this.overlapsidewalkPhaseData.push({
+                key: this.CrossDiagramMgr.getUniqueKey('overlappedphase'),
+                phaseid: ele.id, // 相位id，用于对应相位状态
+                id: dir,
+                name: this.PhaseDataModel.getSidePos(dir).name,
+                left: this.PhaseDataModel.getSidePos(dir).x,
+                top: this.PhaseDataModel.getSidePos(dir).y
+              })
+            }
+          })
+        }
+      })
+    },
+    getChannelInfo () {
+      uploadSingleTscParam('channel', this.agentId).then(data => {
+        let res = data.data
+        if (!res.success) {
+          if (res.code === '4003') {
+            this.$message.error(this.$t('openatccomponents.errorTip.devicenotonline'))
+            return
+          }
+          this.$message.error(getMessageByCode(data.data.code, this.$i18n.locale))
+          return
+        }
+        this.channelList = res.data.data.channelList.filter(ele => ele.type !== undefined)
+        console.log('this.channelList', this.channelList)
+        this.handleChannelDirection()
+      })
+    },
+    handleChannelDirection () {
+      this.LanePhaseData = []
+      this.sidewalkPhaseData = []
+      this.sidewalkDir = []
+      let realphasedirarr = []
+      let realpeddirarr = []
+      this.channelList.forEach((ele, i) => {
+        if (ele.type === 0 || ele.type === 1 || ele.type === 3) {
+          if (ele.realdir) {
+            ele.realdir.forEach((dir, index) => {
+              let phaseinfo = this.PhaseDataModel.getPhase(dir)
+              // 车道相位（通道类型是机动车，非机动车，公交时，对应相位机动车）
+              this.LanePhaseData.push({
+                key: this.CrossDiagramMgr.getUniqueKey('phase'),
+                channelid: ele.id, // 通道id
+                id: dir, // 接口返回的dir字段，对应前端定义的相位方向id，唯一标识
+                name: this.$i18n.locale === 'en' ? phaseinfo.ename : phaseinfo.name
+              })
+            })
+            realphasedirarr = Array.from(new Set(realphasedirarr.concat(ele.realdir)))
+          }
+        }
+        if (ele.type === 2) {
+          if (ele.realdir) {
+            ele.realdir.forEach((dir, index) => {
+              // 行人相位
+              if (this.sidewalkDir.indexOf(dir) === -1 && this.PhaseDataModel.getSidePos(dir)) {
+                let pedinfo = this.PhaseDataModel.getSidePos(dir)
+                this.sidewalkPhaseData.push({
+                  key: this.CrossDiagramMgr.getUniqueKey('pedphase'),
+                  channelid: ele.id, // 通道id
+                  id: dir,
+                  name: this.$i18n.locale === 'en' ? pedinfo.ename : pedinfo.desc
+                })
+              }
+            })
+            realpeddirarr = Array.from(new Set(realpeddirarr.concat(ele.realdir)))
+            this.sidewalkDir = Array.from(new Set([...this.sidewalkDir.concat(ele.realdir)]))
+          }
+        }
+      })
+      this.inneChoosedDirection = this.choosedDirection.filter(dir => realphasedirarr.indexOf(dir) !== -1)
+      this.inneChoosedPedDirection = this.choosedPedDirection.filter(dir => realpeddirarr.indexOf(dir) !== -1)
+      this.drawPhaseIcon()
+    },
+    async drawPhaseIcon () {
+      if (!this.isThirdSignal) {
+        await this.getConflictList()
+        this.handleClickedPhase()
+        this.handleClickedPedPhase()
+        this.handleLaneDir()
+        this.handlePedDir()
+      } else {
+        this.handleClickedPhase()
+        this.handleClickedPedPhase()
+        this.handleLaneDir()
+        this.handlePedDir()
+      }
+    },
+    async getConflictList () {
+      let ConflictList = new CrossDirectionConflictList(this.agentId)
+      return ConflictList.getConflictListByAgentid().then(res => {
+        if (res) {
+          let conflictList = ConflictList.getListDirConflict(this.inneChoosedDirection, this.inneChoosedPedDirection)
+          this.phaseConflictList = conflictList.allConflictDir
+          this.pedConflictList = conflictList.allPedConflictDir
+          // 排他
+          for (let index = 0; index < this.LanePhaseData.length; index++) {
+            const element = this.LanePhaseData[index]
+            delete element.disabled
+          }
+          for (let index = 0; index < this.sidewalkPhaseData.length; index++) {
+            const element = this.sidewalkPhaseData[index]
+            delete element.disabled
+          }
+          for (let index = 0; index < this.LanePhaseData.length; index++) {
+            const element = this.LanePhaseData[index]
+            if (this.phaseConflictList.indexOf(element.id) !== -1) {
+              element.disabled = true
+            }
+          }
+          for (let index = 0; index < this.sidewalkPhaseData.length; index++) {
+            const element = this.sidewalkPhaseData[index]
+            if (this.pedConflictList.indexOf(element.id) !== -1) {
+              element.disabled = true
+            }
+          }
+        }
+      })
+    },
+    handleClickedPhase () {
+      if (!this.isThirdSignal) {
+        this.preselectDirection = this.inneChoosedDirection.filter(dir => this.phaseConflictList.indexOf(dir) === -1)
+      } else {
+        this.preselectDirection = JSON.parse(JSON.stringify(this.inneChoosedDirection))
+      }
+    },
+    handleClickedPedPhase () {
+      if (!this.isThirdSignal) {
+        this.preselectPedDirection = this.inneChoosedPedDirection.filter(dir => this.pedConflictList.indexOf(dir) === -1)
+      } else {
+        this.preselectPedDirection = JSON.parse(JSON.stringify(this.inneChoosedPedDirection))
+      }
+    },
+
+    handleLaneDir () {
+      if (!this.isThirdSignal) {
+        this.laneList = this.getPhaseDirIcon(this.LanePhaseData)
+      } else {
+        this.laneList = this.getPhaseDirIcon(this.compLanePhaseData)
+      }
+    },
+    handlePedDir () {
+      if (!this.isThirdSignal) {
+        this.pedList = JSON.parse(JSON.stringify(this.sidewalkPhaseData))
+      } else {
+        this.pedList = JSON.parse(JSON.stringify(this.compSidewalkPhaseData))
+      }
+    },
+    getPhaseDirIcon (list) {
+      let idarr = []
+      let dirlist = []
+      for (let i = 0; i < list.length; i++) {
+        if (list[i].id <= 16 && idarr.indexOf(list[i].id) === -1) {
+          idarr.push(list[i].id)
+          let obj = {
+            ...list[i],
+            iconclass: images.filter(ele => ele.id === list[i].id)[0].class
+          }
+          if (this.roadDirection === 'left') {
+            if (list[i].id === 4 || list[i].id === 8 || list[i].id === 12 || list[i].id === 16) {
+              obj.iconclass = images.filter(ele => ele.id === list[i].id)[0].leftclass
+            }
+          }
+          dirlist.push(obj)
+        }
+      }
+      return dirlist
+    },
+    selectDire (value, type) {
+      if (value.disabled) return
+      let id = value.id
+      if (type === 'lane') {
+        let index = this.preselectDirection.indexOf(id)
+        if (index === -1) {
+          this.preselectDirection.push(id)
+        } else {
+          this.preselectDirection.splice(index, 1)
+        }
+        // console.log(this.preselectDirection)
+        this.choosedLanePhase = this.laneList.filter(lane => this.preselectDirection.includes(lane.id))
+        // console.log(this.choosedLanePhase)
+        this.inneChoosedDirection = JSON.parse(JSON.stringify(this.preselectDirection))
+      }
+      if (type === 'ped') {
+        let index = this.preselectPedDirection.indexOf(id)
+        if (index === -1) {
+          this.preselectPedDirection.push(id)
+        } else {
+          this.preselectPedDirection.splice(index, 1)
+        }
+        // console.log(this.preselectPedDirection)
+        this.choosedPedPhase = this.pedList.filter(lane => this.preselectPedDirection.includes(lane.id))
+        // console.log(this.choosedPedPhase)
+        this.inneChoosedPedDirection = JSON.parse(JSON.stringify(this.preselectPedDirection))
+      }
+      this.EmitAllChoosedDirection(value)
+    },
+    EmitAllChoosedDirection (curClickedPhase) {
+      let allChoosedDir = {
+        direction: this.preselectDirection,
+        peddirection: this.preselectPedDirection
+      }
+      this.$emit('handleClickCrossIcon', allChoosedDir, curClickedPhase)
+      this.drawPhaseIcon()
+    }
+  },
+  mounted () {
+    this.init()
+  }
+}
+</script>

package/src/kisscomps/components/DirectionListConfiguration/index.js

@@ -0,0 +1,2 @@
+import DirectionListConfiguration from './DirectionListConfiguration.vue'
+export default DirectionListConfiguration

package/src/kisscomps/components/DirectionListConfiguration/svg/ped-east-bottom.vue

@@ -0,0 +1,41 @@
+/**
+ * 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>
+<svg t="1610604036193"
+  class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6817"
+  xmlns:xlink="http://www.w3.org/1999/xlink" width="42" height="42">
+  <path
+    d="M560.761905 0h48.761905v170.666667h-48.761905V0z m73.142857 0h48.761905v170.666667h-48.761905V0z m73.142857 0h48.761905v170.666667h-48.761905V0z m73.142857 0h48.761905v170.666667h-48.761905V0z"
+    class="default-ped-path" fill-opacity="0.3" p-id="6818"></path>
+  <path
+    d="M195.047619 0h48.761905v170.666667H195.047619V0z m73.142857 0h48.761905v170.666667h-48.761905V0z m73.142857 0h48.761905v170.666667h-48.761905V0z m73.142857 0h48.761905v170.666667h-48.761905V0z"
+    class="default-ped-path" fill-opacity="0.3" p-id="6819"></path>
+  <path
+    d="M560.761905 853.333333h48.761905v170.666667h-48.761905v-170.666667z m73.142857 0h48.761905v170.666667h-48.761905v-170.666667z m73.142857 0h48.761905v170.666667h-48.761905v-170.666667z m73.142857 0h48.761905v170.666667h-48.761905v-170.666667z"
+    class="default-ped-path" fill-opacity="0.3" p-id="6820"></path>
+  <path
+    d="M195.047619 853.333333h48.761905v170.666667H195.047619v-170.666667z m73.142857 0h48.761905v170.666667h-48.761905v-170.666667z m73.142857 0h48.761905v170.666667h-48.761905v-170.666667z m73.142857 0h48.761905v170.666667h-48.761905v-170.666667z"
+    class="default-ped-path" fill-opacity="0.3" p-id="6821"></path>
+  <path
+    d="M853.333333 560.761905h170.666667v48.761905h-170.666667v-48.761905z m0 73.142857h170.666667v48.761905h-170.666667v-48.761905z m0 73.142857h170.666667v48.761905h-170.666667v-48.761905z m0 73.142857h170.666667v48.761905h-170.666667v-48.761905z"
+    class="default-ped-path" p-id="6822"></path>
+  <path
+    d="M853.333333 195.047619h170.666667v48.761905h-170.666667V195.047619z m0 73.142857h170.666667v48.761905h-170.666667v-48.761905z m0 73.142857h170.666667v48.761905h-170.666667v-48.761905z m0 73.142857h170.666667v48.761905h-170.666667v-48.761905z"
+    class="default-ped-path" fill-opacity="0.3" p-id="6823"></path>
+  <path
+    d="M0 560.761905h170.666667v48.761905H0v-48.761905z m0 73.142857h170.666667v48.761905H0v-48.761905z m0 73.142857h170.666667v48.761905H0v-48.761905z m0 73.142857h170.666667v48.761905H0v-48.761905z"
+    class="default-ped-path" fill-opacity="0.3" p-id="6824"></path>
+  <path
+    d="M0 195.047619h170.666667v48.761905H0V195.047619z m0 73.142857h170.666667v48.761905H0v-48.761905z m0 73.142857h170.666667v48.761905H0v-48.761905z m0 73.142857h170.666667v48.761905H0v-48.761905z"
+    class="default-ped-path" fill-opacity="0.3" p-id="6825"></path>
+</svg>
+</template>

package/src/kisscomps/components/DirectionListConfiguration/svg/ped-east-top.vue

@@ -0,0 +1,60 @@
+/** * 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>
+  <svg
+    t="1710299752750"
+    class="icon"
+    viewBox="0 0 1024 1024"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    p-id="11672"
+    width="42"
+    height="42"
+  >
+    <path
+      d="M560.761905 0h48.761905v170.666667h-48.761905V0z m73.142857 0h48.761905v170.666667h-48.761905V0z m73.142857 0h48.761905v170.666667h-48.761905V0z m73.142857 0h48.761905v170.666667h-48.761905V0z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="11673"
+    ></path>
+    <path
+      d="M195.047619 0h48.761905v170.666667H195.047619V0z m73.142857 0h48.761905v170.666667h-48.761905V0z m73.142857 0h48.761905v170.666667h-48.761905V0z m73.142857 0h48.761905v170.666667h-48.761905V0z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="11674"
+    ></path>
+    <path
+      d="M560.761905 853.333333h48.761905v170.666667h-48.761905v-170.666667z m73.142857 0h48.761905v170.666667h-48.761905v-170.666667z m73.142857 0h48.761905v170.666667h-48.761905v-170.666667z m73.142857 0h48.761905v170.666667h-48.761905v-170.666667z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="11675"
+    ></path>
+    <path
+      d="M195.047619 853.333333h48.761905v170.666667H195.047619v-170.666667z m73.142857 0h48.761905v170.666667h-48.761905v-170.666667z m73.142857 0h48.761905v170.666667h-48.761905v-170.666667z m73.142857 0h48.761905v170.666667h-48.761905v-170.666667z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="11676"
+    ></path>
+    <path
+      d="M853.333333 560.761905h170.666667v48.761905h-170.666667v-48.761905z m0 73.142857h170.666667v48.761905h-170.666667v-48.761905z m0 73.142857h170.666667v48.761905h-170.666667v-48.761905z m0 73.142857h170.666667v48.761905h-170.666667v-48.761905z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="11677"
+    ></path>
+    <path
+      d="M853.333333 195.047619h170.666667v48.761905h-170.666667V195.047619z m0 73.142857h170.666667v48.761905h-170.666667v-48.761905z m0 73.142857h170.666667v48.761905h-170.666667v-48.761905z m0 73.142857h170.666667v48.761905h-170.666667v-48.761905z"
+      class="default-ped-path"
+      p-id="11678"
+    ></path>
+    <path
+      d="M0 560.761905h170.666667v48.761905H0v-48.761905z m0 73.142857h170.666667v48.761905H0v-48.761905z m0 73.142857h170.666667v48.761905H0v-48.761905z m0 73.142857h170.666667v48.761905H0v-48.761905z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="11679"
+    ></path>
+    <path
+      d="M0 195.047619h170.666667v48.761905H0V195.047619z m0 73.142857h170.666667v48.761905H0v-48.761905z m0 73.142857h170.666667v48.761905H0v-48.761905z m0 73.142857h170.666667v48.761905H0v-48.761905z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="11680"
+    ></path>
+  </svg>
+</template>

package/src/kisscomps/components/DirectionListConfiguration/svg/ped-ewped.vue

@@ -0,0 +1,105 @@
+/** * 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>
+  <svg
+    t="1710300380373"
+    class="icon"
+    viewBox="0 0 1024 1024"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    p-id="13895"
+    width="42"
+    height="42"
+  >
+    <path
+      d="M293.925926 663.703704h18.962963v56.888889H293.925926v-56.888889z m0 75.851852h18.962963v56.888888H293.925926v-56.888888z m0 75.851851h18.962963v56.888889H293.925926v-56.888889z m0 75.851852h18.962963v56.888889H293.925926v-56.888889z m0 75.851852h18.962963v56.888889H293.925926v-56.888889z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13896"
+    ></path>
+    <path
+      d="M388.740741 663.703704h18.962963v56.888889h-18.962963v-56.888889z m0 75.851852h18.962963v56.888888h-18.962963v-56.888888z m0 75.851851h18.962963v56.888889h-18.962963v-56.888889z m0 75.851852h18.962963v56.888889h-18.962963v-56.888889z m0 75.851852h18.962963v56.888889h-18.962963v-56.888889z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13897"
+    ></path>
+    <path
+      d="M635.259259 1024h-18.962963V682.666667h18.962963v341.333333z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13898"
+    ></path>
+    <path
+      d="M521.481481 1024h-18.962962V682.666667h18.962962v341.333333z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13899"
+    ></path>
+    <path
+      d="M730.074074 1024h-18.962963V682.666667h18.962963v341.333333z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13900"
+    ></path>
+    <path
+      d="M199.111111 1024H180.148148V663.703704h18.962963v360.296296z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13901"
+    ></path>
+    <path
+      d="M843.851852 1024h-18.962963V663.703704h18.962963v360.296296z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13902"
+    ></path>
+    <path
+      d="M824.888889 663.703704v18.962963H502.518519v-18.962963h322.37037z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13903"
+    ></path>
+    <path
+      d="M730.074074 360.296296h-18.962963v-56.888889h18.962963v56.888889z m0-75.851852h-18.962963v-56.888888h18.962963v56.888888z m0-75.851851h-18.962963V151.703704h18.962963v56.888889z m0-75.851852h-18.962963V75.851852h18.962963v56.888889z m0-75.851852h-18.962963V0h18.962963v56.888889z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13904"
+    ></path>
+    <path
+      d="M635.259259 360.296296h-18.962963v-56.888889h18.962963v56.888889z m0-75.851852h-18.962963v-56.888888h18.962963v56.888888z m0-75.851851h-18.962963V151.703704h18.962963v56.888889z m0-75.851852h-18.962963V75.851852h18.962963v56.888889z m0-75.851852h-18.962963V0h18.962963v56.888889z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13905"
+    ></path>
+    <path
+      d="M388.740741 0h18.962963v341.333333h-18.962963V0z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13906"
+    ></path>
+    <path
+      d="M502.518519 0h18.962962v341.333333h-18.962962V0z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13907"
+    ></path>
+    <path
+      d="M293.925926 0h18.962963v341.333333H293.925926V0z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13908"
+    ></path>
+    <path
+      d="M824.888889 0h18.962963v360.296296h-18.962963V0z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13909"
+    ></path>
+    <path
+      d="M180.148148 0h18.962963v360.296296H180.148148V0z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13910"
+    ></path>
+    <path
+      d="M199.111111 360.296296v-18.962963h322.37037v18.962963H199.111111z"
+      class="default-ped-path" fill-opacity="0.3"
+      p-id="13911"
+    ></path>
+    <path
+      d="M578.37037 436.148148h37.925926v151.703704h-37.925926v-151.703704z m-56.888889 0h37.925926v151.703704h-37.925926v-151.703704z m-56.888888 0h37.925926v151.703704h-37.925926v-151.703704z m-56.888889 0h37.925926v151.703704h-37.925926v-151.703704z m-56.888889 0h37.925926v151.703704H350.814815v-151.703704z m-56.888889 0h37.925926v151.703704H293.925926v-151.703704z m-56.888889 0h37.925926v151.703704H237.037037v-151.703704z m-56.888889 0h37.925926v151.703704H180.148148v-151.703704z m455.111111 0h37.925926v151.703704h-37.925926v-151.703704z m56.888889 0h37.925926v151.703704h-37.925926v-151.703704z m56.888889 0h37.925926v151.703704h-37.925926v-151.703704z m56.888889 0h37.925926v151.703704h-37.925926v-151.703704z"
+      class="default-ped-path"
+      p-id="13912"
+    ></path>
+  </svg>
+</template>