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

iscs调整

Browse Source
This commit is contained in:
fan 2020-06-02 16:12:34 +08:00
parent 013596a502
commit e473199e24
11 changed files with 485 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -242,5 +242,10 @@ deviceRender[deviceType.StateTable] = {
zlevel: 1,
z: 5
};
/** 照明组 */
deviceRender[deviceType.LightingGroup] = {
_type: deviceType.LightingGroup,
zlevel: 1,
z: 5
};
export default deviceRender;

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

@ -36,7 +36,8 @@ const deviceType = {
SingleStaircase: 'SingleStaircase',
ArcStatus: 'ArcStatus',
IscsButton: 'IscsButton',
StateTable: 'StateTable'
StateTable: 'StateTable',
LightingGroup: 'LightingGroup'
};
export default deviceType;

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

File diff suppressed because one or more lines are too long

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

@ -37,6 +37,7 @@ import ArcStatus from './ArcStatus';
import IscsButton from './button';
import SmookExhaustFd from './bas/smookExhaustFd';
import StateTable from './stateTable';
import LightingGroup from './lighting';
const iscsShape = {};
iscsShape[deviceType.ManualAlarmButton] = ManualAlarmButton;
@ -78,6 +79,7 @@ iscsShape[deviceType.SingleStaircase] = SingleStaircase;
iscsShape[deviceType.ArcStatus] = ArcStatus;
iscsShape[deviceType.IscsButton] = IscsButton;
iscsShape[deviceType.StateTable] = StateTable;
iscsShape[deviceType.LightingGroup] = LightingGroup;
function shapefactory(device, iscs) {
const type = device.model._type;

186
src/iscs/shape/lighting.js Normal file
View File

@ -0,0 +1,186 @@
import Group from 'zrender/src/container/Group';
import Circle from 'zrender/src/graphic/shape/Circle';
import Line from 'zrender/src/graphic/shape/Line';
import Text from 'zrender/src/graphic/Text';
import Rect from 'zrender/src/graphic/shape/Rect';
export default class lighting 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.outsideRect = new Rect({
zlevel: this.zlevel,
z: this.z,
shape: {
x: 0,
y: 0,
width: model.width,
height: model.height
},
style: {
lineWidth: 2,
fill: 'rgba(0,0,0,0)',
stroke: '#4CCDE4'
}
});
this.grouper.add(this.outsideRect);
this.verticalLine = new Line({
zlevel: this.zlevel,
z: this.z,
shape: {
x1: model.width * 2 / 5,
y1: 0,
x2: model.width * 2 / 5,
y2: model.height
},
style: {
lineWidth: 2,
stroke: '#4CCDE4'
}
});
this.grouper.add(this.verticalLine);
this.horizontalLine = new Line({
zlevel: this.zlevel,
z: this.z,
shape: {
x1: model.width * 2 / 5,
y1: model.height / 2,
x2: model.width,
y2: model.height / 2
},
style: {
lineWidth: 2,
stroke: '#4CCDE4'
}
});
this.grouper.add(this.horizontalLine);
this.insideCircle = new Circle({
zlevel: this.zlevel,
z: this.z + 1,
shape: {
cx: model.width / 5,
cy: model.height / 2,
r: model.width / 10
},
style: {
lineWidth: 1,
fill: 'rgba(0,0,0,0)',
stroke: '#0F0'
}
});
this.grouper.add(this.insideCircle);
this.topCircle = new Circle({
zlevel: this.zlevel,
z: this.z + 2,
shape: {
cx: model.width / 5,
cy: model.height / 2,
r: model.width / 10
},
style: {
fill: '#45607B'
}
});
this.grouper.add(this.topCircle);
this.underlyingRect = new Rect({
zlevel: this.zlevel,
z: this.z + 1,
shape: {
x: model.width * 7 / 40,
y: model.height / 2 - model.width / 5,
width: model.width / 20,
height: model.width / 5
},
style: {
lineWidth: 1,
fill: 'rgba(0,0,0,0)',
stroke: '#0F0'
}
});
this.grouper.add(this.underlyingRect);
this.topRect = new Rect({
zlevel: this.zlevel,
z: this.z + 2,
shape: {
x: model.width * 7 / 40,
y: model.height / 2 - model.width / 5,
width: model.width / 20,
height: model.width / 5
},
style: {
fill: '#45607B'
}
});
this.grouper.add(this.topRect);
this.lines = [];
for (let i = 0; i < 7; i++) {
const lightingLine = new Line({
zlevel: this.zlevel,
z: this.z,
shape: {
x1: model.width / 5 + Math.cos(Math.PI / 6 * i) * (model.width / 10 + 2),
y1: model.height / 2 + Math.sin(Math.PI / 6 * i) * (model.width / 10 + 2),
x2: model.width / 5 + Math.cos( Math.PI / 6 * i) * (model.width / 5),
y2: model.height / 2 + Math.sin(Math.PI / 6 * i) * (model.width / 5)
},
style: {
lineWidth: 1,
stroke: '#0F0'
}
});
this.grouper.add(lightingLine);
this.lines.push(lightingLine);
}
this.topText = new Text({
zlevel: this.zlevel,
z: this.z,
style: {
x: model.width * 7 / 10,
y: model.height / 4,
fontSize: model.topFontSize,
fontFamily: 'consolas',
text: model.topContext,
textFill: model.topTextFill,
textAlign: 'center',
textPosition: 'inside',
textVerticalAlign: 'middle',
textLineHeight: model.topFontSize
}
});
this.grouper.add(this.topText);
this.bottomText = new Text({
zlevel: this.zlevel,
z: this.z,
style: {
x: model.width * 7 / 10,
y: model.height * 3 / 4,
fontSize: model.bottomFontSize,
fontFamily: 'consolas',
text: model.bottomContext,
textFill: model.bottomTextFill,
textAlign: 'center',
textPosition: 'inside',
textVerticalAlign: 'middle',
textLineHeight: model.bottomFontSize
}
});
this.grouper.add(this.bottomText);
this.add(this.grouper);
}
setModel(dx, dy) {
this.model.point.x += dx;
this.model.point.y += dy;
}
}

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

