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

增加AUS线路编辑功能，以及调整增加运行图组后的接口

Browse Source
This commit is contained in:
lVAL 2020-10-28 15:01:14 +08:00
parent 1efa433841
commit 5f48a7743e
19 changed files with 540 additions and 676 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
src/api/rpTools.js
View File

@ -1,5 +1,36 @@
import request from '@/utils/request';
/**
* 查询线路列表
*/
export function listLines() {
return request({
url: `/api/rpTools/map`,
method: 'get'
})
}
/**
* 查询线路列表
*/
export function listStations(lineId) {
return request({
url: `/api/rpTools/${lineId}/station`,
method: 'get'
})
}
/**
* 更新线路车站
*/
export function updateStation(lineId, data) {
return request({
url: `/api/rpTools/station/${lineId}`,
method: 'put',
data
})
}
/**
* 查询运行图列表
*/
@ -22,11 +53,11 @@ export function createRp(data) {
}
/**
* 删除运行图
* 删除运行图组
*/
export function deleteRp(planId) {
export function deleteRp(groupId) {
return request({
url: `/api/rpTools/${planId}`,
url: `/api/rpTools/${groupId}`,
method: 'delete'
})
}

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

@ -1,268 +0,0 @@
import { createSeriesModel, createMarkLineModels, createMartPoint } from './utils';
import { toTimeStamp } from '@/utils/date';
export default {
/** 边缘高度*/
EdgeHeight: 600,
/** 间隔高度*/
CoordMultiple: 1,
/** 偏移时间*/
TranslationTime: 0,
/** 将后台数据解析成图形*/
parseDataToGraph(chart, planData, stations, kmRangeCoordinateMap) {
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.getCoordinateYByObj(stations, kmRangeCoordinateMap, {stationCode: area.fartherStationCode});
const closerKm = this.getCoordinateYByObj(stations, kmRangeCoordinateMap, {stationCode: 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({
type: 'rect',
subType: 'area',
areaNo: area.areaNo,
position,
point1,
point2,
model: area,
shape: {
x: 0,
y: 0,
width,
height
},
style: {
fill: 'rgb(255,0,0, 0.3)',
stroke: 'rgb(255, 0, 0, 0.8)'
},
z: 100
})
})
}
return graphs;
},
/** 将后台数据解析成折线*/
parseDataToSeries(chart, planData, stations, kmRangeCoordinateMap) {
const models = [];
if (planData &&
planData.serviceList &&
planData.serviceList.length) {
planData.serviceList.forEach((service,i) => {
if (service.tripList &&
service.tripList.length) {
service.tripList.forEach((trip,j) => {
const opt = {
name: `plan-${service.serviceNo}-${trip.tripNo}-${trip.direction}`,
type: 'line',
symbolSize: 1,
showAllSymbol: true,
markPoint: { data: [] },
data: []
};
var lastPoint = null;
var nextPoint = null;
var pointData = {
name: `${service.serviceNo}-${trip.tripNo}`,
color: '#000',
direction: trip.direction,
coord: [trip.stationTimeList[0].departureTime, this.getCoordinateYByObj(stations, kmRangeCoordinateMap, trip.stationTimeList[0], trip.direction, false)],
};
opt.markPoint.data.push(createMartPoint(pointData));
trip.stationTimeList.forEach(elem => {
const name = `${trip.direction}${trip.tripNo}`;
if (elem.arrivalTime) {
opt.data.push([elem.arrivalTime, this.getCoordinateYByObj(stations, kmRangeCoordinateMap, elem, elem.direction, false), {
stationCode: elem.stationCode,
serviceNo: service.serviceNo,
tripNo: trip.tripNo,
direction: trip.direction,
name
}]);
}
if (elem.departureTime) {
opt.data.push([elem.departureTime, this.getCoordinateYByObj(stations, kmRangeCoordinateMap, elem, elem.direction, false), {
stationCode: elem.stationCode,
serviceNo: service.serviceNo,
tripNo: trip.tripNo,
direction: trip.direction,
name
}]);
}
});
const model = createSeriesModel(opt,
{ color: '#000', width: 1 },
{ color: '#000', fill: '#000'}
);
models.push(model);
if (service.tripList[j + 1] &&
service.tripList[j + 1].stationTimeList) {
const opt = {
name: `reentry-${service.serviceNo}-${trip.tripNo}-${trip.direction}`,
type: 'line',
symbolSize: 1,
showAllSymbol: false,
markPoint: { data: [] },
data: []
};
lastPoint = trip.stationTimeList[trip.stationTimeList.length-1];
nextPoint = service.tripList[j + 1].stationTimeList[0];
const name = `${trip.direction}${trip.tripNo}`;
opt.data.push([lastPoint.arrivalTime, this.getCoordinateYByObj(stations, kmRangeCoordinateMap, lastPoint, trip.direction, false), {
stationCode: lastPoint.stationCode,
serviceNo: service.serviceNo,
tripNo: trip.tripNo,
direction: trip.direction,
name
}]);
opt.data.push([lastPoint.arrivalTime, this.getCoordinateYByObj(stations, kmRangeCoordinateMap, lastPoint, trip.direction, true), {
stationCode: lastPoint.stationCode,
serviceNo: service.serviceNo,
tripNo: trip.tripNo,
direction: trip.direction,
name
}]);
opt.data.push([nextPoint.departureTime, this.getCoordinateYByObj(stations, kmRangeCoordinateMap, lastPoint, trip.direction, true), {
stationCode: lastPoint.stationCode,
serviceNo: service.serviceNo,
tripNo: trip.tripNo,
direction: trip.direction,
name
}]);
opt.data.push([nextPoint.departureTime, this.getCoordinateYByObj(stations, kmRangeCoordinateMap, lastPoint, trip.direction, false), {
stationCode: lastPoint.stationCode,
serviceNo: service.serviceNo,
tripNo: trip.tripNo,
direction: trip.direction,
name
}]);
const model = createSeriesModel(opt,
{ color: '#000', width: 1 },
{ color: '#000', fill: '#000'}
);
models.push(model);
}
});
}
})
}
return models;
},
/** 更新数据并解析成折线*/
updateDataToModels(chart, planData, stations, kmRangeCoordinateMap, series) {
if (planData && planData.length) {
}
return series;
},
/** 初始化Y轴*/
initializeYaxis(stations) {
return createMarkLineModels(stations, (elem) => {
return this.EdgeHeight + elem.kmRange * this.CoordMultiple;
});
},
/** 将后台数据转换为试图序列模型*/
convertStationsToMap(stations) {
var map = {};
if (stations && stations.length) {
stations.forEach((elem) => {
map[`${elem.kmRange}`] = this.EdgeHeight + elem.kmRange * this.CoordMultiple;
});
}
return map;
},
/** 计算y轴最小值*/
computedYaxisMinValue(stations) {
return stations[0].kmRange * this.CoordMultiple;
},
/** 计算y轴最大值*/
computedYaxisMaxValue(stations) {
return stations[stations.length - 1].kmRange * this.CoordMultiple + this.EdgeHeight * 2;
},
/** 格式化y轴数据*/
computedFormatYAxis(stations, params) {
var yText = '0m';
stations.forEach(elem => {
if (elem.kmRange < parseInt(params.value) / this.CoordMultiple - this.EdgeHeight) {
yText = Math.floor(elem.kmRange) + 'm';
}
});
return yText;
},
/** 根据方向计算y折返偏移量*/
getYvalueByDirectionCode(defaultVlue, direction) {
if (direction === '1') {
defaultVlue -= this.EdgeHeight / 2;
} else if (direction === '2') {
defaultVlue += this.EdgeHeight / 2;
}
return defaultVlue;
},
/** 根据elem计算y值*/
getCoordinateYByObj(stations, kmRangeCoordinateMap, obj, direction, isSpecial) {
var defaultVlue = 0;
var station = stations.find(it => { return it.code == obj.stationCode; });
if (station) {
defaultVlue = kmRangeCoordinateMap[`${station.kmRange}`];
if (isSpecial) {
defaultVlue = this.getYvalueByDirectionCode(defaultVlue, direction);
}
}
return defaultVlue;
},
/** 通过y坐标获取站信息 */
getStationByCoordinateY(stations, y) {
for(var i = stations.length-1; i >= 0; i--) {
const station = stations[i];
const edge = this.EdgeHeight
const preKm = i == 0? edge*2: Math.abs(station.kmRange-stations[i-1].kmRange)/2;
const nxtKm = i == stations.length-1? edge: Math.abs(station.kmRange-stations[i+1].kmRange)/2;
const min = edge + station.kmRange - preKm;
const max = edge + station.kmRange + nxtKm;
if (y >= min && y <= max) {
return station;
}
}
return null;
}
};

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

