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

ui contact

Browse source
This commit is contained in:
kanyarat2001 2023-12-15 14:55:09 +07:00
commit a345409487
2 changed files with 170 additions and 33 deletions
Download patch file Download diff file Expand all files Collapse all files

83
src/views/MainLayout.vue
View file

@ -9,12 +9,12 @@ const $q = useQuasar();
const tab = ref('')
const currentRouteName = ref('');
const currentRouteName = router.currentRoute.value.name;
const currentRoute = ref(currentRouteName);
const text = ref('');
const menuList = [
{text:'ข้อมูลหลัก',path: 'metadata'},
{text:'โครงสร้างอัตรากำลัง',path: 'organizational'},
];
const mainmenu = [
@ -33,26 +33,29 @@ const mainmenu = [
const clickMain = (val: string) => {
router.push(val)
currentRouteName.value = val
currentRoute.value = val
tab.value=val
};
const goHome = () => {
router.push('/')
currentRouteName.value = ''
currentRoute.value = 'home'
};
const click = () => {
router.push('/contact')
currentRouteName.value = 'contact'
currentRoute.value = 'contact'
};
const scrollInfo = ref({})
const onScroll = (info: any) => { scrollInfo.value = info}
</script>
<!-- โครงเว็บ -->
<template>
<q-layout view="hHh LpR fFr">
<q-scroll-observer @scroll="onScroll" />
<!-- header -->
<q-header flat class="text-dark col-12 bg-header bg-transparent" height-hint="7">
<q-header flat class="text-dark col-12 bg-transparent" height-hint="7">
<q-toolbar class="q-my-xs items-center" :style="$q.screen.gt.xs ? 'padding: 1% 2%;': 'padding: 1% 4%;'">
<div class="row items-center no-wrap cursor-pointer" @click="goHome" v-if="$q.screen.gt.xs">
<q-img src="@/assets/logo.png" spinner-color="white" style="height: 35px; max-width: 35px"/>
@ -76,12 +79,10 @@ const click = () => {
<img src="@/assets/logo.png" style="height: 35px; max-width: 35px" />
</div>
<q-space></q-space>
<div>
<q-btn class="text-weight-medium" flat color="white" label="หน้าแรก" @click="goHome"/>
<q-btn color="secondary" text-color="white" label="ติดต่อเรา" @click="click()"/>
<div class="row q-col-gutter-x-sm">
<div><q-btn class="text-weight-medium" flat color="white" label="หน้าแรก" @click="goHome"/></div>
<div><q-btn color="secondary" text-color="white" label="ติดต่อเรา" @click="click()"/></div>
</div>
</q-toolbar>
</q-header>
@ -99,10 +100,9 @@ const click = () => {
</template>
</q-input>
</div>
<div class="col-xs-10 col-md-8 row q-col-gutter-md" style=" margin-top: 80px;" v-if="currentRouteName == ''">
<div class="col-12 row justify-center text-h6 text-dark">ระบบทรัพยากรบุคคล</div>
<div class="col-12"><q-separator color="grey-4" /></div>
<div class="col-xs-10 col-md-8 row q-col-gutter-md" style=" margin-top: 80px;" v-if="currentRoute == 'home'">
<div class="col-12 row justify-center text-h6 text-dark">ระบบทรัพยากรบุคคล</div>
<div class="col-12"><q-separator color="grey-4" /></div>
<div class="col-12">
<div class="col-12 row q-col-gutter-lg">
@ -119,27 +119,46 @@ const click = () => {
</div>
</div>
<div class="col-9 row q-col-gutter-md" style=" margin-top: 80px;" v-else>
<div class="col-12 content-heigt">
<div class="col-8 row" style=" margin-top: 80px;" v-else>
<q-layout>
<q-page-container class="col-12 ">
<q-page>
<div class="col-12 row ">
<div class="col-12" >
<router-view :key="$route.fullPath" />
</div>
<div class="col-12 row ">
<q-card class="col-12">
<router-view :key="$route.fullPath" />
</q-card>
</div>
<div class="col-12 row" style="margin-top: 30px;" v-if="currentRouteName != 'contact'">
<q-page-scroller position="bottom-center" :scroll-offset="300" :offset="[18, 18]" >
<q-tabs content-class="red" no-caps active-color="primary" indicator-color="transparent" class="text-grey-8" v-model="tab">
<q-tab name="metadata" label="ข้อมูลหลัก" @click="router.push({ path: '/metadata' })"/>
<q-tab name="organizational" label="โครงสร้างอัตรากำลัง" @click="router.push({ path: '/organizational' })" />
<div class="col-12 row " v-if="currentRouteName != 'contact'">
<q-tabs no-caps active-color="primary" indicator-color="transparent" class="text-grey-8" v-model="tab">
<q-tab name="metadata" label="ข้อมูลหลัก" @click="router.push({ path: '/metadata' })"/>
<q-tab name="organizational" label="โครงสร้างอัตรากำลัง" @click="router.push({ path: '/organizational' })" />
<q-tab name="articles" label="Articles" />
</q-tabs>
</div>
</div>
<q-tab name="organizational" label="ทะเบียนประวัติ" @click="router.push({ path: '/organizational' })" />
<q-tab name="organizational" label="ทะเบียนประวัติลูกจ้าง" @click="router.push({ path: '/organizational' })" />
<q-tab name="organizational" label="ออกคำสั่ง" @click="router.push({ path: '/organizational' })" />
<q-tab name="organizational" label="สรรหา" @click="router.push({ path: '/organizational' })" />
<q-tab name="organizational" label="บรรจุ แต่งตั้ง ย้าย โอน" @click="router.push({ path: '/organizational' })" />
<q-tab name="organizational" label="พ้นราชการ" @click="router.push({ path: '/organizational' })" />
<q-tab name="organizational" label="เครื่องราชฯ" @click="router.push({ path: '/organizational' })" />
<q-tab name="organizational" label="การลา" @click="router.push({ path: '/organizational' })" />
<q-tab name="organizational" label="วินัย" @click="router.push({ path: '/organizational' })" />
</q-tabs>
</q-page-scroller>
</div>
</div>
</q-page>
</q-page-container>
</q-layout>
</div>
</div>
</q-page>
<!-- place QPageScroller at end of page -->
<q-page-scroller position="bottom-right" :scroll-offset="150" :offset="[18, 50]">
<q-btn fab icon="keyboard_arrow_up" color="blue" />
</q-page-scroller>
</q-page-container>
</q-layout>
</template>
@ -209,7 +228,7 @@ const click = () => {
}
.content-heigt{
height: 55vh !important;
height: 60vh !important;
overflow-y:auto;
}