sk_fems_ui commit
This commit is contained in:
unknown
357
plugins/utility.js
Normal file
357
plugins/utility.js
Normal file
@ -0,0 +1,357 @@
|
||||
import 'tui-pagination/dist/tui-pagination.css';
|
||||
|
||||
const dayjs = require('dayjs');
|
||||
|
||||
const dateRangeKey = {
|
||||
CYC_YEAR: 'year',
|
||||
CYC_MONTH: 'month',
|
||||
CYC_DAY: 'day',
|
||||
CYC_HOUR: 'hour',
|
||||
};
|
||||
|
||||
const Utility = () => {
|
||||
const getStore = self => {
|
||||
const store = self.$store;
|
||||
return store;
|
||||
};
|
||||
const testUtil = v => {
|
||||
console.log('v = ', v);
|
||||
return console.log(getStore(v));
|
||||
};
|
||||
|
||||
const setFormatDate = (value, formatType) => {
|
||||
if (value) {
|
||||
const date = value === 'today' ? dayjs() : dayjs(value);
|
||||
return value ? date.format(formatType) : null;
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
};
|
||||
|
||||
const setFormatDecimal = (value, num, defaultVal) => {
|
||||
let returnVal = null;
|
||||
if (defaultVal && !value) {
|
||||
let defaultVal = '0.';
|
||||
for (let i = 0; i < num; i++) {
|
||||
defaultVal += '0';
|
||||
}
|
||||
returnVal = defaultVal;
|
||||
} else if (value) {
|
||||
returnVal = value.toFixed(num);
|
||||
}
|
||||
return returnVal;
|
||||
};
|
||||
|
||||
const setFormatInt = value => {
|
||||
// console.log(this.searchParam);
|
||||
return value
|
||||
? String(Math.floor(value)).replace(/\B(?=(\d{3})+(?!\d))/g, ',')
|
||||
: null;
|
||||
};
|
||||
|
||||
const setFormatIntDecimal = (value, num) => {
|
||||
let numComma, commaSplit;
|
||||
let defaultVal = '0.';
|
||||
for (let i = 0; i < num; i++) {
|
||||
defaultVal += '0';
|
||||
}
|
||||
if (value) {
|
||||
const vv = setFormatDecimal(value, num);
|
||||
commaSplit = vv.split('.');
|
||||
numComma = commaSplit[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',');
|
||||
}
|
||||
|
||||
return value ? numComma + '.' + commaSplit[1] : defaultVal;
|
||||
};
|
||||
|
||||
const setFormatNumber = value => {
|
||||
return value ? value.toLocaleString('ko-KR') : null;
|
||||
};
|
||||
|
||||
const toFixedAndLocaleString = (value, num, locale) => {
|
||||
num = num != null ? num : 2;
|
||||
locale = locale != null ? locale : 'ko-KR';
|
||||
value = value != null ? parseFloat(value) : 0;
|
||||
|
||||
var val1 = value.toLocaleString(locale).split('.')[0];
|
||||
var val2 = value.toFixed(num).split('.')[1];
|
||||
|
||||
return val1 + '.' + val2;
|
||||
};
|
||||
|
||||
// 기간 설정값 중 날짜가 30일 단위일 경우 비교 시 월로 계산
|
||||
const setNewDefaultRange = (myCmCycle, defaultRange) => {
|
||||
let myRange = null;
|
||||
let rangeKey = null;
|
||||
if (myCmCycle === 'CYC_DAY' && defaultRange % 30 === 0) {
|
||||
// console.log("달 기준으로 간주");
|
||||
myRange = defaultRange / 30;
|
||||
rangeKey = 'month';
|
||||
} else {
|
||||
myRange = defaultRange;
|
||||
rangeKey = dateRangeKey[myCmCycle];
|
||||
// rangeKey = cmCycleList.filter(item => item.value === myCmCycle)[0]
|
||||
// .rangeKey;
|
||||
}
|
||||
return { key: rangeKey, range: myRange };
|
||||
};
|
||||
// 바라보는 스토어, 비교날짜, 포멧형식 을 넘겨주면, 스토어에 저장된 기간 범위 기준으로 조정날짜를 반환한다 => 비교날짜가 from 일 경우
|
||||
const setAftertDate = (searchParam, compareDate, formatDate, formatTime) => {
|
||||
let returnDt = null;
|
||||
const myCmCycle = searchParam.cmCycle;
|
||||
const compareDt = dayjs(compareDate);
|
||||
const formatType = formatDate + (formatTime ? ' ' + formatTime : '');
|
||||
const defaultRange = searchParam.defaultRange[myCmCycle];
|
||||
const newDefault = setNewDefaultRange(myCmCycle, defaultRange);
|
||||
const myRange = newDefault.range;
|
||||
const rangeKey = newDefault.key;
|
||||
|
||||
switch (myCmCycle) {
|
||||
case 'CYC_YEAR':
|
||||
case 'CYC_MONTH':
|
||||
// console.log("월 또는 연");
|
||||
returnDt = compareDt.add(myRange - 1, rangeKey);
|
||||
break;
|
||||
|
||||
case 'CYC_DAY':
|
||||
// console.log("일");
|
||||
if (
|
||||
rangeKey === 'month' &&
|
||||
compareDt.format('YYYYMMDD') ===
|
||||
compareDt.startOf('month').format('YYYYMMDD')
|
||||
) {
|
||||
// console.log("들어온날이 첫째 날");
|
||||
returnDt = compareDt.endOf('month');
|
||||
} else if (
|
||||
rangeKey === 'month' &&
|
||||
compareDt.format('YYYYMMDD') ===
|
||||
compareDt.endOf('month').format('YYYYMMDD')
|
||||
) {
|
||||
// console.log("들어온날이 마지말 날");
|
||||
returnDt = compareDt
|
||||
.add(myRange, rangeKey)
|
||||
.endOf('month')
|
||||
.subtract(1, rangeKey);
|
||||
} else {
|
||||
// console.log("그 외 날");
|
||||
returnDt = compareDt.add(myRange, rangeKey).subtract(1, 'day');
|
||||
}
|
||||
break;
|
||||
|
||||
case 'CYC_HOUR':
|
||||
// console.log("시간");
|
||||
returnDt = compareDt.add(myRange, 'h').subtract(1, 's');
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
// console.log(returnDt.format(formatType));
|
||||
return returnDt.format(formatType);
|
||||
};
|
||||
// 바라보는 스토어, 비교날짜, 포멧형식 을 넘겨주면, 스토어에 저장된 기간 범위 기준으로 조정날짜를 반환한다 => 비교날짜가t to 일 경우
|
||||
const setBeforetDate = (searchParam, compareDate, formatDate, formatTime) => {
|
||||
let returnDt = null;
|
||||
const myCmCycle = searchParam.cmCycle;
|
||||
const compareDt = dayjs(compareDate);
|
||||
const formatType = formatDate + (formatTime ? ' ' + formatTime : '');
|
||||
const defaultRange = searchParam.defaultRange[myCmCycle];
|
||||
const newDefault = setNewDefaultRange(myCmCycle, defaultRange);
|
||||
let myRange = newDefault.range; //수정 --------------------
|
||||
const rangeKey = newDefault.key;
|
||||
|
||||
switch (myCmCycle) {
|
||||
case 'CYC_YEAR':
|
||||
case 'CYC_MONTH':
|
||||
// 수정 ---------------------------------
|
||||
if (myRange === 'no limite') {
|
||||
myRange = 12;
|
||||
} else {
|
||||
myRange = myRange;
|
||||
}
|
||||
// --------------------------------------
|
||||
returnDt = compareDt.subtract(myRange - 1, rangeKey);
|
||||
break;
|
||||
case 'CYC_WEEK':
|
||||
returnDt = compareDt.add(myRange, rangeKey);
|
||||
break;
|
||||
case 'CYC_DAY':
|
||||
// console.log("일");
|
||||
if (
|
||||
rangeKey === 'month' &&
|
||||
compareDt.format('YYYYMMDD') ===
|
||||
compareDt.startOf('month').format('YYYYMMDD')
|
||||
) {
|
||||
// console.log("들어온날이 첫째 날");
|
||||
returnDt = compareDt
|
||||
.subtract(myRange, rangeKey)
|
||||
.startOf('month')
|
||||
.add(1, 'day');
|
||||
} else if (
|
||||
rangeKey === 'month' &&
|
||||
compareDt.format('YYYYMMDD') ===
|
||||
compareDt.endOf('month').format('YYYYMMDD')
|
||||
) {
|
||||
// console.log("들어온날이 마지말 날");
|
||||
returnDt = compareDt.startOf('month');
|
||||
} else {
|
||||
// 수정 ---------------------------------
|
||||
if (myRange === 'no limite') {
|
||||
myRange = 30;
|
||||
} else {
|
||||
myRange = myRange;
|
||||
}
|
||||
// --------------------------------------
|
||||
returnDt = compareDt.subtract(myRange, rangeKey).add(1, 'day');
|
||||
}
|
||||
break;
|
||||
case 'CYC_HOUR':
|
||||
// console.log("시간");
|
||||
returnDt = compareDt.subtract(myRange, 'h').add(1, 'm');
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
// console.log(returnDt.format(formatType));
|
||||
return returnDt.format(formatType);
|
||||
};
|
||||
|
||||
const toCamelCase = value => {
|
||||
return value
|
||||
.toLowerCase()
|
||||
.replace(/[^a-zA-Z0-9]+(.)/g, (m, chr) => chr.toUpperCase());
|
||||
};
|
||||
|
||||
// isLegend 값이 false 여도 response 차이데이타 세팅 시 legend 값을 넣어주면 상단에 노출됨
|
||||
const defaultChartOption = isLegend => {
|
||||
const defaultLegend = {
|
||||
top: 'bottom',
|
||||
left: 'center',
|
||||
textStyle: {
|
||||
color: '#95A0A9',
|
||||
fontSize: 10,
|
||||
},
|
||||
};
|
||||
return {
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
confine: true,
|
||||
axisPointer: {
|
||||
type: 'shadow',
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
top: '3%',
|
||||
bottom: isLegend ? '30' : '0',
|
||||
containLabel: true,
|
||||
},
|
||||
legend: isLegend ? Object.assign(defaultLegend, isLegend) : null,
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
axisLabel: {
|
||||
color: '#767D83',
|
||||
fontSize: 10,
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
color: '#767D83',
|
||||
fontSize: 10,
|
||||
},
|
||||
data: [], //xAxis text
|
||||
},
|
||||
toolbox: {
|
||||
|
||||
},
|
||||
dataZoom: [
|
||||
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '',
|
||||
type: 'bar',
|
||||
showBackground: true,
|
||||
data: [],
|
||||
},
|
||||
],
|
||||
};
|
||||
};
|
||||
|
||||
const defaultGridOption = gridHeight => {
|
||||
// console.log("gridHeight = ", gridHeight);
|
||||
return {
|
||||
bodyHeight: gridHeight,
|
||||
minBodyHeight: gridHeight,
|
||||
header: {
|
||||
height: 28,
|
||||
},
|
||||
rowHeight: 29,
|
||||
minRowHeight: 29,
|
||||
columnOptions: {
|
||||
resizable: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
const copyObj = obj => {
|
||||
const result = {};
|
||||
for (let key in obj) {
|
||||
if (typeof obj[key] === 'object') {
|
||||
result[key] = copyObj(obj[key]);
|
||||
} else {
|
||||
result[key] = obj[key];
|
||||
}
|
||||
}
|
||||
return result;
|
||||
};
|
||||
|
||||
const getKeyByValue = (obj, val) => {
|
||||
return Object.keys(obj).find(key => obj[key] === val);
|
||||
};
|
||||
const getValueByObject = (obj, defaultKey, defaultData, valueKey) => {
|
||||
let returnData = '';
|
||||
if (obj.length > 0) {
|
||||
const list = obj.filter(item => item[defaultKey] === defaultData);
|
||||
if (list.length > 0) {
|
||||
returnData = list[0][valueKey];
|
||||
}
|
||||
}
|
||||
return returnData;
|
||||
};
|
||||
|
||||
const prependZero = (max, val) => {
|
||||
let zeroStr = '';
|
||||
let strVal = String(val);
|
||||
for (let i = 0; i < max - strVal.length; i++) {
|
||||
zeroStr += '0';
|
||||
}
|
||||
return zeroStr;
|
||||
};
|
||||
|
||||
return {
|
||||
testUtil,
|
||||
setFormatDate, // 날짜 타입
|
||||
setFormatDecimal, // 소수점 (버림, 반올림, 올림 의 정책이 있다면 수정필요)
|
||||
setFormatInt, // 천단위 콤마
|
||||
setFormatIntDecimal, // 소수점 포함 천단위 콤마
|
||||
setFormatNumber, // 천단위 콤마 & 소수점 (들어오는 값 그대로,, <= 원하는 자릿구 맞추려면 추가해야 함, setFormatDecimal와 함께 사용해도 되기도,,),
|
||||
setNewDefaultRange, // 기간 기준 재설정
|
||||
setAftertDate, // 이후 날짜
|
||||
setBeforetDate, // 이전 날짜
|
||||
toCamelCase, // 카멜케이스로 변환
|
||||
defaultChartOption, // 차트 공통 옵션
|
||||
defaultGridOption, // 그리드 공통 옵션
|
||||
copyObj, // 오브젝트 deep 카피
|
||||
getKeyByValue,
|
||||
getValueByObject,
|
||||
prependZero,
|
||||
toFixedAndLocaleString,
|
||||
};
|
||||
};
|
||||
|
||||
export default Utility();
|
||||
Reference in New Issue
Block a user