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

Merge branch 'test' of https://git.code.tencent.com/lian-cbtc/jl-client into test

Browse Source
This commit is contained in:
fan 2020-10-22 16:47:29 +08:00
commit 1fce4cb363
12 changed files with 319 additions and 286 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/api/rpTools.js
View File

@ -152,7 +152,7 @@ export function justTripNoStop(tripNo, data) {
/**
* 修改折返时间
*/
export function justTripTurnBack(tripNo, data) {
export function justTripTurnback(tripNo, data) {
return request({
url: `/api/rpTools/${tripNo}/turnBack`,
method: 'put',

20
src/jmapNew/config/skinCode/race_01.js
View File

@ -638,7 +638,7 @@ class SkinCode extends defaultStyle {
this[deviceType.Train] = {
trainBody: {
fontFamily: 'consolas',
trainBodyLineWidth: 0.1, // 车身line宽
trainBodyLineWidth: 1, // 车身line宽
changeTrainWidth: false, // 是否根据车身上车组号、服务号、车次号、目的地码显示情况改变列车长度
specialTrainType: [
{
@ -653,15 +653,17 @@ class SkinCode extends defaultStyle {
], // 特殊列车类型需设置显示格式
lrPadding: 4, // 两边间隔
upPadding: 4, // 上边距离
trainBodyFillColor: '#725A64', // 列车车身填充颜色
trainNameFormat: 'serviceNumber:tripNumber'// 列车显示格式
trainBodyFillColor: 'rgba(0,0,0,0)', // 列车车身填充颜色
trainNameFormat: 'serviceNumber:tripNumber', // 列车显示格式
trainSidelineColor:'#A5A5A5' // 列车边框颜色
},
soonerOrLater: {
level: 3,
serviceNumber: true,
earlyColor: '#00FF00',
lateColor: '#800000',
normalColor: '#FFF'
level: 6,
// serviceNumber: true,
smallLateColor:'#FFFF00',
bigEarlyColor:'#00C900',
bigLateColor:'#FF0000',
normalColor: '#A5A5A5'
},
directionArrow: {
},
@ -701,7 +703,7 @@ class SkinCode extends defaultStyle {
directionStopType:'normal', // special 西安二号线 停车 列车方向图标不消失 normal 正常
trainHeadHeight: 'trainBox', // 列车车头高度取决于trainBox高度
trainHeadArrowWidth: 6, // 列车车头三角宽度
trainHeadArrowOffsetX: 2 // 列车车头三角偏移
trainHeadArrowOffsetX: 7 // 列车车头三角偏移
},
common: {
trainHeight: 20, // 列车高度

10
src/jmapNew/shape/Train/TrainBody.js
View File

@ -378,6 +378,16 @@ export default class TrainBody extends Group {
this.style.Train.soonerOrLater.destinationCode && this.textTrainTarget && this.textTrainTarget.setStyle({textFill: this.style.Train.soonerOrLater.lateColor});
this.style.Train.soonerOrLater.trainBody && this.trainBodyBox && this.trainBodyBox.setColor({stroke: this.style.Train.soonerOrLater.lateColor});
}
} else if (this.style.Train.soonerOrLater && this.style.Train.soonerOrLater.level === 6) {
if (dt <= 59 && dt >= -59) {
this.style.Train.soonerOrLater.trainBody && this.trainBodyBox && this.trainBodyBox.setColor({stroke: this.style.Train.soonerOrLater.normalColor});
} else if (dt < -59 && dt >= -300) {
this.style.Train.soonerOrLater.trainBody && this.trainBodyBox && this.trainBodyBox.setColor({stroke: this.style.Train.soonerOrLater.smallLateColor});
} else if (dt > 300) {
this.style.Train.soonerOrLater.trainBody && this.trainBodyBox && this.trainBodyBox.setColor({stroke: this.style.Train.soonerOrLater.bigEarlyColor});
} else if (dt < -300) {
this.style.Train.soonerOrLater.trainBody && this.trainBodyBox && this.trainBodyBox.setColor({stroke: this.style.Train.soonerOrLater.bigLateColor});
}
}
}
formatChangePosition(model, style) {

2
src/jmapNew/theme/aus_00/planConvert copy.js
View File

@ -251,7 +251,7 @@ export default {
},
/** 通过y坐标获取站信息 */
getStationByCoordinate(stations, y) {
getStationByCoordinateY(stations, y) {
for(var i = stations.length-1; i >= 0; i--) {
const station = stations[i];
const edge = this.EdgeHeight

2
src/jmapNew/theme/aus_00/planConvert--.js
View File

@ -168,7 +168,7 @@ export default {
},
/** 通过y坐标获取站信息*/
getStationByCoordinate(stations, y) {
getStationByCoordinateY(stations, y) {
for(var i = stations.length-1; i >= 0; i--) {
const station = stations[i];
const edge = this.EdgeHeight;

75
src/jmapNew/theme/aus_00/planConvert.js
View File

@ -11,34 +11,41 @@ export default {
/** 偏移时间*/
TranslationTime: 0,
/** 将后台数据解析成图形*/
parseDataToGraph(chart, planData, stations) {
const graphs = [];
if (planData &&
planData.areaList &&
planData.areaList.length) {
planData.areaList.forEach(area => {
const startTime = toTimeStamp(area.startTime);
const endTime = toTimeStamp(area.endTime);
/** 转换model为Rect数据*/
calcAreaArgsByModel(chart, model) {
const startTime = model.startTime;
const endTime = model.endTime;
const fartherKmRange = model.fartherKmRange;
const closerKmRange = model.closerKmRange;
const fartherKm = this.getCoordinateYByStationCode(stations, area.fartherStationCode);
const closerKm = this.getCoordinateYByStationCode(stations, area.closerStationCode);
const point1 = [ startTime, fartherKm];
const point2 = [ endTime, closerKm]
const position = chart.convertToPixel('grid', point1);
const position2 = chart.convertToPixel('grid', point2)
const width = Math.abs(position[0] - position2[0]);
const height = Math.abs(position[1] - position2[1]);
const point1 = [ startTime, this.getCoordinateYByKmRange(fartherKmRange)];
const point2 = [ endTime, this.getCoordinateYByKmRange(closerKmRange)]
const position1 = chart.convertToPixel('grid', point1);
const position2 = chart.convertToPixel('grid', point2);
const position = position1;
const width = Math.abs(position1[0] - position2[0]);
const height = Math.abs(position1[1] - position2[1]);
graphs.push(createRectArea({
areaNo: area.areaNo,
model: area,
return {
model,
position,
point1,
point2,
width,
height
}));
}
},
/** 将后台数据解析成图形*/
parseDataToGraph(chart, planData) {
const graphs = [];
if (planData &&
planData.areaList &&
planData.areaList.length) {
planData.areaList.forEach(model => {
model.startTime = toTimeStamp(model.startTime);
model.endTime = toTimeStamp(model.endTime);
graphs.push(createRectArea(this.calcAreaArgsByModel(chart, model)));
})
}
@ -179,33 +186,41 @@ export default {
},
/** 根据方向计算y折返偏移量*/
getOffsetYByDirection(value, direction) {
getOffsetY(isSpecial, direction) {
if (isSpecial) {
if (direction === '1') {
value -= this.EdgeHeight / 2;
return -this.EdgeHeight / 2;
} else if (direction === '2') {
value += this.EdgeHeight / 2;
return +this.EdgeHeight / 2;
}
}
return value;
return 0;
},
/** 通过y坐标获取车站公里表*/
getKmRangeByCoordinateY(y) {
return parseInt((y-this.EdgeHeight)/this.CoordMultiple);
},
/** 通过公里表获取坐标值*/
getCoordinateYByKmRange(k) {
return this.EdgeHeight + k * this.CoordMultiple
},
/** 通过站信息获取y坐标*/
getCoordinateYByStationCode(stations, stationCode, isSpecial=false, direction='01') {
var value = 0;
var station = stations.find(it => { return it.code == stationCode; });
if (station) {
value = this.EdgeHeight + station.kmRange * this.CoordMultiple;
if (isSpecial) {
value = this.getOffsetYByDirection(value, direction);
}
value = this.getCoordinateYByKmRange(station.kmRange) + this.getOffsetY(isSpecial, direction);
}
return value;
},
/** 通过y坐标获取站信息 */
getStationByCoordinate(stations, y) {
getStationByCoordinateY(stations, y) {
for(var i = stations.length-1; i >= 0; i--) {
const station = stations[i];
const edge = this.EdgeHeight

1
src/jmapNew/theme/aus_00/utils.js
View File

@ -48,7 +48,6 @@ export function createRectArea(opt, style={}) {
return {
type: 'rect',
subType: 'area',
areaNo: opt.model.areaNo,
position: opt.position,
point1: opt.point1,
point2: opt.point2,

0
src/views/planMonitor/editToolAUS/dialog/planModifyArea.vue → src/views/planMonitor/editToolAUS/dialog/-planModifyArea.vue
View File

205
src/views/planMonitor/editToolAUS/index.vue
View File

@ -34,11 +34,9 @@
</schedule>
<plan-just-running :config="config" :selected="selected" :stations="stations" @justRunning="doJustRunning" />
<plan-just-stop :config="config" :selected="selected" :stations="stations" @justStop="doJustStop"/>
<plan-just-turn-back :config="config" :selected="selected" :stations="stations" @justTurnBack="doJustTurnBack"/>
<plan-just-turnback :config="config" :selected="selected" :stations="stations" @justTurnBack="doJustTurnback"/>
<plan-set-params :config="config" @setParams="doSetPlanParams" />
<plan-set-area-note :target="target" @setAreaNote="doSetAreaNote" />
<plan-modify-area :target="target" :stations="stations" @modifyArea="doModifyArea" />
</div>
</template>
@ -46,10 +44,10 @@
import Schedule from './schedule.vue';
import PlanJustRunning from './dialog/planJustRunning.vue';
import PlanJustStop from './dialog/planJustStop.vue';
import PlanJustTurnBack from './dialog/planJustTurnBack.vue';
import PlanJustTurnback from './dialog/planJustTurnback.vue';
import PlanSetParams from './dialog/planSetParams.vue';
import PlanModifyArea from './dialog/planModifyArea.vue';
import PlanSetAreaNote from './dialog/planSetAreaNote';
import Menus from './menus.vue';
import { MenuEnum } from './utils.js';
import { timeFormat } from '@/utils/date';
@ -57,7 +55,7 @@ import { mapGetters } from 'vuex';
import { getStationList } from '@/api/runplan';
import {
getRpTools, clearRpPlan, addRpTrip, delRpTrip,
justTripNoRunning, justTripNoStop, justTripTurnBack,
justTripNoRunning, justTripNoStop, justTripTurnback,
translateRpService, delRpService,
getRpConfig, modifyRpConfig,
createRpArea, modifyRpArea, modifyAreaNote, delRpArea
@ -68,9 +66,8 @@ export default {
Schedule,
PlanJustRunning,
PlanJustStop,
PlanJustTurnBack,
PlanJustTurnback,
PlanSetParams,
PlanModifyArea,
PlanSetAreaNote,
Menus
},
@ -161,19 +158,6 @@ export default {
this.$messageBox(error.message);
})
},
onClear() {
this.selected = null;
this.target = null;
this.$refs.schedule.setLineReset();
this.$refs.schedule.clearTrip();
if (this.model.action != 'Translate') {
this.$refs.schedule.clearDraggable();
}
if (this.model.action != 'Add') {
this.$refs.schedule.clearGraphic();
}
},
onDialog(menu) {
this.$store.dispatch('menuOperation/setPopMenu', { position: {x: 0, y: 0}, menu });
},
@ -203,6 +187,19 @@ export default {
break;
}
},
onClear() {
this.selected = null;
this.target = null;
this.$refs.schedule.setLineReset();
this.$refs.schedule.clearTrip();
if (this.model.action != 'Translate') {
this.$refs.schedule.clearDraggable();
}
if (this.model.action != 'Add') {
this.$refs.schedule.clearGraphic();
}
},
onRemove(){
this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
confirmButtonText: '确定',
@ -227,15 +224,9 @@ export default {
},
doNewPlan() {
clearRpPlan().then(resp => {
getRpTools().then(rest => {
const planData = rest.data;
this.$store.commit('rpTools/setPlanData', planData);
this.$refs.schedule.loadChartData(planData);
}).catch(() => {
this.$messageBox(this.$t('error.obtainOperationGraphFailed'));
this.$store.dispatch('rpTools/setStations', []);
});
this.refresh();
}).catch(error => {
this.refresh();
this.$message.info(error.message);
})
},
@ -247,48 +238,16 @@ export default {
this.$message.info(error.message);
})
},
doModifyArea(data) {
const startTime = data.startTime;
const endTime = data.endTime;
const startCodeIndex = this.stations.findIndex(el => { return el.code == data.startStationCode; })
const endCodeIndex = this.stations.findIndex(el => { return el.code == data.endStationCode; })
const model = {
fartherStationCode: startCodeIndex < endCodeIndex? data.endStationCode: data.startStationCode,
closerStationCode: startCodeIndex < endCodeIndex? data.startStationCode: data.endStationCode,
startTime: data.startTime,
endTime: data.endTime
}
modifyRpArea(data.areaNo, model).then(resp => {
getRpTools().then(rest => {
const planData = rest.data;
this.$store.commit('rpTools/setPlanData', planData);
this.$refs.schedule.loadChartData(planData);
this.$message.success('Construction area modified successfully.');
}).catch(() => {
this.$messageBox('Failed to load the plan.');
});
}).catch(error => {
this.$message.info(error.message);
})
},
doSetAreaNote(data) {
const model = {
text: data.text
}
modifyAreaNote(data.areaNo, model).then(resp => {
getRpTools().then(rest => {
const planData = rest.data;
this.$store.commit('rpTools/setPlanData', planData);
this.$refs.schedule.loadChartData(planData);
this.$message.success('Construction area note modified successfully.');
}).catch(() => {
this.$messageBox('Failed to load the plan.');
});
this.refresh();
}).catch(error => {
this.$message.info(error.message);
this.refresh();
})
},
doJustRunning(time) {
@ -299,15 +258,10 @@ export default {
}
justTripNoRunning(this.selected.tripNo, model).then(resp => {
getRpTools().then(rest => {
const planData = rest.data;
this.$store.commit('rpTools/setPlanData', planData);
this.$refs.schedule.loadChartData(planData);
}).catch(() => {
this.$messageBox('Failed to load the plan.');
});
this.refresh();
}).catch(error => {
this.$message.info(error.message);
this.refresh();
})
}
},
@ -319,35 +273,25 @@ export default {
}
justTripNoStop(this.selected.tripNo, model).then(resp => {
getRpTools().then(rest => {
const planData = rest.data;
this.$store.commit('rpTools/setPlanData', planData);
this.$refs.schedule.loadChartData(planData);
}).catch(() => {
this.$messageBox('Failed to load the plan.');
});
this.refresh();
}).catch(error => {
this.$message.info(error.message);
this.refresh();
})
}
},
doJustTurnBack(time) {
doJustTurnback(time) {
if (this.selected) {
const model = {
seconds: time,
stationCode: this.selected.stationCode
}
justTripTurnBack(this.selected.tripNo, model).then(resp => {
getRpTools().then(rest => {
const planData = rest.data;
this.$store.commit('rpTools/setPlanData', planData);
this.$refs.schedule.loadChartData(planData);
}).catch(() => {
this.$messageBox('Failed to load the plan.');
});
justTripTurnback(this.selected.tripNo, model).then(resp => {
this.refresh();
}).catch(error => {
this.$message.info(error.message);
this.refresh();
})
}
},
@ -360,23 +304,18 @@ export default {
}
addRpTrip(model).then(resp => {
getRpTools().then(rest => {
const planData = rest.data;
this.$store.commit('rpTools/setPlanData', planData);
this.$refs.schedule.loadChartData(planData);
}).catch(() => {
this.$messageBox('Failed to load the plan.');
});
this.refresh();
}).catch(error => {
this.$message.info(error.message);
this.refresh();
this.$refs.schedule.clearGraphic(['mark']);
})
},
doCreateArea(data) {
const startTime = data.startTime;
const endTime = data.endTime;
const startCodeIndex = this.stations.findIndex(el => { return el.code == data.startStationCode; })
const endCodeIndex = this.stations.findIndex(el => { return el.code == data.endStationCode; })
const startKmRange = data.startKmRange;
const endKmRange = data.endKmRange;
if (Math.abs(endTime - startTime) < 10*60) {
this.$refs.schedule.clearGraphic(['mark']);
@ -385,40 +324,30 @@ export default {
}
const model = {
fartherStationCode: startCodeIndex < endCodeIndex? data.endStationCode: data.startStationCode,
closerStationCode: startCodeIndex < endCodeIndex? data.startStationCode: data.endStationCode,
fartherKmRange: startKmRange < endKmRange? data.endKmRange: data.startKmRange,
closerKmRange: startKmRange < endKmRange? data.startKmRange: data.endKmRange,
startTime: endTime < startTime? timeFormat(data.endTime): timeFormat(data.startTime),
endTime: endTime < startTime? timeFormat(data.startTime): timeFormat(data.endTime)
}
createRpArea(model).then(resp => {
getRpTools().then(rest => {
const planData = rest.data;
this.$store.commit('rpTools/setPlanData', planData);
this.$refs.schedule.loadChartData(planData);
}).catch(() => {
this.$messageBox('Failed to load the plan.');
});
this.refresh();
}).catch(error => {
this.$message.info(error.message);
this.refresh();
this.$refs.schedule.clearGraphic(['mark']);
})
},
doTranslateService() {
if (this.selected) {
const model = {
seconds : this.selected.sx
seconds : this.selected.time
}
translateRpService(this.selected.serviceNo, model).then(resp => {
getRpTools().then(rest => {
const planData = rest.data;
this.$store.commit('rpTools/setPlanData', planData);
this.$refs.schedule.loadChartData(planData);
}).catch(() => {
this.$messageBox('Failed to load the plan.');
});
this.refresh();
}).catch(error => {
this.refresh();
this.$message.info(error.message);
});
}
@ -427,22 +356,17 @@ export default {
if (this.target) {
const data = this.target.model;
const model = {
fartherStationCode: data.fartherStationCode,
closerStationCode: data.closerStationCode,
startTime: data.startTime,
endTime: data.endTime,
fartherKmRange: parseInt(data.fartherKmRange),
closerKmRange: parseInt(data.closerKmRange),
startTime: timeFormat(data.startTime),
endTime: timeFormat(data.endTime),
text: data.text
}
modifyRpArea(data.areaNo, model).then(resp => {
getRpTools().then(rest => {
const planData = rest.data;
this.$store.commit('rpTools/setPlanData', planData);
this.$refs.schedule.loadChartData(planData);
}).catch(() => {
this.$messageBox('Failed to load the plan.');
});
this.refresh();
}).catch(error => {
this.refresh();
this.$message.info(error.message);
});
}
@ -450,15 +374,9 @@ export default {
doRemoveService() {
if (this.selected) {
delRpService(this.selected.serviceNo).then(resp => {
getRpTools().then(rest => {
const planData = rest.data;
this.$store.commit('rpTools/setPlanData', planData);
this.$refs.schedule.loadChartData(planData);
this.onClear();
}).catch(() => {
this.$messageBox('Failed to load the plan.');
});
this.refresh();
}).catch(error => {
this.refresh();
this.$message.info(error.message);
})
}
@ -466,22 +384,25 @@ export default {
doRemoveTrip() {
if (this.selected) {
delRpTrip(this.selected.tripNo).then(resp => {
getRpTools().then(rest => {
const planData = rest.data;
this.$store.commit('rpTools/setPlanData', planData);
this.$refs.schedule.loadChartData(planData);
this.onClear();
}).catch(() => {
this.$messageBox('Failed to load the plan.');
});
this.refresh();
}).catch(error => {
this.refresh();
this.$message.info(error.message);
})
}
},
doRemoveArea() {
if (this.target) {
delRpArea(this.target.areaNo).then(resp => {
const data = this.target.model;
delRpArea(data.areaNo).then(resp => {
this.refresh();
}).catch(error => {
this.refresh();
this.$message.info(error.message);
})
}
},
refresh() {
getRpTools().then(rest => {
const planData = rest.data;
this.$store.commit('rpTools/setPlanData', planData);
@ -490,10 +411,6 @@ export default {
}).catch(() => {
this.$messageBox('Failed to load the plan.');
});
}).catch(error => {
this.$message.info(error.message);
})
}
}
}
};

183
src/views/planMonitor/editToolAUS/monitor.js
View File

@ -9,9 +9,11 @@ export default {
callRegister: [],
markList: [],
buildModel: {
endStationCode: '',
startStationCode: '',
startKmRange: 0,
startTime: 0,
endStationCode: '',
endKmRange: 0,
endTime: 0
},
selected: null,
@ -39,7 +41,7 @@ export default {
const option = this.myChart.getOption();
const minY = option.yAxis[0].min;
const xVal = option.xAxis[0].data[xIndex];
const yObj = this.planUtil.getStationByCoordinate(this.stations, yIndex-minY);
const yObj = this.planUtil.getStationByCoordinateY(this.stations, yIndex-minY);
if (yObj && cb) {
cb({yObj, xVal, pointInPixel, pointInGrid, e});
}
@ -83,13 +85,13 @@ export default {
const elements = option.graphic[0].elements
const graphic = echarts.util.map(elements, (el) => {
if (fixedList.includes(el.subType)) {
const position = this.myChart.convertToPixel('grid', el.point1);
const position1 = this.myChart.convertToPixel('grid', el.point1);
const position2 = this.myChart.convertToPixel('grid', el.point2);
const width = Math.abs(position[0] - position2[0]);
const height = Math.abs(position[1] - position2[1])
const width = Math.abs(position1[0] - position2[0]);
const height = Math.abs(position1[1] - position2[1])
return {
position,
position: position1,
shape: { width, height }
}
} else {
@ -104,14 +106,17 @@ export default {
},
onZrMouseOver(e) {
this.pixelExecCb(e, this.doSetTarget);
if (this.model.choice == 'Construction') {
if (this.model.action == 'Translate') {
this.pixelExecCb(e, this.doSetAreaTranslate);
} else if (this.model.action == 'Edit') {
this.pixelExecCb(e, this.doSetAreaDrags);
this.pixelExecCb(e, this.doSetAreaHorns);
}
}
},
onZrMouseDown(e) {
if (e.target && ['area'].includes(e.target.subType)) {
this.pixelExecCb(e, this.doSetTarget);
this.dragging = true;
if (this.model.choice == 'Construction') {
if (this.model.action == 'Note') {
@ -128,19 +133,19 @@ export default {
if (this.model.action == 'Add') {
this.pixelExecCb(e, this.doCreateArea);
}
// if (this.model.action == 'Translate') {
// this.pixelExecCb(e, this.doSetAreaTranslate);
// } else if (this.model.action == 'Edit') {
// this.pixelExecCb(e, this.doSetAreaDrags);
// }
}
},
onZrMouseUp(e) {
if (['Plan', 'Construction'].includes(this.model.choice)) {
if(this.model.action == 'Translate' && this.dragging) {
if (this.dragging) {
if(this.model.choice == 'Plan') {
if (this.model.action == 'Translate') {
this.pixelExecCb(e, this.doTranslate)
}
} else if(this.model.choice == 'Construction') {
if(['Translate', 'Edit'].includes(this.model.action)) {
this.pixelExecCb(e, this.doTranslate)
}
}
}
if (!e.target) {
@ -212,6 +217,8 @@ export default {
this.model.choice == 'Construction') {
if (this.model.action == 'Translate') {
this.pixelExecCb(e, this.doAreaDragging);
} else if (this.model.action == 'Edit') {
this.pixelExecCb(e, this.doAreaHornDragging);
}
}
},
@ -229,7 +236,7 @@ export default {
e.seriesName.includes('service')) {
const option = this.myChart.getOption();
const filters = option.graphic[0].elements.filter(el => { return el.subType != 'drag'});
filters.push(utils.buildDragDataObj(pointInPixel, pointInGrid, this))
filters.push(utils.buildDragDataObj(pointInPixel, pointInGrid, this, 'drag'))
option.graphic[0].elements = filters;
this.myChart.setOption(option, {notMerge: true});
@ -240,12 +247,12 @@ export default {
});
}
},
doCreateMark({e, pointInGrid, pointInPixel, yObj, xVal}) {
doCreateMark({e, pointInGrid, pointInPixel, yObj}) {
const option = this.myChart.getOption();
const graphic = option.graphic;
const elements = graphic[0].elements;
elements.push(utils.buildMarkPointObj(pointInPixel, pointInGrid, this))
elements.push(utils.buildMarkPointObj(pointInPixel, pointInGrid, this, 'mark'))
this.myChart.setOption(option, {notMerge: true});
@ -253,22 +260,22 @@ export default {
const elemList = elements.filter(el => { return el.subType != 'mark'});
if (markList.length == 1) {
this.buildModel.startTime = pointInGrid[0];
this.buildModel.startStationCode = yObj.code;
this.buildModel.startTime = xVal;
} else if (markList.length >= 2) {
this.buildModel.endTime = pointInGrid[0];
this.buildModel.endStationCode = yObj.code;
this.buildModel.endTime = xVal;
option.graphic[0].elements = elemList;
this.$emit('create', this.buildModel);
}
},
doCreateArea({e, pointInGrid, pointInPixel, yObj, xVal}) {
doCreateArea({e, pointInGrid, pointInPixel}) {
if (!e.target) {
const option = this.myChart.getOption();
const graphic = option.graphic;
const elements = graphic[0].elements;
elements.push(utils.buildMarkPointObj(pointInPixel, pointInGrid, this))
elements.push(utils.buildMarkPointObj(pointInPixel, pointInGrid, this, 'mark'))
this.myChart.setOption(option, {notMerge: true});
@ -276,11 +283,11 @@ export default {
const elemList = elements.filter(el => { return el.subType != 'mark'});
if (markList.length == 1) {
this.buildModel.startStationCode = yObj.code;
this.buildModel.startTime = xVal;
this.buildModel.startTime = pointInGrid[0];
this.buildModel.startKmRange = this.planUtil.getKmRangeByCoordinateY(pointInGrid[1]);
} else if (markList.length >= 2) {
this.buildModel.endStationCode = yObj.code;
this.buildModel.endTime = xVal;
this.buildModel.endTime = pointInGrid[0];
this.buildModel.endKmRange = this.planUtil.getKmRangeByCoordinateY(pointInGrid[1]);
option.graphic[0].elements = elemList;
this.$emit('create', this.buildModel);
}
@ -292,11 +299,7 @@ export default {
const model = target.model
Object.assign(model, {
_x: pointInGrid[0],
_y: pointInGrid[1],
dx: 0,
dy: 0,
sx: 0,
sy: 0
_y: pointInGrid[1]
})
this.target = target;
@ -353,8 +356,8 @@ export default {
_y: pointInGrid[1],
dx: 0,
dy: 0,
sx: 0,
sy: 0
time: 0,
kmRange: 0
}
this.$emit('select', this.selected);
@ -363,20 +366,39 @@ export default {
}
},
doSetAreaTranslate({e}) {
if (e.target && ['area'].includes(e.target.subType)) {
if (this.target && ['area'].includes(this.target.subType)) {
const option = this.myChart.getOption();
const shape = option.graphic[0].elements.find(el => { return ['area'].includes(el.subType) && el.areaNo == this.target.areaNo; });
const model = this.target.model;
const graph = option.graphic[0].elements.find(el => { return ['area'].includes(el.subType) && el.model.areaNo == model.areaNo; });
shape.draggable = true;
shape.ondrag = echarts.util.curry(this.onShapeDragging);
graph.draggable = true;
graph.ondrag = echarts.util.curry(this.onShapeDragging);
this.myChart.setOption(option, {notMerge: true});
console.log(shape);
}
},
doSetAreaDrags({e}) {
console.log('set drag')
doSetAreaHorns({e}) {
if (this.target && ['area'].includes(this.target.subType)) {
const option = this.myChart.getOption();
const model = this.target.model;
const elemList = option.graphic[0].elements.filter(el => { return !['drag'].includes(el.subType) });
const graph = option.graphic[0].elements.find(el => { return ['area'].includes(el.subType) && el.model.areaNo == model.areaNo; });
const p = graph.position;
const w = graph.shape.width;
const h = graph.shape.height;
const point1 = [p[0], p[1]];
const point2 = [p[0]+w, p[1]];
const point3 = [p[0]+w, p[1]+h];
const point4 = [p[0], p[1]+h];
elemList.push(utils.buildHornDataObj(point1, this.myChart.convertFromPixel('grid', point1), this, 'horn-1'));
elemList.push(utils.buildHornDataObj(point2, this.myChart.convertFromPixel('grid', point2), this, 'horn-2'));
elemList.push(utils.buildHornDataObj(point3, this.myChart.convertFromPixel('grid', point3), this, 'horn-3')),
elemList.push(utils.buildHornDataObj(point4, this.myChart.convertFromPixel('grid', point4), this, 'horn-4'))
option.graphic[0].elements = elemList;
this.myChart.setOption(option, {notMerge: true});
}
},
doPopDialog({e, pointInGrid, pointInPixel}) {
const point = {
@ -415,10 +437,10 @@ export default {
if (this.selected && this.dragging) {
this.selected.dx = pointInGrid[0] - this.selected._x;
this.selected.dy = pointInGrid[1] - this.selected._y;
this.selected.sx += this.selected.dx;
this.selected.sy += this.selected.dy;
this.selected._x = pointInGrid[0];
this.selected._y = pointInGrid[1];
this.selected.time += this.selected.dx;
this.selected.kmRange += this.selected.dy;
if (this.selected.dx || this.selected.dy) {
const option = this.myChart.getOption();
@ -448,33 +470,66 @@ export default {
},
doAreaDragging({e, pointInGrid}) {
if (this.target && ['area'].includes(this.target.subType) && this.dragging) {
const model = this.target.model;
if (model.sx != undefined && model.sy != undefined) {
model.dx = pointInGrid[0] - model._x;
model.dy = pointInGrid[1] - model._y;
model.sx += model.dx;
model.sy += model.dy;
const target = this.target;
const model = target.model;
const dx = pointInGrid[0] - model._x;
const dy = pointInGrid[1] - model._y;
model._x = pointInGrid[0];
model._y = pointInGrid[1];
model.startTime += dx;
model.endTime += dx;
model.fartherKmRange += dy;
model.closerKmRange += dy;
}
},
doAreaHornDragging({e, pointInGrid}) {
if (e.target && ['drag'].includes(e.target.subType) && this.dragging) {
const option = this.myChart.getOption();
const target = this.target;
const model = target.model;
const elemList = option.graphic[0].elements.filter(el => { return ['drag'].includes(el.subType) });
const index = elemList.findIndex(el => { return e.target.name == el.name; });
const dx = pointInGrid[0] - model._x;
const dy = pointInGrid[1] - model._y;
model._x = pointInGrid[0];
model._y = pointInGrid[1];
switch(index) {
case 0:
model.startTime += dx;
model.fartherKmRange += dy;
break;
case 1:
model.endTime += dx;
model.fartherKmRange += dy;
break;
case 2:
model.endTime += dx;
model.closerKmRange += dy;
break;
case 3:
model.startTime += dx;
model.closerKmRange += dy;
break;
}
const args = this.planUtil.calcAreaArgsByModel(this.myChart, model);
const graph = option.graphic[0].elements.find(el => { return ['area'].includes(el.subType) && el.model.areaNo == model.areaNo; });
graph.position = args.position;
graph.point1 = args.point1;
graph.point2 = args.point2;
graph.shape.width = args.width;
graph.shape.height = args.height;
this.myChart.setOption(option, {notMerge: true});
this.doSetAreaHorns({e});
}
},
doTranslate({e}) {
if (this.target && ['area'].includes(this.target.subType)) {
const model = this.target.model;
const sx = model.sx||0;
const sy = model.sy||0;
const fartherStationValue = this.planUtil.getCoordinateYByStationCode(this.stations, model.fartherStationCode) + sy;
const closerStationValue = this.planUtil.getCoordinateYByStationCode(this.stations, model.closerStationCode) + sy;
const fartherStation = this.planUtil.getStationByCoordinate(this.stations, fartherStationValue)||{code: model.fartherStationCode};
const closerStation = this.planUtil.getStationByCoordinate(this.stations, closerStationValue)||{code: model.closerStationCode};
model.startTime = timeFormat(toTimeStamp(model.startTime)+sx);
model.endTime = timeFormat(toTimeStamp(model.endTime)+sx);
model.fartherStationCode = fartherStation.code;
model.closerStationCode = closerStation.code;
}
this.$emit('translate');
}
}

33
src/views/planMonitor/editToolAUS/schedule.vue
View File

@ -262,8 +262,16 @@ export default {
this.pushModels(option.series, [this.planUtil.initializeYaxis(this.stations)]);
this.pushModels(option.series, this.planUtil.parseDataToSeries(this.myChart, planData, this.stations));
this.pushModels(option.graphic[0].elements, this.planUtil.parseDataToGraph(this.myChart, planData, this.stations));
if (this.model.choice == 'Construction') {
const elemList = option.graphic[0].elements.filter(el => { return el.subType == 'area'});
elemList.forEach(el => {
el.draggable = true;
el.ondrag = echarts.util.curry(this.onShapeDragging);
})
}
this.myChart.setOption(option, {notMerge: true});
} catch (error) {
this.$messageBox(error.message);
}
@ -359,6 +367,18 @@ export default {
});
}
},
clearDraggable(labels=['area']) {
const option = this.myChart.getOption();
const elements = option.graphic[0].elements;
const elemList = elements.filter(el => { return labels.includes(el.subType)});
elemList.forEach(el => {
el.draggable = false;
el.ondrag = null;
})
this.myChart.setOption(option, {notMerge: true});
},
clearTrip() {
const option = this.myChart.getOption();
const index = option.series.findIndex(el => { return el.name.includes('service-trip') });
@ -371,19 +391,6 @@ export default {
const option = this.myChart.getOption();
const elements = option.graphic[0].elements;
option.graphic[0].elements = elements.filter(el => { return !labels.includes(el.subType)});
this.myChart.setOption(option, {notMerge: true});
},
clearDraggable(labels=['drag', 'area']) {
const option = this.myChart.getOption();
const elements = option.graphic[0].elements;
const elemList = elements.filter(el => { return labels.includes(el.subType)});
elemList.forEach(el => {
el.draggable = false;
el.ondrag = null;
el.onmousemove = null;
})
this.myChart.setOption(option, {notMerge: true});
}
}

34
src/views/planMonitor/editToolAUS/utils.js
View File

@ -9,16 +9,42 @@ export const MenuEnum = {
planJustTurnBack: '1005'
}
export function buildDragDataObj(position, point, that) {
export function buildHornDataObj(position, point, that, name='') {
return {
type: 'circle',
subType: 'drag',
position: [...position],
point: [...point],
model: {},
name,
shape: {
cx: 0,
cy: 0,
r: 10
r: 8
},
style: {
fill: 'rgba(0,0,0,0.3)'
},
draggable: 'true',
onmouseover: echarts.util.curry(that.onShapeMouseOver),
ondrag: echarts.util.curry(that.onShapeDragging),
onmouseout: echarts.util.curry(that.onShapeMouseOut),
z: 100
}
}
export function buildDragDataObj(position, point, that, name='') {
return {
type: 'circle',
subType: 'drag',
position: [...position],
point: [...point],
model: {},
name,
shape: {
cx: 0,
cy: 0,
r: 6
},
invisible: true,
draggable: 'horizontal',
@ -29,13 +55,15 @@ export function buildDragDataObj(position, point, that) {
}
}
export function buildMarkPointObj(position, point, that) {
export function buildMarkPointObj(position, point, that, name='') {
return {
type: 'circle',
subType: 'mark',
z: 100,
position: [...position],
point: [...point],
model: {},
name,
shape: {
cx: 0,
cy: 0,