Merge branch 'test' of https://git.code.tencent.com/lian-cbtc/jl-client into test
This commit is contained in:
commit
d93cbc4beb
@ -363,4 +363,19 @@ deviceRender[deviceType.IscsTriangle] = {
|
||||
zlevel:1,
|
||||
z: 5
|
||||
};
|
||||
|
||||
/** 福州 圆形 */
|
||||
deviceRender[deviceType.IscsCircle] = {
|
||||
_type: deviceType.IscsCircle,
|
||||
zlevel:1,
|
||||
z: 5
|
||||
};
|
||||
|
||||
/** 福州 屏蔽门 */
|
||||
deviceRender[deviceType.FuzhouPsd] = {
|
||||
_type: deviceType.FuzhouPsd,
|
||||
zlevel:1,
|
||||
z: 5
|
||||
};
|
||||
|
||||
export default deviceRender;
|
||||
|
@ -56,7 +56,9 @@ const deviceType = {
|
||||
CommunicationButcher: 'CommunicationButcher',
|
||||
AfcDoorUnite: 'AfcDoorUnite',
|
||||
RectText: 'RectText',
|
||||
IscsTriangle:'IscsTriangle'
|
||||
IscsTriangle:'IscsTriangle',
|
||||
IscsCircle:'IscsCircle',
|
||||
FuzhouPsd:'FuzhouPsd'
|
||||
};
|
||||
|
||||
export default deviceType;
|
||||
|
@ -57,6 +57,8 @@ import CommunicationButcher from './communicationButcher';
|
||||
import AfcDoorUnite from './afcDoorUnite';
|
||||
import RectText from './rectText';
|
||||
import IscsTriangle from './iscsTriangle';
|
||||
import IscsCircle from './iscsCircle';
|
||||
import FuzhouPsd from './fuzhouPsd';
|
||||
|
||||
const iscsShape = {};
|
||||
iscsShape[deviceType.ManualAlarmButton] = ManualAlarmButton;
|
||||
@ -118,6 +120,8 @@ iscsShape[deviceType.CommunicationButcher] = CommunicationButcher;
|
||||
iscsShape[deviceType.AfcDoorUnite] = AfcDoorUnite;
|
||||
iscsShape[deviceType.RectText] = RectText;
|
||||
iscsShape[deviceType.IscsTriangle] = IscsTriangle;
|
||||
iscsShape[deviceType.IscsCircle] = IscsCircle;
|
||||
iscsShape[deviceType.FuzhouPsd] = FuzhouPsd;
|
||||
|
||||
function shapefactory(device, iscs) {
|
||||
const type = device.model._type;
|
||||
|
87
src/iscs/shape/fuzhouPsd.js
Normal file
87
src/iscs/shape/fuzhouPsd.js
Normal file
@ -0,0 +1,87 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Rect from 'zrender/src/graphic/shape/Rect';
|
||||
|
||||
export default class fuzhouPsd 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();
|
||||
this.setState(this.model);
|
||||
}
|
||||
create() {
|
||||
this.grouper = new Group({
|
||||
id: this.model.code,
|
||||
position: [this.model.point.x, this.model.point.y]
|
||||
});
|
||||
this.fuzhouPsdBorder = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x: 0,
|
||||
y: 0,
|
||||
width: this.model.height * 1.6,
|
||||
height: this.model.height
|
||||
},
|
||||
style: {
|
||||
fill: '#c48b19',
|
||||
stroke: '#f00',
|
||||
lineWidth: 0
|
||||
}
|
||||
});
|
||||
this.fuzhouPsdLeft = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x: 3 + (this.model.height * 1.6 - 8) * 0.15,
|
||||
y: 3,
|
||||
width: (this.model.height * 1.6 - 8) * 0.35,
|
||||
height: this.model.height - 6
|
||||
},
|
||||
style: {
|
||||
fill: '#33CC00',
|
||||
stroke: '#000',
|
||||
lineWidth: 1
|
||||
}
|
||||
});
|
||||
this.fuzhouPsdRight = new Rect({
|
||||
zlevel: this.zlevel,
|
||||
z: this.z,
|
||||
shape: {
|
||||
x: (this.model.height * 1.6 - 8) * 0.5 + 5,
|
||||
y: 3,
|
||||
width: (this.model.height * 1.6 - 8) * 0.35,
|
||||
height: this.model.height - 6
|
||||
},
|
||||
style: {
|
||||
fill: '#33CC00',
|
||||
stroke: '#000',
|
||||
lineWidth: 1
|
||||
}
|
||||
});
|
||||
this.grouper.add(this.fuzhouPsdBorder);
|
||||
this.grouper.add(this.fuzhouPsdLeft);
|
||||
this.grouper.add(this.fuzhouPsdRight);
|
||||
this.add(this.grouper);
|
||||
}
|
||||
setState(model) {
|
||||
if (model.alarm) {
|
||||
this.fuzhouPsdBorder.setStyle('lineWidth', 1);
|
||||
}
|
||||
if (model.noStatus) {
|
||||
this.fuzhouPsdLeft.attr({shape:{x: 3}});
|
||||
this.fuzhouPsdRight.attr({shape:{x: this.model.height * 1.04 - 0.2}});
|
||||
this.fuzhouPsdBorder.setStyle('fill', '#0f96dc');
|
||||
this.fuzhouPsdRight.setStyle('fill', '#0f96dc');
|
||||
this.fuzhouPsdLeft.setStyle('fill', '#0f96dc');
|
||||
}
|
||||
}
|
||||
setModel(dx, dy) {
|
||||
this.model.point.x += dx;
|
||||
this.model.point.y += dy;
|
||||
}
|
||||
|
||||
}
|
41
src/iscs/shape/iscsCircle.js
Normal file
41
src/iscs/shape/iscsCircle.js
Normal file
@ -0,0 +1,41 @@
|
||||
import Group from 'zrender/src/container/Group';
|
||||
import Circle from 'zrender/src/graphic/shape/Circle';
|
||||
|
||||
export default class iscsCircle extends Group {
|
||||
constructor(device) {
|
||||
super();
|
||||
this.model = device.model;
|
||||
this._type = device.model._type;
|
||||
this._code = device.model.code;
|
||||
this.zlevel = device.model.zlevel;
|
||||
this.z = device.model.z;
|
||||
this.create();
|
||||
}
|
||||
create() {
|
||||
const model = this.model;
|
||||
this.grouper = new Group({
|
||||
id: model.code,
|
||||
position: [model.point.x, model.point.y]
|
||||
});
|
||||
this.iscsCircle = new Circle({
|
||||
zlevel: model.zlevel,
|
||||
z: model.z,
|
||||
shape: {
|
||||
cx:this.model.radius,
|
||||
cy:this.model.radius,
|
||||
r:this.model.radius
|
||||
},
|
||||
style: {
|
||||
fill: this.model.fillColor,
|
||||
stroke: this.model.strokeColor,
|
||||
lineWidth: this.model.borderWidth
|
||||
}
|
||||
});
|
||||
this.grouper.add(this.iscsCircle);
|
||||
this.add(this.grouper);
|
||||
}
|
||||
setModel(dx, dy) {
|
||||
this.model.point.x += dx;
|
||||
this.model.point.y += dy;
|
||||
}
|
||||
}
|
@ -217,6 +217,12 @@ export function parser(data) {
|
||||
zrUtil.each(data.iscsTriangleList || [], elem=> {
|
||||
iscsDevice[elem.code] = deviceFactory(deviceType.IscsTriangle, elem);
|
||||
});
|
||||
zrUtil.each(data.iscsCircleList || [], elem=> {
|
||||
iscsDevice[elem.code] = deviceFactory(deviceType.IscsCircle, elem);
|
||||
});
|
||||
zrUtil.each(data.fuzhouPsdList || [], elem=> {
|
||||
iscsDevice[elem.code] = deviceFactory(deviceType.FuzhouPsd, elem);
|
||||
});
|
||||
}
|
||||
|
||||
return iscsDevice;
|
||||
|
147
src/views/iscs/iscsDraw/icscComponents/circle.vue
Normal file
147
src/views/iscs/iscsDraw/icscComponents/circle.vue
Normal file
@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<div style="overflow-y: scroll;height: calc(100% - 46px); width: 100%;">
|
||||
<el-form ref="form" :rules="rules" :model="form" label-width="80px" style="width: 100%;padding: 10px 50px;">
|
||||
<el-form-item label="半径:" prop="radius">
|
||||
<el-input-number v-model="form.radius" controls-position="right" :min="5" size="small" />
|
||||
</el-form-item>
|
||||
<el-form-item label="填充色:" prop="fillColor">
|
||||
<el-color-picker v-model="form.fillColor" show-alpha size="small" />
|
||||
</el-form-item>
|
||||
<el-form-item label="边框宽度:" prop="borderWidth">
|
||||
<el-input-number v-model="form.borderWidth" controls-position="right" :min="0" size="small" />
|
||||
</el-form-item>
|
||||
<el-form-item label="边框色:" prop="strokeColor">
|
||||
<el-color-picker v-model="form.strokeColor" size="small" />
|
||||
</el-form-item>
|
||||
<el-form-item label="X轴坐标:">
|
||||
<el-input-number v-model="form.x" controls-position="right" :min="1" size="small" />
|
||||
</el-form-item>
|
||||
<el-form-item label="Y轴坐标:">
|
||||
<el-input-number v-model="form.y" controls-position="right" :min="1" size="small" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" size="small" @click="onSubmit('form')">{{ buttonText }}</el-button>
|
||||
<el-button v-show="showDeleteButton" size="small" type="danger" @click="deleteDevice">删除</el-button>
|
||||
<el-button v-show="showDeleteButton" size="small" @click="initPage">取消</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import {getUID} from '@/iscs/utils/Uid';
|
||||
export default {
|
||||
name: 'IscsCircle',
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isUpdate: false,
|
||||
buttonText: '立即创建',
|
||||
showDeleteButton: false,
|
||||
form: {
|
||||
code: '',
|
||||
fillColor: '',
|
||||
borderWidth: '',
|
||||
strokeColor: '',
|
||||
radius: 10,
|
||||
x: 10,
|
||||
y: 10
|
||||
},
|
||||
rules: {
|
||||
strokeColor: [
|
||||
{ required: true, message: '请选择边框颜色', trigger: 'change' }
|
||||
],
|
||||
fillColor: [
|
||||
{ required: true, message: '请选择圆填充颜色', trigger: 'change'}
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
computed:{
|
||||
...mapGetters('iscs', [
|
||||
'iscs'
|
||||
])
|
||||
},
|
||||
watch:{
|
||||
'$store.state.iscs.rightClickCount': function (val) {
|
||||
const model = this.$store.getters['iscs/updateDeviceData'];
|
||||
if (model._type === 'IscsCircle' ) {
|
||||
this.buttonText = '修改';
|
||||
this.showDeleteButton = true;
|
||||
this.isUpdate = true;
|
||||
this.form.code = model.code;
|
||||
this.form.fillColor = model.fillColor;
|
||||
this.form.borderWidth = model.borderWidth;
|
||||
this.form.strokeColor = model.strokeColor;
|
||||
this.form.radius = model.radius;
|
||||
this.form.x = model.point.x;
|
||||
this.form.y = model.point.y;
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onSubmit(form) {
|
||||
this.$refs[form].validate((valid) => {
|
||||
if (valid) {
|
||||
const rectModel = {
|
||||
point: {
|
||||
x: this.form.x,
|
||||
y: this.form.y
|
||||
},
|
||||
code: this.isUpdate ? this.form.code : getUID('IscsCircle', this.iscs.iscsCircleList),
|
||||
_type: 'IscsCircle',
|
||||
fillColor: this.form.fillColor,
|
||||
borderWidth: this.form.borderWidth,
|
||||
strokeColor: this.form.strokeColor,
|
||||
radius: this.form.radius
|
||||
};
|
||||
this.$emit('createDataModel', rectModel);
|
||||
this.initPage();
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
deleteDevice() {
|
||||
const rectModel = {
|
||||
point: {
|
||||
x: this.form.x,
|
||||
y: this.form.y
|
||||
},
|
||||
code: this.form.code,
|
||||
_type: 'IscsCircle',
|
||||
fillColor: this.form.fillColor,
|
||||
borderWidth: this.form.borderWidth,
|
||||
strokeColor: this.form.strokeColor,
|
||||
radius: this.form.radius
|
||||
};
|
||||
this.$emit('deleteDataModel', rectModel);
|
||||
},
|
||||
initPage() {
|
||||
this.isUpdate = false;
|
||||
this.buttonText = '立即创建';
|
||||
this.showDeleteButton = false;
|
||||
this.form = {
|
||||
code: '',
|
||||
fillColor: '',
|
||||
borderWidth: '',
|
||||
strokeColor: '',
|
||||
radius: 10,
|
||||
x: 10,
|
||||
y: 10
|
||||
};
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
@import "src/styles/mixin.scss";
|
||||
.button_box{
|
||||
width: 100%;
|
||||
background: #f0f0f0;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
@ -106,7 +106,7 @@ export default {
|
||||
x: this.form.x,
|
||||
y: this.form.y
|
||||
},
|
||||
code: this.isUpdate ? this.form.code : getUID('IscsTriangle', this.iscs.iscsRectList),
|
||||
code: this.isUpdate ? this.form.code : getUID('IscsTriangle', this.iscs.iscsTriangleList),
|
||||
_type: 'IscsTriangle',
|
||||
fillColor: this.form.fillColor,
|
||||
borderWidth: this.form.borderWidth,
|
||||
|
@ -42,7 +42,7 @@
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="扇门" name="ordinaryDoor">
|
||||
<el-tab-pane label="扇门" name="OrdinaryDoor">
|
||||
<ordinary-door
|
||||
ref="ordinaryDoor"
|
||||
style="width: 100%;height: 100%;"
|
||||
@ -50,7 +50,7 @@
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="门禁" name="fuzhouDoor">
|
||||
<el-tab-pane label="门禁" name="FuzhouDoor">
|
||||
<fuzhou-door
|
||||
ref="fuzhouDoor"
|
||||
style="width: 100%;height: 100%;"
|
||||
@ -58,7 +58,7 @@
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="通讯图符" name="communicationButcher">
|
||||
<el-tab-pane label="通讯图符" name="CommunicationButcher">
|
||||
<communication-butcher
|
||||
ref="communication"
|
||||
style="width: 100%;height: 100%;"
|
||||
@ -66,7 +66,7 @@
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="门禁单元" name="afcDoorUnite">
|
||||
<el-tab-pane label="门禁单元" name="AfcDoorUnite">
|
||||
<afc-door-unite
|
||||
ref="afcDoorUnite"
|
||||
style="width: 100%; height: 100%;"
|
||||
@ -106,7 +106,7 @@ export default {
|
||||
],
|
||||
data() {
|
||||
return {
|
||||
enabledTab: 'PlatformScreenDoor',
|
||||
enabledTab: 'IscsButton',
|
||||
data: '',
|
||||
stationCode: ''
|
||||
};
|
||||
|
110
src/views/iscs/iscsDraw/iscsCommonElem/fuzhouPsd.vue
Normal file
110
src/views/iscs/iscsDraw/iscsCommonElem/fuzhouPsd.vue
Normal file
@ -0,0 +1,110 @@
|
||||
<template>
|
||||
<div style="overflow-y: scroll;height: calc(100% - 46px); width: 100%;">
|
||||
<el-form ref="form" :rules="rules" :model="form" label-width="80px" style="width: 100%;padding: 10px 50px;">
|
||||
<el-form-item label="门高:" prop="height">
|
||||
<el-input-number v-model="form.height" controls-position="right" :min="20" size="small" />
|
||||
</el-form-item>
|
||||
<el-form-item label="X轴坐标:">
|
||||
<el-input-number v-model="form.x" controls-position="right" :min="1" size="small" />
|
||||
</el-form-item>
|
||||
<el-form-item label="Y轴坐标:">
|
||||
<el-input-number v-model="form.y" controls-position="right" :min="1" size="small" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" size="small" @click="onSubmit('form')">{{ buttonText }}</el-button>
|
||||
<el-button v-show="showDeleteButton" size="small" type="danger" @click="deleteDevice">删除</el-button>
|
||||
<el-button v-show="showDeleteButton" size="small" @click="initPage">取消</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getUID} from '@/iscs/utils/Uid';
|
||||
import { mapGetters } from 'vuex';
|
||||
export default {
|
||||
name: 'FuzhouPsd',
|
||||
data() {
|
||||
return {
|
||||
form:{
|
||||
code: '',
|
||||
height:30,
|
||||
x: 10,
|
||||
y: 10
|
||||
},
|
||||
rules: {},
|
||||
isUpdate: false,
|
||||
buttonText: '立即创建',
|
||||
showDeleteButton: false
|
||||
};
|
||||
},
|
||||
computed:{
|
||||
...mapGetters('iscs', [
|
||||
'iscs'
|
||||
])
|
||||
},
|
||||
watch:{
|
||||
'$store.state.iscs.rightClickCount': function (val) {
|
||||
const model = this.$store.getters['iscs/updateDeviceData'];
|
||||
if (model._type === 'FuzhouPsd' ) {
|
||||
this.buttonText = '修改';
|
||||
this.showDeleteButton = true;
|
||||
this.isUpdate = true;
|
||||
this.form.code = model.code;
|
||||
this.form.x = model.point.x;
|
||||
this.form.y = model.point.y;
|
||||
this.form.height = model.height;
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onSubmit(form) {
|
||||
this.$refs[form].validate((valid) => {
|
||||
if (valid) {
|
||||
const model = {
|
||||
point: {
|
||||
x: this.form.x,
|
||||
y: this.form.y
|
||||
},
|
||||
code: this.isUpdate ? this.form.code : getUID('FuzhouPsd', this.iscs.fuzhouPsdList),
|
||||
_type: 'FuzhouPsd',
|
||||
height:this.form.height
|
||||
};
|
||||
this.$emit('createDataModel', model);
|
||||
this.initPage();
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
deleteDevice() {
|
||||
const model = {
|
||||
point: {
|
||||
x: this.form.x,
|
||||
y: this.form.y
|
||||
},
|
||||
code: this.form.code,
|
||||
_type: 'FuzhouPsd',
|
||||
height:this.form.height
|
||||
};
|
||||
this.$emit('deleteDataModel', model);
|
||||
},
|
||||
initPage() {
|
||||
this.isUpdate = false;
|
||||
this.buttonText = '立即创建';
|
||||
this.showDeleteButton = false;
|
||||
this.form = {
|
||||
code: '',
|
||||
height:30,
|
||||
x: 10,
|
||||
y: 10
|
||||
};
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
@ -50,9 +50,25 @@
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="屏蔽门" name="FuzhouPsd">
|
||||
<fuzhou-psd
|
||||
ref="fuzhouPsd"
|
||||
style="width: 100%;height: 100%;"
|
||||
@createDataModel="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="三角形" name="IscsTriangle">
|
||||
<iscs-triangle
|
||||
ref="iscsRectText"
|
||||
ref="iscsTriangle"
|
||||
style="width: 100%;height: 100%;"
|
||||
@createDataModel="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="圆形" name="IscsCircle">
|
||||
<iscs-circle
|
||||
ref="iscsCircle"
|
||||
style="width: 100%;height: 100%;"
|
||||
@createDataModel="createDataModel"
|
||||
@deleteDataModel="deleteDataModel"
|
||||
@ -69,8 +85,11 @@ import IscsLine from '../icscComponents/line';
|
||||
import IscsText from '../icscComponents/text';
|
||||
import IscsRect from '../icscComponents/rect';
|
||||
import IscsTriangle from '../icscComponents/triangle';
|
||||
import IscsCircle from '../icscComponents/circle';
|
||||
import IscsButton from '../icscComponents/button';
|
||||
import IscsRectText from '../iscsCommonElem/rectText';
|
||||
import FuzhouPsd from '../iscsCommonElem/fuzhouPsd';
|
||||
|
||||
export default {
|
||||
name: 'IscsOperate',
|
||||
components: {
|
||||
@ -79,7 +98,9 @@ export default {
|
||||
IscsText,
|
||||
IscsButton,
|
||||
IscsRectText,
|
||||
IscsTriangle
|
||||
IscsTriangle,
|
||||
IscsCircle,
|
||||
FuzhouPsd
|
||||
},
|
||||
mixins: [
|
||||
],
|
||||
|
Loading…
Reference in New Issue
Block a user