แก้ไข ui pop up อนุมัติคำขอ
This commit is contained in:
parent
61026107cd
commit
288fad12e1
5 changed files with 80 additions and 79 deletions
|
|
@ -16,8 +16,8 @@ const { dialogConfirm, date2Thai } = mixin;
|
|||
const currentDate = ref<Date | null>(new Date());
|
||||
const startTimeMorningRef = ref<Object | null>(null);
|
||||
const endTimeMorningRef = ref<Object | null>(null);
|
||||
const startTimeAfternoonRef = ref<Object | null>(null);
|
||||
const endTimeAfternoonRef = ref<Object | null>(null);
|
||||
const checkInStatusRef = ref<Object | null>(null);
|
||||
const checkOutStatusRef = ref<Object | null>(null);
|
||||
|
||||
const formData = reactive<dataRowRound>({
|
||||
startTimeMorning: "",
|
||||
|
|
@ -25,13 +25,15 @@ const formData = reactive<dataRowRound>({
|
|||
startTimeAfternoon: "",
|
||||
endTimeAfternoon: "",
|
||||
note: "",
|
||||
checkInStatus: "",
|
||||
checkOutStatus: "",
|
||||
});
|
||||
|
||||
const objectRound: MyObjectRoundRef = {
|
||||
startTimeMorning: startTimeMorningRef,
|
||||
endTimeMorning: endTimeMorningRef,
|
||||
startTimeAfternoon: startTimeAfternoonRef,
|
||||
endTimeAfternoon: endTimeAfternoonRef,
|
||||
checkInStatus: checkInStatusRef,
|
||||
checkOutStatus: checkOutStatusRef,
|
||||
};
|
||||
|
||||
function validateForm() {
|
||||
|
|
@ -169,11 +171,6 @@ watch(
|
|||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div
|
||||
class="col q-ma-md q-pa-sm bg-white border_custom text-weight-medium"
|
||||
>
|
||||
<p style="color: #06884d; font-size: 16px">ครึ่งเช้า</p>
|
||||
<div class="row justify-between q-my-sm items-start">
|
||||
<p class="q-ma-none mt">เวลาเข้างาน</p>
|
||||
<q-input
|
||||
|
|
@ -249,77 +246,46 @@ watch(
|
|||
<div
|
||||
class="col q-ma-md q-pa-sm bg-white border_custom text-weight-medium"
|
||||
>
|
||||
<p style="color: #06884d; font-size: 16px">ครึ่งบ่าย</p>
|
||||
<p style="color: #06884d; font-size: 16px">สถานะเข้างาน</p>
|
||||
<div class="row justify-between q-my-sm items-start">
|
||||
<p class="q-ma-none mt">เวลาเข้างาน</p>
|
||||
<q-input
|
||||
ref="startTimeAfternoonRef"
|
||||
:rules="[
|
||||
(val) => !!val || 'กรุณากรอกเวลาเข้างาน',
|
||||
(val) => {
|
||||
if (val && formData.endTimeAfternoon) {
|
||||
if (val > formData.endTimeAfternoon) {
|
||||
return 'ต้องน้อยกว่าเวลาออกงาน';
|
||||
}
|
||||
if (
|
||||
val >= formData.startTimeMorning &&
|
||||
val <= formData.endTimeMorning
|
||||
) {
|
||||
return 'ช่วงเวลาทับซ้อนกับช่วงเช้า';
|
||||
}
|
||||
if (val === formData.endTimeAfternoon) {
|
||||
return 'เวลาเข้างานช่วงบ่ายต้องไม่ซ้ำกับออกงานช่วงบ่าย';
|
||||
}
|
||||
}
|
||||
return true;
|
||||
},
|
||||
]"
|
||||
class="inputgreen"
|
||||
dense
|
||||
lazy-rules
|
||||
borderless
|
||||
v-model="formData.startTimeAfternoon"
|
||||
hide-bottom-space
|
||||
type="time"
|
||||
<q-select
|
||||
ref="checkInStatusRef"
|
||||
for="checkInStatus"
|
||||
emit-value
|
||||
map-options
|
||||
outlined
|
||||
style="width: 140px"
|
||||
/>
|
||||
dense
|
||||
v-model="SpecialTimeStore.checkInStatus"
|
||||
:options="SpecialTimeStore.optionStatus"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
label="สถานะ"
|
||||
use-input
|
||||
>
|
||||
</q-select>
|
||||
</div>
|
||||
<q-separator inset />
|
||||
<div class="row items-start q-my-sm justify-between">
|
||||
<p class="q-ma-none mt">เวลาออกงาน</p>
|
||||
<q-input
|
||||
ref="endTimeAfternoonRef"
|
||||
:rules="[
|
||||
(val) => !!val || 'กรุณากรอกเวลาออกงาน',
|
||||
(val) => {
|
||||
if (val && formData.startTimeAfternoon) {
|
||||
if (val < formData.startTimeAfternoon) {
|
||||
return 'ต้องมากกว่าเวลาเข้างาน';
|
||||
}
|
||||
if (
|
||||
val >= formData.startTimeMorning &&
|
||||
val <= formData.endTimeMorning
|
||||
) {
|
||||
return 'ช่วงเวลาทับซ้อนกับช่วงเช้า';
|
||||
}
|
||||
if (val === formData.startTimeAfternoon) {
|
||||
return 'เวลาออกงานช่วงบ่ายต้องไม่ซ้ำกับเข้างานช่วงบ่าย';
|
||||
}
|
||||
}
|
||||
return true;
|
||||
},
|
||||
]"
|
||||
class="inputgreen"
|
||||
dense
|
||||
v-model="formData.endTimeAfternoon"
|
||||
lazy-rules
|
||||
borderless
|
||||
hide-bottom-space
|
||||
type="time"
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="col q-ma-md q-pa-sm bg-white border_custom text-weight-medium"
|
||||
>
|
||||
<p style="color: #06884d; font-size: 16px">สถานะออกงาน</p>
|
||||
<div class="row justify-between q-my-sm items-start">
|
||||
<q-select
|
||||
ref="checkOutStatusRef"
|
||||
for="checkOutStatus"
|
||||
emit-value
|
||||
map-options
|
||||
outlined
|
||||
style="width: 140px"
|
||||
/>
|
||||
dense
|
||||
v-model="SpecialTimeStore.checkOutStatus"
|
||||
:options="SpecialTimeStore.optionStatus"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
label="สถานะ"
|
||||
use-input
|
||||
>
|
||||
</q-select>
|
||||
</div>
|
||||
</div>
|
||||
<q-input
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue