Files
hubez-admin/frontend/src/modules/attractMgt/views/ChannelDetail.vue

391 lines
14 KiB
Vue

<template>
<div class="contents">
<div class="contents_wrap">
<div class="top_wrap">
<h3 class="title">유치현황관리</h3>
<p class="breadcrumb">유치현황관리 &gt; 유치고객 상세정보</p>
</div>
<div class="info">
<div class="title">상세 정보</div>
</div>
<div class="table table_form m50">
<table>
<colgroup>
<col style="width: 140px" />
<col style="width: auto" />
<col style="width: auto" />
<col style="width: 140px" />
<col style="width: auto" />
<col style="width: auto" />
</colgroup>
<tbody>
<tr class="tr_input w75">
<th>가입일</th>
<td colspan="2"><input type="text" disabled v-model="subsDt" /></td>
<th>상태</th>
<td colspan="2"><input type="text" disabled v-model="subsSttusNm" /></td>
</tr>
<tr class="tr_input w75">
<th>고객사</th>
<td colspan="2"><input type="text" disabled v-model="custNm" /></td>
<th>요금제</th>
<td colspan="2"><input type="text" disabled v-model="plan" /></td>
</tr>
<tr class="tr_input w75">
<th>대표자</th>
<td colspan="2"><input type="text" disabled v-model="reprNm" /></td>
<th>사용자 구분</th>
<td colspan="2"><input type="text" disabled v-model="custTyNm" /></td>
</tr>
<tr class="tr_input">
<th>사업자등록번호</th>
<td colspan="2">
<div class="input-bnumber">
<input type="text" disabled v-model="bizrno1" />
<input type="text" disabled v-model="bizrno2" />
<input type="text" disabled v-model="bizrno3" />
</div>
</td>
<th>법인등록번호</th>
<td colspan="2">
<div class="input-double">
<input type="text" disabled v-model="cprRegNo1" />
<input type="text" disabled v-model="cprRegNo2" />
</div>
</td>
</tr>
<tr class="tr_input">
<th>사업장 주소</th>
<td colspan="5">
<div class="input-address">
<input type="text" disabled v-model="adr1" />
<input type="text" disabled v-model="adr2" />
<input type="text" disabled v-model="adr3" />
</div>
</td>
</tr>
<tr class="tr_input">
<th>유치자명</th>
<td colspan="2">
<div class="input-double">
<input type="text" disabled v-model="channelId" />
<input type="text" disabled v-model="channelNm" />
</div>
</td>
<th>관리자명</th>
<td colspan="2">
<div class="input-double">
<input type="text" disabled v-model="adminId" />
<input type="text" disabled v-model="adminNm" />
<button type="button" class="button grey btn-a" @click="searchIDPopOpen">변경</button>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="info">
<div class="count">
발송건수
<p>( 최근 3 사용 전월까지 확인 가능하며, 청구금액은 유큐브에서 확인 가능합니다. )</p>
</div>
<div class="button_group">
<button type="button" class="button blue download" @click="excelDown()">엑셀 다운로드</button>
</div>
</div>
<div class="table calculate">
<form autocomplete="off">
<table class="table-r">
<colgroup>
<col width="16%" />
<col width="16%" />
<col width="16%" />
<col width="16%" />
<col width="16%" />
<col width="20%" />
</colgroup>
<thead>
<tr>
<th rowspan="2">날짜</th>
<th colspan="5">채널별 발송 건수</th>
</tr>
<tr class="total">
<th>전체</th>
<th>SMS</th>
<th>LMS</th>
<th>MMS</th>
<th>알림톡</th>
</tr>
</thead>
<tbody>
<tr>
<td>합계</td>
<td>{{ sndCntTotal.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') }}</td>
<td>{{ sndCntSTotal.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') }}</td>
<td>{{ sndCntLTotal.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') }}</td>
<td>{{ sndCntMTotal.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') }}</td>
<td>{{ sndCntATotal.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') }}</td>
</tr>
<tr v-for="(option, i) in list" v-bind:key="i">
<td>{{ option.sumYm }}</td>
<td>{{ option.sndCnt.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') }}</td>
<td>{{ option.sndCntS.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') }}</td>
<td>{{ option.sndCntL.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') }}</td>
<td>{{ option.sndCntM.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') }}</td>
<td>{{ option.sndCntA.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',') }}</td>
</tr>
</tbody>
</table>
</form>
</div>
<div class="pop-btn2">
<button class="btn-pcolor" type="button" @click="goChannelList()">확인</button>
<button class="btn-default" type="button" @click="goChannelList()">취소</button>
</div>
</div>
<admin-nm-pop ref="adminNmPop"></admin-nm-pop>
</div>
</template>
<script>
import api from '@/service/api';
import channelMgtApi from '../service/channelMgtApi';
import moment from 'moment';
import xlsx from '@/common/excel';
import AdminNmPop from '../../custMgt/components/AdminNmPop';
export default {
name: 'channelDetail',
data() {
return {
row: {},
subsDt: '',
norgNm: '',
userSeq: '',
loginId: '',
custNm: '',
bizrno: '',
bizrno1: '',
bizrno2: '',
bizrno3: '',
userNm: '',
subsSttusCd: '',
custTyCd: '',
sndCnt: '',
adr1: '',
adr2: '',
adr3: '',
cprRegNo: '',
cprRegNo1: '',
cprRegNo2: '',
adminId: '',
adminNm: '',
channelId: '',
channelNm: '',
reprNm: '',
plan: '',
sumYm: '',
sndCntS: '',
sndCntL: '',
sndCntM: '',
sndCntA: '',
succCnt: '',
succCntS: '',
succCntL: '',
succCntM: '',
succCntA: '',
sndCntTotal: 0,
sndCntSTotal: 0,
sndCntLTotal: 0,
sndCntMTotal: 0,
sndCntATotal: 0,
list: [],
totalCnt: '',
props: {},
excelHeader: [],
pageType: 'CHANNELDETAIL',
serviceId: '',
subsSttusNm: '',
custTyNm: '',
};
},
// props: {
// userSeq: {
// type: String,
// default: "",
// },
// },
components: {
channelMgtApi,
AdminNmPop,
},
created() {
this.getExcelHeader();
if (this.$route.params.userSeq != null) {
//리스트에서 상세 호출
this.$store.commit('dataStore/updateUserSeq', this.$route.params.userSeq);
this.channelDetail(this.$route.params.userSeq);
}
},
destroyed() {
this.$store.commit('dataStore/updateUserSeq', '');
this.$store.commit('dataStore/updateUserId', '');
},
methods: {
async channelDetail(userSeq) {
this.row.userSeq = userSeq;
try {
const response = await channelMgtApi.channelDetail(this.row);
const result = response.data;
var sndCntTotal = 0;
var sndCntSTotal = 0;
var sndCntLTotal = 0;
var sndCntMTotal = 0;
var sndCntATotal = 0;
if (result != null && result.retCode == '0000') {
//데이터값이 널이면 오류처리
for (var i = 0; i < result.data.list.length; i++) {
sndCntTotal = sndCntTotal + Number(result.data.list[i].sndCnt);
sndCntSTotal = sndCntSTotal + Number(result.data.list[i].sndCntS);
sndCntLTotal = sndCntLTotal + Number(result.data.list[i].sndCntL);
sndCntMTotal = sndCntMTotal + Number(result.data.list[i].sndCntM);
sndCntATotal = sndCntATotal + Number(result.data.list[i].sndCntA);
}
this.sndCntTotal = sndCntTotal;
this.sndCntSTotal = sndCntSTotal;
this.sndCntLTotal = sndCntLTotal;
this.sndCntMTotal = sndCntMTotal;
this.sndCntATotal = sndCntATotal;
this.list = result.data.list;
this.sndCntS = result.data.sndCntS;
this.sndCntL = result.data.sndCntL;
this.sndCntM = result.data.sndCntM;
this.sndCntA = result.data.sndCntA;
this.loginId = result.data.loginId;
this.custNm = this.fromHtmlEntities(result.data.custNm);
this.subsDt = result.data.subsDt;
this.subsSttusCd = result.data.subsSttusCd;
this.reprNm = result.data.reprNm;
this.bizrno = result.data.bizrno;
this.channelId = result.data.channelId;
this.channelNm = result.data.channelNm;
this.adminId = result.data.adminId;
this.adminNm = result.data.adminNm;
this.cprRegNo = result.data.cprRegNo;
this.adr1 = result.data.adr1;
this.adr2 = result.data.adr2;
this.adr3 = result.data.adr3;
this.custTyCd = result.data.custTyCd;
this.plan = result.data.plan;
this.subsSttusNm = result.data.subsSttusNm;
this.custTyNm = result.data.custTyNm;
if (this.bizrno != '' && this.bizrno != null) {
this.bizrno1 = this.bizrno.substr(0, 3);
this.bizrno2 = this.bizrno.substr(3, 2);
this.bizrno3 = this.bizrno.substr(5);
}
if (this.cprRegNo != '' && this.cprRegNo != null) {
this.cprRegNo1 = this.cprRegNo.substr(0, 6);
this.cprRegNo2 = this.cprRegNo.substr(6);
}
this.serviceId = result.data.userId;
}
} catch (error) {}
},
getExcelHeader() {
// 헤더를 mockup으로 관리한다.
channelMgtApi.getExcelHeader(this.pageType).then((res) => {
this.excelHeader = res;
});
},
async excelDown() {
if (this.list.length <= 0) {
// this.row.title = '유치채널현황';
// this.row.msg1 = '조회된 데이터가 없습니다.';
// this.$refs.commonModal.alertModalOpen(this.row);
return false;
}
let today = moment().format('YYYYMMDDHHmmss');
const saveFileName = `유치고객발송건수_${today}.xls`;
const data = await this.getExcelDataDown();
// 엑셀 합계 데이터 구하기
var sndCntTotal = 0;
var sndCntSTotal = 0;
var sndCntLTotal = 0;
var sndCntMTotal = 0;
var sndCntATotal = 0;
for (var i = 0; i < data.list.length; i++) {
sndCntTotal = sndCntTotal + Number(data.list[i].sndCnt);
sndCntSTotal = sndCntSTotal + Number(data.list[i].sndCntS);
sndCntLTotal = sndCntLTotal + Number(data.list[i].sndCntL);
sndCntMTotal = sndCntMTotal + Number(data.list[i].sndCntM);
sndCntATotal = sndCntATotal + Number(data.list[i].sndCntA);
}
console.log('sndCntTotal : ' + sndCntTotal);
console.log('sndCntSTotal : ' + sndCntSTotal);
console.log('sndCntLTotal : ' + sndCntLTotal);
console.log('sndCntMTotal : ' + sndCntMTotal);
console.log('sndCntATotal : ' + sndCntATotal);
let totalRow = {
sumYm: '합계',
sndCnt: sndCntTotal,
sndCntA: sndCntATotal,
sndCntL: sndCntLTotal,
sndCntM: sndCntMTotal,
sndCntS: sndCntSTotal,
};
// 합계 데이터 추가
data.list.unshift(totalRow);
let options = {
header: this.excelHeader,
dataOrder: 'header',
};
xlsx.export(data.list, saveFileName, options).then(() => {});
},
async getExcelDataDown() {
try {
let response;
const params = {
userSeq: this.row.userSeq,
};
response = await channelMgtApi.sendNumberListExcel(params);
const result = response.data;
if (result != null && result.retCode == '0000') {
return result.data;
} else {
return false;
}
} catch (err) {
return false;
}
}, // end of getExcelDataDown
goChannelList() {
this.$router.push({ name: 'channelList' });
},
searchIDPopOpen: function () {
var params = {
serviceId: this.serviceId,
serviceSeq: this.row.userSeq,
parentDiv: 'channelDetail',
};
this.$refs.adminNmPop.ModalOpen(params);
},
fromHtmlEntities(str) {
return (str + '').replace(/&#\d+;/gm, function (s) {
return String.fromCharCode(s.match(/\d+/gm)[0]);
});
},
},
};
</script>