File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<template>
<div class="chart-page">
<div class="title-wrap">
<div class="flex-start">
<h2 class="main-title">기업홍보관 통계</h2>
</div>
</div>
<div class="chart-top">
<div class="flex">
<div class="date-zone flex-start">
<!-- <input type="date" name="" id="" min="2023-11-24" :max="companyListSearch.endDate" v-model="companyListSearch.startDate"> -->
<input type="date" name="" id="" :max="companyListSearch.endDate" v-model="companyListSearch.startDate">
<span>~</span>
<!-- <input type="date" name="" id="" :min="companyListSearch.startDate" :max="oneMonthLater" v-model="companyListSearch.endDate"> -->
<input type="date" name="" id="" :min="companyListSearch.startDate" :max="yesterDay" v-model="companyListSearch.endDate">
<button class="blue-btn" @click="typeCheck()">조회</button>
</div>
<div class="date-check flex-end">
<div>
<input type="radio" name="dayCategory" value="view" id="check" style="display:none" @change="typeCheck()" v-model="selectType">
<label for="check">조회수</label>
</div>
<div>
<input type="radio" name="dayCategory" value="dwld" id="download" style="display:none" @change="typeCheck()" v-model="selectType">
<label for="download">다운로드수</label>
</div>
</div>
</div>
</div>
<BarChart :chartData="companyListByDate" :mapping="keyMapping" columnX="company_nm"/>
<div class="table-zone">
<div class="btn-wrap">
<button class="blue-border-bnt" @click="logExcel()">Excel 다운로드</button>
</div>
<table class="statistics-table">
<colgroup>
<col style="width: 25%;"/>
<col style="width: 25%;"/>
<col style="width: 25%;"/>
<col style="width: 25%;"/>
</colgroup>
<thead>
<tr>
<th rowspan="2">기업명</th>
<th colspan="3">기업홍보관</th>
</tr>
<tr>
<th>전체</th>
<th>기업회원</th>
<th>일반회원</th>
</tr>
</thead>
<tbody>
<tr v-for="(item, index) in companyListByDate" :key="index">
<td>{{ item.company_nm }}</td>
<td>{{ item.total }}</td>
<td>{{ item.company }}</td>
<td>{{ item.common }}</td>
</tr>
<tr v-if="companyListByDateCount == 0">
<td style="font-size: 20px;" colspan="4">검색조건에 해당하는 데이터가 없습니다.</td>
</tr>
</tbody>
</table>
<table class="sum-table" v-if="selectType == 'view'">
<colgroup>
<col style="width: 25%;"/>
<col style="width: 25%;"/>
<col style="width: 25%;"/>
<col style="width: 25%;"/>
</colgroup>
<tbody>
<tr>
<th>합계</th>
<td>{{ companyViewTotal.total }}</td>
<td>{{ companyViewTotal.company }}</td>
<td>{{ companyViewTotal.common }}</td>
</tr>
</tbody>
</table>
<table class="sum-table" v-else>
<colgroup>
<col style="width: 25%;"/>
<col style="width: 25%;"/>
<col style="width: 25%;"/>
<col style="width: 25%;"/>
</colgroup>
<tbody>
<tr>
<th>합계</th>
<td>{{ companyViewTotal.total }}</td>
<td>{{ companyViewTotal.company }}</td>
<td>{{ companyViewTotal.common }}</td>
</tr>
</tbody>
</table>
</div>
<div class="bottom-wrap">
<PaginationButton v-model:currentPage="companyListSearch.currentPage" :perPage="companyListSearch.perPage"
:totalCount="companyListByDateCount" :maxRange="5" :click="typeCheck" />
</div>
</div>
</template>
<script>
import axios from 'axios';
import BarChart from '../../../component/chart/BarChart.vue';
import COMMON_UTIL from '../../../../resources/js/commonUtil.js';
import PaginationButton from '../../../component/pagination/PaginationButton.vue';
const App = {
data() {
return {
keyMapping: {
company_nm: "기업명",
total: "전체회원",
company: "기업회원",
common: "일반회원",
},
companyListSearch: {
currentPage: 1,
perPage: 7,
startDate: null,
endDate: null,
},
yesterDay: COMMON_UTIL.yesterday(),
companyListByDate: [],
companyListByDateCount: 0,
companyViewTotal: {},
selectType: 'view'
};
},
methods: {
/** 권한 별 로그인 수 날짜 별 통계 */
companyLogList: function () {
const vm = this;
axios({
url: '/statistics/companyViewListByDate.json',
method: 'post',
hearder: {
'Content-Type': "application/json; charset=UTF-8",
},
data: vm.companyListSearch
}).then(function (response) {
console.log(response.data)
vm.companyListByDate = response.data.companyViewListByDate;
vm.companyListByDateCount = response.data.companyViewListByDateCount;
vm.companyViewTotal = response.data.companyViewTotal;
}).catch(function (error) {
console.log("error - ", error)
alert("기업 별 조회수 조회 오류, 관리자에게 문의하세요.");
})
},
/** 권한 별 기업소개서 다운로드 수 날짜 별 통계 */
profileLogList: function () {
const vm = this;
axios({
url: '/statistics/profileDwldListByDate.json',
method: 'post',
hearder: {
'Content-Type': "application/json; charset=UTF-8",
},
data: vm.companyListSearch
}).then(function (response) {
vm.companyListByDate = response.data.profileDwldListByDate;
vm.companyListByDateCount = response.data.profileDwldListByDateCount;
vm.companyViewTotal = response.data.profileDwldTotal;
}).catch(function (error) {
console.log("error - ", error)
alert("기업소개서 다운로드수 조회 오류, 관리자에게 문의하세요.");
})
},
/** 권한 별 기업 조회수 엑셀 다운로드 */
logExcel: function() {
const vm = this;
if(vm.companyListByDateCount === 0) {
alert("데이터가 없어 EXCEL 다운로드를 실행할 수 없습니다.");
return
}
if(vm.selectType == 'view') {
axios({
url: "/statistics/companyLogExcel.json",
method: "post",
herders: {
"Content-Type": "application/json; charset=UTF-8",
},
responseType: 'arraybuffer',
data: vm.companyListSearch,
})
.then(function (response) {
// console.log("userAccessLogExcel - response : ", response.data);
const url = window.URL.createObjectURL(new Blob([response.data], { type: response.headers["content-type"] }));
const link = document.createElement("a");
link.href = url;
let today = COMMON_UTIL.today();
link.download = '[' + today + ']' + '기업 조회수';
link.click();
window.URL.revokeObjectURL(url);
})
.catch(function (error) {
console.log("userAccessLogExcel - error : ", error);
alert("기술문서 조회수 Excel 다운로드 오류, 관리자에게 문의해주세요.");
});
} else {
axios({
url: "/statistics/profileDwldLogExcel.json",
method: "post",
herders: {
"Content-Type": "application/json; charset=UTF-8",
},
responseType: 'arraybuffer',
data: vm.companyListSearch,
})
.then(function (response) {
// console.log("userAccessLogExcel - response : ", response.data);
const url = window.URL.createObjectURL(new Blob([response.data], { type: response.headers["content-type"] }));
const link = document.createElement("a");
link.href = url;
let today = COMMON_UTIL.today();
link.download = '[' + today + ']' + '기업소개서 다운로드수';
link.click();
window.URL.revokeObjectURL(url);
})
.catch(function (error) {
console.log("userAccessLogExcel - error : ", error);
alert("기술문서 파일 다운로드 수 Excel 다운로드 오류, 관리자에게 문의해주세요.");
});
}
},
typeCheck: function() {
if(this.selectType == 'view') {
this.companyLogList();
} else {
this.profileLogList();
}
},
// dateCheck: function() {
// if(COMMON_UTIL.isEmpty(this.postListSearch.endDate) === false) {
// alert("날짜를 선택해주세요.");
// } else {
// if(this.selectType == 'view') {
// this.companyLogList();
// } else {
// this.profileLogList();
// }
// }
// },
},
watch: {
// 'companyListSearch.startDate': function(newValue) {
// let date = COMMON_UTIL.oneMonthLater(newValue);
// this.companyListSearch.endDate = null;
// if(date > COMMON_UTIL.today()) {
// this.oneMonthLater = COMMON_UTIL.yesterday();
// } else {
// this.oneMonthLater = date;
// }
// },
},
computed: {
},
components: {
'BarChart': BarChart,
PaginationButton: PaginationButton,
},
mounted() {
this.companyLogList();
}
}
export default App;
</script>