joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

调整综合监控绘图元素，保存绘图数据

Browse Source
This commit is contained in:
zyy 2020-06-05 13:24:38 +08:00
parent 8bd88fe20b
commit fbf26cfafc
12 changed files with 398 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/iscs/constant/deviceRender.js
View File

@ -272,4 +272,16 @@ deviceRender[deviceType.Electrically] = {
zlevel: 1,
z: 5
};
// 扶梯
deviceRender[deviceType.Stairs] = {
_type: deviceType.Stairs,
zlevel: 1,
z: 5
};
// 电梯
deviceRender[deviceType.Elevator] = {
_type: deviceType.Elevator,
zlevel: 1,
z: 5
};
export default deviceRender;

4
src/iscs/constant/deviceType.js
View File

@ -41,7 +41,9 @@ const deviceType = {
BalancedElectric: 'BalancedElectric',
ElectricButterflyValve: 'ElectricButterflyValve',
Cistern: 'Cistern',
Electrically: 'Electrically'
Electrically: 'Electrically',
Stairs: 'Stairs',
Elevator: 'Elevator'
};
export default deviceType;

18
src/iscs/constant/iscsData.js
View File

File diff suppressed because one or more lines are too long

30
src/iscs/shape/bas/elevator.js Normal file
View File

@ -0,0 +1,30 @@
import Group from 'zrender/src/container/Group';
import createPathSvg from '../components/pathsvg';
export default class airConditioner 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() {
this.grouper = new Group({
id: this.model.code,
position: [this.model.point.x, this.model.point.y]
});
this.path = createPathSvg(this.model);
this.grouper.add(this.path);
if (this.model.rotate) {
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;
}
}

30
src/iscs/shape/bas/stairs.js Normal file
View File

@ -0,0 +1,30 @@
import Group from 'zrender/src/container/Group';
import createPathSvg from '../components/pathsvg';
export default class airConditioner 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() {
this.grouper = new Group({
id: this.model.code,
position: [this.model.point.x, this.model.point.y]
});
this.path = createPathSvg(this.model);
this.grouper.add(this.path);
if (this.model.rotate) {
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;
}
}

12
src/iscs/shape/components/pathsvg.js
View File

@ -76,9 +76,17 @@ const map = {
width: 51,
path: 'M51,71H0V0H12V15H23V-1h4V15H39V0H51V71ZM23,19H12v4H23V19Zm0,8H12v3H23V27Zm0,7H12v3H23V34Zm0,7H12v3H23V41Zm0,7H12v3H23V48Zm0,7H12v4H23V55ZM39,19H27v4H39V19Zm0,8H27v3H39V27Zm0,7H27v3H39V34Zm0,7H27v3H39V41Zm0,7H27v3H39V48Zm0,7H27v4H39V55ZM43,4V63H8V4H4V66H47V4H43Z'
},
Electrically: {
Electrically: { // 电动阀
width: 73,
path: 'M88,61h44L118,96v11l17,36H88l12-31a27.845,27.845,0,0,1-20,9c-10.918.076-17.578-9.2-18-19-0.3-6.868,4.7-19.035,19-19,15.658,0.038,18,8,18,8ZM71,99c2.055-8.165,13.821-5.509,17-3,2.941,2.321,1.828,10.958-1,13a12.742,12.742,0,0,1-12,1C71.1,108.294,69.5,104.972,71,99Z'
path: 'M26,0H70L56,35V46L73,82H26L38,51a27.845,27.845,0,0,1-20,9C7.082,60.076.422,50.8,0,41c-0.3-6.868,4.7-19.035,19-19,15.658,0.038,18,8,18,8ZM9,38c2.056-8.165,13.821-5.509,17-3,2.941,2.321,1.828,10.958-1,13a12.743,12.743,0,0,1-12,1C9.1,47.294,7.5,43.972,9,38Z'
},
Stairs: { // 扶梯
width: 154,
path: 'M397,235l-98,64H269V256h26l88-57h40v36H397ZM297,261H274v33h24l22.522-14.478L313,272l-13-1,4.468-14.893Zm14.575-9.549,15.385,23.932,22.764-14.634L345,254l-13-2,5.2-17.339Zm46.67,3.82,23.686-15.227L377,233l-13-2,5.189-17.3-26.5,17.364ZM418,204H384l-9.3,6.092,15.738,24.482L396,231h22V204Z'
},
Elevator: { // 电梯
width: 134,
path: 'M124,10V129H9V10H124ZM16,121H117V15H16V121Zm91.5-59a3.5,3.5,0,1,1,3.5-3.5A3.5,3.5,0,0,1,107.5,62Zm0-11a3.5,3.5,0,1,1,3.5-3.5A3.5,3.5,0,0,1,107.5,51Zm0-11a3.5,3.5,0,1,1,3.5-3.5A3.5,3.5,0,0,1,107.5,40Zm0-10a3.5,3.5,0,1,1,3.5-3.5A3.5,3.5,0,0,1,107.5,30ZM67,64H64V82l-2,1v22l-5-2V85H55v21l-5-1L49,54H43V69l-4-2V50l12-1s-3.327-1.327-4-3c-1.151-2.858-2.493-7.956,5-10s10.62,2.4,11,5c0.861,5.9-2,7-2,7v3l5,2,10,9,13-2v3s-6.188,4.864-13,5S67,64,67,64Zm59-10V8H7V131H126V82h8v55H0V0H134V54h-8Z'
}
};

