เงินเดือน ==> เลื่อน ปรับ ui

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-08-28 11:33:36 +07:00
parent be2a9a8ca6
commit f6b1580cf1
6 changed files with 712 additions and 678 deletions

View file

@ -1,3 +1,4 @@
divdiv
<script setup lang="ts">
import { ref, reactive, watch } from "vue";
import { useQuasar } from "quasar";
@ -134,7 +135,7 @@ const getClass = (val: boolean) => {
<template>
<q-dialog v-model="modal" persistent>
<q-card style="width: 500px">
<q-card style="width: 350px">
<q-form greedy @submit.prevent @validation-success="onSubmit">
<Header
:tittle="
@ -144,68 +145,66 @@ const getClass = (val: boolean) => {
/>
<q-separator />
<q-card-section>
<div class="row q-gutter-sm q-pa-sm">
<div class="row col-xs-12 col-md-12 q-col-gutter-sm">
<div class="col-12">
<q-input
:readonly="isReadonly"
:class="getClass(!isReadonly)"
ref="salaryNoRef"
dense
outlined
v-model="formData.salaryNo"
label="ลำดับชั้น"
:rules="[
(val) => !!val || 'กรุณากรอกลำดับชั้น',
(val) =>
Number(val) === Math.floor(val) ||
Number(val) === Math.floor(val) + 0.5 ||
`กรุณากรอกจำนวนเต็มเท่านั้ หรือ .5`,
]"
lazy-rules
hide-bottom-space
/>
</div>
<div class="row col-12 q-col-gutter-sm">
<div class="col-12">
<q-input
:readonly="isReadonly"
:class="getClass(!isReadonly)"
ref="salaryNoRef"
dense
outlined
v-model="formData.salaryNo"
label="ลำดับชั้น"
:rules="[
(val) => !!val || 'กรุณากรอกลำดับชั้น',
(val) =>
Number(val) === Math.floor(val) ||
Number(val) === Math.floor(val) + 0.5 ||
`กรุณากรอกจำนวนเต็มเท่านั้ หรือ .5`,
]"
lazy-rules
hide-bottom-space
/>
</div>
<div class="col-12">
<q-input
:readonly="isReadonly"
:class="getClass(!isReadonly)"
ref="salaryMonthRef"
dense
outlined
v-model="formData.salaryMonth"
label="อัตราค่าจ้าง/ขั้นวิ่ง (รายเดือน)"
mask="###,###,###,###"
reverse-fill-mask
:rules="[
(val) =>
!!val || `${'กรุณากรอกอัตราค่าจ้าง/ขั้นวิ่ง (รายเดือน)'}`,
]"
lazy-rules
hide-bottom-space
/>
</div>
<div class="col-12">
<q-input
:readonly="isReadonly"
:class="getClass(!isReadonly)"
ref="salaryMonthRef"
dense
outlined
v-model="formData.salaryMonth"
label="อัตราค่าจ้าง/ขั้นวิ่ง (รายเดือน)"
mask="###,###,###,###"
reverse-fill-mask
:rules="[
(val) =>
!!val || `${'กรุณากรอกอัตราค่าจ้าง/ขั้นวิ่ง (รายเดือน)'}`,
]"
lazy-rules
hide-bottom-space
/>
</div>
<div class="col-12">
<q-input
:readonly="isReadonly"
:class="getClass(!isReadonly)"
ref="salaryDayRef"
dense
outlined
v-model="formData.salaryDay"
label="อัตราค่าจ้าง/ขั้นวิ่ง (รายวัน)"
mask="###,###,###,###"
reverse-fill-mask
lazy-rules
hide-bottom-space
:rules="[
(val) =>
!!val || `${'กรุณากรอกอัตราค่าจ้าง/ขั้นวิ่ง (รายวัน)'}`,
]"
/>
</div>
<div class="col-12">
<q-input
:readonly="isReadonly"
:class="getClass(!isReadonly)"
ref="salaryDayRef"
dense
outlined
v-model="formData.salaryDay"
label="อัตราค่าจ้าง/ขั้นวิ่ง (รายวัน)"
mask="###,###,###,###"
reverse-fill-mask
lazy-rules
hide-bottom-space
:rules="[
(val) =>
!!val || `${'กรุณากรอกอัตราค่าจ้าง/ขั้นวิ่ง (รายวัน)'}`,
]"
/>
</div>
</div>
</q-card-section>