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

เพิ่ม Ui ตำแหน่งตอนสร้างรอบสมัคร

Browse source
This commit is contained in:
Kittapath 2023-04-05 00:59:05 +07:00
parent b42d797c78
commit 3dcdba77a6
14 changed files with 420 additions and 273 deletions
Download patch file Download diff file Expand all files Collapse all files

114
src/views/MainLayout.vue
View file

@ -1,19 +1,31 @@
<script setup lang="ts">
import { useQuasar } from 'quasar'
import { ref } from 'vue'
import { onMounted, ref } from 'vue'
// import keycloak from '@/plugins/keycloak'
import { useRoute } from 'vue-router'
import { menuList, options, notiList } from '../interface/main/index'
import keycloak from '@/plugins/keycloak'
import { useCounterMixin } from '@/stores/mixin'
import http from '@/plugins/http'
import config from '@/app.config'
const route = useRoute()
const $q = useQuasar()
const mixin = useCounterMixin() //เรียกฟังก์ชันกลาง
const { statusCandidate } = mixin
const miniState = ref<boolean>(false)
const active = ref<number>(0)
const drawerL = ref<boolean>(false)
const fullname = ref<string>('')
const notiTrigger = ref<boolean>(false)
const loader = ref<boolean>(false)
const status = ref<string>('register')
const examId = ref<string>(route.params.id.toString())
const positionId = ref<string>(route.params.positionId.toString())
onMounted(async () => {
await fetchStatus()
})
const toggleBtnLeft = () => {
if (window.innerWidth < 1024) {
@ -51,6 +63,20 @@ const doLogout = () => {
})
}
const fetchStatus = async () => {
loader.value = true
await http
.get(config.API.candidateStatus(examId.value, positionId.value))
.then((res) => {
const data = res.data.result
status.value = data
})
.catch(() => {})
.finally(() => {
loader.value = false
})
}
/**
* ดิงชื่อผู้ใช้งานจาก keycloak
*/
@ -67,30 +93,45 @@ const doLogout = () => {
<q-layout view="lHh LpR lff" class="bgColor text-dark">
<!-- header -->
<q-header flat class="bg-white text-white row justify-center header" height-hint="7">
<q-toolbar style="padding:0% 2%" class="col-xs-12 col-sm-11 col-md-11 col-lg-10">
<q-toolbar-title shrink class="row items-center no-wrap">
<q-btn flat class="bg-white" dense round>
<q-avatar size="35px">
<img src="../assets/logo.png" />
</q-avatar>
</q-btn>
<div class="row q-ml-md text-dark" v-if="$q.screen.gt.xs">
<div class="col-12 textline1">
ระบบทรัพยากรบุคคล
</div>
<div class="text-caption textline2">
กรุงเทพมหานคร
</div>
</div>
</q-toolbar-title>
<q-space/>
<q-btn v-if="$q.screen.gt.xs" class="bg-amber-1 text-amber-9" icon="mdi-logout-variant" size="12px" label="ออกจากระบบ" flat v-close-popup @click="doLogout" />
<q-btn v-else class="bg-amber-1 text-amber-9" icon="mdi-logout-variant" flat v-close-popup @click="doLogout" />
</q-toolbar>
</q-header>
<q-toolbar style="padding: 0% 2%" class="col-xs-12 col-sm-11 col-md-11 col-lg-10">
<q-toolbar-title shrink class="row items-center no-wrap">
<q-btn flat class="bg-white" dense round>
<q-avatar size="35px">
<img src="../assets/logo.png" />
</q-avatar>
</q-btn>
<div class="row q-ml-md text-dark" v-if="$q.screen.gt.xs">
<div class="col-12 textline1">ระบบทรัพยากรบุคคล</div>
<div class="text-caption textline2">กรุงเทพมหานคร</div>
</div>
</q-toolbar-title>
<q-space />
<q-badge outline color="blue" class="q-mr-md text-bold">
{{ statusCandidate(status) }}
</q-badge>
<q-btn
v-if="$q.screen.gt.xs"
class="bg-amber-1 text-amber-9"
icon="mdi-logout-variant"
size="12px"
label="ออกจากระบบ"
flat
v-close-popup
@click="doLogout"
/>
<q-btn
v-else
class="bg-amber-1 text-amber-9"
icon="mdi-logout-variant"
flat
v-close-popup
@click="doLogout"
/>
</q-toolbar>
</q-header>
<!-- end header -->
<q-page-container class="row justify-center">
<q-page style="padding:1.5% 2%" class="col-xs-12 col-sm-11 col-md-11 col-lg-10">
<q-page style="padding: 1.5% 2%" class="col-xs-12 col-sm-11 col-md-11 col-lg-10">
<router-view :key="$route.fullPath" />
</q-page>
</q-page-container>
@ -99,10 +140,10 @@ const doLogout = () => {
<style>
.bgColor {
/* background-image: url("../assets/bg.png");
/* background-image: url("../assets/bg.png");
background-size: cover;
background-size: 100%; */
background: #F6F9FA;
background: #f6f9fa;
}
.tabNative {
@ -118,14 +159,14 @@ const doLogout = () => {
}
.q-card {
box-shadow: 3px 3px 20px -10px rgba(151, 150, 150, 0.261) ;
box-shadow: 3px 3px 20px -10px rgba(151, 150, 150, 0.261);
}
.q-card--bordered {
border: 1px solid #92b4c847;
box-shadow: none !important;
}
.q-stepper{
box-shadow: 3px 3px 20px -10px rgba(151, 150, 150, 0.261) ;
.q-stepper {
box-shadow: 3px 3px 20px -10px rgba(151, 150, 150, 0.261);
}
.q-menu {
box-shadow: 3px 3px 10px 1px rgba(95, 95, 95, 0.15) !important;
@ -140,7 +181,8 @@ const doLogout = () => {
border-radius: 5px;
}
.q-field--outlined .q-field__control:before,.q-field .q-field__control:before{
.q-field--outlined .q-field__control:before,
.q-field .q-field__control:before {
border-color: #c8d3db;
}
.q-field--outlined .q-icon {
@ -167,17 +209,17 @@ const doLogout = () => {
background-color: #a8bbbf;
}
.header{
.header {
border-bottom: 1px solid #92b4c847;
height: 50px;
}
.textline1{
font-size: 0.90rem;
line-height:1.2rem !important;
.textline1 {
font-size: 0.9rem;
line-height: 1.2rem !important;
font-weight: 500;
}
.textline2{
line-height:1rem !important;
.textline2 {
line-height: 1rem !important;
font-weight: 400;
color: #96a9ad;
}