4
src/iscs/shape/factory.js
View File

@ -42,6 +42,8 @@ import LightingGroup from './lighting';
import ElectricButterflyValve from './bas/electricButterflyValve';
import Cistern from './bas/cistern';
import Electrically from './bas/electrically';
import Stairs from './bas/stairs';
import Elevator from './bas/elevator';
const iscsShape = {};
iscsShape[deviceType.ManualAlarmButton] = ManualAlarmButton;
@ -88,6 +90,8 @@ iscsShape[deviceType.BalancedElectric] = BalancedElectric;
iscsShape[deviceType.ElectricButterflyValve] = ElectricButterflyValve;
iscsShape[deviceType.Cistern] = Cistern;
iscsShape[deviceType.Electrically] = Electrically;
iscsShape[deviceType.Stairs] = Stairs;
iscsShape[deviceType.Elevator] = Elevator;
function shapefactory(device, iscs) {
const type = device.model._type;

8
src/iscs/utils/parser.js
View File

@ -172,6 +172,12 @@ export function parser(data) {
zrUtil.each(data.electricallyList || [], elem => {
iscsDevice[elem.code] = deviceFactory(deviceType.Electrically, elem);
});
zrUtil.each(data.stairsList || [], elem => {
iscsDevice[elem.code] = deviceFactory(deviceType.Stairs, elem);
});
zrUtil.each(data.elevatorList || [], elem => {
iscsDevice[elem.code] = deviceFactory(deviceType.Elevator, elem);
});
}
return iscsDevice;
@ -239,5 +245,7 @@ export function updateIscsData(state, device) {
case deviceType.ElectricButterflyValve: updateIscsListByDevice(state, 'electricButterflyValveList', device); break;
case deviceType.Cistern: updateIscsListByDevice(state, 'cisternList', device); break;
case deviceType.Electrically: updateIscsListByDevice(state, 'electricallyList', device); break;
case deviceType.Stairs: updateIscsListByDevice(state, 'stairsList', device); break;
case deviceType.Elevator: updateIscsListByDevice(state, 'elevatorList', device); break;
}
}

11
src/views/iscs/iscsDraw/iscsBasOperate/electrically.vue
View File

