调整综合监控数据,调整地图绘制功能按钮显示状态逻辑判断

This commit is contained in:
zyy 2020-06-16 14:45:34 +08:00
parent 28cc15fd10
commit dfdbddad2b
36 changed files with 567 additions and 62 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 269 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 234 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

View File

@ -290,4 +290,10 @@ deviceRender[deviceType.Draught] = {
zlevel: 1, zlevel: 1,
z: 5 z: 5
}; };
// 图片
deviceRender[deviceType.IscsImage] = {
_type: deviceType.IscsImage,
zlevel: 1,
z: 5
};
export default deviceRender; export default deviceRender;

View File

@ -44,7 +44,8 @@ const deviceType = {
Electrically: 'Electrically', Electrically: 'Electrically',
Stairs: 'Stairs', Stairs: 'Stairs',
Elevator: 'Elevator', Elevator: 'Elevator',
Draught: 'Draught' Draught: 'Draught',
IscsImage: 'IscsImage'
}; };
export default deviceType; export default deviceType;

File diff suppressed because one or more lines are too long

View File

@ -45,6 +45,7 @@ import Electrically from './bas/electrically';
import Stairs from './bas/stairs'; import Stairs from './bas/stairs';
import Elevator from './bas/elevator'; import Elevator from './bas/elevator';
import Draught from './bas/draught'; import Draught from './bas/draught';
import IscsImage from './iscsImage';
const iscsShape = {}; const iscsShape = {};
iscsShape[deviceType.ManualAlarmButton] = ManualAlarmButton; iscsShape[deviceType.ManualAlarmButton] = ManualAlarmButton;
@ -94,6 +95,7 @@ iscsShape[deviceType.Electrically] = Electrically;
iscsShape[deviceType.Stairs] = Stairs; iscsShape[deviceType.Stairs] = Stairs;
iscsShape[deviceType.Elevator] = Elevator; iscsShape[deviceType.Elevator] = Elevator;
iscsShape[deviceType.Draught] = Draught; iscsShape[deviceType.Draught] = Draught;
iscsShape[deviceType.IscsImage] = IscsImage;
function shapefactory(device, iscs) { function shapefactory(device, iscs) {
const type = device.model._type; const type = device.model._type;

View File

@ -0,0 +1,43 @@
import Group from 'zrender/src/container/Group';
import Image from 'zrender/src/graphic/Image';
export default class BrakeMachine extends Group {
constructor(device) {
super();
this.model = device.model;
this.zlevel = device.model.zlevel;
this.z = device.model.z;
this._type = device.model._type;
this.code = device.model.code;
this.create();
}
create() {
const model = this.model;
this.grouper = new Group({
id: this.model.code,
position: [this.model.point.x, this.model.point.y]
});
const imgUrl = require(`@/assets/iscs_icon/${model.url}`);
this.image = new Image({
zlevel: this.zlevel,
z: this.z,
style: {
image: imgUrl,
x: 0,
y: 0,
width: model.width,
height: model.height
}
});
this.grouper.add(this.image);
if (model.rotate) {
this.grouper.origin = [0, 0];
this.grouper.rotation = -Math.PI / 180 * Number(this.model.rotate);
}
this.add(this.grouper);
}
setModel(dx, dy) {
this.model.point.x += dx;
this.model.point.y += dy;
}
}

View File

@ -181,6 +181,9 @@ export function parser(data) {
zrUtil.each(data.draughtList || [], elem => { zrUtil.each(data.draughtList || [], elem => {
iscsDevice[elem.code] = deviceFactory(deviceType.Draught, elem); iscsDevice[elem.code] = deviceFactory(deviceType.Draught, elem);
}); });
zrUtil.each(data.iscsImageList || [], elem => {
iscsDevice[elem.code] = deviceFactory(deviceType.IscsImage, elem);
});
} }
return iscsDevice; return iscsDevice;
@ -251,5 +254,6 @@ export function updateIscsData(state, device) {
case deviceType.Stairs: updateIscsListByDevice(state, 'stairsList', device); break; case deviceType.Stairs: updateIscsListByDevice(state, 'stairsList', device); break;
case deviceType.Elevator: updateIscsListByDevice(state, 'elevatorList', device); break; case deviceType.Elevator: updateIscsListByDevice(state, 'elevatorList', device); break;
case deviceType.Draught: updateIscsListByDevice(state, 'draughtList', device); break; case deviceType.Draught: updateIscsListByDevice(state, 'draughtList', device); break;
case deviceType.IscsImage: updateIscsListByDevice(state, 'iscsImageList', device); break;
} }
} }

View File

@ -519,6 +519,7 @@ class SkinCode extends defaultStyle {
}; };
this[deviceType.StationTurnBack] = { // 站后折返 this[deviceType.StationTurnBack] = { // 站后折返
displayCondition: '01', // 显示条件 01所有模式下显示 02 行调显示 03现地显示
lamp: { lamp: {
fill: '#FFFF00', // 填充色 fill: '#FFFF00', // 填充色
radiusR: 6 // 控制灯大小 radiusR: 6 // 控制灯大小

View File

@ -12,9 +12,10 @@ export default class StationTurnBack extends Group {
this.z = 40; this.z = 40;
this.model = model; this.model = model;
this.style = style; this.style = style;
// this.isShowShape = true; this.isShowShape = true;
this.create(); this.create();
this.setState(model); this.setState(model);
this.setShowMode();
} }
create() { create() {
const model = this.model; const model = this.model;
@ -104,7 +105,7 @@ export default class StationTurnBack extends Group {
// 设置状态 // 设置状态
setState(model, tbStrategyId = null) { setState(model, tbStrategyId = null) {
// if (!this.isShowShape) return; if (!this.isShowShape) return;
this.recover(); this.recover();
if (tbStrategyId) { if (tbStrategyId) {
model.tbStrategyId = tbStrategyId; model.tbStrategyId = tbStrategyId;
@ -118,19 +119,26 @@ export default class StationTurnBack extends Group {
} }
setShowMode() { setShowMode() {
const showMode = this.model.showMode;
const showConditions = this.style.StationTurnBack.displayCondition;
if (!showConditions || showConditions == '01' || showMode === showConditions) {
this.eachChild(item => item.show() );
} else {
this.eachChild(item => item.hide() );
}
} }
setShowStation(flag) { setShowStation(flag) {
// if (flag) { if (flag) {
// this.eachChild(item => { this.eachChild(item => {
// item.show(); item.show();
// }); });
// this.isShowShape = true; this.isShowShape = true;
// this.setState(this.model); this.setState(this.model);
// } else { } else {
// this.eachChild(item => { this.eachChild(item => {
// item.hide(); item.hide();
// }); });
// this.isShowShape = false; this.isShowShape = false;
// } }
} }
} }

View File

@ -221,6 +221,12 @@ export default {
mode: 'cctv', mode: 'cctv',
id: '43', id: '43',
type: 'interface' type: 'interface'
},
{
name: '车站控制-云台',
mode: 'cctv',
id: '44',
type: 'interface'
} }
] ]
}, },
@ -257,6 +263,20 @@ export default {
type: 'interface' type: 'interface'
} }
] ]
},
{
name: '网络状态',
mode: 'netState',
id: '7',
type: 'system',
children: [
{
name: '网络状态',
mode: 'netState',
id: '71',
type: 'interface'
}
]
} }
] ]
} }

View File

