Merge branch 'test' of https://git.code.tencent.com/lian-cbtc/jl-client into test
This commit is contained in:
commit
1fce4cb363
@ -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',
|
||||
|
@ -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, // 列车高度
|
||||
|
@ -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) {
|
||||
|
@ -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
|
||||
|
@ -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;
|
||||
|
@ -11,34 +11,41 @@ export default {
|
||||
/** 偏移时间*/
|
||||
TranslationTime: 0,
|
||||
|
||||
/** 转换model为Rect数据*/
|
||||
calcAreaArgsByModel(chart, model) {
|
||||
const startTime = model.startTime;
|
||||
const endTime = model.endTime;
|
||||
const fartherKmRange = model.fartherKmRange;
|
||||
const closerKmRange = model.closerKmRange;
|
||||
|
||||
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]);
|
||||
|
||||
return {
|
||||
model,
|
||||
position,
|
||||
point1,
|
||||
point2,
|
||||
width,
|
||||
height
|
||||
}
|
||||
},
|
||||
|
||||
/** 将后台数据解析成图形*/
|
||||
parseDataToGraph(chart, planData, stations) {
|
||||
parseDataToGraph(chart, planData) {
|
||||
const graphs = [];
|
||||
if (planData &&
|
||||
planData.areaList &&
|
||||
planData.areaList.length) {
|
||||
planData.areaList.forEach(area => {
|
||||
const startTime = toTimeStamp(area.startTime);
|
||||
const endTime = toTimeStamp(area.endTime);
|
||||
|
||||
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]);
|
||||
|
||||
graphs.push(createRectArea({
|
||||
areaNo: area.areaNo,
|
||||
model: area,
|
||||
position,
|
||||
point1,
|
||||
point2,
|
||||
width,
|
||||
height
|
||||
}));
|
||||
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) {
|
||||
if (direction === '1') {
|
||||
value -= this.EdgeHeight / 2;
|
||||
} else if (direction === '2') {
|
||||
value += this.EdgeHeight / 2;
|
||||
getOffsetY(isSpecial, direction) {
|
||||
if (isSpecial) {
|
||||
if (direction === '1') {
|
||||
return -this.EdgeHeight / 2;
|
||||
} else if (direction === '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
|
||||
|
@ -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,
|
||||
|
@ -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,7 +187,20 @@ export default {
|
||||
break;
|
||||
}
|
||||
},
|
||||
onRemove(){
|
||||
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: '确定',
|
||||
cancelButtonText: '取消',
|
||||
@ -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.$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.');
|
||||
});
|
||||
}).catch(error => {
|
||||
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,35 +384,34 @@ 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 => {
|
||||
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.');
|
||||
});
|
||||
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);
|
||||
this.$refs.schedule.loadChartData(planData);
|
||||
this.onClear();
|
||||
}).catch(() => {
|
||||
this.$messageBox('Failed to load the plan.');
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
@ -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.action == 'Translate') {
|
||||
this.pixelExecCb(e, this.doSetAreaTranslate);
|
||||
} else if (this.model.action == 'Edit') {
|
||||
this.pixelExecCb(e, this.doSetAreaDrags);
|
||||
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.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,18 +133,18 @@ 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) {
|
||||
this.pixelExecCb(e, this.doTranslate)
|
||||
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)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -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;
|
||||
model._x = pointInGrid[0];
|
||||
model._y = pointInGrid[1];
|
||||
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');
|
||||
}
|
||||
}
|
||||
|
@ -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});
|
||||
|
||||
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});
|
||||
}
|
||||
}
|
||||
|
@ -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,
|
||||
|
Loading…
Reference in New Issue
Block a user