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

Merge branch 'oat_dev' into develop

Browse source
This commit is contained in:
oat_dev 2024-04-02 12:04:05 +07:00
commit 2aaf47dc36
4 changed files with 635 additions and 594 deletions
Download patch file Download diff file Expand all files Collapse all files

579
src/modules/04_registryNew/components/detail/Salary/01_PositionSalary.vue
View file

@ -521,136 +521,135 @@ onMounted(() => {
</q-td> </q-td>
</q-tr> </q-tr>
</template> </template>
<template v-slot:pagination="scope">
<q-pagination
v-model="formFilter.page"
active-color="primary"
color="dark"
:max="Number(maxPage)"
:max-pages="5"
size="sm"
boundary-links
direction-links
></q-pagination>
</template>
</d-table> </d-table>
<q-dialog v-model="modalDialogSalary" persistent full-width> <q-dialog v-model="modalDialogSalary" persistent>
<q-card> <q-layout
view="lHh lpr lFf"
container
style="height: 80vh; min-width: 80%"
class="bg-white"
>
<q-form greedy @submit.prevent @validation-success="onSubmit"> <q-form greedy @submit.prevent @validation-success="onSubmit">
<DialogHeader <q-header>
:tittle=" <q-toolbar>
isStatusEdit ? 'แก้ไขตำแหน่งเงินเดือน' : 'เพิ่มตำแหน่งเงินเดือน' <DialogHeader
" :tittle="
:close="onClickCloseDialog" isStatusEdit ? 'แก้ไขตำแหน่งเงินเดือน' : 'เพิ่มตำแหน่งเงินเดือน'
/> "
<q-separator /> :close="onClickCloseDialog"
<q-card-section class="q-pa-md bg-grey-1"> />
<div class="row col-12 q-col-gutter-sm"> </q-toolbar>
<q-card flat bordered class="row fit q-pa-sm q-col-gutter-sm"> <q-separator color="grey-4" />
<div class="col-xs-6 col-sm-6 col-md-6"> </q-header>
<datepicker
v-model="formDataSalary.date" <q-page-container>
:locale="'th'" <q-page class="q-pa-md">
autoApply <div class="row col-12 q-col-gutter-sm">
:enableTimePicker="false" <q-card flat bordered class="row fit q-pa-sm q-col-gutter-sm">
week-start="0" <div class="col-xs-6 col-sm-6 col-md-6">
> <datepicker
<template #year="{ year }">{{ year + 543 }}</template> v-model="formDataSalary.date"
<template #year-overlay-value="{ value }">{{ :locale="'th'"
parseInt(value + 543) autoApply
}}</template> :enableTimePicker="false"
<template #trigger> week-start="0"
<q-input >
outlined <template #year="{ year }">{{ year + 543 }}</template>
dense <template #year-overlay-value="{ value }">{{
borderless parseInt(value + 543)
:model-value="date2Thai(formDataSalary.date)" }}</template>
:rules="[ <template #trigger>
<q-input
outlined
dense
borderless
:model-value="date2Thai(formDataSalary.date)"
:rules="[
(val: string) => (val: string) =>
!!val || !!val ||
`${'กรุณาเลือก วัน/เดือน/ปี'}`, `${'กรุณาเลือก วัน/เดือน/ปี'}`,
]" ]"
:label="`${'วัน/เดือน/ปี'}`" :label="`${'วัน/เดือน/ปี'}`"
hide-bottom-space hide-bottom-space
> >
<template v-slot:prepend> <template v-slot:prepend>
<q-icon <q-icon
name="event" name="event"
color="primary" color="primary"
class="cursor-pointer" class="cursor-pointer"
> >
</q-icon> </q-icon>
</template> </template>
</q-input> </q-input>
</template> </template>
</datepicker> </datepicker>
</div> </div>
<div class="col-xs-6 col-sm-6 col-md-6"> <div class="col-xs-6 col-sm-6 col-md-6">
<q-input <q-input
ref="posNoRef" ref="posNoRef"
outlined outlined
dense dense
lazy-rules lazy-rules
borderless borderless
v-model="formDataSalary.posNo" v-model="formDataSalary.posNo"
hide-bottom-space hide-bottom-space
:label="`${'เลขที่ตำแหน่ง'}`" :label="`${'เลขที่ตำแหน่ง'}`"
:rules="[(val: string) => !!val || `${'กรุณากรอกเลขที่ตำแหน่ง'}`]" :rules="[(val: string) => !!val || `${'กรุณากรอกเลขที่ตำแหน่ง'}`]"
> >
</q-input> </q-input>
</div> </div>
<div class="col-xs-12 col-sm-12 col-md-12"> <div class="col-xs-12 col-sm-12 col-md-12">
<q-select <q-select
ref="templatePosRef" ref="templatePosRef"
outlined outlined
dense dense
lazy-rules lazy-rules
borderless borderless
clearable clearable
v-model="formDataSalary.templatePos" v-model="formDataSalary.templatePos"
:label="`${'ต้นแบบ (template) ตำแหน่ง'}`" :label="`${'ต้นแบบ (template) ตำแหน่ง'}`"
option-label="name" option-label="name"
:options="posNoOptions" :options="posNoOptions"
option-value="name" option-value="name"
hide-bottom-space hide-bottom-space
emit-value emit-value
use-input use-input
input-debounce="0" input-debounce="0"
@update:modelValue="updatePos" @update:modelValue="updatePos"
@filter="(inputValue: any, @filter="(inputValue: any,
doneFn: Function) => filterSelector(inputValue, doneFn, 'pos' doneFn: Function) => filterSelector(inputValue, doneFn, 'pos'
)" )"
/> />
</div> </div>
<div class="col-xs-12 col-sm-12 col-md-12"> <div class="col-xs-12 col-sm-12 col-md-12">
<q-input <q-input
ref="positionRef" ref="positionRef"
outlined outlined
dense dense
lazy-rules lazy-rules
borderless borderless
v-model="formDataSalary.position" v-model="formDataSalary.position"
:label="`${'ตำแหน่ง'}`" :label="`${'ตำแหน่ง'}`"
type="textarea" type="textarea"
hide-bottom-space hide-bottom-space
:rules="[(val: string) => !!val || `${'กรุณากรอกตำแหน่ง'}`]" :rules="[(val: string) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
/> />
</div> </div>
<div class="col-xs-6 col-sm-6 col-md-4"> <div class="col-xs-6 col-sm-6 col-md-4">
<q-input <q-input
outlined outlined
dense dense
lazy-rules lazy-rules
v-model="formDataSalary.positionLine" v-model="formDataSalary.positionLine"
hide-bottom-space hide-bottom-space
:label="`${'สายงาน'}`" :label="`${'สายงาน'}`"
/> />
<!-- <q-select <!-- <q-select
outlined outlined
dense dense
lazy-rules lazy-rules
@ -669,187 +668,201 @@ onMounted(() => {
doneFn: Function) => filterSelector(inputValue, doneFn, 'positionLine' doneFn: Function) => filterSelector(inputValue, doneFn, 'positionLine'
)" )"
/> --> /> -->
</div> </div>
<div class="col-xs-6 col-sm-6 col-md-4"> <div class="col-xs-6 col-sm-6 col-md-4">
<q-input <q-input
outlined outlined
dense dense
lazy-rules lazy-rules
v-model="formDataSalary.positionPathSide" v-model="formDataSalary.positionPathSide"
hide-bottom-space hide-bottom-space
:label="`${'ด้าน/สาขา'}`" :label="`${'ด้าน/สาขา'}`"
/> />
</div> </div>
<div class="col-xs-6 col-sm-6 col-md-4"> <div class="col-xs-6 col-sm-6 col-md-4">
<q-input <q-input
outlined outlined
dense dense
lazy-rules lazy-rules
borderless borderless
v-model="formDataSalary.positionExecutive" v-model="formDataSalary.positionExecutive"
hide-bottom-space hide-bottom-space
:label="`${'ตำแหน่งทางการบริหาร'}`" :label="`${'ตำแหน่งทางการบริหาร'}`"
> >
</q-input> </q-input>
</div> </div>
<div class="col-xs-6 col-sm-6 col-md-4"> <div class="col-xs-6 col-sm-6 col-md-4">
<q-select <q-select
ref="positionType Ref" ref="positionType Ref"
outlined outlined
dense dense
lazy-rules lazy-rules
borderless borderless
v-model="formDataSalary.positionType" v-model="formDataSalary.positionType"
:label="`${'ตำแหน่งประเภท'}`" :label="`${'ตำแหน่งประเภท'}`"
emit-value emit-value
map-options map-options
option-label="name" option-label="name"
:options="posTypeOptions" :options="posTypeOptions"
option-value="name" option-value="name"
hide-bottom-space hide-bottom-space
use-input use-input
input-debounce="0" input-debounce="0"
@update:model-value="updateSelectType" @update:model-value="updateSelectType"
:rules="[(val: string) => !!val || `${'กรุณาเลือกตำแหน่งประเภท'}`]" :rules="[(val: string) => !!val || `${'กรุณาเลือกตำแหน่งประเภท'}`]"
@filter="(inputValue: any, @filter="(inputValue: any,
doneFn: Function) => filterSelector(inputValue, doneFn, 'posType' doneFn: Function) => filterSelector(inputValue, doneFn, 'posType'
)" )"
/> />
</div> </div>
<div class="col-xs-6 col-sm-6 col-md-4"> <div class="col-xs-6 col-sm-6 col-md-4">
<q-select <q-select
ref="positionLevel Ref" ref="positionLevel Ref"
outlined outlined
dense dense
lazy-rules lazy-rules
borderless borderless
v-model="formDataSalary.positionLevel" v-model="formDataSalary.positionLevel"
:rules="[(val: string) => !!val || `${'กรุณาเลือกระดับตำแหน่ง'}`]" :rules="[(val: string) => !!val || `${'กรุณาเลือกระดับตำแหน่ง'}`]"
:label="`${'ระดับตำแหน่ง'}`" :label="`${'ระดับตำแหน่ง'}`"
emit-value emit-value
map-options map-options
option-label="name" option-label="name"
:options="posLevelOption" :options="posLevelOption"
option-value="name" option-value="name"
hide-bottom-space hide-bottom-space
use-input use-input
input-debounce="0" input-debounce="0"
@filter="(inputValue: any, @filter="(inputValue: any,
doneFn: Function) => filterSelector(inputValue, doneFn, 'posLevel' doneFn: Function) => filterSelector(inputValue, doneFn, 'posLevel'
)" )"
/> />
</div> </div>
<div class="col-md-4"></div> <div class="col-md-4"></div>
<div class="col-xs-6 col-sm-6 col-md-4"> <div class="col-xs-6 col-sm-6 col-md-4">
<q-input <q-input
ref="salaryRef" ref="salaryRef"
dense dense
outlined outlined
v-model="formDataSalary.salary" v-model="formDataSalary.salary"
label="เงินเดือน" label="เงินเดือน"
mask="###,###,###,###" mask="###,###,###,###"
reverse-fill-mask reverse-fill-mask
:rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]" :rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
/> />
</div> </div>
<div class="col-xs-6 col-sm-6 col-md-4"> <div class="col-xs-6 col-sm-6 col-md-4">
<q-input <q-input
ref="amountRef" ref="amountRef"
dense dense
outlined outlined
v-model="formDataSalary.salaryPos" v-model="formDataSalary.salaryPos"
:rules="[(val) => !!val || `${'กรุณากรอกเงินประจำตำแหน่ง'}`]" :rules="[
label="เงินประจำตำแหน่ง" (val) => !!val || `${'กรุณากรอกเงินประจำตำแหน่ง'}`,
mask="###,###,###,###" ]"
reverse-fill-mask label="เงินประจำตำแหน่ง"
lazy-rules mask="###,###,###,###"
hide-bottom-space reverse-fill-mask
/> lazy-rules
</div> hide-bottom-space
<div class="col-xs-6 col-sm-6 col-md-4"> />
<q-input </div>
ref="amountRef" <div class="col-xs-6 col-sm-6 col-md-4">
dense <q-input
outlined ref="amountRef"
v-model="formDataSalary.salaryCompensation" dense
label="เงินค่าตอบแทนรายเดือน" outlined
mask="###,###,###,###" v-model="formDataSalary.salaryCompensation"
reverse-fill-mask label="เงินค่าตอบแทนรายเดือน"
lazy-rules mask="###,###,###,###"
hide-bottom-space reverse-fill-mask
/> lazy-rules
</div> hide-bottom-space
/>
</div>
<div class="col-xs-6 col-sm-6 col-md-12"> <div class="col-xs-6 col-sm-6 col-md-12">
<q-input <q-input
outlined outlined
dense dense
lazy-rules lazy-rules
borderless borderless
v-model="formDataSalary.refCommandNo" v-model="formDataSalary.refCommandNo"
hide-bottom-space hide-bottom-space
:label="`${'เลขที่คำสั่ง'}`" :label="`${'เลขที่คำสั่ง'}`"
mask="#####################" mask="#####################"
> >
<!-- :rules="[(val: string) => !!val || `${'กรุณากรอกเลขที่คำสั่ง'}`]" --> <!-- :rules="[(val: string) => !!val || `${'กรุณากรอกเลขที่คำสั่ง'}`]" -->
</q-input> </q-input>
</div> </div>
<div class="col-xs-12 col-sm-12 col-md-12"> <div class="col-xs-12 col-sm-12 col-md-12">
<q-select <q-select
ref="templateDocRef" ref="templateDocRef"
outlined outlined
dense dense
lazy-rules lazy-rules
borderless borderless
clearable clearable
v-model="formDataSalary.templateDoc" v-model="formDataSalary.templateDoc"
:label="`${'ต้นแบบ (template) เอกสารอ้างอิง'}`" :label="`${'ต้นแบบ (template) เอกสารอ้างอิง'}`"
option-label="name" option-label="name"
:options="docOption" :options="docOption"
option-value="name" option-value="name"
emit-value emit-value
hide-bottom-space hide-bottom-space
use-input use-input
input-debounce="0" input-debounce="0"
@update:modelValue="updateDoc" @update:modelValue="updateDoc"
@filter="(inputValue: any, @filter="(inputValue: any,
doneFn: Function) => filterSelector(inputValue, doneFn, 'doc' doneFn: Function) => filterSelector(inputValue, doneFn, 'doc'
)" )"
/> />
</div> </div>
<div class="col-xs-12 col-sm-12 col-md-12"> <div class="col-xs-12 col-sm-12 col-md-12">
<q-input <q-input
ref="docRef" ref="docRef"
outlined outlined
dense dense
lazy-rules lazy-rules
borderless borderless
v-model="formDataSalary.doc" v-model="formDataSalary.doc"
:label="`${'เอกสารอ้างอิง'}`" :label="`${'เอกสารอ้างอิง'}`"
type="textarea" type="textarea"
hide-bottom-space hide-bottom-space
:rules="[(val: number) => !!val || `${'กรุณากรอกเอกสารอ้างอิง'}`]" :rules="[(val: number) => !!val || `${'กรุณากรอกเอกสารอ้างอิง'}`]"
/> />
</div> </div>
</q-card> </q-card>
</div> </div>
</q-card-section> </q-page>
</q-page-container>
<q-separator /> <q-separator />
<q-card-section align="right"> <q-footer>
<q-btn label="บันทึก" type="submit" color="secondary"> <q-separator color="grey-4" />
<q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn <q-toolbar class="fit row wrap justify-end items-start content-start">
> <q-btn
</q-card-section> dense
unelevated
label="บันทึก"
id="onSubmit"
type="submit"
color="public"
class="q-px-md"
>
<q-tooltip>บันทึกข้อมูล</q-tooltip>
</q-btn>
</q-toolbar>
</q-footer>
</q-form> </q-form>
</q-card> </q-layout>
</q-dialog> </q-dialog>
<DialogHistory v-model:modal="modalHistory" v-model:salaryId="salaryId" /> <DialogHistory v-model:modal="modalHistory" v-model:salaryId="salaryId" />

