From d3ddfc38d7a260b2234923dff644aa3dbf94de51 Mon Sep 17 00:00:00 2001
From: AnandaTon <ananda@frappet.com>
Date: Fri, 6 Oct 2023 13:33:54 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B9=80=E0=B8=9E=E0=B8=B4=E0=B9=88=E0=B8=A1?=
 =?UTF-8?q?=20path=20=E0=B9=83=E0=B8=99=20Dashboard=20=E0=B8=AA=E0=B8=A3?=
 =?UTF-8?q?=E0=B9=89=E0=B8=B2=E0=B8=87=E0=B9=80=E0=B8=87=E0=B8=B7=E0=B9=88?=
 =?UTF-8?q?=E0=B8=AD=E0=B8=99=E0=B9=84=E0=B8=82=E0=B9=83=E0=B8=99=E0=B8=9A?=
 =?UTF-8?q?=E0=B8=B1=E0=B8=99=E0=B8=97=E0=B8=B6=E0=B8=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/modules/01_dashboard/views/Dashboard.vue  | 419 ++++++++----------
 .../05_leave/componenst/addAbsence.vue        |  24 +-
 2 files changed, 192 insertions(+), 251 deletions(-)

diff --git a/src/modules/01_dashboard/views/Dashboard.vue b/src/modules/01_dashboard/views/Dashboard.vue
index caabc39..d823fad 100644
--- a/src/modules/01_dashboard/views/Dashboard.vue
+++ b/src/modules/01_dashboard/views/Dashboard.vue
@@ -1,273 +1,208 @@
 <script setup lang="ts">
-import { ref, onMounted, Static } from "vue";
-const link = ref<number>(1);
-import { useQuasar } from "quasar";
-import router from "@/router";
-import http from "@/plugins/http";
-import config from "@/app.config";
-import { useCounterMixin } from "@/stores/mixin";
+import { ref, onMounted, Static } from "vue"
+const link = ref<number>(1)
+import { useQuasar } from "quasar"
+import router from "@/router"
+import http from "@/plugins/http"
+import config from "@/app.config"
+import { useCounterMixin } from "@/stores/mixin"
 
-const $q = useQuasar();
-const mixin = useCounterMixin();
-const {
-  showLoader,
-  hideLoader,
-  date2Thai,
-} = mixin;
+const $q = useQuasar()
+const mixin = useCounterMixin()
+const { showLoader, hideLoader, date2Thai } = mixin
 
-const fullname = ref<string>("ธัญลักษณ์");
+const fullname = ref<string>("ธัญลักษณ์")
 const inboxList = ref<any>([
-  //   {
-  //     no: 1,
-  //     sender: "เจ้าหน้าที่ทะเบียนประวัติ",
-  //     subject: "ขอแก้ไขข้อมูลทะเบียนประวัติ",
-  //     timereceive: "13/12/2565",
-  //     body: "ขอแก้ไขข้อมูลทะเบียนประวัติ เรื่อง ชื่อ-นามสกุล",
-  //     ratingModel: 0,
-  //   },
-]);
+	//   {
+	//     no: 1,
+	//     sender: "เจ้าหน้าที่ทะเบียนประวัติ",
+	//     subject: "ขอแก้ไขข้อมูลทะเบียนประวัติ",
+	//     timereceive: "13/12/2565",
+	//     body: "ขอแก้ไขข้อมูลทะเบียนประวัติ เรื่อง ชื่อ-นามสกุล",
+	//     ratingModel: 0,
+	//   },
+])
 const items = ref<any>([
-  {
-    icon: "mdi-account-group-outline",
-    title: "แผนผังองค์กร",
-    sub: "ดูแผนผังองค์กร",
-    color: "blue-3",
-    path: "",
-    active: false,
-  },
-  {
-    icon: "mdi-clipboard-account-outline",
-    title: "ประเมินผล",
-    sub: "ข้อมูลการประเมินผลการปฏิบัติราชการ",
-    color: "lime-4",
-    path: "",
-    active: false,
-  },
-  {
-    icon: "mdi-calendar-account-outline",
-    title: "การลา",
-    sub: "ดู/ลงเวลา ทำเรื่องลา",
-    color: "cyan-3",
-    path: "",
-    active: false,
-  },
-  {
-    icon: "mdi-folder-account-outline",
-    title: "ผลงาน",
-    sub: "ดูผลงาน",
-    color: "light-green-3",
-    path: "",
-    active: false,
-  },
-  {
-    icon: "mdi-account-arrow-right-outline",
-    title: "ขอโอน",
-    sub: "ทำเรื่องขอโอนย้าย",
-    color: "deep-purple-3",
-    path: "/transfer",
-    active: false,
-  },
-  {
-    icon: "mdi-account-remove-outline",
-    title: "ลาออก",
-    sub: "ทำเรื่องลาออก",
-    color: "orange-3",
-    path: "/retire",
-    active: false,
-  },
-]);
+	{
+		icon: "mdi-account-group-outline",
+		title: "แผนผังองค์กร",
+		sub: "ดูแผนผังองค์กร",
+		color: "blue-3",
+		path: "",
+		active: false,
+	},
+	{
+		icon: "mdi-clipboard-account-outline",
+		title: "ประเมินผล",
+		sub: "ข้อมูลการประเมินผลการปฏิบัติราชการ",
+		color: "lime-4",
+		path: "",
+		active: false,
+	},
+	{
+		icon: "mdi-calendar-account-outline",
+		title: "การลา",
+		sub: "ดู/ลงเวลา ทำเรื่องลา",
+		color: "cyan-3",
+		path: "/leave",
+		active: false,
+	},
+	{
+		icon: "mdi-folder-account-outline",
+		title: "ผลงาน",
+		sub: "ดูผลงาน",
+		color: "light-green-3",
+		path: "",
+		active: false,
+	},
+	{
+		icon: "mdi-account-arrow-right-outline",
+		title: "ขอโอน",
+		sub: "ทำเรื่องขอโอนย้าย",
+		color: "deep-purple-3",
+		path: "/transfer",
+		active: false,
+	},
+	{
+		icon: "mdi-account-remove-outline",
+		title: "ลาออก",
+		sub: "ทำเรื่องลาออก",
+		color: "orange-3",
+		path: "/retire",
+		active: false,
+	},
+])
 onMounted(async () => {
-  await fetchlistInbox();
-});
+	await fetchlistInbox()
+})
 const fetchlistInbox = async () => {
-  showLoader();
-  await http
-    .get(config.API.msgInbox)
-    .then((res) => {
-      let data = res.data.result;
-      console.log(data);
-      let listItem: any = [];
-      data.map((e: any) => {
-        listItem.push({
-          no: e.id ?? "",
-          sender:
-            e.createdFullName == "" || e.createdFullName == null
-              ? "เจ้าหน้าที่"
-              : e.createdFullName,
-          subject: e.subject ?? "",
-          timereceive: date2Thai(e.createdAt),
-          body: e.body ?? "",
-          ratingModel: 0,
-        });
-      });
-      inboxList.value = listItem;
-    })
-    .catch((err) => {
-      console.log(err);
-    })
-    .finally(() => {
-      hideLoader();
-    });
-};
+	showLoader()
+	await http
+		.get(config.API.msgInbox)
+		.then(res => {
+			let data = res.data.result
+			console.log(data)
+			let listItem: any = []
+			data.map((e: any) => {
+				listItem.push({
+					no: e.id ?? "",
+					sender: e.createdFullName == "" || e.createdFullName == null ? "เจ้าหน้าที่" : e.createdFullName,
+					subject: e.subject ?? "",
+					timereceive: date2Thai(e.createdAt),
+					body: e.body ?? "",
+					ratingModel: 0,
+				})
+			})
+			inboxList.value = listItem
+		})
+		.catch(err => {
+			console.log(err)
+		})
+		.finally(() => {
+			hideLoader()
+		})
+}
 
 const transferToPage = (path?: string) => {
-  router.push(`${path}`);
-};
+	router.push(`${path}`)
+}
 </script>
 <template>
