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:
lVAL 2021-01-18 15:48:05 +08:00
parent 20880fe1fe
commit 7d61451fa9
11 changed files with 92 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.env.development
View File

@ -19,3 +19,4 @@ VUE_APP_UPLOAD_API = 'https://upload.joylink.club'
# Detail: https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/babel-preset-app/index.js
VUE_CLI_BABEL_TRANSPILE_MODULES = true
VUE_APP_SOURCE_MAP = true

1
.env.production
View File

@ -5,3 +5,4 @@ NODE_ENV = 'production'
VUE_APP_BASE_API = 'https://api.joylink.club/jlcloud'
VUE_APP_VOICE_API = 'https://oss.joylink.club/oss/joylink'
VUE_APP_UPLOAD_API = 'https://upload.joylink.club'
VUE_APP_SOURCE_MAP = false

1
.env.staging
View File

@ -5,3 +5,4 @@ NODE_ENV = 'test'
VUE_APP_BASE_API = 'https://test.joylink.club/jlcloud'
VUE_APP_VOICE_API = 'https://oss.joylink.club/oss/joylink'
VUE_APP_UPLOAD_API = 'https://upload.joylink.club'
VUE_APP_SOURCE_MAP = false

46
src/jmapNew/shape/Responder/index.js
View File

@ -40,16 +40,20 @@ export default class Responder extends Group {
create() {
const model = this.model;
const responderStyle = this.style.Responder || defaultStyle;
const distanceX = responderStyle.distance * Math.cos(model.rotate-90);
const distanceY = responderStyle.distance * Math.sin(model.rotate-90);
const responderStyle = this.style.Responder || defaultStyle;
const radian = -Math.PI / 180 * Number(model.rotate-90);
const distanceX = -responderStyle.distance * Math.cos(radian);
const distanceY = -responderStyle.distance * Math.sin(radian);
const blockWidth = responderStyle.block.width || 5;
const blockHeight = responderStyle.block.height || 12;
const blockStyle = responderStyle.block.mapStyle[model.type] || { fill: '#fff'};
const blockX = model.position.x - blockWidth / 2 - distanceX;
const blockY = model.position.y - blockHeight / 2 - distanceY;
const textX = blockX + model.textOffset.x;
const textY = blockY + model.textOffset.y;
const blockY = model.position.y - blockHeight / 2 - distanceY;
const textRadian = -Math.PI / 180 * Number(180-model.textRotate);
const textDistanceX = model.textOffset.y * Math.sin(textRadian) + model.textOffset.x * Math.cos(textRadian);
const textDistanceY = model.textOffset.y * Math.cos(textRadian) - model.textOffset.x * Math.sin(textRadian);
const textX = blockX + textDistanceX + blockWidth;
const textY = blockY + textDistanceY;
const textName = `${model.type}-${model.name}`;
const textFill = responderStyle.text.textFill;
const origin = [model.position.x, model.position.y];
@ -100,29 +104,29 @@ export default class Responder extends Group {
}
});
this.text = new Text({
zlevel: this.zlevel,
z: this.z + 1,
style: {
x: textX,
y: textY,
text: textName,
fontFamily: this.style.fontFamily,
fontSize: this.style.fontSize,
textFill: textFill,
textAlign: 'right'
}
});
this.text = this.name = new Text({
zlevel: this.zlevel,
z: this.z + 1,
style: {
x: textX,
y: textY,
text: textName,
fontFamily: this.style.fontFamily,
fontSize: this.style.fontSize,
textFill: textFill,
textAlign: 'left'
}
});
if (model.rotate) {
const rotation = -Math.PI / 180 * Number(model.rotate);
const rotation = -Math.PI / 180 * Number(model.rotate+180);
[this.block, this.delta1, this.delta2].forEach(el => {
this.transformRotation(el, origin, rotation);
});
}
if (model.textRotate) {
const rotation = -Math.PI / 180 * Number(model.textRotate);
const rotation = -Math.PI / 180 * Number(model.textRotate+180);
this.transformRotation(this.text, origin, rotation);
}