160
src/modules/04_registryNew/components/detail/Salary/01_PositionSalaryHistory.vue
View file

@ -247,83 +247,95 @@ watch(
); );
</script> </script>
<template> <template>
<q-dialog v-model="modal" persistent full-width> <q-dialog v-model="modal" persistent>
<q-card> <q-layout
<DialogHeader view="lHh lpr lFf"
:tittle="'ประวัติแก้ไขตำแหน่ง/เงินเดือน'" container
:close="closeDialog" style="height: 80vh; min-width: 80%"
/> class="bg-white"
<q-separator /> >
<q-card-section class="q-pa-sm"> <q-header>
<q-toolbar style="padding: 0px" class="text-primary"> <q-toolbar>
<q-space /> <DialogHeader
<q-input :tittle="'ประวัติแก้ไขตำแหน่ง/เงินเดือน'"
dense :close="closeDialog"
outlined
v-model="keyword"
label="ค้นหา"
class="q-mr-sm"
>
<template v-slot:append>
<q-icon v-if="keyword === ''" name="search" />
<q-icon
v-else
name="clear"
class="cursor-pointer"
@click="keyword = ''"
/>
</template>
</q-input>
<q-select
v-model="visibleColumns"
multiple
outlined
dense
options-dense
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="columns"
option-value="name"
options-cover
style="min-width: 150px"
/> />
</q-toolbar> </q-toolbar>
<q-separator color="grey-4" />
</q-header>
<d-table <q-page-container>
ref="table" <q-page class="q-pa-md">
row-key="id" <q-toolbar style="padding: 0px" class="text-primary">
flat <q-space />
bordered <q-input
dense dense
:filter="keyword" outlined
:columns="columns" v-model="keyword"
:rows="rows" label="ค้นหา"
:paging="true" class="q-mr-sm"
v-model:pagination="pagination" >
:rows-per-page-options="[10, 20, 50, 100]" <template v-slot:append>
:visible-columns="visibleColumns" <q-icon v-if="keyword === ''" name="search" />
> <q-icon
<template v-slot:header="props"> v-else
<q-tr :props="props"> name="clear"
<q-th v-for="col in props.cols" :key="col.name" :props="props"> class="cursor-pointer"
<span class="text-weight-medium">{{ col.label }}</span> @click="keyword = ''"
</q-th> />
</q-tr> </template>
</template> </q-input>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer"> <q-select
<q-td v-for="col in props.cols"> v-model="visibleColumns"
<div class="table_ellipsis"> multiple
{{ col.value ? col.value : "-" }} outlined
</div> dense
</q-td> options-dense
</q-tr> :display-value="$q.lang.table.columns"
</template> emit-value
</d-table> map-options
</q-card-section> :options="columns"
</q-card> option-value="name"
options-cover
style="min-width: 150px"
/>
</q-toolbar>
<d-table
ref="table"
row-key="id"
flat
bordered
dense
:filter="keyword"
:columns="columns"
:rows="rows"
:paging="true"
v-model:pagination="pagination"
:rows-per-page-options="[10, 20, 50, 100]"
:visible-columns="visibleColumns"
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-for="col in props.cols" :key="col.name" :props="props">
<span class="text-weight-medium">{{ col.label }}</span>
</q-th>
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td v-for="col in props.cols">
<div class="table_ellipsis">
{{ col.value ? col.value : "-" }}
</div>
</q-td>
</q-tr>
</template>
</d-table>
</q-page>
</q-page-container>
</q-layout>
</q-dialog> </q-dialog>
</template> </template>

