เปลี่ยนจาก ติ้ก เป็น ไอคอนบวก

src/modules/11_discipline/components/3_InvestigateDisciplinary/EditPage.vue

@@ -245,7 +245,6 @@ async function fetchDetailComplaints() {
  * @param data ข้อมูล ใน form
  */
 async function onSubmitDisciplinary(data: any) {
-  console.log("🚀 ~ onSubmitDisciplinary ~ data:", data);
   showLoader();
   await http
     .put(config.API.disciplineDisciplinaryById(id.value), data)

src/modules/11_discipline/components/3_InvestigateDisciplinary/Form.vue

@@ -32,6 +32,7 @@ import DialogAddPersonal from "@/components/Dialogs/AddPersonal.vue";
 import DialogDirector from "@/modules/11_discipline/components/DialogDirector.vue";
 import Table from "@/modules/11_discipline/components/DirectorTable.vue";
 import UploadFile from "@/modules/11_discipline/components/UploadFile.vue";
+import DialogAddDate from "@/modules/11_discipline/components/DialogAddDate.vue";
 
 const $q = useQuasar();
 const route = useRoute();
@@ -51,6 +52,7 @@ const {
 } = mixin;
 
 const modalPersonal = ref<boolean>(false);
+const modalAddDate = ref<boolean>(false);
 const personId = ref<string>("");
 const isSaveInfo = defineModel<boolean>("isSaveInfo");
 const calendarModal = ref<boolean>(false);
@@ -135,7 +137,7 @@ const initialPagination = ref<any>({
 const props = defineProps({
   data: {
     type: Object,
-    default: null,
+    default: () => ({}),
   },
   onSubmit: {
     type: Function,
@@ -186,8 +188,9 @@ function toggleModal() {
  * ฟังชั้นคำนวณเวลาวันที่สิ้นสุดจาก วันที่สิ้นสุดการสอบสวน
  * @param val จำนวนวันที่ต้องการขยาย
  */
-async function calEndDate(val: string) {
+async function calEndDate(val: any) {
   changeFormData();
+  formData.daysExtend = val;
   const date = await new Date(props.data.disciplinaryDateEnd);
   formData.disciplinaryDateEnd = await new Date(
     date.setDate(date.getDate() + Number(val))
@@ -1148,26 +1151,24 @@ onMounted(async () => {
                   >
                     <div>
                       วันที่สอบสวน
-                      <q-checkbox
+
+                      <q-btn
                         v-if="
                           formData.disciplinaryExtendHistory.length > 0 &&
                           !isReadonly &&
                           !checkRoutePermisson
                         "
-                        :disable="isReadonly"
-                        for="#extendStatus"
-                        size="md"
-                        v-model="extendStatus"
-                        label="ขยายเวลา"
-                        color="primary"
+                        size="12px"
+                        flat
+                        round
                         dense
-                        class="text-weight-medium q-ml-sm"
-                        keep-color
-                        @update:model-value="
-                          changeFormData();
-                          resetExtend();
-                        "
-                      />
+                        color="primary"
+                        class="q-ml-sm"
+                        @click="modalAddDate = true"
+                        icon="mdi-plus"
+                      >
+                        <q-tooltip>ขยายเวลา</q-tooltip>
+                      </q-btn>
                     </div>
                     <q-space style="height: 1px" />
                     <div>
@@ -1190,45 +1191,7 @@ onMounted(async () => {
                     <div class="q-col-gutter-sm row col-12">
                       <div class="col-12">
                         <div class="row q-col-gutter-sm">
-                          <div v-if="extendStatus" class="col-3">
-                            <q-select
-                              :class="inputEdit(isReadonly)"
-                              :readonly="isReadonly || checkRoutePermisson"
-                              for="#daysExtend"
-                              outlined
-                              dense
-                              ref="daysExtendRef"
-                              v-model="formData.daysExtend"
-                              :options="investigateDis.daysExtendOps"
-                              label="จำนวนวันที่ต้องการขยาย"
-                              emit-value
-                              hide-bottom-space
-                              map-options
-                              option-label="name"
-                              option-value="id"
-                              use-input
-                              @update:model-value="calEndDate"
-                              ><template v-slot:no-option>
-                                <q-item>
-                                  <q-item-section class="text-grey">
-                                    ไม่มีข้อมูล
-                                  </q-item-section>
-                                </q-item>
-                              </template>
-                              <template
-                                v-if="formData.daysExtend === 0"
-                                v-slot:append
-                              >
-                                <q-icon
-                                  name="cancel"
-                                  @click.stop.prevent="formData.daysExtend = 0"
-                                  class="cursor-pointer"
-                                />
-                              </template>
-                            </q-select>
-                          </div>
-
-                          <div v-if="!extendStatus" class="col-3">
+                          <div class="col-3">
                             <datepicker
                               :readonly="
                                 checkRoutePermisson ||
@@ -2028,6 +1991,14 @@ onMounted(async () => {
     @update:modal="updatemodalPersonal"
     :type="isEmpType"
   />
+
+  <DialogAddDate
+    v-model:modal="modalAddDate"
+    :calEndDate="calEndDate"
+    :reset="resetExtend"
+    :data="props.data"
+    :type="'disciplinary'"
+  />
 </template>
 
 <style scoped>