This commit is contained in:
ival 2019-11-12 17:28:44 +08:00
commit 8fb45d91a0
40 changed files with 2859 additions and 3002 deletions

View File

@ -16,7 +16,6 @@
},
"dependencies": {
"axios": "0.18.0",
"echarts": "^4.2.1",
"element-ui": "2.7.2",
"file-saver": "^1.3.3",
"js-cookie": "2.2.0",

View File

@ -5,11 +5,16 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="icon" href="<%= BASE_URL %>favicon.png">
<!-- <link rel="stylesheet" href="https://cdn.bootcss.com/element-ui/2.12.0/theme-chalk/index.css"> -->
<title><%= webpackConfig.name %></title>
<script src="/static/inflate.min.js"></script>
<script src="/static/three.min.js"></script>
<script src="https://cdn.bootcss.com/echarts/4.4.0-rc.1/echarts-en.common.js"></script>
<!-- <script src="https://cdn.bootcss.com/element-ui/2.12.0/index.js"></script>
<script src="https://cdn.bootcss.com/element-ui/2.12.0/locale/en.min.js"></script>
<script src="https://cdn.bootcss.com/element-ui/2.12.0/locale/zh-CN.min.js"></script> -->
</head>
<body>
<body>
<noscript>
<strong>We're sorry but <%= webpackConfig.name %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>

View File

@ -2,265 +2,256 @@
import request from '@/utils/request';
export function postDataBd(data) {
return request({
url: `/api/audio/bd?group=${data.group}&conversationId=${data.conversationId}`,
method: 'post',
data: data.file
});
return request({
url: `/api/audio/bd?group=${data.group}&conversationId=${data.conversationId}`,
method: 'post',
data: data.file
});
}
// 创建/获取会话id
export function getConversation(data) {
return request({
url: `/api/audio/conversation`,
method: 'get',
params: {
group: data.group,
userId: data.userId,
code: data.code
}
});
return request({
url: `/api/audio/conversation`,
method: 'get',
params: {
group: data.group,
userId: data.userId,
code: data.code
}
});
}
export function postDataXf(data) {
return request({
url: `/api/audio/xf`,
method: 'post',
data: data
});
return request({
url: `/api/audio/xf`,
method: 'post',
data: data
});
}
// 获取语音历史记录
export function getHistoryVoice(code) {
return request({
url: `/api/audio/${code}/history`,
method: 'get'
});
return request({
url: `/api/audio/${code}/history`,
method: 'get'
});
}
// 文字聊天 发送文字
export function chatWithText(data, group) {
return request({
url: `/api/jointTraining/chatWithText?group=${group}`,
method: 'post',
data: {
message: data
}
});
return request({
url: `/api/jointTraining/chatWithText?group=${group}`,
method: 'post',
data: {
message: data
}
});
}
// 文字聊天 发送文字
export function chatWithAudio(file, group) {
return request({
url: `/api/jointTraining/chatWithAudio?group=${group}`,
method: 'post',
data: file
});
}
// 文字聊天 发送文字
// 生成分发二维码
export function getJoinTrainCode(data, group) {
return request({
url: `/api/jointTraining/qrCode?group=${group}`,
method: 'post',
data: data
});
return request({
url: `/api/jointTraining/qrCode?group=${group}`,
method: 'post',
data: data
});
}
// 创建房间
export function postCreateRoom(data) {
return request({
url: `/api/jointTraining/room`,
method: 'post',
data: data
});
return request({
url: `/api/jointTraining/room`,
method: 'post',
data: data
});
}
// 检查房间存在
export function checkRoomExist(params) {
return request({
url: `/api/simulationRoom`,
method: 'get',
params
});
return request({
url: `/api/simulationRoom`,
method: 'get',
params
});
}
// 获取房间详情
export function postRoomDetail(group) {
return request({
url: `/api/jointTraining/room/${group}`,
method: 'get'
});
return request({
url: `/api/jointTraining/room/${group}`,
method: 'get'
});
}
// 销毁房间
export function deljointTrainRoom(group) {
return request({
url: `/api/jointTraining/room`,
method: 'delete',
params: {
group: group
}
});
return request({
url: `/api/jointTraining/room`,
method: 'delete',
params: {
group: group
}
});
}
// 查询有权限房间列表
export function getjointTrainList() {
return request({
url: `/api/jointTraining/room/list`,
method: 'get'
});
return request({
url: `/api/jointTraining/room/list`,
method: 'get'
});
}
// 加入房间
export function getjointTraining(group) {
return request({
url: `/api/jointTraining/room/join`,
method: 'put',
params: {
group: group
}
});
return request({
url: `/api/jointTraining/room/join`,
method: 'put',
params: {
group: group
}
});
}
// 设置人员角色
export function putUserRoles(data, group) {
return request({
url: `/api/jointTraining/room/user/role?group=${group}`,
method: 'put',
data: data
});
return request({
url: `/api/jointTraining/room/user/role?group=${group}`,
method: 'put',
data: data
});
}
// 设置人员角色
// 获取房间里的用户列表
export function getJointTrainRoomUserList(group) {
return request({
url: `/api/jointTraining/room/${group}/user/list`,
method: 'get'
});
return request({
url: `/api/jointTraining/room/${group}/user/list`,
method: 'get'
});
}
// 离开房间接口
export function putJointTrainingExit(group) {
return request({
url: `/api/jointTraining/room/exit`,
method: 'put',
params: {
group: group
}
});
return request({
url: `/api/jointTraining/room/exit`,
method: 'put',
params: {
group: group
}
});
}
// 开始联合演练
export function startJointTraining(group) {
return request({
url: `/api/jointTraining/room/simulation`,
method: 'post',
params: {
group: group
}
});
return request({
url: `/api/jointTraining/room/simulation`,
method: 'post',
params: {
group: group
}
});
}
// 获取个人信息
export function getUserRoles(group) {
return request({
url: `/api/jointTraining/room/user/role`,
method: 'get',
params: {
group: group
}
});
return request({
url: `/api/jointTraining/room/user/role`,
method: 'get',
params: {
group: group
}
});
}
// 返回房间
export function putJointTrainingState() {
return request({
url: `/api/jointTraining/room/back`,
method: 'put'
});
return request({
url: `/api/jointTraining/room/back`,
method: 'put'
});
}
// 踢出用户
export function putJointTrainingUserkicked(userId, group) {
return request({
url: `/api/jointTraining/room/user`,
method: 'put',
params: {
userId: userId,
group: group
}
});
return request({
url: `/api/jointTraining/room/user`,
method: 'put',
params: {
userId: userId,
group: group
}
});
}
// 管理员结束所有人的仿真
export function putJointTrainingSimulation(group) {
return request({
url: `/api/jointTraining/room/simulation/all`,
method: 'put',
params: {
group: group
}
});
return request({
url: `/api/jointTraining/room/simulation/all`,
method: 'put',
params: {
group: group
}
});
}
// 结束仿真返回房间
export function putJointTrainingSimulationUser(group) {
return request({
url: `/api/jointTraining/room/simulation/user/exit`,
method: 'put',
params: {
group: group
}
});
return request({
url: `/api/jointTraining/room/simulation/user/exit`,
method: 'put',
params: {
group: group
}
});
}
// 进入仿真
export function putJointTrainingSimulationEntrance(group) {
return request({
url: `/api/jointTraining/room/simulation/user/entrance`,
method: 'put',
params: {
group: group
}
});
return request({
url: `/api/jointTraining/room/simulation/user/entrance`,
method: 'put',
params: {
group: group
}
});
}
/**
* 权限获取(房间权限)
*/
export function getPermissionJoint(group) {
return request({
url: '/api/jointTraining/qrCode',
method: 'get',
params: {
group: group
}
});
return request({
url: '/api/jointTraining/qrCode',
method: 'get',
params: {
group: group
}
});
}
// 添加或更新真实设备和仿真对象连接
export function setRealDevice(group, data) {
return request({
url: `/api/jointTraining/room/realDevice?group=${group}`,
method: 'post',
data: data
});
return request({
url: `/api/jointTraining/room/realDevice?group=${group}`,
method: 'post',
data: data
});
}
// 删除真实设备和仿真对象连接
export function delRealDevice(id, group) {
return request({
url: `/api/jointTraining/room/realDevice/${id}`,
method: 'delete',
params: { group: group }
});
return request({
url: `/api/jointTraining/room/realDevice/${id}`,
method: 'delete',
params: { group: group }
});
}
// 获取真实设备列表
export function getRealDevices(group) {
return request({
url: `/api/jointTraining/room/${group}/devices`,
method: 'get'
});
return request({
url: `/api/jointTraining/room/${group}/devices`,
method: 'get'
});
}

View File

@ -1,188 +1,164 @@
import request from '@/utils/request';
export function getDraftLesson(params, mapId) {
/** 根据mapId获取草稿课程 */
return request({
url: `/api/mapSystem/findDraftLessonBy/${mapId}`,
method: 'get',
params
});
}
/** 获取用户地图树 */
export function getUserMapTree(cityCode) {
return request({
url: `/api/mapSystem/findDraftMapByCityCode?cityCode=${cityCode}`,
method: 'get'
});
}
/** 运行图*/
export function getRpListByUserMapId(mapId) {
return request({
url: `/api/draftMap/runPlan/findByDraftMapId/${mapId}`,
method: 'get'
});
return request({
url: `/api/draftMap/runPlan/findByDraftMapId/${mapId}`,
method: 'get'
});
}
export function getMapList(cityCode) {
/** 根据cityCode获取地图列表 */
return request({
url: `/api/mapSystem/queryMapByCityCode/${cityCode}`,
method: 'get'
});
/** 根据cityCode获取地图列表 */
return request({
url: `/api/mapSystem/queryMapByCityCode/${cityCode}`,
method: 'get'
});
}
/** 获取用户自己的运行图详情*/
export function getRpDetailByUserMapId(planId) {
return request({
url: `/api/draftMap/runPlan/selectDiagramData/${planId}`,
method: 'get'
});
return request({
url: `/api/draftMap/runPlan/selectDiagramData/${planId}`,
method: 'get'
});
}
/** 获取用户自己创建的草稿地图详情*/
export function getUserMapDetailByMapId(mapId) {
return request({
url: `/api/mapBuild/findById/${mapId}`,
method: 'get'
});
return request({
url: `/api/mapBuild/findById/${mapId}`,
method: 'get'
});
}
/** 用户自己的运行图仿真测试*/
export function runUserPlanNotify({ planId }) {
return request({
url: `/api/draftMap/runPlan/simulationCheck/${planId}`,
method: 'get'
});
return request({
url: `/api/draftMap/runPlan/simulationCheck/${planId}`,
method: 'get'
});
}
/** 管理员获取需审核的课程列表 */
export function reviewLessonList(params) {
return request({
url: `/api/review/query/lesson`,
method: 'get',
params
});
return request({
url: `/api/review/query/lesson`,
method: 'get',
params
});
}
/** 管理员发布课程接口 */
export function adminPublishLesson(data, id) {
return request({
url: `/api/review/${id}/publishLesson`,
method: 'post',
data: data
});
return request({
url: `/api/review/${id}/publishLesson`,
method: 'post',
data: data
});
}
/** 管理员驳回课程发布申请 */
export function rejectedLessonRelease(data, id) {
return request({
url: `/api/review/lesson/${id}`,
method: 'post',
data: data
});
return request({
url: `/api/review/lesson/${id}`,
method: 'post',
data: data
});
}
/** 普通用户申请课程发布和撤销申请 */
export function releaseOrCancel(id, status) {
return request({
url: `/api/review/lesson/releaseOrCancel/${id}/${status}`,
method: 'get'
});
return request({
url: `/api/review/lesson/releaseOrCancel/${id}/${status}`,
method: 'get'
});
}
/** 管理员获取需审核的剧本列表 ok */
export function reviewScriptList(params) {
return request({
url: `/api/review/query/script`,
method: 'get',
params
});
return request({
url: `/api/review/query/script`,
method: 'get',
params
});
}
/** 管理员发布剧本 ok */
export function publishScript(id) {
return request({
url: `/api/review/${id}/publishScript`,
method: 'post'
});
return request({
url: `/api/review/${id}/publishScript`,
method: 'post'
});
}
/** 管理员剧本申请驳回 ok */
export function rejectScript(id, data) {
return request({
url: `/api/review/script/${id}`,
method: 'post',
data: data
});
return request({
url: `/api/review/script/${id}`,
method: 'post',
data: data
});
}
/** 管理员获取需审核的运行图列表 */
export function reviewRunPlanList(params) {
return request({
url: `/api/review/query/runPlan`,
method: 'get',
params
});
return request({
url: `/api/review/query/runPlan`,
method: 'get',
params
});
}
/** 管理员发布运行图 */
export function publishRunPlan(planId, data) {
return request({
url: `/api/review/${planId}/publishRunPlan`,
method: 'post',
data: data
});
return request({
url: `/api/review/${planId}/publishRunPlan`,
method: 'post',
data: data
});
}
/** 普通用户申请或撤销运行图发布 */
export function releaseOrCancelRunPlan(planId, status) {
return request({
url: `/api/review/runPlan/releaseOrCancel/${planId}/${status}`,
method: 'get'
});
return request({
url: `/api/review/runPlan/releaseOrCancel/${planId}/${status}`,
method: 'get'
});
}
/** 管理员运行图申请驳回 */
export function rejectRunPlan(id, data) {
return request({
url: `/api/review/runPlan/${id}`,
method: 'post',
data: data
});
}
/** 用户申请发布剧本或者撤销剧本申请 */
export function releaseScript(id, status) {
return request({
url: `/api/review/script/releaseOrCancel/${id}/${status}`,
method: 'get'
});
return request({
url: `/api/review/runPlan/${id}`,
method: 'post',
data: data
});
}
/** 查看课程详情 */
export function reviewLessonDetail(id) {
return request({
url: `/api/review/previewLesson/${id}`,
method: 'get'
});
return request({
url: `/api/review/previewLesson/${id}`,
method: 'get'
});
}
/** 管理员预览草稿运行图*/
export function previewRunPlan(planId) {
return request({
url: `/api/review/previewRunPlan/${planId}`,
method: 'get'
});
return request({
url: `/api/review/previewRunPlan/${planId}`,
method: 'get'
});
}
/** 加载剧本 */
export function loadDraftScript(scriptId, memberId, group) {
return request({
url: `api/simulation/${group}/scriptDraft/${scriptId}?memberId=${memberId}`,
method: 'post'
});
return request({
url: `api/simulation/${group}/scriptDraft/${scriptId}?memberId=${memberId}`,
method: 'post'
});
}
/** 获取已发布的有地图的城市列表*/
export function publisMapCityList(data) {
return request({
url: `/api/map/city?dicCode=${data}`,
method: 'get'
});
return request({
url: `/api/map/city?dicCode=${data}`,
method: 'get'
});
}

View File

@ -1,76 +1,76 @@
import request from '@/utils/request';
// 账号密码 其他系统
export function login(params) {
return request({
url: '/api/login',
method: 'post',
data: params
});
return request({
url: '/api/login',
method: 'post',
data: params
});
}
// 获取登陆url 二维码 其他系统
// 获取微信登陆二维码 url 其他系统
export function getLoginUrl(params) {
return request({
url: '/api/login/url',
method: 'get',
params: params
});
return request({
url: '/api/login/url',
method: 'get',
params: params
});
}
// 获取登陆url 小程序二维码
// 获取微信小程序登陆二维码
export function getLoginWmurl(params) {
return request({
url: '/api/login/wmurl',
method: 'get',
params: params
});
return request({
url: '/api/login/wmurl',
method: 'get',
params: params
});
}
// 获取登录信息
export function getInfo(token) {
return request({
url: '/api/login/getUserInfo',
method: 'get',
params: { token }
});
return request({
url: '/api/login/getUserInfo',
method: 'get',
params: { token }
});
}
// 登出
export function logout(token) {
return request({
url: '/api/login/logout',
method: 'get',
params: {
token
}
});
return request({
url: '/api/login/logout',
method: 'get',
params: {
token
}
});
}
// 检查登陆状态
export function checkLoginStatus(sessionId) {
return new Promise((resolve, reject) => {
request({
url: '/api/login/checkStatus',
method: 'get',
params: {
sessionId: sessionId
}
}).then(response => {
if (response.data.status === '2') {
resolve(response);
} else {
reject(response);
}
}).catch(error => {
reject(error);
});
});
return new Promise((resolve, reject) => {
request({
url: '/api/login/checkStatus',
method: 'get',
params: {
sessionId: sessionId
}
}).then(response => {
if (response.data.status === '2') {
resolve(response);
} else {
reject(response);
}
}).catch(error => {
reject(error);
});
});
}
// 检测持续在线 防止掉线在大屏或者仿真系统下
export function checkLoginLine() {
return request({
url: '/api/cache/heartBeat',
method: 'get'
});
return request({
url: '/api/cache/heartBeat',
method: 'get'
});
}

View File

@ -1,47 +1,47 @@
import request from '@/utils/request';
export function querySecheduling(group, params) {
return request({
url: `/api/scheduling/${group}/day`,
method: 'get',
params
});
return request({
url: `/api/scheduling/${group}/day`,
method: 'get',
params
});
}
export function generateScheduling(group, params) {
return request({
url: `/api/scheduling/${group}/generate`,
method: 'post',
params
});
return request({
url: `/api/scheduling/${group}/generate`,
method: 'post',
params
});
}
export function getSchedulingAllTrains(group) {
return request({
url: `/api/scheduling/${group}/train/all`,
method: 'get'
});
return request({
url: `/api/scheduling/${group}/train/all`,
method: 'get'
});
}
export function checkScheduling(group, data) {
return request({
url: `/api/scheduling/${group}/check`,
method: 'post',
data
});
return request({
url: `/api/scheduling/${group}/check`,
method: 'post',
data
});
}
export function saveScheduling(group, data) {
return request({
url: `/api/scheduling/${group}/save`,
method: 'post',
data
});
return request({
url: `/api/scheduling/${group}/save`,
method: 'post',
data
});
}
export function generateSchedulingAgain(group) {
return request({
url: `/api/scheduling/${group}/rebuild`,
method: 'delete'
});
return request({
url: `/api/scheduling/${group}/rebuild`,
method: 'delete'
});
}

View File

@ -2,33 +2,25 @@ import request from '@/utils/request';
/** 分页查找上线的剧本*/
export function getScriptPageListOnline(params) {
return request({
url: `/api/script/paging/online`,
// url: `/api/script/paging/published`,
method: 'get',
params: params
});
}
/** 通过ID查询剧本的基础信息 */
export function getScriptByIdList(id) {
return request({
url: `/api/script/${id}/basic`,
method: 'get'
});
return request({
url: `/api/script/paging/online`,
// url: `/api/script/paging/published`,
method: 'get',
params: params
});
}
/** 通过ID查询发布的剧本的详细信息 */
export function getScriptById(id) {
return request({
url: `/api/script/${id}/detail`,
method: 'get'
});
return request({
url: `/api/script/${id}/detail`,
method: 'get'
});
}
/** 通过ID查询未发布剧本的详细信息 */
export function getDraftScriptByGroup(group) {
return request({
url: `/api/simulation/${group}/script/loadedScript`,
method: 'get'
});
return request({
url: `/api/simulation/${group}/script/loadedScript`,
method: 'get'
});
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 170 KiB

After

Width:  |  Height:  |  Size: 90 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 132 KiB

After

Width:  |  Height:  |  Size: 106 KiB

BIN
src/assets/home/script.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 61 KiB

View File

@ -153,6 +153,7 @@ export default {
pleaseEnterMapName: 'Please enter a map name',
pleaseChooseSkinCode: 'Please choose skin style',
pleaseChooseLineCode:'Please Choose line type',
pleaseSelectMapSource: 'Please select the map source',
pleaseSelectAssociatedCity: 'Please select the associated city',
pleaseSelectAssociatedSkin: 'Please select associated skin',

View File

@ -152,6 +152,7 @@ export default {
pleaseEnterMapName: '请输入地图名称',
pleaseChooseSkinCode: '请选择皮肤风格',
pleaseChooseLineCode:'请选择线路类型',
pleaseSelectMapSource: '请选择地图来源',
pleaseSelectAssociatedCity: '请选择关联城市',
pleaseSelectAssociatedSkin: '请选择关联皮肤',

View File

@ -1,8 +1,8 @@
<template>
<div class="plan-schedule" style="width: 100%">
<title-bar ref="titleBar" @back="back" />
<menu-bar ref="menuBar" :skin-code="skinCode" @dispatchDialog="dispatchDialog" />
<schedule ref="schedule" :group="group" :skin-code="skinCode" :max-height="height" :max-width="width" />
<menu-bar ref="menuBar" :line-code="lineCode" @dispatchDialog="dispatchDialog" />
<schedule ref="schedule" :group="group" :line-code="lineCode" :max-height="height" :max-width="width" />
<status-bar ref="statusBar" :max-top="height" @setPosition="setPosition" />
<manage-plan-list ref="managePlanList" @dispatchDialog="dispatchDialog" />
@ -29,65 +29,65 @@ import DeleteTask from '../menusPlan/deleteTask';
import ModifyingTask from '../menusPlan/modifyingTask';
export default {
name: 'Menus',
components: {
TitleBar,
MenuBar,
StatusBar,
Schedule,
ManagePlanList,
CreateWeekPlan,
CreateTodayPlan,
ModifyingPlan,
AddTask,
DeleteTask,
ModifyingTask
},
props: {
group: {
type: String,
required: true
}
},
data() {
return {
};
},
computed: {
skinCode() {
return this.$route.query.skinCode || '02';
},
width() {
return this.$store.state.app.width;
},
height() {
return this.$store.state.app.height;
}
},
methods: {
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');
}
}
name: 'Menus',
components: {
TitleBar,
MenuBar,
StatusBar,
Schedule,
ManagePlanList,
CreateWeekPlan,
CreateTodayPlan,
ModifyingPlan,
AddTask,
DeleteTask,
ModifyingTask
},
props: {
group: {
type: String,
required: true
}
},
data() {
return {
};
},
computed: {
lineCode() {
return this.$route.query.lineCode || '02';
},
width() {
return this.$store.state.app.width;
},
height() {
return this.$store.state.app.height;
}
},
methods: {
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>

View File

@ -125,7 +125,7 @@ import { EventBus } from '@/scripts/event-bus';
export default {
name: 'PlanMenuBar',
props: {
skinCode: {
lineCode: {
type: String,
required: true
}

View File

@ -27,456 +27,428 @@ import { mapGetters } from 'vuex';
import { timeFormat } from '@/utils/date';
import { runDiagramGetTime } from '@/api/simulation';
import DataTable from '../menusPlan/components/dataTable';
import echarts from 'echarts';
export default {
name: 'PlanSchedule',
components: {
DataTable
},
props: {
group: {
type: String,
required: true
},
skinCode: {
type: String,
required: true
},
maxWidth: {
type: Number,
require: 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;
});
name: 'PlanSchedule',
components: {
DataTable
},
props: {
group: {
type: String,
required: true
},
lineCode: {
type: String,
required: true
},
maxWidth: {
type: Number,
require: 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.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.skinCode);
},
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;
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.lineCode);
},
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;
const titleBar = document.getElementById('PlanTitleBar');
const menuBar = document.getElementById('PlanMenuBar');
const menuTool = document.getElementById('PlanMenuTool');
const 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 = [];
const stations = this.$store.state.runPlan.stations;
const planData = this.$store.state.runPlan.planData;
if (this.height != height) {
this.height = height - 20 * 2;
}
});
},
async loadChartPage() {
try {
let series = [];
const stations = this.$store.state.runPlan.stations;
const planData = this.$store.state.runPlan.planData;
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, { color: '#000', 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, { color: '#000', 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 => {
const index = series.indexOf(elem);
if (index >= 0) {
series.split(index, 1);
}
});
}
return series;
},
loadInitChart(series) {
return new Promise((resolve, reject) => {
try {
this.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 + this.PlanConvert.TranslationTime;
const offsetTime = 3600;
let startValue = 3600 + that.PlanConvert.TranslationTime;
const offsetTime = 3600;
runDiagramGetTime(this.group).then(resp => {
startValue = resp.data - this.PlanConvert.TranslationTime;
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
this.option.series = series;
this.myChart = echarts.init(document.getElementById(this.runPlanId));
if (this.myChart) {
this.myChart.setOption(this.option);
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
this.myChart.on('click', this.mouseClick);
}
});
resolve(true);
} catch (error) {
reject(error);
}
});
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);
}
},
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);
}
const startValue = 3600 * 6;
const 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) {
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() {
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 {

View File

@ -1,8 +1,8 @@
<template>
<div class="plan-schedule" style="width: 100%">
<title-bar ref="titleBar" @back="back" />
<menu-bar ref="menuBar" :skin-code="skinCode" @dispatchDialog="dispatchDialog" />
<schedule ref="schedule" :group="group" :skin-code="skinCode" :max-height="height" :max-width="width" />
<menu-bar ref="menuBar" :line-code="lineCode" @dispatchDialog="dispatchDialog" />
<schedule ref="schedule" :group="group" :line-code="lineCode" :max-height="height" :max-width="width" />
<status-bar ref="statusBar" :max-top="height" @setPosition="setPosition" />
<manage-plan-list ref="managePlanList" @dispatchDialog="dispatchDialog" />
@ -29,65 +29,65 @@ import DeleteTask from '../menusPlan/deleteTask';
import ModifyingTask from '../menusPlan/modifyingTask';
export default {
name: 'Menus',
components: {
TitleBar,
MenuBar,
StatusBar,
Schedule,
ManagePlanList,
CreateWeekPlan,
CreateTodayPlan,
ModifyingPlan,
AddTask,
DeleteTask,
ModifyingTask
},
props: {
group: {
type: String,
required: true
}
},
data() {
return {
};
},
computed: {
skinCode() {
return this.$route.query.skinCode || '02';
},
width() {
return this.$store.state.app.width;
},
height() {
return this.$store.state.app.height;
}
},
methods: {
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');
}
}
name: 'Menus',
components: {
TitleBar,
MenuBar,
StatusBar,
Schedule,
ManagePlanList,
CreateWeekPlan,
CreateTodayPlan,
ModifyingPlan,
AddTask,
DeleteTask,
ModifyingTask
},
props: {
group: {
type: String,
required: true
}
},
data() {
return {
};
},
computed: {
skinCode() {
return this.$route.query.skinCode || '02';
},
width() {
return this.$store.state.app.width;
},
height() {
return this.$store.state.app.height;
}
},
methods: {
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>

View File

@ -125,7 +125,7 @@ import { EventBus } from '@/scripts/event-bus';
export default {
name: 'PlanMenuBar',
props: {
skinCode: {
lineCode: {
type: String,
required: true
}

View File

@ -1,153 +1,133 @@
<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 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';
import echarts from 'echarts';
export default {
name: 'PlanSchedule',
props: {
group: {
type: String,
required: true
},
skinCode: {
type: String,
required: true
},
maxWidth: {
type: Number,
require: true
},
maxHeight: {
type: Number,
required: true
}
export default {
name: 'PlanSchedule',
components: {
DataTable
},
props: {
group: {
type: String,
required: true
},
components: {
DataTable
lineCode: {
type: String,
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
}
]
maxWidth: {
type: Number,
require: 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'
},
tripNumberConfig: {
data: [],
highlightCurrentRow: true,
handleChange: this.tripNumberChange,
showClose: false,
columns: [
{
prop: 'tripNumber',
label: '车次号',
},
{
width: 40
}
]
grid: {
top: '30px',
left: '120px',
right: '40px',
bottom: '65px',
containLabel: true,
backgroundColor: 'floralwhite'
},
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'
toolbox: {
right: '30px',
feature: {
dataZoom: {
yAxisIndex: 'none'
},
formatter: this.axisTooltip,
borderWidth: 1,
restore: {},
saveAsImage: {}
}
},
tooltip: {
axisPointer: {
trigger: 'item',
type: 'cross'
},
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,
},
formatter: this.axisTooltip,
borderWidth: 1
},
xAxis: [
{
type: 'category',
boundaryGap: false,
data: [],
axisLine: {
onZero: false,
lineStyle: {
@ -156,317 +136,329 @@
}
},
axisLabel: {
interval: 'auto',
formatter: this.yAxisLableFormat,
formatter: this.xAxisLableFormat,
textStyle: {
color: '#333'
}
},
axisPointer: {
xAxisIndex: 'all',
snap: true,
label: {
formatter: this.yAxisPointFormat,
backgroundColor: 'rgb(0,100,0,0.5)',
color: 'white',
formatter: this.xAxisPointFormat,
backgroundColor: 'rgb(255,0,0,0.5)',
color: 'white'
}
},
min: 0,
max: 0,
}
}
],
yAxis: {
type: 'value',
splitLine: {
show: false
},
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'
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
},
absoluteTime: 2 * 3600,
indexKmRangeMap: {}
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.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.selected.tripNumber': function (val) {
const 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.lineCode);
},
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);
}
}
},
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) {
let index = this.serviceNumberConfig.data.findIndex(elem => {
return elem.serviceNumber == val;
})
this.$refs.serviceTable.setCurrentRow(this.serviceNumberConfig.data[index]);
},
'$store.state.runPlan.selected.tripNumber': function (val) {
let index = this.tripNumberConfig.data.findIndex(elem => {
return elem.tripNumber == val;
})
this.$refs.tripTable.setCurrentRow(this.tripNumberConfig.data[index]);
tripNumberChange(row) {
if (row) {
this.$store.dispatch('runPlan/setSelected', { serviceNumber: this.$store.state.runPlan.selected.serviceNumber, tripNumber: row.tripNumber });
}
},
computed: {
...mapGetters('runPlan', [
'stations'
])
async analyticalServiceNumber(data) {
this.serviceNumberConfig.data = Object.keys(data || {})
.sort((a, b) => { return data[a].oldIndex - data[b].oldIndex; })
.map(serviceNumber => { return { serviceNumber }; });
},
mounted() {
this.PlanConvert = this.$theme.loadPlanConvert(this.skinCode);
async analyticalTripNumber(data) {
this.tripNumberConfig.data = Object.keys(data || {})
.sort((a, b) => { return data[a].oldIndex - data[b].oldIndex; })
.map(tripNumber => { return { tripNumber }; });
},
beforeDestroy() {
this.destroy();
async setPosition() {
this.$nextTick(() => {
let top = 3;
const width = this.maxWidth * 0.85;
let height = this.maxHeight;
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 (menuBar) {
top += (menuBar.offsetHeight || 0);
}
if (menuTool) {
top += (menuTool.offsetHeight || 0);
}
if (statusBar) {
height -= (statusBar.offsetHeight || 0);
}
height = height - top;
this.$store.dispatch('runPlan/resize', { width, height });
if (this.top != top) {
this.top = top;
}
if (this.height != height) {
this.height = height - 20 * 2;
}
});
},
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;
async loadChartPage() {
try {
let series = [];
const stations = this.$store.state.runPlan.stations;
const planData = this.$store.state.runPlan.planData;
let titleBar = document.getElementById('PlanTitleBar');
let menuBar = document.getElementById('PlanMenuBar');
let menuTool = document.getElementById('PlanMenuTool');
let statusBar = document.getElementById('PlanStatusBar');
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, { color: '#000', width: 0.5 }));
await this.loadInitData(series);
await this.analyticalServiceNumber(this.$store.state.runPlan.editData);
this.viewDisabled = false;
if (titleBar) {
top += (titleBar.offsetHeight || 0);
}
if (menuBar) {
top += (menuBar.offsetHeight || 0);
}
if (menuTool) {
top += (menuTool.offsetHeight || 0);
}
if (statusBar) {
height -= (statusBar.offsetHeight || 0);
}
height = height - top;
this.$store.dispatch('runPlan/resize', { width, height });
if (this.top != top) {
this.top = top;
}
if (this.height != height) {
this.height = height - 20 * 2;
}
})
},
async loadChartPage() {
try {
let series = [];
let stations = this.$store.state.runPlan.stations;
let planData = this.$store.state.runPlan.planData;
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, { color: '#000', 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);
}
})
}
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;
},
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();
let startValue = 3600 + that.PlanConvert.TranslationTime;
let 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);
} 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);
}
});
},
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);
}
let startValue = 3600 * 6;
let 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;
}
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() {
},
trainNumTouch() {
}
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 {
this.destroy();
let startValue = 3600 + this.PlanConvert.TranslationTime;
const offsetTime = 3600;
runDiagramGetTime(this.group).then(resp => {
startValue = resp.data - this.PlanConvert.TranslationTime;
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
this.option.series = series;
this.myChart = echarts.init(document.getElementById(this.runPlanId));
if (this.myChart) {
this.myChart.setOption(this.option);
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
this.myChart.on('click', this.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);
}
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;
}
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() {
}
}
};
</script>
<style scoped rel="stylesheet/scss" lang="scss" scoped>
<style scoped rel="stylesheet/scss" lang="scss">
@import "src/styles/mixin.scss";
#PlanSchedule {
@ -486,4 +478,4 @@
float: right;
}
}
</style>
</style>

