ปรับหน้าลงเวลาเข้างาน, ออกงาน, ประวัติการลาเวลา

src/modules/03_leave/views/Main.vue

@@ -1,156 +0,0 @@
-<script setup lang="ts">
-import type { QTableProps } from "quasar"
-import { ref, onMounted } from "vue"
-import { useQuasar } from "quasar"
-import { useRouter } from "vue-router"
-import { useCounterMixin } from "@/stores/mixin"
-import http from "@/plugins/http"
-import config from "@/app.config"
-import { useRestDataStore } from "@/modules/03_leave/store"
-import Table from "@/components/Table.vue"
-
-const RestData = useRestDataStore()
-const { statusText } = RestData
-const router = useRouter()
-const $q = useQuasar()
-const mixin = useCounterMixin()
-const { date2Thai, messageError, showLoader, hideLoader } = mixin
-
-const filter = ref<string>("")
-const visibleColumns = ref<String[]>(["no", "placeLeave", "dateStartLeave", "dateLeave", "statustext"])
-const columns = ref<QTableProps["columns"]>([
-	{
-		name: "no",
-		align: "left",
-		label: "ลำดับ",
-		sortable: true,
-		field: "no",
-		headerStyle: "font-size: 14px",
-		style: "font-size: 14px; width:5%;",
-	},
-	{
-		name: "placeLeave",
-		align: "left",
-		label: "สถานที่ยื่นขอลาออกจากราชการ",
-		sortable: true,
-		field: "placeLeave",
-		headerStyle: "font-size: 14px",
-		style: "font-size: 14px; width:15%;",
-	},
-	{
-		name: "dateStartLeave",
-		align: "left",
-		label: "วันที่ยื่นขอลาออกจากราชการ",
-		sortable: true,
-		field: "dateStartLeave",
-		headerStyle: "font-size: 14px",
-		style: "font-size: 14px; width:15%;",
-	},
-	{
-		name: "dateLeave",
-		align: "left",
-		label: "วันที่ขอลาออกจากราชการ",
-		sortable: true,
-		field: "dateLeave",
-		headerStyle: "font-size: 14px",
-		style: "font-size: 14px",
-	},
-	{
-		name: "statustext",
-		align: "left",
-		label: "สถานะ",
-		sortable: true,
-		field: "statustext",
-		headerStyle: "font-size: 14px",
-		style: "font-size: 14px; width:10%;",
-	},
-])
-const rows = ref<any>([])
-const initialPagination = ref({
-	rowsPerPage: 0,
-})
-
-onMounted(() => {
-	fectListleave()
-})
-
-//นำข้อมูลมาแสดง
-const fectListleave = async () => {
-	showLoader()
-	await http
-		.get(config.API.listUser())
-		.then((res: any) => {
-			let data = res.data.result
-			rows.value = data.map((e: any) => ({
-				id: e.id,
-				placeLeave: e.location,
-				dateStartLeave: date2Thai(e.sendDate),
-				dateLeave: date2Thai(e.activeDate),
-				status: e.status,
-				statustext: statusText(e.status),
-			}))
-		})
-		.catch((e: any) => {
-			messageError($q, e)
-		})
-		.finally(() => {
-			hideLoader()
-		})
-}
-
-const clickAdd = async () => {
-	router.push(`/leave/add`)
-}
-
-const clickBack = () => {
-	router.push(`/`)
-}
-</script>
-<template>
-	<div class="col-12 row justify-center">
-		<div class="col-xs-12 col-sm-12 col-md-11">
-			<div class="toptitle text-white col-12 row items-center">
-				<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="clickBack" />
-				ลาออก
-			</div>
-			<div class="col-12">
-				<q-card bordered class="q-pa-md">
-					<Table
-						style="max-height: 80vh"
-						:rows="rows"
-						:columns="columns"
-						:filter="filter"
-						:visible-columns="visibleColumns"
-						v-model:inputfilter="filter"
-						v-model:inputvisible="visibleColumns"
-						:pagination="initialPagination"
-						:inputShow="false"
-						:add="clickAdd"
-						:titleText="''"
-					>
-						<template #columns="props">
-							<q-tr :props="props" class="cursor-pointer" @click="router.push(`/leave/` + props.row.id)">
-								<q-td key="no" :props="props">
-									{{ props.rowIndex + 1 }}
-								</q-td>
-								<q-td key="placeLeave" :props="props">
-									{{ props.row.placeLeave }}
-								</q-td>
-								<q-td key="dateStartLeave" :props="props">
-									{{ props.row.dateStartLeave }}
-								</q-td>
-								<q-td key="dateStartLeave" :props="props">
-									{{ props.row.dateStartLeave }}
-								</q-td>
-								<q-td key="statustext" :props="props">
-									{{ props.row.statustext }}
-								</q-td>
-							</q-tr>
-						</template>
-					</Table>
-				</q-card>
-			</div>
-		</div>
-	</div>
-</template>
-<style></style>