hrms-bangkok/hrms-mgt
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

แก้ UI-แก้ไขรอบการปฎิบัติงานผู้ใช้งาน

Browse source
This commit is contained in:
setthawutttty 2023-11-03 17:54:28 +07:00
parent f62b48e27c
commit bf1b13522f
5 changed files with 155 additions and 75 deletions
Download patch file Download diff file Expand all files Collapse all files

75
src/modules/09_leave/components/2_Leave/DetailLeave.vue
View file

@ -1,9 +1,21 @@
<script setup lang="ts">
import { useRoute, useRouter } from "vue-router";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
const $q = useQuasar();
const mixin = useCounterMixin();
const { dialogConfirm } = mixin;
const router = useRouter();
const route = useRoute();
const paramsId = route.params.id;
function clickSave() {
dialogConfirm($q, () => saveData());
}
function saveData() {
console.log("save");
}
</script>
<template>
<div class="toptitle text-dark col-12 row items-center">
@ -43,40 +55,63 @@ const paramsId = route.params.id;
>
</div>
</div>
<q-card flat bordered class="col-12 q-mt-sm ">
<div class="col-12 row q-py-md q-pl-md ">
<q-card flat bordered class="col-12 q-mt-sm">
<div class="col-12 row q-py-md q-pl-md">
<div class="col-12 q-col-gutter-md">
<div class="row col-12">
<q-card bordered class="bg-grey-1 q-pa-md col-12">
<div class="row q-col-gutter-md col-12">
<div class="col-xs-12 col-sm-5 row items-center q-my-xs">
<div class="col-12 row">
<div class="col-xs-5 col-sm-3 text-grey-8">ประเภทการลา</div>
<div class="col text-primary">ลาป่วย</div>
</div>
<div class="col-12 row">
<div class="col-xs-5 col-sm-3 text-grey-8">ชื่อ - นามสกุล</div>
<div class="col text-weight-medium">{{ paramsId }}</div>
<div class="col-12 row">
<div class="col-xs-5 col-sm-3 text-grey-8">ประเภทการลา</div>
<div class="col text-primary">ลาป่วย</div>
</div>
<div class="col-12 row">
<div class="col-xs-5 col-sm-3 text-grey-8">
ชื่อ - นามสกุล
</div>
<div class="col text-weight-medium">{{ paramsId }}</div>
</div>
</div>
<div class="col-xs-12 col-sm-7 row">
<div class="row col-12 q-gutter-md">
<div class="col row">
<q-card bordered class="col-12 items-center row q-px-md q-py-sm">
<div class="text-h6 text-weight-bold text-blue-10">10</div>
<div class="col-12 text-subtitle2 text-weight-regular">โควต้า<span class="gt-xs">ลาป่วย</span></div>
<q-card
bordered
class="col-12 items-center row q-px-md q-py-sm"
>
<div class="text-h6 text-weight-bold text-blue-10">
10
</div>
<div class="col-12 text-subtitle2 text-weight-regular">
โควต้า<span class="gt-xs">ลาป่วย</span>
</div>
</q-card>
</div>
<div class="col">
<q-card bordered class="col-12 items-center row q-px-md q-py-sm">
<div class="text-h6 text-weight-bold text-light-blue-6">8</div>
<div class="col-12 text-subtitle2 text-weight-regular">ลา<span class="gt-xs">ป่วยไป</span>แล้ว</div>
<q-card
bordered
class="col-12 items-center row q-px-md q-py-sm"
>
<div class="text-h6 text-weight-bold text-light-blue-6">
8
</div>
<div class="col-12 text-subtitle2 text-weight-regular">
ลา<span class="gt-xs">ป่วยไป</span>แล้ว
</div>
</q-card>
</div>
<div class="col">
<q-card bordered class="col-12 items-center row q-px-md q-py-sm">
<div class="text-h6 text-weight-bold text-indigo-7">2</div>
<div class="col-12 text-subtitle2 text-weight-regular">คงเหลือ<span class="gt-xs">โควต้า</span></div>
<q-card
bordered
class="col-12 items-center row q-px-md q-py-sm"
>
<div class="text-h6 text-weight-bold text-indigo-7">
2
</div>
<div class="col-12 text-subtitle2 text-weight-regular">
คงเหลือ<span class="gt-xs">โควต้า</span>
</div>
</q-card>
</div>
</div>
@ -139,7 +174,7 @@ const paramsId = route.params.id;
</div>
<div class="row">
<div class="col text-grey-8">เอกสารแบบ</div>
<div class="col ">ไม่พบเอกสาร</div>
<div class="col">ไม่พบเอกสาร</div>
</div>
</div>
</q-card-section>
@ -153,7 +188,7 @@ const paramsId = route.params.id;
<q-btn unelevated color="orange-5" label="ไม่อนุมัติ"
><q-tooltip>ไม่อนุมัติ</q-tooltip>
</q-btn>
<q-btn unelevated color="primary" label="อนุมัติ"
<q-btn unelevated color="primary" label="อนุมัติ" @click="clickSave"
><q-tooltip>อนุมัติ</q-tooltip>
</q-btn>
</div>