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="col-lg-12">
<div class="card">
<div class="card-body">
<h2 class="card-title">사용현황</h2>
<div class="sch-form-wrap title-wrap">
<h3><img :src="h3icon" alt="">예약현황</h3>
<div class="input-group">
<select v-model="searchReqHisResDTO.searchType" id="searchType" class="form-select">
<option value="all">전체</option>
<option value="vm">차량명</option>
<option value="vn">차량번호</option>
<option value="dr">운행자</option>
</select>
<div class="sch-input">
<input type="text" class="form-control" v-model="searchReqHisResDTO.searchText"
@keyup.enter="searchVhclesHisRes">
<button class="ico-sch" @click="searchVhclesHisRes">
<SearchOutlined />
</button>
</div>
</div>
</div>
<!-- Table -->
<div class="tbl-wrap">
<table id="myTable" class="tbl data">
<!-- 동적으로 <th> 생성 -->
<thead>
<tr>
<th>차종 </th>
<th>차량번호</th>
<th>차량명</th>
<th>부서</th>
<th>운행자</th>
<th>기간</th>
</tr>
</thead>
<!-- 동적으로 <td> 생성 -->
<tbody>
<tr v-if="!(vhcleHisResData && vhcleHisResData.length)">
<td colspan="6" style="text-align: center;">등록된 예약현황이 없습니다.</td>
</tr>
<tr v-for="(item, index) in vhcleHisResData" :key="index">
<td>{{ item.vhcty }}</td>
<td>{{ item.vhcleNo }}</td>
<td>{{ item.vhcleNm }}</td>
<td>{{ item.deptId }}</td>
<td>{{ item.drverId }}</td>
<td>
{{ item.bgnde }} {{ item.beginHour.padStart(2, '0') }}:{{ item.beginMnt.padStart(2, '0') }} ~
{{ item.endde }} {{ item.endHour.padStart(2, '0') }}:{{ item.endMnt.padStart(2, '0') }}
</td>
</tr>
</tbody>
</table>
</div>
<Pagenation :search="searchReqHisResDTO" @onChange="fnChangeCurrentPageRes" />
<div class="sch-form-wrap title-wrap">
<h3><img :src="h3icon" alt="">사용이력</h3>
<div class="input-group">
<select v-model="searchReqHisRtnDTO.searchType" id="searchType" class="form-select">
<option value="all">전체</option>
<option value="vm">차량명</option>
<option value="vn">차량번호</option>
<option value="dr">운행자</option>
</select>
<div class="sch-input">
<input type="text" class="form-control" v-model="searchReqHisRtnDTO.searchText"
@keyup.enter="searchVhclesHisRtn">
<button class="ico-sch" @click="searchVhclesHisRtn">
<SearchOutlined />
</button>
</div>
</div>
</div>
<!-- Table -->
<div class="tbl-wrap">
<table id="myTable" class="tbl data">
<!-- 동적으로 <th> 생성 -->
<thead>
<tr>
<th>차종 </th>
<th>차량번호</th>
<th>차량명</th>
<th>부서</th>
<th>운행자</th>
<th>기간</th>
</tr>
</thead>
<!-- 동적으로 <td> 생성 -->
<tbody>
<tr v-if="!(vhcleHisRtnData && vhcleHisRtnData.length)">
<td colspan="6" style="text-align: center;">등록된 예약현황이 없습니다.</td>
</tr>
<tr v-for="(item, index) in vhcleHisRtnData" :key="index">
<td>{{ item.vhcty }}</td>
<td>{{ item.vhcleNo }}</td>
<td>{{ item.vhcleNm }}</td>
<td>{{ item.deptId }}</td>
<td>{{ item.drverId }}</td>
<td>
{{ item.bgnde }} {{ item.beginHour.padStart(2, '0') }}:{{ item.beginMnt.padStart(2, '0') }} ~
{{ item.endde }} {{ item.endHour.padStart(2, '0') }}:{{ item.endMnt.padStart(2, '0') }}
</td>
</tr>
</tbody>
</table>
</div>
<Pagenation :search="searchReqHisRtnDTO" @onChange="fnChangeCurrentPageRtn" />
</div>
</div>
</div>
</template>
<script>
import { ref } from 'vue';
import { SearchOutlined } from '@ant-design/icons-vue';
import Pagenation from "../../../component/Pagenation.vue";
import { findAllAsSetVhcleHis } from "../../../../resources/api/asset"; //차량 정보 API
export default {
data() {
return {
photoicon: "/client/resources/img/photo_icon.png",
h3icon: "/client/resources/img/h3icon.png",
searchReqHisResDTO: {
searchType: "all",
searchText: null,
useAt: null,
useAll: false,
listType: "res",
currentPage: null,
recordSize: 3,
pageSize: null,
totalRecordCount: null,
totalPageCount: null,
startPage: null,
endPage: null,
limitStart: null,
existPrevPage: null,
existNextPage: null,
}, // 예약현황
vhcleHisResData: [], // 예약현황 데이터
searchReqHisRtnDTO: {
searchType: "all",
searchText: null,
useAt: null,
useAll: false,
listType: "rtn",
currentPage: null,
recordSize: 3,
pageSize: null,
totalRecordCount: null,
totalPageCount: null,
startPage: null,
endPage: null,
limitStart: null,
existPrevPage: null,
existNextPage: null,
}, // 사용현황
vhcleHisRtnData: [], // 예약현황 데이터
};
},
computed: {
},
components: {
SearchOutlined, Pagenation
},
methods: {
// 페이지 이동 예약현황황
fnChangeCurrentPageRes(currentPage) {
this.searchReqHisResDTO.currentPage = Number(currentPage);
this.$nextTick(() => {
this.searchVhclesHisRes();
});
},
//차량량 정보 사용 현황 예약현황
async searchVhclesHisRes() {
try {
const response = await findAllAsSetVhcleHis(this.searchReqHisResDTO);
if (response.status === 200) {
this.vhcleHisResData = response.data.data.vhcle; // API 응답에서 카테고리 목록을 가져옴
this.searchReqHisResDTO = response.data.data.search;
}
} catch (error) {
console.error("검색 중 오류 발생:", error);
}
},
// 페이지 이동 사용현황
fnChangeCurrentPageRtn(currentPage) {
this.searchReqHisRtnDTO.currentPage = Number(currentPage);
this.$nextTick(() => {
this.searchVhclesHisRtn();
});
},
//차량 정보 사용 현황 사용현황
async searchVhclesHisRtn() {
try {
const response = await findAllAsSetVhcleHis(this.searchReqHisRtnDTO);
if (response.status === 200) {
this.vhcleHisRtnData = response.data.data.vhcle; // API 응답에서 카테고리 목록을 가져옴
this.searchReqHisRtnDTO = response.data.data.search;
}
} catch (error) {
console.error("검색 중 오류 발생:", error);
}
},
},
created() {
},
mounted() {
this.searchVhclesHisRes();
this.searchVhclesHisRtn();
},
};
</script>
<style scoped></style>