# Conflicts: src/views/MainLayout.vue && แก้กด tab ข้างล่าง

This commit is contained in:
Tanyalak 2023-12-15 15:47:16 +07:00
commit 0fe82ed983
3 changed files with 163 additions and 234 deletions

View file

@ -1,6 +1,6 @@
<script setup lang="ts">
import { onMounted, ref, watch } from "vue";
import { useRoute, useRouter } from "vue-router";
import { ref} from "vue";
import { useRouter } from "vue-router";
import { useQuasar } from "quasar";
const router = useRouter();
@ -12,9 +12,20 @@ const tab = ref('')
const currentRouteName = router.currentRoute.value.name;
const currentRoute = ref(currentRouteName);
const text = ref('');
const menuList = [
{text:'ข้อมูลหลัก',path: 'metadata'},
{text:'โครงสร้างอัตรากำลัง',path: 'organizational'},
const tabManu = [
{name: 'metadata',label:'ข้อมูลหลัก',path: 'metadata'},
{name: 'organizational',label:'โครงสร้างอัตรากำลัง',path: 'organizational'},
{name: '3',label:'ทะเบียนประวัติ',path: ''},
{name: '4',label:'ทะเบียนประวัติลูกจ้าง',path: ''},
{name: '5',label:'ออกคำสั่ง',path: ''},
{name: '6',label:'สรรหา',path: ''},
];
const tabManu2 = [
{name: '7',label:'บรรจุ แต่งตั้ง ย้าย โอน',path: ''},
{name: '8',label:'พ้นราชการ',path: ''},
{name: '9',label:'เครื่องราชฯ',path: ''},
{name: '10',label:'การลา',path: ''},
{name: '11',label:'วินัย',path: ''},
];
const mainmenu = [
@ -37,6 +48,11 @@ const clickMain = (val: string) => {
tab.value=val
};
const clickTab= (val2: string,el: any ) => {
router.push(val2)
window.scrollTo({ top: 0, left: 0, behavior: 'smooth' });
};
const goHome = () => {
router.push('/')
currentRoute.value = 'home'
@ -119,25 +135,42 @@ const onScroll = (info: any) => { scrollInfo.value = info}
</div>
</div>
<div class="col-9 row" style=" margin-top: 80px;" v-else>
<div class="col-8 row" style=" margin-top: 80px;" v-else>
<q-layout>
<q-page-container class="col-12">
<q-page-container class="col-12 ">
<q-page>
<div class="col-12 row ">
<div class="col-12" >
<div class="col-12 q-mt-lg" >
<router-view :key="$route.fullPath" />
</div>
<div class="col-12 row justify-center q-mt-lg" v-if="currentRoute != 'contact'">
<q-tabs
v-model="tab"
class="text-grey-8" dense
align="center"
no-caps
active-color="primary"
indicator-color="transparent"
>
<q-tab
v-for="(tab,index) in tabManu"
:key="index"
:name="tab.name"
:label="tab.label"
@click="clickTab(tab.path)" />
</q-tabs>
<q-tabs class="text-grey-8" dense align="center" no-caps active-color="primary" indicator-color="transparent" v-model="tab">
<q-tab
v-for="(tab,index) in tabManu2"
:key="index"
:name="tab.name"
:label="tab.label"
@click="clickTab(tab.path)" />
</q-tabs>
</div>
</div>
<div class="col-12 row" v-if="currentRouteName != 'contact'">
<q-page-scroller :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' })" />
<q-tab name="articles" label="Articles" />
</q-tabs>
</q-page-scroller>
</div>
</q-page>
</q-page-container>
</q-layout>
@ -224,4 +257,5 @@ const onScroll = (info: any) => { scrollInfo.value = info}
.bgHeader{
background: #1e2234e5;
}
</style>