desc: 修改echarts加载方式
This commit is contained in:
parent
092603c2cc
commit
0cb102186f
@ -16,7 +16,6 @@
|
|||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"axios": "0.18.0",
|
"axios": "0.18.0",
|
||||||
"echarts": "^4.2.1",
|
|
||||||
"element-ui": "2.7.2",
|
"element-ui": "2.7.2",
|
||||||
"file-saver": "^1.3.3",
|
"file-saver": "^1.3.3",
|
||||||
"js-cookie": "2.2.0",
|
"js-cookie": "2.2.0",
|
||||||
|
@ -5,9 +5,14 @@
|
|||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<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">
|
<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="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>
|
<title><%= webpackConfig.name %></title>
|
||||||
<script src="/static/inflate.min.js"></script>
|
<script src="/static/inflate.min.js"></script>
|
||||||
<script src="/static/three.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>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<noscript>
|
<noscript>
|
||||||
|
@ -27,6 +27,7 @@ import { mapGetters } from 'vuex';
|
|||||||
import { timeFormat } from '@/utils/date';
|
import { timeFormat } from '@/utils/date';
|
||||||
import { runDiagramGetTime } from '@/api/simulation';
|
import { runDiagramGetTime } from '@/api/simulation';
|
||||||
import DataTable from '../menusPlan/components/dataTable';
|
import DataTable from '../menusPlan/components/dataTable';
|
||||||
|
import echarts from 'echarts';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'PlanSchedule',
|
name: 'PlanSchedule',
|
||||||
@ -356,46 +357,63 @@ export default {
|
|||||||
return series;
|
return series;
|
||||||
},
|
},
|
||||||
loadInitChart(series) {
|
loadInitChart(series) {
|
||||||
return new Promise((resolve, reject) => {
|
// return new Promise((resolve, reject) => {
|
||||||
try {
|
// try {
|
||||||
const that = this;
|
// const that = this;
|
||||||
// 加载echart配置
|
// // 加载echart配置
|
||||||
require.config(
|
// require.config(
|
||||||
{
|
// {
|
||||||
paths: {
|
// paths: {
|
||||||
echarts: './js/dist'
|
// echarts: './js/dist'
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
);
|
// );
|
||||||
// 按需加载所需图表,如需动态类型切换功能,别忘了同时加载相应图表
|
// // 按需加载所需图表,如需动态类型切换功能,别忘了同时加载相应图表
|
||||||
require(
|
// require(
|
||||||
[
|
// [
|
||||||
'echarts',
|
// 'echarts',
|
||||||
'echarts/lib/chart/line'
|
// 'echarts/lib/chart/line'
|
||||||
],
|
// ],
|
||||||
function (ec) {
|
// function (ec) {
|
||||||
that.destroy();
|
// that.destroy();
|
||||||
|
|
||||||
let startValue = 3600 + that.PlanConvert.TranslationTime;
|
// let startValue = 3600 + that.PlanConvert.TranslationTime;
|
||||||
|
// const offsetTime = 3600;
|
||||||
|
|
||||||
|
// runDiagramGetTime(that.group).then(resp => {
|
||||||
|
// startValue = resp.data - that.PlanConvert.TranslationTime;
|
||||||
|
// that.option.dataZoom[0].startValue = that.option.dataZoom[1].startValue = startValue - offsetTime;
|
||||||
|
// that.option.dataZoom[0].endValue = that.option.dataZoom[1].endValue = startValue + offsetTime;
|
||||||
|
// that.option.series = series;
|
||||||
|
// that.myChart = ec.init(document.getElementById(that.runPlanId));
|
||||||
|
// if (that.myChart) {
|
||||||
|
// that.myChart.setOption(that.option);
|
||||||
|
// that.reSize({ width: that.$store.state.runPlan.width, height: that.$store.state.runPlan.height });
|
||||||
|
// that.myChart.on('click', that.mouseClick);
|
||||||
|
// }
|
||||||
|
// });
|
||||||
|
// resolve(true);
|
||||||
|
// }
|
||||||
|
// );
|
||||||
|
// } catch (error) {
|
||||||
|
// reject(error);
|
||||||
|
// }
|
||||||
|
// });
|
||||||
|
this.destroy();
|
||||||
|
|
||||||
|
let startValue = 3600 + this.PlanConvert.TranslationTime;
|
||||||
const offsetTime = 3600;
|
const offsetTime = 3600;
|
||||||
|
|
||||||
runDiagramGetTime(that.group).then(resp => {
|
runDiagramGetTime(this.group).then(resp => {
|
||||||
startValue = resp.data - that.PlanConvert.TranslationTime;
|
startValue = resp.data - this.PlanConvert.TranslationTime;
|
||||||
that.option.dataZoom[0].startValue = that.option.dataZoom[1].startValue = startValue - offsetTime;
|
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
|
||||||
that.option.dataZoom[0].endValue = that.option.dataZoom[1].endValue = startValue + offsetTime;
|
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
|
||||||
that.option.series = series;
|
this.option.series = series;
|
||||||
that.myChart = ec.init(document.getElementById(that.runPlanId));
|
this.myChart = echarts.init(document.getElementById(this.runPlanId));
|
||||||
if (that.myChart) {
|
if (this.myChart) {
|
||||||
that.myChart.setOption(that.option);
|
this.myChart.setOption(this.option);
|
||||||
that.reSize({ width: that.$store.state.runPlan.width, height: that.$store.state.runPlan.height });
|
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
|
||||||
that.myChart.on('click', that.mouseClick);
|
this.myChart.on('click', this.mouseClick);
|
||||||
}
|
|
||||||
});
|
|
||||||
resolve(true);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
} catch (error) {
|
|
||||||
reject(error);
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
@ -1,13 +1,23 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id="PlanSchedule" :style="{top: top+'px', height: height+'px'}">
|
<div id="PlanSchedule" :style="{top: top+'px', height: height+'px'}">
|
||||||
<div class="left">
|
<div class="left">
|
||||||
<div :id="runPlanId"></div>
|
<div :id="runPlanId" />
|
||||||
</div>
|
</div>
|
||||||
<div class="right">
|
<div class="right">
|
||||||
<data-table ref="serviceTable" :height="height/2" :config="serviceNumberConfig" @touch="scheduleTouch"
|
<data-table
|
||||||
:style="{top: top-height/2+'px'}"></data-table>
|
ref="serviceTable"
|
||||||
<data-table ref="tripTable" :height="height/2" :config="tripNumberConfig" @touch="trainNumTouch"
|
:height="height/2"
|
||||||
:style="{top: top-height/2+'px'}"></data-table>
|
: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>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -17,9 +27,13 @@
|
|||||||
import { timeFormat } from '@/utils/date';
|
import { timeFormat } from '@/utils/date';
|
||||||
import { runDiagramGetTime } from '@/api/simulation';
|
import { runDiagramGetTime } from '@/api/simulation';
|
||||||
import DataTable from '../menusPlan/components/dataTable';
|
import DataTable from '../menusPlan/components/dataTable';
|
||||||
|
import echarts from 'echarts';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'PlanSchedule',
|
name: 'PlanSchedule',
|
||||||
|
components: {
|
||||||
|
DataTable
|
||||||
|
},
|
||||||
props: {
|
props: {
|
||||||
group: {
|
group: {
|
||||||
type: String,
|
type: String,
|
||||||
@ -38,9 +52,6 @@
|
|||||||
required: true
|
required: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
|
||||||
DataTable
|
|
||||||
},
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
top: 0,
|
top: 0,
|
||||||
@ -57,7 +68,7 @@
|
|||||||
columns: [
|
columns: [
|
||||||
{
|
{
|
||||||
prop: 'serviceNumber',
|
prop: 'serviceNumber',
|
||||||
label: '表号',
|
label: '表号'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
width: 40
|
width: 40
|
||||||
@ -72,7 +83,7 @@
|
|||||||
columns: [
|
columns: [
|
||||||
{
|
{
|
||||||
prop: 'tripNumber',
|
prop: 'tripNumber',
|
||||||
label: '车次号',
|
label: '车次号'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
width: 40
|
width: 40
|
||||||
@ -110,7 +121,7 @@
|
|||||||
type: 'cross'
|
type: 'cross'
|
||||||
},
|
},
|
||||||
formatter: this.axisTooltip,
|
formatter: this.axisTooltip,
|
||||||
borderWidth: 1,
|
borderWidth: 1
|
||||||
},
|
},
|
||||||
xAxis: [
|
xAxis: [
|
||||||
{
|
{
|
||||||
@ -135,7 +146,7 @@
|
|||||||
label: {
|
label: {
|
||||||
formatter: this.xAxisPointFormat,
|
formatter: this.xAxisPointFormat,
|
||||||
backgroundColor: 'rgb(255,0,0,0.5)',
|
backgroundColor: 'rgb(255,0,0,0.5)',
|
||||||
color: 'white',
|
color: 'white'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -146,7 +157,7 @@
|
|||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
axisTick: {
|
axisTick: {
|
||||||
show: false,
|
show: false
|
||||||
},
|
},
|
||||||
axisLine: {
|
axisLine: {
|
||||||
onZero: false,
|
onZero: false,
|
||||||
@ -157,23 +168,23 @@
|
|||||||
},
|
},
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
interval: 'auto',
|
interval: 'auto',
|
||||||
formatter: this.yAxisLableFormat,
|
formatter: this.yAxisLableFormat
|
||||||
},
|
},
|
||||||
axisPointer: {
|
axisPointer: {
|
||||||
xAxisIndex: 'all',
|
xAxisIndex: 'all',
|
||||||
label: {
|
label: {
|
||||||
formatter: this.yAxisPointFormat,
|
formatter: this.yAxisPointFormat,
|
||||||
backgroundColor: 'rgb(0,100,0,0.5)',
|
backgroundColor: 'rgb(0,100,0,0.5)',
|
||||||
color: 'white',
|
color: 'white'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
min: 0,
|
min: 0,
|
||||||
max: 0,
|
max: 0
|
||||||
},
|
},
|
||||||
series: [],
|
series: [],
|
||||||
dataZoom: [
|
dataZoom: [
|
||||||
{
|
{
|
||||||
type: 'inside',
|
type: 'inside'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
fiterMode: 'filter',
|
fiterMode: 'filter',
|
||||||
@ -192,7 +203,7 @@
|
|||||||
},
|
},
|
||||||
absoluteTime: 2 * 3600,
|
absoluteTime: 2 * 3600,
|
||||||
indexKmRangeMap: {}
|
indexKmRangeMap: {}
|
||||||
}
|
};
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
maxWidth() {
|
maxWidth() {
|
||||||
@ -208,16 +219,16 @@
|
|||||||
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
|
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
|
||||||
},
|
},
|
||||||
'$store.state.runPlan.selected.serviceNumber': function (val) {
|
'$store.state.runPlan.selected.serviceNumber': function (val) {
|
||||||
let index = this.serviceNumberConfig.data.findIndex(elem => {
|
const index = this.serviceNumberConfig.data.findIndex(elem => {
|
||||||
return elem.serviceNumber == val;
|
return elem.serviceNumber == val;
|
||||||
})
|
});
|
||||||
|
|
||||||
this.$refs.serviceTable.setCurrentRow(this.serviceNumberConfig.data[index]);
|
this.$refs.serviceTable.setCurrentRow(this.serviceNumberConfig.data[index]);
|
||||||
},
|
},
|
||||||
'$store.state.runPlan.selected.tripNumber': function (val) {
|
'$store.state.runPlan.selected.tripNumber': function (val) {
|
||||||
let index = this.tripNumberConfig.data.findIndex(elem => {
|
const index = this.tripNumberConfig.data.findIndex(elem => {
|
||||||
return elem.tripNumber == val;
|
return elem.tripNumber == val;
|
||||||
})
|
});
|
||||||
this.$refs.tripTable.setCurrentRow(this.tripNumberConfig.data[index]);
|
this.$refs.tripTable.setCurrentRow(this.tripNumberConfig.data[index]);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -236,7 +247,7 @@
|
|||||||
serviceNumberChange(row) {
|
serviceNumberChange(row) {
|
||||||
if (row) {
|
if (row) {
|
||||||
this.$store.dispatch('runPlan/setSelected', { serviceNumber: row.serviceNumber, tripNumber: null });
|
this.$store.dispatch('runPlan/setSelected', { serviceNumber: row.serviceNumber, tripNumber: null });
|
||||||
let serviceObj = this.$store.state.runPlan.editData[row.serviceNumber]
|
const serviceObj = this.$store.state.runPlan.editData[row.serviceNumber];
|
||||||
if (serviceObj) {
|
if (serviceObj) {
|
||||||
this.analyticalTripNumber(serviceObj.trainMap);
|
this.analyticalTripNumber(serviceObj.trainMap);
|
||||||
}
|
}
|
||||||
@ -249,24 +260,24 @@
|
|||||||
},
|
},
|
||||||
async analyticalServiceNumber(data) {
|
async analyticalServiceNumber(data) {
|
||||||
this.serviceNumberConfig.data = Object.keys(data || {})
|
this.serviceNumberConfig.data = Object.keys(data || {})
|
||||||
.sort((a, b) => { return data[a].oldIndex - data[b].oldIndex })
|
.sort((a, b) => { return data[a].oldIndex - data[b].oldIndex; })
|
||||||
.map(serviceNumber => { return { serviceNumber } });
|
.map(serviceNumber => { return { serviceNumber }; });
|
||||||
},
|
},
|
||||||
async analyticalTripNumber(data) {
|
async analyticalTripNumber(data) {
|
||||||
this.tripNumberConfig.data = Object.keys(data || {})
|
this.tripNumberConfig.data = Object.keys(data || {})
|
||||||
.sort((a, b) => { return data[a].oldIndex - data[b].oldIndex })
|
.sort((a, b) => { return data[a].oldIndex - data[b].oldIndex; })
|
||||||
.map(tripNumber => { return { tripNumber } });
|
.map(tripNumber => { return { tripNumber }; });
|
||||||
},
|
},
|
||||||
async setPosition() {
|
async setPosition() {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
let top = 3;
|
let top = 3;
|
||||||
let width = this.maxWidth * 0.85;
|
const width = this.maxWidth * 0.85;
|
||||||
let height = this.maxHeight;
|
let height = this.maxHeight;
|
||||||
|
|
||||||
let titleBar = document.getElementById('PlanTitleBar');
|
const titleBar = document.getElementById('PlanTitleBar');
|
||||||
let menuBar = document.getElementById('PlanMenuBar');
|
const menuBar = document.getElementById('PlanMenuBar');
|
||||||
let menuTool = document.getElementById('PlanMenuTool');
|
const menuTool = document.getElementById('PlanMenuTool');
|
||||||
let statusBar = document.getElementById('PlanStatusBar');
|
const statusBar = document.getElementById('PlanStatusBar');
|
||||||
|
|
||||||
if (titleBar) {
|
if (titleBar) {
|
||||||
top += (titleBar.offsetHeight || 0);
|
top += (titleBar.offsetHeight || 0);
|
||||||
@ -294,13 +305,13 @@
|
|||||||
if (this.height != height) {
|
if (this.height != height) {
|
||||||
this.height = height - 20 * 2;
|
this.height = height - 20 * 2;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
async loadChartPage() {
|
async loadChartPage() {
|
||||||
try {
|
try {
|
||||||
let series = [];
|
let series = [];
|
||||||
let stations = this.$store.state.runPlan.stations;
|
const stations = this.$store.state.runPlan.stations;
|
||||||
let planData = this.$store.state.runPlan.planData;
|
const planData = this.$store.state.runPlan.planData;
|
||||||
|
|
||||||
this.viewDisabled = true;
|
this.viewDisabled = true;
|
||||||
this.kmRangeCoordMap = this.PlanConvert.convertStationsToMap(stations);
|
this.kmRangeCoordMap = this.PlanConvert.convertStationsToMap(stations);
|
||||||
@ -328,7 +339,7 @@
|
|||||||
if (elem) {
|
if (elem) {
|
||||||
series.push(elem);
|
series.push(elem);
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
return series;
|
return series;
|
||||||
@ -336,11 +347,11 @@
|
|||||||
popModels(series, models) {
|
popModels(series, models) {
|
||||||
if (models && models.length) {
|
if (models && models.length) {
|
||||||
models.forEach(elem => {
|
models.forEach(elem => {
|
||||||
let index = series.indexOf(elem);
|
const index = series.indexOf(elem);
|
||||||
if (index >= 0) {
|
if (index >= 0) {
|
||||||
series.split(index, 1);
|
series.split(index, 1);
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
return series;
|
return series;
|
||||||
@ -348,46 +359,28 @@
|
|||||||
loadInitChart(series) {
|
loadInitChart(series) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
try {
|
try {
|
||||||
let that = this;
|
this.destroy();
|
||||||
//加载echart配置
|
let startValue = 3600 + this.PlanConvert.TranslationTime;
|
||||||
require.config(
|
const offsetTime = 3600;
|
||||||
{
|
|
||||||
paths: {
|
|
||||||
echarts: './js/dist'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
);
|
|
||||||
// 按需加载所需图表,如需动态类型切换功能,别忘了同时加载相应图表
|
|
||||||
require(
|
|
||||||
[
|
|
||||||
'echarts',
|
|
||||||
'echarts/lib/chart/line',
|
|
||||||
],
|
|
||||||
function (ec) {
|
|
||||||
that.destroy();
|
|
||||||
|
|
||||||
let startValue = 3600 + that.PlanConvert.TranslationTime;
|
runDiagramGetTime(this.group).then(resp => {
|
||||||
let offsetTime = 3600;
|
startValue = resp.data - this.PlanConvert.TranslationTime;
|
||||||
|
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
|
||||||
runDiagramGetTime(that.group).then(resp => {
|
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
|
||||||
startValue = resp.data - that.PlanConvert.TranslationTime;
|
this.option.series = series;
|
||||||
that.option.dataZoom[0].startValue = that.option.dataZoom[1].startValue = startValue - offsetTime;
|
this.myChart = echarts.init(document.getElementById(this.runPlanId));
|
||||||
that.option.dataZoom[0].endValue = that.option.dataZoom[1].endValue = startValue + offsetTime;
|
if (this.myChart) {
|
||||||
that.option.series = series;
|
this.myChart.setOption(this.option);
|
||||||
that.myChart = ec.init(document.getElementById(that.runPlanId));
|
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
|
||||||
if (that.myChart) {
|
this.myChart.on('click', this.mouseClick);
|
||||||
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);
|
resolve(true);
|
||||||
}
|
|
||||||
);
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
reject(error);
|
reject(error);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
},
|
},
|
||||||
xAxisPointFormat(params) {
|
xAxisPointFormat(params) {
|
||||||
return timeFormat(params.value);
|
return timeFormat(params.value);
|
||||||
@ -404,13 +397,13 @@
|
|||||||
return '';
|
return '';
|
||||||
},
|
},
|
||||||
xAxisInit() {
|
xAxisInit() {
|
||||||
let list = [];
|
const list = [];
|
||||||
for (var time = 0 + this.PlanConvert.TranslationTime; time < 3600 * 24 + this.PlanConvert.TranslationTime; time++) {
|
for (var time = 0 + this.PlanConvert.TranslationTime; time < 3600 * 24 + this.PlanConvert.TranslationTime; time++) {
|
||||||
list.push(time);
|
list.push(time);
|
||||||
}
|
}
|
||||||
|
|
||||||
let startValue = 3600 * 6;
|
const startValue = 3600 * 6;
|
||||||
let offsetTime = 3600 * 1;
|
const offsetTime = 3600 * 1;
|
||||||
|
|
||||||
this.option.xAxis[0].data = list;
|
this.option.xAxis[0].data = list;
|
||||||
if (!this.option.dataZoom[0].startValue) {
|
if (!this.option.dataZoom[0].startValue) {
|
||||||
@ -428,7 +421,7 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
axisTooltip(param) {
|
axisTooltip(param) {
|
||||||
let station = this.stations[Math.floor((param.data[1] - this.PlanConvert.EdgeHeight) / this.PlanConvert.CoordMultiple)] || { name: '', kmRange: '' };
|
const station = this.stations[Math.floor((param.data[1] - this.PlanConvert.EdgeHeight) / this.PlanConvert.CoordMultiple)] || { name: '', kmRange: '' };
|
||||||
return [
|
return [
|
||||||
`Point Data <hr size=1 style=" margin: 3px 0">`,
|
`Point Data <hr size=1 style=" margin: 3px 0">`,
|
||||||
`车站名称: ${station.name}<br>`,
|
`车站名称: ${station.name}<br>`,
|
||||||
@ -437,9 +430,9 @@
|
|||||||
].join('');
|
].join('');
|
||||||
},
|
},
|
||||||
mouseClick(params) {
|
mouseClick(params) {
|
||||||
let model = {
|
const model = {
|
||||||
serviceNumber: params.seriesName
|
serviceNumber: params.seriesName
|
||||||
}
|
};
|
||||||
this.$store.dispatch('runPlan/setSelected', model);
|
this.$store.dispatch('runPlan/setSelected', model);
|
||||||
},
|
},
|
||||||
reSize(opt) {
|
reSize(opt) {
|
||||||
@ -464,9 +457,9 @@
|
|||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
</script>
|
</script>
|
||||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
<style scoped rel="stylesheet/scss" lang="scss">
|
||||||
@import "src/styles/mixin.scss";
|
@import "src/styles/mixin.scss";
|
||||||
|
|
||||||
#PlanSchedule {
|
#PlanSchedule {
|
||||||
|
@ -27,6 +27,7 @@ import { mapGetters } from 'vuex';
|
|||||||
import { timeFormat } from '@/utils/date';
|
import { timeFormat } from '@/utils/date';
|
||||||
import { runDiagramGetTime } from '@/api/simulation';
|
import { runDiagramGetTime } from '@/api/simulation';
|
||||||
import DataTable from '../menusPlan/components/dataTable';
|
import DataTable from '../menusPlan/components/dataTable';
|
||||||
|
import echarts from 'echarts';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'PlanSchedule',
|
name: 'PlanSchedule',
|
||||||
@ -358,42 +359,24 @@ export default {
|
|||||||
loadInitChart(series) {
|
loadInitChart(series) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
try {
|
try {
|
||||||
const that = this;
|
this.destroy();
|
||||||
// 加载echart配置
|
|
||||||
require.config(
|
|
||||||
{
|
|
||||||
paths: {
|
|
||||||
echarts: './js/dist'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
);
|
|
||||||
// 按需加载所需图表,如需动态类型切换功能,别忘了同时加载相应图表
|
|
||||||
require(
|
|
||||||
[
|
|
||||||
'echarts',
|
|
||||||
'echarts/lib/chart/line'
|
|
||||||
],
|
|
||||||
function (ec) {
|
|
||||||
that.destroy();
|
|
||||||
|
|
||||||
let startValue = 3600 + that.PlanConvert.TranslationTime;
|
let startValue = 3600 + this.PlanConvert.TranslationTime;
|
||||||
const offsetTime = 3600;
|
const offsetTime = 3600;
|
||||||
|
|
||||||
runDiagramGetTime(that.group).then(resp => {
|
runDiagramGetTime(this.group).then(resp => {
|
||||||
startValue = resp.data - that.PlanConvert.TranslationTime;
|
startValue = resp.data - this.PlanConvert.TranslationTime;
|
||||||
that.option.dataZoom[0].startValue = that.option.dataZoom[1].startValue = startValue - offsetTime;
|
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
|
||||||
that.option.dataZoom[0].endValue = that.option.dataZoom[1].endValue = startValue + offsetTime;
|
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
|
||||||
that.option.series = series;
|
this.option.series = series;
|
||||||
that.myChart = ec.init(document.getElementById(that.runPlanId));
|
this.myChart = echarts.init(document.getElementById(this.runPlanId));
|
||||||
if (that.myChart) {
|
if (this.myChart) {
|
||||||
that.myChart.setOption(that.option);
|
this.myChart.setOption(this.option);
|
||||||
that.reSize({ width: that.$store.state.runPlan.width, height: that.$store.state.runPlan.height });
|
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
|
||||||
that.myChart.on('click', that.mouseClick);
|
this.myChart.on('click', this.mouseClick);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
resolve(true);
|
resolve(true);
|
||||||
}
|
|
||||||
);
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
reject(error);
|
reject(error);
|
||||||
}
|
}
|
||||||
@ -476,7 +459,7 @@ export default {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
<style scoped rel="stylesheet/scss" lang="scss">
|
||||||
@import "src/styles/mixin.scss";
|
@import "src/styles/mixin.scss";
|
||||||
|
|
||||||
#PlanSchedule {
|
#PlanSchedule {
|
||||||
|
@ -27,6 +27,7 @@ import { mapGetters } from 'vuex';
|
|||||||
import { timeFormat } from '@/utils/date';
|
import { timeFormat } from '@/utils/date';
|
||||||
import { runDiagramGetTime } from '@/api/simulation';
|
import { runDiagramGetTime } from '@/api/simulation';
|
||||||
import DataTable from '../menusPlan/components/dataTable';
|
import DataTable from '../menusPlan/components/dataTable';
|
||||||
|
import echarts from 'echarts';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'PlanSchedule',
|
name: 'PlanSchedule',
|
||||||
@ -358,46 +359,29 @@ export default {
|
|||||||
loadInitChart(series) {
|
loadInitChart(series) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
try {
|
try {
|
||||||
const that = this;
|
this.destroy();
|
||||||
// 加载echart配置
|
|
||||||
require.config(
|
|
||||||
{
|
|
||||||
paths: {
|
|
||||||
echarts: './js/dist'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
);
|
|
||||||
// 按需加载所需图表,如需动态类型切换功能,别忘了同时加载相应图表
|
|
||||||
require(
|
|
||||||
[
|
|
||||||
'echarts',
|
|
||||||
'echarts/lib/chart/line'
|
|
||||||
],
|
|
||||||
function (ec) {
|
|
||||||
that.destroy();
|
|
||||||
|
|
||||||
let startValue = 3600 + that.PlanConvert.TranslationTime;
|
let startValue = 3600 + this.PlanConvert.TranslationTime;
|
||||||
const offsetTime = 3600;
|
const offsetTime = 3600;
|
||||||
|
|
||||||
runDiagramGetTime(that.group).then(resp => {
|
runDiagramGetTime(this.group).then(resp => {
|
||||||
startValue = resp.data - that.PlanConvert.TranslationTime;
|
startValue = resp.data - this.PlanConvert.TranslationTime;
|
||||||
that.option.dataZoom[0].startValue = that.option.dataZoom[1].startValue = startValue - offsetTime;
|
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
|
||||||
that.option.dataZoom[0].endValue = that.option.dataZoom[1].endValue = startValue + offsetTime;
|
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
|
||||||
that.option.series = series;
|
this.option.series = series;
|
||||||
that.myChart = ec.init(document.getElementById(that.runPlanId));
|
this.myChart = echarts.init(document.getElementById(this.runPlanId));
|
||||||
if (that.myChart) {
|
if (this.myChart) {
|
||||||
that.myChart.setOption(that.option);
|
this.myChart.setOption(this.option);
|
||||||
that.reSize({ width: that.$store.state.runPlan.width, height: that.$store.state.runPlan.height });
|
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
|
||||||
that.myChart.on('click', that.mouseClick);
|
this.myChart.on('click', this.mouseClick);
|
||||||
}
|
}
|
||||||
resolve(true);
|
|
||||||
});
|
});
|
||||||
}
|
resolve(true);
|
||||||
);
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
reject(error);
|
reject(error);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
},
|
},
|
||||||
xAxisPointFormat(params) {
|
xAxisPointFormat(params) {
|
||||||
return timeFormat(params.value);
|
return timeFormat(params.value);
|
||||||
|
@ -3,6 +3,7 @@ import Vue from 'vue';
|
|||||||
import 'normalize.css/normalize.css'; // A modern alternative to CSS resets
|
import 'normalize.css/normalize.css'; // A modern alternative to CSS resets
|
||||||
|
|
||||||
import ElementUI from 'element-ui';
|
import ElementUI from 'element-ui';
|
||||||
|
// import ELEMENT from 'element-ui';
|
||||||
import ElementLocale from 'element-ui/lib/locale';
|
import ElementLocale from 'element-ui/lib/locale';
|
||||||
import 'element-ui/lib/theme-chalk/index.css';
|
import 'element-ui/lib/theme-chalk/index.css';
|
||||||
|
|
||||||
|
@ -126,6 +126,14 @@ router.beforeEach((to, from, next) => {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
NProgress.configure({
|
||||||
|
easing: 'ease', // 动画方式
|
||||||
|
speed: 500, // 递增进度条的速度
|
||||||
|
showSpinner: false, // 是否显示加载ico
|
||||||
|
trickleSpeed: 200, // 自动递增间隔
|
||||||
|
minimum: 0.3 // 初始化时的最小百分比
|
||||||
|
});
|
||||||
|
|
||||||
router.afterEach(() => {
|
router.afterEach(() => {
|
||||||
// 结束Progress
|
// 结束Progress
|
||||||
NProgress.done();
|
NProgress.done();
|
||||||
|
@ -4,101 +4,101 @@ import Router from 'vue-router';
|
|||||||
Vue.use(Router);
|
Vue.use(Router);
|
||||||
|
|
||||||
/* Layout */
|
/* Layout */
|
||||||
import Layout from '@/layout';
|
const Layout = () => import('@/layout');
|
||||||
import Login from '@/views/login/index';
|
const Login = () => import('@/views/login/index');
|
||||||
|
|
||||||
import Jlmap3dedit from '@/views/jlmap3d/edit/jlmap3dedit';
|
const Jlmap3dedit = () => import('@/views/jlmap3d/edit/jlmap3dedit');
|
||||||
import Jlmap3d from '@/views/jlmap3d/drive/jl3ddrive';
|
const Jlmap3d = () => import('@/views/jlmap3d/drive/jl3ddrive');
|
||||||
import Display from '@/views/display/index';
|
const Display = () => import('@/views/display/index');
|
||||||
import DesignDisplay from '@/views/display/designIndex';
|
const DesignDisplay = () => import('@/views/display/designIndex');
|
||||||
|
|
||||||
import TrainRoom from '@/views/trainRoom/index';
|
const TrainRoom = () => import('@/views/trainRoom/index');
|
||||||
import JointTraining from '@/views/jointTraining/index';
|
const JointTraining = () => import('@/views/jointTraining/index');
|
||||||
|
|
||||||
import Error401 from '@/views/error-page/401';
|
const Error401 = () => import('@/views/error-page/401');
|
||||||
import Errpr404 from '@/views/error-page/404';
|
const Errpr404 = () => import('@/views/error-page/404');
|
||||||
|
|
||||||
import MapProduct from '@/views/system/product/index';
|
const MapProduct = () => import('@/views/system/product/index');
|
||||||
import Dictionary from '@/views/system/dictionary/index';
|
const Dictionary = () => import('@/views/system/dictionary/index');
|
||||||
import DictionaryDetail from '@/views/system/dictionaryDetail/index';
|
const DictionaryDetail = () => import('@/views/system/dictionaryDetail/index');
|
||||||
import UserControl from '@/views/system/userControl/index';
|
const UserControl = () => import('@/views/system/userControl/index');
|
||||||
import UserTraining from '@/views/system/userTraining/index';
|
const UserTraining = () => import('@/views/system/userTraining/index');
|
||||||
import UserExam from '@/views/system/userExam/index';
|
const UserExam = () => import('@/views/system/userExam/index');
|
||||||
import UserSimulation from '@/views/system/userSimulation/index';
|
const UserSimulation = () => import('@/views/system/userSimulation/index');
|
||||||
import ExistingSimulation from '@/views/system/existingSimulation/index';
|
const ExistingSimulation = () => import('@/views/system/existingSimulation/index');
|
||||||
import CacheControl from '@/views/system/cacheControl/index';
|
const CacheControl = () => import('@/views/system/cacheControl/index');
|
||||||
import SystemGenerate from '@/views/system/systemGenerate/index';
|
const SystemGenerate = () => import('@/views/system/systemGenerate/index');
|
||||||
import IbpDraw from '@/views/system/ibpDraw/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';
|
const Taskmanage = () => import('@/views/lesson/taskmanage/list');
|
||||||
import TrainingRuleList from '@/views/lesson/trainingRule/list';
|
const TrainingRuleList = () => import('@/views/lesson/trainingRule/list');
|
||||||
import TrainingRuleEdit from '@/views/lesson/trainingRule/detail/index';
|
const TrainingRuleEdit = () => import('@/views/lesson/trainingRule/detail/index');
|
||||||
import Trainingmanage from '@/views/lesson/trainingmanage/index';
|
const Trainingmanage = () => import('@/views/lesson/trainingmanage/index');
|
||||||
import LessonEdit from '@/views/lesson/lessoncategory/index';
|
const LessonEdit = () => import('@/views/lesson/lessoncategory/index');
|
||||||
import LessonHome from '@/views/lesson/home';
|
const LessonHome = () => import('@/views/lesson/home');
|
||||||
import LessonDetail from '@/views/lesson/details';
|
const LessonDetail = () => import('@/views/lesson/details');
|
||||||
|
|
||||||
import ScriptmanageHome from '@/views/scriptManage/home';
|
const ScriptmanageHome = () => import('@/views/scriptManage/home');
|
||||||
import ScriptDisplay from '@/views/scriptManage/display/index';
|
const ScriptDisplay = () => import('@/views/scriptManage/display/index');
|
||||||
|
|
||||||
import TeachDetail from '@/views/teach/detail/index';
|
const TeachDetail = () => import('@/views/teach/detail/index');
|
||||||
import TeachHome from '@/views/teach/index';
|
const TeachHome = () => import('@/views/teach/index');
|
||||||
import Pay from '@/views/components/pay/index';
|
const Pay = () => import('@/views/components/pay/index');
|
||||||
|
|
||||||
import ExamHome from '@/views/exam/index';
|
const ExamHome = () => import('@/views/exam/index');
|
||||||
import ExamResult from '@/views/exam/result';
|
const ExamResult = () => import('@/views/exam/result');
|
||||||
import ExamDetail from '@/views/exam/detail/examDetail';
|
const ExamDetail = () => import('@/views/exam/detail/examDetail');
|
||||||
import ExamCourseDetail from '@/views/exam/detail/courseDetail';
|
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';
|
const PlanMonitorEditTool = () => import('@/views/planMonitor/editTool/index');
|
||||||
import PlanMonitorEditUserTool from '@/views/planMonitor/editTool/userindex';
|
const PlanMonitorEditUserTool = () => import('@/views/planMonitor/editTool/userindex');
|
||||||
import PlanMonitorDetail from '@/views/planMonitor/detail';
|
const PlanMonitorDetail = () => import('@/views/planMonitor/detail');
|
||||||
|
|
||||||
import DesignPlatformHome from '@/views/designPlatform/home';
|
const DesignPlatformHome = () => import('@/views/designPlatform/home');
|
||||||
import DesignPlatform from '@/views/designPlatform/index';
|
const DesignPlatform = () => import('@/views/designPlatform/index');
|
||||||
import MapPreview from '@/views/designPlatform/mapPreview';
|
const MapPreview = () => import('@/views/designPlatform/mapPreview');
|
||||||
|
|
||||||
import DesignPlatformUser from '@/views/designUser/index';
|
const DesignPlatformUser = () => import('@/views/designUser/index');
|
||||||
|
|
||||||
import Package from '@/views/package/index';
|
const Package = () => import('@/views/package/index');
|
||||||
import PackageDraft from '@/views/package/draft/ruleForm';
|
const PackageDraft = () => import('@/views/package/draft/ruleForm');
|
||||||
import PackageDetail from '@/views/package/detail';
|
const PackageDetail = () => import('@/views/package/detail');
|
||||||
|
|
||||||
import PublishMap from '@/views/publish/publishMap/index';
|
const PublishMap = () => import('@/views/publish/publishMap/index');
|
||||||
import PublishMapDetail from '@/views/publish/publishMap/list'; // 发布历史
|
const PublishMapDetail = () => import('@/views/publish/publishMap/list'); // 发布历史
|
||||||
import ProductStatus from '@/views/publish/productStatus/index';
|
const ProductStatus = () => import('@/views/publish/productStatus/index');
|
||||||
import PublishLesson from '@/views/publish/publishLesson/index';
|
const PublishLesson = () => import('@/views/publish/publishLesson/index');
|
||||||
import RunPlanTemplate from '@/views/publish/runPlanTemplate/index';
|
const RunPlanTemplate = () => import('@/views/publish/runPlanTemplate/index');
|
||||||
import RunPlanCommon from '@/views/publish/runPlanCommon/index';
|
const RunPlanCommon = () => import('@/views/publish/runPlanCommon/index');
|
||||||
import RunPlanCommonDraft from '@/views/publish/runPlanCommon/draft';
|
const RunPlanCommonDraft = () => import('@/views/publish/runPlanCommon/draft');
|
||||||
import RunPlanEveryDay from '@/views/publish/runPlanEveryDay/index';
|
const RunPlanEveryDay = () => import('@/views/publish/runPlanEveryDay/index');
|
||||||
import RunplanView from '@/views/publish/runPlanEveryDay/runPlanView';
|
const RunplanView = () => import('@/views/publish/runPlanEveryDay/runPlanView');
|
||||||
import PublishExamRule from '@/views/publish/examRule/index';
|
const PublishExamRule = () => import('@/views/publish/examRule/index');
|
||||||
import PublishExamRuleDraft from '@/views/publish/examRule/draft/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';
|
const Commodity = () => import('@/views/orderauthor/commodity/index');
|
||||||
import CommodityDraft from '@/views/orderauthor/commodity/draft';
|
const CommodityDraft = () => import('@/views/orderauthor/commodity/draft');
|
||||||
import OrderList from '@/views/orderauthor/order/list';
|
const OrderList = () => import('@/views/orderauthor/order/list');
|
||||||
import OrderDraft from '@/views/orderauthor/order/draft';
|
const OrderDraft = () => import('@/views/orderauthor/order/draft');
|
||||||
import Author from '@/views/orderauthor/author/index';
|
const Author = () => import('@/views/orderauthor/author/index');
|
||||||
import AuthorDraft from '@/views/orderauthor/author/draft/ruleForm';
|
const AuthorDraft = () => import('@/views/orderauthor/author/draft/ruleForm');
|
||||||
import Permission from '@/views/orderauthor/permission/index';
|
const Permission = () => import('@/views/orderauthor/permission/index');
|
||||||
import PermissionDetail from '@/views/orderauthor/permission/detail';
|
const PermissionDetail = () => import('@/views/orderauthor/permission/detail');
|
||||||
import PermissionDraft from '@/views/orderauthor/permission/package/ruleForm';
|
const PermissionDraft = () => import('@/views/orderauthor/permission/package/ruleForm');
|
||||||
import PermissionCreate from '@/views/orderauthor/permission/create/index';
|
const PermissionCreate = () => import('@/views/orderauthor/permission/create/index');
|
||||||
import UserRules from '@/views/orderauthor/rules/index';
|
const UserRules = () => import('@/views/orderauthor/rules/index');
|
||||||
import UserRulesDetail from '@/views/orderauthor/rules/detail';
|
const UserRulesDetail = () => import('@/views/orderauthor/rules/detail');
|
||||||
|
|
||||||
import LessonApproval from '@/views/approval/lesson/index';
|
const LessonApproval = () => import('@/views/approval/lesson/index');
|
||||||
import ScriptApproval from '@/views/approval/script/index';
|
const ScriptApproval = () => import('@/views/approval/script/index');
|
||||||
import RunPlanApproval from '@/views/approval/runPlan/index';
|
const RunPlanApproval = () => import('@/views/approval/runPlan/index');
|
||||||
import News from '@/views/news/index';
|
const News = () => import('@/views/news/index');
|
||||||
|
|
||||||
import { loginTitle } from '@/scripts/ConstDic';
|
import { loginTitle } from '@/scripts/ConstDic';
|
||||||
import { getSessionStorage } from '@/utils/auth';
|
import { getSessionStorage } from '@/utils/auth';
|
||||||
|
@ -18,6 +18,7 @@ import { mapGetters } from 'vuex';
|
|||||||
import { runDiagramGetTime } from '@/api/simulation';
|
import { runDiagramGetTime } from '@/api/simulation';
|
||||||
import { getPublishMapInfo } from '@/api/jmap/map';
|
import { getPublishMapInfo } from '@/api/jmap/map';
|
||||||
import { timeFormat } from '@/utils/date';
|
import { timeFormat } from '@/utils/date';
|
||||||
|
import echarts from 'echarts';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'RunPlanView',
|
name: 'RunPlanView',
|
||||||
@ -214,46 +215,29 @@ export default {
|
|||||||
loadInitChart(series) {
|
loadInitChart(series) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
try {
|
try {
|
||||||
const that = this;
|
if (this.myChart && this.myChart.isDisposed) {
|
||||||
// 加载echart配置
|
this.myChart.clear();
|
||||||
require.config(
|
|
||||||
{
|
|
||||||
paths: {
|
|
||||||
echarts: './js/dist'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
);
|
|
||||||
// 按需加载所需图表,如需动态类型切换功能,别忘了同时加载相应图表
|
|
||||||
require(
|
|
||||||
[
|
|
||||||
'echarts',
|
|
||||||
'echarts/lib/chart/line'
|
|
||||||
],
|
|
||||||
function (ec) {
|
|
||||||
if (that.myChart && that.myChart.isDisposed) {
|
|
||||||
that.myChart.clear();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
let startValue = 3600 + that.PlanConvert.TranslationTime;
|
let startValue = 3600 + this.PlanConvert.TranslationTime;
|
||||||
const offsetTime = 3600;
|
const offsetTime = 3600;
|
||||||
runDiagramGetTime(that.group).then(resp => {
|
runDiagramGetTime(this.group).then(resp => {
|
||||||
startValue = resp.data - that.PlanConvert.TranslationTime;
|
startValue = resp.data - this.PlanConvert.TranslationTime;
|
||||||
that.option.dataZoom[0].startValue = that.option.dataZoom[1].startValue = startValue - offsetTime;
|
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
|
||||||
that.option.dataZoom[0].endValue = that.option.dataZoom[1].endValue = startValue + offsetTime;
|
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
|
||||||
that.option.series = series;
|
this.option.series = series;
|
||||||
that.myChart = ec.init(document.getElementById(that.runPlanId));
|
this.myChart = echarts.init(document.getElementById(this.runPlanId));
|
||||||
if (that.myChart) {
|
if (this.myChart) {
|
||||||
that.myChart.setOption(that.option);
|
this.myChart.setOption(this.option);
|
||||||
that.reSize({ width: document.documentElement.clientWidth, height: document.documentElement.clientHeight - 55 });
|
this.reSize({ width: document.documentElement.clientWidth, height: document.documentElement.clientHeight - 55 });
|
||||||
}
|
}
|
||||||
resolve(true);
|
|
||||||
});
|
});
|
||||||
}
|
resolve(true);
|
||||||
);
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
reject(error);
|
reject(error);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
},
|
},
|
||||||
updateRunPlanData(data) {
|
updateRunPlanData(data) {
|
||||||
const stations = this.$store.state.runPlan.stations;
|
const stations = this.$store.state.runPlan.stations;
|
||||||
|
@ -30,6 +30,7 @@ import {getRpDetailByUserMapId, getUserMapDetailByMapId} from '@/api/designPlatf
|
|||||||
import { loadMapDataById } from '@/utils/loaddata';
|
import { loadMapDataById } from '@/utils/loaddata';
|
||||||
import { getPublishMapInfo } from '@/api/jmap/map';
|
import { getPublishMapInfo } from '@/api/jmap/map';
|
||||||
import DataTable from './menus/components/dataTable';
|
import DataTable from './menus/components/dataTable';
|
||||||
|
import echarts from 'echarts';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'PlanSchedule',
|
name: 'PlanSchedule',
|
||||||
@ -467,35 +468,16 @@ export default {
|
|||||||
loadInitChart() {
|
loadInitChart() {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
try {
|
try {
|
||||||
const that = this;
|
if (this.myChart && this.myChart.isDisposed) {
|
||||||
// 加载echart配置
|
this.myChart.clear();
|
||||||
require.config(
|
|
||||||
{
|
|
||||||
paths: {
|
|
||||||
echarts: './js/dist'
|
|
||||||
}
|
}
|
||||||
|
if (this.$route.query.planName) {
|
||||||
|
this.option.title.text = this.mapName;
|
||||||
}
|
}
|
||||||
);
|
this.myChart = echarts.init(document.getElementById(this.runPlanId));
|
||||||
// 按需加载所需图表,如需动态类型切换功能,别忘了同时加载相应图表
|
this.myChart.setOption(this.option);
|
||||||
require(
|
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
|
||||||
[
|
|
||||||
'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);
|
resolve(true);
|
||||||
}
|
|
||||||
);
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
reject(error);
|
reject(error);
|
||||||
}
|
}
|
||||||
|
@ -14,6 +14,7 @@ import { mapGetters } from 'vuex';
|
|||||||
import { getStationList, queryRunPlan, queryRunPlanTemplate, queryRunPlanDaily } from '@/api/runplan';
|
import { getStationList, queryRunPlan, queryRunPlanTemplate, queryRunPlanDaily } from '@/api/runplan';
|
||||||
import { timeFormat } from '@/utils/date';
|
import { timeFormat } from '@/utils/date';
|
||||||
import { UrlConfig } from '@/router/index';
|
import { UrlConfig } from '@/router/index';
|
||||||
|
import echarts from 'echarts';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'RunPlan',
|
name: 'RunPlan',
|
||||||
@ -279,32 +280,15 @@ export default {
|
|||||||
loadInitChart() {
|
loadInitChart() {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
try {
|
try {
|
||||||
const that = this;
|
|
||||||
// 加载echart配置
|
if (this.myChart && this.myChart.isDisposed) {
|
||||||
require.config(
|
this.myChart.clear();
|
||||||
{
|
|
||||||
paths: {
|
|
||||||
echarts: './js/dist'
|
|
||||||
}
|
}
|
||||||
}
|
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 });
|
||||||
require(
|
// this.myChart.on('click', this.mouseClick);
|
||||||
[
|
|
||||||
'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);
|
resolve(true);
|
||||||
}
|
|
||||||
);
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
reject(error);
|
reject(error);
|
||||||
}
|
}
|
||||||
|
@ -65,7 +65,11 @@ module.exports = {
|
|||||||
ignore: ['.*']
|
ignore: ['.*']
|
||||||
}
|
}
|
||||||
])
|
])
|
||||||
]
|
],
|
||||||
|
externals: {
|
||||||
|
'echarts': 'echarts' // 配置使用CDN
|
||||||
|
// 'element-ui': 'ELEMENT'
|
||||||
|
}
|
||||||
},
|
},
|
||||||
chainWebpack(config) {
|
chainWebpack(config) {
|
||||||
config.plugins.delete('preload'); // TODO: need test
|
config.plugins.delete('preload'); // TODO: need test
|
||||||
|
Loading…
Reference in New Issue
Block a user