gitadmin/sk_fems_ui
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix bugs 47, 145

Browse Source
This commit is contained in:
Tran Van Dung/(Tran Van Dung)/현장대리인/SK
2025-08-11 11:51:28 +07:00
parent 1ece377457
commit d6dd66c4b3
3 changed files with 97 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
components/common/chartoptions/SankeyChart.js Normal file
View File

@ -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;

15
components/common/modal/EqpmSelectPop.vue
View File

@ -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) {

132
pages/ems/effc/EnrgMapPage.vue
View File

@ -14,9 +14,9 @@
<!-- 대상일 -->
<component :is="'Datepicker'" :parentPrgmId="myPrgmId" :label="'대상일'" :labelCols="3" customClass="datepicker-large" />
</v-col>
<v-col :cols="4" class="text-right">
<BtnSearch @click="search" size="large" />
<v-col :cols="6" class="text-right">
<!-- 조회버튼 -->
<BtnSearch @click="search" size="large" />
</v-col>
</v-row>
</v-card>
@ -47,8 +47,13 @@
</v-row>
<div class="px-5" style="height: 80%">
<div ref="chartParent" class="w100 h100">
<component :ref="chartName" class="w100 h100" :is="loadChart ? 'Chart' : null" :parentPrgmId="myPrgmId"
:chartName="chartName" />
<component
:ref="chartName"
class="w100 h100"
:is="loadChart ? 'Chart' : null"
:parentPrgmId="myPrgmId"
:chartName="chartName"
/>
</div>
</div>
</v-card>
@ -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 });