ปรับ mainmenu จาก icon เป็น img
Tanyalak
|
Before Width: | Height: | Size: 7.8 KiB After Width: | Height: | Size: 7.8 KiB |
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 7.3 KiB After Width: | Height: | Size: 7.3 KiB |
|
Before Width: | Height: | Size: 7.2 KiB After Width: | Height: | Size: 7.2 KiB |
|
Before Width: | Height: | Size: 6.7 KiB After Width: | Height: | Size: 6.7 KiB |
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 9 KiB After Width: | Height: | Size: 9 KiB |
|
Before Width: | Height: | Size: 9.4 KiB After Width: | Height: | Size: 9.4 KiB |
|
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 13 KiB |
|
|
@ -12,7 +12,7 @@ const currentRouteName = router.currentRoute.value.name;
|
|||
const currentRoute = ref(currentRouteName);
|
||||
const text = ref('');
|
||||
const tabManu = [
|
||||
{name: 'metadata',label:'ข้อมูลหลัก',path: 'metadata',},
|
||||
{name: 'metadata',label:'ข้อมูลหลัก',path: 'metadata'},
|
||||
{name: 'organizational',label:'โครงสร้างอัตรากำลัง',path: 'organizational'},
|
||||
{name: '3',label:'ทะเบียนประวัติ',path: ''},
|
||||
{name: '4',label:'ทะเบียนประวัติลูกจ้าง',path: ''},
|
||||
|
|
@ -28,17 +28,17 @@ const tabManu2 = [
|
|||
];
|
||||
|
||||
const mainmenu = [
|
||||
{text: 'ข้อมูลหลัก', icon:'mdi-account-outline', path: 'metadata'},
|
||||
{text: 'โครงสร้างอัตรากำลัง', icon:'mdi-account-group-outline',path: 'organizational'},
|
||||
{text: 'ทะเบียนประวัติ', icon:'mdi-file-account-outline',path: 'organizational'},
|
||||
{text: 'ทะเบียนประวัติลูกจ้าง', icon:'mdi-file-account-outline',path: 'organizational'},
|
||||
{text: 'ออกคำสั่ง', icon:'mdi-file-certificate-outline',path: 'organizational'},
|
||||
{text: 'สรรหา', icon:'mdi-magnify',path: 'organizational'},
|
||||
{text: 'บรรจุ แต่งตั้ง ย้าย โอน', icon:'mdi-account-check',path: 'organizational'},
|
||||
{text: 'พ้นราชการ', icon:'mdi-account-cancel-outline',path: 'organizational'},
|
||||
{text: 'เครื่องราชฯ', icon:'mdi-medal-outline',path: 'organizational'},
|
||||
{text: 'การลา', icon:'mdi-calendar',path: 'organizational'},
|
||||
{text: 'วินัย', icon:'mdi-scale-balance',path: 'organizational'}
|
||||
{text: 'ข้อมูลหลัก',img: new URL('../assets/icon/1_metadata.png', import.meta.url).href , icon:'mdi-account-outline', path: 'metadata'},
|
||||
{text: 'โครงสร้างอัตรากำลัง',img: new URL('../assets/icon/2_organizational.png', import.meta.url).href, icon:'mdi-account-group-outline',path: 'organizational'},
|
||||
{text: 'ทะเบียนประวัติ',img: new URL('../assets/icon/3_registry.png', import.meta.url).href, icon:'mdi-file-account-outline',path: 'organizational'},
|
||||
{text: 'ทะเบียนประวัติลูกจ้าง',img: new URL('../assets/icon/4_registry-employee.png', import.meta.url).href, icon:'mdi-file-account-outline',path: 'organizational'},
|
||||
{text: 'ออกคำสั่ง',img: new URL('../assets/icon/5_order.png', import.meta.url).href, icon:'mdi-file-certificate-outline',path: 'organizational'},
|
||||
{text: 'สรรหา',img: new URL('../assets/icon/6_recruitmain.png', import.meta.url).href, icon:'mdi-magnify',path: 'organizational'},
|
||||
{text: 'บรรจุ แต่งตั้ง ย้าย โอน',img: new URL('../assets/icon/7_placement.png', import.meta.url).href, icon:'mdi-account-check',path: 'organizational'},
|
||||
{text: 'พ้นราชการ',img: new URL('../assets/icon/8_retirement.png', import.meta.url).href, icon:'mdi-account-cancel-outline',path: 'organizational'},
|
||||
{text: 'เครื่องราชฯ',img: new URL('../assets/icon/9_insignia.png', import.meta.url).href, icon:'mdi-medal-outline',path: 'organizational'},
|
||||
/* {text: 'การลา',img: new URL('../assets/.png', import.meta.url).href, icon:'mdi-calendar',path: 'organizational'},
|
||||
{text: 'วินัย',img: new URL('../assets/.png', import.meta.url).href, icon:'mdi-scale-balance',path: 'organizational'} */
|
||||
];
|
||||
|
||||
|
||||
|
|
@ -153,8 +153,11 @@ window.onpopstate = function() {
|
|||
:key="index"
|
||||
>
|
||||
<q-card class="connn q-pa-md row justify-center text-dark cursor-pointer cardmenu" @click="clickMain(menu.path)" ><!-- router.push({ name: `${}`}) -->
|
||||
<q-icon class="col-12 items-center" size="40px" :name="`${menu.icon}`"/>
|
||||
<div class="q-pt-md">{{ menu.text }} </div>
|
||||
<!-- <q-icon class="col-12 items-center" size="40px" :name="`${menu.icon}`"/> -->
|
||||
<q-avatar rounded size="60px">
|
||||
<q-img :src="menu.img" />
|
||||
</q-avatar>
|
||||
<div class="col-12 q-pt-md text-center">{{ menu.text }} </div>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -259,7 +262,7 @@ window.onpopstate = function() {
|
|||
</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="primary" />
|
||||
<q-btn fab icon="keyboard_arrow_up" color="blue" />
|
||||
</q-page-scroller>
|
||||
</q-page-container>
|
||||
</q-layout>
|
||||
|
|
@ -345,10 +348,4 @@ window.onpopstate = function() {
|
|||
color: #02A998;
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
width: 24px; /* ปรับขนาดตามต้องการ */
|
||||
height: 24px; /* ปรับขนาดตามต้องการ */
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
|||