View File

@ -1,8 +1,8 @@
<template>
<div class="plan-schedule" style="width: 100%">
<title-bar ref="titleBar" @back="back" />
<menu-bar ref="menuBar" :skin-code="skinCode" @dispatchDialog="dispatchDialog" />
<schedule ref="schedule" :group="group" :skin-code="skinCode" :max-height="height" :max-width="width" />
<menu-bar ref="menuBar" :line-code="lineCode" @dispatchDialog="dispatchDialog" />
<schedule ref="schedule" :group="group" :line-code="lineCode" :max-height="height" :max-width="width" />
<status-bar ref="statusBar" :max-top="height" @setPosition="setPosition" />
<manage-plan-list ref="managePlanList" @dispatchDialog="dispatchDialog" />
@ -29,65 +29,65 @@ import DeleteTask from '../menusPlan/deleteTask';
import ModifyingTask from '../menusPlan/modifyingTask';
export default {
name: 'Menus',
components: {
TitleBar,
MenuBar,
StatusBar,
Schedule,
ManagePlanList,
CreateWeekPlan,
CreateTodayPlan,
ModifyingPlan,
AddTask,
DeleteTask,
ModifyingTask
},
props: {
group: {
type: String,
required: true
}
},
data() {
return {
};
},
computed: {
skinCode() {
return this.$route.query.skinCode || '02';
},
width() {
return this.$store.state.app.width;
},
height() {
return this.$store.state.app.height;
}
},
methods: {
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');
}
}
name: 'Menus',
components: {
TitleBar,
MenuBar,
StatusBar,
Schedule,
ManagePlanList,
CreateWeekPlan,
CreateTodayPlan,
ModifyingPlan,
AddTask,
DeleteTask,
ModifyingTask
},
props: {
group: {
type: String,
required: true
}
},
data() {
return {
};
},
computed: {
lineCode() {
return this.$route.query.lineCode || '02';
},
width() {
return this.$store.state.app.width;
},
height() {
return this.$store.state.app.height;
}
},
methods: {
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>

View File

@ -125,7 +125,7 @@ import { EventBus } from '@/scripts/event-bus';
export default {
name: 'PlanMenuBar',
props: {
skinCode: {
lineCode: {
type: String,
required: true
}

View File

@ -27,6 +27,7 @@ import { mapGetters } from 'vuex';
import { timeFormat } from '@/utils/date';
import { runDiagramGetTime } from '@/api/simulation';
import DataTable from '../menusPlan/components/dataTable';
import echarts from 'echarts';
export default {
name: 'PlanSchedule',
@ -38,7 +39,7 @@ export default {
type: String,
required: true
},
skinCode: {
lineCode: {
type: String,
required: true
},
@ -237,7 +238,7 @@ export default {
}
},
mounted() {
this.PlanConvert = this.$theme.loadPlanConvert(this.skinCode);
this.PlanConvert = this.$theme.loadPlanConvert(this.lineCode);
},
beforeDestroy() {
this.destroy();
@ -358,42 +359,24 @@ export default {
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();
this.destroy();
let startValue = 3600 + that.PlanConvert.TranslationTime;
const offsetTime = 3600;
let startValue = 3600 + this.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);
runDiagramGetTime(this.group).then(resp => {
startValue = resp.data - this.PlanConvert.TranslationTime;
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
this.option.series = series;
this.myChart = echarts.init(document.getElementById(this.runPlanId));
if (this.myChart) {
this.myChart.setOption(this.option);
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
this.myChart.on('click', this.mouseClick);
}
);
});
resolve(true);
} catch (error) {
reject(error);
}
@ -476,7 +459,7 @@ export default {
}
};
</script>
<style scoped rel="stylesheet/scss" lang="scss" scoped>
<style scoped rel="stylesheet/scss" lang="scss">
@import "src/styles/mixin.scss";
#PlanSchedule {

View File

@ -1,8 +1,8 @@
<template>
<div class="plan-schedule" style="width: 100%">
<title-bar ref="titleBar" @back="back" />
<menu-bar ref="menuBar" :skin-code="skinCode" @dispatchDialog="dispatchDialog" />
<schedule ref="schedule" :skin-code="skinCode" :group="group" :max-height="height" :max-width="width" />
<menu-bar ref="menuBar" :line-code="lineCode" @dispatchDialog="dispatchDialog" />
<schedule ref="schedule" :line-code="lineCode" :group="group" :max-height="height" :max-width="width" />
<status-bar ref="statusBar" :max-top="height" @setPosition="setPosition" />
<manage-plan-list ref="managePlanList" @dispatchDialog="dispatchDialog" />
@ -54,8 +54,8 @@ export default {
};
},
computed: {
skinCode() {
return this.$route.query.skinCode || '02';
lineCode() {
return this.$route.query.lineCode || '02';
},
width() {
return this.$store.state.app.width;

View File

@ -123,236 +123,236 @@ import { mapGetters } from 'vuex';
import { EventBus } from '@/scripts/event-bus';
export default {
name: 'PlanMenuBar',
props: {
skinCode: {
type: String,
required: true
}
},
data() {
return {
classA: -1,
classB: -1,
tempClassA: -1,
tempClassB: -1,
menu: [
{
title: this.$t('menu.file'),
children: [
]
},
{
title: this.$t('menu.view'),
children: [
// {
// title: '',
// },
// {
// title: '',
// },
// {
// title: ''
// }
]
},
{
title: this.$t('menu.edit'),
children: [
// {
// title: '',
// click: this.handleEditPlanningTrain
// },
// {
// title: '',
// click: this.handleAddTask
// },
// {
// title: '',
// click: this.handleDeleteTask
// },
// {
// title: '',
// click: this.handleModifyingPlanId
// },
// {
// title: '',
// click: this.handleTranslationalMulTrain
// }
]
},
{
title: this.$t('menu.tool'),
children: [
{
title: this.$t('menu.viewPlanList'),
click: this.handleViewPlanSchedule,
width: 150
},
{
title: this.$t('menu.createAWeekPlan'),
click: this.handleCreateWeekPlan,
width: 150
},
{
title: this.$t('menu.loadTheDayPlan'),
click: this.handleReloadTodayPlan,
width: 150
}
// {
// title: '',
// click: this.handleValidityCheck
// }
]
},
{
title: this.$t('menu.help'),
children: [
]
}
]
};
},
computed: {
...mapGetters('training', [
'mode'
]),
...mapGetters('map', [
'stationList'
])
},
watch: {
tempClassA() {
this.classA = this.$store.state.menuOperation.break ? -1 : this.tempClassA;
},
tempClassB() {
this.classB = this.$store.state.menuOperation.break ? -1 : this.tempClassB;
},
'$store.state.menuOperation.break': function (val) {
if (val) {
this.classA = this.classB = -1;
} else {
this.classA = this.tempClassA;
this.classB = this.tempClassB;
}
}
},
mounted() {
this.initMenu();
},
methods: {
initMenu() {
this.clickEvent();
this.closeMenu();
},
clickEvent() {
const self = this;
window.onclick = function (e) {
self.closeMenu(false);
};
},
noShowingChildren(children) {
if (!children || children.length <= 0) {
return true;
}
return false;
},
hasShowingChildren(children) {
if (children && children.length > 0) {
return true;
}
return false;
},
closeMenu() {
this.classA = this.tempClassA = -1;
this.classB = this.tempClassB = -1;
},
hookClick(item, event) {
this.closeMenu();
// launchFullscreen();
setTimeout(() => {
if (item && typeof item.click == 'function') {
item.click();
}
}, 500);
},
popupMenuA(item, index) {
this.clickEvent();
this.tempClassA = index;
this.tempClassB = -1;
},
popupMenuB(item, index) {
this.tempClassB = index;
},
openLoadFile(item) {
const obj = this.$refs[item.title][0];
if (obj.files) {
const file = obj.files[0];
item.click(file);
obj.value = '';
}
},
doClose() {
this.$nextTick(() => {
EventBus.$emit('closeMenu');
});
},
//
refresh() {
this.closeMenu(true);
EventBus.$emit('refresh');
},
undeveloped() {
this.doClose();
this.$alert(this.$t('menu.achieving'), this.$t('tip.hint'), {
confirmButtonText: this.$t('tip.confirm'),
callback: action => {
}
});
},
//
handleEditPlanningTrain() {
this.$emit('dispatchDialog', { name: 'modifyingPlan' });
},
//
handleAddTask() {
const params = this.$store.state.runPlan.selected;
this.$emit('dispatchDialog', { name: 'addTask', params });
},
//
handleDeleteTask() {
const params = this.$store.state.runPlan.selected;
this.$emit('dispatchDialog', { name: 'deleteTask', params });
},
//
handleModifyingTask() {
const params = this.$store.state.runPlan.selected;
this.$emit('dispatchDialog', { name: 'modifyingTask', params });
},
//
handleModifyingPlanId() {
this.$emit('dispatchDialog', { name: 'modifyingPlanId' });
},
//
handleTranslationalMulTrain() {
this.$emit('dispatchDialog', { name: 'translationalMulTrain' });
},
//
handleViewPlanSchedule() {
this.$emit('dispatchDialog', { name: 'managePlanList' });
},
//
handleCreateWeekPlan() {
this.$emit('dispatchDialog', { name: 'createWeekPlan' });
},
//
handleReloadTodayPlan() {
this.$emit('dispatchDialog', { name: 'createTodayPlan' });
},
//
handleValidityCheck() {
}
}
name: 'PlanMenuBar',
props: {
lineCode: {
type: String,
required: true
}
},
data() {
return {
classA: -1,
classB: -1,
tempClassA: -1,
tempClassB: -1,
menu: [
{
title: this.$t('menu.file'),
children: [
]
},
{
title: this.$t('menu.view'),
children: [
// {
// title: '',
// },
// {
// title: '',
// },
// {
// title: ''
// }
]
},
{
title: this.$t('menu.edit'),
children: [
// {
// title: '',
// click: this.handleEditPlanningTrain
// },
// {
// title: '',
// click: this.handleAddTask
// },
// {
// title: '',
// click: this.handleDeleteTask
// },
// {
// title: '',
// click: this.handleModifyingPlanId
// },
// {
// title: '',
// click: this.handleTranslationalMulTrain
// }
]
},
{
title: this.$t('menu.tool'),
children: [
{
title: this.$t('menu.viewPlanList'),
click: this.handleViewPlanSchedule,
width: 150
},
{
title: this.$t('menu.createAWeekPlan'),
click: this.handleCreateWeekPlan,
width: 150
},
{
title: this.$t('menu.loadTheDayPlan'),
click: this.handleReloadTodayPlan,
width: 150
}
// {
// title: '',
// click: this.handleValidityCheck
// }
]
},
{
title: this.$t('menu.help'),
children: [
]
}
]
};
},
computed: {
...mapGetters('training', [
'mode'
]),
...mapGetters('map', [
'stationList'
])
},
watch: {
tempClassA() {
this.classA = this.$store.state.menuOperation.break ? -1 : this.tempClassA;
},
tempClassB() {
this.classB = this.$store.state.menuOperation.break ? -1 : this.tempClassB;
},
'$store.state.menuOperation.break': function (val) {
if (val) {
this.classA = this.classB = -1;
} else {
this.classA = this.tempClassA;
this.classB = this.tempClassB;
}
}
},
mounted() {
this.initMenu();
},
methods: {
initMenu() {
this.clickEvent();
this.closeMenu();
},
clickEvent() {
const self = this;
window.onclick = function (e) {
self.closeMenu(false);
};
},
noShowingChildren(children) {
if (!children || children.length <= 0) {
return true;
}
return false;
},
hasShowingChildren(children) {
if (children && children.length > 0) {
return true;
}
return false;
},
closeMenu() {
this.classA = this.tempClassA = -1;
this.classB = this.tempClassB = -1;
},
hookClick(item, event) {
this.closeMenu();
// launchFullscreen();
setTimeout(() => {
if (item && typeof item.click == 'function') {
item.click();
}
}, 500);
},
popupMenuA(item, index) {
this.clickEvent();
this.tempClassA = index;
this.tempClassB = -1;
},
popupMenuB(item, index) {
this.tempClassB = index;
},
openLoadFile(item) {
const obj = this.$refs[item.title][0];
if (obj.files) {
const file = obj.files[0];
item.click(file);
obj.value = '';
}
},
doClose() {
this.$nextTick(() => {
EventBus.$emit('closeMenu');
});
},
//
refresh() {
this.closeMenu(true);
EventBus.$emit('refresh');
},
undeveloped() {
this.doClose();
this.$alert(this.$t('menu.achieving'), this.$t('tip.hint'), {
confirmButtonText: this.$t('tip.confirm'),
callback: action => {
}
});
},
//
handleEditPlanningTrain() {
this.$emit('dispatchDialog', { name: 'modifyingPlan' });
},
//
handleAddTask() {
const params = this.$store.state.runPlan.selected;
this.$emit('dispatchDialog', { name: 'addTask', params });
},
//
handleDeleteTask() {
const params = this.$store.state.runPlan.selected;
this.$emit('dispatchDialog', { name: 'deleteTask', params });
},
//
handleModifyingTask() {
const params = this.$store.state.runPlan.selected;
this.$emit('dispatchDialog', { name: 'modifyingTask', params });
},
//
handleModifyingPlanId() {
this.$emit('dispatchDialog', { name: 'modifyingPlanId' });
},
//
handleTranslationalMulTrain() {
this.$emit('dispatchDialog', { name: 'translationalMulTrain' });
},
//
handleViewPlanSchedule() {
this.$emit('dispatchDialog', { name: 'managePlanList' });
},
//
handleCreateWeekPlan() {
this.$emit('dispatchDialog', { name: 'createWeekPlan' });
},
//
handleReloadTodayPlan() {
this.$emit('dispatchDialog', { name: 'createTodayPlan' });
},
//
handleValidityCheck() {
}
}
};
</script>

View File

@ -27,453 +27,436 @@ import { mapGetters } from 'vuex';
import { timeFormat } from '@/utils/date';
import { runDiagramGetTime } from '@/api/simulation';
import DataTable from '../menusPlan/components/dataTable';
import echarts from 'echarts';
export default {
name: 'PlanSchedule',
components: {
DataTable
},
props: {
group: {
type: String,
required: true
},
skinCode: {
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: this.$t('menu.serviceNumber')
},
{
width: 40
}
]
},
tripNumberConfig: {
data: [],
highlightCurrentRow: true,
handleChange: this.tripNumberChange,
showClose: false,
columns: [
{
prop: 'tripNumber',
label: this.$t('menu.tripNumber')
},
{
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;
});
name: 'PlanSchedule',
components: {
DataTable
},
props: {
group: {
type: String,
required: true
},
lineCode: {
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: this.$t('menu.serviceNumber')
},
{
width: 40
}
]
},
tripNumberConfig: {
data: [],
highlightCurrentRow: true,
handleChange: this.tripNumberChange,
showClose: false,
columns: [
{
prop: 'tripNumber',
label: this.$t('menu.tripNumber')
},
{
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.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.skinCode);
},
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;
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.lineCode);
},
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;
const titleBar = document.getElementById('PlanTitleBar');
const menuBar = document.getElementById('PlanMenuBar');
const menuTool = document.getElementById('PlanMenuTool');
const 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 = [];
const planData = this.$store.state.runPlan.planData || [];
const 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(this.$t('error.loadingOperationGraphFailed'));
}
},
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(this.$t('error.loadingOperationGraphFailed'));
}
},
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 => {
const 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 {
const 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 {
this.destroy();
let startValue = 3600 + that.PlanConvert.TranslationTime;
const offsetTime = 3600;
let startValue = 3600 + this.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() {
const list = [];
for (var time = 0 + this.PlanConvert.TranslationTime; time < 3600 * 24 + this.PlanConvert.TranslationTime; time++) {
list.push(time);
}
runDiagramGetTime(this.group).then(resp => {
startValue = resp.data - this.PlanConvert.TranslationTime;
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
this.option.series = series;
this.myChart = echarts.init(document.getElementById(this.runPlanId));
if (this.myChart) {
this.myChart.setOption(this.option);
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
this.myChart.on('click', this.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);
}
const startValue = 3600 * 6;
const 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) {
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">`,
`${this.$t('menu.stationName') + station.name}<br>`,
`${this.$t('menu.stationKilometerMark') + station.kmRange} km <br>`,
`${this.$t('menu.arrivalTime2') + 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() {
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">`,
`${this.$t('menu.stationName') + station.name}<br>`,
`${this.$t('menu.stationKilometerMark') + station.kmRange} km <br>`,
`${this.$t('menu.arrivalTime2') + 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">

View File

@ -82,68 +82,68 @@ import QuickEntry from './Entry';
import SystemTitle from './Title';
export default {
components: {
UserLogout,
QuickEntry,
SystemTitle
},
data() {
return {
routes: [],
isShow: false,
activePath: ''
};
},
computed: {
...mapGetters([
'avatar',
'routers'
])
},
mounted() {
this.routes = this.$router.options.routes;
if (this.$route.fullPath.indexOf('design/userlist')>=0) {
this.activePath='/design/userlist/home';
} else if (this.$route.fullPath.includes('design/lesson') || this.$route.fullPath.includes('design/script') || this.$route.fullPath.includes('design/runPlan') || this.$route.fullPath.includes('design/mapPreview')) {
this.activePath='/design/home';
} else {
this.activePath=this.$route.path;
}
},
methods: {
toggleSideBar() {
this.$store.dispatch('ToggleSideBar');
},
hasOneShowingChildren(children) {
const showingChildren = children.filter(item => {
if (!item.hidden && !item.target) { return item; }
});
if (showingChildren.length === 1) {
return true;
}
return false;
},
hasOneScreenShowingChildren(children) {
const showingChildren = children.filter(item => {
if (!item.hidden && item.target) {
return item;
}
});
if (showingChildren.length === 1) {
return true;
}
return false;
},
hasShowingChildren(children) {
const showingChildren = children.filter(item => {
return !item.hidden;
});
if (showingChildren.length >= 1) {
return true;
}
return false;
}
}
components: {
UserLogout,
QuickEntry,
SystemTitle
},
data() {
return {
routes: [],
isShow: false,
activePath: ''
};
},
computed: {
...mapGetters([
'avatar',
'routers'
])
},
mounted() {
this.routes = this.$router.options.routes;
if (this.$route.fullPath.indexOf('design/userlist') >= 0) {
this.activePath = '/design/userlist/home';
} else if (this.$route.fullPath.includes('design/lesson') || this.$route.fullPath.includes('design/script') || this.$route.fullPath.includes('design/runPlan') || this.$route.fullPath.includes('design/mapPreview')) {
this.activePath = '/design/home';
} else {
this.activePath = this.$route.path;
}
},
methods: {
toggleSideBar() {
this.$store.dispatch('ToggleSideBar');
},
hasOneShowingChildren(children) {
const showingChildren = children.filter(item => {
if (!item.hidden && !item.target) { return item; }
});
if (showingChildren.length === 1) {
return true;
}
return false;
},
hasOneScreenShowingChildren(children) {
const showingChildren = children.filter(item => {
if (!item.hidden && item.target) {
return item;
}
});
if (showingChildren.length === 1) {
return true;
}
return false;
},
hasShowingChildren(children) {
const showingChildren = children.filter(item => {
return !item.hidden;
});
if (showingChildren.length >= 1) {
return true;
}
return false;
}
}
};
</script>

View File

@ -3,6 +3,7 @@ import Vue from 'vue';
import 'normalize.css/normalize.css'; // A modern alternative to CSS resets
import ElementUI from 'element-ui';
// import ELEMENT from 'element-ui';
import ElementLocale from 'element-ui/lib/locale';
import 'element-ui/lib/theme-chalk/index.css';

View File

@ -127,6 +127,14 @@ router.beforeEach((to, from, next) => {
}
});
NProgress.configure({
easing: 'ease', // 动画方式
speed: 500, // 递增进度条的速度
showSpinner: false, // 是否显示加载ico
trickleSpeed: 200, // 自动递增间隔
minimum: 0.3 // 初始化时的最小百分比
});
router.afterEach(() => {
// 结束Progress
NProgress.done();

View File

@ -4,101 +4,101 @@ import Router from 'vue-router';
Vue.use(Router);
/* Layout */
import Layout from '@/layout';
import Login from '@/views/login/index';
const Layout = () => import('@/layout');
const Login = () => import('@/views/login/index');
import Jlmap3dedit from '@/views/jlmap3d/edit/jlmap3dedit';
import Jlmap3d from '@/views/jlmap3d/drive/jl3ddrive';
import Display from '@/views/display/index';
import DesignDisplay from '@/views/display/designIndex';
const Jlmap3dedit = () => import('@/views/jlmap3d/edit/jlmap3dedit');
const Jlmap3d = () => import('@/views/jlmap3d/drive/jl3ddrive');
const Display = () => import('@/views/display/index');
const DesignDisplay = () => import('@/views/display/designIndex');
import TrainRoom from '@/views/trainRoom/index';
import JointTraining from '@/views/jointTraining/index';
const TrainRoom = () => import('@/views/trainRoom/index');
const JointTraining = () => import('@/views/jointTraining/index');
import Error401 from '@/views/error-page/401';
import Errpr404 from '@/views/error-page/404';
const Error401 = () => import('@/views/error-page/401');
const Errpr404 = () => import('@/views/error-page/404');
import MapProduct from '@/views/system/product/index';
import Dictionary from '@/views/system/dictionary/index';
import DictionaryDetail from '@/views/system/dictionaryDetail/index';
import UserControl from '@/views/system/userControl/index';
import UserTraining from '@/views/system/userTraining/index';
import UserExam from '@/views/system/userExam/index';
import UserSimulation from '@/views/system/userSimulation/index';
import ExistingSimulation from '@/views/system/existingSimulation/index';
import CacheControl from '@/views/system/cacheControl/index';
import SystemGenerate from '@/views/system/systemGenerate/index';
import IbpDraw from '@/views/system/ibpDraw/index';
const MapProduct = () => import('@/views/system/product/index');
const Dictionary = () => import('@/views/system/dictionary/index');
const DictionaryDetail = () => import('@/views/system/dictionaryDetail/index');
const UserControl = () => import('@/views/system/userControl/index');
const UserTraining = () => import('@/views/system/userTraining/index');
const UserExam = () => import('@/views/system/userExam/index');
const UserSimulation = () => import('@/views/system/userSimulation/index');
const ExistingSimulation = () => import('@/views/system/existingSimulation/index');
const CacheControl = () => import('@/views/system/cacheControl/index');
const SystemGenerate = () => import('@/views/system/systemGenerate/index');
const IbpDraw = () => import('@/views/system/ibpDraw/index');
import Mapedit from '@/views/mapdraft/index';
const Mapedit = () => import('@/views/mapdraft/index');
import Taskmanage from '@/views/lesson/taskmanage/list';
import TrainingRuleList from '@/views/lesson/trainingRule/list';
import TrainingRuleEdit from '@/views/lesson/trainingRule/detail/index';
import Trainingmanage from '@/views/lesson/trainingmanage/index';
import LessonEdit from '@/views/lesson/lessoncategory/index';
import LessonHome from '@/views/lesson/home';
import LessonDetail from '@/views/lesson/details';
const Taskmanage = () => import('@/views/lesson/taskmanage/list');
const TrainingRuleList = () => import('@/views/lesson/trainingRule/list');
const TrainingRuleEdit = () => import('@/views/lesson/trainingRule/detail/index');
const Trainingmanage = () => import('@/views/lesson/trainingmanage/index');
const LessonEdit = () => import('@/views/lesson/lessoncategory/index');
const LessonHome = () => import('@/views/lesson/home');
const LessonDetail = () => import('@/views/lesson/details');
import ScriptmanageHome from '@/views/scriptManage/home';
import ScriptDisplay from '@/views/scriptManage/display/index';
const ScriptmanageHome = () => import('@/views/scriptManage/home');
const ScriptDisplay = () => import('@/views/scriptManage/display/index');
import TeachDetail from '@/views/teach/detail/index';
import TeachHome from '@/views/teach/index';
import Pay from '@/views/components/pay/index';
const TeachDetail = () => import('@/views/teach/detail/index');
const TeachHome = () => import('@/views/teach/index');
const Pay = () => import('@/views/components/pay/index');
import ExamHome from '@/views/exam/index';
import ExamResult from '@/views/exam/result';
import ExamDetail from '@/views/exam/detail/examDetail';
import ExamCourseDetail from '@/views/exam/detail/courseDetail';
const ExamHome = () => import('@/views/exam/index');
const ExamResult = () => import('@/views/exam/result');
const ExamDetail = () => import('@/views/exam/detail/examDetail');
const ExamCourseDetail = () => import('@/views/exam/detail/courseDetail');
import DemonstrationDetail from '@/views/demonstration/detail/index';
const DemonstrationDetail = () => import('@/views/demonstration/detail/index');
import PlanMonitorEditTool from '@/views/planMonitor/editTool/index';
import PlanMonitorEditUserTool from '@/views/planMonitor/editTool/userindex';
import PlanMonitorDetail from '@/views/planMonitor/detail';
const PlanMonitorEditTool = () => import('@/views/planMonitor/editTool/index');
const PlanMonitorEditUserTool = () => import('@/views/planMonitor/editTool/userindex');
const PlanMonitorDetail = () => import('@/views/planMonitor/detail');
import DesignPlatformHome from '@/views/designPlatform/home';
import DesignPlatform from '@/views/designPlatform/index';
import MapPreview from '@/views/designPlatform/mapPreview';
const DesignPlatformHome = () => import('@/views/designPlatform/home');
const DesignPlatform = () => import('@/views/designPlatform/index');
const MapPreview = () => import('@/views/designPlatform/mapPreview');
import DesignPlatformUser from '@/views/designUser/index';
const DesignPlatformUser = () => import('@/views/designUser/index');
import Package from '@/views/package/index';
import PackageDraft from '@/views/package/draft/ruleForm';
import PackageDetail from '@/views/package/detail';
const Package = () => import('@/views/package/index');
const PackageDraft = () => import('@/views/package/draft/ruleForm');
const PackageDetail = () => import('@/views/package/detail');
import PublishMap from '@/views/publish/publishMap/index';
import PublishMapDetail from '@/views/publish/publishMap/list'; // 发布历史
import ProductStatus from '@/views/publish/productStatus/index';
import PublishLesson from '@/views/publish/publishLesson/index';
import RunPlanTemplate from '@/views/publish/runPlanTemplate/index';
import RunPlanCommon from '@/views/publish/runPlanCommon/index';
import RunPlanCommonDraft from '@/views/publish/runPlanCommon/draft';
import RunPlanEveryDay from '@/views/publish/runPlanEveryDay/index';
import RunplanView from '@/views/publish/runPlanEveryDay/runPlanView';
import PublishExamRule from '@/views/publish/examRule/index';
import PublishExamRuleDraft from '@/views/publish/examRule/draft/index';
const PublishMap = () => import('@/views/publish/publishMap/index');
const PublishMapDetail = () => import('@/views/publish/publishMap/list'); // 发布历史
const ProductStatus = () => import('@/views/publish/productStatus/index');
const PublishLesson = () => import('@/views/publish/publishLesson/index');
const RunPlanTemplate = () => import('@/views/publish/runPlanTemplate/index');
const RunPlanCommon = () => import('@/views/publish/runPlanCommon/index');
const RunPlanCommonDraft = () => import('@/views/publish/runPlanCommon/draft');
const RunPlanEveryDay = () => import('@/views/publish/runPlanEveryDay/index');
const RunplanView = () => import('@/views/publish/runPlanEveryDay/runPlanView');
const PublishExamRule = () => import('@/views/publish/examRule/index');
const PublishExamRuleDraft = () => import('@/views/publish/examRule/draft/index');
import TrainingPlatform from '@/views/trainingPlatform/index';
const TrainingPlatform = () => import('@/views/trainingPlatform/index');
import Commodity from '@/views/orderauthor/commodity/index';
import CommodityDraft from '@/views/orderauthor/commodity/draft';
import OrderList from '@/views/orderauthor/order/list';
import OrderDraft from '@/views/orderauthor/order/draft';
import Author from '@/views/orderauthor/author/index';
import AuthorDraft from '@/views/orderauthor/author/draft/ruleForm';
import Permission from '@/views/orderauthor/permission/index';
import PermissionDetail from '@/views/orderauthor/permission/detail';
import PermissionDraft from '@/views/orderauthor/permission/package/ruleForm';
import PermissionCreate from '@/views/orderauthor/permission/create/index';
import UserRules from '@/views/orderauthor/rules/index';
import UserRulesDetail from '@/views/orderauthor/rules/detail';
const Commodity = () => import('@/views/orderauthor/commodity/index');
const CommodityDraft = () => import('@/views/orderauthor/commodity/draft');
const OrderList = () => import('@/views/orderauthor/order/list');
const OrderDraft = () => import('@/views/orderauthor/order/draft');
const Author = () => import('@/views/orderauthor/author/index');
const AuthorDraft = () => import('@/views/orderauthor/author/draft/ruleForm');
const Permission = () => import('@/views/orderauthor/permission/index');
const PermissionDetail = () => import('@/views/orderauthor/permission/detail');
const PermissionDraft = () => import('@/views/orderauthor/permission/package/ruleForm');
const PermissionCreate = () => import('@/views/orderauthor/permission/create/index');
const UserRules = () => import('@/views/orderauthor/rules/index');
const UserRulesDetail = () => import('@/views/orderauthor/rules/detail');
import LessonApproval from '@/views/approval/lesson/index';
import ScriptApproval from '@/views/approval/script/index';
import RunPlanApproval from '@/views/approval/runPlan/index';
import News from '@/views/news/index';
const LessonApproval = () => import('@/views/approval/lesson/index');
const ScriptApproval = () => import('@/views/approval/script/index');
const RunPlanApproval = () => import('@/views/approval/runPlan/index');
const News = () => import('@/views/news/index');
import { loginTitle } from '@/scripts/ConstDic';
import { getSessionStorage } from '@/utils/auth';

View File

@ -7,169 +7,169 @@ import echarts from 'echarts';
import { getRelevanceMapList, getSimulationPrdList } from '@/api/statistics';
export default {
props: {
id: {
type: String,
default: 'chart'
},
size: {
type: Object,
required: true
}
},
data() {
return {
option: {
backgroundColor: '#F0F2F5',
title: {
top: 20,
text: this.$t('dashboard.simulationStatistics'),
textStyle: {
fontWeight: 'normal',
fontSize: 18,
color: '#000000'
},
left: 'center'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
lineStyle: {
color: '#57617B'
}
}
},
legend: {
top: 20,
orient: 'vertical',
icon: 'rect',
itemWidth: 14,
itemHeight: 5,
itemGap: 13,
data: [],
right: '4%',
textStyle: {
fontSize: 12,
color: '#C0C0C0'
}
},
grid: {
top: 100,
left: '2%',
right: '2%',
bottom: '2%',
containLabel: true
},
xAxis: [{
type: 'category',
boundaryGap: true,
axisLine: {
lineStyle: {
color: '#57617B'
}
},
data: []
}],
yAxis: [{
type: 'value',
name: '(s)',
axisTick: {
show: false
},
axisLine: {
lineStyle: {
color: '#57617B'
}
},
axisLabel: {
margin: 10,
textStyle: {
fontSize: 14
}
},
splitLine: {
lineStyle: {
color: '#57617B'
}
}
}],
series: []
},
chart: null
};
},
watch: {
size() {
return this.chart.resize({...this.size, silent: false});
}
},
async created() {
await this.loadExamData();
},
mounted() {
this.initChart();
},
beforeDestroy() {
if (!this.chart) {
return;
}
this.chart.dispose();
this.chart = null;
},
methods: {
initChart() {
this.chart = echarts.init(document.getElementById(this.id));
this.chart.setOption(this.option);
},
async loadExamData() {
const data = [];
const resp = await getRelevanceMapList();
if (resp) {
const info = resp.data || [];
for (var i = 0; i < info.length; i++) {
const item = { ...info[i], data: []};
const rest = await getSimulationPrdList(info[i].id);
if (rest) {
item.data = rest.data || [];
}
data.push(item);
}
}
props: {
id: {
type: String,
default: 'chart'
},
size: {
type: Object,
required: true
}
},
data() {
return {
option: {
backgroundColor: '#F0F2F5',
title: {
top: 20,
text: this.$t('dashboard.simulationStatistics'),
textStyle: {
fontWeight: 'normal',
fontSize: 18,
color: '#000000'
},
left: 'center'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
lineStyle: {
color: '#57617B'
}
}
},
legend: {
top: 20,
orient: 'vertical',
icon: 'rect',
itemWidth: 14,
itemHeight: 5,
itemGap: 13,
data: [],
right: '4%',
textStyle: {
fontSize: 12,
color: '#C0C0C0'
}
},
grid: {
top: 100,
left: '2%',
right: '2%',
bottom: '2%',
containLabel: true
},
xAxis: [{
type: 'category',
boundaryGap: true,
axisLine: {
lineStyle: {
color: '#57617B'
}
},
data: []
}],
yAxis: [{
type: 'value',
name: '(s)',
axisTick: {
show: false
},
axisLine: {
lineStyle: {
color: '#57617B'
}
},
axisLabel: {
margin: 10,
textStyle: {
fontSize: 14
}
},
splitLine: {
lineStyle: {
color: '#57617B'
}
}
}],
series: []
},
chart: null
};
},
watch: {
size() {
return this.chart.resize({...this.size, silent: false});
}
},
async created() {
await this.loadExamData();
},
mounted() {
this.initChart();
},
beforeDestroy() {
if (!this.chart) {
return;
}
this.chart.dispose();
this.chart = null;
},
methods: {
initChart() {
this.chart = echarts.init(document.getElementById(this.id));
this.chart.setOption(this.option);
},
async loadExamData() {
const data = [];
const resp = await getRelevanceMapList();
if (resp) {
const info = resp.data || [];
for (var i = 0; i < info.length; i++) {
const item = { ...info[i], data: []};
const rest = await getSimulationPrdList(info[i].id);
if (rest) {
item.data = rest.data || [];
}
data.push(item);
}
}
this.option.series = [];
this.option.legend.data = [];
this.option.xAxis[0].data = [this.$t('dashboard.comprehensiveExerciseCloudPlatform'),
this.option.series = [];
this.option.legend.data = [];
this.option.xAxis[0].data = [this.$t('dashboard.comprehensiveExerciseCloudPlatform'),
this.$t('dashboard.driverSimulatedDrivingSystem'), this.$t('dashboard.ATSLineAdjustmentWorkstation'), this.$t('dashboard.ATSLocalWorkstation')];
data.forEach(elem => {
this.option.legend.data.push(elem.name);
this.option.series.push({
name: elem.name,
type: 'bar',
smooth: true,
symbol: 'circle',
symbolSize: 5,
showSymbol: false,
lineStyle: {
normal: {
width: 1
}
},
data: [0, 0, 0, 0]
});
});
data.forEach(elem => {
this.option.legend.data.push(elem.name);
this.option.series.push({
name: elem.name,
type: 'bar',
smooth: true,
symbol: 'circle',
symbolSize: 5,
showSymbol: false,
lineStyle: {
normal: {
width: 1
}
},
data: [0, 0, 0, 0]
});
});
data.forEach((elem, i) => {
elem.data.forEach(item => {
const index = this.option.xAxis[0].data.findIndex(name => { return name == item.statsProjectName; });
if (index >= 0) {
this.option.series[i].data[index] = item.duration;
}
});
});
data.forEach((elem, i) => {
elem.data.forEach(item => {
const index = this.option.xAxis[0].data.findIndex(name => { return name == item.statsProjectName; });
if (index >= 0) {
this.option.series[i].data[index] = item.duration;
}
});
});
this.chart.setOption(this.option);
}
}
this.chart.setOption(this.option);
}
}
};
</script>

View File

@ -14,171 +14,171 @@ import echarts from 'echarts';
import { getExamTree, getstatsExamList, getExamChart } from '@/api/statistics';
export default {
props: {
id: {
type: String,
default: 'chart'
},
size: {
type: Object,
required: true
}
},
data() {
return {
lessonId: '',
lessonList: [],
option: {
backgroundColor: '#F0F2F5',
title: {
top: 20,
text: this.$t('dashboard.testStatistics'),
textStyle: {
fontWeight: 'normal',
fontSize: 18,
color: '#000000'
},
left: 'center'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
lineStyle: {
color: '#57617B'
}
}
},
legend: {
top: 20,
orient: 'vertical',
icon: 'rect',
itemWidth: 14,
itemHeight: 5,
itemGap: 13,
data: [],
right: '4%',
textStyle: {
fontSize: 12,
color: '#C0C0C0'
}
},
grid: {
top: 100,
left: '2%',
right: '2%',
bottom: '2%',
containLabel: true
},
xAxis: [{
type: 'category',
boundaryGap: true,
axisLine: {
lineStyle: {
color: '#57617B'
}
},
data: []
}],
yAxis: [{
type: 'value',
name: '(score)',
axisTick: {
show: false
},
axisLine: {
lineStyle: {
color: '#57617B'
}
},
axisLabel: {
margin: 10,
textStyle: {
fontSize: 14
}
},
splitLine: {
lineStyle: {
color: '#57617B'
}
}
}],
series: []
},
chart: null
};
},
watch: {
size() {
return this.chart.resize({...this.size, silent: false});
},
async lessonId(val) {
await this.loadExamData(val);
}
},
mounted() {
this.initChart();
},
beforeDestroy() {
if (!this.chart) {
return;
}
this.chart.dispose();
this.chart = null;
},
methods: {
initChart() {
getExamTree().then(resp => {
this.lessonList = resp.data || [];
this.$nextTick(() => {
if (this.lessonList[0]) {
this.lessonId = this.lessonList[0].statsProjectId;
}
});
});
this.chart = echarts.init(document.getElementById(this.id));
this.chart.setOption(this.option);
},
async loadExamData(lessonId) {
const serieName = (this.lessonList[this.lessonList.findIndex(elem => { return elem.statsProjectId == lessonId; })] || {}).statsProjectName || '';
this.option.series = [];
this.option.xAxis[0].data = [];
this.option.legend.data = [serieName];
this.option.series = [{
name: serieName,
type: 'bar',
smooth: true,
symbol: 'circle',
symbolSize: 5,
showSymbol: false,
lineStyle: {
normal: {
width: 1
}
},
data: []
}];
props: {
id: {
type: String,
default: 'chart'
},
size: {
type: Object,
required: true
}
},
data() {
return {
lessonId: '',
lessonList: [],
option: {
backgroundColor: '#F0F2F5',
title: {
top: 20,
text: this.$t('dashboard.testStatistics'),
textStyle: {
fontWeight: 'normal',
fontSize: 18,
color: '#000000'
},
left: 'center'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
lineStyle: {
color: '#57617B'
}
}
},
legend: {
top: 20,
orient: 'vertical',
icon: 'rect',
itemWidth: 14,
itemHeight: 5,
itemGap: 13,
data: [],
right: '4%',
textStyle: {
fontSize: 12,
color: '#C0C0C0'
}
},
grid: {
top: 100,
left: '2%',
right: '2%',
bottom: '2%',
containLabel: true
},
xAxis: [{
type: 'category',
boundaryGap: true,
axisLine: {
lineStyle: {
color: '#57617B'
}
},
data: []
}],
yAxis: [{
type: 'value',
name: '(score)',
axisTick: {
show: false
},
axisLine: {
lineStyle: {
color: '#57617B'
}
},
axisLabel: {
margin: 10,
textStyle: {
fontSize: 14
}
},
splitLine: {
lineStyle: {
color: '#57617B'
}
}
}],
series: []
},
chart: null
};
},
watch: {
size() {
return this.chart.resize({...this.size, silent: false});
},
async lessonId(val) {
await this.loadExamData(val);
}
},
mounted() {
this.initChart();
},
beforeDestroy() {
if (!this.chart) {
return;
}
this.chart.dispose();
this.chart = null;
},
methods: {
initChart() {
getExamTree().then(resp => {
this.lessonList = resp.data || [];
this.$nextTick(() => {
if (this.lessonList[0]) {
this.lessonId = this.lessonList[0].statsProjectId;
}
});
});
this.chart = echarts.init(document.getElementById(this.id));
this.chart.setOption(this.option);
},
async loadExamData(lessonId) {
const serieName = (this.lessonList[this.lessonList.findIndex(elem => { return elem.statsProjectId == lessonId; })] || {}).statsProjectName || '';
this.option.series = [];
this.option.xAxis[0].data = [];
this.option.legend.data = [serieName];
this.option.series = [{
name: serieName,
type: 'bar',
smooth: true,
symbol: 'circle',
symbolSize: 5,
showSymbol: false,
lineStyle: {
normal: {
width: 1
}
},
data: []
}];
if (lessonId) {
const resp = await getstatsExamList({lessonId});
if (resp) {
const info = resp.data || [];
for (var i = 0; i < info.length; i++) {
var scores = [];
const exam = info[i];
this.option.xAxis[0].data.push(exam.statsProjectName);
const rest = await getExamChart({examId: exam.statsProjectId});
if (rest) {
scores = (rest.data || []).map(elem => { return elem.score; });
}
this.option.series[0].data = scores;
}
}
}
if (lessonId) {
const resp = await getstatsExamList({lessonId});
if (resp) {
const info = resp.data || [];
for (var i = 0; i < info.length; i++) {
var scores = [];
const exam = info[i];
this.option.xAxis[0].data.push(exam.statsProjectName);
const rest = await getExamChart({examId: exam.statsProjectId});
if (rest) {
scores = (rest.data || []).map(elem => { return elem.score; });
}
this.option.series[0].data = scores;
}
}
}
this.chart.setOption(this.option);
}
}
this.chart.setOption(this.option);
}
}
};
</script>
<style scoped>

View File

@ -7,169 +7,169 @@ import echarts from 'echarts';
import { getLessonList, getLessonTimeChart } from '@/api/statistics';
export default {
props: {
id: {
type: String,
default: 'chart'
},
size: {
type: Object,
required: true
}
},
data() {
return {
option: {
backgroundColor: '#F0F2F5',
title: {
top: 20,
text: this.$t('dashboard.courseStatistics'),
textStyle: {
fontWeight: 'normal',
fontSize: 18,
color: '#000000'
},
left: 'center'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
lineStyle: {
color: '#57617B'
}
}
},
legend: {
top: 20,
orient: 'vertical',
icon: 'rect',
itemWidth: 14,
itemHeight: 5,
itemGap: 13,
data: [],
right: '4%',
textStyle: {
fontSize: 12,
color: '#C0C0C0'
}
},
grid: {
top: 100,
left: '2%',
right: '2%',
bottom: '2%',
containLabel: true
},
xAxis: [{
type: 'category',
boundaryGap: true,
axisLine: {
lineStyle: {
color: '#57617B'
}
},
data: []
}],
yAxis: [{
type: 'value',
name: '(s)',
axisTick: {
show: false
},
axisLine: {
lineStyle: {
color: '#57617B'
}
},
axisLabel: {
margin: 10,
textStyle: {
fontSize: 14
}
},
splitLine: {
lineStyle: {
color: '#57617B'
}
}
}],
series: []
},
chart: null
};
},
watch: {
size() {
return this.chart.resize({...this.size, silent: false});
}
},
async created() {
await this.loadLessonData();
},
mounted() {
this.initChart();
},
beforeDestroy() {
if (!this.chart) {
return;
}
this.chart.dispose();
this.chart = null;
},
methods: {
initChart() {
this.chart = echarts.init(document.getElementById(this.id));
this.chart.setOption(this.option);
},
async loadLessonData() {
const data = [];
const resp = await getLessonList();
if (resp) {
const info = resp.data || [];
for (var i = 0; i < info.length; i++) {
const item = { ...info[i], data: []};
const rest = await getLessonTimeChart({id: info[i].statsProjectId});
if (rest) {
item.data = rest.data || [];
}
data.push(item);
}
}
props: {
id: {
type: String,
default: 'chart'
},
size: {
type: Object,
required: true
}
},
data() {
return {
option: {
backgroundColor: '#F0F2F5',
title: {
top: 20,
text: this.$t('dashboard.courseStatistics'),
textStyle: {
fontWeight: 'normal',
fontSize: 18,
color: '#000000'
},
left: 'center'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
lineStyle: {
color: '#57617B'
}
}
},
legend: {
top: 20,
orient: 'vertical',
icon: 'rect',
itemWidth: 14,
itemHeight: 5,
itemGap: 13,
data: [],
right: '4%',
textStyle: {
fontSize: 12,
color: '#C0C0C0'
}
},
grid: {
top: 100,
left: '2%',
right: '2%',
bottom: '2%',
containLabel: true
},
xAxis: [{
type: 'category',
boundaryGap: true,
axisLine: {
lineStyle: {
color: '#57617B'
}
},
data: []
}],
yAxis: [{
type: 'value',
name: '(s)',
axisTick: {
show: false
},
axisLine: {
lineStyle: {
color: '#57617B'
}
},
axisLabel: {
margin: 10,
textStyle: {
fontSize: 14
}
},
splitLine: {
lineStyle: {
color: '#57617B'
}
}
}],
series: []
},
chart: null
};
},
watch: {
size() {
return this.chart.resize({...this.size, silent: false});
}
},
async created() {
await this.loadLessonData();
},
mounted() {
this.initChart();
},
beforeDestroy() {
if (!this.chart) {
return;
}
this.chart.dispose();
this.chart = null;
},
methods: {
initChart() {
this.chart = echarts.init(document.getElementById(this.id));
this.chart.setOption(this.option);
},
async loadLessonData() {
const data = [];
const resp = await getLessonList();
if (resp) {
const info = resp.data || [];
for (var i = 0; i < info.length; i++) {
const item = { ...info[i], data: []};
const rest = await getLessonTimeChart({id: info[i].statsProjectId});
if (rest) {
item.data = rest.data || [];
}
data.push(item);
}
}
this.option.series = [];
this.option.legend.data = [];
this.option.xAxis[0].data = [this.$t('dashboard.controlRightsTraining'),
this.$t('dashboard.signalTraining'),this.$t('dashboard.turnoutTraining'), this.$t('dashboard.sectionTraining'), this.$t('dashboard.stationTraining')];
data.forEach(elem => {
this.option.legend.data.push(elem.statsProjectName);
this.option.series.push({
name: elem.statsProjectName,
type: 'bar',
smooth: true,
symbol: 'circle',
symbolSize: 5,
showSymbol: false,
lineStyle: {
normal: {
width: 1
}
},
data: [0, 0, 0, 0, 0]
});
});
this.option.series = [];
this.option.legend.data = [];
this.option.xAxis[0].data = [this.$t('dashboard.controlRightsTraining'),
this.$t('dashboard.signalTraining'), this.$t('dashboard.turnoutTraining'), this.$t('dashboard.sectionTraining'), this.$t('dashboard.stationTraining')];
data.forEach(elem => {
this.option.legend.data.push(elem.statsProjectName);
this.option.series.push({
name: elem.statsProjectName,
type: 'bar',
smooth: true,
symbol: 'circle',
symbolSize: 5,
showSymbol: false,
lineStyle: {
normal: {
width: 1
}
},
data: [0, 0, 0, 0, 0]
});
});
data.forEach((elem, i) => {
elem.data.forEach(item => {
const index = this.option.xAxis[0].data.findIndex(name => { return name == item.statsProjectName; });
if (index >= 0) {
this.option.series[i].data[index] = item.duration;
}
});
});
data.forEach((elem, i) => {
elem.data.forEach(item => {
const index = this.option.xAxis[0].data.findIndex(name => { return name == item.statsProjectName; });
if (index >= 0) {
this.option.series[i].data[index] = item.duration;
}
});
});
this.chart.setOption(this.option);
}
}
this.chart.setOption(this.option);
}
}
};
</script>

View File

@ -14,184 +14,184 @@ import echarts from 'echarts';
import { listUserPermision } from '@/api/management/author';
export default {
props: {
id: {
type: String,
default: 'chart'
},
size: {
type: Object,
required: true
}
},
data() {
return {
option: {
backgroundColor: '#fefefe',
title: {
text: '',
subtext: '',
subtextStyle: {
color: '#909399'
},
y: 20,
left: 'center'
},
tooltip: {
},
grid: [{
top: '17%',
width: '45%',
bottom: '5%',
left: 50,
containLabel: true
}],
xAxis: {
type: 'category',
show: false,
axisLabel: {
interval: 0,
rotate: 60
},
splitLine: {
show: false
},
data: []
},
yAxis: {
type: 'value',
show: false,
minInterval: 1,
name: this.$t('dashboard.permissions')
},
series: [{
type: 'bar',
z: 3,
barWidth: 25,
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(
0, 0, 0, 1,
[
{offset: 0, color: '#83bff6'},
{offset: 0.5, color: '#188df0'},
{offset: 1, color: '#188df0'}
]
)
},
emphasis: {
color: new echarts.graphic.LinearGradient(
0, 0, 0, 1,
[
{offset: 0, color: '#2378f7'},
{offset: 0.7, color: '#2378f7'},
{offset: 1, color: '#83bff6'}
]
)
}
},
tooltip: {
formatter: params => { return `${params.marker} ${params.name}: ${params.value}`; }
},
data: []
}, {
type: 'pie',
radius: [0, '72%'],
center: ['74%', '55%'],
tooltip: {
formatter: params => { return `${params.marker} ${params.name}: ${params.percent}% ${params.value}个)`; }
},
data: []
}]
},
mapName: null,
mapNameList: [],
permissionList: [],
chart: null
};
},
watch: {
size() {
return this.chart.resize({...this.size, silent: false});
},
async mapName(val) {
await this.loadExamData(val);
}
},
mounted() {
this.initChart();
},
beforeDestroy() {
if (!this.chart) {
return;
}
this.chart.dispose();
this.chart = null;
},
methods: {
initChart() {
listUserPermision({pageSize: 9000, pageNum: 1}).then(resp => {
this.permissionList = resp.data.list.filter(elem => { return parseInt(elem.status) > 0; });
this.mapNameList = [...new Set(this.permissionList.filter(elem => { return elem.mapName; }).map(elem => { return elem.mapName; }))];
this.$nextTick(() => { this.mapName = this.mapNameList[0] || ''; });
});
this.chart = echarts.init(document.getElementById(this.id));
this.chart.setOption(this.option);
},
async loadExamData(mapName) {
if (mapName) {
var permissionDict = {};
var permissionList = await this.$Dictionary.permissionType();
(permissionList ||[]).forEach(elem => {
permissionDict[elem.code] = elem.name;
});
var permissionMap = {
'ATS现地工作站-课程权限': 0,
'ATS行调工作站-课程权限': 0,
'ATS现地工作站-考试权限': 0,
'ATS行调工作站-考试权限': 0,
'ATS现地工作站-仿真权限': 0,
'ATS行调工作站-仿真权限': 0,
'综合演练云平台-仿真权限': 0,
'司机模拟驾驶系统-仿真权限': 0,
'大屏系统权限': 0
};
props: {
id: {
type: String,
default: 'chart'
},
size: {
type: Object,
required: true
}
},
data() {
return {
option: {
backgroundColor: '#fefefe',
title: {
text: '',
subtext: '',
subtextStyle: {
color: '#909399'
},
y: 20,
left: 'center'
},
tooltip: {
},
grid: [{
top: '17%',
width: '45%',
bottom: '5%',
left: 50,
containLabel: true
}],
xAxis: {
type: 'category',
show: false,
axisLabel: {
interval: 0,
rotate: 60
},
splitLine: {
show: false
},
data: []
},
yAxis: {
type: 'value',
show: false,
minInterval: 1,
name: this.$t('dashboard.permissions')
},
series: [{
type: 'bar',
z: 3,
barWidth: 25,
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(
0, 0, 0, 1,
[
{offset: 0, color: '#83bff6'},
{offset: 0.5, color: '#188df0'},
{offset: 1, color: '#188df0'}
]
)
},
emphasis: {
color: new echarts.graphic.LinearGradient(
0, 0, 0, 1,
[
{offset: 0, color: '#2378f7'},
{offset: 0.7, color: '#2378f7'},
{offset: 1, color: '#83bff6'}
]
)
}
},
tooltip: {
formatter: params => { return `${params.marker} ${params.name}: ${params.value}`; }
},
data: []
}, {
type: 'pie',
radius: [0, '72%'],
center: ['74%', '55%'],
tooltip: {
formatter: params => { return `${params.marker} ${params.name}: ${params.percent}% ${params.value}个)`; }
},
data: []
}]
},
mapName: null,
mapNameList: [],
permissionList: [],
chart: null
};
},
watch: {
size() {
return this.chart.resize({...this.size, silent: false});
},
async mapName(val) {
await this.loadExamData(val);
}
},
mounted() {
this.initChart();
},
beforeDestroy() {
if (!this.chart) {
return;
}
this.chart.dispose();
this.chart = null;
},
methods: {
initChart() {
listUserPermision({pageSize: 9000, pageNum: 1}).then(resp => {
this.permissionList = resp.data.list.filter(elem => { return parseInt(elem.status) > 0; });
this.mapNameList = [...new Set(this.permissionList.filter(elem => { return elem.mapName; }).map(elem => { return elem.mapName; }))];
this.$nextTick(() => { this.mapName = this.mapNameList[0] || ''; });
});
this.chart = echarts.init(document.getElementById(this.id));
this.chart.setOption(this.option);
},
async loadExamData(mapName) {
if (mapName) {
var permissionDict = {};
var permissionList = await this.$Dictionary.permissionType();
(permissionList || []).forEach(elem => {
permissionDict[elem.code] = elem.name;
});
var permissionMap = {
'ATS现地工作站-课程权限': 0,
'ATS行调工作站-课程权限': 0,
'ATS现地工作站-考试权限': 0,
'ATS行调工作站-考试权限': 0,
'ATS现地工作站-仿真权限': 0,
'ATS行调工作站-仿真权限': 0,
'综合演练云平台-仿真权限': 0,
'司机模拟驾驶系统-仿真权限': 0,
'大屏系统权限': 0
};
(this.permissionList.filter(elem => { return elem.mapName == mapName; })|| []).forEach(elem => {
if (elem.prdName == Object.keys(permissionMap)[Object.keys(permissionMap).length -1]) {
permissionMap[`${elem.prdName}`] = elem.remains;
} else {
permissionMap[`${elem.prdName}-${permissionDict[elem.permissionType]}`] = elem.remains;
}
});
(this.permissionList.filter(elem => { return elem.mapName == mapName; }) || []).forEach(elem => {
if (elem.prdName == Object.keys(permissionMap)[Object.keys(permissionMap).length - 1]) {
permissionMap[`${elem.prdName}`] = elem.remains;
} else {
permissionMap[`${elem.prdName}-${permissionDict[elem.permissionType]}`] = elem.remains;
}
});
const keys = Object.keys(permissionMap);
const values = Object.values(permissionMap);
const sum = values.reduce((total, num) => { return total + num; });
const keys = Object.keys(permissionMap);
const values = Object.values(permissionMap);
const sum = values.reduce((total, num) => { return total + num; });
this.option.title.text = this.$t('dashboard.residualPermissionDistributionMap') + ` —— ${mapName}`;
this.option.title.subtext = this.$t('dashboard.totalPermissions') + `${sum}` + this.$t('dashboard.individual');
this.option.title.text = this.$t('dashboard.residualPermissionDistributionMap') + ` —— ${mapName}`;
this.option.title.subtext = this.$t('dashboard.totalPermissions') + `${sum}` + this.$t('dashboard.individual');
this.option.xAxis.show = true;
this.option.yAxis.show = true;
this.option.xAxis.show = true;
this.option.yAxis.show = true;
this.option.xAxis.data = keys;
this.option.xAxis.data = keys;
this.option.series[0].data = values;
this.option.series[1].data = keys.filter(name => { return permissionMap[name]; } ).map(name => { return {name, value: permissionMap[name]}; });
} else {
this.option.title.text =this.$t('dashboard.residualPermissionDistributionMap') + ``+ this.$t('dashboard.noMapLineDataYetAvailable') +``;
this.option.title.subtext = this.$t('dashboard.totalPermissions') + `0` + this.$t('dashboard.individual');
this.option.xAxis.show = false;
this.option.yAxis.show = false;
this.option.xAxis.data = [];
this.option.series[0].data = [];
this.option.series[1].data = [];
}
this.option.series[0].data = values;
this.option.series[1].data = keys.filter(name => { return permissionMap[name]; } ).map(name => { return {name, value: permissionMap[name]}; });
} else {
this.option.title.text = this.$t('dashboard.residualPermissionDistributionMap') + `` + this.$t('dashboard.noMapLineDataYetAvailable') + ``;
this.option.title.subtext = this.$t('dashboard.totalPermissions') + `0` + this.$t('dashboard.individual');
this.option.xAxis.show = false;
this.option.yAxis.show = false;
this.option.xAxis.data = [];
this.option.series[0].data = [];
this.option.series[1].data = [];
}
this.chart.setOption(this.option);
}
}
this.chart.setOption(this.option);
}
}
};
</script>
<style scoped>

View File

@ -19,9 +19,9 @@
<script>
import home1 from '@/assets/home/home1.png';
import home2 from '@/assets/home/home2.png';
import home3 from '@/assets/home/demon1.jpg';
import home3 from '@/assets/home/script.png';
import home4 from '@/assets/home/tring1.png';
import home5 from '@/assets/home/tring4.jpg';
import home5 from '@/assets/home/demon1.jpg';
import home6 from '@/assets/home/demon2.jpg';
export default {

View File

@ -29,7 +29,6 @@ export default {
listShow: true,
widthLeft: Number(localStore.get('LeftWidth')) || 450,
productList: [],
skinCode: '',
currentWidth: ''
};
},

View File

@ -88,7 +88,7 @@ export default {
{ required: true, message: this.$t('rules.pleaseEnterMapName'), trigger: 'blur' }
],
lineCode: [
{ required: true, message: this.$t('rules.pleaseChooseSkinCode'), trigger: 'change' }
{ required: true, message: this.$t('rules.pleaseChooseLineCode'), trigger: 'change' }
]
},
pullRules: {

View File

@ -26,14 +26,14 @@ export default {
}
},
watch: {
'$route.query.skinCode': function (code) {
'$route.query.lineCode': function (code) {
if (code) {
this.menus = this.$theme.loadPlanComponent(code);
}
}
},
mounted() {
this.menus = this.$theme.loadPlanComponent(this.$route.query.skinCode);
this.menus = this.$theme.loadPlanComponent(this.$route.query.lineCode);
},
methods: {
doShow() {

View File

@ -18,6 +18,7 @@ import { mapGetters } from 'vuex';
import { runDiagramGetTime } from '@/api/simulation';
import { getPublishMapInfo } from '@/api/jmap/map';
import { timeFormat } from '@/utils/date';
import echarts from 'echarts';
export default {
name: 'RunPlanView',
@ -213,46 +214,29 @@ export default {
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) {
if (that.myChart && that.myChart.isDisposed) {
that.myChart.clear();
}
if (this.myChart && this.myChart.isDisposed) {
this.myChart.clear();
}
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: document.documentElement.clientWidth, height: document.documentElement.clientHeight - 55 });
}
resolve(true);
});
let startValue = 3600 + this.PlanConvert.TranslationTime;
const offsetTime = 3600;
runDiagramGetTime(this.group).then(resp => {
startValue = resp.data - this.PlanConvert.TranslationTime;
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
this.option.series = series;
this.myChart = echarts.init(document.getElementById(this.runPlanId));
if (this.myChart) {
this.myChart.setOption(this.option);
this.reSize({ width: document.documentElement.clientWidth, height: document.documentElement.clientHeight - 55 });
}
);
});
resolve(true);
} catch (error) {
reject(error);
}
});
},
updateRunPlanData(data) {
const stations = this.$store.state.runPlan.stations;

View File

@ -30,6 +30,7 @@ import {getRpDetailByUserMapId, getUserMapDetailByMapId} from '@/api/designPlatf
import { loadMapDataById } from '@/utils/loaddata';
import { getPublishMapInfo } from '@/api/jmap/map';
import DataTable from './menus/components/dataTable';
import echarts from 'echarts';
export default {
name: 'PlanSchedule',
@ -467,35 +468,16 @@ export default {
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();
}
if (that.$route.query.planName) {
that.option.title.text = that.mapName;
}
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);
}
);
if (this.myChart && this.myChart.isDisposed) {
this.myChart.clear();
}
if (this.$route.query.planName) {
this.option.title.text = this.mapName;
}
this.myChart = echarts.init(document.getElementById(this.runPlanId));
this.myChart.setOption(this.option);
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
resolve(true);
} catch (error) {
reject(error);
}

View File

@ -14,6 +14,7 @@ import { mapGetters } from 'vuex';
import { getStationList, queryRunPlan, queryRunPlanTemplate, queryRunPlanDaily } from '@/api/runplan';
import { timeFormat } from '@/utils/date';
import { UrlConfig } from '@/router/index';
import echarts from 'echarts';
export default {
name: 'RunPlan',
@ -279,32 +280,15 @@ export default {
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);
}
);
if (this.myChart && this.myChart.isDisposed) {
this.myChart.clear();
}
this.myChart = echarts.init(document.getElementById(this.runPlanId));
this.myChart.setOption(this.option);
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
// this.myChart.on('click', this.mouseClick);
resolve(true);
} catch (error) {
reject(error);
}

View File

@ -65,7 +65,11 @@ module.exports = {
ignore: ['.*']
}
])
]
],
externals: {
'echarts': 'echarts' // 配置使用CDN
// 'element-ui': 'ELEMENT'
}
},
chainWebpack(config) {
config.plugins.delete('preload'); // TODO: need test