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

ปรับ UI รายงานสถิติข้อมูลข้าราชการ กทม. สามัญ และลูกจ้างประจำ

Browse source
This commit is contained in:
setthawutttty 2024-12-10 14:00:25 +07:00
parent 5f654f7567
commit d206c19362
1 changed files with 57 additions and 60 deletions
Download patch file Download diff file Expand all files Collapse all files

117
src/modules/04_registryPerson/components/TableView.vue
View file

@ -34,7 +34,7 @@ const rangeAge = ref<RangeAge>({
}); });
const objMarkerLabel = computed(() => { const objMarkerLabel = computed(() => {
return { 50: `ช่วงอายุ ${rangeAge.value.min}-${rangeAge.value.max} ปี` }; return { 50: `เลือกช่วงอายุ ${rangeAge.value.min}-${rangeAge.value.max} ปี` };
}); });
const loadingBtn = ref<boolean>(false); const loadingBtn = ref<boolean>(false);
@ -626,7 +626,7 @@ watch(
</d-table> </d-table>
<q-dialog v-model="modalReport" persistent> <q-dialog v-model="modalReport" persistent>
<q-card class="col-12" style="width: 80%"> <q-card class="col-12" style="width: 40%">
<DialogHeader <DialogHeader
:tittle=" :tittle="
empType == 'officer' empType == 'officer'
@ -637,71 +637,68 @@ watch(
/> />
<q-separator /> <q-separator />
<q-card-section class="q-pt-none" style="padding: 0px"> <q-card-section class="q-pt-none" style="padding: 0px">
<div class="q-pa-sm q-gutter-y-sm"> <div class="column q-pa-sm q-gutter-y-sm">
<q-toolbar class="q-pa-sm bg-grey-2" style="border-radius: 5px">
<div class="q-pr-xs col-4"> <datepicker
<datepicker menu-class-name="modalfix"
menu-class-name="modalfix" v-model="year"
v-model="year" :locale="'th'"
:locale="'th'" autoApply
autoApply year-picker
year-picker :enableTimePicker="false"
:enableTimePicker="false" >
> <template #year="{ year }">{{ year + 543 }}</template>
<template #year="{ year }">{{ year + 543 }}</template> <template #year-overlay-value="{ value }">{{
<template #year-overlay-value="{ value }">{{ parseInt(value + 543)
parseInt(value + 543) }}</template>
}}</template> <template #trigger>
<template #trigger> <q-input
<q-input dense
dense outlined
outlined :model-value="year === 0 ? 'ทั้งหมด' : Number(year) + 543"
:model-value="year === 0 ? 'ทั้งหมด' : Number(year) + 543" :label="`${'ปีงบประมาณ'}`"
:label="`${'ปีงบประมาณ'}`" bg-color="white"
bg-color="white"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
<div class="q-pr-xs col-4">
<div class="q-px-sm q-mx-md">
<q-range
v-model="rangeAge"
:min="20"
:max="80"
label
:marker-labels="objMarkerLabel"
color="primary"
> >
</q-range> <template v-slot:prepend>
</div> <q-icon
</div> name="event"
<div class="q-pr-xs col-4"> class="cursor-pointer"
<q-btn style="color: var(--q-primary)"
:loading="loadingBtn" >
:disable="loadingBtn" </q-icon>
</template>
</q-input>
</template>
</datepicker>
<div class="q-px-sm q-mx-md q-py-lg">
<q-range
v-model="rangeAge"
:min="20"
:max="80"
label
:marker-labels="objMarkerLabel"
color="primary" color="primary"
icon="download"
label="ดาวน์โหลดรายงาน"
@click="getReport"
style="width: 100%"
> >
<q-tooltip>ดาวน์โหลดรายงาน</q-tooltip> </q-range>
</q-btn>
</div> </div>
</q-toolbar>
</div> </div>
</q-card-section> </q-card-section>
<q-separator /> <q-separator />
<q-card-actions align="right">
<q-btn
:loading="loadingBtn"
:disable="loadingBtn"
color="primary"
icon="download"
label="ดาวน์โหลดรายงาน"
@click="getReport"
style="width: 100%"
>
<q-tooltip>ดาวน์โหลดรายงาน</q-tooltip>
</q-btn>
</q-card-actions>
</q-card> </q-card>
</q-dialog> </q-dialog>