@ -1,188 +0,0 @@
import { createMartPoint, createSeriesModel, createMarkLineModels, hexColor, prefixTime, convertSheetToList } from '@/utils/runPlan';
import { toTimeStamp } from '@/utils/date';
export default {
/** 边缘高度*/
EdgeHeight: 3,
/** 间隔高度*/
CoordMultiple: 3,
/** 偏移时间*/
TranslationTime: 0,
/** 将后台数据解析成图形*/
parseDataToGraph(chart, planData, stations, kmRangeCoordMap) {
const graphs = [];
if (planData &&
planData.areaList &&
planData.areaList.length) {
planData.areaList.forEach(el => {
const startTime = toTimeStamp(el.startTime);
const endTime = toTimeStamp(el.endTime);
const fartherKm = this.getCoordYByObj(stations, kmRangeCoordMap, {stationCode: el.fartherStationCode});
const closerKm = this.getCoordYByObj(stations, kmRangeCoordMap, {stationCode: el.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({
type: 'rect',
subType: 'area',
areaNo: el.areaNo,
position,
point1,
point2,
model: el,
shape: {
x: 0,
y: 0,
width,
height
},
style: {
fill: 'rgb(255,0,0, 0.3)',
stroke: 'rgb(255, 0, 0, 0.8)'
},
z: 100
})
})
}
return graphs;
},
/** 将后台数据解析成折线*/
parseDataToSeries(chart, planData, stations, kmRangeCoordMap) {
var models = [];
/** 按车次遍历数据*/
if (planData && planData.length) {
planData.forEach(trip => {
const opt = {
name: `plan-${trip.tripNo}`,
type: 'line',
symbolSize: 1,
showAllSymbol: true,
lineStyle: {
color: '#000',
width: 1,
},
itemStyle: {
color: '#000',
fill: '#000'
},
markPoint: { data: [] },
data: []
};
/** 计算停站点坐标集合*/
trip.stationTimeList.forEach((elem,idx) => {
if (elem.arrivalTime) {
opt.data.push([elem.arrivalTime, this.getCoordYByObj(stations, kmRangeCoordMap, elem), elem.stationCode, trip.tripNo]);
}
if (elem.departureTime) {
opt.data.push([elem.departureTime, this.getCoordYByObj(stations, kmRangeCoordMap, elem), elem.stationCode, trip.tripNo]);
}
});
models.push(opt);
});
}
return models;
},
/** 更新数据并解析成折线*/
updateDataToModels(chart, planData, stations, kmRangeCoordMap, runPlanData, series) {
if (planData && planData.length) {
}
return series;
},
/** 将后台数据转换为试图序列模型*/
convertStationsToMap(stations) {
var map = {};
if (stations && stations.length) {
stations.forEach((elem, index) => {
map[`${elem.kmRange}`] = this.EdgeHeight + index * this.CoordMultiple;
});
}
return map;
},
/** 初始化Y轴*/
initializeYaxis(stations) {
return createMarkLineModels(stations, (elem, index) => {
return this.EdgeHeight + index * this.CoordMultiple;
});
},
/** 计算y轴最小值*/
computedYaxisMinValue() {
return 0;
},
/** 计算y轴最大值*/
computedYaxisMaxValue(stations) {
return this.EdgeHeight * 2 + (stations.length - 1) * this.CoordMultiple;
},
/** 格式化y轴数据*/
computedFormatYAxis(stations, params) {
var yText = '0m';
var index = Math.floor((parseInt(params.value) - this.EdgeHeight) / this.CoordMultiple);
if (index >= 0 && index < stations.length) {
yText = Math.floor(stations[index].kmRange) + 'm';
}
return yText;
},
/** 根据方向计算y折返偏移量*/
getYvalueByDirectionCode(defaultVlue, directionCode) {
if (directionCode === '1') {
defaultVlue -= this.EdgeHeight / 2;
} else if (directionCode === '2') {
defaultVlue += this.EdgeHeight / 2;
}
return defaultVlue;
},
/** 根据elem计算y值*/
getCoordYByObj(stations, kmRangeCoordMap, elem, directionCode, isSpecial) {
var defaultVlue = 0;
var station = stations.find(it => { return it.code == elem.stationCode; });
if (station) {
defaultVlue = kmRangeCoordMap[`${station.kmRange}`];
if (isSpecial) {
defaultVlue = this.getYvalueByDirectionCode(defaultVlue, directionCode);
}
}
return defaultVlue;
},
/** 通过y坐标获取站信息*/
getStationByCoordinateY(stations, y) {
for(var i = stations.length-1; i >= 0; i--) {
const station = stations[i];
const edge = this.EdgeHeight;
const rate = this.CoordMultiple;
const preKm = i == 0? edge*2: rate/2;
const nxtKm = i == stations.length-1? edge: rate/2;
const min = edge + i*rate - preKm;
const max = edge + i*rate + nxtKm;
if (y >= min && y <= max) {
return station;
}
}
return null;
}
};

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

@ -78,15 +78,15 @@ export default {
name: `${service.serviceNo}-${trip.tripNo}`,
color: '#000',
direction: trip.direction,
coord: [trip.stationTimeList[0].departureTime, this.getCoordinateYByStationCode(stations, trip.stationTimeList[0].stationCode)],
coord: [trip.stationTimeList[0].departureTime, this.getCoordinateYByStationId(stations, trip.stationTimeList[0].stationId)],
};
opt.markPoint.data.push(createMartPoint(pointData));
trip.stationTimeList.forEach(elem => {
if (elem.arrivalTime) {
opt.data.push([elem.arrivalTime, this.getCoordinateYByStationCode(stations, elem.stationCode), {
stationCode: elem.stationCode,
opt.data.push([elem.arrivalTime, this.getCoordinateYByStationId(stations, elem.stationId), {
stationId: elem.stationId,
serviceNo: service.serviceNo,
tripNo: trip.tripNo,
direction: trip.direction,
@ -95,8 +95,8 @@ export default {
}
if (elem.departureTime) {
opt.data.push([elem.departureTime, this.getCoordinateYByStationCode(stations, elem.stationCode), {
stationCode: elem.stationCode,
opt.data.push([elem.departureTime, this.getCoordinateYByStationId(stations, elem.stationId), {
stationId: elem.stationId,
serviceNo: service.serviceNo,
tripNo: trip.tripNo,
direction: trip.direction,
@ -112,8 +112,8 @@ export default {
nextPoint = service.tripList[j + 1].stationTimeList[0];
opt.data.push({
value: [lastPoint.arrivalTime, this.getCoordinateYByStationCode(stations, lastPoint.stationCode, true, trip.direction), {
stationCode: lastPoint.stationCode,
value: [lastPoint.arrivalTime, this.getCoordinateYByStationId(stations, lastPoint.stationId, true, trip.direction), {
stationId: lastPoint.stationId,
serviceNo: service.serviceNo,
tripNo: trip.tripNo,
direction: trip.direction,
@ -123,8 +123,8 @@ export default {
symbolSize: 1,
});
opt.data.push({
value: [nextPoint.departureTime, this.getCoordinateYByStationCode(stations, lastPoint.stationCode, true, trip.direction), {
stationCode: lastPoint.stationCode,
value: [nextPoint.departureTime, this.getCoordinateYByStationId(stations, lastPoint.stationId, true, trip.direction), {
stationId: lastPoint.stationId,
serviceNo: service.serviceNo,
tripNo: trip.tripNo,
direction: trip.direction,
@ -209,9 +209,9 @@ export default {
},
/** 通过站信息获取y坐标*/
getCoordinateYByStationCode(stations, stationCode, isSpecial=false, direction='01') {
getCoordinateYByStationId(stations, stationId, isSpecial=false, direction='01') {
var value = 0;
var station = stations.find(it => { return it.code == stationCode; });
var station = stations.find(it => { return it.id == stationId; });
if (station) {
value = this.getCoordinateYByKmRange(station.kmRange) + this.getOffsetY(isSpecial, direction);
}

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

@ -209,16 +209,6 @@ export function formatTime(time) {
}
}
/** 通过code将名称格式化*/
export function formatName(code) {
let name = '';
const device = store.getters['map/getDeviceByCode'](code);
if (device) {
name = device.name;
}
return name;
}
/** 将时间格式化前补零*/
export function prefixTime(time) {
let str = `${time}` || '';

18
src/views/planMonitor/editToolAUS/components/drawer.vue
View File

@ -1,7 +1,7 @@
<template>
<div class="drawer" :class="{visible}" tabindex="-1">
<div class="drawer__wrapper" tabindex="-1" @click="doClose">
<div class="layer" :class="[direction]" :style="{width: width+'px'}" tabindex="-1">
<div class="drawer__wrapper" @click.self="doClose">
<div class="layer" :class="[direction]" :style="{width: width+'px'}">
<div class="title">
<span>
<slot name="title" />
@ -50,7 +50,7 @@ export default {
<style lang="scss" scoped>
.visible {
visibility: visible !important;
.ltr {
.layer {
transform: translateX(0) !important;
}
}
@ -64,6 +64,15 @@ export default {
transform: translateX(-100%);
}
.rtl {
transition: all .3s cubic-bezier(.7, .3, .1, 1);
position: absolute;
height: 100%;
top: 0;
right: 0;
transform: translateX(100%);
}
.drawer {
position: fixed;
z-index: 2001;
@ -76,7 +85,7 @@ export default {
visibility: hidden;
&__wrapper {
position: relative;
position: absolute;
left: 0;
right: 0;
top: 0;
@ -90,7 +99,6 @@ export default {
border: 1px solid #eee;
box-shadow: 0 8px 10px -5px rgba(0,0,0,.2), 0 16px 24px 2px rgba(0,0,0,.14), 0 6px 30px 5px rgba(0,0,0,.12);
overflow: hidden;
position: relative;
.title {
display: flex;

179
src/views/planMonitor/editToolAUS/line/index.vue
View File

@ -6,18 +6,11 @@
<i class="el-icon-document" />
</template>
<el-menu-item-group>
<span slot="title">Line List</span>
<span slot="title">线路列表</span>
<el-tree :data="lineList" :props="defaultProps" @node-click="onSelectLine">
<template slot-scope="{data}">
<span class="flex" >
<span class="flex" style="padding-right: 20px">
<span><i class="el-icon-document"/>&ensp;{{data.name}}</span>
<el-button
type="text"
style="color:red"
size="mini"
@click="doDeletePlan(data)">
Delete
</el-button>
</span>
</template>
</el-tree>
@ -25,22 +18,35 @@
</el-submenu>
</el-menu>
<div class="container">
<div class="title">
<span>title</span>
</div>
<div class="form">
11111111111
<el-card class="card" shadow="never">
<div slot="header" class="clearfix">
<span>{{ title||'请选择线路' }}</span>
</div>
<stations :list="stationList" @select="onSelectStation">
<template slot-scope="{data}">
<div class="line">公里标：{{data.kmRange}}m</div>
<div class="line">中转站：{{data.transferable? '是': '否'}}</div>
<div class="line">上行容量：{{data.upReception}}</div>
<div class="line">下行容量：{{data.downReception}}</div>
</template>
</stations>
</el-card>
</div>
<modify ref="modfiy" @update="onUpdateStation" />
</div>
</template>
<script>
import Drawer from '../components/drawer.vue';
import Stations from './stations';
import Modify from './modify';
import { listLines, listStations, updateStation } from '@/api/rpTools';
export default {
components: {
Drawer
Drawer,
Stations,
Modify
},
data() {
return {
@ -48,54 +54,57 @@ export default {
children: 'children',
label: 'name'
},
lineList: [
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
{name: '1', id: 1},
{name: '2', id: 2},
]
lineList: [],
stationList: []
}
},
computed: {
lineId() {
return this.$route.query.lineId;
},
title() {
return this.$route.query.title;
}
},
watch: {
$route: function() {
this.refreshStationList();
}
},
mounted() {
this.loadInitData();
this.refreshStationList();
},
methods: {
loadInitData() {
listLines().then(resp => {
this.lineList = resp.data;
}).catch(error => {
this.$message.info(error.message);
})
},
refreshStationList() {
if (this.lineId) {
listStations(this.lineId).then(resp => {
this.stationList = resp.data;
}).catch(error => {
this.$message.info(error.message);
})
}
},
onSelectLine(el) {
this.$router.replace({ path: 'AUSline', query: { lineId: el.id, title: el.name }});
},
onSelectStation(el) {
this.$refs.modfiy.doShow(el);
},
onUpdateStation(el) {
updateStation(this.lineId, el).then(resp => {
this.refreshStationList();
this.$message.success('修改成功。')
}).catch(error => {
this.$message.info(error.message);
})
}
}
}
@ -114,22 +123,48 @@ export default {
.container {
flex: 1;
.title {
width: 100%;
height: 32px;
font-size: 26px;
padding: 7px;
background: rgba(240,240,240,0.3);
display: flex;
justify-content: center;
align-items: center;
.card {
width: 60%;
margin: auto;
height: calc(100% - 10px);
/deep/ {
.el-card__body {
height: 100%;
overflow-y: auto;
&::-webkit-scrollbar {
width: 5px;
height: 5px;
}
&::-webkit-scrollbar-track {
background: rgb(239, 239, 239);
border-radius: 2px;
}
&::-webkit-scrollbar-thumb {
background: #bfbfbf;
border-radius: 10px;
}
&::-webkit-scrollbar-thumb:hover {
background: #666;
}
&::-webkit-scrollbar-corner {
background: #fff;
}
}
}
.form {
padding: 30px;
width: 50%;
margin: auto;
.line {
line-height: 28px;
height: 28px;
}
}
}
}
.flex {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
}
</style>

114
src/views/planMonitor/editToolAUS/line/modify.vue Normal file
View File

@ -0,0 +1,114 @@
<template>
<drawer :visible.sync="drawer" direction="rtl" :width="600" @before-close="e => drawer=false">
<template slot="title">修改表单</template>
<div class="container" v-if="model">
<el-form class="form" :model="model" :rules="rules" ref="form" label-width="100px" >
<el-form-item label="车站名称" prop="name">
<el-input v-model="model.name"></el-input>
</el-form-item>
<el-form-item label="公里标" prop="kmRange">
<el-input-number v-model="model.kmRange" controls-position="right" :min="0" /><span>m</span>
</el-form-item>
<el-form-item label="中转站" prop="transferable">
<el-checkbox v-model="model.transferable" />
</el-form-item>
<el-form-item label="上行容量" prop="upReception">
<el-input-number v-model="model.upReception" controls-position="right" :min="1" />
</el-form-item>
<el-form-item label="上行容量" prop="downReception">
<el-input-number v-model="model.downReception" controls-position="right" :min="1" />
</el-form-item>
</el-form>
<div class="footer">
<el-button type="primary" @click="doSubmit('form')">更新</el-button>
<el-button @click="drawer=false">取消</el-button>
</div>
</div>
</drawer>
</template>
<script>
import Drawer from '../components/drawer.vue';
export default {
components: {
Drawer
},
data() {
return {
drawer: false,
model: {
name: '',
kmRange: 0,
transferable: false,
upReception: 1,
downReception: 1
}
}
},
computed: {
rules() {
return {
name: [
{ required: true, message: '请输入车站名称', trigger: 'blur' }
],
kmRange: [
{ required: true, type: 'number', min: 0, message: '车站公里标不能小于0', trigger: 'blur' }
],
transferable: [
{ required: true, message: '请选择是否中转站', trigger: 'blur' },
],
upReception: [
{ required: true, type: 'number', min: 1, message: '请输入上行容量', trigger: 'blur' }
],
downReception: [
{ required: true, type: 'number', min: 1, message: '请输入下行容量', trigger: 'blur' }
]
}
}
},
methods: {
doShow(model) {
this.model = {
name: model.name,
kmRange: model.kmRange,
transferable: model.transferable,
upReception: model.upReception,
downReception: model.downReception
};
this.drawer = true;
},
doClose() {
this.drawer = false;
this.model = null;
},
doSubmit(name) {
this.$refs[name].validate((valid) => {
if (valid) {
this.$emit('update', {...this.model});
this.drawer = false;
}
});
}
}
}
</script>
<style lang="scss" scoped>
.container {
height: calc(100% - 20px);
.form {
padding: 30px;
}
.footer {
position: absolute;
bottom: 0;
width: 100%;
text-align: right;
padding: 5px 20px;
background: #f1f1f1;
}
}
</style>

50
src/views/planMonitor/editToolAUS/line/stations.vue Normal file
View File

@ -0,0 +1,50 @@
<template>
<div class="container">
<template v-if="list.length" >
<el-card class="el" v-for="(el,i) in list" :key="i" shadow="hover">
<div slot="header" class="clearfix">
<span>{{el.name}}</span>
</div>
<div style="padding: 30px 80px">
<slot :data="el" />
</div>
<div class="clearfix" style="text-align:right">
<el-button type="text" @click.stop="onSelect(el)">编辑</el-button>
</div>
</el-card>
</template>
<template v-else>
<span>暂无数据</span>
</template>
</div>
</template>
<script>
export default {
props: {
list: {
type: Array,
required: true
}
},
data() {
return {
}
},
methods: {
onSelect(el) {
this.$emit('select', el)
}
}
}
</script>
<style lang="scss" scoped>
.container {
padding: 0 50px;
.el {
padding: 30px 50px;
margin: 10px 0;
}
}
</style>

20
src/views/planMonitor/editToolAUS/dialog/planCreate.vue → src/views/planMonitor/editToolAUS/tool/dialog/planCreate.vue
View File

@ -4,6 +4,11 @@
<el-form-item label="Name" prop="name">
<el-input v-model="formModel.name" placeholder="Please Input Run Plan Name." />
</el-form-item>
<el-form-item label="Lines" prop="maps">
<el-select v-model="formModel.maps" multiple filterable placeholder="Please Select Lines.">
<el-option v-for="item in lineList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogShow = false">{{ $t('map.cancel') }}</el-button>
@ -13,20 +18,32 @@
</template>
<script>
import { MenuEnum } from '../utils.js';
import { MenuEnum } from '../../utils.js';
export default {
props: {
lineList: {
type: Array,
required: true
}
},
data() {
return {
dialogShow: false,
formModel: {
name: '',
maps: []
},
rules: {
name: [
{
required: true, message: 'Please Input Run Plan Name.', trigger: 'blur'
}
],
maps: [
{
required: true, type: 'array', message: 'Please Select Lines.', trigger: 'change'
}
]
}
};
@ -38,6 +55,7 @@ export default {
methods: {
doShow() {
this.formModel.name = '';
this.formModel.lineList = [];
this.dialogShow = true;
},
doClose() {

2
src/views/planMonitor/editToolAUS/dialog/planExport.vue → src/views/planMonitor/editToolAUS/tool/dialog/planExport.vue
View File

@ -11,7 +11,7 @@
</template>
<script>
import * as utils from '../utils'
import * as utils from '../../utils'
import echarts from 'echarts';
import { timeFormat } from '@/utils/date';

2
src/views/planMonitor/editToolAUS/dialog/planJustRunning.vue → src/views/planMonitor/editToolAUS/tool/dialog/planJustRunning.vue
View File

@ -14,7 +14,7 @@
</template>
<script>
import { MenuEnum } from '../utils.js';
import { MenuEnum } from '../../utils.js';
export default {
props: {

2
src/views/planMonitor/editToolAUS/dialog/planJustStop.vue → src/views/planMonitor/editToolAUS/tool/dialog/planJustStop.vue
View File

@ -14,7 +14,7 @@
</template>
<script>
import { MenuEnum } from '../utils.js';
import { MenuEnum } from '../../utils.js';
export default {
props: {

2
src/views/planMonitor/editToolAUS/dialog/planJustTurnback.vue → src/views/planMonitor/editToolAUS/tool/dialog/planJustTurnback.vue
View File

@ -14,7 +14,7 @@
</template>
<script>
import { MenuEnum } from '../utils.js';
import { MenuEnum } from '../../utils.js';
export default {
props: {

2
src/views/planMonitor/editToolAUS/dialog/planSetParams.vue → src/views/planMonitor/editToolAUS/tool/dialog/planSetParams.vue
View File

@ -34,7 +34,7 @@
</template>
<script>
import { MenuEnum } from '../utils.js';
import { MenuEnum } from '../../utils.js';
export default {
props: {

142
src/views/planMonitor/editToolAUS/tool/index.vue
View File

@ -19,7 +19,7 @@
<template slot="header">
<div class="header">
<div class="menus-left">
<el-button type="primary" @click="drawer=true">Open</el-button>
<el-button type="primary" @click="doOpenPlan">Open</el-button>
<el-button type="primary" @click="doNewPlan">New</el-button>
<el-button type="primary" :disabled="disabled" @click="onDialog(MenuEnum.planSetParams)">Set Param</el-button>
<el-button type="primary" @click="doExport" :disabled="disabled"> Export </el-button>
@ -39,31 +39,18 @@
</template>
</schedule>
<drawer :visible.sync="drawer" @before-close="e => drawer=false">
<template slot="title">Run Plan List</template>
<el-tree style="padding-right: 20px" :data="planList" :props="defaultProps" @node-click="onSelectPlan">
<template slot-scope="{data}">
<span class="flex" >
<span><i class="el-icon-document"/>&ensp;{{data.name}}</span>
<el-button
type="text"
style="color:red"
size="mini"
@click="doDeletePlan(data)">
Delete
</el-button>
</span>
</template>
</el-tree>
</drawer>
<list ref="list" :planList="planList" @select="doSelectPlan" @delete="doDeletePlan" />
<plan-just-running :config="config" :selected="selected" :stations="stations" @justRunning="doJustRunning" />
<plan-just-stop :config="config" :selected="selected" @justStop="doJustStop"/>
<plan-just-turnback :config="config" :selected="selected" @justTurnBack="doJustTurnback"/>
<plan-set-params :config="config" @setParams="doSetPlanParams" />
<plan-create ref="create" @createPlan="doCreatePlan" />
<plan-create ref="create" :lineList="lineList" @createPlan="doCreatePlan" />
<plan-export ref="export" :planUtil="planUtil" :title="title" :width="3600*2+2050" :height="height-160" />
<div class="fixed" v-show="show">
<textarea :auto-focus="true" v-if="textareaModel.show" v-focus v-model="textareaModel.text" class="fixed-textarea"
:style="{ left: rect.x+'px', top: rect.y+'px', width: rect.width+'px', height: rect.height+'px', }"/>
@ -73,20 +60,20 @@
</template>
<script>
import PlanJustRunning from '../dialog/planJustRunning.vue';
import PlanJustStop from '../dialog/planJustStop.vue';
import PlanJustTurnback from '../dialog/planJustTurnback.vue';
import PlanSetParams from '../dialog/planSetParams.vue';
import PlanCreate from '../dialog/planCreate.vue';
import PlanExport from '../dialog/planExport.vue';
import PlanJustRunning from './dialog/planJustRunning.vue';
import PlanJustStop from './dialog/planJustStop.vue';
import PlanJustTurnback from './dialog/planJustTurnback.vue';
import PlanSetParams from './dialog/planSetParams.vue';
import PlanCreate from './dialog/planCreate.vue';
import PlanExport from './dialog/planExport.vue';
import Schedule from './schedule.vue';
import Menus from './menus.vue';
import Drawer from '../components/drawer.vue';
import List from './list.vue';
import * as utils from '../utils.js';
import { timeFormat } from '@/utils/date';
import { mapGetters } from 'vuex';
import { getStationList } from '@/api/runplan';
import {
listLines, listStations,
listRps, createRp, deleteRp,
getRpTools, clearRpPlan, addRpTrip, delRpTrip,
justTripNoRunning, justTripNoStop, justTripTurnBack,
@ -105,16 +92,12 @@ export default {
PlanCreate,
PlanExport,
Menus,
Drawer,
List
},
data() {
return {
defaultProps: {
children: 'children',
label: 'name'
},
drawer: false,
planList: [],
lineList: [],
stations: [],
planData: {},
selected: null,
@ -157,15 +140,15 @@ export default {
},
height() {
return this.$store.state.app.height - 72;
},
planId() {
return this.$route.query.planId;
},
title() {
return this.$route.query.title||'';
},
mapId() {
return 9;
planId() {
return this.$route.query.planId;
},
lineId() {
return this.$route.query.lineId;
},
lineCode() {
return '00';
@ -190,25 +173,35 @@ export default {
},
mounted() {
this.setPosition();
this.loadPlanList();
this.loadPlanData();
},
methods: {
buildPlanList(list) {
return list.map(el => {
if (el.planList &&
el.planList.length) {
el.planList = el.planList.map(it => {
return {
id: it.id,
isPlan: true,
name: it.mapName,
lineId: it.mapId,
}
})
}
return el;
})
},
setPosition() {
this.$nextTick(() => {
this.$store.dispatch('rpTools/resize', { width: this.width, height: this.height });
});
},
loadPlanList() {
listRps().then(resp => {
this.planList = resp.data;
})
},
loadPlanData() {
getStationList(this.mapId).then(resp => {
const stations = this.stations = resp.data.filter(el => {
return ['车辆段', '停车场'].findIndex(it => { return el.name.includes(it) }) < 0;
});
if (this.lineId) {
listStations(this.lineId).then(resp => {
const stations = this.stations = resp.data
this.$store.commit('rpTools/setStations', stations);
this.$refs.schedule.loadChartPage(stations);
@ -235,13 +228,14 @@ export default {
this.$message.info(error.message);
})
} else {
const planData = {}
this.$store.commit('rpTools/setPlanData', planData);
this.$refs.schedule.loadChartData(planData);
this.$refs.schedule.clear();
}
}).catch(error => {
this.$messageBox(error.message);
})
} else {
this.$refs.schedule.clear();
}
},
onDialog(menu) {
this.$store.dispatch('menuOperation/setPopMenu', { position: {x: 0, y: 0}, menu });
@ -331,25 +325,32 @@ export default {
break;
}
},
onSelectPlan(el) {
this.$router.replace({ path: 'AUStool', query: { planId: el.id, title: el.name }});
this.drawer = false;
},
doExport() {
this.$refs.export.doShow(this.stations, this.planData);
},
doOpenPlan() {
listRps().then(resp => {
this.planList = this.buildPlanList(resp.data);
this.$refs.list.doShow();
})
},
doNewPlan() {
this.$refs.create.doShow();
listLines().then(resp => {
this.lineList = resp.data;
this.$refs.create.doShow(resp.data);
this.$nextTick(e => {
if (this.$refs.tree) {
this.$refs.tree.setCurrentKey(this.planId);
}
})
});
},
doSelectPlan(el) {
this.$router.replace({ path: 'AUStool', query: { planId: el.id, lineId: el.lineId, title: el.name }});
},
doCreatePlan(model) {
createRp(model).then(resp => {
this.loadPlanList();
this.onSelectPlan({id: resp.data, name: model.name});
this.$message.success('Run plan group created successfully.')
}).catch(error => {
this.$message.info(error.message);
})
@ -361,13 +362,17 @@ export default {
type: 'warning'
}).then(() => {
deleteRp(el.id).then(resp => {
this.loadPlanList();
this.planId == el.id
listRps().then(resp => {
this.planList = this.buildPlanList(resp.data);
el.planList.findIndex(el => { return el.id == this.planId; }) >= 0
? this.$router.replace({ path: 'AUStool'})
: this.loadPlanData();
}).catch(error => {
this.$message.info(error.message);
})
}).catch(error => {
this.$message.info(error.message);
})
}).catch(() => {
this.$message({ type: 'info', message: 'Deletion cancelled.' });
});
@ -396,7 +401,7 @@ export default {
if (this.selected) {
const model = {
seconds: time,
stationCode: this.selected.stationCode
stationId: this.selected.stationId
}
justTripNoRunning(this.planId, this.selected.tripNo, model).then(resp => {
@ -411,7 +416,7 @@ export default {
if (this.selected) {
const model = {
seconds: time,
stationCode: this.selected.stationCode
stationId: this.selected.stationId
}
justTripNoStop(this.planId, this.selected.tripNo, model).then(resp => {
@ -426,7 +431,7 @@ export default {
if (this.selected) {
const model = {
seconds: time,
stationCode: this.selected.stationCode
stationId: this.selected.stationId
}
justTripTurnBack(this.planId, this.selected.tripNo, model).then(resp => {
@ -439,8 +444,8 @@ export default {
},
doCreateTrip(data) {
const model = {
endStationCode: data.endStationCode,
startStationCode: data.startStationCode,
endStationId: data.endStationId,
startStationId: data.startStationId,
startTime: timeFormat(data.startTime),
endTime: timeFormat(data.endTime)
}
@ -616,11 +621,4 @@ export default {
}
}
}
.flex {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
}
</style>

71
src/views/planMonitor/editToolAUS/tool/list.vue Normal file
View File

@ -0,0 +1,71 @@
<template>
<drawer :visible.sync="drawer" @before-close="e => drawer=false">
<template slot="title">Run Plan List</template>
<el-tree style="padding-right: 20px" :data="planList" :props="defaultProps" @node-click="onSelect" default-expand-all>
<template slot-scope="{data}">
<span class="flex" >
<span><i :class="data.isPlan? 'el-icon-document': 'el-icon-folder'"/>&ensp;{{data.name}}</span>
<el-button
v-if="!data.isPlan"
type="text"
style="color:red"
size="mini"
@click.stop="onDelete(data)">
Delete
</el-button>
</span>
</template>
</el-tree>
</drawer>
</template>
<script>
import Drawer from '../components/drawer.vue';
export default {
components: {
Drawer
},
props: {
planList: {
type: Array,
required: true,
}
},
data() {
return {
defaultProps: {
children: 'planList',
label: 'name'
},
drawer: false
}
},
methods: {
onSelect(el) {
if (el.isPlan) {
this.$emit('select', el);
this.drawer = false;
}
},
onDelete(el) {
this.$emit('delete', el);
},
doShow() {
this.drawer = true;
},
doClose() {
this.drawer = false;
},
}
}
</script>
<style lang="scss" scoped>
.flex {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
}
</style>

10
src/views/planMonitor/editToolAUS/tool/monitor.js
View File

@ -7,10 +7,10 @@ export default {
callRegister: [],
markList: [],
buildModel: {
startStationCode: '',
startStationId: '',
startKmRange: 0,
startTime: 0,
endStationCode: '',
endStationId: '',
endKmRange: 0,
endTime: 0
},
@ -275,10 +275,10 @@ export default {
if (markList.length == 1) {
this.buildModel.startTime = pointInGrid[0];
this.buildModel.startStationCode = yObj.code;
this.buildModel.startStationId = yObj.id;
} else if (markList.length >= 2) {
this.buildModel.endTime = pointInGrid[0];
this.buildModel.endStationCode = yObj.code;
this.buildModel.endStationId = yObj.id;
option.graphic[0].elements = elemList;
this.$emit('create', this.buildModel);
}
@ -375,7 +375,7 @@ export default {
this.offset.x = pointInGrid[0];
this.offset.y = pointInGrid[1];
this.selected = {
stationIndex: this.stations.findIndex(el => { return el.code == obj.stationCode; }),
stationIndex: this.stations.findIndex(el => { return el.id == obj.stationId; }),
dataIndex: e.dataIndex,
seriesIndex: e.seriesIndex,
seriesName: isService? e.seriesName: 'service-trip',

7
src/views/planMonitor/editToolAUS/tool/schedule.vue
View File

@ -204,7 +204,7 @@ export default {
param.data.length) {
const xVal = param.data[0];
const yObj = param.data[2];
const station = this.stations.find(el => { return el.code == yObj.stationCode })||{ name: '', kmRange: ''};
const station = this.stations.find(el => { return el.id == yObj.stationId })||{ name: '', kmRange: ''};
const list = [
`Service No: ${yObj.serviceNo}<br>`,
`Trip No: ${yObj.tripNo}<br>`,
@ -331,6 +331,11 @@ export default {
reSize({width, height}) {
if (this.myChart) {
this.myChart.resize({ width, height, silent: false });
}
},
clear() {
if (this.myChart) {
this.myChart.clear();
}
},
destroy() {