update auth

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-08-28 13:43:21 +07:00
parent 23afdc4df9
commit ff3fb68219
12 changed files with 222 additions and 308 deletions

View file

@ -2,9 +2,9 @@
import { ref, onMounted, watch } from 'vue'
import { useRouter } from 'vue-router'
import { useQuasar } from 'quasar'
import keycloak, { kcLogout } from '@/plugins/keycloak'
import http from '@/plugins/http'
import config from '@/app.config'
import { logout, tokenParsed } from '@/plugins/auth'
import type { notiType } from '@/interface/index/Main'
import { useCounterMixin } from '@/stores/mixin'
@ -46,22 +46,20 @@ async function fetchNotifications(index: number, type: string) {
notiList.value = []
}
if (response.length === 0) {
response.map((e: Noti) => {
list.push({
id: e.id,
sender:
e.createdFullName == '' || e.createdFullName == null
? 'เจ้าหน้าที่'[0]
: e.createdFullName[0],
body: e.body ?? '',
timereceive: e.receiveDate,
isOpen: e.isOpen,
})
response.map((e: Noti) => {
list.push({
id: e.id,
sender:
e.createdFullName == '' || e.createdFullName == null
? 'เจ้าหน้าที่'[0]
: e.createdFullName[0],
body: e.body ?? '',
timereceive: e.receiveDate,
isOpen: e.isOpen,
})
notiList.value.push(...list)
statusLoad.value = totalNotiList.value === 0 ? true : false
}
})
notiList.value.push(...list)
statusLoad.value = totalNotiList.value === 0 ? true : false
})
// .catch((err) => {
// messageError($q, err)
@ -100,7 +98,7 @@ function onClickLogout() {
ok: 'ยืนยัน',
persistent: true,
}).onOk(async () => {
kcLogout()
logout()
})
}
@ -145,8 +143,9 @@ watch(
const fullName = ref<string>('')
onMounted(async () => {
fetchTotolNotificate()
if (keycloak.tokenParsed != null) {
fullName.value = keycloak.tokenParsed.name
const checkTokenParsed = await tokenParsed()
if (checkTokenParsed != null) {
fullName.value = checkTokenParsed.name
}
})
</script>

View file

@ -6,7 +6,7 @@ import moment from 'moment'
import Camera from 'simple-vue-camera'
import http from '@/plugins/http'
import config from '@/app.config'
import keycloak from '@/plugins/keycloak'
import { tokenParsed } from '@/plugins/auth'
// import Type
import type { FormRef } from '@/interface/response/checkin'
@ -52,58 +52,6 @@ async function fetchCheckTime() {
})
}
const notiTrigger = ref<boolean>(false)
const notiList = ref<notiType[]>([])
/** function เรียกข้อมุลแจ้งเตือน */
async function fetchNotifications() {
showLoader()
await http
.get(config.API.msgNotificate)
.then((res) => {
// const response = res.data.result
// const list: notiType[] = []
// response.map((e: any) => {
// list.push({
// id: e.id,
// sender:
// e.createdFullName == '' || e.createdFullName == null
// ? ''[0]
// : e.createdFullName[0],
// body: e.body ?? '',
// timereceive: new Date(e.receiveDate),
// })
// })
// notiList.value = list
})
.catch((err) => {
messageError($q, err)
})
.finally(() => {
hideLoader()
})
}
/**
* function ลบรายการแจงเตอน
* @param id noti
*/
async function onClickDelete(id: string) {
dialogRemove($q, async () => {
await http
.delete(config.API.msgId(id))
.then(() => {
success($q, 'ลบข้อมูลสำเร็จ')
})
.catch((e) => {
messageError($q, e)
})
.finally(async () => {
await fetchNotifications()
hideLoader()
})
})
}
/** ref อัพเดทเวลา*/
const dateNow = ref<Date>(new Date())
const Thai = ref<Date>(dateNow.value)
@ -302,9 +250,9 @@ const fullName = ref<string>('')
/** Hook*/
onMounted(async () => {
await fetchCheckTime()
await fetchNotifications()
if (keycloak.tokenParsed != null) {
fullName.value = keycloak.tokenParsed.name
const checkToken = await tokenParsed()
if (checkToken != null) {
fullName.value = checkToken.name
}
updateClock()
@ -317,113 +265,12 @@ onMounted(async () => {
<q-card flat class="row col-12 cardNone">
<div :class="getClass(stetusCheckin)">
<q-toolbar class="text-primary">
<!-- <q-btn
icon="history"
unelevated
rounded
dense
flat
color="white"
:label="$q.screen.gt.xs ? 'ประวัติการลงเวลา' : ''"
:class="$q.screen.gt.xs ? 'q-px-md' : ''"
@click="router.push('/history')"
/> -->
<q-toolbar-title>
<span class="text-white text-body1 text-weight-bold text-center">
<span v-if="stetusCheckin">ลงเวลาเข้างาน</span>
<span v-else>ลงเวลาออกงาน</span>
</span>
</q-toolbar-title>
<!-- <q-btn
round
dense
flat
size="13px"
class="q-mx-md"
:disable="notiList.length === 0"
>
<q-icon name="notifications" size="24px" color="white" />
<q-badge
rounded
v-show="notiList.length > 0"
color="negative"
text-color="white"
floating
>{{ notiList.length }}</q-badge
>
<q-menu v-model="notiTrigger" max-width="480px" :offset="[0, 10]">
<div class="q-px-md q-py-sm row col-12 items-center">
<div class="text-subtitle1 text-weight-medium">
การแจงเตอน
</div>
</div>
<q-list
style="min-width: 300px"
v-for="n in notiList"
:key="n.id"
>
<q-item v-ripple class="mytry q-py-xs" dense>
<q-item-section avatar top style="min-width: 40px">
<q-avatar color="primary" size="22px" text-color="white">
<span class="text-weight-medium text-uppercase">{{
n.sender
}}</span>
</q-avatar>
</q-item-section>
<q-item-section>
<q-item-label caption class="text-black">{{
n.body
}}</q-item-label>
<q-item-label
caption
class="row items-center text-grey-7"
>{{ date2Thai(n.timereceive) }}</q-item-label
>
</q-item-section>
<q-btn
size="sm"
unelevated
dense
icon="mdi-close"
class="mybtn q-mx-xs"
@click="onClickDelete(n.id)"
></q-btn>
</q-item>
<q-separator color="grey-2" />
</q-list>
</q-menu>
</q-btn> -->
<!-- <q-btn round dense flat size="13px" class="q-mx-md">
<q-icon name="account_circle" size="24px" color="white" />
<q-menu>
<div class="q-pa-md" style="max-width: 500px">
<q-list>
<q-item>
<q-item-section avatar>
<q-icon color="primary" name="account_circle" />
</q-item-section>
<q-item-section>{{ fullName }}</q-item-section>
</q-item>
<q-item class="text-center">
<q-item-section>
<q-item-label>
<q-btn
color="primary"
label="ออกจากระบบ"
push
size="sm"
@click="onClickLogout"
/></q-item-label>
</q-item-section>
</q-item>
</q-list>
</div>
</q-menu>
</q-btn> -->
</q-toolbar>
</div>
<div class="col-12 q-pa-md text-grey-9">
@ -560,7 +407,7 @@ onMounted(async () => {
v-model="model"
:options="options"
prefix="ระบุสถานที่ :"
:rules="[(val) => !!val || 'กรุณาระบุสถานที่']"
:rules="[(val:string) => !!val || 'กรุณาระบุสถานที่']"
lazy-rules
@update:model-value="selectLocation()"
/>
@ -576,7 +423,7 @@ onMounted(async () => {
outlined
v-model="useLocation"
label="ระบุสถานที่"
:rules="[(val) => !!val || 'กรุณาระบุสถานที่']"
:rules="[(val:string) => !!val || 'กรุณาระบุสถานที่']"
lazy-rules
/>
</div>

View file

@ -1,15 +1,19 @@
<script setup lang="ts">
import { kcAuthen } from '@/plugins/keycloak'
import { onMounted } from 'vue'
import { useRoute } from 'vue-router'
import { setAuthen } from '@/plugins/auth'
const route = useRoute()
onMounted(async () => {
if (route.query.token && route.query.accessToken) {
// console.log('query', route.query.token)
// console.log('accessToken', route.query.accessToken)
kcAuthen(route.query.token.toString(), route.query.accessToken.toString())
const params: any = await {
access_token: route.query.token,
expires_in: route.query.expires ? route.query.expires : 36000,
refresh_token: route.query.accessToken,
}
setAuthen(params)
}
})
</script>

View file

@ -2,10 +2,10 @@
<script setup lang="ts">
import { onMounted, ref } from 'vue'
import axios from 'axios'
import keycloak, { kcAuthen, keycloakConfig } from '@/plugins/keycloak'
import { useRouter } from 'vue-router'
import { useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin'
import { setAuthen, authenticated } from '@/plugins/auth'
const router = useRouter()
const mixin = useCounterMixin()
@ -18,24 +18,17 @@ const password = ref<string>('')
async function onSubmit() {
showLoader()
const formdata = new URLSearchParams()
formdata.append('client_id', keycloakConfig.clientId)
formdata.append('client_secret', keycloakConfig.clientSecret)
formdata.append('grant_type', 'password')
formdata.append('username', username.value)
formdata.append('password', password.value)
await axios
.post(
`${keycloakConfig.url}/realms/${keycloakConfig.realm}/protocol/openid-connect/token`,
formdata,
{
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
}
)
.post(`${import.meta.env.VITE_API_URI_CONFIG}/org/login`, formdata, {
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
})
.then(async (res) => {
kcAuthen(res.data.access_token, res.data.refresh_token)
setAuthen(res.data.result)
})
.catch((err) => {
messageError($q, err, 'ชื่อผู้ใช้หรือรหัสผ่านไม่ถูกต้อง')
@ -45,10 +38,9 @@ async function onSubmit() {
})
}
onMounted(() => {
if (keycloak.authenticated) {
console.log('authenticated', keycloak.authenticated)
onMounted(async () => {
const checkAuthen = await authenticated()
if (checkAuthen) {
router.push('/')
}
})