-  <div class="col-12 row q-col-gutter-md" style="padding-top: 1.8%">
-    <div class="col-12 row" v-if="!$q.screen.gt.xs">
-      <div class="text-white text-weight-light text-18px">
-        สวัสดี, {{ fullname }}
-      </div>
-      <div style="color: #ffffff" class="text-18px text-weight-medium col-12">
-        ระบบทรัพยากรบุคคล
-      </div>
-    </div>
-    <div class="col-xs-12 col-sm-12 col-md-9">
-      <div class="row justify-start q-col-gutter-md">
-        <div
-          class="col-xs-6 col-sm-4 col-md-4 col-lg-3 col-xl-2 row"
-          v-for="(item, j) in items"
-          :key="j"
-        >
-          <q-card
-            bordered
-            @click="transferToPage(item.path)"
-            class="noactive col-12"
-          >
-            <div class="col-12">
-              <q-avatar
-                :color="item.color"
-                text-color="white"
-                :size="$q.screen.gt.xs ? '55px' : '40px'"
-              >
-                <q-icon
-                  :name="item.icon"
-                  :size="$q.screen.gt.xs ? '28px' : '20px'"
-                  color="black"
-                />
-              </q-avatar>
-            </div>
-            <div class="q-pt-md col-12 text-left text-18px">
-              {{ item.title }}
-            </div>
-            <div
-              class="col-12 text-left text-grey text-weight-regular gt-xs"
-              style="font-size: 14px"
-            >
-              {{ item.sub }}
-            </div>
-          </q-card>
-        </div>
-      </div>
-    </div>
-    <div class="col-xs-12 col-sm-12 col-md-3 row">
-      <q-card
-        flat
-        bordered
-        :style="$q.screen.gt.xs ? 'max-height: 74vh' : 'height: auto;'"
-        class="q-pb-md col-12"
-      >
-        <div class="col-12 row q-pa-md">
-          <div class="text-subtitle1 text-weight-bold text-dark">
-            กล่องข้อความ
-          </div>
-          <q-space />
-          <q-btn
-            dense
-            icon="mdi-dots-vertical"
-            color="grey-6"
-            size="11px"
-            flat
-          />
-        </div>
-        <q-scroll-area style="height: 64vh" v-if="inboxList.length > 1">
-          <q-list
-            v-for="(contact, index) in inboxList"
-            :key="index"
-            class="q-px-md"
-          >
-            <q-item
-              clickable
-              v-ripple
-              class="q-py-md q-mb-sm my-menu"
-              :active="link === contact.no"
-              @click="link = contact.no"
-              active-class="my-menu-link"
-            >
-              <q-item-section>
-                <q-item-label>{{ contact.sender }}</q-item-label>
-                <q-item-label caption class="text-grey-6" lines="2">{{
-                  contact.subject
-                }}</q-item-label>
-              </q-item-section>
+	<div class="col-12 row q-col-gutter-md" style="padding-top: 1.8%">
+		<div class="col-12 row" v-if="!$q.screen.gt.xs">
+			<div class="text-white text-weight-light text-18px">สวัสดี, {{ fullname }}</div>
+			<div style="color: #ffffff" class="text-18px text-weight-medium col-12">ระบบทรัพยากรบุคคล</div>
+		</div>
+		<div class="col-xs-12 col-sm-12 col-md-9">
+			<div class="row justify-start q-col-gutter-md">
+				<div class="col-xs-6 col-sm-4 col-md-4 col-lg-3 col-xl-2 row" v-for="(item, j) in items" :key="j">
+					<q-card bordered @click="transferToPage(item.path)" class="noactive col-12">
+						<div class="col-12">
+							<q-avatar :color="item.color" text-color="white" :size="$q.screen.gt.xs ? '55px' : '40px'">
+								<q-icon :name="item.icon" :size="$q.screen.gt.xs ? '28px' : '20px'" color="black" />
+							</q-avatar>
+						</div>
+						<div class="q-pt-md col-12 text-left text-18px">
+							{{ item.title }}
+						</div>
+						<div class="col-12 text-left text-grey text-weight-regular gt-xs" style="font-size: 14px">
+							{{ item.sub }}
+						</div>
+					</q-card>
+				</div>
+			</div>
+		</div>
+		<div class="col-xs-12 col-sm-12 col-md-3 row">
+			<q-card flat bordered :style="$q.screen.gt.xs ? 'max-height: 74vh' : 'height: auto;'" class="q-pb-md col-12">
+				<div class="col-12 row q-pa-md">
+					<div class="text-subtitle1 text-weight-bold text-dark">กล่องข้อความ</div>
+					<q-space />
+					<q-btn dense icon="mdi-dots-vertical" color="grey-6" size="11px" flat />
+				</div>
+				<q-scroll-area style="height: 64vh" v-if="inboxList.length > 1">
+					<q-list v-for="(contact, index) in inboxList" :key="index" class="q-px-md">
+						<q-item clickable v-ripple class="q-py-md q-mb-sm my-menu" :active="link === contact.no" @click="link = contact.no" active-class="my-menu-link">
+							<q-item-section>
+								<q-item-label>{{ contact.sender }}</q-item-label>
+								<q-item-label caption class="text-grey-6" lines="2">{{ contact.subject }}</q-item-label>
+							</q-item-section>
 
