ISCS调整

This commit is contained in:
fan 2021-04-06 17:48:33 +08:00
parent a8ec3f1d79
commit 9a84b61e5a
10 changed files with 155 additions and 94 deletions

View File

@ -116,6 +116,13 @@ class Iscs {
// loadStyle(lineCode) { // loadStyle(lineCode) {
// return selectLineCode(lineCode); // return selectLineCode(lineCode);
// } // }
hideShowElementType(deviceType, subType) {
for (const val in this.iscsDevice) {
if (this.iscsDevice[val].model._type === deviceType && this.iscsDevice[val].model.type.includes(subType)) {
this.$painter.hideShowElement(this.iscsDevice[val]);
}
}
}
setCenter(deviceCode) { setCenter(deviceCode) {
const device = this.iscsDevice[deviceCode]; const device = this.iscsDevice[deviceCode];

View File

@ -53,7 +53,10 @@ class Painter {
this.add(device); this.add(device);
}); });
} }
/** 视图显影控制 */
hideShowElement(device) {
device.instance.hideShowElement();
}
/** /**
* 添加视图 * 添加视图
* @param {*} device * @param {*} device

View File

@ -112,28 +112,28 @@ export default class Button extends Group {
this.grouper.add(this.textButtonRect); this.grouper.add(this.textButtonRect);
this.grouper.add(this.lineLeftTop); this.grouper.add(this.lineLeftTop);
this.grouper.add(this.lineBottomRight); this.grouper.add(this.lineBottomRight);
if (this.model.function == 'ElementShow') { // if (this.model.function == 'ElementShow') {
this.textButtonRectSmall = new Rect({ // this.textButtonRectSmall = new Rect({
zlevel: model.zlevel, // zlevel: model.zlevel,
z: model.z, // z: model.z,
z2: model.z2 || 0, // z2: model.z2 || 0,
shape: { // shape: {
x: textRect.x - model.levelPadding + 6, // x: textRect.x - model.levelPadding + 6,
y: textRect.y - model.verticalPadding + 6, // y: textRect.y - model.verticalPadding + 6,
width: textRect.width + 2 * model.levelPadding - 12, // width: textRect.width + 2 * model.levelPadding - 12,
height: textRect.height + 2 * model.verticalPadding - 12, // height: textRect.height + 2 * model.verticalPadding - 12,
}, // },
style: { // style: {
lineWidth: model.isTransparent ? 0: 2, // lineWidth: model.isTransparent ? 0: 2,
fill: model.fillColor||'rgba(0,0,0,0)', // fill: model.fillColor||'rgba(0,0,0,0)',
stroke: '#908A90' // stroke: '#908A90'
} // }
}); // });
this.grouper.add(this.textButtonRectSmall); // this.grouper.add(this.textButtonRectSmall);
this.textButtonRect.setStyle({fill: model.fillColor||'#D1C2C2'}); // this.textButtonRect.setStyle({fill: model.fillColor||'#D1C2C2'});
this.lineLeftTop.setStyle({stroke: '#ffffff'}); // this.lineLeftTop.setStyle({stroke: '#ffffff'});
this.lineBottomRight.setStyle({stroke: '#948390'}); // this.lineBottomRight.setStyle({stroke: '#948390'});
} else { // } else {
this.on('mousedown', (e) => { this.on('mousedown', (e) => {
this.textButtonRect.setStyle({fill: model.fillColorActive}); this.textButtonRect.setStyle({fill: model.fillColorActive});
this.lineLeftTop.setStyle({stroke: '#696969'}); this.lineLeftTop.setStyle({stroke: '#696969'});
@ -144,8 +144,7 @@ export default class Button extends Group {
this.lineLeftTop.setStyle({stroke: '#FFFFFF'}); this.lineLeftTop.setStyle({stroke: '#FFFFFF'});
this.lineBottomRight.setStyle({stroke: '#696969'}); this.lineBottomRight.setStyle({stroke: '#696969'});
}); });
} // }
} }
this.grouper.add(this.buttonText); this.grouper.add(this.buttonText);
this.add(this.grouper); this.add(this.grouper);

View File

@ -72,12 +72,12 @@ import fireDamperGreen from '@/assets/iscs_picture/fireDamper_green.png';
import alarmLampRed from '@/assets/iscs_picture/alarmLamp_red.png'; import alarmLampRed from '@/assets/iscs_picture/alarmLamp_red.png';
import alarmLampBlue from '@/assets/iscs_picture/alarmLamp_blue.png'; import alarmLampBlue from '@/assets/iscs_picture/alarmLamp_blue.png';
import alarmLampGreen from '@/assets/iscs_picture/alarmLamp_green.png'; import alarmLampGreen from '@/assets/iscs_picture/alarmLamp_green.png';
import bgStationA from '@/assets/iscs_picture/bg-station-A.png' import bgStationA from '@/assets/iscs_picture/bg-station-A.png';
import bgStationB from '@/assets/iscs_picture/bg-station-B.png' import bgStationB from '@/assets/iscs_picture/bg-station-B.png';
import bgStationC from '@/assets/iscs_picture/bg-station-C.png' import bgStationC from '@/assets/iscs_picture/bg-station-C.png';
import bgStationD from '@/assets/iscs_picture/bg-station-D.png' import bgStationD from '@/assets/iscs_picture/bg-station-D.png';
import bgStationE from '@/assets/iscs_picture/bg-station-E.png' import bgStationE from '@/assets/iscs_picture/bg-station-E.png';
import bgStationF from '@/assets/iscs_picture/bg-station-F.png' import bgStationF from '@/assets/iscs_picture/bg-station-F.png';
import bgDoorStationA from '@/assets/iscs_picture/bg-door-station-A.png'; import bgDoorStationA from '@/assets/iscs_picture/bg-door-station-A.png';
import bgDoorStandA from '@/assets/iscs_picture/bg-door-stand-A.png'; import bgDoorStandA from '@/assets/iscs_picture/bg-door-stand-A.png';
import littleStation from '@/assets/iscs_picture/little-station.png'; import littleStation from '@/assets/iscs_picture/little-station.png';
@ -89,8 +89,8 @@ const pictureObj = {
'psdRight': psdRight, 'psdRight': psdRight,
'APF': iscsAPF, 'APF': iscsAPF,
'envPersonDoor': envPersonDoor, 'envPersonDoor': envPersonDoor,
's': fireBlue, 'alarmButtonBlue': fireBlue,
'a': fireRed, 'alarmButtonRed': fireRed,
hand, hand,
fmBlue, fmBlue,
fmGray, fmGray,
@ -154,16 +154,16 @@ const pictureObj = {
alarmLampRed, alarmLampRed,
alarmLampBlue, alarmLampBlue,
alarmLampGreen, alarmLampGreen,
bgStationA, bgStationA,
bgStationB, bgStationB,
bgStationC, bgStationC,
bgStationD, bgStationD,
bgStationE, bgStationE,
bgStationF, bgStationF,
bgDoorStationA, bgDoorStationA,
bgDoorStandA, bgDoorStandA,
littleStation, littleStation,
littleStand littleStand
}; };
export default class Picture extends Group { export default class Picture extends Group {
constructor(device) { constructor(device) {
@ -220,4 +220,11 @@ export default class Picture extends Group {
rect.y = rect.y + this.model.point.y; rect.y = rect.y + this.model.point.y;
return rect; return rect;
} }
hideShowElement() {
if (this.imageButton && this.imageButton.ignore) {
this.imageButton.show();
} else {
this.imageButton && this.imageButton.hide();
}
}
} }

View File

@ -41,6 +41,7 @@ export default {
}, },
handleSave() { handleSave() {
const data = JSON.stringify(this.$store.state.iscs.iscs); const data = JSON.stringify(this.$store.state.iscs.iscs);
console.log(data, '===');
this.$emit('handleSave', data); this.$emit('handleSave', data);
} }
} }

View File

@ -13,9 +13,9 @@
<el-form-item label="Y轴坐标:" prop="y"> <el-form-item label="Y轴坐标:" prop="y">
<el-input-number v-model="form.y" size="small" controls-position="right" :min="1" /> <el-input-number v-model="form.y" size="small" controls-position="right" :min="1" />
</el-form-item> </el-form-item>
<el-form-item label="是否透明" prop="isTransparent"> <el-form-item label="是否透明" prop="isTransparent">
<el-checkbox v-model="form.isTransparent" size="small" /> <el-checkbox v-model="form.isTransparent" size="small" />
</el-form-item> </el-form-item>
<el-form-item label="按钮文字:" prop="context"> <el-form-item label="按钮文字:" prop="context">
<el-input v-model="form.context" size="small" /> <el-input v-model="form.context" size="small" />
</el-form-item> </el-form-item>
@ -50,6 +50,16 @@
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item v-if="form.function=== 'ElementShow'" label="隐藏元素类型:" prop="hideType">
<el-select v-model="form.hideType" size="small">
<el-option
v-for="item in hideTypeList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" size="small" @click="onSubmit('form')">{{ buttonText }}</el-button> <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" type="danger" @click="deleteDevice">删除</el-button>
@ -90,20 +100,32 @@ export default {
fontSize: 10, fontSize: 10,
x: 10, x: 10,
y: 10, y: 10,
isTransparent: false, isTransparent: false,
context: '', context: '',
function: '', function: '',
textColor: '', textColor: '',
textColorActive: '#000', textColorActive: '#000',
fillColor: 'rgba(0,0,0,0)', fillColor: 'rgba(0,0,0,0)',
fillColorActive: 'rgba(0,0,0,0)' fillColorActive: 'rgba(0,0,0,0)',
hideType: ''
}, },
hideTypeList: [
{ label: '温感器', value: 'alarmLamp' },
{ label: '烟感器', value: 'smokeDetector' },
{ label: '防火阀', value: 'fireDamper' },
{ label: '报警按钮', value: 'alarmButton' }
// { label: '', value: 'zanwu' },
// { label: '', value: '' }
],
rules: { rules: {
context: [ context: [
{ required: true, message: '请填写按钮文字', trigger: 'blur' } { required: true, message: '请填写按钮文字', trigger: 'blur' }
], ],
function: [ function: [
{ required: true, message: '请选择按钮功能', trigger: 'change'} { required: true, message: '请选择按钮功能', trigger: 'change'}
],
hideType: [
{ required: true, message: '请选择显隐元素类型', trigger: 'change' }
] ]
} }
}; };
@ -124,7 +146,7 @@ export default {
this.form.z2 = model.z2; this.form.z2 = model.z2;
this.form.levelPadding = model.levelPadding; this.form.levelPadding = model.levelPadding;
this.form.verticalPadding = model.verticalPadding; this.form.verticalPadding = model.verticalPadding;
this.form.isTransparent = model.isTransparent; this.form.isTransparent = model.isTransparent;
this.form.x = model.point.x; this.form.x = model.point.x;
this.form.y = model.point.y; this.form.y = model.point.y;
this.form.context = model.context; this.form.context = model.context;
@ -134,6 +156,7 @@ export default {
this.form.textColorActive = model.textColorActive || '#000'; this.form.textColorActive = model.textColorActive || '#000';
this.form.fillColor = model.fillColor; this.form.fillColor = model.fillColor;
this.form.fillColorActive = model.fillColorActive; this.form.fillColorActive = model.fillColorActive;
this.hideType = model.hideType;
} }
} }
}, },
@ -143,15 +166,15 @@ export default {
{label: '操作按钮', value: 'OperatingButton'}, {label: '操作按钮', value: 'OperatingButton'},
{label: '门禁站台层', value: 'goToStand'}, {label: '门禁站台层', value: 'goToStand'},
{label: '门禁站厅层', value: 'goToStation'}, {label: '门禁站厅层', value: 'goToStation'},
{label: '火灾报警系统-站厅层A端', value: 'goFireStation-Two'}, {label: '火灾报警系统-站厅层A端', value: 'goFireStation-Two'},
{label: '火灾报警系统-站厅层B端', value: 'goFireStation-Three'}, {label: '火灾报警系统-站厅层B端', value: 'goFireStation-Three'},
{label: '火灾报警系统-站厅层C端', value: 'goFireStation-Four'}, {label: '火灾报警系统-站厅层C端', value: 'goFireStation-Four'},
{label: '火灾报警系统-站厅层D端', value: 'goFireStation-Five'}, {label: '火灾报警系统-站厅层D端', value: 'goFireStation-Five'},
{label: '火灾报警系统-站厅层E端', value: 'goFireStation-Six'}, {label: '火灾报警系统-站厅层E端', value: 'goFireStation-Six'},
{label: '火灾报警系统-站厅层F端', value: 'goFireStation-Seven'}, {label: '火灾报警系统-站厅层F端', value: 'goFireStation-Seven'},
{label: '火灾报警系统-站台层A端', value: 'goFireStand-Two'}, {label: '火灾报警系统-站台层A端', value: 'goFireStand-Two'},
{label: '火灾报警系统-站台层B端', value: 'goFireStand-Three'}, {label: '火灾报警系统-站台层B端', value: 'goFireStand-Three'},
{label: '火灾报警系统-站台层公共区段', value: 'goFireStand-Four'}, {label: '火灾报警系统-站台层公共区段', value: 'goFireStand-Four'},
{label: '元素显隐', value: 'ElementShow'}, {label: '元素显隐', value: 'ElementShow'},
{label: '返回', value: 'GoBack'} {label: '返回', value: 'GoBack'}
]; ];
@ -183,14 +206,15 @@ export default {
z2: this.form.z2, z2: this.form.z2,
levelPadding: this.form.levelPadding, levelPadding: this.form.levelPadding,
verticalPadding: this.form.verticalPadding, verticalPadding: this.form.verticalPadding,
isTransparent: this.form.isTransparent, isTransparent: this.form.isTransparent,
context: this.form.context, context: this.form.context,
function: this.form.function, function: this.form.function,
fontSize: this.form.fontSize, fontSize: this.form.fontSize,
textColor: this.form.textColor, textColor: this.form.textColor,
textColorActive: this.form.textColorActive, textColorActive: this.form.textColorActive,
fillColor: this.form.fillColor, fillColor: this.form.fillColor,
fillColorActive: this.form.fillColorActive fillColorActive: this.form.fillColorActive,
hideType: this.form.hideType
}; };
this.$emit('createDataModel', rectModel); this.$emit('createDataModel', rectModel);
this.initPage(); this.initPage();
@ -209,12 +233,13 @@ export default {
_type: 'IscsButton', _type: 'IscsButton',
levelPadding: this.form.levelPadding, levelPadding: this.form.levelPadding,
verticalPadding: this.form.verticalPadding, verticalPadding: this.form.verticalPadding,
isTransparent: this.form.isTransparent, isTransparent: this.form.isTransparent,
context: this.form.context, context: this.form.context,
function: this.form.function, function: this.form.function,
fontSize: this.form.fontSize, fontSize: this.form.fontSize,
fillColor: this.form.fillColor, fillColor: this.form.fillColor,
fillColorActive: this.form.fillColorActive fillColorActive: this.form.fillColorActive,
hideType: this.form.hideType
}; };
this.$emit('deleteDataModel', rectModel); this.$emit('deleteDataModel', rectModel);
}, },
@ -233,10 +258,11 @@ export default {
context: '', context: '',
function: '', function: '',
textColor: '', textColor: '',
isTransparent: false, isTransparent: false,
textColorActive: '#000', textColorActive: '#000',
fillColor: '', fillColor: '',
fillColorActive: '' fillColorActive: '',
hideType: ''
}; };
} }
} }

View File

@ -60,8 +60,8 @@ export default {
{ name: '车尾', value: 'psdRight' }, { name: '车尾', value: 'psdRight' },
{ name: '车厢', value: 'psdSystem' }, { name: '车厢', value: 'psdSystem' },
{ name: '人防门', value: 'envPersonDoor'}, { name: '人防门', value: 'envPersonDoor'},
{ name: '报警按钮蓝', value: 's'}, { name: '报警按钮蓝', value: 'alarmButtonBlue'},
{ name: '报警按钮红', value: 'a'}, { name: '报警按钮红', value: 'alarmButtonRed'},
{ name: 'APF', value: 'APF'}, { name: 'APF', value: 'APF'},
{ name: '手动阀', value: 'hand'}, { name: '手动阀', value: 'hand'},
{ name: '蓝色-阀门', value: 'fmBlue'}, { name: '蓝色-阀门', value: 'fmBlue'},
@ -132,10 +132,10 @@ export default {
{ name: '站厅D', value: 'bgStationD' }, { name: '站厅D', value: 'bgStationD' },
{ name: '站厅E', value: 'bgStationE' }, { name: '站厅E', value: 'bgStationE' },
{ name: '站厅F', value: 'bgStationF' }, { name: '站厅F', value: 'bgStationF' },
{ name: '门禁站厅A', value: 'bgDoorStationA' }, { name: '门禁站厅A', value: 'bgDoorStationA' },
{ name: '门禁站台A', value: 'bgDoorStandA' }, { name: '门禁站台A', value: 'bgDoorStandA' },
{ name: '小站台', value: 'littleStand' }, { name: '小站台', value: 'littleStand' },
{ name: '小站厅', value: 'littleStation' }, { name: '小站厅', value: 'littleStation' }
], ],
rules: { rules: {

View File

@ -110,6 +110,7 @@ export default {
this.tableShow = !this.tableShow; this.tableShow = !this.tableShow;
}, },
handleSave(data) { handleSave(data) {
const param = { const param = {
graphData: data, graphData: data,
mapId: this.$route.query.mapId, mapId: this.$route.query.mapId,
@ -117,6 +118,7 @@ export default {
totalSystem: this.$route.query.mode, totalSystem: this.$route.query.mode,
userInterface: this.$route.query.part userInterface: this.$route.query.part
}; };
// console.log(data.iscsPictureList, '===');
saveIscsElement(param).then(resp => { saveIscsElement(param).then(resp => {
this.$message.success('ISCS数据保存成功'); this.$message.success('ISCS数据保存成功');
}).catch(() => { }).catch(() => {

View File

@ -42,7 +42,7 @@
@deleteDataModel="deleteDataModel" @deleteDataModel="deleteDataModel"
/> />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="圆形" name="IscsCircle"> <el-tab-pane label="圆形" name="IscsCircle">
<iscs-circle <iscs-circle
ref="iscsCircle" ref="iscsCircle"
style="width: 100%;height: 100%;" style="width: 100%;height: 100%;"
@ -50,7 +50,7 @@
@deleteDataModel="deleteDataModel" @deleteDataModel="deleteDataModel"
/> />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="三角形" name="IscsTriangle"> <el-tab-pane label="三角形" name="IscsTriangle">
<iscs-triangle <iscs-triangle
ref="iscsTriangle" ref="iscsTriangle"
style="width: 100%;height: 100%;" style="width: 100%;height: 100%;"
@ -58,7 +58,7 @@
@deleteDataModel="deleteDataModel" @deleteDataModel="deleteDataModel"
/> />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="图片" name="IscsPicture"> <el-tab-pane label="图片" name="IscsPicture">
<iscs-picture <iscs-picture
ref="iscsPicture" ref="iscsPicture"
style="width: 100%;height: 100%;" style="width: 100%;height: 100%;"
@ -66,7 +66,7 @@
@deleteDataModel="deleteDataModel" @deleteDataModel="deleteDataModel"
/> />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="表格" name="StateTable"> <el-tab-pane label="表格" name="StateTable">
<state-table <state-table
ref="stateTable" ref="stateTable"
style="width: 100%;height: 100%;" style="width: 100%;height: 100%;"
@ -90,18 +90,17 @@ import IscsTriangle from '../icscComponents/triangle';
import IscsPicture from '../icscComponents/picture'; import IscsPicture from '../icscComponents/picture';
import StateTable from '../icscComponents/stateTable'; import StateTable from '../icscComponents/stateTable';
export default { export default {
name: 'IscsOperate', name: 'IscsOperate',
components: { components: {
IscsRect, IscsRect,
IscsLine, IscsLine,
IscsText, IscsText,
IscsButton, IscsButton,
IscsCircle, IscsCircle,
IscsTriangle, IscsTriangle,
IscsPicture, IscsPicture,
StateTable StateTable
}, },
mixins: [ mixins: [
], ],

View File

@ -112,25 +112,42 @@ export default {
mapId: this.$route.query.mapId, mapId: this.$route.query.mapId,
lineCode:'02', lineCode:'02',
noPreLogout:this.$route.query.noPreLogout, noPreLogout:this.$route.query.noPreLogout,
partId: '', partId: ''
}; };
let type = ''; let type = '';
if (em.deviceType == 'IscsButton') { if (em.deviceType == 'IscsButton') {
if (em.deviceModel.function == 'goToStand') { if (em.deviceModel.function == 'goToStand') {
type = 'afcTwo02'; type = 'afcTwo02';
} else if (em.deviceModel.function == 'goToStation') { } else if (em.deviceModel.function == 'goToStation') {
type = 'afcOne02'; type = 'afcOne02';
} else if (em.deviceModel.function.includes('goFireStation-') ) { } else if (em.deviceModel.function.includes('goFireStation-') ) {
type = 'stationHall' type = 'stationHall';
query.partSign = em.deviceModel.function.replace("goFireStation-", ''); query.partSign = em.deviceModel.function.replace('goFireStation-', '');
} else if (em.deviceModel.function.includes('goFireStand-') ) { } else if (em.deviceModel.function.includes('goFireStand-') ) {
type = 'platform' type = 'platform';
query.partSign = em.deviceModel.function.replace("goFireStand-", ''); query.partSign = em.deviceModel.function.replace('goFireStand-', '');
} } else if (em.deviceModel.function === 'ElementShow') {
} type = '';
switch (em.deviceModel.hideType) {
case 'alarmLamp':
this.$iscs.hideShowElementType('IscsPicture', 'alarmLamp');
break;
case 'smokeDetector':
this.$iscs.hideShowElementType('IscsPicture', 'smokeDetector');
break;
case 'fireDamper':
this.$iscs.hideShowElementType('IscsPicture', 'fireDamper');
break;
case 'alarmButton':
this.$iscs.hideShowElementType('IscsPicture', 'alarmButton');
break;
}
this.$router.replace({ path: `/displayIscs/system/stationConfig/${type}`, query: query }); }
if (type) {
this.$router.replace({ path: `/displayIscs/system/stationConfig/${type}`, query: query });
}
}
}, },
// //