เเก้ validate เเล้ว input ลอย

This commit is contained in:
setthawutttty 2023-09-13 17:03:17 +07:00
parent 4936c51a31
commit 477b8e999c
17 changed files with 47 additions and 30 deletions

View file

@ -15,6 +15,7 @@ const {
hideLoader,
dialogConfirm,
success,
dialogMessageNotify
} = mixin;
const router = useRouter();
const route = useRoute();
@ -106,22 +107,25 @@ const editData = async (id: string) => {
console.log(formData);
};
const checkSave = () => {
dialogConfirm($q, () => SaveData());
};
const SaveData = async () => {
if (myForm.value !== null) {
myForm.value.validate().then(async (success) => {
if (success) {
if (edit.value) {
await editData(id.value);
} else {
await addData();
clickBack();
}
dialogConfirm($q, () => SaveData());
}else {
dialogMessageNotify($q,"กรุณาเลือกรอบการเสนอขอพระราชทานเครื่องราชฯ")
}
});
})
}
};
const SaveData = async () => {
if (edit.value) {
await editData(id.value);
} else {
await addData();
clickBack();
}
};
const updateDateRange = () => {
if (roundInsig.value.value == 1) {
dateStart.value = new Date(new Date().getFullYear(), 9, 1);

View file

@ -278,7 +278,7 @@ const searchcardid = () => {
<q-form ref="myForm">
<div class="q-pa-md">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-4">
<q-select

View file

@ -5,9 +5,9 @@ import { useCounterMixin } from "@/stores/mixin";
import { useRouter } from "vue-router";
const $q = useQuasar();
const myForm = ref<QForm>();
const myForm = ref<QForm | null>(null); //form data input
const mixin = useCounterMixin();
const { dialogConfirm } = mixin;
const { dialogConfirm,dialogMessageNotify } = mixin;
const router = useRouter();
const routeName = router.currentRoute.value.name;
const amount = ref<number | null>();
@ -42,8 +42,18 @@ watch(props, () => {
});
const clickSave = () => {
dialogConfirm($q, () => props.save(grandCross.value, amount.value));
if (myForm.value !== null) {
myForm.value.validate().then(async (success) => {
if (success) {
dialogConfirm($q, () => props.save(grandCross.value, amount.value));
}else {
dialogMessageNotify($q,"กรุณาข้อมูลให้ครบ")
}
})
}
};
</script>
<template>
@ -65,7 +75,7 @@ const clickSave = () => {
<q-form ref="myForm">
<div class="q-pa-md">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-6">
<q-select
@ -79,6 +89,7 @@ const clickSave = () => {
map-options
outlined
options-cover
:rules="[(val) => !!val || `${'กรุณากรอกจำนวน'}`,]"
v-model="grandCross"
:label="
routeName == 'insigniaAllocate'
@ -86,6 +97,7 @@ const clickSave = () => {
: `เลือกหน่วยงาน`
"
/>
</div>
<div class="col-xs-12 col-sm-6">
<q-input
@ -97,6 +109,7 @@ const clickSave = () => {
lazy-rules
type="number"
label="จำนวน"
:rules="[(val) => !!val || `${'กรุณากรอกจำนวน'}`,]"
/>
<!-- :rules="[(val:any) =>val.length != 13 ||`${'กรุณากรอกเลขบัตรประจำตัวประชาชนให้ครบ'}`,]" -->
</div>
@ -107,7 +120,7 @@ const clickSave = () => {
<q-separator />
<div class="row justify-end q-py-sm">
<div class="q-px-md">
<q-btn label="บันทึก" @click="clickSave" color="public" />
<q-btn label="บันทึก" @click="clickSave" color="public" :disable="grandCross == '' || amount == null || amount == 0" />
</div>
</div>
</q-card>

View file

@ -61,7 +61,7 @@
<q-separator />
<q-card-section class="q-p-sm">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-xs-12 col-sm-12 col-md-12">
<datepicker

View file

@ -57,7 +57,7 @@
<q-separator />
<q-card-section class="q-p-sm">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-xs-6 col-sm-6 col-md-6">
<datepicker

View file

@ -71,7 +71,7 @@
<q-separator />
<q-card-section class="q-p-sm">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-xs-6 col-sm-6 col-md-6">
<selector

View file

@ -13,7 +13,7 @@
:addEmployee="statusAdd()"
/>
<q-form ref="myform">
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
<div class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
<div class="col-xs-12">
<q-input
:class="getClass(edit)"

View file

@ -68,7 +68,7 @@
<q-separator />
<q-card-section class="q-p-sm">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-xs-6 col-sm-6 col-md-6">
<q-input

View file

@ -13,7 +13,7 @@
:addEmployee="statusAdd()"
/>
<q-form ref="myform" class="col-12">
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
<div class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
<div class="col-12 row q-pb-sm q-pt-md">
<div class="col-xs-2 col-sm-1 text-weight-bold"> ดา</div>
<div class="q-gutter-sm">

View file

@ -13,7 +13,7 @@
:addEmployee="statusAdd()"
/>
<q-form ref="myform" class="col-12">
<div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-sm">
<div class="row col-12 q-col-gutter-x-sm q-col-gutter-y-sm">
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(edit)"

View file

@ -12,7 +12,7 @@
:history="!statusAdd()"
/>
<q-form ref="myform">
<div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-sm">
<div class="row col-12 q-col-gutter-x-sm q-col-gutter-y-sm">
<div class="col-xs-6 col-sm-3 col-md-3">
<selector
:class="getClass(edit)"

View file

@ -81,7 +81,7 @@
<q-separator />
<q-card-section class="q-p-sm">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-xs-6 col-sm-6 col-md-6">
<selector

View file

@ -54,7 +54,7 @@
<q-separator />
<q-card-section class="q-p-sm">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-xs-6 col-sm-6 col-md-6">
<datepicker

View file

@ -51,7 +51,7 @@
<q-separator />
<q-card-section class="q-p-sm">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-6">
<q-input

View file

@ -64,7 +64,7 @@
<q-separator />
<q-card-section class="q-p-sm">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-xs-6 col-sm-6 col-md-6">
<q-input

View file

@ -61,7 +61,7 @@
<q-separator />
<q-card-section class="q-p-sm">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-xs-6 col-sm-6 col-md-6">
<datepicker

View file

@ -617,7 +617,7 @@ const getClass = (val: boolean) => {
<q-card-section class="q-pa-sm bg-grey-1">
<div class="row col-12 q-col-gutter-sm">
<div class="col-xs-12">
<div class="col-12 row q-py-sm items-center q-col-gutter-sm">
<div class="col-12 row q-py-sm q-col-gutter-sm">
<div class="col-xs-6 col-sm-6 col-md-6">
<CurruncyInput
:edit="true"