fix currency

This commit is contained in:
Warunee Tamkoo 2025-12-15 13:21:08 +07:00
parent 0a445447e8
commit 512f9840de
3 changed files with 86 additions and 43 deletions

View file

@ -44,7 +44,7 @@ const { inputRef, formattedValue, setValue } = useCurrencyInput({
currency: "THB", currency: "THB",
currencyDisplay: "hidden" as any, currencyDisplay: "hidden" as any,
hideCurrencySymbolOnFocus: true, hideCurrencySymbolOnFocus: true,
hideGroupingSeparatorOnFocus: true, hideGroupingSeparatorOnFocus: false,
hideNegligibleDecimalDigitsOnFocus: true, hideNegligibleDecimalDigitsOnFocus: true,
autoDecimalDigits: false, autoDecimalDigits: false,
useGrouping: true, useGrouping: true,

View file

@ -8,6 +8,7 @@ import { useRouter } from "vue-router";
import { useCounterMixin } from "@/stores/mixin"; import { useCounterMixin } from "@/stores/mixin";
import DialogHeader from "@/components/DialogHeader.vue"; import DialogHeader from "@/components/DialogHeader.vue";
import CurruncyInput from "@/components/CurruncyInput.vue";
const $q = useQuasar(); const $q = useQuasar();
const router = useRouter(); const router = useRouter();
@ -372,55 +373,74 @@ watch(
:props="props" :props="props"
> >
<div v-if="col.name == 'amount'"> <div v-if="col.name == 'amount'">
<q-input <CurruncyInput
:model-value="formatNumber(props.row.amount)" v-model="props.row.amount"
@update:model-value="(val:string) => props.row.amount = unformatNumber(val)" :edit="true"
type="number"
dense dense
borderless
outlined outlined
:rules="[(val:string) => !!unformatNumber(val) || 'กรุณากรอกเงินเดือน']"
hide-bottom-space hide-bottom-space
lazy-rules
:rules="[
(val:any) => !!val || 'กรุณากรอกเงินเดือน',
(val:any) => {
if (!val) return true;
const numVal = typeof val === 'number' ? val : Number(String(val).replace(/,/g, ''));
return numVal <= 10000000 || 'เงินเดือนต้องไม่เกิน 10,000,000 บาท';
}
]"
/> />
</div> </div>
<div v-else-if="col.name == 'amountSpecial'"> <div v-else-if="col.name == 'amountSpecial'">
<q-input <CurruncyInput
:model-value="formatNumber(props.row.amountSpecial)" v-model="props.row.amountSpecial"
@update:model-value="(val:string) => props.row.amountSpecial = unformatNumber(val)" :edit="true"
type="text"
dense dense
borderless
outlined outlined
hide-bottom-space
lazy-rules
:rules="[
(val:any) => {
if (!val) return true;
const numVal = typeof val === 'number' ? val : Number(String(val).replace(/,/g, ''));
return numVal <= 10000000 || 'เงินค่าตอบแทนพิเศษต้องไม่เกิน 10,000,000 บาท';
}
]"
/> />
<!-- :rules="[(val:string) => !!val || 'กรุณากรอกเงินค่าตอบแทนพิเศษ']" --> <!-- :rules="[(val:string) => !!val || 'กรุณากรอกเงินค่าตอบแทนพิเศษ']" -->
</div> </div>
<div v-else-if="col.name == 'positionSalaryAmount'"> <div v-else-if="col.name == 'positionSalaryAmount'">
<q-input <CurruncyInput
:model-value=" v-model="props.row.positionSalaryAmount"
formatNumber(props.row.positionSalaryAmount) :edit="true"
"
@update:model-value="(val:string) => props.row.positionSalaryAmount = unformatNumber(val)"
type="text"
dense dense
borderless
outlined outlined
hide-bottom-space
lazy-rules
:rules="[
(val:any) => {
if (!val) return true;
const numVal = typeof val === 'number' ? val : Number(String(val).replace(/,/g, ''));
return numVal <= 10000000 || 'เงินประจำตำแหน่งต้องไม่เกิน 10,000,000 บาท';
}
]"
/> />
<!-- :rules="[(val:string) => !!val || 'กรุณากรอกเงินประจำตำแหน่ง']" --> <!-- :rules="[(val:string) => !!val || 'กรุณากรอกเงินประจำตำแหน่ง']" -->
</div> </div>
<div v-else-if="col.name == 'mouthSalaryAmount'"> <div v-else-if="col.name == 'mouthSalaryAmount'">
<q-input <CurruncyInput
:model-value=" v-model="props.row.mouthSalaryAmount"
formatNumber(props.row.mouthSalaryAmount) :edit="true"
"
@update:model-value="
(val:string) =>
(props.row.mouthSalaryAmount =
unformatNumber(val))
"
type="text"
dense dense
borderless
outlined outlined
hide-bottom-space
lazy-rules
:rules="[
(val:any) => {
if (!val) return true;
const numVal = typeof val === 'number' ? val : Number(String(val).replace(/,/g, ''));
return numVal <= 10000000 || 'เงินค่าตอบแทนรายเดือนต้องไม่เกิน 10,000,000 บาท';
}
]"
/> />
<!-- :rules="[(val:string) => !!val || 'กรุณากรอกเงินค่าตอบแทนรายเดือน']" --> <!-- :rules="[(val:string) => !!val || 'กรุณากรอกเงินค่าตอบแทนรายเดือน']" -->
</div> </div>
@ -429,6 +449,7 @@ watch(
v-model="props.row.remarkHorizontal" v-model="props.row.remarkHorizontal"
type="textarea" type="textarea"
autorows autorows
hide-bottom-space
dense dense
borderless borderless
outlined outlined
@ -440,6 +461,7 @@ watch(
v-model="props.row.remarkVertical" v-model="props.row.remarkVertical"
type="textarea" type="textarea"
autorows autorows
hide-bottom-space
dense dense
borderless borderless
outlined outlined

View file

@ -8,6 +8,7 @@ import { useCounterMixin } from "@/stores/mixin";
import { useCommandMainStore } from "@/modules/18_command/store/Main"; import { useCommandMainStore } from "@/modules/18_command/store/Main";
import { useCommandDetail } from "@/modules/18_command/store/DetailStore"; import { useCommandDetail } from "@/modules/18_command/store/DetailStore";
import DialogHeader from "@/components/DialogHeader.vue"; import DialogHeader from "@/components/DialogHeader.vue";
import CurruncyInput from "@/components/CurruncyInput.vue";
const $q = useQuasar(); const $q = useQuasar();
const { showLoader, hideLoader, dialogConfirm, messageError, success } = const { showLoader, hideLoader, dialogConfirm, messageError, success } =
@ -140,25 +141,30 @@ watch(
v-if="store.isShowSalary(type)" v-if="store.isShowSalary(type)"
class="col-xs-6 col-sm-6 col-md-6" class="col-xs-6 col-sm-6 col-md-6"
> >
<q-input <CurruncyInput
dense dense
outlined outlined
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
v-model="formData.amount" v-model="formData.amount"
:class="getClass(storeDetail.isSalary)" :class="getClass(storeDetail.isSalary)"
mask="###,###,###,###,###,###"
reverse-fill-mask
:readonly="!storeDetail.isSalary" :readonly="!storeDetail.isSalary"
:label="`${'เงินเดือน'}`" :label="`${'เงินเดือน'}`"
:rules="[(val: any) => !!val || `${'กรุณากรอกเงินเดือน'}`]" :rules="[
(val:any) => !!val || 'กรุณากรอกเงินเดือน',
(val:any) => {
if (!val) return true;
const numVal = typeof val === 'number' ? val : Number(String(val).replace(/,/g, ''));
return numVal <= 10000000 || 'เงินเดือนต้องไม่เกิน 10,000,000 บาท';
}
]"
/> />
</div> </div>
<div <div
v-if="store.isShowSalary(type)" v-if="store.isShowSalary(type)"
class="col-xs-6 col-sm-6 col-md-6" class="col-xs-6 col-sm-6 col-md-6"
> >
<q-input <CurruncyInput
dense dense
outlined outlined
lazy-rules lazy-rules
@ -166,16 +172,21 @@ watch(
v-model="formData.amountSpecial" v-model="formData.amountSpecial"
:class="getClass(storeDetail.isSalary)" :class="getClass(storeDetail.isSalary)"
:readonly="!storeDetail.isSalary" :readonly="!storeDetail.isSalary"
mask="###,###,###,###,###,###"
reverse-fill-mask
:label="`${'เงินค่าตอบแทนพิเศษ'}`" :label="`${'เงินค่าตอบแทนพิเศษ'}`"
:rules="[
(val:any) => {
if (!val) return true;
const numVal = typeof val === 'number' ? val : Number(String(val).replace(/,/g, ''));
return numVal <= 10000000 || 'เงินค่าตอบแทนพิเศษต้องไม่เกิน 10,000,000 บาท';
}
]"
/> />
</div> </div>
<div <div
v-if="store.isShowSalary(type)" v-if="store.isShowSalary(type)"
class="col-xs-6 col-sm-6 col-md-6" class="col-xs-6 col-sm-6 col-md-6"
> >
<q-input <CurruncyInput
dense dense
outlined outlined
lazy-rules lazy-rules
@ -183,9 +194,14 @@ watch(
v-model="formData.positionSalaryAmount" v-model="formData.positionSalaryAmount"
:class="getClass(storeDetail.isSalary)" :class="getClass(storeDetail.isSalary)"
:readonly="!storeDetail.isSalary" :readonly="!storeDetail.isSalary"
mask="###,###,###,###,###,###"
reverse-fill-mask
:label="`${'เงินประจำตำแหน่ง'}`" :label="`${'เงินประจำตำแหน่ง'}`"
:rules="[
(val:any) => {
if (!val) return true;
const numVal = typeof val === 'number' ? val : Number(String(val).replace(/,/g, ''));
return numVal <= 10000000 || 'เงินประจำตำแหน่งต้องไม่เกิน 10,000,000 บาท';
}
]"
/> />
</div> </div>
@ -193,7 +209,7 @@ watch(
v-if="store.isShowSalary(type)" v-if="store.isShowSalary(type)"
class="col-xs-6 col-sm-6 col-md-6" class="col-xs-6 col-sm-6 col-md-6"
> >
<q-input <CurruncyInput
dense dense
outlined outlined
lazy-rules lazy-rules
@ -201,9 +217,14 @@ watch(
v-model="formData.monthSalaryAmount" v-model="formData.monthSalaryAmount"
:class="getClass(storeDetail.isSalary)" :class="getClass(storeDetail.isSalary)"
:readonly="!storeDetail.isSalary" :readonly="!storeDetail.isSalary"
mask="###,###,###,###,###,###"
reverse-fill-mask
:label="`${'เงินค่าตอบแทนรายเดือน'}`" :label="`${'เงินค่าตอบแทนรายเดือน'}`"
:rules="[
(val:any) => {
if (!val) return true;
const numVal = typeof val === 'number' ? val : Number(String(val).replace(/,/g, ''));
return numVal <= 10000000 || 'เงินค่าตอบแทนรายเดือนต้องไม่เกิน 10,000,000 บาท';
}
]"
/> />
</div> </div>
</div> </div>