@ -10,9 +10,6 @@
<el-form-item label="旋转角度" prop="rotate">
<el-input-number v-model="form.rotate" />
</el-form-item>
<el-form-item label="颜色" prop="fill">
<el-color-picker v-model="form.fill" />
</el-form-item>
<el-form-item label="X轴坐标" prop="x">
<el-input-number v-model="form.x" controls-position="right" :min="1" />
</el-form-item>
@ -41,7 +38,6 @@ export default {
code:'',
width: 20,
rotate: 0,
fill: '#000',
x: 10,
y: 10
},
@ -76,7 +72,6 @@ export default {
this.form.code = model.code;
this.form.width = model.width;
this.form.rotate = model.rotate || 0;
this.form.fill = model.fill;
this.form.x = model.point.x;
this.form.y = model.point.y;
}
@ -97,8 +92,7 @@ export default {
_type: 'Electrically',
code: this.isUpdate ? this.form.code : getUID('Electrically', this.iscs.electricallyList || []),
width: this.form.width,
rotate: this.form.rotate,
fill: this.form.fill
rotate: this.form.rotate
};
this.$emit('createDataModel', model);
this.initPage();
@ -128,8 +122,7 @@ export default {
},
_type: 'Electrically',
code: this.form.code,
width: this.form.width,
fill: '#000'
width: this.form.width
};
this.$emit('deleteDataModel', airConditionerModel );
this.initPage();

132
src/views/iscs/iscsDraw/iscsBasOperate/elevator.vue Normal file
View File

@ -0,0 +1,132 @@
<template>
<div>
<el-form ref="form" :rules="rules" :model="form" label-width="100px">
<el-form-item v-if="isUpdate" label="编号" prop="code">
<el-input v-model="form.code" :disabled="true" />
</el-form-item>
<el-form-item label="图形宽度" prop="width">
<el-input-number v-model="form.width" :min="10" />
</el-form-item>
<el-form-item label="旋转角度" prop="rotate">
<el-input-number v-model="form.rotate" />
</el-form-item>
<el-form-item label="X轴坐标" prop="x">
<el-input-number v-model="form.x" controls-position="right" :min="1" />
</el-form-item>
<el-form-item label="Y轴坐标" prop="y">
<el-input-number v-model="form.y" controls-position="right" :min="1" />
</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';
export default {
name:'AirConditioner',
data() {
return {
isUpdate:false,
showDeleteButton: false,
buttonText: '立即创建',
form:{
code:'',
width: 20,
rotate: 0,
x: 10,
y: 10
},
rules: {
code: [
{ required: true, message:'请生成设备图形的编码', trigger: 'blur' }
],
width:[
{ required: true, message:'请输入设备图形宽度', trigger: 'blur' }
],
x: [
{ required: true, message: '请输入设备图形的X轴坐标', trigger: 'blur' }
],
y: [
{ required: true, message: '请输入设备图形的Y轴坐标', trigger: 'blur' }
]
}
};
},
computed:{
...mapGetters('iscs', [
'iscs'
])
},
watch:{
'$store.state.iscs.rightClickCount': function (val) {
const model = this.$store.getters['iscs/updateDeviceData'];
if (model._type === 'Elevator' ) {
this.buttonText = '修改';
this.showDeleteButton = true;
this.isUpdate = true;
this.form.code = model.code;
this.form.width = model.width;
this.form.rotate = model.rotate || 0;
this.form.x = model.point.x;
this.form.y = model.point.y;
}
}
},
mounted() {
},
methods:{
onSubmit(form) {
this.$refs[form].validate((valid) => {
if (valid) {
const model = {
point: {
x: this.form.x,
y: this.form.y
},
_type: 'Elevator',
code: this.isUpdate ? this.form.code : getUID('Elevator', this.iscs.elevatorList || []),
width: this.form.width,
rotate: this.form.rotate
};
this.$emit('createDataModel', model);
this.initPage();
} else {
return false;
}
});
},
initPage() {
this.isUpdate = false;
this.buttonText = '立即创建';
this.showDeleteButton = false;
this.form = {
code:'',
width: 20,
x: 10,
y: 10
};
this.$refs.form.resetFields();
},
deleteDevice() {
const airConditionerModel = {
point: {
x: this.form.x,
y: this.form.y
},
_type: 'Elevator',
code: this.form.code,
width: this.form.width
};
this.$emit('deleteDataModel', airConditionerModel );
this.initPage();
}
}
};
</script>

23
src/views/iscs/iscsDraw/iscsBasOperate/index.vue
View File

