jws-frontend/src/pages/MainPage.vue
2024-04-03 18:28:59 +07:00

107 lines
2.8 KiB
Vue

<script setup lang="ts">
import { ref } from 'vue';
import MenuItem from 'components/home/MenuItem.vue';
import PersonCard from 'src/components/home/PersonCard.vue';
import UsersDetailCardComponent from 'components/UsersDetailCardComponent.vue';
const menu = [
{
value: 'branch-management',
icon: 'mdi-chart-donut',
color: 'green',
title: 'จัดการสาขา',
caption: 'จัดการสาขาภายในองค์กร',
},
{
value: 'personnel-management',
icon: 'isax-frame5',
color: 'cyan',
title: 'จัดการบุคลากร',
caption: 'จัดการคนภายในองค์กร',
isax: true,
},
{
value: '',
icon: 'isax-frame5',
color: 'cyan',
title: 'จัดการลูกค้า',
caption: 'จัดการคนภายในองค์กร',
isax: true,
},
{
value: '',
icon: 'heroicons-truck-solid',
color: 'orange',
title: 'สินค้าและบริการ',
caption: 'รายการสินค้าและบริการ',
},
{
value: '',
icon: 'mdi-file-document',
color: 'violet',
title: 'ใบเสนอราคา',
caption: 'รายการใบเสนอราคา',
},
{
value: '',
icon: 'isax-device-message5',
color: 'purple',
title: 'รายการคำขอ',
caption: 'แสดงรายการคำขอ',
isax: true,
},
{
value: '',
icon: 'isax-receipt-2-15',
color: 'red',
title: 'ใบสั่งซื้อ',
caption: 'รายการใบสั่งซื้อ',
isax: true,
},
{
value: '',
icon: 'material-symbols:box',
color: 'camo',
title: 'ใบรับสินค้า',
caption: 'รายการใบรับสินค้า',
},
{
value: '',
icon: 'isax-dollar-circle4',
color: 'lime',
title: 'การจัดการการเงิน',
caption: 'รายการบัญชีทั้งหมด',
isax: true,
},
{
value: '',
icon: 'isax-element-35',
color: 'cyan',
title: 'Dashboard',
caption: 'แสดงข้อมูลสถิติ',
isax: true,
},
{
value: '',
icon: 'mdi-file-document',
color: 'indigo',
title: 'รายงาน',
caption: 'แสดงรายงาน',
},
] satisfies InstanceType<typeof MenuItem>['$props']['list'];
</script>
<template>
<MenuItem :list="menu" />
<!-- <div class="row">
<users-detail-card-component class="q-pa-md" v-for="v in [1, 2]" :key="v" />
</div> -->
</template>
<style scoped>
.person {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: var(--size-6);
}
</style>