import Group from 'zrender/src/container/Group'; import Text from 'zrender/src/graphic/Text'; import Rect from 'zrender/src/graphic/shape/Rect'; // import Vue from 'vue'; import store from '@/store'; class EMouse extends Group { constructor(device, code) { super(); this.device = device; this.code = code; this.create(); } create() { if (this.device.name) { const rect = this.device.name.getBoundingRect(); if (!this.device.isSwitchSection) { this.sectionTextBorder = new Rect({ zlevel: this.device.zlevel, z: this.device.z + 4, shape: rect, style: { lineDash: [3, 3], stroke: '#fff', // 白色 fill: this.device.model.sectionType == '02' ? this.device.style.Section.line.logicalColor : '#00FFFF' // 蓝色 } }); this.add(this.sectionTextBorder); this.sectionTextBorder.hide(); } const fontSize = this.device.model.type == '02' ? this.device.style.Section.text.fontSize + 2 : this.device.style.Section.text.fontSize; this.TextName = new Text({ zlevel: this.device.zlevel, z: this.device.z + 4, style: { x: rect.x + (rect.width / 2), y: rect.y + (rect.height / 2), fontWeight: 'normal', fontSize: fontSize, fontFamily: this.device.style.fontFamily, text: this.device.model.name, textFill: '#000', textAlign: this.device.style.Section.text.textAlign, textPosition: this.device.style.Section.text.textPosition || 'inside', textVerticalAlign: this.device.style.Section.text.textVerticalAlign || null } }); this.add(this.TextName); this.TextName.hide(); this.sectionTextShadow = new Text({ zlevel: this.zlevel + 3, z: 5, position: [4, -2], silent: true, style: { x: rect.x + (rect.width / 2), y: rect.y + (rect.height / 2), text: this.device.model.name, textFill: this.device.style.Section.mouseOverStyle.textShadowColor, // 黄色 textAlign: 'middle', textVerticalAlign: 'top', textFont: 'bold ' + (fontSize + 1) + 'px ' + this.device.style.fontFamily } }); this.add(this.sectionTextShadow); this.sectionTextShadow.hide(); } if (this.device.section) { const rect = this.device.section.getBoundingRect(); this.lineBorder = new Rect({ zlevel: this.device.zlevel, z: this.device.z - 1, shape: rect, style: { lineDash: [3, 3], stroke: this.device.style.Section.mouseOverStyle.borderColor, fill: this.device.style.transparentColor } }); this.add(this.lineBorder); this.lineBorder.hide(); } } getInstanceByCode(code) { return (store.getters['map/getDeviceByCode'](code) || {}).instance; } mouseover(e) { if (this.device.model.isSwitchSection && this.device.model.relSwitchCode) { const instance = this.getInstanceByCode(this.device.model.relSwitchCode); if (instance && instance.mouseEvent && instance.mouseEvent.mouseover) { instance.mouseEvent.mouseover(e); } } else { this.TextName && this.TextName.show(); this.sectionTextBorder && this.sectionTextBorder.show(); this.lineBorder && this.lineBorder.show(); const instance = this.getInstanceByCode(this.device.model.trainWindowCode); if (instance && instance.mouseEvent && instance.mouseEvent.mouseEnter) { instance.mouseEvent.mouseEnter(e); } } } mouseout(e) { if (!this.device.model.down) { this.sectionTextShadow && this.sectionTextShadow.hide(); if (this.device.model.isSwitchSection && this.device.model.relSwitchCode) { const instance = this.getInstanceByCode(this.device.model.relSwitchCode); if (instance && instance.mouseEvent && instance.mouseEvent.mouseout) { instance.mouseEvent.mouseout(e); } } else { this.TextName && this.TextName.hide(); this.sectionTextBorder && this.sectionTextBorder.hide(); this.lineBorder && this.lineBorder.hide(); const instance = this.getInstanceByCode(this.device.model.trainWindowCode); if (instance && instance.mouseEvent && instance.mouseEvent.mouseLeave) { instance.mouseEvent.mouseLeave(e); } } } } mouseEnter(e) { this.TextName && this.TextName.show(); this.sectionTextBorder && this.sectionTextBorder.show(); this.lineBorder && this.lineBorder.show(); if (this.device.model.isSwitchSection && this.device.model.relSwitchCode) { const instance = this.getInstanceByCode(this.device.model.relSwitchCode); if (instance && instance.mouseEvent && instance.mouseEvent.mouseEnter) { instance.mouseEvent.mouseEnter(e); } } } mouseLeave(e) { this.TextName && this.TextName.hide(); this.sectionTextBorder && this.sectionTextBorder.hide(); this.lineBorder && this.lineBorder.hide(); if (this.device.model.isSwitchSection && this.device.model.relSwitchCode) { const instance = this.getInstanceByCode(this.device.model.relSwitchCode); if (instance && instance.mouseEvent && instance.mouseEvent.mouseLeave) { instance.mouseEvent.mouseLeave(e); } } } } export default EMouse;