@ -0,0 +1,125 @@
<template>
<transition name="el-zoom-in-center">
<div class="map-control heightClass ">
<el-card type="border-card" class="heightClass">
<div slot="header" class="clearfix">
<el-button
type="text"
style="float: right; padding: 3px 0; margin-right: 5px;"
@click="handleSave"
>{{ $t('ibp.save') }}</el-button>
</div>
<el-tabs v-model="enabledTab" class="mapEdit" type="card" @tab-click="handleTabClick">
<el-tab-pane label="图片" name="IscsImage">
<iscs-image
ref="iscsImage"
style="width: 90%;"
@createDataModel="createDataModel"
@deleteDataModel="deleteDataModel"
/>
</el-tab-pane>
<el-tab-pane label="按钮" name="IscsButton">
<iscs-button
ref="iscsButton"
style="width: 90%;"
@createDataModel="createDataModel"
@deleteDataModel="deleteDataModel"
/>
</el-tab-pane>
<el-tab-pane label="文字" name="IscsText">
<iscs-text
ref="iscsText"
style="width: 90%;"
@createDataModel="createDataModel"
@deleteDataModel="deleteDataModel"
/>
</el-tab-pane>
<el-tab-pane label="线段" name="IscsLine">
<iscs-line
ref="iscsLine"
style="width: 90%;"
@createDataModel="createDataModel"
@deleteDataModel="deleteDataModel"
/>
</el-tab-pane>
<el-tab-pane label="矩形" name="IscsRect">
<iscs-rect
ref="iscsRect"
style="width: 90%;"
@createDataModel="createDataModel"
@deleteDataModel="deleteDataModel"
/>
</el-tab-pane>
</el-tabs>
</el-card>
</div>
</transition>
</template>
<script>
import {deviceFactory} from '@/iscs/utils/parser';
import IscsImage from './iscsImage';
import IscsButton from '../iscsCommonElem/button';
import IscsLine from '../iscsCommonElem/line';
import IscsText from '../iscsCommonElem/text';
import IscsRect from '../iscsCommonElem/rect';
export default {
name: 'IscsAcsOperate',
components: {
IscsImage,
IscsButton,
IscsLine,
IscsText,
IscsRect
},
mixins: [
],
data() {
return {
enabledTab: 'EntranceGuard',
data: '',
stationCode: ''
};
},
computed: {
height() {
return this.$store.state.config.height;
}
},
watch: {
'$store.state.iscs.rightClickCount': function (val) {
const model = this.$store.getters['iscs/updateDeviceData'];
this.enabledTab = model._type;
}
},
mounted() {
this.$emit('iscsChange', this.$route.params.id);
},
beforeDestroy() {
},
methods: {
createDataModel(model) {
const newModel = deviceFactory(model._type, model);
this.$store.dispatch('iscs/updateIscsDevices', newModel.model);
},
deleteDataModel(model) {
this.$store.dispatch('iscs/deleteIscsDevices', model);
},
handleSave() {
const data = JSON.stringify(this.$store.state.iscs.iscs);
console.log(data);
},
handleTabClick() {
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.map-control {
float: right;
width: 100%;
}
.heightClass{height:100%;}
</style>

View File

@ -0,0 +1,159 @@
<template>
<div>
<el-form ref="form" :rule="rules" :model="addModel" label-width="100px">
<el-form-item v-if="isUpdate" label="编号" prop="code">
<el-input v-model="addModel.code" :disabled="true" />
</el-form-item>
<el-form-item label="图片选择:" prop="url">
<el-select v-model="addModel.url">
<el-option
v-for="item in imageList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="图形宽度" prop="width">
<el-input-number v-model="addModel.width" />
</el-form-item>
<el-form-item label="图形高度" prop="height">
<el-input-number v-model="addModel.height" />
</el-form-item>
<el-form-item label="旋转角度" prop="rotate">
<el-input-number v-model="addModel.rotate" />
</el-form-item>
<el-form-item label="X轴坐标" prop="x">
<el-input-number v-model="addModel.x" />
</el-form-item>
<el-form-item label="Y轴坐标" prop="y">
<el-input-number v-model="addModel.y" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit('form')">{{ buttonText }}</el-button>
<el-button v-show="showDeleteButton" type="danger" @click="deleteDevice">{{ $t('global.delete') }}</el-button>
<el-button v-show="showDeleteButton" @click="initPage">{{ $t('global.cancel') }}</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import { mapGetters } from 'vuex';
import {getUID} from '@/iscs/utils/Uid';
// import netComputer from '@/assets/iscs_icon/net_computer.png';
// import netFrontEnd from '@/assets/iscs_icon/net_front-end.png';
// import netInterchanger from '@/assets/iscs_icon/net_interchanger.png';
// import netServer from '@/assets/iscs_icon/net_server.png';
export default {
name: 'IscsImage',
data() {
return {
imageList: [
{ label: '电脑', value: 'net_computer.png' },
{ label: '前置机', value: 'net_front-end.png' },
{ label: '交换机', value: 'net_interchanger.png' },
{ label: '服务器', value: 'net_server.png' }
],
addModel:{
code: '',
url: '',
rotate: 0,
width: 25,
height: 25,
x: 10,
y: 10
},
rules: {
url: [{ required: true, message:'请选择图片类型', trigger: 'change' }],
width:[{ required: true, message:'请输入设备图形宽度', trigger: 'blur' }],
height: [{ required: true, message:'请输入设备图形高度', trigger: 'blur' }],
x: [{ required: true, message: '请输入设备图形的X轴坐标', trigger: 'blur' }],
y: [{ required: true, message: '请输入设备图形的Y轴坐标', trigger: 'blur' }]
},
isUpdate:false,
showDeleteButton: false,
buttonText: '立即创建'
};
},
computed:{
...mapGetters('iscs', [
'iscs'
])
},
watch:{
'$store.state.iscs.rightClickCount': function (val) {
const model = this.$store.getters['iscs/updateDeviceData'];
if (model._type === 'IscsImage') {
this.buttonText = '修改';
this.showDeleteButton = true;
this.isUpdate = true;
this.addModel.code = model.code;
this.addModel.width = model.width;
this.addModel.height = model.height;
this.addModel.url = model.url;
this.addModel.rotate = model.rotate || 0;
this.addModel.x = model.point.x;
this.addModel.y = model.point.y;
}
}
},
methods: {
onSubmit(form) {
this.$refs[form].validate((valid) => {
if (valid) {
const newModel = {
point: {
x: this.addModel.x,
y: this.addModel.y
},
code: this.isUpdate ? this.addModel.code : getUID('IscsImage', this.iscs.iscsImageList || []),
_type: 'IscsImage',
width: this.addModel.width,
height: this.addModel.height,
url: this.addModel.url,
rotate: this.addModel.rotate
};
this.$emit('createDataModel', newModel);
this.initPage();
} else {
return false;
}
});
},
deleteDevice() {
const newModel = {
point: {
x: this.addModel.x,
y: this.addModel.y
},
code: this.addModel.code,
_type: 'IscsImage',
width: this.addModel.width
};
this.$emit('deleteDataModel', newModel);
this.initPage();
},
initPage() {
this.isUpdate = false;
this.buttonText = '立即创建';
this.showDeleteButton = false;
this.addModel = {
code: '',
rotate: 0,
url: '',
width: 25,
height: 25,
x: 10,
y: 10
};
}
}
};
</script>
<style scoped>
</style>

View File

@ -11,6 +11,7 @@
<iscs-cctv-operate v-else-if="iscsMode==='cctv'" ref="iscsCctvOperate" @iscsChange="iscsChange" /> <iscs-cctv-operate v-else-if="iscsMode==='cctv'" ref="iscsCctvOperate" @iscsChange="iscsChange" />
<iscs-afc-operate v-else-if="iscsMode==='afc'" ref="iscsAfcOperate" @iscsChange="iscsChange" /> <iscs-afc-operate v-else-if="iscsMode==='afc'" ref="iscsAfcOperate" @iscsChange="iscsChange" />
<iscs-acs-operate v-else-if="iscsMode==='acs'" ref="iscsAcsOperate" @iscsChange="iscsChange" /> <iscs-acs-operate v-else-if="iscsMode==='acs'" ref="iscsAcsOperate" @iscsChange="iscsChange" />
<iscs-net-operate v-else-if="iscsMode==='netState'" ref="iscsNetOperate" @iscsChange="iscsChange" />
</div> </div>
</div> </div>
</transition> </transition>
@ -24,6 +25,7 @@ import IscsPsdOperate from './iscsPsdOperate/index';
import IscsCctvOperate from './iscsCctvOperate/index'; import IscsCctvOperate from './iscsCctvOperate/index';
import IscsAfcOperate from './iscsAfcOperate/index'; import IscsAfcOperate from './iscsAfcOperate/index';
import IscsAcsOperate from './iscsAcsOperate/index'; import IscsAcsOperate from './iscsAcsOperate/index';
import IscsNetOperate from './IscsNetOperate/index';
export default { export default {
name: 'IscsView', name: 'IscsView',
components: { components: {
@ -33,7 +35,8 @@ export default {
IscsPsdOperate, IscsPsdOperate,
IscsCctvOperate, IscsCctvOperate,
IscsAfcOperate, IscsAfcOperate,
IscsAcsOperate IscsAcsOperate,
IscsNetOperate
}, },
data() { data() {
return { return {

View File

@ -18,6 +18,14 @@
@deleteDataModel="deleteDataModel" @deleteDataModel="deleteDataModel"
/> />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="关门" name="EndDoor">
<end-door
ref="endDoor"
style="width: 90%;"
@createDataModel="createDataModel"
@deleteDataModel="deleteDataModel"
/>
</el-tab-pane>
<el-tab-pane label="闸机" name="FasBrakeMachine"> <el-tab-pane label="闸机" name="FasBrakeMachine">
<fas-brake-machine <fas-brake-machine
ref="fasBrakeMachine" ref="fasBrakeMachine"
@ -89,12 +97,15 @@ import IscsButton from '../iscsCommonElem/button';
import IscsLine from '../iscsCommonElem/line'; import IscsLine from '../iscsCommonElem/line';
import IscsText from '../iscsCommonElem/text'; import IscsText from '../iscsCommonElem/text';
import IscsRect from '../iscsCommonElem/rect'; import IscsRect from '../iscsCommonElem/rect';
import EndDoor from '../iscsPsdOperate/endDoor';
export default { export default {
name: 'IscsAcsOperate', name: 'IscsAcsOperate',
components: { components: {
EntranceGuard, EntranceGuard,
FasBrakeMachine, FasBrakeMachine,
Staircase, Staircase,
EndDoor,
Escalator, Escalator,
IscsButton, IscsButton,
IscsLine, IscsLine,

View File

@ -59,6 +59,7 @@ export default {
{label: '操作按钮', value: 'OperatingButton'}, {label: '操作按钮', value: 'OperatingButton'},
{label: '返回', value: 'GoBack'}, {label: '返回', value: 'GoBack'},
{label: '至EPS系统及导向照明', value: 'GoEPS'}, {label: '至EPS系统及导向照明', value: 'GoEPS'},
{label: '射流风机图', value: 'GoJetFan'},
{label: '至B端小系统', value: 'GoBMiniSystem'}, {label: '至B端小系统', value: 'GoBMiniSystem'},
{label: '至A端小系统(一)', value: 'GoAMiniSystem1'}, {label: '至A端小系统(一)', value: 'GoAMiniSystem1'},
{label: '至A端小系统(二)', value: 'GoAMiniSystem2'} {label: '至A端小系统(二)', value: 'GoAMiniSystem2'}

View File

@ -42,30 +42,38 @@
@deleteDataModel="deleteDataModel" @deleteDataModel="deleteDataModel"
/> />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="文字" name="IscsText"> <el-tab-pane label="按钮" name="IscsButton">
<iscs-text <iscs-button
ref="iscsText" ref="iscsButton"
style="width: 90%;" style="width: 90%;"
@createDataModel="createDataModel" @createDataModel="createDataModel"
@deleteDataModel="deleteDataModel"> @deleteDataModel="deleteDataModel"
</iscs-text> />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="线段" name="IscsLine"> <el-tab-pane label="文字" name="IscsText">
<iscs-line <iscs-text
ref="iscsLine" ref="iscsText"
style="width: 90%;" style="width: 90%;"
@createDataModel="createDataModel" @createDataModel="createDataModel"
@deleteDataModel="deleteDataModel"> @deleteDataModel="deleteDataModel"
</iscs-line> />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="矩形" name="IscsRect"> <el-tab-pane label="线段" name="IscsLine">
<iscs-rect <iscs-line
ref="iscsRect" ref="iscsLine"
style="width: 90%;" style="width: 90%;"
@createDataModel="createDataModel" @createDataModel="createDataModel"
@deleteDataModel="deleteDataModel"> @deleteDataModel="deleteDataModel"
</iscs-rect> />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="矩形" name="IscsRect">
<iscs-rect
ref="iscsRect"
style="width: 90%;"
@createDataModel="createDataModel"
@deleteDataModel="deleteDataModel"
/>
</el-tab-pane>
</el-tabs> </el-tabs>
</el-card> </el-card>
</div> </div>
@ -79,6 +87,7 @@ import BorderRadius from './borderRadius';
import IscsLine from '../iscsCommonElem/line'; import IscsLine from '../iscsCommonElem/line';
import IscsText from '../iscsCommonElem/text'; import IscsText from '../iscsCommonElem/text';
import IscsRect from '../iscsCommonElem/rect'; import IscsRect from '../iscsCommonElem/rect';
import IscsButton from '../iscsCommonElem/button';
import ArcStatus from './ArcStatus'; import ArcStatus from './ArcStatus';
export default { export default {
@ -90,7 +99,8 @@ export default {
ArcStatus, ArcStatus,
IscsRect, IscsRect,
IscsLine, IscsLine,
IscsText IscsText,
IscsButton
}, },
mixins: [ mixins: [
], ],
@ -113,7 +123,7 @@ export default {
} }
}, },
mounted() { mounted() {
this.$emit('iscsChange', this.$route.params.id); this.$emit('iscsChange', this.$route.params.id);
}, },
beforeDestroy() { beforeDestroy() {

View File

@ -2,7 +2,7 @@
<div> <div>
<div class="standACS_title">{{ $route.query.stationName }}门禁站台层</div> <div class="standACS_title">{{ $route.query.stationName }}门禁站台层</div>
<div> <div>
<iscsSystem ref="iscsPlate" :width-canvas="990" :canvas-height="500" /> <iscsSystem ref="iscsPlate" :width-canvas="1300" :canvas-height="500" />
</div> </div>
</div> </div>
</template> </template>

View File

@ -2,7 +2,7 @@
<div> <div>
<div class="stationHall_title">{{ $route.query.stationName }}门禁站厅层</div> <div class="stationHall_title">{{ $route.query.stationName }}门禁站厅层</div>
<div> <div>
<iscsSystem ref="iscsPlate" :width-canvas="990" :canvas-height="600" /> <iscsSystem ref="iscsPlate" :width-canvas="1300" :canvas-height="600" />
</div> </div>
</div> </div>
</template> </template>

View File

@ -20,7 +20,7 @@ export default {
watch: { watch: {
'$store.state.iscs.selectedCount': function() { '$store.state.iscs.selectedCount': function() {
const device = this.$store.state.iscs.selected; const device = this.$store.state.iscs.selected;
if (device && device._type === 'IscsButton' && device.function === 'OperatingButton') { if (device && device._type === 'IscsButton' && device.function === 'GoJetFan') {
this.width = 1150; this.width = 1150;
this.$refs.iscsPlate.iscsLoadData('29'); this.$refs.iscsPlate.iscsLoadData('29');
} else if (device && device._type === 'IscsButton' && device.function === 'GoBack') { } else if (device && device._type === 'IscsButton' && device.function === 'GoBack') {

View File

@ -63,6 +63,9 @@ export default {
widthCanvas() { widthCanvas() {
this.reSize(); this.reSize();
}, },
canvasHeight() {
this.reSize();
},
'$store.state.socket.equipmentStatus': function (val) { '$store.state.socket.equipmentStatus': function (val) {
if (val.length) { if (val.length) {
this.statusMessage(val); this.statusMessage(val);

View File

@ -99,10 +99,10 @@
<div style="position: relative;width: 75px;left: 10px;"> <div style="position: relative;width: 75px;left: 10px;">
<div id="cctv-41" class="cctv-box-content-btn" @click="changeCCTV('41')">站厅</div> <div id="cctv-41" class="cctv-box-content-btn" @click="changeCCTV('41')">站厅</div>
<div id="cctv-42" class="cctv-box-content-btn" @click="changeCCTV('42')">站台</div> <div id="cctv-42" class="cctv-box-content-btn" @click="changeCCTV('42')">站台</div>
<div id="cctv-43" class="cctv-box-content-btn" @click="changeCCTV('43')">云台</div> <div id="cctv-44" class="cctv-box-content-btn" @click="changeCCTV('44')">云台</div>
</div> </div>
<div class="cctv-box-content-draw"> <div class="cctv-box-content-draw" :style="{marginLeft: left, marginTop: top}">
<iscsSystem ref="iscsPlate" :width-canvas="1490" :canvas-height="400" /> <iscsSystem ref="iscsPlate" :width-canvas="width" :canvas-height="height" />
</div> </div>
</div> </div>
<div class="cctv-box-bottom"> <div class="cctv-box-bottom">
@ -130,7 +130,11 @@ export default {
selectedCCTV: '41', selectedCCTV: '41',
descriptionList: [], descriptionList: [],
textarea: '', textarea: '',
value: '' value: '',
width: 1490,
height: 330,
left: '-22px',
top: '-20px'
}; };
}, },
mounted() { mounted() {
@ -145,6 +149,14 @@ export default {
const cctvBtn = document.getElementById('cctv-' + id); const cctvBtn = document.getElementById('cctv-' + id);
cctvBtn.setAttribute('class', 'cctv-box-content-btn active'); cctvBtn.setAttribute('class', 'cctv-box-content-btn active');
this.selectedCCTV = id; this.selectedCCTV = id;
this.left = '0px';
this.top = '0px';
if (id == '41') {
this.width = 1490;
this.height = 330;
this.left = '-22px';
this.top = '-20px';
}
this.$refs.iscsPlate.iscsLoadData(id); this.$refs.iscsPlate.iscsLoadData(id);
} }
} }

View File

@ -1,7 +1,5 @@
<template> <template>
<div> <div />
防淹门
</div>
</template> </template>
<script> <script>
export default { export default {

View File

@ -57,6 +57,14 @@ import Chiller from '@/assets/iscs_icon/chiller.png';
import ElectricButterflyValve from '@/assets/iscs_icon/electric_butterfly_value.png'; import ElectricButterflyValve from '@/assets/iscs_icon/electric_butterfly_value.png';
import BalancedElectric from '@/assets/iscs_icon/balanced_electric.png'; import BalancedElectric from '@/assets/iscs_icon/balanced_electric.png';
import FrozenPump from '@/assets/iscs_icon/frozen_pump.png'; import FrozenPump from '@/assets/iscs_icon/frozen_pump.png';
import PsdCloseDoor from '@/assets/iscs_icon/psd_close_door.png';
import PsdOpenDoor from '@/assets/iscs_icon/psd_open_door.png';
import PsdNoneDoor from '@/assets/iscs_icon/psd_none_door.png';
import PsdDoor from '@/assets/iscs_icon/psd_door.png';
import AfcAVM from '@/assets/iscs_icon/afc_AVM.png';
import AfcBOM from '@/assets/iscs_icon/afc_BOM.png';
import AfcDoor from '@/assets/iscs_icon/afc_door.png';
import AcsDoor from '@/assets/iscs_icon/acs_door.png';
export default { export default {
name: 'GraphicEle', name: 'GraphicEle',
@ -70,6 +78,25 @@ export default {
{graphicEle: 'smokeDetector', deviceType: '点型火灾探测器', shorthand: ''}, {graphicEle: 'smokeDetector', deviceType: '点型火灾探测器', shorthand: ''},
{graphicEle: 'gasFireControl', deviceType: '气体灭火控制器', shorthand: ''} {graphicEle: 'gasFireControl', deviceType: '气体灭火控制器', shorthand: ''}
], ],
psdData: [
{graphicEle: 'PsdOpenDoor', deviceType: '开门', shorthand: ''},
{graphicEle: 'PsdCloseDoor', deviceType: '关门', shorthand: ''},
{graphicEle: 'PsdNoneDoor', deviceType: '门状态未知', shorthand: ''},
{graphicEle: 'PsdDoor', deviceType: '端头门', shorthand: ''},
{graphicEle: '', deviceType: '', shorthand: ''}
],
afcData: [
{graphicEle: 'AfcBOM', deviceType: '半自动售票机', shorthand: ''},
{graphicEle: 'AfcAVM', deviceType: '自动售票机', shorthand: ''},
{graphicEle: 'AfcDoor', deviceType: '普通闸机', shorthand: ''},
{graphicEle: 'AfcDoor', deviceType: '宽闸机', shorthand: ''},
{graphicEle: '', deviceType: '', shorthand: ''}
],
acsData: [
{graphicEle: 'PsdDoor', deviceType: '开门', shorthand: ''},
{graphicEle: 'AcsDoor', deviceType: '关门', shorthand: ''},
{graphicEle: '', deviceType: '', shorthand: ''}
],
basData: [ basData: [
{graphicEle: 'AirConditioner', deviceType: '组合式空调机组、空调器', shorthand: '', graphicEle1: 'CoolTower', deviceType1: '冷却塔', shorthand1: ''}, {graphicEle: 'AirConditioner', deviceType: '组合式空调机组、空调器', shorthand: '', graphicEle1: 'CoolTower', deviceType1: '冷却塔', shorthand1: ''},
{graphicEle: 'Ventilator', deviceType: '普通风机', shorthand: '', graphicEle1: 'Chiller', deviceType1: '冷水机组', shorthand1: ''}, {graphicEle: 'Ventilator', deviceType: '普通风机', shorthand: '', graphicEle1: 'Chiller', deviceType1: '冷水机组', shorthand1: ''},
@ -96,7 +123,15 @@ export default {
Chiller: Chiller, Chiller: Chiller,
ElectricButterflyValve: ElectricButterflyValve, ElectricButterflyValve: ElectricButterflyValve,
BalancedElectric: BalancedElectric, BalancedElectric: BalancedElectric,
FrozenPump:FrozenPump FrozenPump:FrozenPump,
PsdOpenDoor: PsdOpenDoor,
PsdCloseDoor: PsdCloseDoor,
PsdNoneDoor: PsdNoneDoor,
PsdDoor: PsdDoor,
AfcAVM: AfcAVM,
AfcBOM: AfcBOM,
AfcDoor: AfcDoor,
AcsDoor: AcsDoor
}, },
styleObject: { styleObject: {
background: '#465F79', background: '#465F79',
@ -150,6 +185,25 @@ export default {
this.tableData = this.basData; this.tableData = this.basData;
this.meaning = '白色:关闭/停止。绿色:打开/运行。红色:报警。黄色:故障。'; this.meaning = '白色:关闭/停止。绿色:打开/运行。红色:报警。黄色:故障。';
break; break;
case 'PSD':
this.title = 'PSD图元说明';
this.width = '400px';
this.tableData = this.psdData;
this.meaning = '红色: 报警。蓝色: 通信中断。';
break;
case 'AFC':
this.title = 'PSD图元说明';
this.width = '400px';
this.tableData = this.afcData;
this.meaning = '红色: 报警。黄色: 故障。蓝色: 通信中断。';
break;
case 'stationHallACS':
case 'standACS':
this.title = 'ACS图元说明';
this.width = '400px';
this.tableData = this.acsData;
this.meaning = '红色: 报警。黄色: 故障。蓝色: 通信中断。';
break;
} }
} }
} }

View File

@ -32,6 +32,7 @@
<water-supply v-else-if="mode === 'waterSupply'" /> <water-supply v-else-if="mode === 'waterSupply'" />
<tunnel-ventilation v-else-if="mode === 'tunnelVentilation'" /> <tunnel-ventilation v-else-if="mode === 'tunnelVentilation'" />
<schedules v-else-if="mode === 'schedules'" /> <schedules v-else-if="mode === 'schedules'" />
<net-state v-else-if="mode === 'netState'" />
<graphic-ele ref="graphicEle" /> <graphic-ele ref="graphicEle" />
<device-control ref="deviceControl" /> <device-control ref="deviceControl" />
</div> </div>
@ -72,6 +73,7 @@ import ElectricEscalator from './bas/electricEscalator';
import WaterSupply from './bas/waterSupply'; import WaterSupply from './bas/waterSupply';
import TunnelVentilation from './bas/tunnelVentilation'; import TunnelVentilation from './bas/tunnelVentilation';
import Schedules from './bas/schedules'; import Schedules from './bas/schedules';
import NetState from './net/netState';
export default { export default {
components: { components: {
@ -108,7 +110,8 @@ export default {
ElectricEscalator, ElectricEscalator,
WaterSupply, WaterSupply,
TunnelVentilation, TunnelVentilation,
Schedules Schedules,
NetState
}, },
data() { data() {
return { return {

View File

@ -0,0 +1,34 @@
<template>
<div>
<div class="afc_title">{{ $route.query.stationName }}网络状态</div>
<div>
<iscsSystem ref="iscsPlate" :width-canvas="1300" :canvas-height="600" />
</div>
</div>
</template>
<script>
import iscsSystem from '../canvas/iscsCanvas';
export default {
components: {
iscsSystem
},
data() {
return {
mes: '1111'
};
},
mounted() {
this.$refs.iscsPlate.show('71');
},
methods: {}
};
</script>
<style lang="scss" scoped>
.afc_title{
width: 100%;
text-align: center;
font-size: 26px;
margin-top: 30px;
color: #56E5DE;
}
</style>