zc 集中站设置

src/i18n/langs/en/map.js

@@ -70,7 +70,7 @@ export default {
     section: 'section',
     switch: 'switch',
     signal: 'signal',
-    zcZoneControl: 'zc zone control',
+    zcZoneControl: 'zone control',
     temporaryLimit: 'temporary speed restriction',
     lcControl: 'Lc control',
     image: 'image',
@@ -85,6 +85,7 @@ export default {
     text: 'text',
     button: 'button',
     signalApprochSection:'Signal approch section',
+    concentrateStationList:'Concentrate station list',
 
     mapName: 'Name:',
     skinName: 'Skin style:',

src/i18n/langs/en/rules.js

@@ -318,5 +318,6 @@ export default {
     enterTheNewsContent: 'Please enter news content',
     chooseNewsCanBeClosed: 'Please select the news can be closed',
     theLeftEndOfTheSelectedAssociatedSectionIsNotAdjacent: 'The left end of the selected associated section is not adjacent!',
-    theRightEndOfTheSelectedAssociatedSectionIsNotAdjacent: 'The right end of the selected associated section is not adjacent!'
+    theRightEndOfTheSelectedAssociatedSectionIsNotAdjacent: 'The right end of the selected associated section is not adjacent!',
+    selectConcentrateStation:'Please select Concentrate Station'
 };

src/i18n/langs/zh/map.js

@@ -46,7 +46,7 @@ export default {
     section: '区段',
     switch: '道岔',
     signal: '信号机',
-    zcZoneControl: 'zc区域控制',
+    zcZoneControl: 'ZC',
     temporaryLimit: '全线临时限速',
     lcControl: 'Lc控制',
     buttonControl: '按钮',
@@ -62,6 +62,7 @@ export default {
     text: '文字',
     button: '按钮',
     signalApprochSection:' 信号机接近区段',
+    concentrateStationList:'集中站列表',
 
     mapName: '地图名称:',
     skinName: '皮肤:',

src/i18n/langs/zh/rules.js

@@ -320,5 +320,6 @@ export default {
     enterTheNewsContent: '请输入消息内容',
     chooseNewsCanBeClosed: '请选择消息是否可关闭',
     theLeftEndOfTheSelectedAssociatedSectionIsNotAdjacent: '所选择关联区段与该区段左侧不相邻！',
-    theRightEndOfTheSelectedAssociatedSectionIsNotAdjacent: '所选择关联区段与该区段右侧不相邻！'
+    theRightEndOfTheSelectedAssociatedSectionIsNotAdjacent: '所选择关联区段与该区段右侧不相邻！',
+    selectConcentrateStation:'请选择设备集中站'
 };

src/jmapNew/config/skinCode/bejing_01.js

@@ -390,6 +390,8 @@ class SkinCode extends defaultStyle {
         };
 
         this[deviceType.ZcControl] = {
+            // 是否显示
+            visible:true,
             text: {
                 fontSize: 10,										// 字体大小
                 fontWeight: 'normal',								// 字体粗细

src/jmapNew/shape/ZcControl/index.js

@@ -6,75 +6,77 @@ import EControl from '../element/EControl';
 import EMouse from './EMouse';
 
 export default class ZcControl extends Group {
-	constructor(model, style) {
+    constructor(model, style) {
-		super();
+        super();
-		this.z = 20;
+        this.z = 20;
-		this._code = model.code;
+        this._code = model.code;
-		this._type = model._type;
+        this._type = model._type;
-		this.zlevel = model.zlevel;
+        this.zlevel = model.zlevel;
-		this.model = model;
+        this.model = model;
-		this.style = style;
+        this.style = style;
-		this.create(model);
+        this.create(model);
-		this.createMouseEvent();
+        this.createMouseEvent();
-		this.setState(model);
+        this.setState(model);
 
-	}
+    }
 
-	create(model) {
+    create(model) {
-		this.control = new EControl({
+        if (this.style.ZcControl.visible) {
-			zlevel: this.zlevel,
+            this.control = new EControl({
-			z: this.z,
+                zlevel: this.zlevel,
-			arc: {
+                z: this.z,
-				shape: {
+                arc: {
-					cx: model.position.x,
+                    shape: {
-					cy: model.position.y,
+                        cx: model.position.x,
-					r: this.style.ZcControl.lamp.radiusR
+                        cy: model.position.y,
-				},
+                        r: this.style.ZcControl.lamp.radiusR
-				lineWidth: 0,
+                    },
-				fill: this.style.ZcControl.lamp.controlColor,
+                    lineWidth: 0,
-				mouseover: this.mouseoverArc,
+                    fill: this.style.ZcControl.lamp.controlColor,
-				mouseout: this.mouseoutArc
+                    mouseover: this.mouseoverArc,
-			},
+                    mouseout: this.mouseoutArc
-			text: {
+                },
-				position: [0, 0],
+                text: {
-				x: model.position.x,
+                    position: [0, 0],
-				y: model.position.y + this.style.ZcControl.lamp.radiusR + this.style.ZcControl.text.distance,
+                    x: model.position.x,
-				fontWeight: this.style.ZcControl.text.fontWeight,
+                    y: model.position.y + this.style.ZcControl.lamp.radiusR + this.style.ZcControl.text.distance,
-				fontSize: this.style.ZcControl.text.fontSize,
+                    fontWeight: this.style.ZcControl.text.fontWeight,
-				fontFamily: this.style.fontFamily,
+                    fontSize: this.style.ZcControl.text.fontSize,
-				text: model.name,
+                    fontFamily: this.style.fontFamily,
-				textFill: '#fff',
+                    text: model.name,
-				textAlign: 'middle',
+                    textFill: '#fff',
-				textVerticalAlign: 'top',
+                    textAlign: 'middle',
-				mouseover: this.mouseoverText,
+                    textVerticalAlign: 'top',
-				mouseout: this.mouseoutText
+                    mouseover: this.mouseoverText,
-			},
+                    mouseout: this.mouseoutText
-			style: this.style
+                },
-		});
+                style: this.style
+            });
+            this.add(this.control);
+        }
 
-		this.add(this.control);
+    }
-	}
 
-	// 设置状态
+    // 设置状态
-	setState(model) {
+    setState(model) {
-	}
+    }
-	createMouseEvent() {
+    createMouseEvent() {
-		if (this.style.ZcControl.mouseOverStyle) {
+        if (this.style.ZcControl.mouseOverStyle) {
-			this.mouseEvent = new EMouse(this);
+            this.mouseEvent = new EMouse(this);
-			this.add(this.mouseEvent);
+            this.add(this.mouseEvent);
-			this.on('mouseout', (e) => { this.mouseEvent.mouseout(e); });
+            this.on('mouseout', (e) => { this.mouseEvent.mouseout(e); });
-			this.on('mouseover', (e) => { this.mouseEvent.mouseover(e); });
+            this.on('mouseover', (e) => { this.mouseEvent.mouseover(e); });
-		}
+        }
-	}
+    }
-	getShapeTipPoint() {
+    getShapeTipPoint() {
-		if (this.control) {
+        if (this.control) {
-			var distance = 2;
+            var distance = 2;
-			var rect = this.control.getBoundingRect();
+            var rect = this.control.getBoundingRect();
-			return {
+            return {
-				x: rect.x + rect.width / 2,
+                x: rect.x + rect.width / 2,
-				y: rect.y - distance
+                y: rect.y - distance
-			};
+            };
-		}
+        }
-		return null;
+        return null;
-	}
+    }
 }

src/jmapNew/utils/parser.js

@@ -194,7 +194,7 @@ export function updateMapData(state, model) {
         case deviceType.StationStand: updateForList(model, state, 'stationStandList'); break;
         case deviceType.StationControl: updateForList(model, state, 'stationControlList'); break;
         case deviceType.StationCounter: updateForList(model, state, 'stationCounterList'); break;
-        case deviceType.ZcControl: updateForList(model, state, 'zcControlList'); break;
+        case deviceType.ZcControl: updateForList(model, state, 'zcList'); break;
         case deviceType.StationDelayUnlock:updateForList(model, state, 'stationDelayUnlockList'); break;
         case deviceType.LcControl: updateForList(model, state, 'lcControlList'); break;
         case deviceType.LimitControl: updateForList(model, state, 'tempSpeedLimitList'); break;

src/views/newMap/newMapdraft/mapoperate/config/data.vue

@@ -36,6 +36,26 @@
           </template>
         </el-form-item>
       </template>
+      <template v-if="checkFieldType(item, 'multiSelect')">
+        <el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
+          <el-select
+            v-model="formModel[item.prop]"
+            filterable
+            multiple
+            :placeholder="item.placeholder"
+            :disabled="item.disabled"
+            :clearable="item.clearable"
+            @change="item.deviceChange"
+          >
+            <el-option
+              v-for="option in item.options"
+              :key="option[item.optionValue]"
+              :label="handleLabel(option, item.optionLabel)"
+              :value="option[item.optionValue]"
+            />
+          </el-select>
+        </el-form-item>
+      </template>
       <template v-if="checkFieldType(item, 'selectHover')">
         <el-form-item v-if="!item.isHidden" :key="item.prop" :label="item.label" :prop="item.prop" :required="item.required">
           <el-select

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

@@ -200,7 +200,7 @@ export default {
                         item: [
                             { prop: 'isCIStation', label: this.$t('map.isCIStation'), type: 'checkbox'},
                             { prop: 'centralized', label: this.$t('map.centralized'), type: 'checkbox', disabled:this.controlled, change:true, deviceChange:this.changeCentralized },
-                            { prop: 'zcCode', label: this.$t('map.zcCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.zcList, isHidden: !this.isZcCode },
+                            { prop: 'zcCode', label: this.$t('map.zcCode'), type: 'select', optionLabel: 'code&&name', optionValue: 'code', options: this.zcList, isHidden: !this.isZcCode, disabled:true },
                             { prop: 'chargeStationCodeList', label: this.$t('map.chargeStationList'), type: 'multiSelect', optionLabel: 'name', optionValue: 'code', options: this.chargeStation, isHidden: !this.isZcCode, deviceChange:this.changeChargeStation},
                             { prop: 'runPlanName', label: this.$t('map.stationRunPlanName'), type: 'input' }
                         ]
@@ -262,22 +262,21 @@ export default {
                 this.activeName = 'first';
                 this.editModel = deepAssign(this.editModel, selected);
                 this.editModel.runPlanName = selected.runPlanName || '';
-                let beCentralizedStation={};
+                // 被控制的车站数据
+                const beCentralizedStation = {};
                 this.stationList.forEach(data=>{
-                    if(data.centralized){
+                    if (data.centralized) {
                         data.chargeStationCodeList.forEach(charge=>{
-                            let object={};
+                            beCentralizedStation[charge] = data.code;
-                            beCentralizedStation[charge]=data.code;
+                        });
-                        })
                     }
                 });
-                // 被控制的车站数据
                 // 筛选数据 去掉已经是集中站的数据，去掉自己本身，去掉被别的集中站选中的数据
                 this.chargeStation = this.stationList.filter(data=>{
                     console.log(beCentralizedStation[data.code]);
                     return !data.centralized && data.code != this.editModel.code && !(beCentralizedStation[data.code] && beCentralizedStation[data.code] != this.editModel.code);
                 });
-                this.controlled= !!beCentralizedStation[selected.code];
+                this.controlled = !!beCentralizedStation[selected.code];
                 // this.chargeStation = this.stationList.filter(data=>{
                 //     return !data.centralized && data.code != this.editModel.code && !(data.controlled && data.concentrateStationCode != this.editModel.code);
                 // });

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

@@ -254,16 +254,6 @@ export default {
             this.deviceSelect(this.$store.getters['map/getDeviceByCode'](code));
             this.edit();
         },
-        // changeStation(data) {
-        //     const station = this.stationList.find(elem => { return elem.code == data; });
-        //     if (station) {
-        //         if (station.centralized) {
-        //             this.addModel.deviceStationCode = station.code;
-        //         } else {
-        //             this.addModel.deviceStationCode = station.concentrateStationCode;
-        //         }
-        //     }
-        // },
         hover(field) {
             this.field = field === this.field ? '' : field;
             this.$emit('standStationCode', this.field);

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

@@ -1,5 +1,5 @@
 <template>
-  <el-tabs v-model="activeName" class="card">
+  <el-tabs v-model="activeName" class="card" @tab-click="handleClick">
     <el-tab-pane class="view-control" :label="$t('map.property')" name="first">
       <div style="height: calc(100% - 46px);">
         <el-scrollbar wrap-class="scrollbar-wrapper">
@@ -52,11 +52,13 @@ export default {
     data() {
         return {
             activeName: 'first',
+            concertrateStation:[],
             mapData: null,
             editModel: {
                 code: '',
                 name: '',
-                visible: '',
+                // visible: '',
+                concentrateStationList:[],
                 position: {
                     x: 0,
                     y: 0
@@ -65,7 +67,8 @@ export default {
             addModel: {
                 code: '',
                 name: '',
-                visible: '',
+                // visible: '',
+                concentrateStationList:[],
                 position: {
                     x: 0,
                     y: 0
@@ -78,8 +81,11 @@ export default {
                 name: [
                     { required: true, message: this.$t('rules.pleaseEnterStatusSignal'), trigger: 'blur' }
                 ],
-                visible: [
+                // visible: [
-                    { required: true, message: this.$t('rules.visible'), trigger: 'change' }
+                //     { required: true, message: this.$t('rules.visible'), trigger: 'change' }
+                // ],
+                concentrateStationList:[
+                    { required: true, message: this.$t('rules.selectConcentrateStation'), trigger: 'change' }
                 ],
                 'position.x': [
                     { required: true, message: this.$t('rules.trainPositionX'), trigger: 'blur' }
@@ -95,7 +101,8 @@ export default {
             'sectionList',
             'trainModelList',
             'zcList',
-            'lineCode'
+            'lineCode',
+            'stationList'
         ]),
         form() {
             const form = {
@@ -110,16 +117,13 @@ export default {
                         item: [
                             { prop: 'code', label: `${this.$t('map.zcZoneControl')}${this.$t('map.code')}`, type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.zcList, change: true, deviceChange: this.deviceChange },
                             { prop: 'name', label: this.$t('map.statusSignalName'), type: 'input' },
-                            { prop: 'visible', label: this.$t('map.showZc'), type: 'checkboxx' },
+                            // { prop: 'visible', label: this.$t('map.showZc'), type: 'checkboxx' },
                             { prop: 'position', label: this.$t('map.stateSignalsPlotCoordinates'), type: 'coordinate', width: '140px', children: [
                                 { prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px' },
                                 { prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px' }
-                            ] }
+                            ] },
+                            { prop:'concentrateStationList', label:this.$t('map.concentrateStationList'), type: 'multiSelect', optionLabel: 'name', optionValue: 'code', options: this.concertrateStation, deviceChange:this.changeConcertrateStation }
                         ]
-                    },
-                    map: {
-                        name: this.$t('map.mapData'),
-                        item: []
                     }
                 }
             };
@@ -133,7 +137,8 @@ export default {
                     { prop: 'position', label: this.$t('map.stateSignalsPlotCoordinates'), type: 'coordinate', width: '140px', children: [
                         { prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px' },
                         { prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px' }
-                    ] }
+                    ] },
+                    { prop:'concentrateStationList', label:this.$t('map.concentrateStationList'), type: 'multiSelect', optionLabel: 'name', optionValue: 'code', options: this.concertrateStation }
                 ]
             };
             return form;
@@ -148,6 +153,9 @@ export default {
                 ],
                 'position.y': [
                     { required: true, message: this.$t('rules.trainPositionY'), trigger: 'blur' }
+                ],
+                concentrateStationList:[
+                    { required: true, message: this.$t('rules.selectConcentrateStation'), trigger: 'change' }
                 ]
             };
         }
@@ -158,20 +166,42 @@ export default {
         }
     },
     mounted() {
+        this.getConcertrateStation();
     },
     methods: {
         deviceChange(code) {
             this.$emit('setCenter', code);
             this.deviceSelect(this.$store.getters['map/getDeviceByCode'](code));
         },
+        handleClick() {
+            this.getConcertrateStation();
+        },
         deviceSelect(selected) {
             this.$refs.dataform.resetFields();
             this.$refs.make.resetFields();
             if (selected && selected._type.toUpperCase() === 'ZcControl'.toUpperCase()) {
                 this.activeName = 'first';
                 this.editModel = deepAssign(this.editModel, selected);
+                this.getConcertrateStation();
             }
         },
+        getConcertrateStation() {
+            // 被选中的集中站站数据
+            const beConcentrateStation = {};
+            this.zcList = this.$store.getters['map/zcList'];
+            this.zcList.forEach(data=>{
+                data.concentrateStationList.forEach(concentrate=>{
+                    beConcentrateStation[concentrate] = data.code;
+                });
+            });
+            this.concertrateStation = this.stationList.filter(station=>{
+                if (this.activeName == 'first') {
+                    return station.centralized && !( beConcentrateStation[station.code] && (beConcentrateStation[station.code] != this.editModel.code));
+                } else {
+                    return station.centralized && !( beConcentrateStation[station.code]);
+                }
+            });
+        },
         create() {
             this.$refs.make.validate((valid) => {
                 if (valid) {
@@ -179,13 +209,16 @@ export default {
                     const model = {
                         _type: 'ZcControl',
                         code: uid,
-                        visible: true,
                         name: this.addModel.name,
                         position: {
                             x: this.addModel.position.x,
                             y: this.addModel.position.y
-                        }
+                        },
+                        concentrateStationList:this.addModel.concentrateStationList
                     };
+                    model.concentrateStationList.forEach(stationCode=>{
+                        this.setStationStand(stationCode, model.code);
+                    });
                     this.$emit('updateMapModel', model);
                 }
             });
@@ -215,7 +248,42 @@ export default {
                     _that.$message.info(this.$t('tip.cancelledDelete'));
                 });
             }
+        },
+        setStationStand(stationCode, code) {
+            this.stationList.forEach(elem=>{
+                if (elem.code == stationCode) {
+                    const station = Object.assign({}, elem);
+                    station.zcCode = code;
+                    this.$emit('updateMapModel', station);
+                }
+            });
         }
+        // changeConcertrateStation(data) {
+        //     if (data.length > 0) {
+        //         debugger;
+        //         this.concertrateStation.forEach(station=>{
+        //             const newModal = Object.assign({}, station);
+        //             // newModal.controlled = false;
+        //             // newModal.concentrateStationCode = '';
+        //             this.setStationStand(station, '');
+        //             data.forEach(each=>{
+        //                 switch (each) {
+        //                 case station.code: {
+        //                     // newModal.controlled = true;
+        //                     // newModal.concentrateStationCode = this.editModel.code;
+        //                     this.setStationStand(station, this.editModel.code);
+        //                     break;
+        //                 }
+        //                 }
+        //             });
+        //             this.$emit('updateMapModel', newModal);
+        //         });
+        //     } else {
+        //         // 没有选中数据，直接将其他车站设置
+        //         this.modifyChargeStation();
+        //     }
+        //     this.edit();
+        // }
     }
 };
 </script>