@ -147,6 +147,22 @@
@deleteDataModel="deleteDataModel"
/>
</el-tab-pane>
<el-tab-pane label="扶梯" name="Stairs">
<stairs
ref="stairs"
style="width: 100%;height: 100%;"
@createDataModel="createDataModel"
@deleteDataModel="deleteDataModel"
/>
</el-tab-pane>
<el-tab-pane label="电梯" name="Elevator">
<elevator
ref="elevator"
style="width: 100%;height: 100%;"
@createDataModel="createDataModel"
@deleteDataModel="deleteDataModel"
/>
</el-tab-pane>
<el-tab-pane label="闸机" name="FasBrakeMachine">
<fas-brake-machine
ref="fasBrakeMachine"
@ -234,6 +250,8 @@ import Electrically from './electrically';
import Escalator from '../iscsOperate/escalator'; // 楼梯
import FasBrakeMachine from '../iscsOperate/brakeMachine'; // 闸机
import StateTable from '../iscsCommonElem/stateTable';
import Stairs from './stairs';
import Elevator from './elevator';
export default {
name: 'IscsOperate',
@ -261,7 +279,10 @@ export default {
Escalator,
Electrically,
FasBrakeMachine,
StateTable
StateTable,
Stairs,
Elevator
},
mixins: [
],

132
src/views/iscs/iscsDraw/iscsBasOperate/stairs.vue Normal file
View File

@ -0,0 +1,132 @@
<template>
<div>
<el-form ref="form" :rules="rules" :model="form" label-width="100px">
<el-form-item v-if="isUpdate" label="编号" prop="code">
<el-input v-model="form.code" :disabled="true" />
</el-form-item>
<el-form-item label="图形宽度" prop="width">
<el-input-number v-model="form.width" :min="10" />
</el-form-item>
<el-form-item label="旋转角度" prop="rotate">
<el-input-number v-model="form.rotate" />
</el-form-item>
<el-form-item label="X轴坐标" prop="x">
<el-input-number v-model="form.x" controls-position="right" :min="1" />
</el-form-item>
<el-form-item label="Y轴坐标" prop="y">
<el-input-number v-model="form.y" controls-position="right" :min="1" />
</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';
export default {
name:'AirConditioner',
data() {
return {
isUpdate:false,
showDeleteButton: false,
buttonText: '立即创建',
form:{
code:'',
width: 20,
rotate: 0,
x: 10,
y: 10
},
rules: {
code: [
{ required: true, message:'请生成设备图形的编码', trigger: 'blur' }
],
width:[
{ required: true, message:'请输入设备图形宽度', trigger: 'blur' }
],
x: [
{ required: true, message: '请输入设备图形的X轴坐标', trigger: 'blur' }
],
y: [
{ required: true, message: '请输入设备图形的Y轴坐标', trigger: 'blur' }
]
}
};
},
computed:{
...mapGetters('iscs', [
'iscs'
])
},
watch:{
'$store.state.iscs.rightClickCount': function (val) {
const model = this.$store.getters['iscs/updateDeviceData'];
if (model._type === 'Stairs' ) {
this.buttonText = '修改';
this.showDeleteButton = true;
this.isUpdate = true;
this.form.code = model.code;
this.form.width = model.width;
this.form.rotate = model.rotate || 0;
this.form.x = model.point.x;
this.form.y = model.point.y;
}
}
},
mounted() {
},
methods:{
onSubmit(form) {
this.$refs[form].validate((valid) => {
if (valid) {
const model = {
point: {
x: this.form.x,
y: this.form.y
},
_type: 'Stairs',
code: this.isUpdate ? this.form.code : getUID('Stairs', this.iscs.stairsList || []),
width: this.form.width,
rotate: this.form.rotate
};
this.$emit('createDataModel', model);
this.initPage();
} else {
return false;
}
});
},
initPage() {
this.isUpdate = false;
this.buttonText = '立即创建';
this.showDeleteButton = false;
this.form = {
code:'',
width: 20,
x: 10,
y: 10
};
this.$refs.form.resetFields();
},
deleteDevice() {
const airConditionerModel = {
point: {
x: this.form.x,
y: this.form.y
},
_type: 'Stairs',
code: this.form.code,
width: this.form.width
};
this.$emit('deleteDataModel', airConditionerModel );
this.initPage();
}
}
};
</script>