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

ต่อ api history

Browse source
This commit is contained in:
AnandaTon 2023-11-20 12:11:34 +07:00
parent 8b1d2e93f5
commit 89e32d5929
3 changed files with 179 additions and 58 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/api/api.history.ts
View file

@ -1,6 +1,6 @@
import env from "./index";
const history = `${env.API_URI}/leave/check-in/history`;
import env from './index'
const history = `${env.API_URI}/leave/check-in/history`
export default {
history
};
history: () => `${history}`,
}

96
src/stores/mixin.ts
View file

@ -1,5 +1,6 @@
import { defineStore } from 'pinia'
import CustomComponent from '@/components/CustomDialog.vue'
import { Loading, QSpinnerCube } from 'quasar'
export const useCounterMixin = defineStore('mixin', () => {
function date2Thai(srcDate: Date, isFullMonth = false, isTime = false) {
@ -113,10 +114,105 @@ export const useCounterMixin = defineStore('mixin', () => {
if (cancel) cancel()
})
}
const showLoader = () => {
Loading.show({
spinner: QSpinnerCube,
spinnerSize: 140,
spinnerColor: 'primary',
backgroundColor: 'white',
})
}
const hideLoader = () => {
Loading.hide()
}
const messageError = (q: any, e: any = '') => {
// q.dialog.hide();
if (e.response !== undefined) {
if (e.response.data.status !== undefined) {
if (e.response.data.status == 401) {
//invalid_token
q.dialog({
component: CustomComponent,
componentProps: {
title: `พบข้อผิดพลาด`,
message: `ล็อกอินหมดอายุ กรุณาล็อกอินใหม่อีกครั้ง`,
icon: 'warning',
color: 'red',
onlycancel: true,
},
})
} else {
const message = e.response.data.result ?? e.response.data.message
q.dialog({
component: CustomComponent,
componentProps: {
title: `พบข้อผิดพลาด`,
message: `${message}`,
icon: 'warning',
color: 'red',
onlycancel: true,
},
})
}
} else {
if (e.response.status == 401) {
//invalid_token
q.dialog({
component: CustomComponent,
componentProps: {
title: `พบข้อผิดพลาด`,
message: `ล็อกอินหมดอายุ กรุณาล็อกอินใหม่อีกครั้ง`,
icon: 'warning',
color: 'red',
onlycancel: true,
},
})
} else if (e.response.data.successful === false) {
q.dialog({
component: CustomComponent,
componentProps: {
title: `พบข้อผิดพลาด`,
message: e.response.data.message,
icon: 'warning',
color: 'red',
onlycancel: true,
},
})
} else {
q.dialog({
component: CustomComponent,
componentProps: {
title: `พบข้อผิดพลาด`,
message: `ข้อมูลผิดพลาดทำให้เกิดการไม่ตอบสนองต่อการเรียกใช้งานดูเว็บไซต์`,
icon: 'warning',
color: 'red',
onlycancel: true,
},
})
}
}
} else {
q.dialog({
component: CustomComponent,
componentProps: {
title: `พบข้อผิดพลาด`,
message: `ข้อมูลผิดพลาดทำให้เกิดการไม่ตอบสนองต่อการเรียกใช้งานดูเว็บไซต์`,
icon: 'warning',
color: 'red',
onlycancel: true,
},
})
}
}
return {
date2Thai,
covertDateObject,
dialogConfirm,
showLoader,
hideLoader,
messageError,
}
})

133
src/views/HistoryView.vue
View file

@ -1,73 +1,98 @@
<script setup lang="ts">
import type { QTableProps } from 'quasar'
import { ref, onMounted } from 'vue'
import { useQuasar } from 'quasar'
import { useRouter } from 'vue-router'
import Table from '@/components/TableHistory.vue'
import ToolBar from '@/components/ToolBar.vue'
import http from '@/plugins/http'
import config from '@/app.config'
import { useCounterMixin } from '@/stores/mixin'
// importStores
import { useChekIn } from '@/stores/chekin'
const mixin = useCounterMixin()
const router = useRouter()
const stores = useChekIn()
const { showLoader, hideLoader, messageError } = mixin
const { fetchHistoryList } = stores
const $q = useQuasar() //ใช้ noti quasar
onMounted(() => {
fetchlist()
// fetchlist()
fetchlistHistory()
})
function fetchlist() {
const listData = [
{
no: '1',
date: '13/08/66',
in: '11:20',
loIn: 'สำนักงาน ก.ก ',
out: '',
loOut: '',
status: '',
Morningstatus: '1',
AfternoonStatus: '1',
statusEdit: 'wait',
},
{
no: '2',
date: '12/08/66',
in: '08:04',
loIn: 'สำนักงาน ก.ก ',
out: '17:01',
loOut: 'สำนักงาน ก.ก ',
status: 'ลงเวลาเรียบร้อย',
Morningstatus: '2',
AfternoonStatus: '2',
statusEdit: 'edit',
},
{
no: '3',
date: '11/08/66',
in: '08:34',
loIn: 'สำนักงาน ก.ก ',
out: '17:36',
loOut: 'สำนักงาน ก.ก ',
status: 'สาย ทำงานครบ',
Morningstatus: '3',
AfternoonStatus: '2',
statusEdit: 'edit',
},
{
no: '4',
date: '10/08/66',
in: '08:48',
loIn: 'สำนักงาน ก.ก ',
out: '17:00',
loOut: 'สำนักงาน ก.ก ',
status: 'สาย ทำงานไม่ครบ',
Morningstatus: '3',
AfternoonStatus: '3',
statusEdit: 'approve',
},
]
stores.fetchHistoryList(listData)
//นำข้อมูลมาแสดง
const fetchlistHistory = async () => {
showLoader()
await http
.get(config.API.history())
.then((res) => {
const data = res.data.result
fetchHistoryList(data)
})
.catch((err) => {
messageError($q, err)
})
.finally(() => {
hideLoader()
})
}
// function fetchlist() {
// const listData = [
// {
// no: '1',
// date: '13/08/66',
// in: '11:20',
// loIn: 'สำนักงาน ก.ก ',
// out: '',
// loOut: '',
// status: '',
// Morningstatus: '1',
// AfternoonStatus: '1',
// statusEdit: 'wait',
// },
// {
// no: '2',
// date: '12/08/66',
// in: '08:04',
// loIn: 'สำนักงาน ก.ก ',
// out: '17:01',
// loOut: 'สำนักงาน ก.ก ',
// status: 'ลงเวลาเรียบร้อย',
// Morningstatus: '2',
// AfternoonStatus: '2',
// statusEdit: 'edit',
// },
// {
// no: '3',
// date: '11/08/66',
// in: '08:34',
// loIn: 'สำนักงาน ก.ก ',
// out: '17:36',
// loOut: 'สำนักงาน ก.ก ',
// status: 'สาย ทำงานครบ',
// Morningstatus: '3',
// AfternoonStatus: '2',
// statusEdit: 'edit',
// },
// {
// no: '4',
// date: '10/08/66',
// in: '08:48',
// loIn: 'สำนักงาน ก.ก ',
// out: '17:00',
// loOut: 'สำนักงาน ก.ก ',
// status: 'สาย ทำงานไม่ครบ',
// Morningstatus: '3',
// AfternoonStatus: '3',
// statusEdit: 'approve',
// },
// ]
// stores.fetchHistoryList(listData)
// }
</script>
<template>
<div class="col-12 row justify-center">