332
src/modules/04_registryNew/components/detail/Salary/02_NotReceiveSalary.vue
View file

@ -115,8 +115,8 @@ const formFilter = reactive({
}); });
const maxPage = ref<number>(1); const maxPage = ref<number>(1);
const pagination = ref({ const pagination = ref({
page: formFilter.page, page: 1,
rowsPerPage: formFilter.pageSize, rowsPerPage: 10,
}); });
function onSubmit() { function onSubmit() {
@ -128,14 +128,13 @@ function onSubmit() {
function onClickOpenDialog(StatusEdit: boolean = false, data: any = []) { function onClickOpenDialog(StatusEdit: boolean = false, data: any = []) {
isStatusEdit.value = StatusEdit; isStatusEdit.value = StatusEdit;
modalDialog.value = true;
id.value = StatusEdit ? data.id : ""; id.value = StatusEdit ? data.id : "";
formData.date = StatusEdit ? data.date : null; formData.date = StatusEdit ? data.date : null;
formData.reference = StatusEdit ? data.reference : ""; formData.reference = StatusEdit ? data.reference : "";
formData.detail = StatusEdit ? data.detail : ""; formData.detail = StatusEdit ? data.detail : "";
formData.refCommandNo = StatusEdit ? data.refCommandNo : ""; formData.refCommandNo = StatusEdit ? data.refCommandNo : "";
formData.refCommandDate = StatusEdit ? data.refCommandDate : null; formData.refCommandDate = StatusEdit ? data.refCommandDate : null;
modalDialog.value = true;
} }
function onClickCloseDialog() { function onClickCloseDialog() {
@ -414,171 +413,188 @@ onMounted(() => {
</q-card> </q-card>
</div> </div>
</template> </template>
<template v-slot:pagination="scope">
<q-pagination
v-model="formFilter.page"
active-color="primary"
color="dark"
:max="Number(maxPage)"
:max-pages="5"
size="sm"
boundary-links
direction-links
></q-pagination>
</template>
</d-table> </d-table>
<q-dialog v-model="modalDialog" persistent> <q-dialog v-model="modalDialog" persistent>
<q-card style="width: 600px"> <q-layout
view="lHh lpr lFf"
container
style="height: 80vh; min-width: 80%"
class="bg-white"
>
<q-form @submit.prevent greedy @validation-success="onSubmit"> <q-form @submit.prevent greedy @validation-success="onSubmit">
<DialogHeader <q-header>
tittle="บันทึกวันที่ไม่ได้รับเงินเดือนฯ" <q-toolbar>
:close="onClickCloseDialog" <DialogHeader
/> :tittle="
<q-separator /> isStatusEdit
<q-card-section class="q-pa-sm bg-grey-1"> ? 'แก้ไขบันทึกวันที่ไม่ได้รับเงินเดือนฯ'
<div class="row col-12 q-col-gutter-sm"> : 'เพิ่มบันทึกวันที่ไม่ได้รับเงินเดือนฯ'
<div class="col-xs-12 col-sm-12"> "
<q-card flat bordered class="fit q-pa-sm"> :close="onClickCloseDialog"
<div class="row col-12 q-col-gutter-xs"> />
<div class="col-xs-6 col-sm-6 col-md-6"> </q-toolbar>
<datepicker <q-separator color="grey-4" />
menu-class-name="modalfix" </q-header>
v-model="formData.date"
:locale="'th'" <q-page-container>
autoApply <q-page class="q-pa-md">
:enableTimePicker="false" <div class="row col-12 q-col-gutter-sm">
week-start="0" <div class="col-xs-12 col-sm-12">
> <q-card flat bordered class="fit q-pa-sm">
<template #year="{ year }">{{ year + 543 }}</template> <div class="row col-12 q-col-gutter-xs">
<template #year-overlay-value="{ value }">{{ <div class="col-xs-6 col-sm-6 col-md-6">
parseInt(value + 543) <datepicker
}}</template> menu-class-name="modalfix"
<template #trigger> v-model="formData.date"
<q-input :locale="'th'"
ref="dateRef" autoApply
outlined :enableTimePicker="false"
dense week-start="0"
borderless >
class="inputgreen" <template #year="{ year }">{{ year + 543 }}</template>
:model-value="date2Thai(formData.date)" <template #year-overlay-value="{ value }">{{
:rules="[ parseInt(value + 543)
(val) => !!val || `${'กรุณาเลือก วัน/เดือน/ปี'}`, }}</template>
]" <template #trigger>
hide-bottom-space <q-input
:label="`${'วัน/เดือน/ปี'}`" ref="dateRef"
> outlined
<template v-slot:prepend> dense
<q-icon borderless
name="event" class="inputgreen"
class="cursor-pointer" :model-value="date2Thai(formData.date)"
style="color: var(--q-primary)" :rules="[
> (val) => !!val || `${'กรุณาเลือก วัน/เดือน/ปี'}`,
</q-icon> ]"
</template> hide-bottom-space
</q-input> :label="`${'วัน/เดือน/ปี'}`"
</template> >
</datepicker> <template v-slot:prepend>
</div> <q-icon
<div class="col-6"> name="event"
<q-input class="cursor-pointer"
ref="referenceRef" style="color: var(--q-primary)"
outlined >
dense </q-icon>
autogrow </template>
lazy-rules </q-input>
borderless </template>
v-model="formData.reference" </datepicker>
class="inputgreen" </div>
:rules="[(val) => !!val || `${'กรุณากรอกเอกสารอ้างอิง'}`]" <div class="col-6">
hide-bottom-space <q-input
:label="`${'เอกสารอ้างอิง'}`" ref="referenceRef"
/> outlined
</div> dense
<div class="col-12"> autogrow
<q-input lazy-rules
ref="detailRef" borderless
outlined v-model="formData.reference"
dense class="inputgreen"
autogrow :rules="[
lazy-rules (val) => !!val || `${'กรุณากรอกเอกสารอ้างอิง'}`,
borderless ]"
v-model="formData.detail" hide-bottom-space
class="inputgreen" :label="`${'เอกสารอ้างอิง'}`"
:rules="[(val) => !!val || `${'กรุณากรอกรายละเอียด'}`]" />
hide-bottom-space </div>
:label="`${'รายละเอียด'}`" <div class="col-12">
/> <q-input
</div> ref="detailRef"
<div class="col-xs-6 col-sm-6 col-md-6"> outlined
<q-input dense
outlined autogrow
dense lazy-rules
lazy-rules borderless
borderless v-model="formData.detail"
v-model="formData.refCommandNo" class="inputgreen"
class="inputgreen" :rules="[(val) => !!val || `${'กรุณากรอกรายละเอียด'}`]"
hide-bottom-space hide-bottom-space
:label="`${'เลขที่คำสั่ง'}`" :label="`${'รายละเอียด'}`"
> />
<template v-slot:append> </div>
<q-icon name="mdi-file" class="cursor-pointer" /> <div class="col-xs-6 col-sm-6 col-md-6">
</template> <q-input
</q-input> outlined
</div> dense
<div class="col-xs-6 col-sm-6 col-md-6"> lazy-rules
<datepicker borderless
menu-class-name="modalfix" v-model="formData.refCommandNo"
v-model="formData.refCommandDate" class="inputgreen"
:locale="'th'" hide-bottom-space
autoApply :label="`${'เลขที่คำสั่ง'}`"
:enableTimePicker="false" >
week-start="0" <template v-slot:append>
> <q-icon name="mdi-file" class="cursor-pointer" />
<template #year="{ year }">{{ year + 543 }}</template> </template>
<template #year-overlay-value="{ value }">{{ </q-input>
parseInt(value + 543) </div>
}}</template> <div class="col-xs-6 col-sm-6 col-md-6">
<template #trigger> <datepicker
<q-input menu-class-name="modalfix"
clearable v-model="formData.refCommandDate"
outlined :locale="'th'"
dense autoApply
borderless :enableTimePicker="false"
class="inputgreen" week-start="0"
:model-value=" >
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
clearable
outlined
dense
borderless
class="inputgreen"
:model-value="
formData.refCommandDate == null ? null : date2Thai(formData.refCommandDate as Date) formData.refCommandDate == null ? null : date2Thai(formData.refCommandDate as Date)
" "
hide-bottom-space hide-bottom-space
:label="`${'เอกสารอ้างอิง (ลงวันที่)'}`" :label="`${'เอกสารอ้างอิง (ลงวันที่)'}`"
@clear="formData.refCommandDate = null" @clear="formData.refCommandDate = null"
> >
<template v-slot:prepend> <template v-slot:prepend>
<q-icon <q-icon
name="event" name="event"
class="cursor-pointer" class="cursor-pointer"
style="color: var(--q-primary)" style="color: var(--q-primary)"
> >
</q-icon> </q-icon>
</template> </template>
</q-input> </q-input>
</template> </template>
</datepicker> </datepicker>
</div>
</div> </div>
</div> </q-card>
</q-card> </div>
</div> </div>
</div> </q-page>
</q-card-section> </q-page-container>
<q-separator /> <q-separator />
<q-card-section align="right"> <q-footer>
<q-btn label="บันทึก" type="submit" color="secondary"> <q-separator color="grey-4" />
<q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn <q-toolbar class="fit row wrap justify-end items-start content-start">
> <q-btn
</q-card-section> dense
unelevated
label="บันทึก"
id="onSubmit"
type="submit"
color="public"
class="q-px-md"
>
<q-tooltip>บันทึกข้อมูล</q-tooltip>
</q-btn>
</q-toolbar>
</q-footer>
</q-form> </q-form>
</q-card> </q-layout>
</q-dialog> </q-dialog>
<DialogHisotory v-model:modal="modalHistory" v-model:id="id" /> <DialogHisotory v-model:modal="modalHistory" v-model:id="id" />

