修改AUSTool的bug

This commit is contained in:
lVAL 2020-10-29 14:37:51 +08:00
parent 6b688c4dc3
commit be9c54ee34
10 changed files with 140 additions and 37 deletions

View File

@ -23,9 +23,9 @@ export function listStations(lineId) {
/**
* 更新线路车站
*/
export function updateStation(lineId, data) {
export function updateStation(stationId, data) {
return request({
url: `/api/rpTools/station/${lineId}`,
url: `/api/rpTools/station/${stationId}`,
method: 'put',
data
})

View File

@ -2,6 +2,12 @@ import { createSeriesModel, createMarkLineModels, createRectArea, createMartPoin
import { toTimeStamp } from '@/utils/date';
export default {
/** 最小时间*/
MinTime: 0,
/** 最大时间*/
MaxTime: 3600 * 24,
/** 边缘高度*/
EdgeHeight: 600,
@ -13,11 +19,10 @@ export default {
/** 转换model为Rect数据*/
calcAreaArgsByModel(chart, model) {
const startTime = model.startTime;
const endTime = model.endTime;
const fartherKmRange = model.fartherKmRange;
const closerKmRange = model.closerKmRange;
const startTime = model.startTime;
const endTime = model.endTime;
const point1 = [ startTime, this.getCoordinateYByKmRange(fartherKmRange)];
const point2 = [ endTime, this.getCoordinateYByKmRange(closerKmRange)]
const position1 = chart.convertToPixel('grid', point1);
@ -43,8 +48,8 @@ export default {
planData.areaList &&
planData.areaList.length) {
planData.areaList.forEach(model => {
model.startTime = typeof model.startTime == 'string'? toTimeStamp(model.startTime): model.startTime;
model.endTime = typeof model.endTime == 'string'? toTimeStamp(model.endTime): model.endTime;
if (typeof model.startTime == 'string') model.startTime = toTimeStamp(model.startTime);
if (typeof model.endTime == 'string') model.endTime = toTimeStamp(model.endTime);
graphs.push(createRectArea(this.calcAreaArgsByModel(chart, model)));
})
}
@ -235,6 +240,24 @@ export default {
return null;
},
/**限制区域范围 */
limitAreaTime(model) {
if (model) {
model.startTime = model.startTime < this.MinTime
? this.MinTime
: model.startTime > this.MaxTime
? this.MaxTime
: model.startTime;
model.endTime = model.endTime < this.MinTime
? this.MinTime
: model.endTime > this.MaxTime
? this.MaxTime
: model.endTime;
}
return model;
},
/** 检查公里表是否超出范围*/
limitAreaKmRange(stations, model) {
const closerKmRange = model.closerKmRange;

View File

@ -52,6 +52,8 @@ export function createRectArea(opt, style={}) {
point1: opt.point1,
point2: opt.point2,
model: opt.model,
culling: true,
progressive: true,
shape: {
x: 0,
y: 0,
@ -96,10 +98,11 @@ export function createMarkLineModels(stations, computedYaxis) {
show: true,
position: 'start',
formatter: elem.name,
color: 'black'
color: elem.transferable ? 'rgba(0,255,0)': 'rgba(0,0,0)'
},
lineStyle: {
type: 'solid',
type: 'solid',
color: elem.transferable? 'rgba(0,255,0,0.5)': 'rgba(0,0,0,0.5)',
width: 0.5,
opacity: 0.5
},

View File

@ -17,7 +17,7 @@ export function now() {
}
export function timeFormat(usedTime=0) {
let hour = 0; let minute = 0; let second = 0; let sumTime = usedTime;
let hour = 0; let minute = 0; let second = 0; let sumTime = usedTime;
if (sumTime) {
if (sumTime >= 3600) {
hour = Math.floor(sumTime / 3600) % 24;

View File

@ -99,7 +99,7 @@ export default {
this.$refs.modfiy.doShow(el);
},
onUpdateStation(el) {
updateStation(this.lineId, el).then(resp => {
updateStation(el.id, el).then(resp => {
this.refreshStationList();
this.$message.success('修改成功。')
}).catch(error => {

View File

@ -39,6 +39,7 @@ export default {
return {
drawer: false,
model: {
id: '',
name: '',
kmRange: 0,
transferable: false,
@ -71,6 +72,7 @@ export default {
methods: {
doShow(model) {
this.model = {
id: model.id,
name: model.name,
kmRange: model.kmRange,
transferable: model.transferable,

View File

@ -136,7 +136,7 @@ export default {
}
this.myChart = echarts.init(document.getElementById(this.canvasId));
this.myChart.setOption(this.option, {notMerge: true});
this.myChart.setOption(this.option, true);
this.reSize({ width: this.width, height: this.height });
resolve(true);
} catch (error) {
@ -151,7 +151,7 @@ export default {
this.xAxisInit(stations);
this.yAxisInit(stations);
this.myChart.setOption(this.option, {notMerge: true});
this.myChart.setOption(this.option, true);
}
} catch (error) {
this.$message.info(error.message);
@ -171,7 +171,7 @@ export default {
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));
this.myChart.setOption(option, {notMerge: true});
this.myChart.setOption(option, true);
} catch (error) {
this.$messageBox(error.message);
}
@ -180,13 +180,13 @@ export default {
const option = this.option;
const list = [];
for (var time = 0 + this.planUtil.TranslationTime; time <= 3600 * 24 + this.planUtil.TranslationTime; time++) {
for (var time = this.planUtil.MinTime + this.planUtil.TranslationTime; time <= this.planUtil.MaxTime + this.planUtil.TranslationTime; time++) {
list.push(time);
}
option.xAxis[0].data = list;
option.dataZoom[0].startValue = 0 + this.planUtil.TranslationTime;
option.dataZoom[0].endValue = 3600 * 24 + this.planUtil.TranslationTime;
option.dataZoom[0].startValue = this.planUtil.MinTime + this.planUtil.TranslationTime;
option.dataZoom[0].endValue = this.planUtil.MaxTime + this.planUtil.TranslationTime;
},
yAxisInit(stations) {
const option = this.option;

View File

@ -52,7 +52,7 @@
<div class="fixed" v-show="show">
<textarea :auto-focus="true" v-if="textareaModel.show" v-focus v-model="textareaModel.text" class="fixed-textarea"
<textarea :auto-focus="true" v-if="textareaModel.show" v-model="textareaModel.text" class="fixed-textarea"
:style="{ left: rect.x+'px', top: rect.y+'px', width: rect.width+'px', height: rect.height+'px', }"/>
</div>
@ -345,6 +345,7 @@ export default {
this.$refs.schedule.setLineReset();
this.$refs.schedule.setTargetReset();
this.$refs.schedule.clearTrip();
if (this.model.action != 'Translate') {
this.$refs.schedule.clearDraggable();
}
@ -352,6 +353,8 @@ export default {
if (this.model.action != 'Add') {
this.$refs.schedule.clearGraphic();
}
this.$refs.schedule.setAreaClipPath();
},
onRemove(){
switch(this.model.choice) {
@ -392,6 +395,7 @@ export default {
},
doCreatePlan(model) {
createRp(model).then(resp => {
this.$router.replace({ path: 'AUStool'});
this.$message.success('Run plan group created successfully.')
}).catch(error => {
this.$message.info(error.message);

View File

@ -61,6 +61,8 @@ export default {
this.myChart.on('mouseover', this.onMouseOver);
this.myChart.on('mouseout', this.onMouseOut);
this.myChart.on('datazoom', this.onUpdateZoom);
this.myChart.on('rendered', this.onRendered);
window.addEventListener('resize', this.onUpdateZoom);
}
},
@ -72,10 +74,13 @@ export default {
zr.off('mousedown', this.onZrMouseDown, this);
zr.off('mouseup', this.onZrMouseUp, this);
zr.off('mouseout', this.onZrMouseOut, this);
this.myChart.off('click', this.onMouseClick);
this.myChart.off('mouseover', this.onMouseOver);
this.myChart.off('mouseout', this.onMouseOut);
this.myChart.off('datazoom', this.onUpdateZoom);
this.myChart.off('rendered', this.onRendered);
window.removeEventListener('resize', this.onUpdateZoom);
}
},
@ -106,6 +111,7 @@ export default {
})
this.myChart.setOption({graphic});
setTimeout(_=>{ this.setAreaClipPath(); }, 0);
this.$emit('clear');
},
onZrMouseOver(e) {
@ -194,6 +200,37 @@ export default {
}
});
},
onRendered(e) {
// const mw = this.myChart.getWidth()-100;
// const mh = this.myChart.getHeight()-80;
// const view = this.myChart.getViewOfComponentModel({__viewId: "_ec_shape_graphic"});
// if (view.group) {
// view.group.eachChild(el => {
// if (['area'].includes(el.subType)) {
// const w = Math.abs(el.point2[0]-el.point1[0]);
// const h = Math.abs(el.point2[1]-el.point1[1]);
// const x = el.position[0] < 160
// ? 160 - el.position[0]
// : 0;
// const y = el.position[1] < 60
// ? 60 - el.position[1]
// : 0;
// const dw = el.position[0]+w > mw
// ? el.position[0]+w-mw
// : x;
// const dh = el.position[1]+h > mh
// ? el.position[1]+h-mh
// : y;
// el.shape.x = x;
// el.shape.y = y;
// el.shape.width = Math.abs(w-dw);
// el.shape.height = Math.abs(h-dh);
// el.dirty();
// }
// })
// }
},
onShapeMouseOver(e) {
if (this.selected) {
this.myChart.dispatchAction({
@ -241,7 +278,7 @@ export default {
filters.push(utils.buildDragDataObj(pointInPixel, pointInGrid, this, 'drag'))
option.graphic[0].elements = filters;
this.myChart.setOption(option, {notMerge: true});
this.myChart.setOption(option, true);
this.myChart.dispatchAction({
type: 'showTip',
seriesIndex: this.selected.seriesIndex,
@ -257,7 +294,7 @@ export default {
const option = this.myChart.getOption();
const filters = option.graphic[0].elements.filter(el => { return el.subType != 'drag'});
option.graphic[0].elements = filters;
this.myChart.setOption(option, {notMerge: true});
this.myChart.setOption(option, true);
}
},
doCreateMark({e, pointInGrid, pointInPixel, yObj}) {
@ -267,7 +304,7 @@ export default {
elements.push(utils.buildMarkPointObj(pointInPixel, pointInGrid, this, 'mark'))
this.myChart.setOption(option, {notMerge: true});
this.myChart.setOption(option, true);
const markList = this.markList = elements.filter(el => { return el.subType == 'mark'});
const elemList = elements.filter(el => { return el.subType != 'mark'});
@ -290,7 +327,7 @@ export default {
elements.push(utils.buildMarkPointObj(pointInPixel, pointInGrid, this, 'mark'))
this.myChart.setOption(option, {notMerge: true});
this.myChart.setOption(option, true);
const markList = this.markList = elements.filter(el => { return el.subType == 'mark'});
const elemList = elements.filter(el => { return el.subType != 'mark'});
@ -365,7 +402,7 @@ export default {
series.data = service.data.filter(el => { return el instanceof Array && el[2].tripNo == value[2].tripNo })
this.myChart.setOption(option, {notMerge: true});
this.myChart.setOption(option, true);
}
const obj =dataList[e.dataIndex][2];
@ -400,7 +437,7 @@ export default {
elem.draggable = true;
elem.ondrag = echarts.util.curry(this.onShapeDragging);
this.myChart.setOption(option, {notMerge: true});
this.myChart.setOption(option, true);
}
},
doSetAreaHorns({e}) {
@ -410,7 +447,7 @@ export default {
const elem = option.graphic[0].elements.find(el => { return ['area'].includes(el.subType) && el.model.areaNo == e.target.model.areaNo; });
option.graphic[0].elements = this.calcHornList(elemList, elem);
this.myChart.setOption(option, {notMerge: true});
this.myChart.setOption(option, true);
}
},
doPopDialog({e, pointInGrid, pointInPixel}) {
@ -518,7 +555,7 @@ export default {
e.target.point[0] += dx;
}
this.myChart.setOption(option, {notMerge: true});
this.myChart.setOption(option, true);
},
calcAreaDragging({e, pointInGrid}) {
const model = this.target.model;
@ -535,6 +572,7 @@ export default {
model.fartherKmRange += dy;
model.closerKmRange += dy;
this.planUtil.limitAreaTime(model);
if (this.planUtil.limitAreaKmRange(this.stations, model)) {
this.onZrMouseUp(e);
}
@ -589,6 +627,7 @@ export default {
break;
}
this.planUtil.limitAreaModel(model);
if (this.planUtil.limitAreaKmRange(this.stations, model)) {
this.onZrMouseUp(e);
}
@ -605,7 +644,7 @@ export default {
elem.style.textOffset = [ -args.width/2, -args.height/2 ];
option.graphic[0].elements = this.calcHornList(elemList, elem);
this.myChart.setOption(option, {notMerge: true});
this.myChart.setOption(option, true);
}
}
}

View File

@ -170,7 +170,7 @@ export default {
}
]
}
}
}
},
watch: {
width() {
@ -231,7 +231,7 @@ export default {
}
this.myChart = echarts.init(document.getElementById(this.canvasId));
this.myChart.setOption(this.option, {notMerge: true});
this.myChart.setOption(this.option, true);
this.reSize({ width: this.width, height: this.height });
resolve(true);
} catch (error) {
@ -248,7 +248,7 @@ export default {
this.xAxisInit(stations);
this.yAxisInit(stations);
this.myChart.setOption(this.option, {notMerge: true});
this.myChart.setOption(this.option, true);
this.myChart.hideLoading();
}
} catch (error) {
@ -292,7 +292,8 @@ export default {
}
}
this.myChart.setOption(option, {notMerge: true});
this.myChart.setOption(option, true);
this.setAreaClipPath();
if (this.model.choice == 'Plan') {
this.setLineLight();
@ -307,11 +308,11 @@ export default {
},
xAxisInit(stations) {
const option = this.option;
const startValue = 3600 * 6;
const offsetTime = 3600 / 2;
const startValue = this.planUtil.MinTime+this.planUtil.MaxTime/4;
const offsetTime = this.planUtil.MinTime+this.planUtil.MaxTime/48;
const list = [];
for (var time = 0 + this.planUtil.TranslationTime; time <= 3600 * 24 + this.planUtil.TranslationTime; time++) {
for (var time = this.planUtil.MinTime + this.planUtil.TranslationTime; time <= this.planUtil.MaxTime + this.planUtil.TranslationTime; time++) {
list.push(time);
}
@ -433,21 +434,21 @@ export default {
el.draggable = false;
})
this.myChart.setOption(option, {notMerge: true});
this.myChart.setOption(option, true);
},
clearTrip() {
const option = this.myChart.getOption();
const index = option.series.findIndex(el => { return el.name.includes('service-trip') });
if (index >= 0) {
option.series[index].data = [];
this.myChart.setOption(option, {notMerge: true});
this.myChart.setOption(option, true);
}
},
clearGraphic(labels=['drag', 'mark']) {
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});
this.myChart.setOption(option, true);
},
calcHornList(elemList, elem) {
const p = elem.position;
@ -464,6 +465,37 @@ export default {
elemList.push(utils.buildHornDataObj(point4, this.myChart.convertFromPixel('grid', point4), this, 'horn-4'));
return elemList;
},
setAreaClipPath() {
// const option = this.myChart.getOption();
// const mw = this.myChart.getWidth()-100;
// const mh = this.myChart.getHeight()-80;
// const view = this.myChart.getViewOfComponentModel({__viewId: "_ec_shape_graphic"});
// if (view.group) {
// view.group.eachChild(el => {
// if (['area'].includes(el.subType)) {
// const w = Math.abs(el.point2[0]-el.point1[0]);
// const h = Math.abs(el.point2[1]-el.point1[1]);
// const x = el.position[0] < 160
// ? 160 - el.position[0]
// : 0;
// const y = el.position[1] < 60
// ? 60 - el.position[1]
// : 0;
// const dw = el.position[0]+w > mw
// ? el.position[0]+w-mw
// : x;
// const dh = el.position[1]+h > mh
// ? el.position[1]+h-mh
// : y;
// const clipPath = new echarts.graphic.Rect({shape: {x, y, width: Math.abs(w-dw), height: Math.abs(h-dh)}});
// el.setClipPath(clipPath);
// el.dirty();
// }
// })
// }
}
}
};