28
src/scripts/ConstDic.js
View File

@ -1,12 +1,11 @@
// /**
// * 真实设备类型
// */
// export const RealDeviceType = {
// Section: '区段',
// Switch: '道岔',
// Signal: '信号机',
// ScreenDoor: '屏蔽门'
// };
/**
* 鼠标事件
*/
export const MouseEvent = {
Left: 1,
Right: 2,
Wheel: 3
}
/**
* 权限类型
*/
@ -60,14 +59,6 @@ export const OperateMode = {
DIRECTIVE: '03'
};
// /**
// * 分发、转赠
// */
// export const OperatorModel = {
// DISTRIBUTE: '01',
// TRANSFER: '02'
// };
/**
* 菜单编号
*/
@ -128,6 +119,7 @@ export const IbpOperation = {
XXYS: {operate: '09', event: 'XXYS', name: '下行钥匙'},
SXYS: {operate: '11', event: 'SXYS', name: '上行钥匙'}
};
/**
* ibp状态显示条件
*/
@ -136,12 +128,14 @@ export const IbpShowCondition = {
Show_Open_Screen_Door: {statusKey: 'screenDoorOpenStatus', statusValue:['02'], defaultStatus: 'close'},
Show_Close_Screen_Door: {statusKey: 'screenDoorOpenStatus', statusValue: ['01'], defaultStatus: 'open'}
};
/** 列车类型 */
export const TrainType = {
PLAN: '计划车',
HEAD: '头码车',
MANUAL: '人工车'
};
/** 仿真成员类型 */
export const SimulationType = {
DISPATCHER: '行调',

32
src/views/newMap/mapsystemNew/common/index.vue
View File

@ -8,7 +8,7 @@
<script>
import { mapGetters } from 'vuex';
import { getDeviceMenuByDeviceType } from '@/scripts/ConstDic';
import { getDeviceMenuByDeviceType, MouseEvent } from '@/scripts/ConstDic';
import { OperationEvent } from '@/scripts/cmdPlugin/OperationHandler';
import deviceType from '@/jmapNew/constant/deviceType.js';
import JlmapVisual from '@/views/newMap/jlmapNew/index';
@ -80,22 +80,17 @@ export default {
if (section) {
device = this.$store.getters['map/getDeviceByCode'](section.relSwitchCode);
}
}
if (device._type == 'Section' && device.type == '03') { // 过滤道岔相关区段变成道岔model
}
// 过滤道岔相关区段变成道岔model
if (device._type == 'Section' && device.type == '03') {
device = this.$store.getters['map/getDeviceByCode'](device.switch.code);
}
// if (device._type == 'Section' && device.type == '04') {
// device = null;
// }
return device;
},
clickEvent(em) {
var device = { _type: em.deviceType, _code: em.deviceCode };
// var CanClickDeviceList = [
// deviceType.Switch,
// deviceType.Signal,
// deviceType.StationStand
// ];
var device = { _type: em.deviceType, _code: em.deviceCode, _event: MouseEvent.Left };
const lineCode = this.$store.getters['map/lineCode'];
if (em.deviceType === 'StationStand' && lineCode === '01') {
@ -105,16 +100,9 @@ export default {
if (em.deviceCode) {
device = this.getDeviceByEm(em);
// if (CanClickDeviceList.includes(em.deviceType)) {
// try {
// // letfMouseSelectDevice(em.deviceCode, this.group);
// } catch (error) {
// console.log('send left mouse click error.');
// }
// }
}
this.selected = { ...device };
this.selected = { ...device, _event: MouseEvent.Left };
this.$store.dispatch('menuOperation/setSelected', {device: device, subType: em.subType});
this.$store.dispatch('menuOperation/setLeftClickCount');
if (this.$route.query.lineCode == '07' || this.$route.query.lineCode == '14') {
@ -139,7 +127,7 @@ export default {
const lineCode = this.$store.getters['map/lineCode'];
if (em.subType === 'TrainWindow') {
if (lineCode != '06') {
device = { _type: deviceType.TrainWindow, code: em.deviceCode };
device = { _type: deviceType.TrainWindow, code: em.deviceCode, _event: MouseEvent.Right };
this.$store.dispatch('map/setTrainWindowShow', true);
}
} else if (em.subType == 'button' && em.deviceType == 'Station') { // 宁波一号线右键显示控制模式
@ -162,7 +150,7 @@ export default {
}
if (device) {
device = this.getSelectedByLineCode(device);
this.selected = device;
this.selected = { ...device, _event: MouseEvent.Right};
if (!this.buttonOperation) {
this.$store.dispatch('menuOperation/setSelected', {device: device, subType: em.subType});
if (!this.checkShouldPop(device)) {

32
src/views/newMap/newMapdraft/mapoperate/responder/responderBatch.vue
View File

@ -125,14 +125,36 @@ export default {
sectionCode: '',
signalCode: '',
type: '',
name: ''
name: ''
});
},
doBatchCreate() {
const models = this.addModel.modelList.map(el => {
const section = this.$store.getters['map/getDeviceByCode'](el.sectionCode);
return utils.buildModelBySection(section, el, this.responderList);
});
const groupMap = {}
const models = [];
// 分组
this.addModel.modelList.forEach(el => {
if (!groupMap[el.sectionCode]) {
groupMap[el.sectionCode] = []
}
groupMap[el.sectionCode].push(el);
})
// 偏移量计算
Object.keys(groupMap).forEach(code => {
const section = this.$store.getters['map/getDeviceByCode'](code);
const list = groupMap[code];
const length = list.length;
const ox = (section.points[length - 1].x - section.points[0].x) / (length+1);
const oy = (section.points[length - 1].y - section.points[0].y) / (length+1);
list.forEach((el,i) => {
const x = section.points[0].x + ox*(i+1);
const y = section.points[0].y + oy*(i+1);
models.push(utils.buildModelBySection(section, {x, y}, el, this.responderList));
});
})
// 批量创建
this.$emit('updateMapModel', models);
},
doBatchReset() {

13
src/views/newMap/newMapdraft/mapoperate/responder/responderCreate.vue
View File

@ -83,9 +83,9 @@ export default {
name:'',
item: [
{ prop: 'name', label: '应答器名称', type: 'input' },
{ prop: 'type', label: `应答器类型`, type: 'select', optionLabel: 'name', optionValue: 'value', options: this.responderTypeList },
{ prop: 'sectionCode', label: '关联区段', type: 'selectHover', optionLabel: 'code', optionValue: 'code', options: this.sectionList, buttonType: 'RelSectionCode', hover: this.hover, buttonShowType: this.isSectionButtonType },
{ prop: 'signalCode', label: '关联信号机', type: 'selectHover', optionLabel: 'code', optionValue: 'code', options: this.signalList, buttonType: 'RelSignalCode', hover: this.hover, buttonShowType: this.isSignalButtonType },
{ prop: 'type', label: `应答器类型`, type: 'select', optionLabel: 'name&&value', optionValue: 'value', options: this.responderTypeList },
{ prop: 'sectionCode', label: '关联区段', type: 'selectHover', optionLabel: 'name&&code', optionValue: 'code', options: this.sectionList, buttonType: 'RelSectionCode', hover: this.hover, buttonShowType: this.isSectionButtonType },
{ prop: 'signalCode', label: '关联信号机', type: 'selectHover', optionLabel: 'name&&code', optionValue: 'code', options: this.signalList, buttonType: 'RelSignalCode', hover: this.hover, buttonShowType: this.isSignalButtonType },
]
}
}
@ -101,8 +101,11 @@ export default {
this.addModel[prop] = selected.code;
},
create() {
const section = this.$store.getters['map/getDeviceByCode'](this.addModel.sectionCode);
const model = utils.buildModelBySection(section, this.addModel, this.responderList);
const section = this.$store.getters['map/getDeviceByCode'](this.addModel.sectionCode);
const length = section.points.length;
const x = (section.points[length - 1].x + section.points[0].x) / 2;
const y = (section.points[length - 1].y + section.points[0].y) / 2;
const model = utils.buildModelBySection(section, {x, y}, this.addModel, this.responderList);
this.$refs.createForm.resetForm();
this.$emit('updateMapModel', model);
}

8
src/views/newMap/newMapdraft/mapoperate/responder/responderModel.vue
View File

@ -130,9 +130,9 @@ export default {
draw: {
name: this.$t('map.drawData'),
item: [
{ prop: 'code', label: '应答器编码', type: 'select', optionLabel: 'code', optionValue: 'code', options: this.responderList, deviceChange: this.deviceChange },
{ prop: 'code', label: '应答器编码', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.responderList, deviceChange: this.deviceChange },
{ prop: 'name', label: '应答器名称', type: 'input' },
{ prop: 'type', label: `应答器类型`, type: 'select', optionLabel: 'name', optionValue: 'value', options: this.responderTypeList },
{ prop: 'type', label: `应答器类型`, type: 'select', optionLabel: 'name&&value', optionValue: 'value', options: this.responderTypeList },
{ prop: 'offset', label: '区段偏移值', type: 'number' },
{ prop: 'position', label: '坐标', type: 'coordinate', width: '120px', children: [
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '25px', disabled: false },
@ -144,8 +144,8 @@ export default {
{ prop: 'textOffset.y', firstLevel: 'textOffset', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '25px', disabled: false }
] },
{ prop:'textRotate', label: '文字旋转', type: 'number' },
{ prop: 'sectionCode', label: '关联区段', type: 'selectHover', optionLabel: 'code', optionValue: 'code', options: this.sectionList, buttonType: 'RelModelSectionCode', hover: this.hover, buttonShowType: this.isSectionButtonType },
{ prop: 'signalCode', label: '关联信号机', type: 'selectHover', optionLabel: 'code', optionValue: 'code', options: this.signalList, buttonType: 'RelModelSignalCode', hover: this.hover, buttonShowType: this.isSignalButtonType },
{ prop: 'sectionCode', label: '关联区段', type: 'selectHover', optionLabel: 'name&&code', optionValue: 'code', options: this.sectionList, buttonType: 'RelModelSectionCode', hover: this.hover, buttonShowType: this.isSectionButtonType },
{ prop: 'signalCode', label: '关联信号机', type: 'selectHover', optionLabel: 'name&&code', optionValue: 'code', options: this.signalList, buttonType: 'RelModelSignalCode', hover: this.hover, buttonShowType: this.isSignalButtonType },
{ prop: 'stationCode', label: '关联集中站' + ':', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.centralizedStationList }
]
},

8
src/views/newMap/newMapdraft/mapoperate/responder/utils.js
View File

@ -1,13 +1,11 @@
import { getUID } from '@/jmapNew/utils/Uid';
export function buildModelBySection(section, model, list) {
export function buildModelBySection(section, position, model, list) {
if (section) {
const length = section.points.length;
const dx = (section.points[length - 1].x - section.points[0].x);
const dy = (section.points[length - 1].y - section.points[0].y);
const rotate = Math.atan2(dy, dx) * 180 / Math.PI;
const vx = (section.points[length - 1].x + section.points[0].x) / 2;
const vy = (section.points[length - 1].y + section.points[0].y) / 2;
return {
_type: 'Responder',
@ -15,8 +13,8 @@ export function buildModelBySection(section, model, list) {
rotate: rotate + 90,
textRotate: rotate + 90,
position: {
x: vx,
y: vy
x: position.x,
y: position.y
},
textOffset: {
x: 0,

2
vue.config.js
View File

@ -32,7 +32,7 @@ module.exports = {
outputDir: outputDir,
assetsDir: 'static', // 相对于outputDir的静态资源(js、css、img、fonts)目录
lintOnSave: false,
productionSourceMap: false, // 项目打包后是否压缩
productionSourceMap: process.env.VUE_APP_SOURCE_MAP,
devServer: {
port: port,
host: '0.0.0.0',