549 lines
15 KiB
JavaScript
549 lines
15 KiB
JavaScript
const INIT_STATE = {
|
||
comCd: '',
|
||
userInfo: {},
|
||
indexRoot: {
|
||
root: '/',
|
||
menuNm: ' ',
|
||
menuId: null,
|
||
prgmId: 'myIndex',
|
||
id: 'myIndex',
|
||
},
|
||
myHomeTabItems: {
|
||
closable: false,
|
||
id: '/ems/base/DashboardPage',
|
||
prgmId: 'PRG0001',
|
||
title: '대시보드',
|
||
to: '/ems/base/DashboardPage?prgmId=PRG0001',
|
||
},
|
||
myHome: {
|
||
root: '/ems/base/DashboardPage?prgmId=PRG0001',
|
||
menuNm: '대시보드',
|
||
menuId: 'MNU0001',
|
||
prgmId: 'PRG0001',
|
||
id: 'PRG0001',
|
||
},
|
||
menuData:
|
||
localStorage.getItem('menuData') != null
|
||
? JSON.parse(localStorage.getItem('menuData'))
|
||
: {
|
||
myIndex: {
|
||
root: '/',
|
||
menuNm: ' ',
|
||
menuId: null,
|
||
prgmId: 'myIndex',
|
||
id: 'myIndex',
|
||
},
|
||
PRG0001: {
|
||
root: '/ems/base/DashboardPage?prgmId=PRG0001',
|
||
menuNm: '대시보드',
|
||
menuId: 'MNU0001',
|
||
prgmId: 'PRG0001',
|
||
id: 'PRG0001',
|
||
},
|
||
},
|
||
treevieItems: [],
|
||
// activeTab: "",
|
||
activeMenuInfo: {
|
||
prgmId: '0',
|
||
},
|
||
// 프로그램 아이디 (prgmId) 를 키로 해당 페이지별 데이타 세팅
|
||
pageData:
|
||
localStorage.getItem('pageData') != null
|
||
? JSON.parse(localStorage.getItem('pageData'))
|
||
: {
|
||
// myIndex: {},
|
||
// PRG0001: {},
|
||
// PRG0002: {},
|
||
// PRG0003: {},
|
||
// PRG0004: {},
|
||
// PRG0005: {},
|
||
// PRG0006: {},
|
||
// PRG0007: {},
|
||
// PRG0008: {},
|
||
// PRG0009: {},
|
||
// PRG0010: {},
|
||
// PRG0011: {},
|
||
// PRG0012: {},
|
||
// PRG0013: {},
|
||
// PRG0014: {},
|
||
// PRG0015: {},
|
||
// PRG0016: {},
|
||
// PRG0017: {},
|
||
// PRG0018: {},
|
||
// PRG0019: {},
|
||
// PRG0020: {},
|
||
// PRG0021: {},
|
||
// PRG0022: {},
|
||
// PRG0023: {},
|
||
// PRG0024: {},
|
||
// PRG0025: {},
|
||
// PRG0026: {},
|
||
// PRG0027: {},
|
||
// PRG0028: {},
|
||
// PRG0029: {},
|
||
// PRG0030: {},
|
||
// PRG0031: {},
|
||
// PRG0032: {},
|
||
// PRG0033: {},
|
||
// PRG0034: {},
|
||
// PRG0040: {},
|
||
// PRG0041: {},
|
||
// PRG0049: {},
|
||
// PRG0050: {},
|
||
// PRG0051: {},
|
||
// PRG0059: {},
|
||
// PRG0060: {},
|
||
// PRG0061: {},
|
||
// PRG0062: {},
|
||
// PRG0065: {},
|
||
// PRG0066: {},
|
||
// PRG0104: {},
|
||
// PRG0105: {},
|
||
// PRG1101: {},
|
||
// PRG1102: {},
|
||
// PRG3102: {},
|
||
// PRG3103: {},
|
||
// PRG3105: {},
|
||
// PRG3106: {},
|
||
// PRG3109: {},
|
||
// PRG3110: {},
|
||
// PRG3111: {},
|
||
// PRG4107: {},
|
||
// PRG0053: {},
|
||
// PRG0052: {},
|
||
// PRG0054: {},
|
||
// PRG0055: {},
|
||
// PRG4107: {},
|
||
// PRG4109: {},
|
||
// PRG4110: {},
|
||
// PRG4111: {},
|
||
// PRG0063: {},
|
||
// PRG4101: {},
|
||
// PRG4102: {},
|
||
// PRG4108: {},
|
||
// PRG0064: {},
|
||
},
|
||
// today: null,
|
||
// refreshPageFlag: false, // 페이지 새로고침 여부
|
||
openTabList: [], // 현재 열려있는 탭 목록
|
||
isDarkMode: true,
|
||
holidayList: null, // 휴일목록
|
||
drawer: true, // default.vue 좌측사이드 메뉴관련
|
||
};
|
||
|
||
export const state = () => Object.assign({}, INIT_STATE);
|
||
|
||
export const mutations = {
|
||
// 활성화 페이지 메뉴정보 set
|
||
setActiveMenuInfo(state, payload) {
|
||
// console.log("=======================================================");
|
||
// console.log(
|
||
// ">>>>>>>>>> ",
|
||
// payload.prgmId,
|
||
// " , ",
|
||
// payload.menuNm,
|
||
// " <<<<<<<<<<"
|
||
// );
|
||
state.activeMenuInfo = payload;
|
||
},
|
||
setMyHome: (state, payload) => {
|
||
state.myHome = payload;
|
||
},
|
||
setIndexRoot: (state, payload) => {
|
||
state.indexRoot = payload;
|
||
},
|
||
// 메뉴 set => prgmId를 키로 재구성
|
||
setMenuItems(state, payload) {
|
||
// state.treevieItems = payload;
|
||
localStorage.setItem('menuData', JSON.stringify(payload));
|
||
state.menuData = Object.assign(INIT_STATE.menuData, payload); // 일단 추가
|
||
},
|
||
// 메뉴 set
|
||
setTreevieItems(state, payload) {
|
||
// state.treevieItems = payload;
|
||
state.treevieItems = INIT_STATE.treevieItems; // 일단 추가
|
||
state.treevieItems = state.treevieItems.concat(payload); // 일단 추가
|
||
},
|
||
// 휴일목록 set
|
||
setHolidayList(state, payload) {
|
||
state.holidayList = payload;
|
||
},
|
||
|
||
// 페이지 데이터 set => 초기세팅
|
||
pageInit: (state, payload) => {
|
||
state.pageData[payload.prgmId] = Object.assign({}, payload.value);
|
||
},
|
||
// 페이지 데이터 set => 업데이트
|
||
setPageData: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId] = Object.assign(
|
||
state.pageData[state.activeMenuInfo.prgmId],
|
||
payload,
|
||
);
|
||
},
|
||
setWidgetPageData: (state, payload) => {
|
||
state.pageData[payload.prgmId] = Object.assign(
|
||
state.pageData[payload.prgmId],
|
||
payload,
|
||
);
|
||
},
|
||
setDataPathPageData: (state, payload) => {
|
||
const dataPath = payload.pathKey;
|
||
const setData = payload.data;
|
||
state.pageData[state.activeMenuInfo.prgmId][dataPath] = Object.assign(
|
||
state.pageData[state.activeMenuInfo.prgmId][dataPath],
|
||
setData,
|
||
);
|
||
},
|
||
|
||
// 페이지 그리드 데이터 set
|
||
setGridData: (state, payload) => {
|
||
// console.log('check:', state.pageData)
|
||
// console.log('payload:', payload)
|
||
// state.pageData['PRG0001']['dashBoard_grid_01'] = {
|
||
// ...state.pageData['PRG0001']['dashBoard_grid_01'],
|
||
// data: payload.value,
|
||
// };
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.gridKey] = {
|
||
...state.pageData[state.activeMenuInfo.prgmId][payload.gridKey],
|
||
data: payload.value,
|
||
};
|
||
},
|
||
setWidgetGridData: (state, payload) => {
|
||
state.pageData[payload.prgmId][payload.widgetKey][payload.widgetData][
|
||
payload.gridKey
|
||
] = {
|
||
...state.pageData[payload.prgmId][payload.widgetKey][payload.widgetData][
|
||
payload.gridKey
|
||
],
|
||
data: payload.value,
|
||
};
|
||
},
|
||
// 페이지 그리드 컬럼 set
|
||
setGridColumn: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.gridKey].column =
|
||
payload.value;
|
||
// state.pageData['PRG0001']['dashBoard_grid_01'].column =
|
||
// payload.value;
|
||
},
|
||
setWidgetGridColumn: (state, payload) => {
|
||
state.pageData[payload.prgmId][payload.widgetKey][payload.widgetData][
|
||
payload.gridKey
|
||
].column = payload.value;
|
||
},
|
||
// 페이지 그리드 옵견 set
|
||
setGridOption: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][
|
||
payload.gridKey
|
||
].option = Object.assign(
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.gridKey].option,
|
||
payload.value,
|
||
);
|
||
|
||
// state.pageData['PRG0001']['dashBoard_grid_01'].option = Object.assign(
|
||
// state.pageData['PRG0001']['dashBoard_grid_01'].option,
|
||
// payload.value,
|
||
// );
|
||
},
|
||
setWidgetGridOption: (state, payload) => {
|
||
state.pageData[payload.prgmId][payload.widgetKey][payload.widgetData][
|
||
payload.gridKey
|
||
].option = Object.assign(
|
||
state.pageData[payload.prgmId][payload.widgetKey][payload.widgetData][
|
||
payload.gridKey
|
||
].option,
|
||
payload.value,
|
||
);
|
||
},
|
||
// 페이지 그리드 데이터 수정 set
|
||
setGridDataEdit: (state, payload) => {
|
||
const myPrgmId = state.activeMenuInfo.prgmId;
|
||
state.pageData[myPrgmId][payload.gridKey].data[payload.selectRow][
|
||
payload.objKey
|
||
] = payload.value;
|
||
state.pageData[myPrgmId][payload.gridKey + 'Modify'] = true;
|
||
},
|
||
setGridSelectData: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][
|
||
payload.gridKey
|
||
].rowGridSelectData = Object.assign(
|
||
payload.gridSelect
|
||
? {}
|
||
: state.pageData[state.activeMenuInfo.prgmId][payload.gridKey]
|
||
.rowGridSelectData,
|
||
payload.rowGridSelectData,
|
||
);
|
||
|
||
if (payload.rowGridSelectKey >= 0) {
|
||
state.pageData[state.activeMenuInfo.prgmId][
|
||
payload.gridKey
|
||
].rowGridSelectKey = Object.assign(
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.gridKey]
|
||
.rowGridSelectKey,
|
||
payload.rowGridSelectKey,
|
||
);
|
||
}
|
||
},
|
||
// 차트 옵션 set
|
||
setChartOption: (state, payload) => {
|
||
var optionKeys = Object.keys(payload.value);
|
||
optionKeys.forEach(key => {
|
||
if (key == 'series') {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.chartKey][key] = [];
|
||
}
|
||
Object.assign(
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.chartKey][key],
|
||
payload.value[key],
|
||
);
|
||
});
|
||
},
|
||
setWidgetChartOption: (state, payload) => {
|
||
var optionKeys = Object.keys(payload.value);
|
||
optionKeys.forEach(key => {
|
||
if (key == 'series') {
|
||
state.pageData[payload.prgmId][payload.widgetKey][payload.widgetData][
|
||
payload.chartKey
|
||
][key] = [];
|
||
}
|
||
Object.assign(
|
||
state.pageData[payload.prgmId][payload.widgetKey][payload.widgetData][
|
||
payload.chartKey
|
||
][key],
|
||
payload.value[key],
|
||
);
|
||
});
|
||
},
|
||
|
||
setModalChartOption: (state, payload) => {
|
||
var optionKeys = Object.keys(payload.value);
|
||
optionKeys.forEach(key => {
|
||
if (key == 'series') {
|
||
state.pageData[payload.prgmId][payload.modalId][payload.modalDataKey][payload.chartKey][key] = [];
|
||
}
|
||
Object.assign(
|
||
state.pageData[payload.prgmId][payload.modalId][payload.modalDataKey][payload.chartKey][key],
|
||
payload.value[key],
|
||
);
|
||
});
|
||
},
|
||
|
||
// 차트 옵션 set
|
||
setModalChartSeries: (state, payload) => {
|
||
state.pageData[payload.prgmId][payload.modalId][payload.modalDataKey][payload.chartKey].series =
|
||
payload.value;
|
||
},
|
||
// 차트 옵션 set
|
||
setModalChartTooltip: (state, payload) => {
|
||
var optionKeys = Object.keys(payload.value);
|
||
optionKeys.forEach(key => {
|
||
// Object.assign(
|
||
state.pageData[payload.prgmId][payload.modalId][payload.modalDataKey][payload.chartKey].tooltip[key] = payload.value[key]
|
||
// )
|
||
});
|
||
// let keyList = [];
|
||
// keyList = Object.keys(payload.value);
|
||
// for (var i = 0; i < keyList.length; i++) {
|
||
// state.pageData[payload.prgmId][payload.modalId][payload.modalDataKey][payload.chartKey].tooltip[
|
||
// keyList[i]
|
||
// ] = payload.value[keyList[i]];
|
||
// }
|
||
},
|
||
|
||
setWidgetChartYaxisData: (state, payload) => {
|
||
state.pageData[payload.prgmId][payload.widgetKey][payload.widgetData][
|
||
payload.chartKey
|
||
].yAxis = payload.value;
|
||
},
|
||
// 차트 옵션 set
|
||
setChartYAxisData: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.chartKey].yAxis =
|
||
payload.value;
|
||
},
|
||
// 차트 옵션 set
|
||
setChartXAxisData: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.chartKey].xAxis.data =
|
||
payload.value;
|
||
},
|
||
// 차트 옵션 set
|
||
setChartDetailXAxisData: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.chartKey].xAxis =
|
||
payload.value;
|
||
},
|
||
// 차트 옵션 set
|
||
setChartColorData: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.chartKey].color =
|
||
payload.value;
|
||
},
|
||
// 차트 옵션 set
|
||
setChartSeries: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.chartKey].series =
|
||
payload.value;
|
||
},
|
||
// 차트 옵션 set
|
||
setChartTitle: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.chartKey].title =
|
||
payload.value;
|
||
},
|
||
// 차트 옵션 set
|
||
setChartLegend: (state, payload) => {
|
||
let keyList = [];
|
||
keyList = Object.keys(payload.value);
|
||
for (var i = 0; i < keyList.length; i++) {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.chartKey].legend[
|
||
keyList[i]
|
||
] = payload.value[keyList[i]];
|
||
}
|
||
},
|
||
// 차트 옵션 set
|
||
setChartTooltip: (state, payload) => {
|
||
let keyList = [];
|
||
keyList = Object.keys(payload.value);
|
||
for (var i = 0; i < keyList.length; i++) {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.chartKey].tooltip[
|
||
keyList[i]
|
||
] = payload.value[keyList[i]];
|
||
}
|
||
},
|
||
|
||
// 모달 그리드 데이터 set
|
||
setModalGridData: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.modalDataKey][
|
||
payload.modalKey
|
||
][payload.gridKey].data = payload.value;
|
||
},
|
||
// 모달 그리드 컬럼 set
|
||
setModalGridColumn: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.modalDataKey][
|
||
payload.modalKey
|
||
][payload.gridKey].column = payload.value;
|
||
},
|
||
// 모달 그리드 옵견 set
|
||
setModalGridOption: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.modalDataKey][
|
||
payload.modalKey
|
||
][payload.gridKey].option = Object.assign(
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.modalDataKey][
|
||
payload.modalKey
|
||
][payload.gridKey].option,
|
||
payload.value,
|
||
);
|
||
},
|
||
// 위젯 모달 그리드 데이터 set
|
||
setWidgetModalGridData: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.widgetId][
|
||
payload.widgetId + 'Data'
|
||
][payload.modalDataKey][payload.modalKey][payload.gridKey].data =
|
||
payload.value;
|
||
},
|
||
// 위젯 모달 그리드 컬럼 set
|
||
setWidgetModalGridColumn: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.widgetId][
|
||
payload.widgetId + 'Data'
|
||
][payload.modalDataKey][payload.modalKey][payload.gridKey].column =
|
||
payload.value;
|
||
},
|
||
// 위젯 모달 그리드 옵션
|
||
setWidgetModalGridOption: (state, payload) => {
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.widgetId][
|
||
payload.widgetId + 'Data'
|
||
][payload.modalDataKey][payload.modalKey][
|
||
payload.gridKey
|
||
].option = Object.assign(
|
||
state.pageData[state.activeMenuInfo.prgmId][payload.widgetId][
|
||
payload.widgetId + 'Data'
|
||
][payload.modalDataKey][payload.modalKey][payload.gridKey].option,
|
||
payload.value,
|
||
);
|
||
},
|
||
// setRefreshPageFlag: (state, payload) => {
|
||
// state.refreshPageFlag = payload;
|
||
// },
|
||
setOpenTabList: (state, payload) => {
|
||
state.openTabList = payload;
|
||
},
|
||
setThemeChange: (state, payload) => {
|
||
state.isDarkMode = payload;
|
||
},
|
||
setDrawer: (state, payload) => {
|
||
state.drawer = !state.drawer;
|
||
},
|
||
setUserInfo: (state, payload) => {
|
||
state.userInfo = Object.assign({}, payload);
|
||
},
|
||
openDashboardWidget: (state, payload) => {
|
||
var width = payload.width == undefined ? 810 : payload.width;
|
||
var height = payload.height == undefined ? 330 : payload.height;
|
||
var top = payload.top == undefined ? 10 : payload.top;
|
||
var left = payload.left == undefined ? 10 : payload.left;
|
||
var widgetId =
|
||
payload.widgetId == undefined ? 'BlankWidget' : payload.widgetId;
|
||
var prgmId = payload.prgmId;
|
||
window.open(
|
||
'/comm/base/WidgetPopPage?prgmId=' + prgmId + '&widgetId=' + widgetId,
|
||
widgetId,
|
||
'top=' +
|
||
top +
|
||
', left=' +
|
||
left +
|
||
', width=' +
|
||
width +
|
||
', height=' +
|
||
height +
|
||
', status=no, menubar=no, toolbar=no, resizable=no, scrollbars=no',
|
||
);
|
||
},
|
||
setPageDataInit(state, payload) {
|
||
state.pageData = Object.assign({}, INIT_STATE.pageData, payload);
|
||
},
|
||
};
|
||
|
||
export const getters = {};
|
||
|
||
export const actions = {
|
||
chkOpenTabList({ state, commit }, payload) {
|
||
let list = state.openTabList;
|
||
const key = payload.key;
|
||
const myPrgmId = payload.prgmId;
|
||
switch (key) {
|
||
case 'destroy':
|
||
commit(
|
||
'setOpenTabList',
|
||
list.filter(it => it !== myPrgmId),
|
||
);
|
||
commit('pageInit', { prgmId: myPrgmId, value: {} });
|
||
//commit("pageInit", {});
|
||
break;
|
||
case 'create':
|
||
if (!list.some(it => it === myPrgmId)) {
|
||
// console.log("클릭 한 메뉴가 기존 목록에 없다 => 새로 push"); // & 초기화 세팅
|
||
localStorage.setItem('pageData', JSON.stringify(state.pageData));
|
||
commit('setOpenTabList', list.concat(myPrgmId));
|
||
commit('pageInit', { prgmId: myPrgmId, value: payload.defaultData });
|
||
} else if (list.some(it => it === myPrgmId) && myPrgmId == "PRG0001") {
|
||
// http://localhost:9999으로 index(대시보드)호출할 경우 pageData 없는 경우를 대비하기 위해서
|
||
commit('pageInit', { prgmId: myPrgmId, value: payload.defaultData });
|
||
}
|
||
break;
|
||
|
||
default:
|
||
break;
|
||
}
|
||
},
|
||
getPrgmId({ state }, payload) {
|
||
let objKey = Object.keys(state.menuData);
|
||
let prgmId;
|
||
objKey.forEach(item => {
|
||
if (state.menuData[item].menuId == payload) {
|
||
prgmId = item;
|
||
}
|
||
});
|
||
return prgmId;
|
||
},
|
||
};
|
||
|
||
// Vue.use(Vuex);
|
||
// export const store = new Vuex.Store({
|
||
// modules: {
|
||
// search
|
||
// }
|
||
// });
|
||
export const strict = false; |