158
src/modules/04_registryNew/components/detail/Salary/02_NotReceiveSalaryHistory.vue
View file

@ -144,87 +144,87 @@ watch(modal, (status) => {
</script> </script>
<template> <template>
<q-dialog v-model="modal" persistent full-width> <q-dialog v-model="modal" persistent full-width>
<q-card> <q-layout
<DialogHeader view="lHh lpr lFf"
:tittle="'ประวัติแก้ไขตำแหน่ง/เงินเดือน'" container
:close="closeDialog" style="height: 80vh; min-width: 80%"
/> class="bg-white"
<q-separator /> >
<q-card-section class="q-pa-sm"> <q-header>
<q-toolbar style="padding: 0px" class="text-primary q-mb-sm"> <q-toolbar>
<q-space /> <DialogHeader
<q-input :tittle="'ประวัติแก้ไขตำแหน่ง/เงินเดือน'"
dense :close="closeDialog"
outlined
v-model="filter"
label="ค้นหา"
class="q-mr-sm"
>
<template v-slot:append>
<q-icon name="search" />
</template>
</q-input>
<q-select
v-model="visibleColumns"
multiple
outlined
dense
options-dense
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="columns"
option-value="name"
options-cover
style="min-width: 150px"
/> />
</q-toolbar> </q-toolbar>
<d-table <q-separator color="grey-4" />
ref="table" </q-header>
row-key="id"
flat <q-page-container>
bordered <q-page class="q-pa-md">
dense <q-toolbar style="padding: 0px" class="text-primary q-mb-sm">
:filter="filter" <q-space />
:columns="columns" <q-input
:rows="rows" dense
:paging="true" outlined
v-model:pagination="pagination" v-model="filter"
:rows-per-page-options="[20, 50, 100]" label="ค้นหา"
:visible-columns="visibleColumns" class="q-mr-sm"
> >
<template v-slot:header="props"> <template v-slot:append>
<q-tr :props="props"> <q-icon name="search" />
<q-th v-for="col in props.cols" :key="col.name" :props="props"> </template>
<span class="text-weight-medium">{{ col.label }}</span> </q-input>
</q-th>
</q-tr> <q-select
</template> v-model="visibleColumns"
<template v-slot:body="props"> multiple
<q-tr :props="props" class="cursor-pointer"> outlined
<q-td v-for="col in props.cols" :key="col.name" :props="props"> dense
<div class="table_ellipsis"> options-dense
{{ col.value ? col.value : "-" }} :display-value="$q.lang.table.columns"
</div> emit-value
</q-td> map-options
</q-tr> :options="columns"
</template> option-value="name"
<!-- <template v-slot:pagination="scope"> options-cover
<q-pagination style="min-width: 150px"
v-model="formFilter.page" />
active-color="primary" </q-toolbar>
color="dark" <d-table
:max="Number(maxPage)" ref="table"
:max-pages="5" row-key="id"
size="sm" flat
boundary-links bordered
direction-links dense
></q-pagination> :filter="filter"
</template> --> :columns="columns"
</d-table> :rows="rows"
</q-card-section> :paging="true"
</q-card> v-model:pagination="pagination"
:rows-per-page-options="[20, 50, 100]"
:visible-columns="visibleColumns"
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-for="col in props.cols" :key="col.name" :props="props">
<span class="text-weight-medium">{{ col.label }}</span>
</q-th>
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td v-for="col in props.cols" :key="col.name" :props="props">
<div class="table_ellipsis">
{{ col.value ? col.value : "-" }}
</div>
</q-td>
</q-tr>
</template>
</d-table>
</q-page>
</q-page-container>
</q-layout>
</q-dialog> </q-dialog>
</template> </template>