Merge remote-tracking branch 'origin/master' into test
This commit is contained in:
jade
commit
b44d7e97cf
@ -1,4 +1,5 @@
|
||||
import enLocale from 'element-ui/lib/locale/lang/en';
|
||||
import map from './map';
|
||||
import global from './global';
|
||||
import router from './router';
|
||||
import lesson from './lesson';
|
||||
@ -7,6 +8,7 @@ import rules from './rules';
|
||||
|
||||
export default {
|
||||
...enLocale,
|
||||
map,
|
||||
global,
|
||||
router,
|
||||
lesson,
|
||||
|
||||
3
src/i18n/langs/en/map.js
Normal file
3
src/i18n/langs/en/map.js
Normal file
@ -0,0 +1,3 @@
|
||||
export default {
|
||||
content: 'dsfjalfjdslfjsdlf'
|
||||
};
|
||||
@ -1,4 +1,5 @@
|
||||
import cnLocale from 'element-ui/lib/locale/lang/zh-CN';
|
||||
import map from './map';
|
||||
import global from './global';
|
||||
import router from './router';
|
||||
import lesson from './lesson';
|
||||
@ -7,6 +8,7 @@ import rules from './rules';
|
||||
|
||||
export default {
|
||||
...cnLocale,
|
||||
map,
|
||||
global,
|
||||
router,
|
||||
lesson,
|
||||
|
||||
168
src/i18n/langs/zh/map.js
Normal file
168
src/i18n/langs/zh/map.js
Normal file
@ -0,0 +1,168 @@
|
||||
export default {
|
||||
pleaseSelect: '请选择',
|
||||
sketchMap: '草稿地图列表',
|
||||
newConstruction: '新建',
|
||||
importMap: '导入地图',
|
||||
createNewMap: '新建地图',
|
||||
normalCreate: '正常创建',
|
||||
saveMapAs: '地图另存为',
|
||||
create: '创建',
|
||||
dataVerification: '数据校验',
|
||||
logicalView: '逻辑视图',
|
||||
physicalView: '物理视图',
|
||||
mixedView: '混合视图',
|
||||
|
||||
link: 'link',
|
||||
section: '区段',
|
||||
switch: '道岔',
|
||||
signal: '信号机',
|
||||
zcZoneControl: 'zc区域控制',
|
||||
temporaryLimit: '全线临时限速',
|
||||
lcControl: 'Lc控制',
|
||||
image: '图片',
|
||||
station: '车站',
|
||||
controlMode: '控制模式',
|
||||
platform: '站台',
|
||||
counter: '计数器',
|
||||
delayUnlock: '延迟解锁',
|
||||
train: '列车',
|
||||
trainWindow: '车次窗',
|
||||
line: '线条',
|
||||
text: '文字',
|
||||
|
||||
mapName: '地图名称:',
|
||||
skinName: '皮肤风格:',
|
||||
selectCity: '所属城市:',
|
||||
offsetXColon: 'X偏移:',
|
||||
offsetYColon: 'Y偏移:',
|
||||
scalingColon: '缩放比例:',
|
||||
operationUnusual: '操作异常：',
|
||||
offsetX: 'X偏移',
|
||||
offsetY: 'Y偏移',
|
||||
scaling: '缩放比例',
|
||||
statusSignalName: '状态信号名称:',
|
||||
stateSignalsPlotCoordinates: '状态信号画图坐标:',
|
||||
|
||||
publishMapCreation: '从发布地图创建',
|
||||
confirm: '确 定',
|
||||
cancel: '取 消',
|
||||
|
||||
cancelledDelete: '已取消删除',
|
||||
|
||||
pleaseEnterMapName: '请输入地图名称',
|
||||
pleaseChooseSkinStyle: '请选择皮肤风格',
|
||||
pleaseSelectMapSource: '请选择地图来源',
|
||||
pleaseSelectAssociatedCity: '请选择关联城市',
|
||||
pleaseSelectAssociatedSkin: '请选择关联皮肤',
|
||||
pleaseEnteMapLinkWidth: '请输入地图Link宽度',
|
||||
pleaseEnterMapSectionWidth: '请输入地图区段宽度',
|
||||
|
||||
failedLoadListPublishedMaps: '加载已发布地图列表失败',
|
||||
creatingSuccessful: '创建成功！',
|
||||
mapUpdateSuccessful: '更新地图成功！',
|
||||
createFailure: '创建失败',
|
||||
importSuccessful: '导入成功！',
|
||||
importFailure: '导入失败',
|
||||
updateSuccessfully: '更新成功',
|
||||
updateFailed: '更新失败',
|
||||
failedLoadCityList: '加载城市列表失败',
|
||||
successfullyDelete: '删除成功',
|
||||
failDelete: '删除失败',
|
||||
dataValidationFailed: '发布失败，数据校验不通过',
|
||||
releaseSuccess: '发布成功!',
|
||||
abnormalOperation: '操作异常',
|
||||
datQuestion: '有问题数据',
|
||||
dataList: '数据列表',
|
||||
saveFailed: '另存失败',
|
||||
|
||||
mapEditor: '地图编辑',
|
||||
mapPublished: '地图发布为',
|
||||
publishingAssociatedCity: '发布关联城市:',
|
||||
publishMapName: '发布地图名称:',
|
||||
|
||||
updateObj: '修改',
|
||||
updateObjAxis: '更新坐标',
|
||||
saveAs: '另存为',
|
||||
publish: '发布',
|
||||
deleteObj: '删除',
|
||||
editRoute: '编辑进路',
|
||||
editRouting: '编辑交路',
|
||||
editAutoRouting: '编辑自动信号',
|
||||
setSwitch: '联动道岔',
|
||||
pathUnit: '路径单元',
|
||||
jlmap3d: '三维化编辑',
|
||||
|
||||
confirmDeletion: '是否确认删除？',
|
||||
hint: '提示',
|
||||
|
||||
automaticSignalList: '自动信号列表',
|
||||
automaticSignalCode: '自动信号编码',
|
||||
signalCodeName: '信号机名称',
|
||||
signalCode: '信号机code',
|
||||
sectionData: '区段数据',
|
||||
preview: '预览',
|
||||
operation: '操作',
|
||||
compile: '编辑',
|
||||
delete: '删除',
|
||||
sectionName: '区段名称',
|
||||
sectionList: '区段列表',
|
||||
automaticSignal: '自动信号',
|
||||
|
||||
signalID: '信号机ID:',
|
||||
activate: '激活',
|
||||
segmentData: '进路自动触发区段数据:',
|
||||
save: '保存',
|
||||
updata: '更新',
|
||||
pleaseSelectSignal: '请选择信号机',
|
||||
triggerSegmentData: '请选择进路自动触发区段数据',
|
||||
automaticSignalSuccessful: '创建自动信号成功！',
|
||||
failedCreateSignal: '创建自动信号失败',
|
||||
automaticSignalUpdateSucceeded: '更新自动信号成功！',
|
||||
automaticSignalUpdateFailed: '更新自动信号失败',
|
||||
|
||||
stationName: '车站名称:',
|
||||
|
||||
property: '属性',
|
||||
counterCoding: '计数器编码:',
|
||||
counterName: '计数器名称:',
|
||||
belongsStation: '所属车站:',
|
||||
counterType: '计数器类型:',
|
||||
countMax: '计数器最大值:',
|
||||
pointX: '坐标 x:',
|
||||
pointY: '坐标 y:',
|
||||
|
||||
code: '编码:',
|
||||
imageName: '图片名称:',
|
||||
imageWidth: '图片宽度:',
|
||||
imageHeight: '图片高度:',
|
||||
imagePoint: '图片坐标:',
|
||||
imageZindex: '图片层级:',
|
||||
imageSelect: '图片选择:',
|
||||
rotateAngle: '旋转角度:',
|
||||
|
||||
areaSolution: '区故解',
|
||||
alwaysSolution: '总人解',
|
||||
|
||||
pleaseSelectMap: '请选择地图',
|
||||
selectCounterType: '请选择计数器类型',
|
||||
selectStation: '请选择车站',
|
||||
pleaseSelectDevice: '请重新选择设备',
|
||||
pleaseSelectCountName: '请输入计数器名称',
|
||||
pleaseCounterValue: '请输入计数器最大值',
|
||||
pleaseEnterXCoordinate: '请输入x坐标',
|
||||
pleaseEnterYCoordinate: '请输入y坐标',
|
||||
pleaseEnterDelayTime: '请输入延时时间',
|
||||
pleaseEnterFontColor: '请输入字体颜色',
|
||||
pleaseEnterFontFormat: '请输入字体格式',
|
||||
pleaseEnterImageWidth: '请输入图片宽度',
|
||||
pleaseEnterImageHeight: '请输入图片高度',
|
||||
|
||||
delayUnlockingCode: '延时解锁编码:',
|
||||
delayTime: '延时时间:',
|
||||
font: '字体:',
|
||||
color: '颜色:',
|
||||
|
||||
upside: '上段',
|
||||
hypomere: '下段'
|
||||
|
||||
};
|
||||
@ -7,7 +7,7 @@ import MouseController from './mouseController';
|
||||
import deviceState from './constant/deviceState';
|
||||
import deviceType from './constant/deviceType';
|
||||
import { selectSkinStyle } from './config/deviceStyle';
|
||||
import { parser, deviceFactory, createBoundingRect, calculateDCenter } from './utils/parser';
|
||||
import { deviceFactory, createBoundingRect, calculateDCenter } from './utils/parser';
|
||||
|
||||
const renderer = 'canvas';
|
||||
const devicePixelRatio = 1;
|
||||
@ -76,7 +76,7 @@ class Jlmap {
|
||||
return defaultStateDict;
|
||||
}
|
||||
|
||||
setMap(map) {
|
||||
setMap(map, mapDevice) {
|
||||
// 保存皮肤类型
|
||||
if (map.skinVO) {
|
||||
this.skinStyle = map.skinVO.code;
|
||||
@ -85,12 +85,12 @@ class Jlmap {
|
||||
// 保存原始数据
|
||||
this.data = map;
|
||||
|
||||
// 解析地图数据
|
||||
this.mapDevice = mapDevice;
|
||||
|
||||
// 加载对应皮肤
|
||||
this.style = this.loadStyle(this.skinStyle);
|
||||
|
||||
// 解析地图数据
|
||||
this.mapDevice = parser(map, this);
|
||||
|
||||
// 数据加载完成 回调
|
||||
if (this.methods.dataLoaded instanceof Function) { this.methods.dataLoaded(this.mapDevice); }
|
||||
|
||||
|
||||
@ -1,70 +1,75 @@
|
||||
<template>
|
||||
<div v-if="show">
|
||||
<template v-if="maxmini">
|
||||
<div class="nav">
|
||||
<div class="cls-status" @click="touch('Close')" v-show="config.showClose"><span></span></div>
|
||||
<div class="min-status" @click="touch('Minim')"><span></span></div>
|
||||
</div>
|
||||
<el-table ref="table" :data="config.data" :highlight-current-row="config.highlightCurrentRow"
|
||||
@current-change="handleChange" :height="height" border>
|
||||
<template v-for="item in config.columns">
|
||||
<el-table-column :prop="item.prop" :label="item.label" :width="item.width">
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
<div v-if="show">
|
||||
<template v-if="maxmini">
|
||||
<div class="nav">
|
||||
<div v-show="config.showClose" class="cls-status" @click="touch('Close')"><span /></div>
|
||||
<div class="min-status" @click="touch('Minim')"><span /></div>
|
||||
</div>
|
||||
<el-table
|
||||
ref="table"
|
||||
:data="config.data"
|
||||
:highlight-current-row="config.highlightCurrentRow"
|
||||
:height="height"
|
||||
border
|
||||
@current-change="handleChange"
|
||||
>
|
||||
<template v-for="(item,index) in config.columns">
|
||||
<el-table-column :key="index" :prop="item.prop" :label="item.label" :width="item.width" />
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="nav">
|
||||
<div class=" max-status" @click="touch('Maxim')"><span></span></div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</el-table>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="nav">
|
||||
<div class=" max-status" @click="touch('Maxim')"><span /></div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'DataTable',
|
||||
props: {
|
||||
height: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
config: {
|
||||
type: Object,
|
||||
required: true,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: true,
|
||||
maxmini: true,
|
||||
touchStrategy: {
|
||||
'Close': [false, true],
|
||||
'Minim': [true, false],
|
||||
'Maxim': [true, true]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleChange(row) {
|
||||
if (this.config.handleChange) {
|
||||
this.config.handleChange(row);
|
||||
}
|
||||
},
|
||||
setCurrentRow(row) {
|
||||
this.$refs.table.setCurrentRow(row);
|
||||
},
|
||||
touch(operate) {
|
||||
this.$nextTick(() => {
|
||||
[this.show, this.maxmini] = this.touchStrategy[operate];
|
||||
this.$emit('touch', this.maxmini);
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
export default {
|
||||
name: 'DataTable',
|
||||
props: {
|
||||
height: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
config: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: true,
|
||||
maxmini: true,
|
||||
touchStrategy: {
|
||||
'Close': [false, true],
|
||||
'Minim': [true, false],
|
||||
'Maxim': [true, true]
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handleChange(row) {
|
||||
if (this.config.handleChange) {
|
||||
this.config.handleChange(row);
|
||||
}
|
||||
},
|
||||
setCurrentRow(row) {
|
||||
this.$refs.table.setCurrentRow(row);
|
||||
},
|
||||
touch(operate) {
|
||||
this.$nextTick(() => {
|
||||
[this.show, this.maxmini] = this.touchStrategy[operate];
|
||||
this.$emit('touch', this.maxmini);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
||||
<style scoped rel="stylesheet/scss" lang="scss" >
|
||||
@import "src/styles/mixin.scss";
|
||||
$height: 20px;
|
||||
$width: 20px;
|
||||
@ -85,7 +90,6 @@
|
||||
line-height: $height;
|
||||
}
|
||||
|
||||
|
||||
/deep/ {
|
||||
.el-table--border th.gutter {
|
||||
background: #EBEADB !important;
|
||||
@ -119,7 +123,6 @@
|
||||
font-size: smaller !important;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.current-row>td {
|
||||
@ -143,7 +146,7 @@
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
vertical-align: middle;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
span::after {
|
||||
@ -152,7 +155,7 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(-90deg);
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
|
||||
@ -170,7 +173,7 @@
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
vertical-align: middle;
|
||||
-webkit-transform: rotate(-90deg);
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
|
||||
@ -187,7 +190,7 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
span::after {
|
||||
@ -196,8 +199,8 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(90deg);
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -1,152 +1,152 @@
|
||||
<template>
|
||||
<el-dialog class="beijing-01__schedule edit-planning-train" :title="title" :visible.sync="dialogShow" width="800px"
|
||||
:before-close="doClose" :zIndex="2000" :modal="false" :close-on-click-modal="false" v-dialogDrag>
|
||||
<el-row>
|
||||
<el-col :offset="10">列车线路</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="17">
|
||||
<el-table :data="serviceData" border style="width: 100%" height="160">
|
||||
<el-table-column prop="startStationCode" label="起点站">
|
||||
</el-table-column>
|
||||
<el-table-column prop="startStationStandCode" label="起点站台">
|
||||
</el-table-column>
|
||||
<el-table-column prop="endStationCode" label="终点站">
|
||||
</el-table-column>
|
||||
<el-table-column prop="endStationStandCode" label="终点站台">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
<el-col :span="6" :offset="1">
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button class="view-button" @click="handleAddTask">加任务</el-button>
|
||||
</el-row>
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button class="view-button" @click="handleReplace">替  换</el-button>
|
||||
</el-row>
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button class="view-button" @click="handleDeleteTask">删任务</el-button>
|
||||
</el-row>
|
||||
<div class="view-box">
|
||||
<el-row type="flex" justify="center">
|
||||
<el-radio-group v-model="storeInOut">
|
||||
<el-radio :label="1">进库</el-radio>
|
||||
<el-radio :label="2">出库</el-radio>
|
||||
</el-radio-group>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row class="view-box">
|
||||
<el-col :span="9" style="padding-left: 10px">
|
||||
<el-input v-model="oldServiceNumber" size="small" :disabled="true"></el-input>
|
||||
</el-col>
|
||||
<el-col :span="9" style="padding-left: 20px">
|
||||
<el-input v-model="newServiceNumber" size="small"></el-input>
|
||||
</el-col>
|
||||
<el-col :span="5" style="padding-left: 20px">
|
||||
<el-button @click="handleModifyingTripNumber" style="width: 150px;">改车次号</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="margin-top: 10px">
|
||||
<el-col :span="4"><span class="view-label">线路开始时间</span></el-col>
|
||||
<el-col :span="8">
|
||||
<el-time-select v-model="serviceStartTime" size="small"></el-time-select>
|
||||
</el-col>
|
||||
<el-col :span="4"><span class="view-label">线路结束时间</span></el-col>
|
||||
<el-col :span="8">
|
||||
<el-time-select v-model="serviceEndTime" size="small"></el-time-select>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="margin-top: 20px">
|
||||
<el-col :offset="10">线路详细信息</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-table :data="tripData" border style="width: 100%" height="200">
|
||||
<el-table-column prop="arriveTime" label="到站时间">
|
||||
</el-table-column>
|
||||
<el-table-column prop="stationCode" label="车站">
|
||||
</el-table-column>
|
||||
<el-table-column prop="stationStandCode" label="站台">
|
||||
</el-table-column>
|
||||
<el-table-column prop="stopTime" label="停站时间">
|
||||
</el-table-column>
|
||||
<el-table-column prop="level" label="运行等级">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-row>
|
||||
<el-row style="margin-top: 20px">
|
||||
<el-checkbox v-model="effect">影响后续任务</el-checkbox>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
class="beijing-01__schedule edit-planning-train"
|
||||
:title="title"
|
||||
:visible.sync="dialogShow"
|
||||
width="800px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-row>
|
||||
<el-col :offset="10">列车线路</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="17">
|
||||
<el-table :data="serviceData" border style="width: 100%" height="160">
|
||||
<el-table-column prop="startStationCode" label="起点站" />
|
||||
<el-table-column prop="startStationStandCode" label="起点站台" />
|
||||
<el-table-column prop="endStationCode" label="终点站" />
|
||||
<el-table-column prop="endStationStandCode" label="终点站台" />
|
||||
</el-table>
|
||||
</el-col>
|
||||
<el-col :span="6" :offset="1">
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button class="view-button" @click="handleAddTask">加任务</el-button>
|
||||
</el-row>
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button @click="handleCommit">确 定</el-button>
|
||||
<el-button @click="doClose">取 消</el-button>
|
||||
<el-button class="view-button" @click="handleReplace">替  换</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button class="view-button" @click="handleDeleteTask">删任务</el-button>
|
||||
</el-row>
|
||||
<div class="view-box">
|
||||
<el-row type="flex" justify="center">
|
||||
<el-radio-group v-model="storeInOut">
|
||||
<el-radio :label="1">进库</el-radio>
|
||||
<el-radio :label="2">出库</el-radio>
|
||||
</el-radio-group>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row class="view-box">
|
||||
<el-col :span="9" style="padding-left: 10px">
|
||||
<el-input v-model="oldServiceNumber" size="small" :disabled="true" />
|
||||
</el-col>
|
||||
<el-col :span="9" style="padding-left: 20px">
|
||||
<el-input v-model="newServiceNumber" size="small" />
|
||||
</el-col>
|
||||
<el-col :span="5" style="padding-left: 20px">
|
||||
<el-button style="width: 150px;" @click="handleModifyingTripNumber">改车次号</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="margin-top: 10px">
|
||||
<el-col :span="4"><span class="view-label">线路开始时间</span></el-col>
|
||||
<el-col :span="8">
|
||||
<el-time-select v-model="serviceStartTime" size="small" />
|
||||
</el-col>
|
||||
<el-col :span="4"><span class="view-label">线路结束时间</span></el-col>
|
||||
<el-col :span="8">
|
||||
<el-time-select v-model="serviceEndTime" size="small" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="margin-top: 20px">
|
||||
<el-col :offset="10">线路详细信息</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-table :data="tripData" border style="width: 100%" height="200">
|
||||
<el-table-column prop="arriveTime" label="到站时间" />
|
||||
<el-table-column prop="stationCode" label="车站" />
|
||||
<el-table-column prop="stationStandCode" label="站台" />
|
||||
<el-table-column prop="stopTime" label="停站时间" />
|
||||
<el-table-column prop="level" label="运行等级" />
|
||||
</el-table>
|
||||
</el-row>
|
||||
<el-row style="margin-top: 20px">
|
||||
<el-checkbox v-model="effect">影响后续任务</el-checkbox>
|
||||
</el-row>
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button @click="handleCommit">确 定</el-button>
|
||||
<el-button @click="doClose">取 消</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { formatTime, formatName } from '@/utils/runPlan';
|
||||
import { formatTime, formatName } from '@/utils/runPlan';
|
||||
|
||||
export default {
|
||||
name: 'modifyingPlan',
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
effect: false,
|
||||
storeInOut: '1',
|
||||
oldServiceNumber: '',
|
||||
newServiceNumber: '',
|
||||
serviceStartTime: '',
|
||||
serviceEndTime: '',
|
||||
serviceData: [],
|
||||
tripData: [],
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
title() {
|
||||
return '修改'
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
formatTime(time) {
|
||||
return formatTime(time);
|
||||
},
|
||||
formatName(code) {
|
||||
return formatName(code);
|
||||
},
|
||||
doShow() {
|
||||
this.dialogShow = true;
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
},
|
||||
// 加任务
|
||||
handleAddTask() {
|
||||
this.$emit('dispatchDialog', { name: 'addTask', params: {} })
|
||||
},
|
||||
// 替换
|
||||
handleReplace() {
|
||||
this.$emit('dispatchDialog', { name: 'modifyingTask', params: {} })
|
||||
},
|
||||
// 删任务
|
||||
handleDeleteTask() {
|
||||
this.$emit('dispatchDialog', { name: 'deleteTask', params: {} })
|
||||
},
|
||||
// 改车次号
|
||||
handleModifyingTripNumber() {
|
||||
this.$emit('dispatchDialog', { name: 'modifyingTripNumber', params: {} })
|
||||
},
|
||||
// 确定修改
|
||||
handleCommit() {
|
||||
this.doClose();
|
||||
}
|
||||
}
|
||||
}
|
||||
export default {
|
||||
name: 'ModifyingPlan',
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
effect: false,
|
||||
storeInOut: '1',
|
||||
oldServiceNumber: '',
|
||||
newServiceNumber: '',
|
||||
serviceStartTime: '',
|
||||
serviceEndTime: '',
|
||||
serviceData: [],
|
||||
tripData: []
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
title() {
|
||||
return '修改';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
formatTime(time) {
|
||||
return formatTime(time);
|
||||
},
|
||||
formatName(code) {
|
||||
return formatName(code);
|
||||
},
|
||||
doShow() {
|
||||
this.dialogShow = true;
|
||||
},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
},
|
||||
// 加任务
|
||||
handleAddTask() {
|
||||
this.$emit('dispatchDialog', { name: 'addTask', params: {} });
|
||||
},
|
||||
// 替换
|
||||
handleReplace() {
|
||||
this.$emit('dispatchDialog', { name: 'modifyingTask', params: {} });
|
||||
},
|
||||
// 删任务
|
||||
handleDeleteTask() {
|
||||
this.$emit('dispatchDialog', { name: 'deleteTask', params: {} });
|
||||
},
|
||||
// 改车次号
|
||||
handleModifyingTripNumber() {
|
||||
this.$emit('dispatchDialog', { name: 'modifyingTripNumber', params: {} });
|
||||
},
|
||||
// 确定修改
|
||||
handleCommit() {
|
||||
this.doClose();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
@import "src/styles/mixin.scss";
|
||||
@ -157,13 +157,11 @@
|
||||
margin-left: 0px;
|
||||
}
|
||||
|
||||
|
||||
.view-label {
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
|
||||
.view-box {
|
||||
padding: 10px 0px;
|
||||
border: 1px inset gray;
|
||||
@ -176,4 +174,4 @@
|
||||
margin: 5px 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -223,14 +223,14 @@ export default {
|
||||
'$store.state.runPlan.planSizeCount': function () {
|
||||
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
|
||||
},
|
||||
'$store.state.runPlan.select.serviceNumber': function (val) {
|
||||
'$store.state.runPlan.selected.serviceNumber': function (val) {
|
||||
const index = this.serviceNumberConfig.data.findIndex(elem => {
|
||||
return elem.serviceNumber == val;
|
||||
});
|
||||
|
||||
this.$refs.serviceTable.setCurrentRow(this.serviceNumberConfig.data[index]);
|
||||
},
|
||||
'$store.state.runPlan.select.tripNumber': function (val) {
|
||||
'$store.state.runPlan.selected.tripNumber': function (val) {
|
||||
const index = this.tripNumberConfig.data.findIndex(elem => {
|
||||
return elem.tripNumber == val;
|
||||
});
|
||||
|
||||
@ -1,95 +1,102 @@
|
||||
<template>
|
||||
<data-table id="PlanStatusBar" ref="dataTable" :height="height-11" :config="stationListConfig" :close="false"
|
||||
:style="{top: maxmini? maxTop-110+'px':maxTop-21+'px'}" @touch="touch"></data-table>
|
||||
<data-table
|
||||
id="PlanStatusBar"
|
||||
ref="dataTable"
|
||||
:height="height-11"
|
||||
:config="stationListConfig"
|
||||
:close="false"
|
||||
:style="{top: maxmini? maxTop-110+'px':maxTop-21+'px'}"
|
||||
@touch="touch"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import DataTable from '../menusPlan/components/dataTable';
|
||||
import { formatTime, formatName } from '@/utils/runPlan';
|
||||
import DataTable from '../menusPlan/components/dataTable';
|
||||
import { formatTime, formatName } from '@/utils/runPlan';
|
||||
|
||||
export default {
|
||||
name: 'PlanStatusBar',
|
||||
props: {
|
||||
maxTop: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
components: {
|
||||
DataTable
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
maxmini: true,
|
||||
height: 100,
|
||||
stationListConfig: {
|
||||
data: [],
|
||||
showClose: true,
|
||||
highlightCurrentRow: true,
|
||||
columns: [
|
||||
{
|
||||
prop: 'stationName',
|
||||
label: '站台',
|
||||
width: 400
|
||||
},
|
||||
{
|
||||
prop: 'startTime',
|
||||
label: '到点',
|
||||
},
|
||||
{
|
||||
prop: 'stopTime',
|
||||
label: '停站时间',
|
||||
},
|
||||
{
|
||||
prop: 'endTime',
|
||||
label: '发点',
|
||||
},
|
||||
{
|
||||
prop: 'level',
|
||||
label: '运行等级'
|
||||
export default {
|
||||
name: 'PlanStatusBar',
|
||||
components: {
|
||||
DataTable
|
||||
},
|
||||
props: {
|
||||
maxTop: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
maxmini: true,
|
||||
height: 100,
|
||||
stationListConfig: {
|
||||
data: [],
|
||||
showClose: true,
|
||||
highlightCurrentRow: true,
|
||||
columns: [
|
||||
{
|
||||
prop: 'stationName',
|
||||
label: '站台',
|
||||
width: 400
|
||||
},
|
||||
{
|
||||
prop: 'startTime',
|
||||
label: '到点'
|
||||
},
|
||||
{
|
||||
prop: 'stopTime',
|
||||
label: '停站时间'
|
||||
},
|
||||
{
|
||||
prop: 'endTime',
|
||||
label: '发点'
|
||||
},
|
||||
{
|
||||
prop: 'level',
|
||||
label: '运行等级'
|
||||
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.runPlan.select': function (select) {
|
||||
this.stationListConfig.data = [];
|
||||
let serviceObj = this.$store.state.runPlan.editData[select.serviceNumber];
|
||||
if (serviceObj) {
|
||||
let trainMap = serviceObj.trainMap;
|
||||
if (trainMap) {
|
||||
let trainObj = trainMap[select.tripNumber];
|
||||
if (trainObj) {
|
||||
let stationTimeList = trainObj.stationTimeList;
|
||||
if (stationTimeList && stationTimeList.length) {
|
||||
stationTimeList.forEach((elem, index) => {
|
||||
let stationObj = {
|
||||
stationName: formatName(elem.stationCode),
|
||||
startTime: formatTime(index == 0 ? null : stationTimeList[index - 1].secondTime),
|
||||
stopTime: formatTime(index == 0 ? null : elem.secondTime - stationTimeList[index - 1].secondTime),
|
||||
endTime: formatTime(elem.secondTime),
|
||||
level: ''
|
||||
}
|
||||
this.stationListConfig.data.push(stationObj);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
touch(maxmini) {
|
||||
this.maxmini = maxmini;
|
||||
this.$emit('setPosition');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'$store.state.runPlan.selected': function (select) {
|
||||
this.stationListConfig.data = [];
|
||||
const serviceObj = this.$store.state.runPlan.editData[select.serviceNumber];
|
||||
if (serviceObj) {
|
||||
const trainMap = serviceObj.trainMap;
|
||||
if (trainMap) {
|
||||
const trainObj = trainMap[select.tripNumber];
|
||||
if (trainObj) {
|
||||
const stationTimeList = trainObj.stationTimeList;
|
||||
if (stationTimeList && stationTimeList.length) {
|
||||
stationTimeList.forEach((elem, index) => {
|
||||
const stationObj = {
|
||||
stationName: formatName(elem.stationCode),
|
||||
startTime: formatTime(index == 0 ? null : stationTimeList[index - 1].secondTime),
|
||||
stopTime: formatTime(index == 0 ? null : elem.secondTime - stationTimeList[index - 1].secondTime),
|
||||
endTime: formatTime(elem.secondTime),
|
||||
level: ''
|
||||
};
|
||||
this.stationListConfig.data.push(stationObj);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
touch(maxmini) {
|
||||
this.maxmini = maxmini;
|
||||
this.$emit('setPosition');
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
@import "src/styles/mixin.scss";
|
||||
|
||||
#PlanStatusBar {
|
||||
@ -97,4 +104,4 @@
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -1,70 +1,75 @@
|
||||
<template>
|
||||
<div v-if="show">
|
||||
<template v-if="maxmini">
|
||||
<div class="nav">
|
||||
<div class="cls-status" @click="touch('Close')" v-show="config.showClose"><span></span></div>
|
||||
<div class="min-status" @click="touch('Minim')"><span></span></div>
|
||||
</div>
|
||||
<el-table ref="table" :data="config.data" :highlight-current-row="config.highlightCurrentRow"
|
||||
@current-change="handleChange" :height="height" border>
|
||||
<template v-for="item in config.columns">
|
||||
<el-table-column :prop="item.prop" :label="item.label" :width="item.width">
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
<div v-if="show">
|
||||
<template v-if="maxmini">
|
||||
<div class="nav">
|
||||
<div v-show="config.showClose" class="cls-status" @click="touch('Close')"><span /></div>
|
||||
<div class="min-status" @click="touch('Minim')"><span /></div>
|
||||
</div>
|
||||
<el-table
|
||||
ref="table"
|
||||
:data="config.data"
|
||||
:highlight-current-row="config.highlightCurrentRow"
|
||||
:height="height"
|
||||
border
|
||||
@current-change="handleChange"
|
||||
>
|
||||
<template v-for="(item,index) in config.columns">
|
||||
<el-table-column :key="index" :prop="item.prop" :label="item.label" :width="item.width" />
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="nav">
|
||||
<div class=" max-status" @click="touch('Maxim')"><span></span></div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</el-table>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="nav">
|
||||
<div class=" max-status" @click="touch('Maxim')"><span /></div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'DataTable',
|
||||
props: {
|
||||
height: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
config: {
|
||||
type: Object,
|
||||
required: true,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: true,
|
||||
maxmini: true,
|
||||
touchStrategy: {
|
||||
'Close': [false, true],
|
||||
'Minim': [true, false],
|
||||
'Maxim': [true, true]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleChange(row) {
|
||||
if (this.config.handleChange) {
|
||||
this.config.handleChange(row);
|
||||
}
|
||||
},
|
||||
setCurrentRow(row) {
|
||||
this.$refs.table.setCurrentRow(row);
|
||||
},
|
||||
touch(operate) {
|
||||
this.$nextTick(() => {
|
||||
[this.show, this.maxmini] = this.touchStrategy[operate];
|
||||
this.$emit('touch', this.maxmini);
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
export default {
|
||||
name: 'DataTable',
|
||||
props: {
|
||||
height: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
config: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: true,
|
||||
maxmini: true,
|
||||
touchStrategy: {
|
||||
'Close': [false, true],
|
||||
'Minim': [true, false],
|
||||
'Maxim': [true, true]
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handleChange(row) {
|
||||
if (this.config.handleChange) {
|
||||
this.config.handleChange(row);
|
||||
}
|
||||
},
|
||||
setCurrentRow(row) {
|
||||
this.$refs.table.setCurrentRow(row);
|
||||
},
|
||||
touch(operate) {
|
||||
this.$nextTick(() => {
|
||||
[this.show, this.maxmini] = this.touchStrategy[operate];
|
||||
this.$emit('touch', this.maxmini);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
@import "src/styles/mixin.scss";
|
||||
$height: 20px;
|
||||
$width: 20px;
|
||||
@ -85,7 +90,6 @@
|
||||
line-height: $height;
|
||||
}
|
||||
|
||||
|
||||
/deep/ {
|
||||
.el-table--border th.gutter {
|
||||
background: #EBEADB !important;
|
||||
@ -119,7 +123,6 @@
|
||||
font-size: smaller !important;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.current-row>td {
|
||||
@ -143,7 +146,7 @@
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
vertical-align: middle;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
span::after {
|
||||
@ -152,7 +155,7 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(-90deg);
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
|
||||
@ -170,7 +173,7 @@
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
vertical-align: middle;
|
||||
-webkit-transform: rotate(-90deg);
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
|
||||
@ -187,7 +190,7 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
span::after {
|
||||
@ -196,8 +199,8 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(90deg);
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -208,14 +208,14 @@
|
||||
'$store.state.runPlan.planSizeCount': function () {
|
||||
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
|
||||
},
|
||||
'$store.state.runPlan.select.serviceNumber': function (val) {
|
||||
'$store.state.runPlan.selected.serviceNumber': function (val) {
|
||||
let index = this.serviceNumberConfig.data.findIndex(elem => {
|
||||
return elem.serviceNumber == val;
|
||||
})
|
||||
|
||||
this.$refs.serviceTable.setCurrentRow(this.serviceNumberConfig.data[index]);
|
||||
},
|
||||
'$store.state.runPlan.select.tripNumber': function (val) {
|
||||
'$store.state.runPlan.selected.tripNumber': function (val) {
|
||||
let index = this.tripNumberConfig.data.findIndex(elem => {
|
||||
return elem.tripNumber == val;
|
||||
})
|
||||
|
||||
@ -54,7 +54,7 @@
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.runPlan.select': function (select) {
|
||||
'$store.state.runPlan.selected': function (select) {
|
||||
this.stationListConfig.data = [];
|
||||
let serviceObj = this.$store.state.runPlan.editData[select.serviceNumber];
|
||||
if (serviceObj) {
|
||||
|
||||
@ -1,70 +1,75 @@
|
||||
<template>
|
||||
<div v-if="show">
|
||||
<template v-if="maxmini">
|
||||
<div class="nav">
|
||||
<div class="cls-status" @click="touch('Close')" v-show="config.showClose"><span></span></div>
|
||||
<div class="min-status" @click="touch('Minim')"><span></span></div>
|
||||
</div>
|
||||
<el-table ref="table" :data="config.data" :highlight-current-row="config.highlightCurrentRow"
|
||||
@current-change="handleChange" :height="height" border>
|
||||
<template v-for="item in config.columns">
|
||||
<el-table-column :prop="item.prop" :label="item.label" :width="item.width">
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
<div v-if="show">
|
||||
<template v-if="maxmini">
|
||||
<div class="nav">
|
||||
<div v-show="config.showClose" class="cls-status" @click="touch('Close')"><span /></div>
|
||||
<div class="min-status" @click="touch('Minim')"><span /></div>
|
||||
</div>
|
||||
<el-table
|
||||
ref="table"
|
||||
:data="config.data"
|
||||
:highlight-current-row="config.highlightCurrentRow"
|
||||
:height="height"
|
||||
border
|
||||
@current-change="handleChange"
|
||||
>
|
||||
<template v-for="(item,index) in config.columns">
|
||||
<el-table-column :key="index" :prop="item.prop" :label="item.label" :width="item.width" />
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="nav">
|
||||
<div class=" max-status" @click="touch('Maxim')"><span></span></div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</el-table>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="nav">
|
||||
<div class=" max-status" @click="touch('Maxim')"><span /></div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'DataTable',
|
||||
props: {
|
||||
height: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
config: {
|
||||
type: Object,
|
||||
required: true,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: true,
|
||||
maxmini: true,
|
||||
touchStrategy: {
|
||||
'Close': [false, true],
|
||||
'Minim': [true, false],
|
||||
'Maxim': [true, true]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleChange(row) {
|
||||
if (this.config.handleChange) {
|
||||
this.config.handleChange(row);
|
||||
}
|
||||
},
|
||||
setCurrentRow(row) {
|
||||
this.$refs.table.setCurrentRow(row);
|
||||
},
|
||||
touch(operate) {
|
||||
this.$nextTick(() => {
|
||||
[this.show, this.maxmini] = this.touchStrategy[operate];
|
||||
this.$emit('touch', this.maxmini);
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
export default {
|
||||
name: 'DataTable',
|
||||
props: {
|
||||
height: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
config: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: true,
|
||||
maxmini: true,
|
||||
touchStrategy: {
|
||||
'Close': [false, true],
|
||||
'Minim': [true, false],
|
||||
'Maxim': [true, true]
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handleChange(row) {
|
||||
if (this.config.handleChange) {
|
||||
this.config.handleChange(row);
|
||||
}
|
||||
},
|
||||
setCurrentRow(row) {
|
||||
this.$refs.table.setCurrentRow(row);
|
||||
},
|
||||
touch(operate) {
|
||||
this.$nextTick(() => {
|
||||
[this.show, this.maxmini] = this.touchStrategy[operate];
|
||||
this.$emit('touch', this.maxmini);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
@import "src/styles/mixin.scss";
|
||||
$height: 20px;
|
||||
$width: 20px;
|
||||
@ -85,7 +90,6 @@
|
||||
line-height: $height;
|
||||
}
|
||||
|
||||
|
||||
/deep/ {
|
||||
.el-table--border th.gutter {
|
||||
background: #EBEADB !important;
|
||||
@ -119,7 +123,6 @@
|
||||
font-size: smaller !important;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.current-row>td {
|
||||
@ -143,7 +146,7 @@
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
vertical-align: middle;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
span::after {
|
||||
@ -152,7 +155,7 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(-90deg);
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
|
||||
@ -170,7 +173,7 @@
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
vertical-align: middle;
|
||||
-webkit-transform: rotate(-90deg);
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
|
||||
@ -187,7 +190,7 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
span::after {
|
||||
@ -196,8 +199,8 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(90deg);
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -223,14 +223,14 @@ export default {
|
||||
'$store.state.runPlan.planSizeCount': function () {
|
||||
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
|
||||
},
|
||||
'$store.state.runPlan.select.serviceNumber': function (val) {
|
||||
'$store.state.runPlan.selected.serviceNumber': function (val) {
|
||||
const index = this.serviceNumberConfig.data.findIndex(elem => {
|
||||
return elem.serviceNumber == val;
|
||||
});
|
||||
|
||||
this.$refs.serviceTable.setCurrentRow(this.serviceNumberConfig.data[index]);
|
||||
},
|
||||
'$store.state.runPlan.select.tripNumber': function (val) {
|
||||
'$store.state.runPlan.selected.tripNumber': function (val) {
|
||||
const index = this.tripNumberConfig.data.findIndex(elem => {
|
||||
return elem.tripNumber == val;
|
||||
});
|
||||
|
||||
@ -54,7 +54,7 @@
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.runPlan.select': function (select) {
|
||||
'$store.state.runPlan.selected': function (select) {
|
||||
this.stationListConfig.data = [];
|
||||
let serviceObj = this.$store.state.runPlan.editData[select.serviceNumber];
|
||||
if (serviceObj) {
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,108 +1,114 @@
|
||||
<template>
|
||||
<el-dialog :title="title" class="fuzhou-01__schedule choose-plan-template" :visible.sync="dialogShow" width="80%"
|
||||
:before-close="doClose" :modal="false" :close-on-click-modal="false" v-dialogDrag>
|
||||
<QueryListPage ref="pageRules" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList">
|
||||
</QueryListPage>
|
||||
<el-row type="flex" justify="center" class="button-group">
|
||||
<el-button type="primary" @click="handleConfirm" :loading="loading">选 择</el-button>
|
||||
<el-button @click="dialogShow = false">取 消</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
:title="title"
|
||||
class="fuzhou-01__schedule choose-plan-template"
|
||||
:visible.sync="dialogShow"
|
||||
width="80%"
|
||||
:before-close="doClose"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<QueryListPage ref="pageRules" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
|
||||
<el-row type="flex" justify="center" class="button-group">
|
||||
<el-button type="primary" :loading="loading" @click="handleConfirm">选 择</el-button>
|
||||
<el-button @click="dialogShow = false">取 消</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { runPlanTemplateList } from '@/api/runplan';
|
||||
import { getSkinStyleList } from '@/api/management/mapskin'
|
||||
import { UrlConfig } from '@/router/index';
|
||||
import { runPlanTemplateList } from '@/api/runplan';
|
||||
import { getSkinStyleList } from '@/api/management/mapskin';
|
||||
|
||||
export default {
|
||||
name: 'ChooseTemplatePlan',
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
skinStyleList: [],
|
||||
pagerConfig: {
|
||||
pageSize: 'pageSize',
|
||||
pageIndex: 'pageNum'
|
||||
},
|
||||
queryForm: {
|
||||
reset: true,
|
||||
labelWidth: '100px',
|
||||
queryObject: {
|
||||
name: {
|
||||
type: 'text',
|
||||
label: '运行图名称'
|
||||
}
|
||||
}
|
||||
},
|
||||
queryList: {
|
||||
query: this.queryFunction,
|
||||
selectCheckShow: false,
|
||||
radioShow: true,
|
||||
columns: [
|
||||
{
|
||||
title: '运行图名称',
|
||||
prop: 'name'
|
||||
},
|
||||
{
|
||||
title: '皮肤类型',
|
||||
prop: 'skinStyle',
|
||||
type: 'tag',
|
||||
columnValue: (row) => {
|
||||
return this.$convertField(row.skinStyle, this.skinStyleList, ['code', 'name'])
|
||||
},
|
||||
tagType: (row) => { return 'success' }
|
||||
}
|
||||
]
|
||||
},
|
||||
export default {
|
||||
name: 'ChooseTemplatePlan',
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
skinStyleList: [],
|
||||
pagerConfig: {
|
||||
pageSize: 'pageSize',
|
||||
pageIndex: 'pageNum'
|
||||
},
|
||||
queryForm: {
|
||||
reset: true,
|
||||
labelWidth: '100px',
|
||||
queryObject: {
|
||||
name: {
|
||||
type: 'text',
|
||||
label: '运行图名称'
|
||||
}
|
||||
}
|
||||
},
|
||||
queryList: {
|
||||
query: this.queryFunction,
|
||||
selectCheckShow: false,
|
||||
radioShow: true,
|
||||
columns: [
|
||||
{
|
||||
title: '运行图名称',
|
||||
prop: 'name'
|
||||
},
|
||||
{
|
||||
title: '皮肤类型',
|
||||
prop: 'skinStyle',
|
||||
type: 'tag',
|
||||
columnValue: (row) => {
|
||||
return this.$convertField(row.skinStyle, this.skinStyleList, ['code', 'name']);
|
||||
},
|
||||
tagType: (row) => { return 'success'; }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
currentModel: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
title() {
|
||||
return '选择模板运行图'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadInitData() {
|
||||
this.skinStyleList = [];
|
||||
getSkinStyleList().then(response => {
|
||||
this.skinStyleList = response.data;
|
||||
})
|
||||
},
|
||||
doShow() {
|
||||
this.loading = false;
|
||||
this.dialogShow = true;
|
||||
this.loadInitData();
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
},
|
||||
queryFunction(params) {
|
||||
if (this.$store.state.map && this.$store.state.map.map) {
|
||||
params['skinStyle'] = this.$store.getters['map/skinStyle'];
|
||||
}
|
||||
return runPlanTemplateList(params);
|
||||
},
|
||||
handleConfirm() {
|
||||
this.doClose();
|
||||
if (this.$refs && this.$refs.pageRules) {
|
||||
const choose = this.$refs.pageRules.currentChoose();
|
||||
if (choose) {
|
||||
this.$emit('chooseConfirm', choose);
|
||||
} else {
|
||||
this.$messageBox(`请选择模板运行图`);
|
||||
}
|
||||
}
|
||||
},
|
||||
reloadTable() {
|
||||
this.queryList.reload()
|
||||
}
|
||||
}
|
||||
}
|
||||
currentModel: {}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
title() {
|
||||
return '选择模板运行图';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadInitData() {
|
||||
this.skinStyleList = [];
|
||||
getSkinStyleList().then(response => {
|
||||
this.skinStyleList = response.data;
|
||||
});
|
||||
},
|
||||
doShow() {
|
||||
this.loading = false;
|
||||
this.dialogShow = true;
|
||||
this.loadInitData();
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
},
|
||||
queryFunction(params) {
|
||||
if (this.$store.state.map && this.$store.state.map.map) {
|
||||
params['skinStyle'] = this.$store.getters['map/skinStyle'];
|
||||
}
|
||||
return runPlanTemplateList(params);
|
||||
},
|
||||
handleConfirm() {
|
||||
this.doClose();
|
||||
if (this.$refs && this.$refs.pageRules) {
|
||||
const choose = this.$refs.pageRules.currentChoose();
|
||||
if (choose) {
|
||||
this.$emit('chooseConfirm', choose);
|
||||
} else {
|
||||
this.$messageBox(`请选择模板运行图`);
|
||||
}
|
||||
}
|
||||
},
|
||||
reloadTable() {
|
||||
this.queryList.reload();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
@import "src/styles/mixin.scss";
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -1,70 +1,75 @@
|
||||
<template>
|
||||
<div v-if="show">
|
||||
<template v-if="maxmini">
|
||||
<div class="nav">
|
||||
<div class="cls-status" @click="touch('Close')" v-show="config.showClose"><span></span></div>
|
||||
<div class="min-status" @click="touch('Minim')"><span></span></div>
|
||||
</div>
|
||||
<el-table ref="table" :data="config.data" :highlight-current-row="config.highlightCurrentRow"
|
||||
@current-change="handleChange" :height="height" border>
|
||||
<template v-for="item in config.columns">
|
||||
<el-table-column :prop="item.prop" :label="item.label" :width="item.width">
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
<div v-if="show">
|
||||
<template v-if="maxmini">
|
||||
<div class="nav">
|
||||
<div v-show="config.showClose" class="cls-status" @click="touch('Close')"><span /></div>
|
||||
<div class="min-status" @click="touch('Minim')"><span /></div>
|
||||
</div>
|
||||
<el-table
|
||||
ref="table"
|
||||
:data="config.data"
|
||||
:highlight-current-row="config.highlightCurrentRow"
|
||||
:height="height"
|
||||
border
|
||||
@current-change="handleChange"
|
||||
>
|
||||
<template v-for="(item,index) in config.columns">
|
||||
<el-table-column :key="index" :prop="item.prop" :label="item.label" :width="item.width" />
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="nav">
|
||||
<div class=" max-status" @click="touch('Maxim')"><span></span></div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</el-table>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="nav">
|
||||
<div class=" max-status" @click="touch('Maxim')"><span /></div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'DataTable',
|
||||
props: {
|
||||
height: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
config: {
|
||||
type: Object,
|
||||
required: true,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: true,
|
||||
maxmini: true,
|
||||
touchStrategy: {
|
||||
'Close': [false, true],
|
||||
'Minim': [true, false],
|
||||
'Maxim': [true, true]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleChange(row) {
|
||||
if (this.config.handleChange) {
|
||||
this.config.handleChange(row);
|
||||
}
|
||||
},
|
||||
setCurrentRow(row) {
|
||||
this.$refs.table.setCurrentRow(row);
|
||||
},
|
||||
touch(operate) {
|
||||
this.$nextTick(() => {
|
||||
[this.show, this.maxmini] = this.touchStrategy[operate];
|
||||
this.$emit('touch', this.maxmini);
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
export default {
|
||||
name: 'DataTable',
|
||||
props: {
|
||||
height: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
config: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: true,
|
||||
maxmini: true,
|
||||
touchStrategy: {
|
||||
'Close': [false, true],
|
||||
'Minim': [true, false],
|
||||
'Maxim': [true, true]
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handleChange(row) {
|
||||
if (this.config.handleChange) {
|
||||
this.config.handleChange(row);
|
||||
}
|
||||
},
|
||||
setCurrentRow(row) {
|
||||
this.$refs.table.setCurrentRow(row);
|
||||
},
|
||||
touch(operate) {
|
||||
this.$nextTick(() => {
|
||||
[this.show, this.maxmini] = this.touchStrategy[operate];
|
||||
this.$emit('touch', this.maxmini);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
@import "src/styles/mixin.scss";
|
||||
$height: 20px;
|
||||
$width: 20px;
|
||||
@ -85,7 +90,6 @@
|
||||
line-height: $height;
|
||||
}
|
||||
|
||||
|
||||
/deep/ {
|
||||
.el-table--border th.gutter {
|
||||
background: #EBEADB !important;
|
||||
@ -119,7 +123,6 @@
|
||||
font-size: smaller !important;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.current-row>td {
|
||||
@ -143,7 +146,7 @@
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
vertical-align: middle;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
span::after {
|
||||
@ -152,7 +155,7 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(-90deg);
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
|
||||
@ -170,7 +173,7 @@
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
vertical-align: middle;
|
||||
-webkit-transform: rotate(-90deg);
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
|
||||
@ -187,7 +190,7 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
span::after {
|
||||
@ -196,8 +199,8 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(90deg);
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -1,142 +1,147 @@
|
||||
<template>
|
||||
<el-dialog :title="title" class="fuzhou-01__schedule reload-today-plan" :visible.sync="dialogShow" width="80%"
|
||||
:before-close="doClose" :modal="false" :close-on-click-modal="false" v-dialogDrag>
|
||||
<QueryListPage ref="pageRules" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList">
|
||||
</QueryListPage>
|
||||
<el-row type="flex" justify="center" class="button-group">
|
||||
<el-button type="primary" @click="handleConfirm" :loading="loading">加 载</el-button>
|
||||
<el-button @click="dialogShow = false">取 消</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
:title="title"
|
||||
class="fuzhou-01__schedule reload-today-plan"
|
||||
:visible.sync="dialogShow"
|
||||
width="80%"
|
||||
:before-close="doClose"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<QueryListPage ref="pageRules" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
|
||||
<el-row type="flex" justify="center" class="button-group">
|
||||
<el-button type="primary" :loading="loading" @click="handleConfirm">加 载</el-button>
|
||||
<el-button @click="dialogShow = false">取 消</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listPublishMap } from '@/api/jmap/mapdraft';
|
||||
import { runPlanTemplateList, deleteRunPlanTemplate, generateUserRunPlanEveryDay } from '@/api/runplan';
|
||||
import { getStationListBySkinStyle } from '@/api/runplan';
|
||||
import { getEveryDayRunPlanData } from '@/api/simulation';
|
||||
import { getSkinStyleList } from '@/api/management/mapskin'
|
||||
import { UrlConfig } from '@/router/index';
|
||||
import { runPlanTemplateList, generateUserRunPlanEveryDay } from '@/api/runplan';
|
||||
import { getStationListBySkinStyle } from '@/api/runplan';
|
||||
import { getEveryDayRunPlanData } from '@/api/simulation';
|
||||
import { getSkinStyleList } from '@/api/management/mapskin';
|
||||
|
||||
export default {
|
||||
name: 'ReloadTodayPlan',
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
skinStyleList: [],
|
||||
pagerConfig: {
|
||||
pageSize: 'pageSize',
|
||||
pageIndex: 'pageNum'
|
||||
},
|
||||
queryForm: {
|
||||
reset: true,
|
||||
labelWidth: '100px',
|
||||
queryObject: {
|
||||
name: {
|
||||
type: 'text',
|
||||
label: '运行图名称'
|
||||
}
|
||||
}
|
||||
},
|
||||
queryList: {
|
||||
query: this.queryFunction,
|
||||
selectCheckShow: false,
|
||||
radioShow: true,
|
||||
columns: [
|
||||
{
|
||||
title: '运行图名称',
|
||||
prop: 'name'
|
||||
},
|
||||
{
|
||||
title: '皮肤类型',
|
||||
prop: 'skinStyle',
|
||||
type: 'tag',
|
||||
columnValue: (row) => {
|
||||
return this.$convertField(row.skinStyle, this.skinStyleList, ['code', 'name'])
|
||||
},
|
||||
tagType: (row) => { return 'success' }
|
||||
}
|
||||
]
|
||||
},
|
||||
export default {
|
||||
name: 'ReloadTodayPlan',
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
loading: false,
|
||||
skinStyleList: [],
|
||||
pagerConfig: {
|
||||
pageSize: 'pageSize',
|
||||
pageIndex: 'pageNum'
|
||||
},
|
||||
queryForm: {
|
||||
reset: true,
|
||||
labelWidth: '100px',
|
||||
queryObject: {
|
||||
name: {
|
||||
type: 'text',
|
||||
label: '运行图名称'
|
||||
}
|
||||
}
|
||||
},
|
||||
queryList: {
|
||||
query: this.queryFunction,
|
||||
selectCheckShow: false,
|
||||
radioShow: true,
|
||||
columns: [
|
||||
{
|
||||
title: '运行图名称',
|
||||
prop: 'name'
|
||||
},
|
||||
{
|
||||
title: '皮肤类型',
|
||||
prop: 'skinStyle',
|
||||
type: 'tag',
|
||||
columnValue: (row) => {
|
||||
return this.$convertField(row.skinStyle, this.skinStyleList, ['code', 'name']);
|
||||
},
|
||||
tagType: (row) => { return 'success'; }
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
currentModel: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
title() {
|
||||
return '加载当天计划'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadInitData() {
|
||||
this.skinStyleList = [];
|
||||
getSkinStyleList().then(response => {
|
||||
this.skinStyleList = response.data;
|
||||
})
|
||||
},
|
||||
doShow() {
|
||||
this.loading = false;
|
||||
this.dialogShow = true;
|
||||
this.loadInitData();
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
},
|
||||
queryFunction(params) {
|
||||
if (this.$store.state.map && this.$store.state.map.map) {
|
||||
params['skinStyle'] = this.$store.getters['map/skinStyle'];
|
||||
}
|
||||
return runPlanTemplateList(params);
|
||||
},
|
||||
// 生成每日运行图
|
||||
handleConfirm() {
|
||||
if (this.$refs && this.$refs.pageRules) {
|
||||
const choose = this.$refs.pageRules.currentChoose();
|
||||
if (choose && choose.id) {
|
||||
this.loading = true;
|
||||
generateUserRunPlanEveryDay(choose.id, this.$route.query.group).then(response => {
|
||||
this.loading = false;
|
||||
this.reloadTable()
|
||||
this.loadRunData();
|
||||
this.doClose();
|
||||
this.$message.success(`生成用户每日运行图成功`);
|
||||
}).catch(error => {
|
||||
this.loading = false;
|
||||
this.reloadTable()
|
||||
this.$messageBox(`生成用户每日运行图失败`);
|
||||
})
|
||||
} else {
|
||||
this.$messageBox(`请选择需要加载的运行图`);
|
||||
}
|
||||
}
|
||||
},
|
||||
loadRunData() {
|
||||
let skinStyle = this.$route.query.skinStyle;
|
||||
this.$store.dispatch('runPlan/clear');
|
||||
if (skinStyle) {
|
||||
getStationListBySkinStyle(skinStyle).then(response => {
|
||||
let stations = response.data;
|
||||
this.PlanConvert = this.$theme.loadPlanConvert(skinStyle);
|
||||
this.$store.dispatch('runPlan/setStations', stations).then(() => {
|
||||
getEveryDayRunPlanData(this.$route.query.group).then(resp => {
|
||||
this.$store.dispatch('runPlan/setPlanData', resp.data);
|
||||
}).catch(error => {
|
||||
this.$store.dispatch('runPlan/setPlanData', []);
|
||||
this.$messageBox(`获取运行图数据失败`);
|
||||
})
|
||||
})
|
||||
}).catch(error => {
|
||||
this.$messageBox(`获取车站列表失败`);
|
||||
});
|
||||
}
|
||||
},
|
||||
reloadTable() {
|
||||
this.queryList.reload()
|
||||
}
|
||||
}
|
||||
}
|
||||
currentModel: {}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
title() {
|
||||
return '加载当天计划';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadInitData() {
|
||||
this.skinStyleList = [];
|
||||
getSkinStyleList().then(response => {
|
||||
this.skinStyleList = response.data;
|
||||
});
|
||||
},
|
||||
doShow() {
|
||||
this.loading = false;
|
||||
this.dialogShow = true;
|
||||
this.loadInitData();
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
},
|
||||
queryFunction(params) {
|
||||
if (this.$store.state.map && this.$store.state.map.map) {
|
||||
params['skinStyle'] = this.$store.getters['map/skinStyle'];
|
||||
}
|
||||
return runPlanTemplateList(params);
|
||||
},
|
||||
// 生成每日运行图
|
||||
handleConfirm() {
|
||||
if (this.$refs && this.$refs.pageRules) {
|
||||
const choose = this.$refs.pageRules.currentChoose();
|
||||
if (choose && choose.id) {
|
||||
this.loading = true;
|
||||
generateUserRunPlanEveryDay(choose.id, this.$route.query.group).then(response => {
|
||||
this.loading = false;
|
||||
this.reloadTable();
|
||||
this.loadRunData();
|
||||
this.doClose();
|
||||
this.$message.success(`生成用户每日运行图成功`);
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.reloadTable();
|
||||
this.$messageBox(`生成用户每日运行图失败`);
|
||||
});
|
||||
} else {
|
||||
this.$messageBox(`请选择需要加载的运行图`);
|
||||
}
|
||||
}
|
||||
},
|
||||
loadRunData() {
|
||||
const skinStyle = this.$route.query.skinStyle;
|
||||
this.$store.dispatch('runPlan/clear');
|
||||
if (skinStyle) {
|
||||
getStationListBySkinStyle(skinStyle).then(response => {
|
||||
const stations = response.data;
|
||||
this.PlanConvert = this.$theme.loadPlanConvert(skinStyle);
|
||||
this.$store.dispatch('runPlan/setStations', stations).then(() => {
|
||||
getEveryDayRunPlanData(this.$route.query.group).then(resp => {
|
||||
this.$store.dispatch('runPlan/setPlanData', resp.data);
|
||||
}).catch(() => {
|
||||
this.$store.dispatch('runPlan/setPlanData', []);
|
||||
this.$messageBox(`获取运行图数据失败`);
|
||||
});
|
||||
});
|
||||
}).catch(() => {
|
||||
this.$messageBox(`获取车站列表失败`);
|
||||
});
|
||||
}
|
||||
},
|
||||
reloadTable() {
|
||||
this.queryList.reload();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
@import "src/styles/mixin.scss";
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -1,102 +1,98 @@
|
||||
<template>
|
||||
<div class="plan-schedule" style="width: 100%">
|
||||
<title-bar ref="titleBar" @back="back"></title-bar>
|
||||
<menu-bar ref="menuBar" :skinStyle="skinStyle" @dispatchDialog="dispatchDialog"></menu-bar>
|
||||
<!-- <menu-tool ref="menuTool" :skinStyle="skinStyle"></menu-tool> -->
|
||||
<schedule ref="schedule" :skinStyle="skinStyle" :group="group" :maxHeight="height" :maxWidth="width">
|
||||
</schedule>
|
||||
<status-bar ref="statusBar" :maxTop="height" @setPosition="setPosition"></status-bar>
|
||||
<div class="plan-schedule" style="width: 100%">
|
||||
<title-bar ref="titleBar" @back="back" />
|
||||
<menu-bar ref="menuBar" :skin-style="skinStyle" @dispatchDialog="dispatchDialog" />
|
||||
<schedule ref="schedule" :skin-style="skinStyle" :group="group" :max-height="height" :max-width="width" />
|
||||
<status-bar ref="statusBar" :max-top="height" @setPosition="setPosition" />
|
||||
|
||||
<manage-plan-list ref="managePlanList" @dispatchDialog="dispatchDialog"></manage-plan-list>
|
||||
<create-week-plan ref="createWeekPlan" @reloadTable="reloadTable"></create-week-plan>
|
||||
<create-today-plan ref="createTodayPlan"></create-today-plan>
|
||||
<modifying-plan ref="modifyingPlan" @dispatchDialog="dispatchDialog"></modifying-plan>
|
||||
<add-task ref="addTask"></add-task>
|
||||
<delete-task ref="deleteTask"></delete-task>
|
||||
<modifying-task ref="modifyingTask"></modifying-task>
|
||||
</div>
|
||||
<manage-plan-list ref="managePlanList" @dispatchDialog="dispatchDialog" />
|
||||
<create-week-plan ref="createWeekPlan" @reloadTable="reloadTable" />
|
||||
<create-today-plan ref="createTodayPlan" />
|
||||
<modifying-plan ref="modifyingPlan" @dispatchDialog="dispatchDialog" />
|
||||
<add-task ref="addTask" />
|
||||
<delete-task ref="deleteTask" />
|
||||
<modifying-task ref="modifyingTask" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import TitleBar from './titleBar';
|
||||
import MenuBar from './menuBar';
|
||||
import MenuTool from './menuTool';
|
||||
import StatusBar from './statusBar';
|
||||
import Schedule from './schedule';
|
||||
import ManagePlanList from '../menusPlan/managePlanList'
|
||||
import CreateWeekPlan from '../menusPlan/createWeekPlan';
|
||||
import CreateTodayPlan from '../menusPlan/createTodayPlan';
|
||||
import ModifyingPlan from '../menusPlan/modifyingPlan';
|
||||
import AddTask from '../menusPlan/addTask';
|
||||
import DeleteTask from '../menusPlan/deleteTask'
|
||||
import ModifyingTask from '../menusPlan/modifyingTask';
|
||||
import WindowResizeHandler from '@/mixin/WindowResizeHandler';
|
||||
import TitleBar from './titleBar';
|
||||
import MenuBar from './menuBar';
|
||||
import StatusBar from './statusBar';
|
||||
import Schedule from './schedule';
|
||||
import ManagePlanList from '../menusPlan/managePlanList';
|
||||
import CreateWeekPlan from '../menusPlan/createWeekPlan';
|
||||
import CreateTodayPlan from '../menusPlan/createTodayPlan';
|
||||
import ModifyingPlan from '../menusPlan/modifyingPlan';
|
||||
import AddTask from '../menusPlan/addTask';
|
||||
import DeleteTask from '../menusPlan/deleteTask';
|
||||
import ModifyingTask from '../menusPlan/modifyingTask';
|
||||
import WindowResizeHandler from '@/mixin/WindowResizeHandler';
|
||||
|
||||
export default {
|
||||
name: 'Menus',
|
||||
mixins: [
|
||||
WindowResizeHandler
|
||||
],
|
||||
props: {
|
||||
group: {
|
||||
type: String
|
||||
}
|
||||
},
|
||||
components: {
|
||||
TitleBar,
|
||||
MenuBar,
|
||||
MenuTool,
|
||||
StatusBar,
|
||||
Schedule,
|
||||
ManagePlanList,
|
||||
CreateWeekPlan,
|
||||
CreateTodayPlan,
|
||||
ModifyingPlan,
|
||||
AddTask,
|
||||
DeleteTask,
|
||||
ModifyingTask
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
width: 0,
|
||||
height: 0
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
skinStyle() {
|
||||
return this.$route.query.skinStyle || '02';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
resizeHandler() {
|
||||
this.width = this._clientWidth;
|
||||
this.height = this._clientHeight;
|
||||
},
|
||||
setPosition() {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.schedule.setPosition();
|
||||
})
|
||||
},
|
||||
dispatchDialog(dialogObj) {
|
||||
this.$nextTick(() => {
|
||||
if (this.$refs[dialogObj.name]) {
|
||||
this.$refs[dialogObj.name].doShow(dialogObj.params);
|
||||
}
|
||||
})
|
||||
},
|
||||
reloadTable(dialogObj) {
|
||||
if (this.$refs[dialogObj.name]) {
|
||||
this.$refs[dialogObj.name].reloadTable();
|
||||
}
|
||||
},
|
||||
confirm(params) {
|
||||
},
|
||||
back() {
|
||||
this.$emit('back');
|
||||
}
|
||||
}
|
||||
}
|
||||
export default {
|
||||
name: 'Menus',
|
||||
components: {
|
||||
TitleBar,
|
||||
MenuBar,
|
||||
StatusBar,
|
||||
Schedule,
|
||||
ManagePlanList,
|
||||
CreateWeekPlan,
|
||||
CreateTodayPlan,
|
||||
ModifyingPlan,
|
||||
AddTask,
|
||||
DeleteTask,
|
||||
ModifyingTask
|
||||
},
|
||||
mixins: [
|
||||
WindowResizeHandler
|
||||
],
|
||||
props: {
|
||||
group: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
width: 0,
|
||||
height: 0
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
skinStyle() {
|
||||
return this.$route.query.skinStyle || '02';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
resizeHandler() {
|
||||
this.width = this._clientWidth;
|
||||
this.height = this._clientHeight;
|
||||
},
|
||||
setPosition() {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.schedule.setPosition();
|
||||
});
|
||||
},
|
||||
dispatchDialog(dialogObj) {
|
||||
this.$nextTick(() => {
|
||||
if (this.$refs[dialogObj.name]) {
|
||||
this.$refs[dialogObj.name].doShow(dialogObj.params);
|
||||
}
|
||||
});
|
||||
},
|
||||
reloadTable(dialogObj) {
|
||||
if (this.$refs[dialogObj.name]) {
|
||||
this.$refs[dialogObj.name].reloadTable();
|
||||
}
|
||||
},
|
||||
confirm(params) {
|
||||
},
|
||||
back() {
|
||||
this.$emit('back');
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@ -207,7 +203,6 @@
|
||||
background: #ECE9D8 !important;
|
||||
}
|
||||
|
||||
|
||||
.fuzhou-01__schedule .el-dialog .el-button {
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
@ -244,7 +239,6 @@
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
|
||||
.fuzhou-01__schedule .el-dialog .el-input {
|
||||
border: 2px inset #E9E9E9;
|
||||
}
|
||||
@ -410,4 +404,4 @@
|
||||
background: #E9E9E9 !important;
|
||||
color: #000 !important;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -1,172 +0,0 @@
|
||||
<template>
|
||||
<div id="PlanMenuTool">
|
||||
<div class="nav">
|
||||
<div class="tool" v-for="(item,index) in tools" :key="index">
|
||||
<img :src="item.src" :alt="item.title" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import { prefixIntrger } from '@/utils/date';
|
||||
import logo_ from '@/assets/logo_.png';
|
||||
|
||||
|
||||
export default {
|
||||
name: 'PlanMenuTool',
|
||||
data() {
|
||||
return {
|
||||
tools: [
|
||||
{
|
||||
title: '服务器1',
|
||||
operate: '',
|
||||
src: logo_,
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '服务器2',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '前置机1',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '前置机2',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '主调',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '调度台1',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '调度台2',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '调度台3',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '大屏',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '维护工作站',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '运行图显示人工站',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '跳停',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '扣车',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '列车报警',
|
||||
operate: '',
|
||||
src: logo_,
|
||||
click: this.undeveloped,
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.training.initTime': function (initTime) {
|
||||
let date = new Date(initTime);
|
||||
this.time = `${prefixIntrger(date.getHours(), 2)}:${prefixIntrger(date.getMinutes(), 2)}${prefixIntrger(date.getSeconds(), 2)}`
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isShowSystemTime() {
|
||||
return this.$route.params.mode == 'demon' || this.$route.params.mode === 'dp' || !this.$route.params.mode;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.initTools();
|
||||
},
|
||||
methods: {
|
||||
initTools() {
|
||||
this.tools = [];
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
||||
@import "src/styles/mixin.scss";
|
||||
$top: 48px;
|
||||
$width: 25px;
|
||||
$height: 25px;
|
||||
|
||||
#PlanMenuTool {
|
||||
z-index: 5;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
top: $top;
|
||||
}
|
||||
|
||||
.nav {
|
||||
display: block;
|
||||
color: #0000;
|
||||
background: #EBEADB;
|
||||
border: 1px solid #B6BCCC !important;
|
||||
border-bottom: 2px solid #B6BCCC !important;
|
||||
list-style: none;
|
||||
height: $height;
|
||||
line-height: $height;
|
||||
}
|
||||
|
||||
.tool {
|
||||
padding-left: 10px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
float: left;
|
||||
margin: 1px;
|
||||
width: $width;
|
||||
|
||||
img {
|
||||
display: block;
|
||||
text-align: center;
|
||||
padding-top: 2px;
|
||||
height: $height - 5;
|
||||
width: $width - 5;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,473 +1,482 @@
|
||||
<template>
|
||||
<div id="PlanSchedule" :style="{top: top+'px', height: height+'px'}">
|
||||
<div class="left">
|
||||
<div :id="runPlanId"></div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<data-table ref="serviceTable" :height="height/2" :config="serviceNumberConfig" @touch="scheduleTouch"
|
||||
:style="{top: top-height/2+'px'}"></data-table>
|
||||
<data-table ref="tripTable" :height="height/2" :config="tripNumberConfig" @touch="trainNumTouch"
|
||||
:style="{top: top-height/2+'px'}"></data-table>
|
||||
</div>
|
||||
<div id="PlanSchedule" :style="{top: top+'px', height: height+'px'}">
|
||||
<div class="left">
|
||||
<div :id="runPlanId" />
|
||||
</div>
|
||||
<div class="right">
|
||||
<data-table
|
||||
ref="serviceTable"
|
||||
:height="height/2"
|
||||
:config="serviceNumberConfig"
|
||||
:style="{top: top-height/2+'px'}"
|
||||
@touch="scheduleTouch"
|
||||
/>
|
||||
<data-table
|
||||
ref="tripTable"
|
||||
:height="height/2"
|
||||
:config="tripNumberConfig"
|
||||
:style="{top: top-height/2+'px'}"
|
||||
@touch="trainNumTouch"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import { timeFormat } from '@/utils/date';
|
||||
import { runDiagramGetTime } from '@/api/simulation';
|
||||
import { getStationListBySkinStyle } from '@/api/runplan';
|
||||
import DataTable from '../menusPlan/components/dataTable';
|
||||
import { mapGetters } from 'vuex';
|
||||
import { timeFormat } from '@/utils/date';
|
||||
import { runDiagramGetTime } from '@/api/simulation';
|
||||
import DataTable from '../menusPlan/components/dataTable';
|
||||
|
||||
export default {
|
||||
name: 'PlanSchedule',
|
||||
props: {
|
||||
group: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
skinStyle: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
maxWidth: {
|
||||
type: Number,
|
||||
require: true
|
||||
},
|
||||
maxHeight: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
components: {
|
||||
DataTable
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
top: 0,
|
||||
height: 0,
|
||||
heights: [100, 100],
|
||||
runPlanId: 'plan-schedule-id',
|
||||
myChart: null,
|
||||
PlanConvert: {},
|
||||
serviceNumberConfig: {
|
||||
data: [],
|
||||
highlightCurrentRow: true,
|
||||
handleChange: this.serviceNumberChange,
|
||||
showClose: false,
|
||||
columns: [
|
||||
{
|
||||
prop: 'serviceNumber',
|
||||
label: '表号',
|
||||
},
|
||||
{
|
||||
width: 40
|
||||
}
|
||||
]
|
||||
},
|
||||
tripNumberConfig: {
|
||||
data: [],
|
||||
highlightCurrentRow: true,
|
||||
handleChange: this.tripNumberChange,
|
||||
showClose: false,
|
||||
columns: [
|
||||
{
|
||||
prop: 'tripNumber',
|
||||
label: '车次号',
|
||||
},
|
||||
{
|
||||
width: 40
|
||||
}
|
||||
]
|
||||
},
|
||||
realData: {},
|
||||
kmRangeCoordMap: {},
|
||||
option: {
|
||||
title: {
|
||||
text: '',
|
||||
left: 'center'
|
||||
},
|
||||
grid: {
|
||||
top: '30px',
|
||||
left: '120px',
|
||||
right: '40px',
|
||||
bottom: '65px',
|
||||
containLabel: true,
|
||||
backgroundColor: 'floralwhite'
|
||||
},
|
||||
toolbox: {
|
||||
right: '30px',
|
||||
feature: {
|
||||
dataZoom: {
|
||||
yAxisIndex: 'none'
|
||||
},
|
||||
restore: {},
|
||||
saveAsImage: {}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
axisPointer: {
|
||||
trigger: 'item',
|
||||
type: 'cross'
|
||||
},
|
||||
formatter: this.axisTooltip,
|
||||
borderWidth: 1,
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: [],
|
||||
axisLine: {
|
||||
onZero: false,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
color: '#d14a61'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: this.xAxisLableFormat,
|
||||
textStyle: {
|
||||
color: '#333'
|
||||
}
|
||||
},
|
||||
axisPointer: {
|
||||
snap: true,
|
||||
label: {
|
||||
formatter: this.xAxisPointFormat,
|
||||
backgroundColor: 'rgb(255,0,0,0.5)',
|
||||
color: 'white',
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLine: {
|
||||
onZero: false,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
color: '#d14a61'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
interval: 'auto',
|
||||
formatter: this.yAxisLableFormat,
|
||||
},
|
||||
axisPointer: {
|
||||
xAxisIndex: 'all',
|
||||
label: {
|
||||
formatter: this.yAxisPointFormat,
|
||||
backgroundColor: 'rgb(0,100,0,0.5)',
|
||||
color: 'white',
|
||||
}
|
||||
},
|
||||
min: 0,
|
||||
max: 0,
|
||||
},
|
||||
series: [],
|
||||
dataZoom: [
|
||||
{
|
||||
type: 'inside',
|
||||
},
|
||||
{
|
||||
fiterMode: 'filter',
|
||||
handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
|
||||
handleSize: '80%',
|
||||
handleStyle: {
|
||||
color: '#fff',
|
||||
shadowBlur: 3,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.6)',
|
||||
shadowOffsetX: 2,
|
||||
shadowOffsetY: 2
|
||||
},
|
||||
bottom: '20px'
|
||||
}
|
||||
]
|
||||
},
|
||||
absoluteTime: 2 * 3600,
|
||||
indexKmRangeMap: {}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
maxWidth() {
|
||||
this.setPosition();
|
||||
},
|
||||
maxHeight() {
|
||||
this.setPosition();
|
||||
},
|
||||
'$store.state.runPlan.planLoadedCount': async function () {
|
||||
await this.loadChartPage();
|
||||
},
|
||||
'$store.state.runPlan.planSizeCount': function () {
|
||||
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
|
||||
},
|
||||
'$store.state.runPlan.select.serviceNumber': function (val) {
|
||||
let index = this.serviceNumberConfig.data.findIndex(elem => {
|
||||
return elem.serviceNumber == val;
|
||||
})
|
||||
export default {
|
||||
name: 'PlanSchedule',
|
||||
components: {
|
||||
DataTable
|
||||
},
|
||||
props: {
|
||||
group: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
skinStyle: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
maxWidth: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
maxHeight: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
top: 0,
|
||||
height: 0,
|
||||
heights: [100, 100],
|
||||
runPlanId: 'plan-schedule-id',
|
||||
myChart: null,
|
||||
PlanConvert: {},
|
||||
serviceNumberConfig: {
|
||||
data: [],
|
||||
highlightCurrentRow: true,
|
||||
handleChange: this.serviceNumberChange,
|
||||
showClose: false,
|
||||
columns: [
|
||||
{
|
||||
prop: 'serviceNumber',
|
||||
label: '表号'
|
||||
},
|
||||
{
|
||||
width: 40
|
||||
}
|
||||
]
|
||||
},
|
||||
tripNumberConfig: {
|
||||
data: [],
|
||||
highlightCurrentRow: true,
|
||||
handleChange: this.tripNumberChange,
|
||||
showClose: false,
|
||||
columns: [
|
||||
{
|
||||
prop: 'tripNumber',
|
||||
label: '车次号'
|
||||
},
|
||||
{
|
||||
width: 40
|
||||
}
|
||||
]
|
||||
},
|
||||
realData: {},
|
||||
kmRangeCoordMap: {},
|
||||
option: {
|
||||
title: {
|
||||
text: '',
|
||||
left: 'center'
|
||||
},
|
||||
grid: {
|
||||
top: '30px',
|
||||
left: '120px',
|
||||
right: '40px',
|
||||
bottom: '65px',
|
||||
containLabel: true,
|
||||
backgroundColor: 'floralwhite'
|
||||
},
|
||||
toolbox: {
|
||||
right: '30px',
|
||||
feature: {
|
||||
dataZoom: {
|
||||
yAxisIndex: 'none'
|
||||
},
|
||||
restore: {},
|
||||
saveAsImage: {}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
axisPointer: {
|
||||
trigger: 'item',
|
||||
type: 'cross'
|
||||
},
|
||||
formatter: this.axisTooltip,
|
||||
borderWidth: 1
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: [],
|
||||
axisLine: {
|
||||
onZero: false,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
color: '#d14a61'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: this.xAxisLableFormat,
|
||||
textStyle: {
|
||||
color: '#333'
|
||||
}
|
||||
},
|
||||
axisPointer: {
|
||||
snap: true,
|
||||
label: {
|
||||
formatter: this.xAxisPointFormat,
|
||||
backgroundColor: 'rgb(255,0,0,0.5)',
|
||||
color: 'white'
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
axisLine: {
|
||||
onZero: false,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
color: '#d14a61'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
interval: 'auto',
|
||||
formatter: this.yAxisLableFormat
|
||||
},
|
||||
axisPointer: {
|
||||
xAxisIndex: 'all',
|
||||
label: {
|
||||
formatter: this.yAxisPointFormat,
|
||||
backgroundColor: 'rgb(0,100,0,0.5)',
|
||||
color: 'white'
|
||||
}
|
||||
},
|
||||
min: 0,
|
||||
max: 0
|
||||
},
|
||||
series: [],
|
||||
dataZoom: [
|
||||
{
|
||||
type: 'inside'
|
||||
},
|
||||
{
|
||||
fiterMode: 'filter',
|
||||
handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
|
||||
handleSize: '80%',
|
||||
handleStyle: {
|
||||
color: '#fff',
|
||||
shadowBlur: 3,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.6)',
|
||||
shadowOffsetX: 2,
|
||||
shadowOffsetY: 2
|
||||
},
|
||||
bottom: '20px'
|
||||
}
|
||||
]
|
||||
},
|
||||
absoluteTime: 2 * 3600,
|
||||
indexKmRangeMap: {}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('runPlan', [
|
||||
'stations'
|
||||
])
|
||||
},
|
||||
watch: {
|
||||
maxWidth() {
|
||||
this.setPosition();
|
||||
},
|
||||
maxHeight() {
|
||||
this.setPosition();
|
||||
},
|
||||
'$store.state.runPlan.planLoadedCount': async function () {
|
||||
await this.loadChartPage();
|
||||
},
|
||||
'$store.state.runPlan.planSizeCount': function () {
|
||||
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
|
||||
},
|
||||
'$store.state.runPlan.selected.serviceNumber': function (val) {
|
||||
const index = this.serviceNumberConfig.data.findIndex(elem => {
|
||||
return elem.serviceNumber == val;
|
||||
});
|
||||
|
||||
this.$refs.serviceTable.setCurrentRow(this.serviceNumberConfig.data[index]);
|
||||
},
|
||||
'$store.state.runPlan.select.tripNumber': function (val) {
|
||||
let index = this.tripNumberConfig.data.findIndex(elem => {
|
||||
return elem.tripNumber == val;
|
||||
})
|
||||
this.$refs.tripTable.setCurrentRow(this.tripNumberConfig.data[index]);
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('runPlan', [
|
||||
'stations'
|
||||
])
|
||||
},
|
||||
mounted() {
|
||||
this.PlanConvert = this.$theme.loadPlanConvert(this.skinStyle);
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.destroy();
|
||||
},
|
||||
methods: {
|
||||
serviceNumberChange(row) {
|
||||
if (row) {
|
||||
this.$store.dispatch('runPlan/setSelected', { serviceNumber: row.serviceNumber, tripNumber: null });
|
||||
let serviceObj = this.$store.state.runPlan.editData[row.serviceNumber]
|
||||
if (serviceObj) {
|
||||
this.analyticalTripNumber(serviceObj.trainMap);
|
||||
}
|
||||
}
|
||||
},
|
||||
tripNumberChange(row) {
|
||||
if (row) {
|
||||
this.$store.dispatch('runPlan/setSelected', { serviceNumber: this.$store.state.runPlan.selected.serviceNumber, tripNumber: row.tripNumber });
|
||||
}
|
||||
},
|
||||
async analyticalServiceNumber(data) {
|
||||
this.serviceNumberConfig.data = Object.keys(data || {})
|
||||
.sort((a, b) => { return data[a].oldIndex - data[b].oldIndex })
|
||||
.map(serviceNumber => { return { serviceNumber } });
|
||||
},
|
||||
async analyticalTripNumber(data) {
|
||||
this.tripNumberConfig.data = Object.keys(data || {})
|
||||
.sort((a, b) => { return data[a].oldIndex - data[b].oldIndex })
|
||||
.map(tripNumber => { return { tripNumber } });
|
||||
},
|
||||
async setPosition() {
|
||||
this.$nextTick(() => {
|
||||
let top = 3;
|
||||
let width = this.maxWidth * 0.85;
|
||||
let height = this.maxHeight;
|
||||
this.$refs.serviceTable.setCurrentRow(this.serviceNumberConfig.data[index]);
|
||||
},
|
||||
'$store.state.runPlan.selected.tripNumber': function (val) {
|
||||
const index = this.tripNumberConfig.data.findIndex(elem => {
|
||||
return elem.tripNumber == val;
|
||||
});
|
||||
this.$refs.tripTable.setCurrentRow(this.tripNumberConfig.data[index]);
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.PlanConvert = this.$theme.loadPlanConvert(this.skinStyle);
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.destroy();
|
||||
},
|
||||
methods: {
|
||||
serviceNumberChange(row) {
|
||||
if (row) {
|
||||
this.$store.dispatch('runPlan/setSelected', { serviceNumber: row.serviceNumber, tripNumber: null });
|
||||
const serviceObj = this.$store.state.runPlan.editData[row.serviceNumber];
|
||||
if (serviceObj) {
|
||||
this.analyticalTripNumber(serviceObj.trainMap);
|
||||
}
|
||||
}
|
||||
},
|
||||
tripNumberChange(row) {
|
||||
if (row) {
|
||||
this.$store.dispatch('runPlan/setSelected', { serviceNumber: this.$store.state.runPlan.selected.serviceNumber, tripNumber: row.tripNumber });
|
||||
}
|
||||
},
|
||||
async analyticalServiceNumber(data) {
|
||||
this.serviceNumberConfig.data = Object.keys(data || {})
|
||||
.sort((a, b) => { return data[a].oldIndex - data[b].oldIndex; })
|
||||
.map(serviceNumber => { return { serviceNumber }; });
|
||||
},
|
||||
async analyticalTripNumber(data) {
|
||||
this.tripNumberConfig.data = Object.keys(data || {})
|
||||
.sort((a, b) => { return data[a].oldIndex - data[b].oldIndex; })
|
||||
.map(tripNumber => { return { tripNumber }; });
|
||||
},
|
||||
async setPosition() {
|
||||
this.$nextTick(() => {
|
||||
let top = 3;
|
||||
const width = this.maxWidth * 0.85;
|
||||
let height = this.maxHeight;
|
||||
|
||||
let titleBar = document.getElementById('PlanTitleBar');
|
||||
let menuBar = document.getElementById('PlanMenuBar');
|
||||
let menuTool = document.getElementById('PlanMenuTool');
|
||||
let statusBar = document.getElementById('PlanStatusBar');
|
||||
const titleBar = document.getElementById('PlanTitleBar');
|
||||
const menuBar = document.getElementById('PlanMenuBar');
|
||||
const menuTool = document.getElementById('PlanMenuTool');
|
||||
const statusBar = document.getElementById('PlanStatusBar');
|
||||
|
||||
if (titleBar) {
|
||||
top += (titleBar.offsetHeight || 0);
|
||||
}
|
||||
if (titleBar) {
|
||||
top += (titleBar.offsetHeight || 0);
|
||||
}
|
||||
|
||||
if (menuBar) {
|
||||
top += (menuBar.offsetHeight || 0);
|
||||
}
|
||||
if (menuBar) {
|
||||
top += (menuBar.offsetHeight || 0);
|
||||
}
|
||||
|
||||
if (menuTool) {
|
||||
top += (menuTool.offsetHeight || 0);
|
||||
}
|
||||
if (menuTool) {
|
||||
top += (menuTool.offsetHeight || 0);
|
||||
}
|
||||
|
||||
if (statusBar) {
|
||||
height -= (statusBar.offsetHeight || 0);
|
||||
}
|
||||
if (statusBar) {
|
||||
height -= (statusBar.offsetHeight || 0);
|
||||
}
|
||||
|
||||
height = height - top;
|
||||
this.$store.dispatch('runPlan/resize', { width, height });
|
||||
height = height - top;
|
||||
this.$store.dispatch('runPlan/resize', { width, height });
|
||||
|
||||
if (this.top != top) {
|
||||
this.top = top;
|
||||
}
|
||||
if (this.top != top) {
|
||||
this.top = top;
|
||||
}
|
||||
|
||||
if (this.height != height) {
|
||||
this.height = height - 20 * 2;
|
||||
}
|
||||
})
|
||||
},
|
||||
async loadChartPage() {
|
||||
try {
|
||||
let series = [];
|
||||
let planData = this.$store.state.runPlan.planData || [];
|
||||
let stations = this.$store.state.runPlan.stations || [];
|
||||
if (this.height != height) {
|
||||
this.height = height - 20 * 2;
|
||||
}
|
||||
});
|
||||
},
|
||||
async loadChartPage() {
|
||||
try {
|
||||
let series = [];
|
||||
const planData = this.$store.state.runPlan.planData || [];
|
||||
const stations = this.$store.state.runPlan.stations || [];
|
||||
|
||||
this.viewDisabled = true;
|
||||
this.kmRangeCoordMap = this.PlanConvert.convertStationsToMap(stations);
|
||||
series = this.pushModels(series, [this.PlanConvert.initializeYaxis(stations)]);
|
||||
series = this.pushModels(series, this.PlanConvert.convertDataToModels(planData, stations, this.kmRangeCoordMap, { width: 0.5 }));
|
||||
await this.loadInitData(series);
|
||||
await this.analyticalServiceNumber(this.$store.state.runPlan.editData);
|
||||
this.viewDisabled = false;
|
||||
this.viewDisabled = true;
|
||||
this.kmRangeCoordMap = this.PlanConvert.convertStationsToMap(stations);
|
||||
series = this.pushModels(series, [this.PlanConvert.initializeYaxis(stations)]);
|
||||
series = this.pushModels(series, this.PlanConvert.convertDataToModels(planData, stations, this.kmRangeCoordMap, { width: 0.5 }));
|
||||
await this.loadInitData(series);
|
||||
await this.analyticalServiceNumber(this.$store.state.runPlan.editData);
|
||||
this.viewDisabled = false;
|
||||
|
||||
} catch (error) {
|
||||
this.viewDisabled = false;
|
||||
this.$messageBox(`加载运行图数据失败`);
|
||||
}
|
||||
},
|
||||
async loadInitData(series) {
|
||||
this.myChart && this.myChart.showLoading();
|
||||
await this.xAxisInit();
|
||||
await this.yAxisInit();
|
||||
await this.loadInitChart(series);
|
||||
this.myChart && this.myChart.hideLoading();
|
||||
},
|
||||
pushModels(series, models) {
|
||||
if (models && models.length) {
|
||||
models.forEach(elem => {
|
||||
if (elem) {
|
||||
series.push(elem);
|
||||
}
|
||||
})
|
||||
}
|
||||
} catch (error) {
|
||||
this.viewDisabled = false;
|
||||
this.$messageBox(`加载运行图数据失败`);
|
||||
}
|
||||
},
|
||||
async loadInitData(series) {
|
||||
this.myChart && this.myChart.showLoading();
|
||||
await this.xAxisInit();
|
||||
await this.yAxisInit();
|
||||
await this.loadInitChart(series);
|
||||
this.myChart && this.myChart.hideLoading();
|
||||
},
|
||||
pushModels(series, models) {
|
||||
if (models && models.length) {
|
||||
models.forEach(elem => {
|
||||
if (elem) {
|
||||
series.push(elem);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return series;
|
||||
},
|
||||
popModels(series, models) {
|
||||
if (models && models.length) {
|
||||
models.forEach(elem => {
|
||||
let index = series.indexOf(elem);
|
||||
if (index >= 0) {
|
||||
series.split(index, 1);
|
||||
}
|
||||
})
|
||||
}
|
||||
return series;
|
||||
},
|
||||
popModels(series, models) {
|
||||
if (models && models.length) {
|
||||
models.forEach(elem => {
|
||||
const index = series.indexOf(elem);
|
||||
if (index >= 0) {
|
||||
series.split(index, 1);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return series;
|
||||
},
|
||||
loadInitChart(series) {
|
||||
return new Promise((resolve, reject) => {
|
||||
try {
|
||||
let that = this;
|
||||
//加载echart配置
|
||||
require.config(
|
||||
{
|
||||
paths: {
|
||||
echarts: './js/dist'
|
||||
}
|
||||
}
|
||||
);
|
||||
// 按需加载所需图表，如需动态类型切换功能，别忘了同时加载相应图表
|
||||
require(
|
||||
[
|
||||
'echarts',
|
||||
'echarts/lib/chart/line',
|
||||
],
|
||||
function (ec) {
|
||||
that.destroy();
|
||||
return series;
|
||||
},
|
||||
loadInitChart(series) {
|
||||
return new Promise((resolve, reject) => {
|
||||
try {
|
||||
const that = this;
|
||||
// 加载echart配置
|
||||
require.config(
|
||||
{
|
||||
paths: {
|
||||
echarts: './js/dist'
|
||||
}
|
||||
}
|
||||
);
|
||||
// 按需加载所需图表，如需动态类型切换功能，别忘了同时加载相应图表
|
||||
require(
|
||||
[
|
||||
'echarts',
|
||||
'echarts/lib/chart/line'
|
||||
],
|
||||
function (ec) {
|
||||
that.destroy();
|
||||
|
||||
let startValue = 3600 + that.PlanConvert.TranslationTime;
|
||||
let offsetTime = 3600;
|
||||
let startValue = 3600 + that.PlanConvert.TranslationTime;
|
||||
const offsetTime = 3600;
|
||||
|
||||
runDiagramGetTime(that.group).then(resp => {
|
||||
startValue = resp.data - that.PlanConvert.TranslationTime;
|
||||
that.option.dataZoom[0].startValue = that.option.dataZoom[1].startValue = startValue - offsetTime;
|
||||
that.option.dataZoom[0].endValue = that.option.dataZoom[1].endValue = startValue + offsetTime;
|
||||
that.option.series = series;
|
||||
that.myChart = ec.init(document.getElementById(that.runPlanId));
|
||||
if (that.myChart) {
|
||||
that.myChart.setOption(that.option);
|
||||
that.reSize({ width: that.$store.state.runPlan.width, height: that.$store.state.runPlan.height });
|
||||
that.myChart.on('click', that.mouseClick);
|
||||
}
|
||||
resolve(true);
|
||||
})
|
||||
}
|
||||
);
|
||||
} catch (error) {
|
||||
reject(error);
|
||||
}
|
||||
});
|
||||
},
|
||||
xAxisPointFormat(params) {
|
||||
return timeFormat(params.value);
|
||||
},
|
||||
yAxisPointFormat(params) {
|
||||
return this.PlanConvert.computedFormatYAxis(this.stations, params);
|
||||
},
|
||||
xAxisLableFormat(value, index) {
|
||||
if (value % 60 === 0) {
|
||||
return timeFormat(value);
|
||||
}
|
||||
},
|
||||
yAxisLableFormat(value, index) {
|
||||
return '';
|
||||
},
|
||||
xAxisInit() {
|
||||
let list = [];
|
||||
for (var time = 0 + this.PlanConvert.TranslationTime; time < 3600 * 24 + this.PlanConvert.TranslationTime; time++) {
|
||||
list.push(time);
|
||||
}
|
||||
runDiagramGetTime(that.group).then(resp => {
|
||||
startValue = resp.data - that.PlanConvert.TranslationTime;
|
||||
that.option.dataZoom[0].startValue = that.option.dataZoom[1].startValue = startValue - offsetTime;
|
||||
that.option.dataZoom[0].endValue = that.option.dataZoom[1].endValue = startValue + offsetTime;
|
||||
that.option.series = series;
|
||||
that.myChart = ec.init(document.getElementById(that.runPlanId));
|
||||
if (that.myChart) {
|
||||
that.myChart.setOption(that.option);
|
||||
that.reSize({ width: that.$store.state.runPlan.width, height: that.$store.state.runPlan.height });
|
||||
that.myChart.on('click', that.mouseClick);
|
||||
}
|
||||
resolve(true);
|
||||
});
|
||||
}
|
||||
);
|
||||
} catch (error) {
|
||||
reject(error);
|
||||
}
|
||||
});
|
||||
},
|
||||
xAxisPointFormat(params) {
|
||||
return timeFormat(params.value);
|
||||
},
|
||||
yAxisPointFormat(params) {
|
||||
return this.PlanConvert.computedFormatYAxis(this.stations, params);
|
||||
},
|
||||
xAxisLableFormat(value, index) {
|
||||
if (value % 60 === 0) {
|
||||
return timeFormat(value);
|
||||
}
|
||||
},
|
||||
yAxisLableFormat(value, index) {
|
||||
return '';
|
||||
},
|
||||
xAxisInit() {
|
||||
const list = [];
|
||||
for (var time = 0 + this.PlanConvert.TranslationTime; time < 3600 * 24 + this.PlanConvert.TranslationTime; time++) {
|
||||
list.push(time);
|
||||
}
|
||||
|
||||
let startValue = 3600 * 6;
|
||||
let offsetTime = 3600 * 1;
|
||||
const startValue = 3600 * 6;
|
||||
const offsetTime = 3600 * 1;
|
||||
|
||||
this.option.xAxis[0].data = list;
|
||||
if (!this.option.dataZoom[0].startValue) {
|
||||
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
|
||||
}
|
||||
this.option.xAxis[0].data = list;
|
||||
if (!this.option.dataZoom[0].startValue) {
|
||||
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
|
||||
}
|
||||
|
||||
if (!this.option.dataZoom[0].endValue) {
|
||||
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
|
||||
}
|
||||
},
|
||||
yAxisInit() {
|
||||
if (Object.keys(this.PlanConvert).length) {
|
||||
this.option.yAxis.min = this.PlanConvert.computedYaxisMinValue(this.stations);
|
||||
this.option.yAxis.max = this.PlanConvert.computedYaxisMaxValue(this.stations);
|
||||
}
|
||||
},
|
||||
axisTooltip(param) {
|
||||
let station = this.stations[Math.floor((param.data[1] - this.PlanConvert.EdgeHeight) / this.PlanConvert.CoordMultiple)] || { name: '', kmRange: '' };
|
||||
return [
|
||||
`Point Data <hr size=1 style=" margin: 3px 0">`,
|
||||
`车站名称: ${station.name}<br>`,
|
||||
`车站公里标: ${station.kmRange} km <br>`,
|
||||
`到站时间: ${timeFormat(param.data[0] + this.PlanConvert.TranslationTime)} (${param.data[0]})<br>`
|
||||
].join('');
|
||||
},
|
||||
mouseClick(params) {
|
||||
let model = {
|
||||
serviceNumber: params.seriesName
|
||||
}
|
||||
this.$store.dispatch('runPlan/setSelected', model);
|
||||
},
|
||||
reSize(opt) {
|
||||
if (this.myChart) {
|
||||
this.myChart.resize({
|
||||
width: opt.width,
|
||||
height: opt.height,
|
||||
silent: false
|
||||
});
|
||||
}
|
||||
},
|
||||
destroy() {
|
||||
if (this.myChart && this.myChart.isDisposed) {
|
||||
this.myChart.dispose();
|
||||
this.myChart = null;
|
||||
}
|
||||
},
|
||||
scheduleTouch() {
|
||||
if (!this.option.dataZoom[0].endValue) {
|
||||
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
|
||||
}
|
||||
},
|
||||
yAxisInit() {
|
||||
if (Object.keys(this.PlanConvert).length) {
|
||||
this.option.yAxis.min = this.PlanConvert.computedYaxisMinValue(this.stations);
|
||||
this.option.yAxis.max = this.PlanConvert.computedYaxisMaxValue(this.stations);
|
||||
}
|
||||
},
|
||||
axisTooltip(param) {
|
||||
const station = this.stations[Math.floor((param.data[1] - this.PlanConvert.EdgeHeight) / this.PlanConvert.CoordMultiple)] || { name: '', kmRange: '' };
|
||||
return [
|
||||
`Point Data <hr size=1 style=" margin: 3px 0">`,
|
||||
`车站名称: ${station.name}<br>`,
|
||||
`车站公里标: ${station.kmRange} km <br>`,
|
||||
`到站时间: ${timeFormat(param.data[0] + this.PlanConvert.TranslationTime)} (${param.data[0]})<br>`
|
||||
].join('');
|
||||
},
|
||||
mouseClick(params) {
|
||||
const model = {
|
||||
serviceNumber: params.seriesName
|
||||
};
|
||||
this.$store.dispatch('runPlan/setSelected', model);
|
||||
},
|
||||
reSize(opt) {
|
||||
if (this.myChart) {
|
||||
this.myChart.resize({
|
||||
width: opt.width,
|
||||
height: opt.height,
|
||||
silent: false
|
||||
});
|
||||
}
|
||||
},
|
||||
destroy() {
|
||||
if (this.myChart && this.myChart.isDisposed) {
|
||||
this.myChart.dispose();
|
||||
this.myChart = null;
|
||||
}
|
||||
},
|
||||
scheduleTouch() {
|
||||
|
||||
},
|
||||
trainNumTouch() {
|
||||
},
|
||||
trainNumTouch() {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
@import "src/styles/mixin.scss";
|
||||
|
||||
#PlanSchedule {
|
||||
@ -487,4 +496,4 @@
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -1,95 +1,102 @@
|
||||
<template>
|
||||
<data-table id="PlanStatusBar" ref="dataTable" :height="height-11" :config="stationListConfig" :close="false"
|
||||
:style="{top: maxmini? maxTop-110+'px':maxTop-21+'px'}" @touch="touch"></data-table>
|
||||
<data-table
|
||||
id="PlanStatusBar"
|
||||
ref="dataTable"
|
||||
:height="height-11"
|
||||
:config="stationListConfig"
|
||||
:close="false"
|
||||
:style="{top: maxmini? maxTop-110+'px':maxTop-21+'px'}"
|
||||
@touch="touch"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import DataTable from '../menusPlan/components/dataTable';
|
||||
import { formatTime, formatName } from '@/utils/runPlan';
|
||||
import DataTable from '../menusPlan/components/dataTable';
|
||||
import { formatTime, formatName } from '@/utils/runPlan';
|
||||
|
||||
export default {
|
||||
name: 'PlanStatusBar',
|
||||
props: {
|
||||
maxTop: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
components: {
|
||||
DataTable
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
maxmini: true,
|
||||
height: 100,
|
||||
stationListConfig: {
|
||||
data: [],
|
||||
showClose: true,
|
||||
highlightCurrentRow: true,
|
||||
columns: [
|
||||
{
|
||||
prop: 'stationName',
|
||||
label: '站台',
|
||||
width: 400
|
||||
},
|
||||
{
|
||||
prop: 'startTime',
|
||||
label: '到点',
|
||||
},
|
||||
{
|
||||
prop: 'stopTime',
|
||||
label: '停站时间',
|
||||
},
|
||||
{
|
||||
prop: 'endTime',
|
||||
label: '发点',
|
||||
},
|
||||
{
|
||||
prop: 'level',
|
||||
label: '运行等级'
|
||||
export default {
|
||||
name: 'PlanStatusBar',
|
||||
components: {
|
||||
DataTable
|
||||
},
|
||||
props: {
|
||||
maxTop: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
maxmini: true,
|
||||
height: 100,
|
||||
stationListConfig: {
|
||||
data: [],
|
||||
showClose: true,
|
||||
highlightCurrentRow: true,
|
||||
columns: [
|
||||
{
|
||||
prop: 'stationName',
|
||||
label: '站台',
|
||||
width: 400
|
||||
},
|
||||
{
|
||||
prop: 'startTime',
|
||||
label: '到点'
|
||||
},
|
||||
{
|
||||
prop: 'stopTime',
|
||||
label: '停站时间'
|
||||
},
|
||||
{
|
||||
prop: 'endTime',
|
||||
label: '发点'
|
||||
},
|
||||
{
|
||||
prop: 'level',
|
||||
label: '运行等级'
|
||||
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.runPlan.select': function (select) {
|
||||
this.stationListConfig.data = [];
|
||||
let serviceObj = this.$store.state.runPlan.editData[select.serviceNumber];
|
||||
if (serviceObj) {
|
||||
let trainMap = serviceObj.trainMap;
|
||||
if (trainMap) {
|
||||
let trainObj = trainMap[select.tripNumber];
|
||||
if (trainObj) {
|
||||
let stationTimeList = trainObj.stationTimeList;
|
||||
if (stationTimeList && stationTimeList.length) {
|
||||
stationTimeList.forEach((elem, index) => {
|
||||
let stationObj = {
|
||||
stationName: formatName(elem.stationCode),
|
||||
startTime: formatTime(index == 0 ? null : stationTimeList[index - 1].secondTime),
|
||||
stopTime: formatTime(index == 0 ? null : elem.secondTime - stationTimeList[index - 1].secondTime),
|
||||
endTime: formatTime(elem.secondTime),
|
||||
level: ''
|
||||
}
|
||||
this.stationListConfig.data.push(stationObj);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
touch(maxmini) {
|
||||
this.maxmini = maxmini;
|
||||
this.$emit('setPosition');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'$store.state.runPlan.selected': function (select) {
|
||||
this.stationListConfig.data = [];
|
||||
const serviceObj = this.$store.state.runPlan.editData[select.serviceNumber];
|
||||
if (serviceObj) {
|
||||
const trainMap = serviceObj.trainMap;
|
||||
if (trainMap) {
|
||||
const trainObj = trainMap[select.tripNumber];
|
||||
if (trainObj) {
|
||||
const stationTimeList = trainObj.stationTimeList;
|
||||
if (stationTimeList && stationTimeList.length) {
|
||||
stationTimeList.forEach((elem, index) => {
|
||||
const stationObj = {
|
||||
stationName: formatName(elem.stationCode),
|
||||
startTime: formatTime(index == 0 ? null : stationTimeList[index - 1].secondTime),
|
||||
stopTime: formatTime(index == 0 ? null : elem.secondTime - stationTimeList[index - 1].secondTime),
|
||||
endTime: formatTime(elem.secondTime),
|
||||
level: ''
|
||||
};
|
||||
this.stationListConfig.data.push(stationObj);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
touch(maxmini) {
|
||||
this.maxmini = maxmini;
|
||||
this.$emit('setPosition');
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
@import "src/styles/mixin.scss";
|
||||
|
||||
#PlanStatusBar {
|
||||
@ -97,4 +104,4 @@
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -1,44 +1,44 @@
|
||||
<template>
|
||||
<div id="PlanTitleBar">
|
||||
<img class="logo" :src="logoImg" />
|
||||
<span> {{mapName}}  </span>
|
||||
<span v-if="runPlanName">({{runPlanName}})</span>
|
||||
<span class="system-close el-icon-close" @click="back"></span>
|
||||
</div>
|
||||
<div id="PlanTitleBar">
|
||||
<img class="logo" :src="logoImg">
|
||||
<span> {{ mapName }}  </span>
|
||||
<span v-if="runPlanName">({{ runPlanName }})</span>
|
||||
<span class="system-close el-icon-close" @click="back" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import logo_ from '@/assets/logo_.png';
|
||||
import { getPublishMapInfo } from '@/api/jmap/map';
|
||||
import logo_ from '@/assets/logo_.png';
|
||||
import { getPublishMapInfo } from '@/api/jmap/map';
|
||||
|
||||
export default {
|
||||
name: 'PlanTitleBar',
|
||||
data() {
|
||||
return {
|
||||
mapName: '',
|
||||
logoImg: logo_
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
runPlanName() {
|
||||
return this.$route.query.planName || '';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
if (this.$route.query.mapId) {
|
||||
getPublishMapInfo(this.$route.query.mapId).then(resp => {
|
||||
this.mapName = resp.data.name;
|
||||
})
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
back() {
|
||||
this.$emit('back');
|
||||
}
|
||||
}
|
||||
}
|
||||
export default {
|
||||
name: 'PlanTitleBar',
|
||||
data() {
|
||||
return {
|
||||
mapName: '',
|
||||
logoImg: logo_
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
runPlanName() {
|
||||
return this.$route.query.planName || '';
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
if (this.$route.query.mapId) {
|
||||
getPublishMapInfo(this.$route.query.mapId).then(resp => {
|
||||
this.mapName = resp.data.name;
|
||||
});
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
back() {
|
||||
this.$emit('back');
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
@import "src/styles/mixin.scss";
|
||||
$width: 25px;
|
||||
$height: 25px;
|
||||
@ -72,4 +72,4 @@
|
||||
right: 1px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -33,80 +33,85 @@ export function deviceFactory(type, elem) {
|
||||
return Object.assign({ _type: type }, deviceRender[type], elem);
|
||||
}
|
||||
|
||||
export function parser(data, jmap) {
|
||||
export function createDevice(type, model, propConvert) {
|
||||
const device = deviceFactory(type, model);
|
||||
return propConvert ? propConvert.initPrivateProps(device) : device;
|
||||
}
|
||||
|
||||
export function parser(data, skinStyle) {
|
||||
var mapDevice = {};
|
||||
var propConvert = Vue.prototype.$theme.loadPropConvert(jmap.skinStyle);
|
||||
var propConvert = skinStyle ? Vue.prototype.$theme.loadPropConvert(skinStyle): null;
|
||||
if (data) {
|
||||
zrUtil.each(data.linkList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.Link, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.Link, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.sectionList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.Section, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.Section, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.signalList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.Signal, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.Signal, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.stationList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.Station, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.Station, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.stationStandList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.StationStand, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.StationStand, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.stationControlList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.StationControl, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.StationControl, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.counterList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.StationCounter, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.StationCounter, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.delayShowList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.StationDelayUnlock, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.StationDelayUnlock, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.lineList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.Line, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.Line, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.textList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.Text, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.Text, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.zcList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.ZcControl, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.ZcControl, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.lcList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.LcControl, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.LcControl, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.tempSpeedLimitList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.LimitControl, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.LimitControl, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.resourceList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.ImageControl, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.ImageControl, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.trainList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.Train, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.Train, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.Line || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.Line, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.Line, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.Text || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.Text, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.Text, elem, propConvert);
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.trainWindowList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.TrainWindow, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.TrainWindow, elem, propConvert);
|
||||
if (elem.sectionCode) {
|
||||
const section = mapDevice[elem.sectionCode];
|
||||
if (section) {
|
||||
@ -116,7 +121,7 @@ export function parser(data, jmap) {
|
||||
}, this);
|
||||
|
||||
zrUtil.each(data.switchList || [], elem => {
|
||||
mapDevice[elem.code] = propConvert.initPrivateProps(deviceFactory(deviceType.Switch, elem));
|
||||
mapDevice[elem.code] = createDevice(deviceType.Switch, elem, propConvert);
|
||||
const cnodeSection = mapDevice[mapDevice[elem.code].sectionACode];
|
||||
const lnodeSection = mapDevice[mapDevice[elem.code].sectionBCode];
|
||||
const rnodeSection = mapDevice[mapDevice[elem.code].sectionCCode];
|
||||
|
||||
@ -73,13 +73,13 @@ export default {
|
||||
{ label: 'SHD三联段线', value: '18' },
|
||||
{ label: 'SHD四联段线', value: '19' }
|
||||
],
|
||||
roleType:[
|
||||
{label:'管理员',value:'Admin'},
|
||||
{label:'教员',value:'Instructor'},
|
||||
{label:'行调',value:'Dispatcher'},
|
||||
{label:'车站',value:'Attendant'},
|
||||
{label:'观众',value:'Audience'},
|
||||
{label:'司机',value:'Driver'},
|
||||
roleType: [
|
||||
{label: '管理员', value: 'Admin'},
|
||||
{label: '教员', value: 'Instructor'},
|
||||
{label: '行调', value: 'Dispatcher'},
|
||||
{label: '车站', value: 'Attendant'},
|
||||
{label: '观众', value: 'Audience'},
|
||||
{label: '司机', value: 'Driver'}
|
||||
],
|
||||
|
||||
SimulationType: [
|
||||
@ -88,14 +88,14 @@ export default {
|
||||
{ label: '综合演练', value: 'Joint'},
|
||||
{ label: '大屏', value: 'BigScreen'},
|
||||
{ label: '琏计划', value: 'RunPlan'},
|
||||
{ label: '任务录制', value: 'ScriptRecord'},
|
||||
{ label: '任务录制', value: 'ScriptRecord'}
|
||||
],
|
||||
|
||||
skinCode: [
|
||||
{ label: '福州一号线', value: '02'},
|
||||
{ label: '北京一号线', value: '03'},
|
||||
{ label: '成都三号线', value: '04'},
|
||||
{ label: '北京八通线', value: '05'},
|
||||
{ label: '北京八通线', value: '05'}
|
||||
]
|
||||
|
||||
}
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import deviceType from '@/jmap/constant/deviceType';
|
||||
import { parser } from '@/jmap/utils/parser';
|
||||
import Vue from 'vue';
|
||||
|
||||
/**
|
||||
@ -190,6 +191,7 @@ const map = {
|
||||
|
||||
state: {
|
||||
map: null, // 地图数据
|
||||
mapDevice: {}, // 解析后的地图数据
|
||||
mapList: {}, // 地图数据列表
|
||||
mapViewLoadedCount: 0, // 地图视图加载完成标识
|
||||
mapDataLoadedCount: 0, // 地图数据加载完成标识
|
||||
@ -351,25 +353,21 @@ const map = {
|
||||
trainDetails: (state) => {
|
||||
return state.trainDetails;
|
||||
},
|
||||
getDeviceByCode: () => (code) => {
|
||||
if (Vue.prototype.$jlmap) {
|
||||
return Vue.prototype.$jlmap.getDeviceByCode(code);
|
||||
}
|
||||
getDeviceByCode: (state) => (code) => {
|
||||
return state.mapDevice[code];
|
||||
},
|
||||
|
||||
// 查询区段关联的计数器
|
||||
getCounterBySectionCode: (state) => (code, type) => {
|
||||
let device = null;
|
||||
if (Vue.prototype.$jlmap) {
|
||||
var section = Vue.prototype.$jlmap.mapDevice[code];
|
||||
if (section) {
|
||||
state.map.counterList.forEach(counter => {
|
||||
if (counter.stationCode === section.model.stationCode && type == counter.type) {
|
||||
device = Vue.prototype.$jlmap.mapDevice[counter.code];
|
||||
return;
|
||||
}
|
||||
});
|
||||
}
|
||||
var section = state.mapDevice[code];
|
||||
if (section) {
|
||||
state.map.counterList.forEach(counter => {
|
||||
if (counter.stationCode === section.model.stationCode && type == counter.type) {
|
||||
device = state.mapDevice[counter.code];
|
||||
return;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return device;
|
||||
@ -378,16 +376,14 @@ const map = {
|
||||
// 查询信号机关联的计数器
|
||||
getCounterBySingalCode: (state) => (code, type) => {
|
||||
let device = null;
|
||||
if (Vue.prototype.$jlmap) {
|
||||
var signal = Vue.prototype.$jlmap.mapDevice[code];
|
||||
if (signal) {
|
||||
state.map.counterList.forEach(counter => {
|
||||
if (counter.stationCode === signal.model.stationCode && type == counter.type) {
|
||||
device = Vue.prototype.$jlmap.mapDevice[counter.code];
|
||||
return;
|
||||
}
|
||||
});
|
||||
}
|
||||
var signal = state.mapDevice[code];
|
||||
if (signal) {
|
||||
state.map.counterList.forEach(counter => {
|
||||
if (counter.stationCode === signal.model.stationCode && type == counter.type) {
|
||||
device = state.mapDevice[counter.code];
|
||||
return;
|
||||
}
|
||||
});
|
||||
}
|
||||
return device;
|
||||
},
|
||||
@ -395,12 +391,12 @@ const map = {
|
||||
// 查询所属车站关联的控制模式
|
||||
getStationControlByStationCode: (state) => (code) => {
|
||||
let device = null;
|
||||
if (Vue.prototype.$jlmap && code &&
|
||||
if (code &&
|
||||
state.map &&
|
||||
state.map.stationControlList && state.map.stationControlList.length) {
|
||||
state.map.stationControlList.forEach(elem => {
|
||||
if (elem.stationCode == code) {
|
||||
device = Vue.prototype.$jlmap.mapDevice[elem.code];
|
||||
device = state.mapDevice[elem.code];
|
||||
}
|
||||
});
|
||||
}
|
||||
@ -411,7 +407,12 @@ const map = {
|
||||
|
||||
mutations: {
|
||||
setMapData: (state, map) => {
|
||||
state.map = map;
|
||||
if (map && map.skinVO) {
|
||||
state.map = map;
|
||||
state.mapDevice = parser(map, map.skinVO.code);
|
||||
} else {
|
||||
state.mapDevice = {};
|
||||
}
|
||||
},
|
||||
mapRender: (state, devices) => {
|
||||
Vue.prototype.$jlmap && Vue.prototype.$jlmap.render(devices);
|
||||
@ -450,6 +451,7 @@ const map = {
|
||||
},
|
||||
mapClear: (state) => {
|
||||
state.map = null;
|
||||
state.mapDevice = {};
|
||||
Vue.prototype.$jlmap && Vue.prototype.$jlmap.clear();
|
||||
}
|
||||
},
|
||||
|
||||
@ -1,3 +1,5 @@
|
||||
import store from '@/store';
|
||||
|
||||
/** 创建一个车次数据点*/
|
||||
export function createMartPoint(opt) {
|
||||
const rotate = opt.directionCode === '2' ? 45 : (opt.directionCode === '1' ? -45 : 0);
|
||||
@ -220,7 +222,7 @@ export function ascToNum(asc) {
|
||||
|
||||
/** 将时间格式化前补零*/
|
||||
export function formatTime(time) {
|
||||
let str = `${time}` || '';
|
||||
let str = `${time || ''}`;
|
||||
if (str) {
|
||||
const list = str.split(':');
|
||||
str = list.map(elem => {
|
||||
@ -231,6 +233,16 @@ export function formatTime(time) {
|
||||
return str;
|
||||
}
|
||||
|
||||
/** 通过code将名称格式化*/
|
||||
export function formatName(code) {
|
||||
var name = '';
|
||||
const device = store.getters['map/getDeviceByCode'](code);
|
||||
if (device) {
|
||||
name = device.name;
|
||||
}
|
||||
return name;
|
||||
}
|
||||
|
||||
/** 根据索引获取单元格的数据*/
|
||||
export function getCellValue(Sheet, index) {
|
||||
let value;
|
||||
@ -280,3 +292,4 @@ export function convertSheetToList(Sheet, isReverse) {
|
||||
|
||||
return dataList;
|
||||
}
|
||||
|
||||
|
||||
@ -211,7 +211,7 @@
|
||||
top: 0px;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
-webkit-transform: rotate(180deg);
|
||||
transform: rotate(180deg);
|
||||
-moz-transform: rotate(180deg);
|
||||
-ms-transform: rotate(180deg);
|
||||
-o-transform: rotate(180deg);
|
||||
@ -231,7 +231,7 @@
|
||||
top: 35%;
|
||||
margin-top: -1.5px;
|
||||
left: 16px;
|
||||
-webkit-transform-origin: 0% 50%;
|
||||
transform-origin: 0% 50%;
|
||||
-moz-transform-origin: 0% 50%;
|
||||
-ms-transform-origin: 0% 50%;
|
||||
-o-transform-origin: 0% 50%;
|
||||
@ -248,7 +248,7 @@
|
||||
background: #fff;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
-webkit-transform-origin: 0% 50%;
|
||||
transform-origin: 0% 50%;
|
||||
-moz-transform-origin: 0% 50%;
|
||||
-ms-transform-origin: 0% 50%;
|
||||
-o-transform-origin: 0% 50%;
|
||||
@ -303,14 +303,14 @@
|
||||
}
|
||||
|
||||
&.active {
|
||||
-webkit-transform: rotate(0deg) !important;
|
||||
transform: rotate(0deg) !important;
|
||||
-moz-transform: rotate(0deg) !important;
|
||||
-ms-transform: rotate(0deg) !important;
|
||||
-o-transform: rotate(0deg) !important;
|
||||
transform: rotate(0deg) !important;
|
||||
|
||||
.menu {
|
||||
-webkit-transform: scale(0.7);
|
||||
transform: scale(0.7);
|
||||
-moz-transform: scale(0.7);
|
||||
-ms-transform: scale(0.7);
|
||||
-o-transform: scale(0.7);
|
||||
@ -321,24 +321,24 @@
|
||||
margin-top: -1.5px;
|
||||
left: 50%;
|
||||
margin-left: -12px;
|
||||
-webkit-transform-origin: 50% 50%;
|
||||
transform-origin: 50% 50%;
|
||||
-moz-transform-origin: 50% 50%;
|
||||
-ms-transform-origin: 50% 50%;
|
||||
-o-transform-origin: 50% 50%;
|
||||
transform-origin: 50% 50%;
|
||||
-webkit-transform: rotate(405deg);
|
||||
transform: rotate(405deg);
|
||||
-moz-transform: rotate(405deg);
|
||||
-ms-transform: rotate(405deg);
|
||||
-o-transform: rotate(405deg);
|
||||
transform: rotate(405deg);
|
||||
|
||||
&:before {
|
||||
-webkit-transform-origin: 50% 50%;
|
||||
transform-origin: 50% 50%;
|
||||
-moz-transform-origin: 50% 50%;
|
||||
-ms-transform-origin: 50% 50%;
|
||||
-o-transform-origin: 50% 50%;
|
||||
transform-origin: 50% 50%;
|
||||
-webkit-transform: rotate(-450deg);
|
||||
transform: rotate(-450deg);
|
||||
-moz-transform: rotate(-450deg);
|
||||
-ms-transform: rotate(-450deg);
|
||||
-o-transform: rotate(-450deg);
|
||||
@ -358,23 +358,23 @@
|
||||
|
||||
0%,
|
||||
100% {
|
||||
-webkit-transform: translateY(0px);
|
||||
transform: translateY(0px);
|
||||
}
|
||||
|
||||
10% {
|
||||
-webkit-transform: translateY(6px);
|
||||
transform: translateY(6px);
|
||||
}
|
||||
|
||||
30% {
|
||||
-webkit-transform: translateY(-4px);
|
||||
transform: translateY(-4px);
|
||||
}
|
||||
|
||||
70% {
|
||||
-webkit-transform: translateY(3px);
|
||||
transform: translateY(3px);
|
||||
}
|
||||
|
||||
90% {
|
||||
-webkit-transform: translateY(-2px);
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
}
|
||||
|
||||
@ -406,7 +406,7 @@
|
||||
|
||||
0%,
|
||||
100% {
|
||||
-webkit-transform: translateY(0px);
|
||||
transform: translateY(0px);
|
||||
-moz-transform: translateY(0px);
|
||||
-ms-transform: translateY(0px);
|
||||
-o-transform: translateY(0px);
|
||||
@ -414,7 +414,7 @@
|
||||
}
|
||||
|
||||
10% {
|
||||
-webkit-transform: translateY(6px);
|
||||
transform: translateY(6px);
|
||||
-moz-transform: translateY(6px);
|
||||
-ms-transform: translateY(6px);
|
||||
-o-transform: translateY(6px);
|
||||
@ -422,7 +422,7 @@
|
||||
}
|
||||
|
||||
30% {
|
||||
-webkit-transform: translateY(-4px);
|
||||
transform: translateY(-4px);
|
||||
-moz-transform: translateY(-4px);
|
||||
-ms-transform: translateY(-4px);
|
||||
-o-transform: translateY(-4px);
|
||||
@ -430,7 +430,7 @@
|
||||
}
|
||||
|
||||
70% {
|
||||
-webkit-transform: translateY(3px);
|
||||
transform: translateY(3px);
|
||||
-moz-transform: translateY(3px);
|
||||
-ms-transform: translateY(3px);
|
||||
-o-transform: translateY(3px);
|
||||
@ -438,7 +438,7 @@
|
||||
}
|
||||
|
||||
90% {
|
||||
-webkit-transform: translateY(-2px);
|
||||
transform: translateY(-2px);
|
||||
-moz-transform: translateY(-2px);
|
||||
-ms-transform: translateY(-2px);
|
||||
-o-transform: translateY(-2px);
|
||||
|
||||
@ -15,7 +15,7 @@
|
||||
</div>
|
||||
<div class="brief-box">城市轨道交通仿真系统以各地铁信号系统为基础，针对培训部分进行改造，旨在构建一套用于行车演示的专业仿真模拟系统。
|
||||
该系统具有高灵活性以便于将来的扩展升级，同时，仿真系统具备正常操作及故障操作两种模式，除了正常的功能操作以外还可以进行设备的故障模拟。</div>
|
||||
{{ $t('hello') }}
|
||||
{{ $t('lesson.content') }}
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
@ -253,7 +253,7 @@ export default {
|
||||
},
|
||||
// 设置新的地图数据
|
||||
setMap(map) {
|
||||
this.$jlmap.setMap(map);
|
||||
this.$jlmap.setMap(map, this.$store.state.map.mapDevice);
|
||||
},
|
||||
// 刷新地图数据
|
||||
refresh(map) {
|
||||
|
||||
@ -7,7 +7,6 @@
|
||||
<transition>
|
||||
<router-view />
|
||||
</transition>
|
||||
<!-- <menu-location ref="menuLocation" /> -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@ -15,14 +14,12 @@ import WindowResizeHandler from '@/mixin/WindowResizeHandler';
|
||||
import MapListOperation from './mapmanage/maplist';
|
||||
import localStore from 'storejs';
|
||||
import DrapLeft from '@/views/components/drapLeft/index';
|
||||
// import MenuLocation from './menus/menuLocation';
|
||||
|
||||
export default {
|
||||
name: 'MapDraft',
|
||||
components: {
|
||||
MapListOperation,
|
||||
DrapLeft
|
||||
// MenuLocation
|
||||
},
|
||||
mixins: [
|
||||
WindowResizeHandler
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<el-dialog title="自动信号列表" :visible.sync="show" width="85%" :before-do-close="doClose">
|
||||
<el-dialog :title="$t('map.automaticSignalList')" :visible.sync="show" width="85%" :before-do-close="doClose">
|
||||
<div>
|
||||
<QueryListPage
|
||||
ref="queryListPage"
|
||||
@ -41,7 +41,7 @@ export default {
|
||||
queryObject: {
|
||||
signalCode: {
|
||||
type: 'select',
|
||||
label: '信号机',
|
||||
label: this.$t('map.signal'),
|
||||
config: {
|
||||
data: []
|
||||
}
|
||||
@ -55,38 +55,38 @@ export default {
|
||||
indexShow: true,
|
||||
columns: [
|
||||
{
|
||||
title: '自动信号编码',
|
||||
title: this.$t('map.automaticSignalCode'),
|
||||
prop: 'code'
|
||||
},
|
||||
{
|
||||
title: '信号机名称',
|
||||
title: this.$t('map.signalCodeName'),
|
||||
prop: 'signalCode'
|
||||
},
|
||||
{
|
||||
title: '信号机code',
|
||||
title: this.$t('map.signalCode'),
|
||||
prop: 'code'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
title: '区段数据',
|
||||
title: this.$t('map.sectionData'),
|
||||
buttons: [
|
||||
{
|
||||
name: '预览',
|
||||
name: this.$t('map.preview'),
|
||||
handleClick: this.sectionDetail
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
title: '操作',
|
||||
title: this.$t('map.operation'),
|
||||
width: '200',
|
||||
buttons: [
|
||||
{
|
||||
name: '编辑',
|
||||
name: this.$t('map.compile'),
|
||||
handleClick: this.editObj
|
||||
},
|
||||
{
|
||||
name: '删除',
|
||||
name: this.$t('map.delete'),
|
||||
handleClick: this.deleteObj,
|
||||
type: 'danger'
|
||||
}
|
||||
@ -182,10 +182,10 @@ export default {
|
||||
if (this.mapInfo && this.mapInfo.id && row) {
|
||||
// 删除
|
||||
delAutoSignal(row.id).then(response => {
|
||||
this.$message.success('删除成功');
|
||||
this.$message.success(this.$t('map.successfullyDelete'));
|
||||
this.reloadTable();
|
||||
}).catch(error => {
|
||||
this.$messageBox('删除失败');
|
||||
}).catch(() => {
|
||||
this.$messageBox(this.$t('map.failDelete'));
|
||||
});
|
||||
}
|
||||
},
|
||||
@ -197,12 +197,12 @@ export default {
|
||||
const fieldList = {
|
||||
id: row.id,
|
||||
mapId: this.$route.params.mapId,
|
||||
title: '区段列表',
|
||||
title: this.$t('map.sectionList'),
|
||||
name: row.code,
|
||||
model: {
|
||||
field: 'autoSignalClearList',
|
||||
items: [
|
||||
{ prop: 'sectionCode', label: '区段名称', type: 'select', options: sectionDict }
|
||||
{ prop: 'sectionCode', label: this.$t('map.sectionName'), type: 'select', options: sectionDict }
|
||||
]
|
||||
}
|
||||
};
|
||||
|
||||
@ -4,16 +4,16 @@
|
||||
<el-card>
|
||||
<div slot="header" class="clearfix">
|
||||
<span>
|
||||
地图名称：
|
||||
{{ $t('map.mapName') }}
|
||||
<b>{{ mapInfo.name }}</b>
|
||||
</span>
|
||||
<el-button type="text" style="float: right; padding: 3px 3px" @click="previewRouteEvent">预览
|
||||
<el-button type="text" style="float: right; padding: 3px 3px" @click="previewRouteEvent">{{ $t('map.preview') }}
|
||||
</el-button>
|
||||
<el-button type="text" style="float: right; padding: 3px 3px" @click="createRouteEvent">新建
|
||||
<el-button type="text" style="float: right; padding: 3px 3px" @click="createRouteEvent">{{ $t('map.newConstruction') }}
|
||||
</el-button>
|
||||
</div>
|
||||
<el-tabs v-model="enabledTab" type="card">
|
||||
<el-tab-pane label="自动信号" name="Route">
|
||||
<el-tab-pane :label="$t('map.automaticSignal')" name="Route">
|
||||
<route-draft
|
||||
ref="routeEdit"
|
||||
:selected="selected"
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper">
|
||||
<el-form ref="form" :model="addModel" :rules="rules" label-width="180px" size="mini">
|
||||
<div class="definition">
|
||||
<el-form-item label="信号机ID:" prop="signalCode">
|
||||
<el-form-item :label="$t('map.signalID')" prop="signalCode">
|
||||
<el-select v-model="addModel.signalCode" clearable :filterable="true">
|
||||
<el-option
|
||||
v-for="item in signalList"
|
||||
@ -12,10 +12,10 @@
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
<el-button :type="field === 'signalCode' ? 'danger' : 'primary'" @click="hover('signalCode')">激活
|
||||
<el-button :type="field === 'signalCode' ? 'danger' : 'primary'" @click="hover('signalCode')">{{ $t('map.activate') }}
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item label="进路自动触发区段数据:" prop="autoSignalClearList">
|
||||
<el-form-item :label="$t('map.segmentData')" prop="autoSignalClearList">
|
||||
<el-select v-model="addModel.autoSignalClearList" multiple clearable :filterable="true">
|
||||
<el-option
|
||||
v-for="item in sectionList"
|
||||
@ -27,13 +27,13 @@
|
||||
<el-button
|
||||
:type=" field === 'autoSignalClearList' ? 'danger' : 'primary'"
|
||||
@click="hover('autoSignalClearList')"
|
||||
>激活</el-button>
|
||||
>{{ $t('map.activate') }}</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button-group>
|
||||
<el-button v-if="isSave" type="primary" size="small" :loading="loading" @click="save">保存
|
||||
<el-button v-if="isSave" type="primary" size="small" :loading="loading" @click="save">{{ $t('map.save') }}
|
||||
</el-button>
|
||||
<el-button v-else type="warning" size="small" :loading="loading" @click="update">更新
|
||||
<el-button v-else type="warning" size="small" :loading="loading" @click="update">{{ $t('map.updata') }}
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</el-form-item>
|
||||
@ -82,10 +82,10 @@ export default {
|
||||
editShow: false,
|
||||
rules: {
|
||||
signalCode: [
|
||||
{ required: true, message: '请选择信号机', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseSelectSignal'), trigger: 'change' }
|
||||
],
|
||||
autoSignalClearList: [
|
||||
{ required: true, message: '请选择进路自动触发区段数据', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.triggerSegmentData'), trigger: 'change' }
|
||||
]
|
||||
}
|
||||
};
|
||||
@ -149,11 +149,11 @@ export default {
|
||||
if (valid) {
|
||||
this.loading = true;
|
||||
postAutoSignal(this.buildModel(getUID('autoSingle'))).then(resp => {
|
||||
this.$message.success('创建自动信号成功！');
|
||||
this.$message.success(this.$t('map.automaticSignalSuccessful'));
|
||||
this.loading = false;
|
||||
this.clear();
|
||||
}).catch(() => {
|
||||
this.$messageBox('创建自动信号失败');
|
||||
this.$messageBox(this.$t('map.failedCreateSignal'));
|
||||
this.loading = false;
|
||||
});
|
||||
}
|
||||
@ -164,11 +164,11 @@ export default {
|
||||
if (valid) {
|
||||
this.loading = true;
|
||||
putAutoSignal(this.buildModel()).then(resp => {
|
||||
this.$message.success('更新自动信号成功！');
|
||||
this.$message.success(this.$t('map.automaticSignalUpdateSucceeded'));
|
||||
this.loading = false;
|
||||
this.clear();
|
||||
}).catch(() => {
|
||||
this.$messageBox('更新自动信号失败');
|
||||
this.$messageBox(this.$t('map.automaticSignalUpdateFailed'));
|
||||
this.loading = false;
|
||||
});
|
||||
}
|
||||
|
||||
@ -1,21 +1,21 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-tabs v-model="activeName">
|
||||
<el-tab-pane class="view-control" label="属性" name="first">
|
||||
<el-tab-pane class="view-control" :label="$t('map.property')" name="first">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
|
||||
<config-list ref="form" :form="dataForm" :form-model="editModel" :rules="rules" />
|
||||
</el-scrollbar>
|
||||
<el-button-group class="map-draft-group">
|
||||
<el-button type="primary" @click="edit">修改</el-button>
|
||||
<el-button type="primary" @click="deleteObj">删除</el-button>
|
||||
<el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button>
|
||||
<el-button type="primary" @click="deleteObj">{{ $t('map.deleteObj') }}</el-button>
|
||||
</el-button-group>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane class="view-control" label="操作" name="second">
|
||||
<el-tab-pane class="view-control" :label="$t('map.operation')" name="second">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
|
||||
<config-list ref="make" :form="makeForm" :form-model="addModel" :rules="createRules" />
|
||||
</el-scrollbar>
|
||||
<el-button-group class="map-draft-group">
|
||||
<el-button type="primary" @click="create">创建</el-button>
|
||||
<el-button type="primary" @click="create">{{ $t('map.create') }}</el-button>
|
||||
</el-button-group>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
@ -51,11 +51,11 @@ export default {
|
||||
imageLists: [
|
||||
{
|
||||
value: `${process.env.VOICE_API}/oss/2d/bj1.png`,
|
||||
label: '上段'
|
||||
label: this.$t('map.upside')
|
||||
},
|
||||
{
|
||||
value: `${process.env.VOICE_API}/oss/2d/bj2.png`,
|
||||
label: '下段'
|
||||
label: this.$t('map.hypomere')
|
||||
}
|
||||
],
|
||||
editModel: {
|
||||
@ -85,16 +85,16 @@ export default {
|
||||
},
|
||||
rules: {
|
||||
width: [
|
||||
{ required: true, message: '请输入图片宽度', trigger: 'blur' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterImageWidth'), trigger: 'blur' }
|
||||
],
|
||||
height: [
|
||||
{ required: true, message: '请输入图片宽度', trigger: 'blur' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterImageHeight'), trigger: 'blur' }
|
||||
],
|
||||
'position.x': [
|
||||
{ required: true, message: '请输入x坐标位置', trigger: 'blur' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterXCoordinate'), trigger: 'blur' }
|
||||
],
|
||||
'position.y': [
|
||||
{ required: true, message: '请输入y坐标位置', trigger: 'blur' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterYCoordinate'), trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
};
|
||||
@ -107,13 +107,13 @@ export default {
|
||||
const form = {
|
||||
labelWidth: '150px',
|
||||
items: [
|
||||
{ prop: 'code', label: '编码:', type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.resourceList, change: true, deviceChange: this.deviceChange },
|
||||
{ prop: 'name', label: '图片名称:', type: 'input' },
|
||||
{ prop: 'width', label: '图片宽度:', type: 'number', min: 0 },
|
||||
{ prop: 'height', label: '图片高度:', type: 'number', min: 0 },
|
||||
{ prop: 'zIndex', label: '图片层级:', type: 'number', min: 0 },
|
||||
{ prop: 'rotate', label: '旋转角度:', type: 'number', min: 0 },
|
||||
{ prop: 'position', label: '图片坐标:', type: 'coordinate', width: '140px', children: [
|
||||
{ prop: 'code', label: this.$t('map.code'), type: 'select', optionLabel: 'name&&code', optionValue: 'code', options: this.resourceList, change: true, deviceChange: this.deviceChange },
|
||||
{ prop: 'name', label: this.$t('map.imageName'), type: 'input' },
|
||||
{ prop: 'width', label: this.$t('map.imageWidth'), type: 'number', min: 0 },
|
||||
{ prop: 'height', label: this.$t('map.imageHeight'), type: 'number', min: 0 },
|
||||
{ prop: 'zIndex', label: this.$t('map.imageZindex'), type: 'number', min: 0 },
|
||||
{ prop: 'rotate', label: this.$t('map.rotateAngle'), type: 'number', min: 0 },
|
||||
{ prop: 'position', label: this.$t('map.imagePoint'), type: 'coordinate', width: '140px', children: [
|
||||
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px' },
|
||||
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px' }
|
||||
] }
|
||||
@ -125,10 +125,10 @@ export default {
|
||||
const form = {
|
||||
labelWidth: '150px',
|
||||
items: [
|
||||
{ prop: 'width', label: '图片宽度:', type: 'number', min: 0 },
|
||||
{ prop: 'height', label: '图片高度:', type: 'number', min: 0 },
|
||||
{ prop: 'url', label: '图片选择:', type: 'select', optionLabel: 'label', optionValue: 'value', options: this.imageLists },
|
||||
{ prop: 'position', label: '图片坐标:', type: 'coordinate', width: '140px', children: [
|
||||
{ prop: 'width', label: this.$t('map.imageWidth'), type: 'number', min: 0 },
|
||||
{ prop: 'height', label: this.$t('map.imageHeight'), type: 'number', min: 0 },
|
||||
{ prop: 'url', label: this.$t('map.imageSelect'), type: 'select', optionLabel: 'label', optionValue: 'value', options: this.imageLists },
|
||||
{ prop: 'position', label: this.$t('map.imagePoint'), type: 'coordinate', width: '140px', children: [
|
||||
{ prop: 'position.x', firstLevel: 'position', secondLevel: 'x', label: 'x:', type: 'number', labelWidth: '20px' },
|
||||
{ prop: 'position.y', firstLevel: 'position', secondLevel: 'y', label: 'y:', type: 'number', labelWidth: '20px' }
|
||||
] }
|
||||
@ -139,16 +139,16 @@ export default {
|
||||
createRules: function () {
|
||||
return {
|
||||
width: [
|
||||
{ required: true, message: '请输入图片宽度', trigger: 'blur' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterImageWidth'), trigger: 'blur' }
|
||||
],
|
||||
height: [
|
||||
{ required: true, message: '请输入图片宽度', trigger: 'blur' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterImageHeight'), trigger: 'blur' }
|
||||
],
|
||||
'position.x': [
|
||||
{ required: true, message: '请输入x坐标位置', trigger: 'blur' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterXCoordinate'), trigger: 'blur' }
|
||||
],
|
||||
'position.y': [
|
||||
{ required: true, message: '请输入y坐标位置', trigger: 'blur' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterYCoordinate'), trigger: 'blur' }
|
||||
]
|
||||
};
|
||||
}
|
||||
@ -241,15 +241,15 @@ export default {
|
||||
const selected = this.$store.getters['map/getDeviceByCode'](this.editModel.code);
|
||||
if (selected && selected._type.toUpperCase() === 'ImageControl'.toUpperCase()) {
|
||||
const _that = this;
|
||||
this.$confirm('是否确认删除？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
this.$confirm(this.$t('map.confirmDeletion'), this.$t('map.hint'), {
|
||||
confirmButtonText: this.$t('map.confirm'),
|
||||
cancelButtonText: this.$t('map.cancel'),
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
_that.$emit('delMapModel', selected);
|
||||
_that.deviceSelect();
|
||||
}).catch(() => {
|
||||
_that.$message.info('已取消删除');
|
||||
_that.$message.info(this.$t('map.cancelledDelete'));
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@ -54,7 +54,7 @@
|
||||
<el-button
|
||||
:type="item.buttonShowType ? 'danger' : 'primary'"
|
||||
@click="item.hover(item.buttonType)"
|
||||
>激活</el-button>
|
||||
>{{ $t('map.activate') }}</el-button>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<template v-if="checkFieldType(item, 'input')">
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-tabs v-model="activeName">
|
||||
<el-tab-pane class="view-control" label="属性" name="first">
|
||||
<el-tab-pane class="view-control" :label="$t('map.property')" name="first">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
|
||||
<el-form ref="form" :model="editModel" :rules="editRules" label-width="120px" size="mini">
|
||||
<el-form-item label="计数器编码:" prop="code">
|
||||
<el-form-item :label="$t('map.counterCoding')" prop="code">
|
||||
<el-select v-model="editModel.code" filterable @change="deviceChange">
|
||||
<el-option
|
||||
v-for="item in counterList"
|
||||
@ -14,10 +14,10 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="计数器名称:" prop="name">
|
||||
<el-form-item :label="$t('map.counterName')" prop="name">
|
||||
<el-input v-model="editModel.name" />
|
||||
</el-form-item>
|
||||
<el-form-item label="所属车站:" prop="stationCode">
|
||||
<el-form-item :label="$t('map.belongsStation')" prop="stationCode">
|
||||
<el-select v-model="editModel.stationCode" filterable>
|
||||
<el-option
|
||||
v-for="item in stationList"
|
||||
@ -27,8 +27,8 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="计数器类型:" prop="type">
|
||||
<el-select v-model="editModel.type" filterable placeholder="请选择类型">
|
||||
<el-form-item :label="$t('map.counterType')" prop="type">
|
||||
<el-select v-model="editModel.type" filterable :placeholder="$t('map.pleaseSelect')">
|
||||
<el-option
|
||||
v-for="item in typeList"
|
||||
:key="item.code"
|
||||
@ -37,26 +37,26 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="计数器最大值:" prop="max">
|
||||
<el-form-item :label="$t('map.countMax')" prop="max">
|
||||
<el-input-number v-model="editModel.max" :min="0" />个
|
||||
</el-form-item>
|
||||
<el-form-item label="坐标 x:" prop="position.x">
|
||||
<el-form-item :label="$t('map.pointX')" prop="position.x">
|
||||
<el-input-number v-model="editModel.position.x" />px
|
||||
</el-form-item>
|
||||
<el-form-item label="坐标 y:" prop="position.y">
|
||||
<el-form-item :label="$t('map.pointY')" prop="position.y">
|
||||
<el-input-number v-model="editModel.position.y" />px
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
<el-button-group class="map-draft-group">
|
||||
<el-button type="primary" @click="edit">修改</el-button>
|
||||
<el-button type="primary" @click="deleteObj">删除</el-button>
|
||||
<el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button>
|
||||
<el-button type="primary" @click="deleteObj">{{ $t('map.deleteObj') }}</el-button>
|
||||
</el-button-group>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane class="view-control" label="操作" name="second">
|
||||
<el-tab-pane class="view-control" :label="$t('map.operation')" name="second">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
|
||||
<el-form ref="make" label-width="120px" :model="addModel" :rules="createRules" size="mini">
|
||||
<el-form-item label="车站名称:" prop="stationCode">
|
||||
<el-form-item :label="$t('map.stationName')" prop="stationCode">
|
||||
<el-select v-model="addModel.stationCode" filterable>
|
||||
<el-option
|
||||
v-for="item in stationList"
|
||||
@ -66,8 +66,8 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="计数器类型:" prop="type">
|
||||
<el-select v-model="addModel.type" filterable placeholder="请选择类型">
|
||||
<el-form-item :label="$t('map.counterType')" prop="type">
|
||||
<el-select v-model="addModel.type" filterable :placeholder="$t('map.pleaseSelect')">
|
||||
<el-option
|
||||
v-for="item in typeList"
|
||||
:key="item.code"
|
||||
@ -79,7 +79,7 @@
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
<el-button-group class="map-draft-group">
|
||||
<el-button type="primary" @click="create">创建</el-button>
|
||||
<el-button type="primary" @click="create">{{ $t('map.create') }}</el-button>
|
||||
</el-button-group>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
@ -110,8 +110,8 @@ export default {
|
||||
return {
|
||||
activeName: 'first',
|
||||
typeList: [
|
||||
{ code: '01', name: '区故解' },
|
||||
{ code: '02', name: '总人解' }
|
||||
{ code: '01', name: this.$t('map.areaSolution') },
|
||||
{ code: '02', name: this.$t('map.alwaysSolution') }
|
||||
],
|
||||
editModel: {
|
||||
code: '',
|
||||
@ -140,35 +140,35 @@ export default {
|
||||
createRules: function () {
|
||||
return {
|
||||
type: [
|
||||
{ required: true, message: '请选择计数器类型', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.selectCounterType'), trigger: 'change' }
|
||||
],
|
||||
stationCode: [
|
||||
{ required: true, message: '请选择车站', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.selectStation'), trigger: 'change' }
|
||||
]
|
||||
};
|
||||
},
|
||||
editRules: function () {
|
||||
return {
|
||||
code: [
|
||||
{ required: true, message: '请重新选择设备', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseSelectDevice'), trigger: 'change' }
|
||||
],
|
||||
stationCode: [
|
||||
{ required: true, message: '请选择车站', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.selectStation'), trigger: 'change' }
|
||||
],
|
||||
name: [
|
||||
{ required: true, message: '请输入计数器名称', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseSelectCountName'), trigger: 'change' }
|
||||
],
|
||||
type: [
|
||||
{ required: true, message: '请选择计数器类型', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.selectCounterType'), trigger: 'change' }
|
||||
],
|
||||
max: [
|
||||
{ required: true, message: '请输入计数器最大值', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseCounterValue'), trigger: 'change' }
|
||||
],
|
||||
'position.x': [
|
||||
{ required: true, message: '请输入x坐标', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterXCoordinate'), trigger: 'change' }
|
||||
],
|
||||
'position.y': [
|
||||
{ required: true, message: '请输入y坐标', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterYCoordinate'), trigger: 'change' }
|
||||
]
|
||||
};
|
||||
}
|
||||
@ -266,15 +266,15 @@ export default {
|
||||
const selected = this.$store.getters['map/getDeviceByCode'](this.editModel.code);
|
||||
if (selected && selected._type.toUpperCase() === 'Counter'.toUpperCase()) {
|
||||
const _that = this;
|
||||
this.$confirm('是否确认删除？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
this.$confirm(this.$t('map.confirmDeletion'), this.$t('map.hint'), {
|
||||
confirmButtonText: this.$t('map.confirm'),
|
||||
cancelButtonText: this.$t('map.cancel'),
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
_that.$emit('delMapModel', selected);
|
||||
_that.deviceSelect();
|
||||
}).catch(() => {
|
||||
_that.$message.info('已取消删除');
|
||||
_that.$message.info(this.$t('map.cancelledDelete'));
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-tabs v-model="activeName">
|
||||
<el-tab-pane class="view-control" label="属性" name="first">
|
||||
<el-tab-pane class="view-control" :label="$t('map.property')" name="first">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
|
||||
<el-form ref="form" :model="editModel" :rules="editRules" label-width="130px" size="mini">
|
||||
<el-form-item label="延时解锁编码:" prop="code">
|
||||
<el-form-item :label="$t('map.delayUnlockingCode')" prop="code">
|
||||
<el-select v-model="editModel.code" filterable @change="deviceChange">
|
||||
<el-option
|
||||
v-for="item in delayShowList"
|
||||
@ -14,7 +14,7 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属车站:" prop="stationCode">
|
||||
<el-form-item :label="$t('map.belongsStation')" prop="stationCode">
|
||||
<el-select v-model="editModel.stationCode" filterable>
|
||||
<el-option
|
||||
v-for="item in stationList"
|
||||
@ -24,32 +24,32 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="延时时间:" prop="unlockTime" disabled="true">
|
||||
<el-form-item :label="$t('map.delayTime')" prop="unlockTime" disabled="true">
|
||||
<el-input-number v-model="editModel.unlockTime" :min="0" :max="1000" />s
|
||||
</el-form-item>
|
||||
<el-form-item label="字体:" prop="fontFamily">
|
||||
<el-form-item :label="$t('map.font')" prop="fontFamily">
|
||||
<el-font v-model="editModel.fontFamily" />
|
||||
</el-form-item>
|
||||
<el-form-item label="颜色:" prop="textFontColor">
|
||||
<el-form-item :label="$t('map.color')" prop="textFontColor">
|
||||
<el-color-picker v-model="editModel.textFontColor" show-alpha :predefine="skins" />
|
||||
</el-form-item>
|
||||
<el-form-item label="坐标 x:" prop="position.x">
|
||||
<el-form-item :label="$t('map.pointX')" prop="position.x">
|
||||
<el-input-number v-model="editModel.position.x" />px
|
||||
</el-form-item>
|
||||
<el-form-item label="坐标 y:" prop="position.y">
|
||||
<el-form-item :label="$t('map.pointY')" prop="position.y">
|
||||
<el-input-number v-model="editModel.position.y" />px
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
<el-button-group class="map-draft-group">
|
||||
<el-button type="primary" @click="edit">修改</el-button>
|
||||
<el-button type="primary" @click="deleteObj">删除</el-button>
|
||||
<el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button>
|
||||
<el-button type="primary" @click="deleteObj">{{ $t('map.deleteObj') }}</el-button>
|
||||
</el-button-group>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane class="view-control" label="操作" name="second">
|
||||
<el-tab-pane class="view-control" :label="$t('map.operation')" name="second">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
|
||||
<el-form ref="make" label-width="120px" :rules="createRules" :model="addModel" size="mini">
|
||||
<el-form-item label="车站名称:" prop="stationCode">
|
||||
<el-form-item :label="$t('map.stationName')" prop="stationCode">
|
||||
<el-select v-model="addModel.stationCode" filterable>
|
||||
<el-option
|
||||
v-for="item in stationList"
|
||||
@ -62,7 +62,7 @@
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
<el-button-group class="map-draft-group">
|
||||
<el-button type="primary" @click="create">创建</el-button>
|
||||
<el-button type="primary" @click="create">{{ $t('map.create') }}</el-button>
|
||||
</el-button-group>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
@ -120,32 +120,32 @@ export default {
|
||||
createRules: function () {
|
||||
return {
|
||||
stationCode: [
|
||||
{ required: true, message: '请选择车站', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.selectStation'), trigger: 'change' }
|
||||
]
|
||||
};
|
||||
},
|
||||
editRules: function () {
|
||||
return {
|
||||
code: [
|
||||
{ required: true, message: '请重新选择设备', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseSelectDevice'), trigger: 'change' }
|
||||
],
|
||||
stationCode: [
|
||||
{ required: true, message: '请选择车站', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.selectStation'), trigger: 'change' }
|
||||
],
|
||||
unlockTime: [
|
||||
{ required: true, message: '请输入延时时间', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterDelayTime'), trigger: 'change' }
|
||||
],
|
||||
textFontColor: [
|
||||
{ required: true, message: '请输入字体颜色', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterFontColor'), trigger: 'change' }
|
||||
],
|
||||
fontFamily: [
|
||||
{ required: true, message: '请输入字体格式', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterFontFormat'), trigger: 'change' }
|
||||
],
|
||||
'position.x': [
|
||||
{ required: true, message: '请输入x坐标', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterXCoordinate'), trigger: 'change' }
|
||||
],
|
||||
'position.y': [
|
||||
{ required: true, message: '请输入y坐标', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterYCoordinate'), trigger: 'change' }
|
||||
]
|
||||
};
|
||||
}
|
||||
@ -241,15 +241,15 @@ export default {
|
||||
const selected = this.$store.getters['map/getDeviceByCode'](this.editModel.code);
|
||||
if (selected && selected._type.toUpperCase() === 'DelayUnlock'.toUpperCase()) {
|
||||
const _that = this;
|
||||
this.$confirm('是否确认删除？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
this.$confirm(this.$t('map.confirmDeletion'), this.$t('map.hint'), {
|
||||
confirmButtonText: this.$t('map.confirm'),
|
||||
cancelButtonText: this.$t('map.cancel'),
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
_that.$emit('delMapModel', selected);
|
||||
_that.deviceSelect();
|
||||
}).catch(() => {
|
||||
_that.$message.info('已取消删除');
|
||||
_that.$message.info(this.$t('map.cancelledDelete'));
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<el-card>
|
||||
<div slot="header" class="clearfix">
|
||||
<span>
|
||||
地图名称：
|
||||
{{ $t('map.mapName') }}
|
||||
<b>{{ mapInfo.name }}</b>
|
||||
</span>
|
||||
<el-button
|
||||
@ -13,20 +13,20 @@
|
||||
style="float: right; padding: 3px 0"
|
||||
:disabled="mapSaveing"
|
||||
@click="saveMapEvent"
|
||||
>保存</el-button>
|
||||
>{{ $t('map.save') }}</el-button>
|
||||
<el-button
|
||||
v-if="isSave"
|
||||
type="text"
|
||||
style="float: right; padding: 3px 0; margin-right: 5px;"
|
||||
:disabled="mapSaveing"
|
||||
@click="verifyMapEvent"
|
||||
>数据校验</el-button>
|
||||
>{{ $t('map.dataVerification') }}</el-button>
|
||||
</div>
|
||||
<el-row type="flex" justify="center">
|
||||
<el-radio-group v-model="viewSelect" @change="handleSelectView">
|
||||
<el-radio-button :label="ViewMode.LOGIC">逻辑视图</el-radio-button>
|
||||
<el-radio-button :label="ViewMode.PHYSICAL">物理视图</el-radio-button>
|
||||
<el-radio-button :label="ViewMode.MIX">混合视图</el-radio-button>
|
||||
<el-radio-button :label="ViewMode.LOGIC">{{ $t('map.logicalView') }}</el-radio-button>
|
||||
<el-radio-button :label="ViewMode.PHYSICAL">{{ $t('map.physicalView') }}</el-radio-button>
|
||||
<el-radio-button :label="ViewMode.MIX">{{ $t('map.mixedView') }}</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-row>
|
||||
<el-row v-if="ViewMode.LOGIC === viewSelect" class="logical-view" type="flex" justify="center">
|
||||
@ -42,7 +42,7 @@
|
||||
</el-checkbox-group>
|
||||
</el-row>
|
||||
<el-tabs v-model="enabledTab" type="card">
|
||||
<el-tab-pane label="Link" name="Link">
|
||||
<el-tab-pane :label="$t('map.Link')" name="Link">
|
||||
<link-draft
|
||||
ref="Link"
|
||||
:card-height="cardHeights"
|
||||
@ -52,7 +52,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="区段" name="Section">
|
||||
<el-tab-pane :label="$t('map.section')" name="Section">
|
||||
<section-draft
|
||||
ref="Section"
|
||||
:card-height="cardHeights"
|
||||
@ -63,7 +63,7 @@
|
||||
@fieldSelect="fieldSelect"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="道岔" name="Switch">
|
||||
<el-tab-pane :label="$t('map.switch')" name="Switch">
|
||||
<switch-draft
|
||||
ref="Switch"
|
||||
:card-height="cardHeights"
|
||||
@ -73,7 +73,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="信号机" name="Signal">
|
||||
<el-tab-pane :label="$t('map.signal')" name="Signal">
|
||||
<signal-draft
|
||||
ref="Signal"
|
||||
:card-height="cardHeights"
|
||||
@ -83,7 +83,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="zc区域控制" name="ZcControl">
|
||||
<el-tab-pane :label="$t('map.zcZoneControl')" name="ZcControl">
|
||||
<zc-control-draft
|
||||
ref="ZcControl"
|
||||
:card-height="cardHeights"
|
||||
@ -93,7 +93,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="全线临时限速" name="LimitControl">
|
||||
<el-tab-pane :label="$t('map.temporaryLimit')" name="LimitControl">
|
||||
<limit-control-draft
|
||||
ref="LimitControl"
|
||||
:card-height="cardHeights"
|
||||
@ -103,7 +103,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="Lc控制" name="LcControl">
|
||||
<el-tab-pane :label="$t('map.lcControl')" name="LcControl">
|
||||
<lc-control-draft
|
||||
ref="LcControl"
|
||||
:card-height="cardHeights"
|
||||
@ -113,7 +113,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="图片" name="ImageControl">
|
||||
<el-tab-pane :label="$t('map.image')" name="ImageControl">
|
||||
<Image-control-draft
|
||||
ref="ImageControl"
|
||||
:card-height="cardHeights"
|
||||
@ -123,7 +123,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="车站" name="Station">
|
||||
<el-tab-pane :label="$t('map.station')" name="Station">
|
||||
<station-draft
|
||||
ref="Station"
|
||||
:card-height="cardHeights"
|
||||
@ -133,7 +133,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="控制模式" name="StationControl">
|
||||
<el-tab-pane :label="$t('map.controlMode')" name="StationControl">
|
||||
<station-control-draft
|
||||
ref="StationControl"
|
||||
:card-height="cardHeights"
|
||||
@ -143,7 +143,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="站台" name="StationStand">
|
||||
<el-tab-pane :label="$t('map.platform')" name="StationStand">
|
||||
<station-stand-draft
|
||||
ref="StationStand"
|
||||
:card-height="cardHeights"
|
||||
@ -153,7 +153,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="计数器" name="Counter">
|
||||
<el-tab-pane :label="$t('map.counter')" name="Counter">
|
||||
<counter-draft
|
||||
ref="Counter"
|
||||
:card-height="cardHeights"
|
||||
@ -163,7 +163,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="延迟解锁" name="DelayUnlock">
|
||||
<el-tab-pane :label="$t(map.delayUnlock)" name="DelayUnlock">
|
||||
<delay-unlock-draft
|
||||
ref="DelayUnlock"
|
||||
:card-height="cardHeights"
|
||||
@ -173,7 +173,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="列车" name="Train">
|
||||
<el-tab-pane :label="$t('map.train')" name="Train">
|
||||
<train-draft
|
||||
ref="Train"
|
||||
:card-height="cardHeights"
|
||||
@ -183,7 +183,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="车次窗" name="TrainWindow">
|
||||
<el-tab-pane :label="$t('map.trainWindow')" name="TrainWindow">
|
||||
<train-window-draft
|
||||
ref="TrainWindow"
|
||||
:card-height="cardHeights"
|
||||
@ -193,7 +193,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="线条" name="Line">
|
||||
<el-tab-pane :label="$t('map.line')" name="Line">
|
||||
<line-draft
|
||||
ref="Line"
|
||||
:card-height="cardHeights"
|
||||
@ -203,7 +203,7 @@
|
||||
@setCenter="setCenter"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="文字" name="Text">
|
||||
<el-tab-pane :label="$t('map.text')" name="Text">
|
||||
<text-draft
|
||||
ref="Text"
|
||||
:card-height="cardHeights"
|
||||
@ -270,7 +270,7 @@ export default {
|
||||
},
|
||||
mapInfo: {
|
||||
type: Object,
|
||||
default: function() { return {name: '请选择地图'}; }
|
||||
default: function() { return {name: this.$t('map.pleaseSelectMap')}; }
|
||||
},
|
||||
cardHeight: {
|
||||
type: [String, Number],
|
||||
@ -283,12 +283,12 @@ export default {
|
||||
feild: '',
|
||||
ViewMode: ViewMode,
|
||||
LogicalViewTypeList: [
|
||||
{ code: 'Link', name: 'link' }
|
||||
{ code: 'Link', name: this.$t('map.link') }
|
||||
],
|
||||
PhysicalViewTypeList: [
|
||||
{ code: 'Section', name: '区段' },
|
||||
{ code: 'Signal', name: '信号机' },
|
||||
{ code: 'Switch', name: '道岔' }
|
||||
{ code: 'Section', name: this.$t('map.section') },
|
||||
{ code: 'Signal', name: this.$t('map.signal') },
|
||||
{ code: 'Switch', name: this.$t('map.switch') }
|
||||
],
|
||||
logicalLevelsSelect: [],
|
||||
physicalLevelsSelect: [],
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-tabs v-model="activeName">
|
||||
<el-tab-pane class="view-control" label="属性" name="first">
|
||||
<el-tab-pane class="view-control" :label="$t('map.property')" name="first">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
|
||||
<el-form ref="form" :model="editModel" label-width="150px" size="mini" :rules="rules">
|
||||
<el-form-item label="编码:" prop="code">
|
||||
<el-form-item :label="$t('map.code')" prop="code">
|
||||
<el-select v-model="editModel.code" filterable @change="deviceChange">
|
||||
<el-option
|
||||
v-for="item in lcList"
|
||||
@ -14,11 +14,11 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态信号名称:" prop="name">
|
||||
<el-form-item :label="$t('map.statusSignalName')" prop="name">
|
||||
<el-input v-model="editModel.name" />
|
||||
</el-form-item>
|
||||
<div class="coordinate">
|
||||
<span class="title">状态信号画图坐标:</span>
|
||||
<span class="title">{{ $t('map.stateSignalsPlotCoordinates') }}</span>
|
||||
<el-form-item
|
||||
label="x:"
|
||||
prop="position.x"
|
||||
@ -39,18 +39,18 @@
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
<el-button-group class="map-draft-group">
|
||||
<el-button type="primary" @click="edit">修改</el-button>
|
||||
<el-button type="primary" @click="deleteObj">删除</el-button>
|
||||
<el-button type="primary" @click="edit">{{ $t('map.updateObj') }}</el-button>
|
||||
<el-button type="primary" @click="deleteObj">{{ $t('map.deleteObj') }}</el-button>
|
||||
</el-button-group>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane class="view-control" label="操作" name="second">
|
||||
<el-tab-pane class="view-control" :label="$t('map.operation')" name="second">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: cardHeight +'px' }">
|
||||
<el-form ref="make" label-width="150px" :rules="createRules" :model="addModel" size="mini">
|
||||
<el-form-item label="状态信号名称:" prop="name">
|
||||
<el-input v-model="addModel.name" />
|
||||
</el-form-item>
|
||||
<div class="coordinate">
|
||||
<span class="title">状态信号画图坐标:</span>
|
||||
<span class="title">{{ $t('map.stateSignalsPlotCoordinates') }}</span>
|
||||
<el-form-item
|
||||
label="x:"
|
||||
prop="position.x"
|
||||
@ -71,7 +71,7 @@
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
<el-button-group class="map-draft-group">
|
||||
<el-button type="primary" @click="create">创建</el-button>
|
||||
<el-button type="primary" @click="create">{{ $t('map.create') }}</el-button>
|
||||
</el-button-group>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
@ -1,14 +1,14 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-loading="loadingUpload"
|
||||
title="新建地图"
|
||||
:title="$t('map.createNewMap')"
|
||||
:visible.sync="dialogShow"
|
||||
width="30%"
|
||||
:before-close="handleClose"
|
||||
>
|
||||
<div>
|
||||
<el-tabs v-model="activeTab" type="card">
|
||||
<el-tab-pane label="正常创建" name="first">
|
||||
<el-tab-pane :label="$t('map.normalCreate')" name="first">
|
||||
<el-form
|
||||
ref="newForm"
|
||||
label-position="right"
|
||||
@ -18,11 +18,11 @@
|
||||
:rules="newRules"
|
||||
@submit.native.prevent
|
||||
>
|
||||
<el-form-item label="地图名称:" prop="name">
|
||||
<el-form-item :label="$t('map.mapName')" prop="name">
|
||||
<el-input v-model="newModel.name" />
|
||||
</el-form-item>
|
||||
<el-form-item label="皮肤风格:" prop="skinStyle">
|
||||
<el-select v-model="newModel.skinStyle" placeholder="请选择">
|
||||
<el-form-item :label="$t('map.skinName')" prop="skinStyle">
|
||||
<el-select v-model="newModel.skinStyle" :placeholder="$t('map.pleaseSelect')">
|
||||
<el-option
|
||||
v-for="item in skinStyleList"
|
||||
:key="item.code"
|
||||
@ -33,7 +33,7 @@
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="从发布地图创建" name="second">
|
||||
<el-tab-pane :label="$t('map.publishMapCreation')" name="second">
|
||||
<el-form
|
||||
ref="pullForm"
|
||||
label-position="right"
|
||||
@ -42,8 +42,8 @@
|
||||
label-width="120px"
|
||||
size="mini"
|
||||
>
|
||||
<el-form-item label="地图名称:" prop="id">
|
||||
<el-select v-model="pullModel.id" placeholder="请选择">
|
||||
<el-form-item :label="$t('map.mapName')" prop="id">
|
||||
<el-select v-model="pullModel.id" :placeholder="$t('map.pleaseSelect')">
|
||||
<el-option
|
||||
v-for="item in publishMapList"
|
||||
:key="item.id"
|
||||
@ -52,26 +52,16 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="地图名称:" prop="name">
|
||||
<el-form-item :label="$t('map.mapName')" prop="name">
|
||||
<el-input v-model="pullModel.name" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-tab-pane>
|
||||
<!-- <el-tab-pane label="导入" name="third">
|
||||
<div class="uploadDemo">
|
||||
<div class="el-upload-dragger">
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text"><em>点击导入</em></div>
|
||||
<input type="file" @change="importf" ref="files" class="file_box" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" />
|
||||
</div>
|
||||
<div class="el-upload__tip" style="text-align: center;">只能上传excel文件</div>
|
||||
</div>
|
||||
</el-tab-pane> -->
|
||||
</el-tabs>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogShow = false">取 消</el-button>
|
||||
<el-button type="primary" :loading="loading" @click="create">确 定</el-button>
|
||||
<el-button @click="dialogShow = false">{{ $t('map.cancel') }}</el-button>
|
||||
<el-button type="primary" :loading="loading" @click="create">{{ $t('map.confirm') }}</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
@ -117,18 +107,18 @@ export default {
|
||||
},
|
||||
newRules: {
|
||||
name: [
|
||||
{ required: true, message: '请输入地图名称', trigger: 'blur' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterMapName'), trigger: 'blur' }
|
||||
],
|
||||
skinStyle: [
|
||||
{ required: true, message: '请选择皮肤风格', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseChooseSkinStyle'), trigger: 'change' }
|
||||
]
|
||||
},
|
||||
pullRules: {
|
||||
id: [
|
||||
{ required: true, message: '请选择地图来源', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseSelectMapSource'), trigger: 'change' }
|
||||
],
|
||||
name: [
|
||||
{ required: true, message: '请输入地图名称', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterMapName'), trigger: 'change' }
|
||||
]
|
||||
}
|
||||
};
|
||||
@ -164,7 +154,7 @@ export default {
|
||||
listPublishMap().then(response => {
|
||||
this.publishMapList = response.data;
|
||||
}).catch(() => {
|
||||
this.$messageBox('加载已发布地图列表失败');
|
||||
this.$messageBox(this.$t('map.failedLoadListPublishedMaps'));
|
||||
});
|
||||
},
|
||||
isNormal() {
|
||||
@ -183,11 +173,11 @@ export default {
|
||||
newMap(this.newModel).then(response => {
|
||||
this.loading = false;
|
||||
this.$emit('refresh');
|
||||
this.$message.success('创建成功！');
|
||||
this.$message.success(this.$t('map.creatingSuccessful'));
|
||||
this.close();
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.$messageBox('创建失败');
|
||||
this.$messageBox(this.$t('map.createFailure'));
|
||||
this.close();
|
||||
});
|
||||
}
|
||||
@ -199,11 +189,11 @@ export default {
|
||||
newUsePublishMap(this.pullModel).then(response => {
|
||||
this.loading = false;
|
||||
this.$emit('refresh');
|
||||
this.$message.success('创建成功！');
|
||||
this.$message.success(this.$t('map.creatingSuccessful'));
|
||||
this.close();
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.$messageBox('创建失败');
|
||||
this.$messageBox(this.$t('map.createFailure'));
|
||||
this.close();
|
||||
});
|
||||
}
|
||||
@ -250,12 +240,12 @@ export default {
|
||||
if (that.resultJSON) {
|
||||
postBuildMapImport(that.resultJSON).then(res => {
|
||||
that.loadingUpload = false;
|
||||
that.$message.success('导入成功！');
|
||||
that.$message.success(this.$t('map.importSuccessful'));
|
||||
that.$emit('refresh');
|
||||
that.close();
|
||||
}).catch(error => {
|
||||
that.loadingUpload = false;
|
||||
that.$message.error('导入失败' + error.message);
|
||||
that.$message.error(this.$t('map.importFailure') + error.message);
|
||||
});
|
||||
}
|
||||
obj.value = ''; // 清空上次导入文件
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<el-dialog title="地图编辑" :visible.sync="dialogShow" width="30%" :before-close="handleClose">
|
||||
<el-dialog :title="$t('map.mapEditor')" :visible.sync="dialogShow" width="30%" :before-close="handleClose">
|
||||
<div>
|
||||
<template v-if="basicInfo">
|
||||
<el-form
|
||||
@ -11,11 +11,11 @@
|
||||
size="mini"
|
||||
@submit.native.prevent
|
||||
>
|
||||
<el-form-item label="地图名称:" prop="name">
|
||||
<el-form-item :label="$t('map.mapName')" prop="name">
|
||||
<el-input v-model="editModel.name" />
|
||||
</el-form-item>
|
||||
<el-form-item label="皮肤风格:" prop="skinStyle">
|
||||
<el-select v-model="editModel.skinStyle" placeholder="请选择" size="mini">
|
||||
<el-form-item :label="$t('map.skinName')" prop="skinStyle">
|
||||
<el-select v-model="editModel.skinStyle" :placeholder="$t('map.pleaseSelect')" size="mini">
|
||||
<el-option
|
||||
v-for="item in skinStyleList"
|
||||
:key="item.code"
|
||||
@ -24,8 +24,8 @@
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属城市:" prop="cityCode">
|
||||
<el-select v-model="editModel.cityCode" placeholder="请选择" size="mini">
|
||||
<el-form-item :label="$t('map.selectCity')" prop="cityCode">
|
||||
<el-select v-model="editModel.cityCode" :placeholder="$t('map.pleaseSelect')" size="mini">
|
||||
<el-option v-for="item in cityList" :key="item.code" :label="item.name" :value="item.code" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
@ -41,21 +41,21 @@
|
||||
size="mini"
|
||||
@submit.native.prevent
|
||||
>
|
||||
<el-form-item label="X偏移:" :prop="'origin.x'">
|
||||
<el-input v-model="updtModel.origin.x" label="X偏移" disabled />
|
||||
<el-form-item :label="$t('map.offsetXColon')" :prop="'origin.x'">
|
||||
<el-input v-model="updtModel.origin.x" :label="$t('map.offsetX')" disabled />
|
||||
</el-form-item>
|
||||
<el-form-item label="Y偏移:" :prop="'origin.y'">
|
||||
<el-input v-model="updtModel.origin.y" label="Y偏移" disabled />
|
||||
<el-form-item :label="$t('map.offsetYColon')" :prop="'origin.y'">
|
||||
<el-input v-model="updtModel.origin.y" :label="$t('map.offsetY')" disabled />
|
||||
</el-form-item>
|
||||
<el-form-item label="缩放比例:" prop="scaling">
|
||||
<el-input v-model="updtModel.scaling" label="缩放比例" disabled />
|
||||
<el-form-item :label="$t('map.scalingColon')" prop="scaling">
|
||||
<el-input v-model="updtModel.scaling" :label="$t('map.scaling')" disabled />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogShow = false">取 消</el-button>
|
||||
<el-button type="primary" :loading="loading" @click="save">确 定</el-button>
|
||||
<el-button @click="dialogShow = false">{{ $t('map.cancel') }}</el-button>
|
||||
<el-button type="primary" :loading="loading" @click="save">{{ $t('map.confirm') }}</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
@ -112,23 +112,23 @@ export default {
|
||||
editRules() {
|
||||
return {
|
||||
name: [
|
||||
{ required: true, message: '请输入地图名称', trigger: 'blur' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterMapName'), trigger: 'blur' }
|
||||
],
|
||||
skinStyle: [
|
||||
{ required: true, message: '请选择关联皮肤', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseSelectAssociatedSkin'), trigger: 'change' }
|
||||
],
|
||||
cityCode: [
|
||||
{ required: true, message: '请选择关联城市', trigger: 'change' }
|
||||
{ required: true, message: this.$t('map.pleaseSelectAssociatedCity'), trigger: 'change' }
|
||||
]
|
||||
};
|
||||
},
|
||||
updtRules() {
|
||||
return {
|
||||
linkWidth: [
|
||||
{ required: true, message: '请输入地图Link宽度', trigger: 'blur' }
|
||||
{ required: true, message: this.$t('map.pleaseEnteMapLinkWidth'), trigger: 'blur' }
|
||||
],
|
||||
zoneWidth: [
|
||||
{ required: true, message: '请输入地图区段宽度', trigger: 'blur' }
|
||||
{ required: true, message: this.$t('map.pleaseEnterMapSectionWidth'), trigger: 'blur' }
|
||||
]
|
||||
};
|
||||
}
|
||||
@ -184,12 +184,12 @@ export default {
|
||||
this.$store.dispatch('map/setMapData', response.data);
|
||||
});
|
||||
}
|
||||
this.$message.success('更新地图成功！');
|
||||
this.$message.success(this.$t('map.mapUpdateSuccessful'));
|
||||
this.$emit('refresh');
|
||||
this.close();
|
||||
}).catch(error => {
|
||||
this.loading = false;
|
||||
this.$message.error('操作异常：' + error.message);
|
||||
this.$message.error(this.$t('map.operationUnusual') + error.message);
|
||||
});
|
||||
} else {
|
||||
this.loading = false;
|
||||
@ -202,10 +202,10 @@ export default {
|
||||
updateSkinStyleByCode(this.updtModel).then(response => {
|
||||
this.loading = false;
|
||||
this.close();
|
||||
this.$message.success('更新成功');
|
||||
this.$message.success(this.$t('map.updateSuccessfully'));
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.$messageBox('更新失败');
|
||||
this.$messageBox(this.$t('map.updateFailed'));
|
||||
});
|
||||
} else {
|
||||
this.loading = false;
|
||||
@ -218,7 +218,7 @@ export default {
|
||||
this.$Dictionary.cityType().then(list => {
|
||||
this.cityList = list;
|
||||
}).catch(() => {
|
||||
this.$messageBox('加载城市列表失败');
|
||||
this.$messageBox(this.$t('map.failedLoadCityList'));
|
||||
});
|
||||
|
||||
this.skinStyleList = [];
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<el-card v-loading="loading" class="map-list-main">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>草稿地图列表</span>
|
||||
<el-button type="text" style="float: right; padding: 3px 0" @click="createMap">新建</el-button>
|
||||
<span>{{ $t('map.sketchMap') }}</span>
|
||||
<el-button type="text" style="float: right; padding: 3px 0" @click="createMap">{{ $t('map.newConstruction') }}</el-button>
|
||||
<el-button type="text" class="uploadDemo">
|
||||
<input
|
||||
ref="files"
|
||||
@ -11,7 +11,7 @@
|
||||
accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
|
||||
@change="importf"
|
||||
>
|
||||
导入地图
|
||||
{{ $t('map.importMap') }}
|
||||
</el-button>
|
||||
</div>
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: height + 'px'}">
|
||||
|
||||
@ -44,47 +44,47 @@ export default {
|
||||
menuShow: false,
|
||||
menu: [
|
||||
{
|
||||
label: '修改',
|
||||
label: this.$t('map.updateObj'),
|
||||
handler: this.updateObj
|
||||
},
|
||||
{
|
||||
label: '更新坐标',
|
||||
label: this.$t('map.updateObjAxis'),
|
||||
handler: this.updateObjAxis
|
||||
},
|
||||
{
|
||||
label: '另存为',
|
||||
label: this.$t('map.saveAs'),
|
||||
handler: this.saveAs
|
||||
},
|
||||
{
|
||||
label: '发布',
|
||||
label: this.$t('map.publish'),
|
||||
handler: this.publish
|
||||
},
|
||||
{
|
||||
label: '删除',
|
||||
label: this.$t('map.deleteObj'),
|
||||
handler: this.deleteObj
|
||||
},
|
||||
{
|
||||
label: '编辑进路',
|
||||
label: this.$t('map.editRoute'),
|
||||
handler: this.editRoute
|
||||
},
|
||||
{
|
||||
label: '编辑交路',
|
||||
label: this.$t('map.editRouting'),
|
||||
handler: this.editRouting
|
||||
},
|
||||
{
|
||||
label: '编辑自动信号',
|
||||
label: this.$t('map.editAutoRouting'),
|
||||
handler: this.editAutoRouting
|
||||
},
|
||||
{
|
||||
label: '联动道岔',
|
||||
label: this.$t('map.setSwitch'),
|
||||
handler: this.setSwitch
|
||||
},
|
||||
{
|
||||
label: '路径单元',
|
||||
label: this.$t('map.pathUnit'),
|
||||
handler: this.pathUnit
|
||||
},
|
||||
{
|
||||
label: '三维化编辑',
|
||||
label: this.$t('map.jlmap3d'),
|
||||
handler: this.jlmap3d
|
||||
}
|
||||
]
|
||||
@ -149,20 +149,20 @@ export default {
|
||||
deleteObj() {
|
||||
this.doClose();
|
||||
const _that = this;
|
||||
this.$confirm('是否确认删除？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
this.$confirm(this.$t('map.confirmDeletion'), this.$t('map.hint'), {
|
||||
confirmButtonText: this.$t('map.confirm'),
|
||||
cancelButtonText: this.$t('map.cancel'),
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
deleteMap(this.editModel.id).then(response => {
|
||||
this.$store.dispatch('map/mapClear').then(() => {
|
||||
_that.refresh();
|
||||
_that.$emit('editMap', null);
|
||||
_that.$message.success('删除成功');
|
||||
_that.$message.success(this.$t('map.successfullyDelete'));
|
||||
_that.$router.push({ path: `${UrlConfig.map.draft}/0/draft` });
|
||||
});
|
||||
}).catch(error => {
|
||||
_that.$message.error('删除失败：' + error.message);
|
||||
_that.$message.error(this.$t('map.failDelete') + error.message);
|
||||
});
|
||||
}).catch(() => {
|
||||
});
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<el-dialog title="地图发布为" :visible.sync="dialogShow" width="30%" :before-close="handleClose">
|
||||
<el-dialog :title="$t('map.mapPublished')" :visible.sync="dialogShow" width="30%" :before-close="handleClose">
|
||||
<div>
|
||||
<el-form
|
||||
ref="form"
|
||||
@ -9,19 +9,19 @@
|
||||
size="mini"
|
||||
@submit.native.prevent
|
||||
>
|
||||
<el-form-item label="发布关联城市:" prop="cityCode">
|
||||
<el-select v-model="editModel.cityCode" placeholder="请选择">
|
||||
<el-form-item :label="$t('map.publishingAssociatedCity')" prop="cityCode">
|
||||
<el-select v-model="editModel.cityCode" :placeholder="$t('map.pleaseSelect')">
|
||||
<el-option v-for="item in cityList" :key="item.code" :label="item.name" :value="item.code" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="发布地图名称:" prop="name">
|
||||
<el-form-item :label="$t('map.publishMapName')" prop="name">
|
||||
<el-input v-model="editModel.name" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogShow = false">取 消</el-button>
|
||||
<el-button type="primary" :loading="loading" @click="publish">确 定</el-button>
|
||||
<el-button @click="dialogShow = false">{{ $t('map.cancel') }}</el-button>
|
||||
<el-button type="primary" :loading="loading" @click="publish">{{ $t('map.confirm') }}</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
@ -77,14 +77,14 @@ export default {
|
||||
this.loading = false;
|
||||
if (response.data && response.data.length) {
|
||||
this.tableToExcel(response.data);
|
||||
this.$messageBox('发布失败，数据校验不通过');
|
||||
this.$messageBox(this.$t('map.dataValidationFailed'));
|
||||
} else {
|
||||
this.$message.success('发布成功!');
|
||||
this.$message.success(this.$t('map.releaseSuccess'));
|
||||
}
|
||||
this.close();
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.$messageBox('操作异常');
|
||||
this.$messageBox(this.$t('map.abnormalOperation'));
|
||||
});
|
||||
},
|
||||
tableToExcel(data) {
|
||||
@ -95,7 +95,7 @@ export default {
|
||||
});
|
||||
const dataList = this.formatJson(filterVal, arr);
|
||||
import('@/utils/Export2Excel').then(excel => {
|
||||
excel.export_json_to_excel(['有问题数据'], dataList, '数据列表');
|
||||
excel.export_json_to_excel([this.$t('map.datQuestion')], dataList, this.$t('map.dataList'));
|
||||
});
|
||||
},
|
||||
formatJson(filterVal, jsonData) {
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<el-dialog title="地图另存为" :visible.sync="dialogShow" width="30%" :before-close="handleClose">
|
||||
<el-dialog :title="$t('map.saveMapAs')" :visible.sync="dialogShow" width="30%" :before-close="handleClose">
|
||||
<div>
|
||||
<el-form
|
||||
ref="form"
|
||||
@ -9,21 +9,20 @@
|
||||
size="mini"
|
||||
@submit.native.prevent
|
||||
>
|
||||
<el-form-item label="地图名称:" prop="name">
|
||||
<el-form-item :label="$t('map.mapName')" prop="name">
|
||||
<el-input v-model="editModel.name" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogShow = false">取 消</el-button>
|
||||
<el-button type="primary" :loading="loading" @click="saveAs">确 定</el-button>
|
||||
<el-button @click="dialogShow = false">{{ $t('map.cancel') }}</el-button>
|
||||
<el-button type="primary" :loading="loading" @click="saveAs">{{ $t('map.confirm') }}</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { saveAsMap } from '@/api/jmap/mapdraft';
|
||||
// import localStore from 'storejs';
|
||||
|
||||
export default {
|
||||
name: 'MapSaveAs',
|
||||
@ -69,7 +68,7 @@ export default {
|
||||
this.close();
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
this.$messageBox('另存失败');
|
||||
this.$messageBox(this.$t('map.saveFailed'));
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,133 +1,131 @@
|
||||
<template>
|
||||
<div id="PlanMenuTool">
|
||||
<div class="nav">
|
||||
<div class="tool" v-for="(item,index) in tools" :key="index">
|
||||
<img :src="item.src" :alt="item.title" />
|
||||
</div>
|
||||
</div>
|
||||
<div id="PlanMenuTool">
|
||||
<div class="nav">
|
||||
<div v-for="(item,index) in tools" :key="index" class="tool">
|
||||
<img :src="item.src" :alt="item.title">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import { prefixIntrger } from '@/utils/date';
|
||||
import logo_ from '@/assets/logo_.png';
|
||||
import { prefixIntrger } from '@/utils/date';
|
||||
import logo_ from '@/assets/logo_.png';
|
||||
|
||||
|
||||
export default {
|
||||
name: 'PlanMenuTool',
|
||||
data() {
|
||||
return {
|
||||
tools: [
|
||||
{
|
||||
title: '服务器1',
|
||||
operate: '',
|
||||
src: logo_,
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '服务器2',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '前置机1',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '前置机2',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '主调',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '调度台1',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '调度台2',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '调度台3',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '大屏',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '维护工作站',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '运行图显示人工站',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '跳停',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '扣车',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped,
|
||||
},
|
||||
{
|
||||
title: '列车报警',
|
||||
operate: '',
|
||||
src: logo_,
|
||||
click: this.undeveloped,
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.training.initTime': function (initTime) {
|
||||
let date = new Date(initTime);
|
||||
this.time = `${prefixIntrger(date.getHours(), 2)}:${prefixIntrger(date.getMinutes(), 2)}${prefixIntrger(date.getSeconds(), 2)}`
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isShowSystemTime() {
|
||||
return this.$route.params.mode == 'demon' || this.$route.params.mode === 'dp' || !this.$route.params.mode;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.initTools();
|
||||
},
|
||||
methods: {
|
||||
initTools() {
|
||||
this.tools = [];
|
||||
}
|
||||
}
|
||||
}
|
||||
export default {
|
||||
name: 'PlanMenuTool',
|
||||
data() {
|
||||
return {
|
||||
tools: [
|
||||
{
|
||||
title: '服务器1',
|
||||
operate: '',
|
||||
src: logo_,
|
||||
click: this.undeveloped
|
||||
},
|
||||
{
|
||||
title: '服务器2',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped
|
||||
},
|
||||
{
|
||||
title: '前置机1',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped
|
||||
},
|
||||
{
|
||||
title: '前置机2',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped
|
||||
},
|
||||
{
|
||||
title: '主调',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped
|
||||
},
|
||||
{
|
||||
title: '调度台1',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped
|
||||
},
|
||||
{
|
||||
title: '调度台2',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped
|
||||
},
|
||||
{
|
||||
title: '调度台3',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped
|
||||
},
|
||||
{
|
||||
title: '大屏',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped
|
||||
},
|
||||
{
|
||||
title: '维护工作站',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped
|
||||
},
|
||||
{
|
||||
title: '运行图显示人工站',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped
|
||||
},
|
||||
{
|
||||
title: '跳停',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped
|
||||
},
|
||||
{
|
||||
title: '扣车',
|
||||
operate: '',
|
||||
src: '',
|
||||
click: this.undeveloped
|
||||
},
|
||||
{
|
||||
title: '列车报警',
|
||||
operate: '',
|
||||
src: logo_,
|
||||
click: this.undeveloped
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
isShowSystemTime() {
|
||||
return this.$route.params.mode == 'demon' || this.$route.params.mode === 'dp' || !this.$route.params.mode;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.training.initTime': function (initTime) {
|
||||
const date = new Date(initTime);
|
||||
this.time = `${prefixIntrger(date.getHours(), 2)}:${prefixIntrger(date.getMinutes(), 2)}${prefixIntrger(date.getSeconds(), 2)}`;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.initTools();
|
||||
},
|
||||
methods: {
|
||||
initTools() {
|
||||
this.tools = [];
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
@import "src/styles/mixin.scss";
|
||||
$top: 48px;
|
||||
$width: 25px;
|
||||
@ -169,4 +167,4 @@
|
||||
width: $width - 5;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -1,70 +1,75 @@
|
||||
<template>
|
||||
<div v-if="show">
|
||||
<template v-if="maxmini">
|
||||
<div class="nav">
|
||||
<div class="cls-status" @click="touch('Close')" v-show="config.showClose"><span></span></div>
|
||||
<div class="min-status" @click="touch('Minim')"><span></span></div>
|
||||
</div>
|
||||
<el-table ref="table" :data="config.data" :highlight-current-row="config.highlightCurrentRow"
|
||||
@current-change="handleChange" :height="height" border>
|
||||
<template v-for="item in config.columns">
|
||||
<el-table-column :prop="item.prop" :label="item.label" :width="item.width">
|
||||
</el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
<div v-if="show">
|
||||
<template v-if="maxmini">
|
||||
<div class="nav">
|
||||
<div v-show="config.showClose" class="cls-status" @click="touch('Close')"><span /></div>
|
||||
<div class="min-status" @click="touch('Minim')"><span /></div>
|
||||
</div>
|
||||
<el-table
|
||||
ref="table"
|
||||
:data="config.data"
|
||||
:highlight-current-row="config.highlightCurrentRow"
|
||||
:height="height"
|
||||
border
|
||||
@current-change="handleChange"
|
||||
>
|
||||
<template v-for="(item,index) in config.columns">
|
||||
<el-table-column :key="index" :prop="item.prop" :label="item.label" :width="item.width" />
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="nav">
|
||||
<div class=" max-status" @click="touch('Maxim')"><span></span></div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</el-table>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="nav">
|
||||
<div class=" max-status" @click="touch('Maxim')"><span /></div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'DataTable',
|
||||
props: {
|
||||
height: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
config: {
|
||||
type: Object,
|
||||
required: true,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: true,
|
||||
maxmini: true,
|
||||
touchStrategy: {
|
||||
'Close': [false, true],
|
||||
'Minim': [true, false],
|
||||
'Maxim': [true, true]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleChange(row) {
|
||||
if (this.config.handleChange) {
|
||||
this.config.handleChange(row);
|
||||
}
|
||||
},
|
||||
setCurrentRow(row) {
|
||||
this.$refs.table.setCurrentRow(row);
|
||||
},
|
||||
touch(operate) {
|
||||
this.$nextTick(() => {
|
||||
[this.show, this.maxmini] = this.touchStrategy[operate];
|
||||
this.$emit('touch', this.maxmini);
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
export default {
|
||||
name: 'DataTable',
|
||||
props: {
|
||||
height: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
config: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: true,
|
||||
maxmini: true,
|
||||
touchStrategy: {
|
||||
'Close': [false, true],
|
||||
'Minim': [true, false],
|
||||
'Maxim': [true, true]
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handleChange(row) {
|
||||
if (this.config.handleChange) {
|
||||
this.config.handleChange(row);
|
||||
}
|
||||
},
|
||||
setCurrentRow(row) {
|
||||
this.$refs.table.setCurrentRow(row);
|
||||
},
|
||||
touch(operate) {
|
||||
this.$nextTick(() => {
|
||||
[this.show, this.maxmini] = this.touchStrategy[operate];
|
||||
this.$emit('touch', this.maxmini);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
@import "src/styles/mixin.scss";
|
||||
$height: 20px;
|
||||
$width: 20px;
|
||||
@ -85,7 +90,6 @@
|
||||
line-height: $height;
|
||||
}
|
||||
|
||||
|
||||
/deep/ {
|
||||
.el-table--border th.gutter {
|
||||
background: #EBEADB !important;
|
||||
@ -119,7 +123,6 @@
|
||||
font-size: smaller !important;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.current-row>td {
|
||||
@ -143,7 +146,7 @@
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
vertical-align: middle;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
span::after {
|
||||
@ -152,7 +155,7 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(-90deg);
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
|
||||
@ -170,7 +173,7 @@
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
vertical-align: middle;
|
||||
-webkit-transform: rotate(-90deg);
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
|
||||
@ -187,7 +190,7 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
span::after {
|
||||
@ -196,8 +199,8 @@
|
||||
background: black;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
-webkit-transform: rotate(90deg);
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -1,502 +1,513 @@
|
||||
<template>
|
||||
<div id="PlanSchedule" :style="{top: top+'px', height: height+'px'}">
|
||||
<div class="left">
|
||||
<div :id="runPlanId"></div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<data-table ref="serviceTable" :height="height/2" :config="serviceNumberConfig" @touch="scheduleTouch"
|
||||
:style="{top: top-height/2+'px'}"></data-table>
|
||||
<data-table ref="tripTable" :height="height/2" :config="tripNumberConfig" @touch="trainNumTouch"
|
||||
:style="{top: top-height/2+'px'}"></data-table>
|
||||
</div>
|
||||
<div id="PlanSchedule" :style="{top: top+'px', height: height+'px'}">
|
||||
<div class="left">
|
||||
<div :id="runPlanId" />
|
||||
</div>
|
||||
<div class="right">
|
||||
<data-table
|
||||
ref="serviceTable"
|
||||
:height="height/2"
|
||||
:config="serviceNumberConfig"
|
||||
:style="{top: top-height/2+'px'}"
|
||||
@touch="scheduleTouch"
|
||||
/>
|
||||
<data-table
|
||||
ref="tripTable"
|
||||
:height="height/2"
|
||||
:config="tripNumberConfig"
|
||||
:style="{top: top-height/2+'px'}"
|
||||
@touch="trainNumTouch"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import { timeFormat } from '@/utils/date';
|
||||
import { getStationListBySkinStyle, queryRunPlan } from '@/api/runplan';
|
||||
import { loadMapData } from '@/utils/loaddata';
|
||||
import DataTable from './menus/components/dataTable';
|
||||
import { mapGetters } from 'vuex';
|
||||
import { timeFormat } from '@/utils/date';
|
||||
import { getStationListBySkinStyle, queryRunPlan } from '@/api/runplan';
|
||||
import { loadMapData } from '@/utils/loaddata';
|
||||
import DataTable from './menus/components/dataTable';
|
||||
|
||||
export default {
|
||||
name: 'PlanSchedule',
|
||||
props: {
|
||||
skinStyle: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
PlanConvert: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
maxWidth: {
|
||||
type: Number,
|
||||
require: true
|
||||
},
|
||||
maxHeight: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
components: {
|
||||
DataTable
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
top: 0,
|
||||
height: 0,
|
||||
heights: [100, 100],
|
||||
runPlanId: 'plan-tool',
|
||||
myChart: null,
|
||||
serviceNumberConfig: {
|
||||
data: [],
|
||||
highlightCurrentRow: true,
|
||||
handleChange: this.serviceNumberChange,
|
||||
showClose: false,
|
||||
columns: [
|
||||
{
|
||||
prop: 'serviceNumber',
|
||||
label: '表号',
|
||||
},
|
||||
{
|
||||
width: 40
|
||||
}
|
||||
]
|
||||
},
|
||||
tripNumberConfig: {
|
||||
data: [],
|
||||
highlightCurrentRow: true,
|
||||
handleChange: this.tripNumberChange,
|
||||
showClose: false,
|
||||
columns: [
|
||||
{
|
||||
prop: 'tripNumber',
|
||||
label: '车次号',
|
||||
},
|
||||
{
|
||||
width: 40
|
||||
}
|
||||
]
|
||||
},
|
||||
realData: {},
|
||||
kmRangeCoordMap: {},
|
||||
option: {
|
||||
title: {
|
||||
text: '',
|
||||
left: 'center'
|
||||
},
|
||||
grid: {
|
||||
top: '30px',
|
||||
left: '120px',
|
||||
right: '40px',
|
||||
bottom: '60px',
|
||||
containLabel: true,
|
||||
backgroundColor: 'floralwhite'
|
||||
},
|
||||
toolbox: {
|
||||
right: '30px',
|
||||
feature: {
|
||||
dataZoom: {
|
||||
yAxisIndex: 'none'
|
||||
},
|
||||
restore: {},
|
||||
saveAsImage: {}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
axisPointer: {
|
||||
trigger: 'item',
|
||||
type: 'cross'
|
||||
},
|
||||
formatter: this.axisTooltip,
|
||||
borderWidth: 1,
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: [],
|
||||
axisLine: {
|
||||
onZero: false,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
color: '#d14a61'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: this.xAxisLableFormat,
|
||||
textStyle: {
|
||||
color: '#333'
|
||||
}
|
||||
},
|
||||
axisPointer: {
|
||||
snap: true,
|
||||
label: {
|
||||
formatter: this.xAxisPointFormat,
|
||||
backgroundColor: 'rgb(255,0,0,0.5)',
|
||||
color: 'white',
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLine: {
|
||||
onZero: false,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
color: '#d14a61'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
interval: 'auto',
|
||||
formatter: this.yAxisLableFormat,
|
||||
},
|
||||
axisPointer: {
|
||||
xAxisIndex: 'all',
|
||||
label: {
|
||||
formatter: this.yAxisPointFormat,
|
||||
backgroundColor: 'rgb(0,100,0,0.5)',
|
||||
color: 'white',
|
||||
}
|
||||
},
|
||||
min: 0,
|
||||
max: 0,
|
||||
},
|
||||
series: [],
|
||||
dataZoom: [
|
||||
{
|
||||
type: 'inside',
|
||||
},
|
||||
{
|
||||
fiterMode: 'filter',
|
||||
handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
|
||||
handleSize: '80%',
|
||||
handleStyle: {
|
||||
color: '#fff',
|
||||
shadowBlur: 3,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.6)',
|
||||
shadowOffsetX: 2,
|
||||
shadowOffsetY: 2
|
||||
},
|
||||
bottom: '15px'
|
||||
}
|
||||
]
|
||||
},
|
||||
absoluteTime: 2 * 3600,
|
||||
indexKmRangeMap: {},
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('runPlan', [
|
||||
'stations'
|
||||
]),
|
||||
planId() {
|
||||
return this.$route.query.planId;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
maxWidth() {
|
||||
this.setPosition();
|
||||
},
|
||||
maxHeight() {
|
||||
this.setPosition();
|
||||
},
|
||||
'$store.state.runPlan.planSizeCount': function () {
|
||||
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
|
||||
},
|
||||
'$store.state.runPlan.select.serviceNumber': function (val) {
|
||||
let index = this.serviceNumberConfig.data.findIndex(elem => {
|
||||
return elem.serviceNumber == val;
|
||||
})
|
||||
export default {
|
||||
name: 'PlanSchedule',
|
||||
components: {
|
||||
DataTable
|
||||
},
|
||||
props: {
|
||||
skinStyle: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
planConvert: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
maxWidth: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
maxHeight: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
top: 0,
|
||||
height: 0,
|
||||
heights: [100, 100],
|
||||
runPlanId: 'plan-tool',
|
||||
myChart: null,
|
||||
serviceNumberConfig: {
|
||||
data: [],
|
||||
highlightCurrentRow: true,
|
||||
handleChange: this.serviceNumberChange,
|
||||
showClose: false,
|
||||
columns: [
|
||||
{
|
||||
prop: 'serviceNumber',
|
||||
label: '表号'
|
||||
},
|
||||
{
|
||||
width: 40
|
||||
}
|
||||
]
|
||||
},
|
||||
tripNumberConfig: {
|
||||
data: [],
|
||||
highlightCurrentRow: true,
|
||||
handleChange: this.tripNumberChange,
|
||||
showClose: false,
|
||||
columns: [
|
||||
{
|
||||
prop: 'tripNumber',
|
||||
label: '车次号'
|
||||
},
|
||||
{
|
||||
width: 40
|
||||
}
|
||||
]
|
||||
},
|
||||
realData: {},
|
||||
kmRangeCoordMap: {},
|
||||
option: {
|
||||
title: {
|
||||
text: '',
|
||||
left: 'center'
|
||||
},
|
||||
grid: {
|
||||
top: '30px',
|
||||
left: '120px',
|
||||
right: '40px',
|
||||
bottom: '60px',
|
||||
containLabel: true,
|
||||
backgroundColor: 'floralwhite'
|
||||
},
|
||||
toolbox: {
|
||||
right: '30px',
|
||||
feature: {
|
||||
dataZoom: {
|
||||
yAxisIndex: 'none'
|
||||
},
|
||||
restore: {},
|
||||
saveAsImage: {}
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
axisPointer: {
|
||||
trigger: 'item',
|
||||
type: 'cross'
|
||||
},
|
||||
formatter: this.axisTooltip,
|
||||
borderWidth: 1
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: [],
|
||||
axisLine: {
|
||||
onZero: false,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
color: '#d14a61'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: this.xAxisLableFormat,
|
||||
textStyle: {
|
||||
color: '#333'
|
||||
}
|
||||
},
|
||||
axisPointer: {
|
||||
snap: true,
|
||||
label: {
|
||||
formatter: this.xAxisPointFormat,
|
||||
backgroundColor: 'rgb(255,0,0,0.5)',
|
||||
color: 'white'
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
axisLine: {
|
||||
onZero: false,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
color: '#d14a61'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
interval: 'auto',
|
||||
formatter: this.yAxisLableFormat
|
||||
},
|
||||
axisPointer: {
|
||||
xAxisIndex: 'all',
|
||||
label: {
|
||||
formatter: this.yAxisPointFormat,
|
||||
backgroundColor: 'rgb(0,100,0,0.5)',
|
||||
color: 'white'
|
||||
}
|
||||
},
|
||||
min: 0,
|
||||
max: 0
|
||||
},
|
||||
series: [],
|
||||
dataZoom: [
|
||||
{
|
||||
type: 'inside'
|
||||
},
|
||||
{
|
||||
fiterMode: 'filter',
|
||||
handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
|
||||
handleSize: '80%',
|
||||
handleStyle: {
|
||||
color: '#fff',
|
||||
shadowBlur: 3,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.6)',
|
||||
shadowOffsetX: 2,
|
||||
shadowOffsetY: 2
|
||||
},
|
||||
bottom: '15px'
|
||||
}
|
||||
]
|
||||
},
|
||||
absoluteTime: 2 * 3600,
|
||||
indexKmRangeMap: {}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('runPlan', [
|
||||
'stations'
|
||||
]),
|
||||
planId() {
|
||||
return this.$route.query.planId;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
maxWidth() {
|
||||
this.setPosition();
|
||||
},
|
||||
maxHeight() {
|
||||
this.setPosition();
|
||||
},
|
||||
'$store.state.runPlan.planSizeCount': function () {
|
||||
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
|
||||
},
|
||||
'$store.state.runPlan.selected.serviceNumber': function (val) {
|
||||
const index = this.serviceNumberConfig.data.findIndex(elem => {
|
||||
return elem.serviceNumber == val;
|
||||
});
|
||||
|
||||
this.$refs.serviceTable.setCurrentRow(this.serviceNumberConfig.data[index]);
|
||||
},
|
||||
'$store.state.runPlan.select.tripNumber': function (val) {
|
||||
let index = this.tripNumberConfig.data.findIndex(elem => {
|
||||
return elem.tripNumber == val;
|
||||
})
|
||||
this.$refs.tripTable.setCurrentRow(this.tripNumberConfig.data[index]);
|
||||
},
|
||||
$route() {
|
||||
this.loadChartPage();
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.loadChartPage();
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.destroy();
|
||||
},
|
||||
methods: {
|
||||
serviceNumberChange(row) {
|
||||
let serviceNumber = null;
|
||||
let serviceObj = {};
|
||||
if (row) {
|
||||
serviceNumber = row.serviceNumber;
|
||||
serviceObj = this.$store.state.runPlan.editData[row.serviceNumber] || {}
|
||||
}
|
||||
this.$refs.serviceTable.setCurrentRow(this.serviceNumberConfig.data[index]);
|
||||
},
|
||||
'$store.state.runPlan.selected.tripNumber': function (val) {
|
||||
const index = this.tripNumberConfig.data.findIndex(elem => {
|
||||
return elem.tripNumber == val;
|
||||
});
|
||||
this.$refs.tripTable.setCurrentRow(this.tripNumberConfig.data[index]);
|
||||
},
|
||||
$route() {
|
||||
this.loadChartPage();
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.loadChartPage();
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.destroy();
|
||||
},
|
||||
methods: {
|
||||
serviceNumberChange(row) {
|
||||
let serviceNumber = null;
|
||||
let serviceObj = {};
|
||||
if (row) {
|
||||
serviceNumber = row.serviceNumber;
|
||||
serviceObj = this.$store.state.runPlan.editData[row.serviceNumber] || {};
|
||||
}
|
||||
|
||||
this.$store.dispatch('runPlan/setSelected', { serviceNumber: serviceNumber, tripNumber: null });
|
||||
this.analyticalTripNumber(serviceObj.trainMap || {});
|
||||
},
|
||||
tripNumberChange(row) {
|
||||
let serviceNumber = this.$store.state.runPlan.selected.serviceNumber;
|
||||
let tripNumber = null;
|
||||
if (row) {
|
||||
tripNumber = row.tripNumber;
|
||||
}
|
||||
this.$store.dispatch('runPlan/setSelected', { serviceNumber: serviceNumber, tripNumber: null });
|
||||
this.analyticalTripNumber(serviceObj.trainMap || {});
|
||||
},
|
||||
tripNumberChange(row) {
|
||||
const serviceNumber = this.$store.state.runPlan.selected.serviceNumber;
|
||||
let tripNumber = null;
|
||||
if (row) {
|
||||
tripNumber = row.tripNumber;
|
||||
}
|
||||
|
||||
this.$store.dispatch('runPlan/setSelected', { serviceNumber: serviceNumber, tripNumber: tripNumber });
|
||||
},
|
||||
async analyticalServiceNumber(data) {
|
||||
this.serviceNumberConfig.data = Object.keys(data || {})
|
||||
.sort((a, b) => { return data[a].oldIndex - data[b].oldIndex })
|
||||
.map(serviceNumber => { return { serviceNumber } });
|
||||
},
|
||||
async analyticalTripNumber(data) {
|
||||
this.tripNumberConfig.data = Object.keys(data || {})
|
||||
.sort((a, b) => { return data[a].oldIndex - data[b].oldIndex })
|
||||
.map(tripNumber => { return { tripNumber } });
|
||||
},
|
||||
async setPosition() {
|
||||
this.$nextTick(() => {
|
||||
let top = 3;
|
||||
let width = this.maxWidth * 0.85;
|
||||
let height = this.maxHeight;
|
||||
this.$store.dispatch('runPlan/setSelected', { serviceNumber: serviceNumber, tripNumber: tripNumber });
|
||||
},
|
||||
async analyticalServiceNumber(data) {
|
||||
this.serviceNumberConfig.data = Object.keys(data || {})
|
||||
.sort((a, b) => { return data[a].oldIndex - data[b].oldIndex; })
|
||||
.map(serviceNumber => { return { serviceNumber }; });
|
||||
},
|
||||
async analyticalTripNumber(data) {
|
||||
this.tripNumberConfig.data = Object.keys(data || {})
|
||||
.sort((a, b) => { return data[a].oldIndex - data[b].oldIndex; })
|
||||
.map(tripNumber => { return { tripNumber }; });
|
||||
},
|
||||
async setPosition() {
|
||||
this.$nextTick(() => {
|
||||
let top = 3;
|
||||
const width = this.maxWidth * 0.85;
|
||||
let height = this.maxHeight;
|
||||
|
||||
let titleBar = document.getElementById('PlanTitleBar');
|
||||
let menuBar = document.getElementById('PlanMenuBar');
|
||||
let menuTool = document.getElementById('PlanMenuTool');
|
||||
let statusBar = document.getElementById('PlanStatusBar');
|
||||
const titleBar = document.getElementById('PlanTitleBar');
|
||||
const menuBar = document.getElementById('PlanMenuBar');
|
||||
const menuTool = document.getElementById('PlanMenuTool');
|
||||
const statusBar = document.getElementById('PlanStatusBar');
|
||||
|
||||
if (titleBar) {
|
||||
top += (titleBar.offsetHeight || 0);
|
||||
}
|
||||
if (titleBar) {
|
||||
top += (titleBar.offsetHeight || 0);
|
||||
}
|
||||
|
||||
if (menuBar) {
|
||||
top += (menuBar.offsetHeight || 0);
|
||||
}
|
||||
if (menuBar) {
|
||||
top += (menuBar.offsetHeight || 0);
|
||||
}
|
||||
|
||||
if (menuTool) {
|
||||
top += (menuTool.offsetHeight || 0);
|
||||
}
|
||||
if (menuTool) {
|
||||
top += (menuTool.offsetHeight || 0);
|
||||
}
|
||||
|
||||
if (statusBar) {
|
||||
height -= (statusBar.offsetHeight || 0);
|
||||
}
|
||||
if (statusBar) {
|
||||
height -= (statusBar.offsetHeight || 0);
|
||||
}
|
||||
|
||||
height = height - top;
|
||||
this.$store.dispatch('runPlan/resize', { width, height });
|
||||
height = height - top;
|
||||
this.$store.dispatch('runPlan/resize', { width, height });
|
||||
|
||||
if (this.top != top) {
|
||||
this.top = top;
|
||||
}
|
||||
if (this.top != top) {
|
||||
this.top = top;
|
||||
}
|
||||
|
||||
if (this.height != height) {
|
||||
this.height = height - 20 * 2;
|
||||
}
|
||||
})
|
||||
},
|
||||
async loadChartPage() {
|
||||
try {
|
||||
this.$store.dispatch('runPlan/clear').then(resp => {
|
||||
this.loadInitChart().then(() => {
|
||||
if (this.skinStyle && this.planId) {
|
||||
this.myChart && this.myChart.showLoading();
|
||||
loadMapData(this.skinStyle);
|
||||
getStationListBySkinStyle(this.skinStyle).then(resp => {
|
||||
this.$store.dispatch('runPlan/setStations', resp.data).then(() => {
|
||||
queryRunPlan(this.planId).then(rest => {
|
||||
this.$store.dispatch('runPlan/setPlanData', rest.data).then(() => {
|
||||
this.analyticalServiceNumber(this.$store.state.runPlan.editData);
|
||||
this.loadChartData();
|
||||
this.myChart && this.myChart.hideLoading();
|
||||
})
|
||||
}).catch(error => {
|
||||
this.myChart && this.myChart.hideLoading();
|
||||
this.$messageBox('获取运行图数据失败');
|
||||
})
|
||||
})
|
||||
}).catch(error => {
|
||||
this.$messageBox('请求车站数据失败');
|
||||
this.$store.dispatch('runPlan/setStations', []);
|
||||
this.myChart && this.myChart.hideLoading();
|
||||
})
|
||||
}
|
||||
});
|
||||
});
|
||||
} catch (error) {
|
||||
this.$messageBox(`加载运行图数据失败`);
|
||||
}
|
||||
},
|
||||
async loadChartData() {
|
||||
try {
|
||||
let stations = this.$store.state.runPlan.stations;
|
||||
let planData = this.$store.state.runPlan.planData;
|
||||
if (this.height != height) {
|
||||
this.height = height - 20 * 2;
|
||||
}
|
||||
});
|
||||
},
|
||||
async loadChartPage() {
|
||||
try {
|
||||
this.PlanConvert = this.$theme.loadPlanConvert(this.skinStyle);
|
||||
this.$store.dispatch('runPlan/clear').then(resp => {
|
||||
this.loadInitChart().then(() => {
|
||||
if (this.skinStyle && this.planId) {
|
||||
this.myChart && this.myChart.showLoading();
|
||||
loadMapData(this.skinStyle);
|
||||
getStationListBySkinStyle(this.skinStyle).then(resp => {
|
||||
this.$store.dispatch('runPlan/setStations', resp.data).then(() => {
|
||||
queryRunPlan(this.planId).then(rest => {
|
||||
this.$store.dispatch('runPlan/setPlanData', rest.data).then(() => {
|
||||
this.analyticalServiceNumber(this.$store.state.runPlan.editData);
|
||||
this.loadChartData();
|
||||
this.myChart && this.myChart.hideLoading();
|
||||
});
|
||||
}).catch(() => {
|
||||
this.myChart && this.myChart.hideLoading();
|
||||
this.$messageBox('获取运行图数据失败');
|
||||
});
|
||||
});
|
||||
}).catch(() => {
|
||||
this.$messageBox('请求车站数据失败');
|
||||
this.$store.dispatch('runPlan/setStations', []);
|
||||
this.myChart && this.myChart.hideLoading();
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
} catch (error) {
|
||||
this.$messageBox(`加载运行图数据失败`);
|
||||
}
|
||||
},
|
||||
async loadChartData() {
|
||||
try {
|
||||
const stations = this.$store.state.runPlan.stations;
|
||||
const planData = this.$store.state.runPlan.planData;
|
||||
|
||||
this.viewDisabled = true;
|
||||
this.viewDisabled = true;
|
||||
|
||||
this.option.series = [];
|
||||
this.kmRangeCoordMap = this.PlanConvert.convertStationsToMap(stations);
|
||||
this.pushModels(this.option.series, [this.PlanConvert.initializeYaxis(stations)]);
|
||||
this.pushModels(this.option.series, this.PlanConvert.convertDataToModels(planData, stations, this.kmRangeCoordMap, { width: 0.5 }));
|
||||
await this.loadInitData();
|
||||
this.option.series = [];
|
||||
this.kmRangeCoordMap = this.PlanConvert.convertStationsToMap(stations);
|
||||
this.pushModels(this.option.series, [this.PlanConvert.initializeYaxis(stations)]);
|
||||
this.pushModels(this.option.series, this.PlanConvert.convertDataToModels(planData, stations, this.kmRangeCoordMap, { width: 0.5 }));
|
||||
await this.loadInitData();
|
||||
|
||||
this.viewDisabled = false;
|
||||
} catch (error) {
|
||||
this.viewDisabled = false;
|
||||
this.$messageBox(`加在运行图数据失败：${error.message}`);
|
||||
}
|
||||
},
|
||||
async loadInitData() {
|
||||
await this.xAxisInit();
|
||||
await this.yAxisInit();
|
||||
await this.loadInitChart();
|
||||
},
|
||||
pushModels(series, models) {
|
||||
if (models && models.length) {
|
||||
models.forEach(elem => {
|
||||
if (elem) {
|
||||
series.push(elem);
|
||||
}
|
||||
})
|
||||
}
|
||||
this.viewDisabled = false;
|
||||
} catch (error) {
|
||||
this.viewDisabled = false;
|
||||
this.$messageBox(`加在运行图数据失败：${error.message}`);
|
||||
}
|
||||
},
|
||||
async loadInitData() {
|
||||
await this.xAxisInit();
|
||||
await this.yAxisInit();
|
||||
await this.loadInitChart();
|
||||
},
|
||||
pushModels(series, models) {
|
||||
if (models && models.length) {
|
||||
models.forEach(elem => {
|
||||
if (elem) {
|
||||
series.push(elem);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return series;
|
||||
},
|
||||
popModels(series, models) {
|
||||
if (models && models.length) {
|
||||
models.forEach(elem => {
|
||||
let index = series.indexOf(elem);
|
||||
if (index >= 0) {
|
||||
series.split(index, 1);
|
||||
}
|
||||
})
|
||||
}
|
||||
return series;
|
||||
},
|
||||
popModels(series, models) {
|
||||
if (models && models.length) {
|
||||
models.forEach(elem => {
|
||||
const index = series.indexOf(elem);
|
||||
if (index >= 0) {
|
||||
series.split(index, 1);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return series;
|
||||
},
|
||||
loadInitChart() {
|
||||
return new Promise((resolve, reject) => {
|
||||
try {
|
||||
let that = this;
|
||||
//加载echart配置
|
||||
require.config(
|
||||
{
|
||||
paths: {
|
||||
echarts: './js/dist'
|
||||
}
|
||||
}
|
||||
);
|
||||
// 按需加载所需图表，如需动态类型切换功能，别忘了同时加载相应图表
|
||||
require(
|
||||
[
|
||||
'echarts',
|
||||
'echarts/lib/chart/line',
|
||||
],
|
||||
function (ec) {
|
||||
if (that.myChart && that.myChart.isDisposed) {
|
||||
that.myChart.clear();
|
||||
}
|
||||
return series;
|
||||
},
|
||||
loadInitChart() {
|
||||
return new Promise((resolve, reject) => {
|
||||
try {
|
||||
const that = this;
|
||||
// 加载echart配置
|
||||
require.config(
|
||||
{
|
||||
paths: {
|
||||
echarts: './js/dist'
|
||||
}
|
||||
}
|
||||
);
|
||||
// 按需加载所需图表，如需动态类型切换功能，别忘了同时加载相应图表
|
||||
require(
|
||||
[
|
||||
'echarts',
|
||||
'echarts/lib/chart/line'
|
||||
],
|
||||
function (ec) {
|
||||
if (that.myChart && that.myChart.isDisposed) {
|
||||
that.myChart.clear();
|
||||
}
|
||||
|
||||
that.myChart = ec.init(document.getElementById(that.runPlanId));
|
||||
that.myChart.setOption(that.option);
|
||||
that.reSize({ width: that.$store.state.runPlan.width, height: that.$store.state.runPlan.height });
|
||||
that.myChart.on('click', that.mouseClick);
|
||||
resolve(true);
|
||||
}
|
||||
);
|
||||
} catch (error) {
|
||||
reject(error);
|
||||
}
|
||||
});
|
||||
},
|
||||
xAxisPointFormat(params) {
|
||||
return timeFormat(params.value);
|
||||
},
|
||||
yAxisPointFormat(params) {
|
||||
return this.PlanConvert.computedFormatYAxis(this.stations, params);
|
||||
},
|
||||
xAxisLableFormat(value, index) {
|
||||
if (value % 60 === 0) {
|
||||
return timeFormat(value);
|
||||
}
|
||||
},
|
||||
yAxisLableFormat(value, index) {
|
||||
return '';
|
||||
},
|
||||
xAxisInit() {
|
||||
let list = [];
|
||||
for (var time = 0 + this.PlanConvert.TranslationTime; time < 3600 * 24 + this.PlanConvert.TranslationTime; time++) {
|
||||
list.push(time);
|
||||
}
|
||||
that.myChart = ec.init(document.getElementById(that.runPlanId));
|
||||
that.myChart.setOption(that.option);
|
||||
that.reSize({ width: that.$store.state.runPlan.width, height: that.$store.state.runPlan.height });
|
||||
that.myChart.on('click', that.mouseClick);
|
||||
resolve(true);
|
||||
}
|
||||
);
|
||||
} catch (error) {
|
||||
reject(error);
|
||||
}
|
||||
});
|
||||
},
|
||||
xAxisPointFormat(params) {
|
||||
return timeFormat(params.value);
|
||||
},
|
||||
yAxisPointFormat(params) {
|
||||
return this.PlanConvert.computedFormatYAxis(this.stations, params);
|
||||
},
|
||||
xAxisLableFormat(value, index) {
|
||||
if (value % 60 === 0) {
|
||||
return timeFormat(value);
|
||||
}
|
||||
},
|
||||
yAxisLableFormat(value, index) {
|
||||
return '';
|
||||
},
|
||||
xAxisInit() {
|
||||
const list = [];
|
||||
for (var time = 0 + this.PlanConvert.TranslationTime; time < 3600 * 24 + this.PlanConvert.TranslationTime; time++) {
|
||||
list.push(time);
|
||||
}
|
||||
|
||||
let startValue = 3600 * 6;
|
||||
let offsetTime = 3600 * 1;
|
||||
const startValue = 3600 * 6;
|
||||
const offsetTime = 3600 * 1;
|
||||
|
||||
this.option.xAxis[0].data = list;
|
||||
if (!this.option.dataZoom[0].startValue) {
|
||||
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
|
||||
}
|
||||
this.option.xAxis[0].data = list;
|
||||
if (!this.option.dataZoom[0].startValue) {
|
||||
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
|
||||
}
|
||||
|
||||
if (!this.option.dataZoom[0].endValue) {
|
||||
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
|
||||
}
|
||||
},
|
||||
yAxisInit() {
|
||||
if (Object.keys(this.PlanConvert).length) {
|
||||
this.option.yAxis.min = this.PlanConvert.computedYaxisMinValue(this.stations);
|
||||
this.option.yAxis.max = this.PlanConvert.computedYaxisMaxValue(this.stations);
|
||||
}
|
||||
},
|
||||
axisTooltip(param) {
|
||||
let station = this.stations[Math.floor((param.data[1] - this.PlanConvert.EdgeHeight) / this.PlanConvert.CoordMultiple)] || { name: '', kmRange: '' };
|
||||
return [
|
||||
`Point Data <hr size=1 style="margin: 3px 0">`,
|
||||
`车站名称: ${station.name}<br>`,
|
||||
`车站公里标: ${station.kmRange} km <br>`,
|
||||
`到站时间: ${timeFormat(param.data[0] + this.PlanConvert.TranslationTime)} (${param.data[0]})<br>`
|
||||
].join('');
|
||||
},
|
||||
mouseClick(params) {
|
||||
let model = {
|
||||
serviceNumber: params.seriesName
|
||||
}
|
||||
this.$store.dispatch('runPlan/setSelected', model);
|
||||
},
|
||||
reSize(opt) {
|
||||
if (this.myChart) {
|
||||
this.myChart.resize({
|
||||
width: opt.width,
|
||||
height: opt.height,
|
||||
silent: false
|
||||
});
|
||||
}
|
||||
},
|
||||
destroy() {
|
||||
if (this.myChart && this.myChart.isDisposed) {
|
||||
this.myChart.dispose();
|
||||
this.myChart = null;
|
||||
}
|
||||
},
|
||||
scheduleTouch() {
|
||||
if (!this.option.dataZoom[0].endValue) {
|
||||
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
|
||||
}
|
||||
},
|
||||
yAxisInit() {
|
||||
if (Object.keys(this.PlanConvert).length) {
|
||||
this.option.yAxis.min = this.PlanConvert.computedYaxisMinValue(this.stations);
|
||||
this.option.yAxis.max = this.PlanConvert.computedYaxisMaxValue(this.stations);
|
||||
}
|
||||
},
|
||||
axisTooltip(param) {
|
||||
const station = this.stations[Math.floor((param.data[1] - this.PlanConvert.EdgeHeight) / this.PlanConvert.CoordMultiple)] || { name: '', kmRange: '' };
|
||||
return [
|
||||
`Point Data <hr size=1 style="margin: 3px 0">`,
|
||||
`车站名称: ${station.name}<br>`,
|
||||
`车站公里标: ${station.kmRange} km <br>`,
|
||||
`到站时间: ${timeFormat(param.data[0] + this.PlanConvert.TranslationTime)} (${param.data[0]})<br>`
|
||||
].join('');
|
||||
},
|
||||
mouseClick(params) {
|
||||
const model = {
|
||||
serviceNumber: params.seriesName
|
||||
};
|
||||
this.$store.dispatch('runPlan/setSelected', model);
|
||||
},
|
||||
reSize(opt) {
|
||||
if (this.myChart) {
|
||||
this.myChart.resize({
|
||||
width: opt.width,
|
||||
height: opt.height,
|
||||
silent: false
|
||||
});
|
||||
}
|
||||
},
|
||||
destroy() {
|
||||
if (this.myChart && this.myChart.isDisposed) {
|
||||
this.myChart.dispose();
|
||||
this.myChart = null;
|
||||
}
|
||||
},
|
||||
scheduleTouch() {
|
||||
|
||||
},
|
||||
trainNumTouch() {
|
||||
},
|
||||
trainNumTouch() {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
@import "src/styles/mixin.scss";
|
||||
|
||||
#PlanSchedule {
|
||||
@ -516,4 +527,4 @@
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -1,95 +1,102 @@
|
||||
<template>
|
||||
<data-table id="PlanStatusBar" ref="dataTable" :height="height-11" :config="stationListConfig" :close="false"
|
||||
:style="{top: maxmini? maxTop-110+'px':maxTop-21+'px'}" @touch="touch"></data-table>
|
||||
<data-table
|
||||
id="PlanStatusBar"
|
||||
ref="dataTable"
|
||||
:height="height-11"
|
||||
:config="stationListConfig"
|
||||
:close="false"
|
||||
:style="{top: maxmini? maxTop-110+'px':maxTop-21+'px'}"
|
||||
@touch="touch"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import DataTable from './menus/components/dataTable';
|
||||
import { formatTime, formatName } from '@/utils/runPlan';
|
||||
import DataTable from './menus/components/dataTable';
|
||||
import { formatTime, formatName } from '@/utils/runPlan';
|
||||
|
||||
export default {
|
||||
name: 'PlanStatusBar',
|
||||
props: {
|
||||
maxTop: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
components: {
|
||||
DataTable
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
maxmini: true,
|
||||
height: 100,
|
||||
stationListConfig: {
|
||||
data: [],
|
||||
showClose: true,
|
||||
highlightCurrentRow: true,
|
||||
columns: [
|
||||
{
|
||||
prop: 'stationName',
|
||||
label: '站台',
|
||||
width: 400
|
||||
},
|
||||
{
|
||||
prop: 'startTime',
|
||||
label: '到点',
|
||||
},
|
||||
{
|
||||
prop: 'stopTime',
|
||||
label: '停站时间',
|
||||
},
|
||||
{
|
||||
prop: 'endTime',
|
||||
label: '发点',
|
||||
},
|
||||
{
|
||||
prop: 'level',
|
||||
label: '运行等级'
|
||||
export default {
|
||||
name: 'PlanStatusBar',
|
||||
components: {
|
||||
DataTable
|
||||
},
|
||||
props: {
|
||||
maxTop: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
maxmini: true,
|
||||
height: 100,
|
||||
stationListConfig: {
|
||||
data: [],
|
||||
showClose: true,
|
||||
highlightCurrentRow: true,
|
||||
columns: [
|
||||
{
|
||||
prop: 'stationName',
|
||||
label: '站台',
|
||||
width: 400
|
||||
},
|
||||
{
|
||||
prop: 'startTime',
|
||||
label: '到点'
|
||||
},
|
||||
{
|
||||
prop: 'stopTime',
|
||||
label: '停站时间'
|
||||
},
|
||||
{
|
||||
prop: 'endTime',
|
||||
label: '发点'
|
||||
},
|
||||
{
|
||||
prop: 'level',
|
||||
label: '运行等级'
|
||||
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.runPlan.select': function (select) {
|
||||
this.stationListConfig.data = [];
|
||||
let serviceObj = this.$store.state.runPlan.editData[select.serviceNumber];
|
||||
if (serviceObj) {
|
||||
let trainMap = serviceObj.trainMap;
|
||||
if (trainMap) {
|
||||
let trainObj = trainMap[select.tripNumber];
|
||||
if (trainObj) {
|
||||
let stationTimeList = trainObj.stationTimeList;
|
||||
if (stationTimeList && stationTimeList.length) {
|
||||
stationTimeList.forEach((elem, index) => {
|
||||
let stationObj = {
|
||||
stationName: formatName(elem.stationCode),
|
||||
startTime: formatTime(index == 0 ? null : stationTimeList[index - 1].secondTime),
|
||||
stopTime: formatTime(index == 0 ? null : elem.secondTime - stationTimeList[index - 1].secondTime),
|
||||
endTime: formatTime(elem.secondTime),
|
||||
level: ''
|
||||
}
|
||||
this.stationListConfig.data.push(stationObj);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
touch(maxmini) {
|
||||
this.maxmini = maxmini;
|
||||
this.$emit('setPosition');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'$store.state.runPlan.selected': function (select) {
|
||||
this.stationListConfig.data = [];
|
||||
const serviceObj = this.$store.state.runPlan.editData[select.serviceNumber];
|
||||
if (serviceObj) {
|
||||
const trainMap = serviceObj.trainMap;
|
||||
if (trainMap) {
|
||||
const trainObj = trainMap[select.tripNumber];
|
||||
if (trainObj) {
|
||||
const stationTimeList = trainObj.stationTimeList;
|
||||
if (stationTimeList && stationTimeList.length) {
|
||||
stationTimeList.forEach((elem, index) => {
|
||||
const stationObj = {
|
||||
stationName: formatName(elem.stationCode),
|
||||
startTime: formatTime(index == 0 ? null : stationTimeList[index - 1].secondTime),
|
||||
stopTime: formatTime(index == 0 ? null : elem.secondTime - stationTimeList[index - 1].secondTime),
|
||||
endTime: formatTime(elem.secondTime),
|
||||
level: ''
|
||||
};
|
||||
this.stationListConfig.data.push(stationObj);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
touch(maxmini) {
|
||||
this.maxmini = maxmini;
|
||||
this.$emit('setPosition');
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
@import "src/styles/mixin.scss";
|
||||
|
||||
#PlanStatusBar {
|
||||
@ -97,4 +104,4 @@
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user