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

fix: แก้ input payDate เป็น VueDatePicker

Browse source
This commit is contained in:
Net 2024-06-07 15:01:58 +07:00
parent 159d5395e2
commit 342cb7dcbc
1 changed files with 45 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

66
src/components/03_customer-management/FormBusiness.vue
View file

@ -1,4 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { dateFormat } from 'src/utils/datetime';
const employmentOffice = defineModel<string>('employmentOffice'); const employmentOffice = defineModel<string>('employmentOffice');
const bussinessType = defineModel<string>('bussinessType'); const bussinessType = defineModel<string>('bussinessType');
const jobPosition = defineModel<string>('jobPosition'); const jobPosition = defineModel<string>('jobPosition');
@ -8,7 +10,7 @@ const jobPositionEN = defineModel<string>('jobPositionEn');
const jobDescription = defineModel<string>('jobDescription'); const jobDescription = defineModel<string>('jobDescription');
const payDate = defineModel<string>('payDate'); const payDate = defineModel<Date>('payDate');
const wageRate = defineModel<number>('wageRate'); const wageRate = defineModel<number>('wageRate');
const saleEmployee = defineModel<string>('saleEmployee'); const saleEmployee = defineModel<string>('saleEmployee');
@ -132,48 +134,50 @@ defineProps<{
v-model="jobDescription" v-model="jobDescription"
/> />
<VueDatePicker
:teleport="true"
utc
autoApply
v-model="payDate"
:locale="'th'"
:enableTimePicker="false"
:disabled="readonly"
class="col-3"
>
<template #year="{ value }">
{{ value + 543 }}
</template>
<template #trigger>
<q-input <q-input
id="input-start-date"
:label="$t('payDay')"
:dense="dense" :dense="dense"
:outlined="!readonly" :outlined="readonly ? false : outlined"
:readonly="readonly" :readonly="readonly"
:borderless="readonly" :borderless="readonly"
hide-bottom-space :model-value="payDate ? dateFormat(payDate) : ''"
class="col-3"
:label="$t('payDay')"
v-model="payDate"
> >
<template v-slot:prepend> <template v-slot:prepend>
<q-icon <q-icon
size="xs"
name="mdi-calendar-blank-outline" name="mdi-calendar-blank-outline"
color="primary"
class="cursor-pointer" class="cursor-pointer"
size="16px" color="primary"
> />
<q-popup-proxy </template>
cover <template v-slot:append>
transition-show="scale" <q-icon
transition-hide="scale" v-if="payDate && !readonly"
> name="mdi-close"
<q-date v-model="payDate" mask="YYYY-MM-DD HH:mm"> class="cursor-pointer"
<div class="row items-center justify-end"> size="xs"
<q-btn v-close-popup label="Close" color="primary" flat /> @click="payDate = undefined"
</div> />
</q-date>
</q-popup-proxy>
</q-icon>
</template> </template>
</q-input> </q-input>
</template>
</VueDatePicker>
<!-- <q-input
:dense="dense"
:outlined="!readonly"
:readonly="readonly"
:borderless="readonly"
hide-bottom-space
class="col-3"
:label="$t('payDay')"
v-model="payDay"
/> -->
<q-input <q-input
:dense="dense" :dense="dense"
:outlined="!readonly" :outlined="!readonly"