-              <q-item-section side top>
-                <q-item-label caption>{{ contact.timereceive }}</q-item-label>
-              </q-item-section>
-            </q-item>
-          </q-list>
-        </q-scroll-area>
-        <q-banner
-          rounded
-          class="bg-amber-1 text-center q-mx-sm"
-          v-else
-        >
-          <div class="text-yellow-10">
-            <q-icon
-              name="mdi-alert-box"
-              class="q-mx-xs"
-              size="sm"
-              color="yellow-10"
-            />
-            ไม่พบข้อความ
-          </div>
-        </q-banner>
-      </q-card>
-    </div>
-  </div>
+							<q-item-section side top>
+								<q-item-label caption>{{ contact.timereceive }}</q-item-label>
+							</q-item-section>
+						</q-item>
+					</q-list>
+				</q-scroll-area>
+				<q-banner rounded class="bg-amber-1 text-center q-mx-sm" v-else>
+					<div class="text-yellow-10">
+						<q-icon name="mdi-alert-box" class="q-mx-xs" size="sm" color="yellow-10" />
+						ไม่พบข้อความ
+					</div>
+				</q-banner>
+			</q-card>
+		</div>
+	</div>
 </template>
 <style>
 .my-menu-link {
-  color: #1bb19b;
-  background: #ebf9f7 !important;
-  font-weight: 600;
-  border-radius: 10px;
+	color: #1bb19b;
+	background: #ebf9f7 !important;
+	font-weight: 600;
+	border-radius: 10px;
 }
 .my-menu-link .q-hoverable {
-  border-radius: 10px;
+	border-radius: 10px;
 }
 .my-menu {
-  background: #f1f0f04a;
-  border-radius: 10px;
+	background: #f1f0f04a;
+	border-radius: 10px;
 }
 .q-card {
-  border-radius: 12px;
+	border-radius: 12px;
 }
 .text-18px {
-  font-size: 1.25em;
+	font-size: 1.25em;
 }
 .noactive {
-  color: #35473c;
-  border-radius: 12px;
-  padding: 10%;
-  transition: 0.1s ease;
-  opacity: 1;
-  cursor: pointer;
+	color: #35473c;
+	border-radius: 12px;
+	padding: 10%;
+	transition: 0.1s ease;
+	opacity: 1;
+	cursor: pointer;
 }
 .noactive:hover {
-  background: #ebf9f7;
-  color: #1bb19b !important;
-  font-weight: 600;
-  border: 1px solid #6dbdb142;
+	background: #ebf9f7;
+	color: #1bb19b !important;
+	font-weight: 600;
+	border: 1px solid #6dbdb142;
 }
 .disabledcard {
-  color: rgba(209, 209, 209, 0.733) !important;
-  border-color: rgba(207, 207, 207, 0.322) !important;
-  box-shadow: none !important;
-  border-radius: 12px;
-  cursor: no-drop !important;
-  padding: 10%;
+	color: rgba(209, 209, 209, 0.733) !important;
+	border-color: rgba(207, 207, 207, 0.322) !important;
+	box-shadow: none !important;
+	border-radius: 12px;
+	cursor: no-drop !important;
+	padding: 10%;
 }
 </style>
diff --git a/src/modules/05_leave/componenst/addAbsence.vue b/src/modules/05_leave/componenst/addAbsence.vue
index 7470ecd..865a4e3 100644
--- a/src/modules/05_leave/componenst/addAbsence.vue
+++ b/src/modules/05_leave/componenst/addAbsence.vue
@@ -108,19 +108,25 @@ const saveAbsence = () => {
 	})
 		.onOk(() => {
 			// createFormresign()
+			if (model.value !== "ลาไปศึกษา ฝึกอบรม ปฎิบัติการวิจัย หรือดูงาน") {
+				console.log(1)
+			} else if (model.value === "ลาไปศึกษา ฝึกอบรม ปฎิบัติการวิจัย หรือดูงาน") {
+				console.log(2)
+			}
+			router.push(`/leave`)
 		})
 		.onCancel(() => {})
 		.onDismiss(() => {})
 }
 
-const saveData = () => {
-	if (model.value !== "ลาไปศึกษา ฝึกอบรม ปฎิบัติการวิจัย หรือดูงาน") {
-		console.log(1)
-	} else if (model.value === "ลาไปศึกษา ฝึกอบรม ปฎิบัติการวิจัย หรือดูงาน") {
-		console.log(2)
-	}
-	router.push(`/leave`)
-}
+// const saveData = () => {
+// 	if (model.value !== "ลาไปศึกษา ฝึกอบรม ปฎิบัติการวิจัย หรือดูงาน") {
+// 		console.log(1)
+// 	} else if (model.value === "ลาไปศึกษา ฝึกอบรม ปฎิบัติการวิจัย หรือดูงาน") {
+// 		console.log(2)
+// 	}
+// 	router.push(`/leave`)
+// }
 </script>
 <template>
 	<div class="col-12 row justify-center">
@@ -382,7 +388,7 @@ const saveData = () => {
 					<q-separator />
 					<div class="row col-12 q-pa-md">
 						<q-space />
-						<q-btn unelevated dense class="q-px-md items-center btnBlue" label="บันทึก" @click="saveData" />
+						<q-btn unelevated dense class="q-px-md items-center btnBlue" label="บันทึก" @click="saveAbsence" />
 					</div>
 				</q-card>
 			</q-form>