diff --git a/components/common/chartoptions/SankeyChart.js b/components/common/chartoptions/SankeyChart.js
new file mode 100644
index 0000000..674fe19
--- /dev/null
+++ b/components/common/chartoptions/SankeyChart.js
@@ -0,0 +1,46 @@
+// Sankey chart options
+export function getSankeyChartOption({ isDarkMode = false, data = [], links = [] }) {
+ const chartOption = {
+ backgroundColor: '#FFFFFF',
+ series: [
+ {
+ data,
+ links,
+
+ layoutIterations: 0,
+ type: 'sankey',
+ left: 25.0,
+ top: 20.0,
+ right: 120,
+ bottom: 50.0,
+ nodeGap: 10,
+ nodeAlign: 'left',
+ lineStyle: {
+ color: 'source',
+ curveness: 0.5,
+ },
+ // nodeWidth:10,
+ // triggerEvent: true,
+ itemStyle: {
+ //color: '#1f77b4',
+ //borderColor: '#1f77b4'
+ },
+ label: {
+ color: isDarkMode
+ ? '#FFFFFFD9'
+ : '#000000E0',
+ // fontFamily: 'Arial',
+ fontSize: 14,
+ },
+ },
+ ],
+ tooltip: {
+ trigger: 'item',
+ },
+ };
+
+ return chartOption;
+}
+
+export default getSankeyChartOption;
+
diff --git a/components/common/modal/EqpmSelectPop.vue b/components/common/modal/EqpmSelectPop.vue
index d3f3e5a..382a439 100644
--- a/components/common/modal/EqpmSelectPop.vue
+++ b/components/common/modal/EqpmSelectPop.vue
@@ -404,8 +404,8 @@ export default {
rowHeight: 'auto',
};
if (this.isMulti) {
- // myOptions['rowHeaders'] = [{ type: 'checkbox' }];
- // myOptions['rowHeight'] = 'auto';
+ myOptions['rowHeaders'] = [{ type: 'checkbox' }];
+ myOptions['rowHeight'] = 'auto';
}
@@ -523,12 +523,11 @@ export default {
this.loadGrid = true;
- // this.$nextTick(() => {
- // if (this.isMulti) {
- // this.getChecked();
- // }
- // });
-
+ this.$nextTick(() => {
+ if (this.isMulti) {
+ this.getChecked();
+ }
+ });
},
setUpdate() {
if (this.isMulti) {
diff --git a/pages/ems/effc/EnrgMapPage.vue b/pages/ems/effc/EnrgMapPage.vue
index fed1f9d..b6699e6 100644
--- a/pages/ems/effc/EnrgMapPage.vue
+++ b/pages/ems/effc/EnrgMapPage.vue
@@ -14,9 +14,9 @@
-
-
+
+
@@ -47,8 +47,13 @@
@@ -68,6 +73,8 @@ import SelectBox from '@/components/common/select/SelectBox';
import DateUtility from '~/plugins/dateUtility';
import Chart from '~/components/common/Chart';
+import getSankeyChartOption from "~/components/common/chartoptions/sankeyChart";
+
let myTitle;
let myPrgmId;
@@ -101,6 +108,8 @@ export default {
selectValue01: null,
loadChart: false,
chartName: 'sankeyChart',
+ sankeyChartData: [],
+ sankeyChartLinks: []
};
},
computed: {
@@ -148,6 +157,16 @@ export default {
});
}
},
+ isDarkMode(newVal) {
+ this.setChartOption({
+ chartKey: this.chartName,
+ value: getSankeyChartOption({
+ isDarkMode: newVal,
+ data: this.sankeyChartData,
+ links: this.sankeyChartLinks
+ })
+ });
+ },
},
async beforeCreate() {
myPrgmId = this.$route.query.prgmId;
@@ -159,9 +178,6 @@ export default {
},
async created() { },
async mounted() {
- // this.initTest();
- // return;
-
this.init();
// document.querySelector('.icon_arrow').style.width = document.querySelector('.iconArrowCols').clientWidth-20 + "px";
},
@@ -176,10 +192,8 @@ export default {
...mapActions({
getCodeList: 'modules/search/getCodeList',
}),
- initTest() {
-
- const randomNumber = n => Math.floor(Math.random() * n) + 1;
-
+ initTestChart() {
+ const randomNumber = n => Math.floor(Math.random() * n) + 1;
const makeData = [
{ name: 'A' },
{ name: 'B' },
@@ -205,45 +219,13 @@ export default {
]);
}
- const chartOption = {
- backgroundColor: '#FFFFFF',
- series: [
- {
- layoutIterations: 0,
- type: 'sankey',
- left: 25.0,
- top: 20.0,
- right: 120,
- bottom: 50.0,
- // nodeWidth:10,
- nodeGap: 10,
- nodeAlign: 'left',
- data: makeData,
- links: makeLinks,
- lineStyle: {
- color: 'source',
- curveness: 0.5,
- },
- // triggerEvent: true,
- itemStyle: {
- //color: '#1f77b4',
- //borderColor: '#1f77b4'
- },
- label: {
- color: this.isDarkMode
- ? 'rgba(250,250,250,0.7)'
- : 'rgba(0,0,0,0.7)',
- fontFamily: 'Arial',
- fontSize: 12,
- },
- },
- ],
- tooltip: {
- trigger: 'item',
- },
- };
-
-
+ this.sankeyChartData = makeData;
+ this.sankeyChartLinks = makeLinks;
+ const chartOption = getSankeyChartOption({
+ isDarkMode: this.isDarkMode,
+ data: makeData,
+ links: makeLinks
+ });
this.setChartOption({ chartKey: this.chartName, value: chartOption });
this.$nextTick(() => {
this.loadChart = true;
@@ -254,7 +236,11 @@ export default {
this.setFromDt();
},
async search() {
- await this.getChartData();
+ try{
+ await this.getChartData();
+ }catch(err){
+ this.initTestChart();
+ }
this.setPageData({
isFind: false,
});
@@ -458,43 +444,13 @@ export default {
};
}
- const chartOption = {
- backgroundColor: '#FFFFFF',
- series: [
- {
- layoutIterations: 0,
- type: 'sankey',
- left: 25.0,
- top: 20.0,
- right: 120,
- bottom: 50.0,
- // nodeWidth:10,
- nodeGap: 10,
- nodeAlign: 'left',
- data: makeData,
- links: makeLinks,
- lineStyle: {
- color: 'source',
- curveness: 0.5,
- },
- // triggerEvent: true,
- itemStyle: {
- //color: '#1f77b4',
- //borderColor: '#1f77b4'
- },
- label: {
- color: this.isDarkMode
- ? 'rgba(250,250,250,0.7)'
- : 'rgba(0,0,0,0.7)',
- fontFamily: 'Arial',
- fontSize: 12,
- },
- },
- ],
- tooltip: {
- trigger: 'item',
- },
- };
+ this.sankeyChartData = makeData;
+ this.sankeyChartLinks = makeLinks;
+ const chartOption = getSankeyChartOption({
+ isDarkMode: this.isDarkMode,
+ data: makeData,
+ links: makeLinks
+ });
this.setChartOption({ chartKey: this.chartName, value: chartOption });