@ -157,6 +157,9 @@ export function parser(data) {
zrUtil.each(data.stateTableList || [], elem=> {
iscsDevice[elem.code] = deviceFactory(deviceType.StateTable, elem);
});
zrUtil.each( data.lightingGroupList || [], elem=> {
iscsDevice[elem.code] = deviceFactory(deviceType.LightingGroup, elem);
});
}
return iscsDevice;
@ -293,6 +296,9 @@ export function updateIscsData(state, device) {
case deviceType.StateTable:
updateIscsListByDevice(state, 'stateTableList', device);
break;
case deviceType.LightingGroup:
updateIscsListByDevice(state, 'lightingGroupList', device);
break;
}
// store.dispatch('iscs/setIscsData', state.iscs);
}

6
src/views/iscs/iscsDesign/demonList.vue
View File

@ -133,6 +133,12 @@ export default {
mode: 'bas',
id: '23',
type: 'interface'
},
{
name: '照明',
mode: 'bas',
id: '24',
type: 'interface'
}
]
},

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

@ -107,6 +107,14 @@
@deleteDataModel="deleteDataModel"
/>
</el-tab-pane>
<el-tab-pane label="照明组" name="LightingGroup">
<lighting-group
ref="lightingGroup"
style="width: 100%;height: 100%;"
@createDataModel="createDataModel"
@deleteDataModel="deleteDataModel"
/>
</el-tab-pane>
<el-tab-pane label="按钮" name="IscsButton">
<iscs-button
ref="iscsButton"
@ -162,6 +170,7 @@ import IscsLine from '../iscsCommonElem/line';
import IscsText from '../iscsCommonElem/text';
import IscsRect from '../iscsCommonElem/rect';
import SmookExhaustFd from './smookExhaustFd';
import LightingGroup from './lightingGroup';
export default {
name: 'IscsOperate',
@ -181,7 +190,8 @@ export default {
IscsButton,
IscsText,
IscsRect,
IscsLine
IscsLine,
LightingGroup
},
mixins: [
],
@ -218,5 +228,66 @@ export default {
};
</script>
<style lang="scss" scoped>
.map-control {
float: right;
width: 100%;
height: 100%;
.border-card{
height: 100%;
}
}
.mapEdit{
height: calc(100% - 47px);
.tab_pane_box{
height: 100%;
}
}
/deep/ .el-card__body{
height:100%;
}
/deep/ {
.mapEdit .el-tabs__nav-wrap.is-scrollable {
padding: 0 20px;
}
.mapEdit .el-tabs__header .el-tabs__item.is-active {
border-bottom-color: #f5f7fa;
background: #f5f7fa;
}
.mapEdit .el-tabs__active-bar{
background: transparent;
}
.mapEdit .el-tabs__content {
height: calc(100% - 56px);
}
.mapEdit .el-tab-pane {
height: 100%;
}
.card .el-tabs__nav .el-tabs__item.is-active {
border-bottom: 2px solid #E4E7ED;
background: #409eff;
color: #fff;
}
.card .el-tabs__nav .el-tabs__item{
padding: 0 20px!important;
}
.mapEdit .el-tabs__nav-prev {
width: 20px;
height: 41px;
display: flex;
justify-content: center;
align-items: center;
box-shadow: 1px 1px 4px #ccc;
}
.mapEdit .el-tabs__nav-next {
width: 20px;
height: 41px;
display: flex;
justify-content: center;
align-items: center;
box-shadow: 1px 1px 4px #ccc;
}
}
.heightClass{height:100%;}
</style>

200
src/views/iscs/iscsDraw/iscsBasOperate/lightingGroup.vue Normal file
View File

@ -0,0 +1,200 @@
<template>
<div style="overflow-y: scroll;height: calc(100% - 46px);">
<el-form ref="form" :rules="rules" :model="form" label-width="120px">
<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="1" />
</el-form-item>
<el-form-item label="高度:" prop="height">
<el-input-number v-model="form.height" :min="1" />
</el-form-item>
<el-form-item label="顶部文字内容:" prop="topContext">
<el-input v-model="form.topContext" type="textarea" :rows="2" />
</el-form-item>
<el-form-item label="顶部字体大小:" prop="topFontSize">
<el-input-number v-model="form.topFontSize" :min="1" />
</el-form-item>
<el-form-item label="顶部字体颜色:" prop="topTextFill">
<el-color-picker v-model="form.topTextFill" />
</el-form-item>
<el-form-item label="底部文字内容:" prop="bottomContext">
<el-input v-model="form.bottomContext" type="textarea" :row="2" />
</el-form-item>
<el-form-item label="底部字体大小:" prop="bottomFontSize">
<el-input-number v-model="form.bottomFontSize" :min="1" />
</el-form-item>
<el-form-item label="底部字体颜色:" prop="bottomTextFill">
<el-color-picker v-model="form.bottomTextFill" />
</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: 110,
height: 60,
topContext: '',
topFontSize: 10,
topTextFill: '#B4AF5B',
bottomContext: '',
bottomFontSize: 18,
bottomTextFill: '#FFFFFF',
x: 10,
y: 10
},
rules: {
width:[
{ required: true, message:'请输入设备图形宽度', trigger: 'blur' }
],
height: [
{ required: true, message: '请输入设备图形高度', trigger: 'blur'}
],
topContext: [
{ required: true, message: '请输入顶部文字内容', trigger: 'blur'}
],
topFontSize: [
{required: true, message: '请输入顶部字体大小', trigger: 'blur'}
],
topTextFill: [
{required: true, message: '请输入顶部字体颜色', trigger: 'blur'}
],
bottomContext: [
{required: true, message: '请输入底部文字内容', trigger: 'blur'}
],
bottomFontSize: [
{required: true, message: '请输入底部字体大小', trigger: 'blur'}
],
bottomTextFill: [
{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 === 'LightingGroup' ) {
this.buttonText = '修改';
this.showDeleteButton = true;
this.isUpdate = true;
this.form.code = model.code;
this.form.width = model.width;
this.form.x = model.point.x;
this.form.y = model.point.y;
this.form.height = model.height;
this.form.topContext = model.topContext;
this.form.topFontSize = model.topFontSize;
this.form.topTextFill = model.topTextFill;
this.form.bottomContext = model.bottomContext;
this.form.bottomFontSize = model.bottomFontSize;
this.form.bottomTextFill = model.bottomTextFill;
}
}
},
mounted() {
},
methods:{
onSubmit(form) {
this.$refs[form].validate((valid) => {
if (valid) {
const airConditionerModel = {
point: {
x: this.form.x,
y: this.form.y
},
_type: 'LightingGroup',
code: this.isUpdate ? this.form.code : getUID('LightingGroup', this.iscs.lightingGroupList),
width: this.form.width,
height:this.form.height,
topContext: this.form.topContext,
topFontSize: this.form.topFontSize,
topTextFill: this.form.topTextFill,
bottomContext: this.form.bottomContext,
bottomFontSize: this.form.bottomFontSize,
bottomTextFill: this.form.bottomTextFill
};
this.$emit('createDataModel', airConditionerModel);
this.initPage();
} else {
return false;
}
});
},
initPage() {
this.isUpdate = false;
this.buttonText = '立即创建';
this.showDeleteButton = false;
this.form = {
code:'',
width: 110,
height: 60,
topContext: '',
topFontSize: 10,
topTextFill: '#B4AF5B',
bottomContext: '',
bottomFontSize: 18,
bottomTextFill: '#FFFFFF',
x: 10,
y: 10
};
this.$refs.form.resetFields();
},
deleteDevice() {
const lightingGroupModel = {
point: {
x: this.form.x,
y: this.form.y
},
_type: 'LightingGroup',
code: this.form.code,
width: this.form.width,
height:this.form.height,
topContext: this.form.topContext,
topFontSize: this.form.topFontSize,
topTextFill: this.form.topTextFill,
bottomContext: this.form.bottomContext,
bottomFontSize: this.form.bottomFontSize,
bottomTextFill: this.form.bottomTextFill
};
this.$emit('deleteDataModel', lightingGroupModel );
this.initPage();
}
}
};
</script>

3
src/views/iscs/iscsDraw/iscsCommonElem/button.vue
View File

@ -56,7 +56,8 @@ export default {
functionList: [
{label: '图元说明', value: 'GraphicEle'},
{label: '公共区域', value: 'PublicArea'},
{label: '返回', value: 'GoBack'}
{label: '返回', value: 'GoBack'},
{label: '至EPS系统及导向照明', value: 'GoEPS'}
],
form: {
code: '',

4
src/views/iscs/iscsSystem/config/fire-alarm/stand.vue
View File

@ -21,10 +21,10 @@ export default {
watch: {
'$store.state.iscs.selectedCount': function() {
const device = this.$store.state.iscs.selected;
if (device._type === 'IscsButton' && device.function === 'PublicArea') {
if (device && device._type === 'IscsButton' && device.function === 'PublicArea') {
this.width = 1520;
this.$refs.iscsPlate.show('12');
} else if (device._type === 'IscsButton' && device.function === 'GoBack') {
} else if (device && device._type === 'IscsButton' && device.function === 'GoBack') {
this.width = 1100;
this.$refs.iscsPlate.show('14');
}