sk_fems_ui commit
This commit is contained in:
unknown
817
pages/ems/base/MonthlyReportReadPage.vue
Normal file
817
pages/ems/base/MonthlyReportReadPage.vue
Normal file
@ -0,0 +1,817 @@
|
||||
<template>
|
||||
<div class="l-layout">
|
||||
<v-row ref="searchFilter">
|
||||
<v-col :cols="12">
|
||||
<v-card class="searchFilter">
|
||||
<v-row class="search-box" align="center" no-gutters>
|
||||
<v-col :cols="1">
|
||||
<label for="" class="search-box-label">
|
||||
<v-icon x-small color="primary" class="mr-1"
|
||||
>mdi-record-circle</v-icon
|
||||
>
|
||||
기간
|
||||
</label>
|
||||
</v-col>
|
||||
<v-col :cols="2">
|
||||
<v-text-field
|
||||
id="startpicker"
|
||||
ref="startpicker"
|
||||
v-model="targetDateTimeObject.value"
|
||||
:class="'v-input__custom'"
|
||||
readonly
|
||||
outlined
|
||||
:hide-details="true"
|
||||
>
|
||||
<template #append>
|
||||
<v-icon size="20">$icoCalendar</v-icon>
|
||||
</template>
|
||||
<template #append-outer>
|
||||
<div
|
||||
ref="startpicker-container"
|
||||
id="startpicker-container"
|
||||
></div>
|
||||
</template>
|
||||
</v-text-field>
|
||||
</v-col>
|
||||
<v-spacer></v-spacer>
|
||||
<v-col :cols="2" class="d-flex justify-end align-center">
|
||||
<BtnSearch @click="search" class="mr-1" />
|
||||
<div id="btnExeclDownload">
|
||||
<v-btn :ripple="false" @click="downloadExcelFile">액셀</v-btn>
|
||||
</div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row ref="contents">
|
||||
<v-col :cols="12" style="height: 100%">
|
||||
<v-card class="pb-5">
|
||||
<v-row class="pa-5">
|
||||
<v-col :cols="12">
|
||||
<v-icon x-small color="primary" class="mr-1"
|
||||
>mdi-record-circle</v-icon
|
||||
>
|
||||
<span class="custom-title-4">권역 종합</span>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-col :cols="12">
|
||||
<div
|
||||
ref="gridParent01"
|
||||
class="px-5"
|
||||
:style="{ height: 'calc(25vh - 90px)' }"
|
||||
>
|
||||
<component
|
||||
:is="loadGrid01 ? 'Grid' : null"
|
||||
:gridName="gridName01"
|
||||
:parentPrgmId="myPrgmId"
|
||||
ref="rowGrid01"
|
||||
/>
|
||||
</div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row class="pa-5">
|
||||
<v-col :cols="12">
|
||||
<v-icon x-small color="primary" class="mr-1"
|
||||
>mdi-record-circle</v-icon
|
||||
>
|
||||
<span class="custom-title-4">에너지원별 종합</span>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-col :cols="12">
|
||||
<div
|
||||
ref="gridParent02"
|
||||
class="px-5"
|
||||
:style="{ height: 'calc(25vh - 90px)' }"
|
||||
>
|
||||
<component
|
||||
:is="loadGrid02 ? 'Grid' : null"
|
||||
:gridName="gridName02"
|
||||
:parentPrgmId="myPrgmId"
|
||||
ref="rowGrid02"
|
||||
/>
|
||||
</div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row class="pa-5">
|
||||
<v-col :cols="12">
|
||||
<v-icon x-small color="primary" class="mr-1"
|
||||
>mdi-record-circle</v-icon
|
||||
>
|
||||
<span class="custom-title-4">조직별 종합</span>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-col :cols="12">
|
||||
<div
|
||||
ref="gridParent03"
|
||||
class="px-5"
|
||||
:style="{ height: 'calc(25vh - 90px)' }"
|
||||
>
|
||||
<component
|
||||
:is="loadGrid03 ? 'Grid' : null"
|
||||
:gridName="gridName03"
|
||||
:parentPrgmId="myPrgmId"
|
||||
ref="rowGrid03"
|
||||
/>
|
||||
</div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { mapState, mapMutations, mapActions } from 'vuex';
|
||||
import mixinGlobal from '@/mixin/global.js';
|
||||
import SelectDate from '~/components/common/select/SelectDate';
|
||||
import SelectDateVc from '~/components/common/select/SelectDateVc';
|
||||
import FtnPlcMultiPop from '~/components/common/modal/FtnPlcMultiPop';
|
||||
import TuiDatepicker from 'tui-date-picker';
|
||||
import BtnSearch from '~/components/common/button/BtnSearch';
|
||||
import BtnExcelDownload from '~/components/common/button/BtnExcelDownload';
|
||||
import Utility from '~/plugins/utility';
|
||||
import Grid from '~/components/common/Grid';
|
||||
import XLSX from 'xlsx';
|
||||
let myTitle;
|
||||
let myPrgmId;
|
||||
export default {
|
||||
mixins: [mixinGlobal],
|
||||
async asyncData(context) {
|
||||
const myState = context.store.state;
|
||||
myPrgmId = context.route.query.prgmId;
|
||||
await context.store.commit('setActiveMenuInfo', myState.menuData[myPrgmId]);
|
||||
myTitle = await myState.activeMenuInfo.menuNm;
|
||||
},
|
||||
meta: {
|
||||
title: () => {
|
||||
return myTitle;
|
||||
},
|
||||
prgmId: myPrgmId,
|
||||
closable: true,
|
||||
},
|
||||
components: {
|
||||
SelectDate,
|
||||
SelectDateVc,
|
||||
FtnPlcMultiPop,
|
||||
BtnSearch,
|
||||
BtnExcelDownload,
|
||||
Utility,
|
||||
Grid,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
myPrgmId: myPrgmId,
|
||||
targetDateTimeObject: {
|
||||
value: new Date().toISOString().substr(0, 7),
|
||||
},
|
||||
startDatepickerInstance: null,
|
||||
loadGrid01: false,
|
||||
loadGrid02: false,
|
||||
loadGrid03: false,
|
||||
gridName01: 'rowGrid01',
|
||||
gridName02: 'rowGrid02',
|
||||
gridName03: 'rowGrid03',
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
pageData: state => state.pageData[myPrgmId],
|
||||
}),
|
||||
chkIsFind() {
|
||||
return this.pageData.isFind;
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
chkIsFind(val) {
|
||||
if (val) this.search();
|
||||
},
|
||||
'targetDateTimeObject.value': function() {
|
||||
this.setPageData({ isFind: true });
|
||||
},
|
||||
},
|
||||
beforeCreate() {
|
||||
myPrgmId = this.$route.query.prgmId;
|
||||
this.$store.dispatch('chkOpenTabList', {
|
||||
key: 'create',
|
||||
prgmId: myPrgmId,
|
||||
defaultData: defaultData,
|
||||
});
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
...mapMutations({
|
||||
setPageData: 'setPageData',
|
||||
setGridData: 'setGridData',
|
||||
setGridColumn: 'setGridColumn',
|
||||
setGridOption: 'setGridOption',
|
||||
}),
|
||||
...mapActions({
|
||||
postApi: 'modules/list/postApi',
|
||||
postUpdateApi: 'modules/list/postUpdateApi',
|
||||
postApiReturn: 'modules/list/postApiReturn',
|
||||
chkOpenTabList: 'chkOpenTabList',
|
||||
}),
|
||||
async init() {
|
||||
await this.gridInit();
|
||||
this.tuiCalendarInit();
|
||||
},
|
||||
tuiCalendarInit() {
|
||||
const startContainer = document.getElementById('startpicker-container');
|
||||
const startTarget = document.getElementById('startpicker');
|
||||
|
||||
this.startDatepickerInstance = new TuiDatepicker(startContainer, {
|
||||
date: new Date(),
|
||||
language: 'ko',
|
||||
type: 'month',
|
||||
input: {
|
||||
element: startTarget,
|
||||
format: 'YYYY-MM', //"YYYY-MM-DD" //this.format
|
||||
},
|
||||
timePicker: false,
|
||||
});
|
||||
this.startDatepickerInstance.on('change', () => this.getStartDt());
|
||||
},
|
||||
getStartDt() {
|
||||
const dt = this.startDatepickerInstance.getDate();
|
||||
|
||||
this.targetDateTimeObject.value = String(dt.toISOString()).substr(0, 7);
|
||||
},
|
||||
async gridInit() {
|
||||
const gridHeight01 = this.$refs.gridParent01.offsetHeight - 36;
|
||||
const gridHeight02 = this.$refs.gridParent02.offsetHeight - 36;
|
||||
const gridHeight03 = this.$refs.gridParent03.offsetHeight - 36;
|
||||
|
||||
const myOptions = {
|
||||
scrollX: false,
|
||||
};
|
||||
this.setGridOption({
|
||||
gridKey: this.gridName01,
|
||||
value: Object.assign(
|
||||
Utility.defaultGridOption(gridHeight01),
|
||||
myOptions,
|
||||
),
|
||||
});
|
||||
|
||||
this.setGridOption({
|
||||
gridKey: this.gridName02,
|
||||
value: Object.assign(
|
||||
Utility.defaultGridOption(gridHeight02),
|
||||
myOptions,
|
||||
),
|
||||
});
|
||||
|
||||
this.setGridOption({
|
||||
gridKey: this.gridName03,
|
||||
value: Object.assign(
|
||||
Utility.defaultGridOption(gridHeight03),
|
||||
myOptions,
|
||||
),
|
||||
});
|
||||
|
||||
var params = this.makeParams();
|
||||
|
||||
await this.getGridData01(params);
|
||||
await this.getGridData02(params);
|
||||
await this.getGridData03(params);
|
||||
},
|
||||
makeParams() {
|
||||
var params = {};
|
||||
|
||||
params['year'] = this.targetDateTimeObject.value.substr(0, 4);
|
||||
params['month'] = this.targetDateTimeObject.value.substr(5, 2);
|
||||
params['lang'] = 'ko_KR';
|
||||
params['blocId'] = this.userInfo.blocId;
|
||||
params['blocPlcCd'] = 'PLC00002';
|
||||
|
||||
return params;
|
||||
},
|
||||
async getGridData01(params) {
|
||||
var res = null;
|
||||
var columnList = [
|
||||
{ header: '에너지', name: 'mttNm', align: 'left' },
|
||||
{
|
||||
header: '계획 사용량',
|
||||
name: 'planQty',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '실적 사용량',
|
||||
name: 'useQty',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '전년동월대비 증감률',
|
||||
name: 'preYyQtyRate',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '전월대비 증감률',
|
||||
name: 'preMmQtyRate',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '비용(원)',
|
||||
name: 'useCost',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '전년동월대비 비용 증감률',
|
||||
name: 'preYyCostRate',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '전월대비 비용 증감률',
|
||||
name: 'preMmCostRate',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: 'TOE',
|
||||
name: 'toe',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: 'tCO2',
|
||||
name: 'tco2',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
];
|
||||
|
||||
this.loadGrid01 = false;
|
||||
|
||||
res = await this.postApiReturn({
|
||||
apiKey: 'selectMonthReportFactory',
|
||||
resKey: 'monthReportFactory',
|
||||
sendParam: params,
|
||||
});
|
||||
|
||||
this.setGridColumn({
|
||||
gridKey: this.gridName01,
|
||||
value: columnList,
|
||||
});
|
||||
|
||||
this.setGridData({
|
||||
gridKey: this.gridName01,
|
||||
value: res,
|
||||
});
|
||||
|
||||
this.loadGrid01 = true;
|
||||
this.setPageData({ isFind: false });
|
||||
},
|
||||
async getGridData02(params) {
|
||||
var res = null;
|
||||
var columnList = [
|
||||
{ header: '에너지', name: 'mttNm', align: 'left' },
|
||||
{ header: '상위공정', name: 'eccNm', align: 'left' },
|
||||
{
|
||||
header: '계획 사용량',
|
||||
name: 'planQty',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '실적 사용량',
|
||||
name: 'useQty',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '전년동월대비 증감률',
|
||||
name: 'preYyQtyRate',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '전월대비 증감률',
|
||||
name: 'preMmQtyRate',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '비용(원)',
|
||||
name: 'useCost',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '전년동월대비 비용 증감률',
|
||||
name: 'preYyCostRate',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '전월대비 비용 증감률',
|
||||
name: 'preMmCostRate',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: 'TOE',
|
||||
name: 'toe',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: 'tCO2',
|
||||
name: 'tco2',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
];
|
||||
|
||||
this.loadGrid02 = false;
|
||||
|
||||
res = await this.postApiReturn({
|
||||
apiKey: 'selectMonthReportEnergy',
|
||||
resKey: 'monthReportEnergy',
|
||||
sendParam: params,
|
||||
});
|
||||
|
||||
setRowSpanAttribute(res, 'mttNm');
|
||||
|
||||
this.setGridColumn({
|
||||
gridKey: this.gridName02,
|
||||
value: columnList,
|
||||
});
|
||||
|
||||
this.setGridData({
|
||||
gridKey: this.gridName02,
|
||||
value: res,
|
||||
});
|
||||
|
||||
this.loadGrid02 = true;
|
||||
this.setPageData({ isFind: false });
|
||||
},
|
||||
async getGridData03(params) {
|
||||
var res = null;
|
||||
var columnList = [
|
||||
{ header: '상위공정', name: 'upPlcNm', align: 'left' },
|
||||
{ header: '공정', name: 'eccNm', align: 'left' },
|
||||
{ header: '에너지', name: 'mttNm', align: 'left' },
|
||||
{
|
||||
header: '계획 사용량',
|
||||
name: 'planQty',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '실적 사용량',
|
||||
name: 'useQty',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '전년동월대비 증감률',
|
||||
name: 'preYyQtyRate',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '전월대비 증감률',
|
||||
name: 'preMmQtyRate',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '비용(원)',
|
||||
name: 'useCost',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '전년동월대비 비용 증감률',
|
||||
name: 'preYyCostRate',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: '전월대비 비용 증감률',
|
||||
name: 'preMmCostRate',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: 'TOE',
|
||||
name: 'toe',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
{
|
||||
header: 'tCO2',
|
||||
name: 'tco2',
|
||||
align: 'right',
|
||||
formatter: numberFormatter,
|
||||
},
|
||||
];
|
||||
|
||||
this.loadGrid03 = false;
|
||||
|
||||
res = await this.postApiReturn({
|
||||
apiKey: 'selectMonthReportDept',
|
||||
resKey: 'monthReportDept',
|
||||
sendParam: params,
|
||||
});
|
||||
|
||||
setRowSpanAttribute(res, 'upPlcNm');
|
||||
// setRowSpanAttribute(res, 'mttNm', ['upPlcNm', 'mttNm']);
|
||||
|
||||
this.setGridColumn({
|
||||
gridKey: this.gridName03,
|
||||
value: columnList,
|
||||
});
|
||||
|
||||
this.setGridData({
|
||||
gridKey: this.gridName03,
|
||||
value: res,
|
||||
});
|
||||
|
||||
this.loadGrid03 = true;
|
||||
this.setPageData({ isFind: false });
|
||||
},
|
||||
async search() {
|
||||
var params = this.makeParams();
|
||||
|
||||
await this.getGridData01(params);
|
||||
await this.getGridData02(params);
|
||||
await this.getGridData03(params);
|
||||
},
|
||||
downloadExcelFile() {
|
||||
this.makeExcelFile('rowGrid01', '권역 종합.xlsx');
|
||||
this.makeExcelFile('rowGrid02', '에너지원별 종합.xlsx');
|
||||
this.makeExcelFile('rowGrid03', '조직별 종합.xlsx');
|
||||
},
|
||||
makeExcelFile(gridName, fileName) {
|
||||
var xlsData = this.makeExcelData(gridName);
|
||||
var workBook = XLSX.utils.book_new();
|
||||
var excelData = XLSX.utils.json_to_sheet(xlsData);
|
||||
var sheetName = fileName;
|
||||
XLSX.utils.book_append_sheet(workBook, excelData, sheetName);
|
||||
XLSX.writeFile(workBook, fileName);
|
||||
},
|
||||
makeExcelData(gridName) {
|
||||
var xlsData = null;
|
||||
var xlsHeader = this.pageData[gridName].column;
|
||||
var xlsRowData = this.pageData[gridName].data;
|
||||
var tmpData = [];
|
||||
var tmpMap = {};
|
||||
|
||||
xlsRowData.map(item => {
|
||||
xlsHeader.map(v => {
|
||||
// return Object.assign(tmpMap, { [v.header]: item[v.name] || 0 });
|
||||
var value = item[v.name];
|
||||
if (value == undefined) {
|
||||
value = 0;
|
||||
}
|
||||
if (typeof value === 'number') {
|
||||
value = parseFloat(
|
||||
Utility.setFormatIntDecimal(value, 2).replace(',', ''),
|
||||
);
|
||||
}
|
||||
return Object.assign(tmpMap, { [v.header]: value || 0.0 });
|
||||
});
|
||||
tmpData = tmpData.concat(tmpMap);
|
||||
tmpMap = {};
|
||||
});
|
||||
xlsData = tmpData;
|
||||
|
||||
return xlsData;
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const defaultData = {
|
||||
isFind: false,
|
||||
rowGrid01: {
|
||||
data: [],
|
||||
option: {},
|
||||
column: [],
|
||||
},
|
||||
rowGrid02: {
|
||||
data: [],
|
||||
option: {},
|
||||
column: [],
|
||||
},
|
||||
rowGrid03: {
|
||||
data: [],
|
||||
option: {},
|
||||
column: [],
|
||||
},
|
||||
};
|
||||
|
||||
function setRowSpanAttribute(res, targetAttributeName, targetAttributeList) {
|
||||
if (!(res.length && res.length >= 2)) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (targetAttributeList == undefined) {
|
||||
var valueList = [];
|
||||
var rowSpanValueList = [];
|
||||
var currentIdx = 0;
|
||||
for (var i = 0; i < res.length; i++) {
|
||||
valueList.push(res[i][targetAttributeName]);
|
||||
}
|
||||
|
||||
rowSpanValueList[0] = [valueList[0], 1, currentIdx];
|
||||
for (var i = 1; i < valueList.length; i++) {
|
||||
currentIdx += 1;
|
||||
if (valueList[i] === rowSpanValueList[rowSpanValueList.length - 1][0]) {
|
||||
rowSpanValueList[rowSpanValueList.length - 1][1] += 1;
|
||||
} else {
|
||||
rowSpanValueList[rowSpanValueList.length] = [
|
||||
valueList[i],
|
||||
1,
|
||||
currentIdx,
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
for (var i = 0; i < rowSpanValueList.length; i++) {
|
||||
if (rowSpanValueList[i][1] === 1) {
|
||||
continue;
|
||||
}
|
||||
res[rowSpanValueList[i][2]]['_attributes'] = { rowSpan: new Object() };
|
||||
res[rowSpanValueList[i][2]]['_attributes']['rowSpan'][
|
||||
targetAttributeName
|
||||
] = rowSpanValueList[i][1];
|
||||
}
|
||||
} else {
|
||||
// targetAttributeList 전달 ...
|
||||
var valueList = [];
|
||||
var rowSpanValueList = [];
|
||||
var currentIdx = 0;
|
||||
for (var i = 0; i < res.length; i++) {
|
||||
var tempList = [];
|
||||
for (var j = 0; j < targetAttributeList.length; j++) {
|
||||
tempList.push(res[i][targetAttributeList[j]]);
|
||||
}
|
||||
valueList.push(tempList);
|
||||
}
|
||||
|
||||
rowSpanValueList[0] = [valueList[0], 1, currentIdx];
|
||||
for (var i = 1; i < valueList.length; i++) {
|
||||
currentIdx += 1;
|
||||
if (
|
||||
comepareValueWithTargetAttributeList(
|
||||
valueList[i],
|
||||
rowSpanValueList[rowSpanValueList.length - 1][0],
|
||||
)
|
||||
) {
|
||||
rowSpanValueList[rowSpanValueList.length - 1][1] += 1;
|
||||
} else {
|
||||
rowSpanValueList[rowSpanValueList.length] = [
|
||||
valueList[i],
|
||||
1,
|
||||
currentIdx,
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
for (var i = 0; i < rowSpanValueList.length; i++) {
|
||||
if (rowSpanValueList[i][1] === 1) {
|
||||
continue;
|
||||
}
|
||||
res[rowSpanValueList[i][2]]['_attributes'] = { rowSpan: new Object() };
|
||||
res[rowSpanValueList[i][2]]['_attributes']['rowSpan'][
|
||||
targetAttributeName
|
||||
] = rowSpanValueList[i][1];
|
||||
}
|
||||
}
|
||||
|
||||
function comepareValueWithTargetAttributeList(valueList_01, valueList_02) {
|
||||
for (var i = 0; i < valueList_01.length; i++) {
|
||||
if (valueList_01[i] != valueList_02[i]) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
function setRowSpanAttribute_old(
|
||||
res,
|
||||
targetAttributeName,
|
||||
targetAttributeList,
|
||||
) {
|
||||
if (!(res.length && res.length >= 2)) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (targetAttributeList == undefined) {
|
||||
var currentCnt = 1;
|
||||
var currentIdx = 0;
|
||||
var currentValue = res[0][targetAttributeName];
|
||||
for (var i = 1; i < res.length - 1; i++) {
|
||||
if (res[i][targetAttributeName] != currentValue) {
|
||||
if (res[currentIdx]['_attributes'] == undefined) {
|
||||
res[currentIdx]['_attributes'] = { rowSpan: new Object() };
|
||||
}
|
||||
res[currentIdx]['_attributes']['rowSpan'][
|
||||
targetAttributeName
|
||||
] = currentCnt;
|
||||
|
||||
currentValue = res[i][targetAttributeName];
|
||||
currentCnt = 1;
|
||||
currentIdx = i;
|
||||
} else if (
|
||||
res[i][targetAttributeName] == currentValue &&
|
||||
i == res.length - 2
|
||||
) {
|
||||
currentCnt = currentCnt + 1;
|
||||
if (res[currentIdx]['_attributes'] == undefined) {
|
||||
res[currentIdx]['_attributes'] = { rowSpan: new Object() };
|
||||
}
|
||||
res[currentIdx]['_attributes']['rowSpan'][
|
||||
targetAttributeName
|
||||
] = currentCnt;
|
||||
} else {
|
||||
currentCnt = currentCnt + 1;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
var currentCnt = 1;
|
||||
var currentIdx = 0;
|
||||
for (var i = 1; i < res.length - 1; i++) {
|
||||
if (!compareValue(res, targetAttributeList, currentIdx, i)) {
|
||||
if (res[currentIdx]['_attributes'] == undefined) {
|
||||
res[currentIdx]['_attributes'] = { rowSpan: new Object() };
|
||||
}
|
||||
if (currentCnt != 1) {
|
||||
res[currentIdx]['_attributes']['rowSpan'][
|
||||
targetAttributeName
|
||||
] = currentCnt;
|
||||
}
|
||||
currentCnt = 1;
|
||||
currentIdx = i;
|
||||
} else if (
|
||||
compareValue(res, targetAttributeList, currentIdx, i) &&
|
||||
i == res.length - 2
|
||||
) {
|
||||
currentCnt = currentCnt + 1;
|
||||
if (res[currentIdx]['_attributes'] == undefined) {
|
||||
res[currentIdx]['_attributes'] = { rowSpan: new Object() };
|
||||
}
|
||||
if (currentCnt != 1) {
|
||||
res[currentIdx]['_attributes']['rowSpan'][
|
||||
targetAttributeName
|
||||
] = currentCnt;
|
||||
}
|
||||
} else {
|
||||
currentCnt = currentCnt + 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function compareValue(res, targetAttributeList, currentIdx, targetIdx) {
|
||||
for (var i = 0; i < targetAttributeList.length; i++) {
|
||||
if (
|
||||
res[currentIdx][targetAttributeList[i]] !=
|
||||
res[targetIdx][targetAttributeList[i]]
|
||||
) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
function numberFormatter({ value }) {
|
||||
return Utility.setFormatIntDecimal(value, 2);
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
#startpicker-container,
|
||||
#endpicker-container {
|
||||
position: relative;
|
||||
z-index: 20;
|
||||
}
|
||||
.v-input__custom {
|
||||
flex: 0 0 auto;
|
||||
&.half {
|
||||
width: calc(50% - 20px);
|
||||
}
|
||||
}
|
||||
::v-deep {
|
||||
.tui-timepicker-row {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
background-color: #edf4fc;
|
||||
.tui-timepicker-column.tui-timepicker-colon {
|
||||
color: #000 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user