This commit is contained in:
zyy 2020-10-23 15:09:33 +08:00
commit e9a5039c43
5 changed files with 104 additions and 47 deletions

View File

@ -69,7 +69,7 @@ export function createRectArea(opt, style={}) {
textAlign: 'center',
...style
},
z: 100
z: 50
}
}

View File

@ -1,8 +1,8 @@
<template>
<el-dialog v-dialogDrag append-to-body title="Add area content" :visible.sync="dialogShow" width="30%" :close-on-click-modal="false" :before-close="doClose">
<el-dialog v-dialogDrag append-to-body title="Add area note" :visible.sync="dialogShow" width="30%" :close-on-click-modal="false" :before-close="doClose">
<el-form ref="form" label-width="100px" :model="formModel" >
<el-form-item label="Start station" prop="text">
<el-input type="textarea" :rows="2" placeholder="Please enter the content." v-model="formModel.text" />
<el-form-item label="Note" prop="text">
<el-input type="textarea" :rows="3" placeholder="Please enter the note." v-model="formModel.text" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">

View File

@ -310,12 +310,6 @@ export default {
const startKmRange = data.startKmRange;
const endKmRange = data.endKmRange;
if (Math.abs(endTime - startTime) < 10*60) {
this.$refs.schedule.clearGraphic(['mark']);
this.$message.info('The time interval shall not be less than 10 min.')
return;
}
const model = {
fartherKmRange: startKmRange < endKmRange? data.endKmRange: data.startKmRange,
closerKmRange: startKmRange < endKmRange? data.startKmRange: data.endKmRange,

View File

@ -18,6 +18,7 @@ export default {
},
selected: null,
target: null,
drag: null,
dragging: false
}
},
@ -115,8 +116,11 @@ export default {
}
},
onZrMouseDown(e) {
this.pixelExecCb(e, args => {
this.doSetTarget(args);
this.doSetDrag(args);
});
if (e.target && ['area'].includes(e.target.subType)) {
this.pixelExecCb(e, this.doSetTarget);
if (this.model.choice == 'Construction') {
if (this.model.action == 'Note') {
this.pixelExecCb(e, this.doPopDialog);
@ -149,10 +153,9 @@ export default {
this.dragging = false;
}
// if (!e.target) {
// this.$emit('clear')
// }
if (!e.target) {
this.$emit('clear')
}
},
onZrMouseOut(e) {
},
@ -207,19 +210,21 @@ export default {
}
},
onShapeDragging(e) {
if (this.selected &&
this.model.choice == 'Plan') {
if (this.selected) {
if(this.model.choice == 'Plan') {
if (this.model.action == 'Translate') {
this.pixelExecCb(e, this.doSeriesDragging);
}
} else if (this.target &&
this.model.choice == 'Construction') {
}
} else if (this.target) {
if (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);
}
}
}
},
onShapeMouseOut(e) {
if (this.selected) {
@ -293,16 +298,30 @@ export default {
}
},
doSetTarget({e, pointInGrid}) {
if (e.target && ['area'].includes(e.target.subType)) {
const target = e.target;
const model = target.model
if (e.target) {
if (['area'].includes(e.target.subType)) {
const model = e.target.model
Object.assign(model, {
_x: pointInGrid[0],
_y: pointInGrid[1]
})
this.target = e.target;
this.$emit('tag', target);
this.$emit('tag', e.target);
}
}
},
doSetDrag({e, pointInGrid}) {
if (e.target) {
if (['drag'].includes(e.target.subType)) {
const model = e.target.model
Object.assign(model, {
_x: pointInGrid[0],
_y: pointInGrid[1]
})
this.drag = e.target;
}
}
},
doSetSelected({e, pointInGrid}) {
@ -372,6 +391,7 @@ export default {
const model = this.target.model;
const graph = option.graphic[0].elements.find(el => { return ['area'].includes(el.subType) && el.model.areaNo == model.areaNo; });
graph.z = 90;
graph.draggable = true;
graph.ondrag = echarts.util.curry(this.onShapeDragging);
@ -494,40 +514,81 @@ export default {
}
},
doAreaHornDragging({e, pointInGrid}) {
if (e.target && ['drag'].includes(e.target.subType)) {
if (this.drag && ['drag'].includes(this.drag.subType)) {
this.dragging = true;
const option = this.myChart.getOption();
const drag = this.drag;
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;
const index = elemList.findIndex(el => { return drag.name == el.name; });
model._x = pointInGrid[0];
model._y = pointInGrid[1];
const time = pointInGrid[0];
const kmRange = this.planUtil.getKmRangeByCoordinateY(pointInGrid[1]);
const obj = Object.assign({}, model);
switch(index) {
case 0:
model.startTime += dx;
model.fartherKmRange += dy;
if (time < model.endTime) {
model.startTime = time;
}
if (model.closerKmRange < kmRange) {
model.fartherKmRange = kmRange;
}
break;
case 1:
model.endTime += dx;
model.fartherKmRange += dy;
if (model.startTime < time) {
model.endTime = time;
}
if (model.closerKmRange < kmRange) {
model.fartherKmRange = kmRange;
}
break;
case 2:
model.endTime += dx;
model.closerKmRange += dy;
if (model.startTime < time) {
model.endTime = time;
}
if (kmRange < model.fartherKmRange) {
model.closerKmRange = kmRange;
}
break;
case 3:
model.startTime += dx;
model.closerKmRange += dy;
if (time < model.endTime) {
model.startTime = time;
}
if (kmRange < model.fartherKmRange) {
model.closerKmRange = kmRange;
}
break;
}
// switch(index) {
// case 0:
// obj.startTime = time;
// obj.fartherKmRange = kmRange;
// break;
// case 1:
// obj.endTime = time;
// obj.fartherKmRange = kmRange;
// break;
// case 2:
// obj.endTime = time;
// obj.closerKmRange = kmRange;
// break;
// case 3:
// obj.startTime = time;
// obj.closerKmRange = kmRange;
// break;
// }
// model.startTime = obj.startTime < obj.endTime ? obj.startTime: obj.endTime;
// model.endTime = obj.startTime < obj.endTime ? obj.endTime: obj.startTime;
// model.closerKmRange = obj.closerKmRange < obj.fartherKmRange ? obj.closerKmRange: obj.fartherKmRange;
// model.fartherKmRange = obj.closerKmRange < obj.fartherKmRange ? obj.fartherKmRange: obj.closerKmRange;
if (this.planUtil.limitAreaKmRange(this.stations, model)) {
this.onZrMouseUp(e);
}

View File

@ -265,6 +265,7 @@ export default {
if (this.model.choice == 'Construction') {
const elemList = option.graphic[0].elements.filter(el => { return el.subType == 'area'});
elemList.forEach(el => {
el.z = 50,
el.draggable = true;
el.ondrag = echarts.util.curry(this.onShapeDragging);
})
@ -373,6 +374,7 @@ export default {
const elemList = elements.filter(el => { return labels.includes(el.subType)});
elemList.forEach(el => {
el.z = 50;
el.draggable = false;
el.ondrag = null;
})