乘客信息发布系统拆分

src/scripts/ConstDic.js

@@ -405,7 +405,8 @@ export const ClientList = [
     { label: '应急调度', value: 'emergency' },
     { label: '运行图加载', value: 'diagramLoad' },
     { label: '运行图预览', value: 'diagramPreview' },
-    { label: '运行图编制', value: 'diagramEdit' }
+    { label: '运行图编制', value: 'diagramEdit' },
+    { label: '乘客信息发布系统', value: 'pisScreen' }
 ];
 /** 实训类型list */
 export const TrainingTypeList = [

src/views/newMap/display/terminals/index.vue

@@ -37,6 +37,7 @@
 
     <test-runplan v-if="picture=='testRunplan'" ref="testRunplan" :plan-id="loadPlanId" @pictureChange="pictureChangeAndPlan" />
     <driver-ats-work v-if="picture=='driverAtsWork'" ref="driverAtsWork" />
+    <pis-screen v-if="picture=='pisScreen'" ref="pisScreen" />
 
     <terminal-menu
       v-show="menuShow"
@@ -88,6 +89,7 @@ import TestRunplan from './testRunplan';
 import DriverAtsWork from './driverAtsWork';
 import NccWork from './nccWork';
 import LineMonitor from './lineMonitor';
+import PisScreen from './pisScreen';
 
 export default {
     name: 'Index',
@@ -126,7 +128,8 @@ export default {
         TestRunplan,
         DriverAtsWork,
         NccWork,
-        LineMonitor
+        LineMonitor,
+        PisScreen
     },
     data() {
         return {

src/views/newMap/display/terminals/pisScreen.vue

@@ -0,0 +1,284 @@
+<template>
+  <div style="width: 100%;height: 100%;background-color: #45607B;padding-top: 30px;">
+    <div class="station-nav-out">
+      <div class="station-nav">
+        <div class="stationList">
+          <div class="station-line" />
+          <div v-for="(item, index) in stationList" :key="index" class="station-box-out">
+            <div class="station-box">
+              <div class="leftRect" />
+              <div class="rightRect" />
+              <div class="station-list-box" :class="{'active': selectStation == item.id,'currentStation':tractionList.includes(item.name)}" @click="changeStation(item.id)" />
+            </div>
+            <div class="station-name" :class="index==0?'station-name-first':index%2==1?'station-name-up':'station-name-down'">{{ item.name }}</div>
+          </div>
+        </div>
+        <div class="rightButtonGroup">
+          <div class="rightButtonGroupL">
+            <div class="controlCenter">
+              <div class="station-list-button" :class="{'active': selectStation == 'controlCenter'}" @click="changeStation('controlCenter')" />
+            </div>
+            <div class="stationDepot">
+              <div class="station-list-button" :class="{'active': selectStation == 'stationDepot'}" @click="changeStation('stationDepot')" />
+            </div>
+            <div class="parkingLot">
+              <div class="station-list-button" :class="{'active': selectStation == 'parkingLot'}" @click="changeStation('parkingLot')" />
+            </div>
+            <div class="controlCenterName">控制中心</div>
+            <div class="parkingLotName">停车场</div>
+            <div class="stationDepotName">车辆段</div>
+          </div>
+          <div class="rightButtonGroupR">
+            <div class="mainHouseOne">
+              <div class="station-list-button" :class="{'active': selectStation == 'mainHouseOne'}" @click="changeStation('mainHouseOne')" />
+            </div>
+            <div class="mainHouseTwo">
+              <div class="station-list-button" :class="{'active': selectStation == 'mainHouseTwo'}" @click="changeStation('mainHouseTwo')" />
+            </div>
+            <div class="mainHouseOneName">主所1</div>
+            <div class="mainHouseTwoName">主所2</div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <pids-main :station-id="stationId" style="margin-top: 70px;" />
+  </div>
+</template>
+
+<script>
+import PidsMain from '../../../iscs/iscsSystemNew/config/pis/mainScreen';
+import { getByGroupStationList } from '@/api/jmap/map';
+export default {
+    name: 'PisScreen',
+    components: {
+        PidsMain
+    },
+    data() {
+        return {
+            stationId:'',
+            selectStation: 'mainHouseOne',
+            stationList:[],
+            tractionList:[],
+            buttonId:'substation'
+        };
+    },
+    async created () {
+        // 请求当前线路车站列表
+        const res = await getByGroupStationList(this.$route.query.group);
+        if (res.code == 200) {
+            this.stationList = [];
+            res.data.forEach(station => {
+                if (!station.depot && station.visible) {
+                    const param = {
+                        name: station.runPlanName.includes('站') ? station.runPlanName : `${station.runPlanName}站`,
+                        id: station.code
+                    };
+                    if (station.centralized) {
+                        this.tractionList.push(param.name);
+                    }
+                    this.stationList.push(param);
+                }
+            });
+            this.selectChildren(this.buttonId);
+        }
+    },
+    methods: {
+        changeStation(item) {
+            this.selectStation = item;
+            this.stationId = this.selectStation;
+        }
+    }
+};
+</script>
+
+<style lang="scss" scoped>
+.station-nav-out{
+	position: absolute;
+	left: 0;
+	top: 0;
+	width: 100%;
+}
+.station-nav{
+	width: 100%;
+	height: 65px;
+	background-color: #ACACAC;
+	position: relative;
+	padding-left: 5px;
+}
+.station-line{
+	height: 12px;
+	width: 100%;
+	position: absolute;
+	background-image: linear-gradient(to bottom , #9c9c9c, #F0F0F0,#9c9c9c);
+	top: 25px;
+	border: 1px #505050 solid;
+}
+.station-list-box{
+	width: 1vw;
+	height: 1vw;
+	border-radius: 1vw;
+	background: #ccc;
+	left: 4px;
+	top: 50%;
+	position: absolute;
+	border-left: 1px #fdfdfd solid;
+	border-right: 1px #262626 solid;
+	transform: translateY(-50%);
+}
+.station-list-box.currentStation::before{
+	content: '';
+	width: 128%;
+	height: 124%;
+	border: 1px #10ff00 solid;
+	position: absolute;
+	left: -16%;
+	top: -10%;
+	border-radius: 130%;
+}
+.station-list-box.active,.station-list-button.active{
+	background:#cdcd37;
+}
+.station-name{
+	font-size:12px;
+	position:absolute;
+}
+.station-name-first{
+	transform: translateX(0%);
+	top: 45px;
+	white-space: nowrap;
+	left: 0%;
+}
+.station-name-up{
+	top: 5px;
+	transform: translateX(-50%);
+	left: 25%;
+	white-space: nowrap;
+}
+.station-name-down{
+	top: 45px;
+// transform: translateX(-25%);
+	transform: translateX(-38%);
+	white-space: nowrap;
+	left: 0%;
+}
+.station-box-out{
+	height: 100%;
+	display: inline-block;
+	position: relative;
+}
+.station-box{
+	display: inline-block;
+	position: relative;
+// margin-right: 1.8vw;
+	width: 1.5vw;
+	margin-top: 20px;
+	cursor: pointer;
+}
+.leftRect{
+	width: 6px;
+	height: 19px;
+	background-image: linear-gradient(to bottom, #686868, #e9e9e9, #686868);
+	border: 1px #585858 solid;
+	display: inline-block;
+	vertical-align: top;
+}
+.rightRect{
+	width: 6px;
+	height: 19px;
+	position: absolute;
+	margin-left: 0.8vw;
+	background-image: linear-gradient(to bottom, #686868, #e9e9e9, #686868);
+	border: 1px #585858 solid;
+	display: inline-block;
+	vertical-align: top;
+}
+.stationList{
+// display: inline-block;
+	display: flex;
+	position: relative;
+	justify-content: space-between;
+	float: left;
+	height: 100%;
+	width: 82%;
+}
+.rightButtonGroup{
+	display: inline-block;
+	float: right;
+	width: 17vw;
+	height: 100%;
+}
+.rightButtonGroupL{
+	width: 10vw;
+	height: 100%;
+	display: inline-block;
+	float: left;
+	position: relative;
+	border-left: 1px #000 solid;
+	border-right: 1px #000 solid;
+}
+.rightButtonGroupR{
+	width: 7vw;
+	height: 100%;
+	display: inline-block;
+	position: relative;
+}
+.controlCenter,.stationDepot,.parkingLot{
+	display: inline-block;
+	position: relative;
+	width: 31%;
+	height: 100%;
+	vertical-align: top;
+	float: left;
+}
+.controlCenterName{
+	font-size: 12px;
+	position: absolute;
+	top: 5px;
+	left: 0.3vw;
+}
+.stationDepotName{
+	font-size: 12px;
+	position: absolute;
+	top: 45px;
+	left: 38%;
+}
+.parkingLotName{
+	font-size: 12px;
+	position: absolute;
+	top: 5px;
+	right: 11%;
+}
+.station-list-button{
+	width: 1vw;
+	height: 1vw;
+	border-radius: 1vw;
+	background: #ccc;
+	position: absolute;
+	border-left: 1px #fdfdfd solid;
+	border-right: 1px #262626 solid;
+	left: 50%;
+	top: 21px;
+	transform: translateX(-47%);
+	cursor: pointer;
+}
+.mainHouseOne,.mainHouseTwo{
+	display: inline-block;
+	position: relative;
+	width: 49%;
+	height: 100%;
+	vertical-align: top;
+	float: left;
+}
+.mainHouseOneName{
+	font-size: 12px;
+	position: absolute;
+	top: 5px;
+	left: 0.3vw;
+}
+.mainHouseTwoName{
+	font-size: 12px;
+	position: absolute;
+	top: 45px;
+	right: 8%;
+}
+</style>

src/views/newMap/display/terminals/terminalMenu.vue

@@ -121,7 +121,7 @@ export default {
                 troDetailWork: ['DISPATCHER'],
                 maintainerSelect: ['MAINTAINER']
             };
-            if (client && client.type) {
+            if (client && client.type && map[client.type]) {
                 const role = this.$store.state.training.roles;
                 const roleDevice = this.$store.state.training.roleDeviceCode;
                 if (client.deviceCode) {

src/views/newMap/newMapdraft/clientConfig.vue

@@ -63,7 +63,8 @@ export default {
                 { label: 'BaSiDi', key: 'baSiDi' },
                 { label: '轨道总览', key: 'troWork' },
                 { label: '轨道详览', key: 'troDetailWork' },
-                { label: '通号端', key: 'maintainerSelect' }
+                { label: '通号端', key: 'maintainerSelect' },
+                { label: '乘客信息发布系统', key: 'pisScreen' }
             ]
         };
     },

src/views/newMap/newMapdraft/mapoperate/terminals/terminals.vue

@@ -282,6 +282,11 @@ export default {
                     isShow: () => type === 'METRO'
 
                 },
+                {
+                    name: '乘客信息发布系统',
+                    code: 'pisScreen',
+                    isShow: () => type === 'METRO'
+                },
                 {
                     name: '大屏',
                     code: 'bigScreen',