
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="pagetitle">
<h1>휴가관리</h1>
</div>
<!-- End Page Title -->
<section class="section">
<div class="row">
<!-- 전체 -->
<div class="col-xxl-2 col-md-3">
<h5 class="card-title"><span>전체</span>12개</h5>
</div>
<!-- End 전체 -->
<!-- 사용 -->
<div class="col-xxl-2 col-md-3">
<h5 class="card-title"><span>사용</span>1개</h5>
</div>
<!-- End 사용 -->
<!-- 미사용 -->
<div class="col-xxl-2 col-xl-3">
<h5 class="card-title"><span>미사용</span>1개</h5>
</div>
<!-- End 미사용 -->
<div class="col-lg-12">
<div class="card">
<div class="card-body">
<h5 class="card-title">휴가내역</h5>
<!-- Table -->
<div class="datatable-wrapper datatable-loading no-footer sortable searchable fixed-columns">
<div class="datatable-container">
<div class="d-flex justify-content-end ">
<button
type="button"
class="btn btn-outline-primary"
@click="requestApproval"
>
승인요청
</button>
<button
type="button"
class="btn btn-outline-secondary"
@click="registerLeave"
>
등록
</button>
<button
type="button"
class="btn btn-outline-success"
@click="saveChanges"
>
저장
</button>
<button
type="button"
class="btn btn-outline-danger"
@click="deletePending"
>
삭제
</button>
</div>
<table class="table datatable datatable-table">
<!-- 동적으로 <th> 생성 -->
<thead>
<tr>
<th>No</th>
<th></th>
<th>구분</th>
<th>시작일자</th>
<th>종료일자</th>
<th>사용일</th>
<th>사유</th>
<th>승인여부</th>
</tr>
</thead>
<!-- 동적으로 <td> 생성 -->
<tbody>
<tr>
<td>{{ index }}</td>
<td><input type="checkbox"></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
</div>
<div class="datatable-bottom justify-content-center pagination">
<nav class="datatable-pagination">
<ul class="datatable-pagination-list">
<li :class="{ 'datatable-disabled': currentPage === 1 }" @click="changePage(currentPage - 1)">
<button class="datatable-pagination-list-item-link">‹</button>
</li>
<li v-for="page in totalPages" :key="page" :class="{ 'datatable-active': currentPage === page }">
<button class="datatable-pagination-list-item-link" @click="changePage(page)">
{{ page }}
</button>
</li>
<li :class="{ 'datatable-disabled': currentPage === totalPages }" @click="changePage(currentPage + 1)">
<button class="datatable-pagination-list-item-link">›</button>
</li>
</ul>
</nav>
</div>
</div>
<!-- End Table -->
</div>
</div>
</div>
</div>
</section>
</template>
<script>
import Table from "../../component/Table.vue";
export default {
data() {
return {
};
},
methods: {
},
components: {
Table,
},
};
</script>
<style scoped></style>