chamomind/jws-frontend
chamomind/jws-frontend
6
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

feat: Personnel => Person card, hover

Browse source
This commit is contained in:
puriphatt 2024-04-03 18:28:59 +07:00
parent 7d20ff8238
commit 021b1842e0
3 changed files with 206 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

80
src/pages/02_personnel-management/MainPage.vue
View file

@ -1,2 +1,78 @@
<script setup lang="ts"></script>
<template>Personnel Management</template>
<script setup lang="ts">
import PersonCard from 'src/components/home/PersonCard.vue';
import AppBox from 'components/app/AppBox.vue';
const person = [
{
name: 'นายสันติ เมติกาญจ์',
badge: 'CORP000001-01-240002',
detail: [
{ label: 'สัญชาติ', value: 'ไทย' },
{ label: 'ตำแหน่ง', value: 'นักบริหาร' },
{ label: 'โทรศัพท์', value: '0621249602' },
{ label: 'ตำแหน่ง', value: '32 ปี' },
],
male: true,
},
{
name: 'นางสาวสุขใจ แสนดี',
badge: 'CORP000001-01-240001',
detail: [
{ label: 'สัญชาติ', value: 'ไทย' },
{ label: 'ตำแหน่ง', value: 'นักบริหาร' },
{ label: 'โทรศัพท์', value: '0621249602' },
{ label: 'ตำแหน่ง', value: '32 ปี' },
],
female: true,
},
{
name: 'นายสันติ เมติกาญจ์',
badge: 'CORP000001-01-240002',
detail: [
{ label: 'สัญชาติ', value: 'ไทย' },
{ label: 'ตำแหน่ง', value: 'นักบริหาร' },
{ label: 'โทรศัพท์', value: '0621249602' },
{ label: 'ตำแหน่ง', value: '32 ปี' },
],
male: true,
disabled: true,
},
{
name: 'นางสาวสุขใจ แสนดี',
badge: 'CORP000001-01-240001',
detail: [
{ label: 'สัญชาติ', value: 'ไทย' },
{ label: 'ตำแหน่ง', value: 'นักบริหาร' },
{ label: 'โทรศัพท์', value: '0621249602' },
{ label: 'ตำแหน่ง', value: '32 ปี' },
],
female: true,
},
{
name: 'นางสาวสุขใจ แสนดี',
badge: 'CORP000001-01-240001',
detail: [
{ label: 'สัญชาติ', value: 'ไทย' },
{ label: 'ตำแหน่ง', value: 'นักบริหาร' },
{ label: 'โทรศัพท์', value: '0621249602' },
{ label: 'ตำแหน่ง', value: '32 ปี' },
],
female: true,
disabled: true,
},
] satisfies InstanceType<typeof PersonCard>['$props']['list'];
</script>
<template>
<div class="column">
<div class="row text-h6 text-weight-bold q-mb-md">จัดการบุคลากร</div>
<AppBox bordered style="width: 100%; height: 580px">
<q-scroll-area style="height: 100%">
<div class="column" style="height: 100%">
<PersonCard :list="person" class="q-mb-md" />
</div>
</q-scroll-area>
</AppBox>
</div>
</template>