Merge branch 'develop' into devTee

src/modules/07_insignia/components/5_Borrow/DialogForm.vue

@@ -223,8 +223,8 @@ const clickSave = async () => {
 
 // ค้นหาคนจากเลขประจำตัวประชาชน
 const searchcardid = async () => {
-  showLoader();
   if (cardid.value.length === 13) {
+    showLoader();
     const node = await listPerson.value.find(
       (e: any) => e.citizenId === cardid.value
     );

src/modules/09_leave/components/4_specialTime/DialogApprove.vue

@@ -14,24 +14,22 @@ const $q = useQuasar();
 const mixin = useCounterMixin();
 const { dialogConfirm, date2Thai } = mixin;
 const currentDate = ref<Date | null>(new Date());
-const startTimeMorningRef = ref<Object | null>(null);
+const checkInRef = ref<Object | null>(null);
-const endTimeMorningRef = ref<Object | null>(null);
+const checkOutRef = ref<Object | null>(null);
 const checkInStatusRef = ref<Object | null>(null);
 const checkOutStatusRef = ref<Object | null>(null);
 
 const formData = reactive<dataRowRound>({
-  startTimeMorning: "",
+  checkIn: "",
-  endTimeMorning: "",
+  checkOut: "",
-  startTimeAfternoon: "",
-  endTimeAfternoon: "",
   note: "",
   checkInStatus: "",
   checkOutStatus: "",
 });
 
 const objectRound: MyObjectRoundRef = {
-  startTimeMorning: startTimeMorningRef,
+  checkIn: checkInRef,
-  endTimeMorning: endTimeMorningRef,
+  checkOut: checkOutRef,
   checkInStatus: checkInStatusRef,
   checkOutStatus: checkOutStatusRef,
 };
@@ -81,17 +79,13 @@ watch(
   () => props.modal,
   (newDetailData, oldDetailData) => {
     if (props.editCheck === "APPROVE") {
-      formData.startTimeMorning = "";
+      formData.checkIn = "";
-      formData.endTimeMorning = "";
+      formData.checkOut = "";
-      formData.startTimeAfternoon = "";
-      formData.endTimeAfternoon = "";
       formData.note = "";
     } else if (props.editCheck === "PENDING") {
       if (props.detailData) {
-        formData.startTimeMorning = props.detailData.startTimeMorning;
+        formData.checkIn = props.detailData.checkIn;
-        formData.endTimeMorning = props.detailData.endTimeMorning;
+        formData.checkOut = props.detailData.checkOut;
-        formData.startTimeAfternoon = props.detailData.startTimeAfternoon;
-        formData.endTimeAfternoon = props.detailData.endTimeAfternoon;
         formData.note = props.detailData.note;
       }
     }
@@ -174,27 +168,21 @@ watch(
             <div class="row justify-between q-my-sm items-start">
               <p class="q-ma-none mt">เวลาเข้างาน</p>
               <q-input
-                ref="startTimeMorningRef"
+                ref="checkInRef"
                 class="inputgreen"
                 dense
                 lazy-rules
                 borderless
                 outlined
-                v-model="formData.startTimeMorning"
+                v-model="formData.checkIn"
                 :rules="[
                   (val) => !!val || 'กรุณากรอกเวลาเข้างาน',
                   (val) => {
-                    if (val && formData.endTimeMorning) {
+                    if (val && formData.checkOut) {
-                      if (val > formData.endTimeMorning) {
+                      if (val > formData.checkOut) {
                         return 'ต้องน้อยกว่าเวลาออกงาน';
                       }
-                      if (
+                      if (val === formData.checkOut) {
-                        val >= formData.startTimeAfternoon &&
-                        val <= formData.endTimeAfternoon
-                      ) {
-                        return 'ช่วงเวลาทับซ้อนกับช่วงบ่าย';
-                      }
-                      if (val === formData.endTimeMorning) {
                         return 'เวลาเข้างานช่วงเช้าต้องไม่ซ้ำกับออกงานเช้า';
                       }
                     }
@@ -210,27 +198,21 @@ watch(
             <div class="row items-start q-my-sm justify-between">
               <p class="q-ma-none mt">เวลาออกงาน</p>
               <q-input
-                ref="endTimeMorningRef"
+                ref="checkOutRef"
                 class="inputgreen"
                 dense
-                v-model="formData.endTimeMorning"
+                v-model="formData.checkOut"
                 lazy-rules
                 borderless
                 outlined
                 :rules="[
                   (val) => !!val || 'กรุณากรอกเวลาออกงาน',
                   (val) => {
-                    if (val && formData.startTimeMorning) {
+                    if (val && formData.checkIn) {
-                      if (val < formData.startTimeMorning) {
+                      if (val < formData.checkIn) {
                         return 'ต้องมากกว่าเวลาเข้างาน';
                       }
-                      if (
+                      if (val === formData.checkIn) {
-                        val >= formData.startTimeAfternoon &&
-                        val <= formData.endTimeAfternoon
-                      ) {
-                        return 'ช่วงเวลาทับซ้อนกับช่วงบ่าย';
-                      }
-                      if (val === formData.startTimeMorning) {
                         return 'เวลาออกงานช่วงเช้าต้องไม่ซ้ำกับเข้างานเช้า';
                       }
                     }

src/modules/09_leave/interface/request/specialTime.ts

@@ -10,5 +10,7 @@ interface ListData {
   status: string;
   checkInStatus: string;
   checkOutStatus: string;
+  checkOut: string;
+  checkIn: string;
 }
 export type { ListData };

src/modules/09_leave/interface/response/specialTime.ts

@@ -8,17 +8,15 @@ interface DataRows {
   status: string;
 }
 interface dataRowRound {
-  startTimeMorning: string;
+  checkIn: string;
-  endTimeMorning: string;
+  checkOut: string;
-  startTimeAfternoon: string;
-  endTimeAfternoon: string;
   checkInStatus: string;
   checkOutStatus: string;
   note: string;
 }
 interface MyObjectRoundRef {
-  startTimeMorning: object | null;
+  checkIn: object | null;
-  endTimeMorning: object | null;
+  checkOut: object | null;
   checkInStatus: object | null;
   checkOutStatus: object | null;
   [key: string]: any;

src/modules/09_leave/stores/SpecialTimeStore.ts

@@ -31,6 +31,8 @@ export const useSpecialTimeStore = defineStore("LeaveSpecialTime", () => {
       endTimeMorning: e.endTimeMorning,
       startTimeAfternoon: e.startTimeAfternoon,
       endTimeAfternoon: e.endTimeAfternoon,
+      checkIn: e.checkOut,
+      checkOut: e.checkOut,
       status: e.status,
       checkInStatus: convertStatus(e.checkInStatus),
       checkOutStatus: convertStatus(e.checkOutStatus),

src/modules/09_leave/views/SpecialTimeMain.vue

@@ -76,6 +76,8 @@ onMounted(async () => {
       status: "PENDING",
       checkInStatus: "normal",
       checkOutStatus: "late",
+      checkIn: "08:00",
+      checkOut: "12.00",
     },
     {
       id: "00000000-0000-0000-0000-000000000000",
@@ -89,6 +91,8 @@ onMounted(async () => {
       status: "APPROVE",
       checkInStatus: "normal",
       checkOutStatus: "late",
+      checkIn: "08:00",
+      checkOut: "12.00",
     },
     {
       id: "00000000-0000-0000-0000-000000000000",
@@ -102,6 +106,8 @@ onMounted(async () => {
       status: "REJECT",
       checkInStatus: "normal",
       checkOutStatus: "late",
+      checkIn: "08:00",
+      checkOut: "12.00",
     },
   ]);
 });

src/modules/11_discipline/components/1_Complaint/Form.vue

@@ -228,7 +228,7 @@ watch(props.data, async () => {
       <form @submit.prevent="validateForm">
         <div class="col-12 row q-pa-md">
           <div
-            class="col-xs-12 col-sm-12 row q-col-gutter-x-md q-col-gutter-y-xs"
+            class="col-xs-12 col-sm-12 row q-col-gutter-md"
           >
             <div class="col-xs-12 col-sm-3" id="complainantType">
               <q-select
@@ -243,6 +243,7 @@ watch(props.data, async () => {
                 option-label="name"
                 emit-value
                 map-options
+                hide-bottom-space
                 :rules="[(val) => !!val || `${'กรุณาเลือกผู้ร้องเรียน'}`]"
                 lazy-rules
                 @update:model-value="
@@ -278,6 +279,7 @@ watch(props.data, async () => {
                 label="รายชื่อจากทะเบียรประวัติ"
                 option-value="id"
                 option-label="name"
+                hide-bottom-space
                 emit-value
                 map-options
                 :rules="[(val) => !!val || `${'กรุณาเลือกรายชื่อ'}`]"
@@ -305,6 +307,7 @@ watch(props.data, async () => {
                 name="office"
                 ref="officeRef"
                 dense
+                hide-bottom-space
                 outlined
                 v-model="formData.office"
                 label="เลือกสำนักงาน"
@@ -323,6 +326,7 @@ watch(props.data, async () => {
                 label="หน่วยงานที่พิจารณา"
                 option-value="id"
                 option-label="name"
+                hide-bottom-space
                 emit-value
                 map-options
                 :rules="[(val) => !!val || `${'กรุณาเลือกหน่วยงาน'}`]"
@@ -347,6 +351,7 @@ watch(props.data, async () => {
                 ref="topicComplaintRef"
                 dense
                 outlined
+                hide-bottom-space
                 v-model="formData.topicComplaint"
                 :rules="[(val) => !!val || 'กรุณาการข้อมูล']"
                 lazy-rules
@@ -361,6 +366,7 @@ watch(props.data, async () => {
                 ref="detailRef"
                 dense
                 outlined
+                hide-bottom-space
                 v-model="formData.detail"
                 :rules="[(val) => !!val || 'กรุณาการข้อมูล']"
                 lazy-rules
@@ -391,6 +397,7 @@ watch(props.data, async () => {
                     ref="datereceiveRef"
                     outlined
                     dense
+                    hide-bottom-space
                     class="full-width datepicker"
                     :model-value="
                       formData.datereceive != null
@@ -428,6 +435,7 @@ watch(props.data, async () => {
                 option-value="id"
                 option-label="name"
                 emit-value
+                hide-bottom-space
                 map-options
                 :rules="[(val) => !!val || `${'กรุณาเลือกระดับการพิจารณา'}`]"
                 lazy-rules
@@ -464,6 +472,7 @@ watch(props.data, async () => {
                         : null
                     "
                     label="วันที่กำหนดวันพิจารณา"
+                    hide-bottom-space
                     :rules="[
                       (val) => !!val || `${'กรุณาเลือกวันที่กำหนดวันพิจารณา'}`,
                     ]"
@@ -493,6 +502,7 @@ watch(props.data, async () => {
                 option-value="id"
                 option-label="name"
                 emit-value
+                hide-bottom-space
                 map-options
                 :rules="[(val) => !!val || `${'กรุณาเลือกลักษณะความผิด'}`]"
                 lazy-rules
@@ -521,6 +531,7 @@ watch(props.data, async () => {
                     ref="datewarnRef"
                     outlined
                     dense
+                    hide-bottom-space
                     class="full-width datepicker"
                     :model-value="
                       formData.datewarn != null
@@ -557,6 +568,7 @@ watch(props.data, async () => {
                 label="รับเรื่องร้องเรียน"
                 option-value="id"
                 option-label="name"
+                hide-bottom-space
                 emit-value
                 map-options
                 :rules="[(val) => !!val || `${'กรุณาเลือกรับเรื่องร้องเรียน'}`]"
@@ -573,16 +585,18 @@ watch(props.data, async () => {
                 label="ผู้ร้องเรียน"
                 :rules="[(val) => !!val || `${'กรุณากรอกข้อมูล'}`]"
                 lazy-rules
+                hide-bottom-space
                 type="textarea"
                 rows="5"
               />
             </div>
-            <div class="col-xs-12 col-sm-6" id="files">
+            <div class="col-12" id="files">
               <q-file
                 for="inputFiles"
                 ref="filesRef"
                 outlined
                 dense
+                class="fit"
                 v-model="formData.files"
                 @added="fileUploadDoc"
                 label="ไฟล์เอกสารหลักฐาน"

src/modules/11_discipline/components/2_InvestigateFacts/Form.vue

@@ -117,11 +117,9 @@ watch(props.data, async () => {
 </script>
 <template>
   <q-card flat bordered class="col-12 q-mt-sm">
-    <div class="q-pa-md">
       <form @submit.prevent="validateForm">
-        <div class="row col-12">
+        <div class="q-pa-md">
-          <div class="col-12 row bg-white q-col-gutter-md">
+          <div class="col-xs-12 row items-center q-col-gutter-md">
-            <div class="col-xs-12 row items-center">
             <div class="col-12">
               <q-input
                 for="#complaint"
@@ -138,8 +136,7 @@ watch(props.data, async () => {
                 type="textarea"
               />
             </div>
-              <div class="row no-wrap col-12">
+            <div class="col-6">
-                <div class="col-4 q-my-md q-mr-xs">
               <q-select
                 for="#fault"
                 outlined
@@ -153,6 +150,7 @@ watch(props.data, async () => {
                 map-options
                 option-label="name"
                 option-value="id"
+                hide-bottom-space
                 use-input
                 @filter="(inputValue: any,
                 doneFn: Function) => filterFnOptionsType(inputValue, doneFn, 'faultOp'
@@ -166,7 +164,7 @@ watch(props.data, async () => {
                 </template>
               </q-select>
             </div>
-                <div class="col-4 q-my-md q-mr-xs">
+            <div class="col-6">
               <q-select
                 for="#investigation"
                 outlined
@@ -182,6 +180,7 @@ watch(props.data, async () => {
                 map-options
                 option-label="name"
                 option-value="id"
+                hide-bottom-space
                 use-input
                 @filter="(inputValue: any,
         doneFn: Function) => filterFnOptionsType(inputValue, doneFn, 'investigationOp'
@@ -195,10 +194,9 @@ watch(props.data, async () => {
                 </template>
               </q-select>
             </div>
-              </div>
             <div
               v-if="formData.investigation === '003'"
-                class="col-12 q-mb-md"
+              class="col-12"
             >
               <q-input
                 for="#other"
@@ -219,24 +217,24 @@ watch(props.data, async () => {
                 ]"
               />
             </div>
-
+            <div class="row col-12">
-              <div class="row items-start col-12">
+                <q-card bordered class="row col-12" style="border:1px solid #d6dee1;">
-                <p
+                  <div class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-sm q-px-md">
-                  class="text-weight-medium q-ma-none text-center align-top q-pt-sm"
-                >
                     วันที่สืบสวน
-                </p>
                     <q-checkbox
                       for="#clickTime"
                       size="md"
                       v-model="formData.clickTime"
                       label="ขยายเวลา"
                       color="primary"
+                      dense
                       class="text-weight-medium q-ml-sm"
                       keep-color
                     />
-                <div v-if="formData.clickTime !== true" class="self-start row">
+                  </div>
-                  <div class="q-mx-xs">
+                  <div class="col-12"><q-separator /></div>
+                  <div class="col-xs-12 col-sm-12 q-pa-sm row">
+                    <div v-if="formData.clickTime !== true" class="q-col-gutter-sm row">
                         <datepicker
                           menu-class-name="modalfix"
                           v-model="formData.date"
@@ -258,6 +256,7 @@ watch(props.data, async () => {
                               dense
                               lazy-rules
                               borderless
+                              hide-bottom-space
                               :model-value="
                                 formData.date ? date2Thai(formData.date) : null
                               "
@@ -278,8 +277,6 @@ watch(props.data, async () => {
                             </q-input>
                           </template>
                         </datepicker>
-                  </div>
-                  <div class="q-mx-xs q-">
                         <datepicker
                           menu-class-name="modalfix"
                           v-model="formData.dateEnd"
@@ -300,6 +297,7 @@ watch(props.data, async () => {
                               outlined
                               dense
                               lazy-rules
+                              hide-bottom-space
                               borderless
                               :model-value="
                                 formData.dateEnd
@@ -324,8 +322,7 @@ watch(props.data, async () => {
                           </template>
                         </datepicker>
                     </div>
-                </div>
+                    <div v-else class="q-mx-xs col-xs-12 col-sm-6">
-                <div v-else class="q-mx-xs">
                       <q-select
                         for="#daysExtend"
                         outlined
@@ -336,6 +333,7 @@ watch(props.data, async () => {
                         :options="investigateFactStore.daysExtendOp"
                         label="จำนวนวันที่ต้องการขยาย"
                         emit-value
+                        hide-bottom-space
                         map-options
                         :rules="[
                           (val) =>
@@ -359,7 +357,9 @@ watch(props.data, async () => {
                       </q-select>
                     </div>
                   </div>
-              <div class="col-12 q-my-xs">
+                </q-card>
+            </div>
+            <div class="col-12 ">
               <q-input
                 for="#complaintdetail"
                 class="full-width inputgreen cursor-pointer"
@@ -377,7 +377,7 @@ watch(props.data, async () => {
                 type="textarea"
               />
             </div>
-              <div class="col-12 q-my-sm">
+            <div class="col-12">
               <q-file
                 for="#fileComplaint"
                 outlined
@@ -394,7 +394,7 @@ watch(props.data, async () => {
                 </template>
               </q-file>
             </div>
-              <div class="col-12 q-my-sm">
+            <div class="col-12">
               <q-input
                 for="#detail"
                 class="full-width inputgreen cursor-pointer"
@@ -410,7 +410,7 @@ watch(props.data, async () => {
                 type="textarea"
               />
             </div>
-              <div class="col-12 q-my-xs">
+            <div class="col-12">
               <q-file
                 for="#evidenceFiles"
                 outlined
@@ -427,7 +427,7 @@ watch(props.data, async () => {
                 </template>
               </q-file>
             </div>
-              <div class="row col-12 items-start q-mt-sm">
+            <div class="row col-12 items-start">
               <div class="col-4">
                 <q-input
                   for="#results"
@@ -439,6 +439,7 @@ watch(props.data, async () => {
                   outlined
                   debounce="300"
                   placeholder="ผลการสืบสวน"
+                  hide-bottom-space
                 >
                 </q-input>
               </div>
@@ -446,7 +447,7 @@ watch(props.data, async () => {
                 <q-btn
                   id="#confirm"
                   label="ยืนยันผลการสืบสวน"
-                    color="public"
+                  color="primary"
                   class="q-py-sm q-ml-sm"
                 >
                   <q-tooltip>ยืนยันผลการสืบสวน</q-tooltip>
@@ -455,7 +456,6 @@ watch(props.data, async () => {
             </div>
           </div>
         </div>
-        </div>
         <q-separator />
         <div class="row col-12 q-pa-sm">
           <q-space />
@@ -464,6 +464,5 @@ watch(props.data, async () => {
           >
         </div>
       </form>
-    </div>
   </q-card>
 </template>

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

@@ -22,6 +22,7 @@ const visibleColumns2 = ref<string[]>([
   "duty",
   "email",
   "telephone",
+  "role"
 ]);
 const columns2 = ref<QTableProps["columns"]>([
   {
@@ -90,6 +91,17 @@ const columns2 = ref<QTableProps["columns"]>([
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
+  {
+    name: "role",
+    align: "left",
+    label: "จำนวนเรื่องสืบสวน",
+    sortable: true,
+    field: "role",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
 ]);
 
 const props = defineProps({
@@ -138,15 +150,12 @@ watchEffect(() => {
     <q-card style="width: 1200px; max-width: 80vw">
       <DialogHeader title="เลือกรายชื่อกรรมการ" :close="clickClose" />
       <q-separator />
-      <q-card-section class="q-pt-none">
+      <q-card-section >
-        <div>
-          <div>
-            <q-toolbar style="padding: 0">
         <q-input
           borderless
           outlined
           dense
-                class="col-12"
+          class="col-12 q-mb-sm"
           debounce="300"
           :model-value="filterKeyword2"
           @update:model-value="updateInput"
@@ -163,10 +172,6 @@ watchEffect(() => {
             />
           </template>
         </q-input>
-            </q-toolbar>
-          </div>
-        </div>
-
         <d-table
           :columns="columns2"
           :rows="rows2"
@@ -208,6 +213,8 @@ watchEffect(() => {
         </d-table>
       </q-card-section>
 
+      <q-separator />
+
       <q-card-actions align="right" class="bg-white text-teal">
         <q-btn
           label="เพิ่มรายชื่อกรรมการ"

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

@@ -30,6 +30,7 @@ onMounted(async () => {
       duty: "ประธาน",
       email: "e@email.com",
       telephone: "0800808080",
+      role: "4",
     },
     {
       nameDirector: "นาย สรวิชญ์ พลสิทธิ์",
@@ -37,6 +38,7 @@ onMounted(async () => {
       duty: "เลขานุการ",
       email: "g@gmail.com",
       telephone: "0614565145",
+      role: "6",
     },
   ]);
   await hideLoader();
@@ -213,10 +215,8 @@ watch(props.data, async () => {
     <form @submit.prevent="validateForm">
       <div class="col-12">
         <q-card bordered>
-          <div class="col-12 row q-col-gutter-md q-pa-md">
+          <div class="col-12 row q-pa-md">
-            <div class="col-xs-12 col-sm-12 row">
+              <div class="col-12 row q-col-gutter-md">
-              <q-separator />
-              <div class="col-12 row q-pa-sm q-col-gutter-sm">
                 <q-input
                   class="col-12"
                   dense
@@ -225,6 +225,7 @@ watch(props.data, async () => {
                   for="#Complaint"
                   ref="complaintRef"
                   label="เรื่องร้องเรียน"
+                  hide-bottom-space
                   type="textarea"
                   :rules="[(val:string) => !!val || `${'กรุณากรอกเรื่องร้องเรียน'}`]"
                 />
@@ -251,6 +252,7 @@ watch(props.data, async () => {
                       outlined
                       dense
                       class="full-width datepicker"
+                      hide-bottom-space
                       :model-value="
                         dateInvestigate != null
                           ? date2Thai(dateInvestigate)
@@ -293,6 +295,7 @@ watch(props.data, async () => {
                       outlined
                       dense
                       class="col-xs-12 col-sm-4"
+                      hide-bottom-space
                       :model-value="
                         dateAllegation != null
                           ? date2Thai(dateAllegation)
@@ -338,6 +341,7 @@ watch(props.data, async () => {
                       outlined
                       dense
                       class="full-width datepicker"
+                      hide-bottom-space
                       :model-value="
                         dateEvident != null ? date2Thai(dateEvident) : null
                       "
@@ -358,21 +362,27 @@ watch(props.data, async () => {
                     </q-input>
                   </template>
                 </datepicker>
-                <div class="col-xs-12 col-sm-12 text-bold">
+                <div class="row col-12">
+                  <q-card bordered class="row col-12" style="border:1px solid #d6dee1;">
+                    <div class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md">
                       กรรมการ
                       <q-btn
                         size="12px"
                         flat
                         round
+                        dense
                         color="add"
+                        class="q-ml-sm"
                         @click="popup()"
                         icon="mdi-plus"
                       >
                         <q-tooltip>เพิ่มกรรมการ</q-tooltip>
                       </q-btn>
                     </div>
-                <div class="col-xs-12 col-sm-12 q-pb-md">
+                    <div class="col-12"><q-separator /></div>
+                    <div class="col-xs-12 q-pa-sm row">
                       <Table
+                        class="col-12"
                         style="max-height: 80vh"
                         :rows="rows"
                         :columns="investigateDis.columnsDirector"
@@ -416,7 +426,8 @@ watch(props.data, async () => {
                         </template>
                       </Table>
                     </div>
-
+                  </q-card>
+                </div>
                 <q-input
                   class="col-xs-12 col-sm-6"
                   dense
@@ -425,12 +436,14 @@ watch(props.data, async () => {
                   v-model="formData.casefault"
                   for="#casefault"
                   label="กรณีมีความผิด"
+                  hide-bottom-space
                   :rules="[(val) => !!val || `${'กรุณากรอกกรณีมีความผิด'}`]"
                   lazy-rules
                 />
                 <q-input
                   class="col-xs-12 col-sm-6"
                   dense
+                  hide-bottom-space
                   outlined
                   for="#whereInvestigate"
                   ref="whereInvestigateRef"
@@ -450,6 +463,7 @@ watch(props.data, async () => {
                   option-value="id"
                   emit-value
                   map-options
+                  hide-bottom-space
                   :options="investigateDis.optionsTypefault"
                   label="ลักษณะความผิด"
                 />
@@ -464,13 +478,15 @@ watch(props.data, async () => {
                   option-value="id"
                   emit-value
                   map-options
+                  hide-bottom-space
                   :options="investigateDis.optionsfaultLevel"
                   label="ระดับโทษความผิด"
                 />
                 <q-input
-                  class="col-xs-12 col-sm-6 q-pb-md"
+                  class="col-xs-12 col-sm-6"
                   dense
                   for="#refLaw"
+                  hide-bottom-space
                   outlined
                   ref="refLawRef"
                   v-model="formData.refLaw"
@@ -484,6 +500,7 @@ watch(props.data, async () => {
                   class="col-12"
                   dense
                   outlined
+                  hide-bottom-space
                   for="#detailComplaint"
                   ref="detailComplaintRef"
                   v-model="formData.detailComplaint"
@@ -495,6 +512,7 @@ watch(props.data, async () => {
                   class="col-12"
                   dense
                   outlined
+                  hide-bottom-space
                   for="#trueDetail"
                   ref="trueDetailRef"
                   v-model="formData.trueDetail"
@@ -502,19 +520,27 @@ watch(props.data, async () => {
                   type="textarea"
                   :rules="[(val:string) => !!val || `${'กรุณากรอกรายละเอียดสืบสวนข้อเท็จจริง'}`]"
                 />
+                <div class="row col-12">
+                  <q-card bordered class="row col-12" style="border:1px solid #d6dee1;">
+                    <div class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md">
+                      หลักฐานสนับสนุนข้อกล่าวหา
+                    </div>
+                    <div class="col-12"><q-separator /></div>
+                    <div class="col-xs-12 q-pa-sm row">
                       <q-input
                         class="col-12"
                         dense
                         outlined
                         for="#evidence"
                         ref="evidenceRef"
+                        hide-bottom-space
                         v-model="formData.evidence"
                         label="สรุปพยานหลักฐานสนับสนุนข้อกล่าวหา"
                         type="textarea"
                         :rules="[(val:string) => !!val || `${'กรุณากรอกสรุปพยานหลักฐานสนับสนุนข้อกล่าวหา'}`]"
                       />
                       <q-file
-                  class="col-12 q-pb-md"
+                        class="col-12 q-mt-sm"
                         outlined
                         dense
                         ref="filesEvidenceRef"
@@ -530,6 +556,16 @@ watch(props.data, async () => {
                           <q-icon name="attach_file" />
                         </template>
                       </q-file>
+                    </div>
+                  </q-card>
+                </div>
+                <div class="row col-12">
+                  <q-card bordered class="row col-12" style="border:1px solid #d6dee1;">
+                    <div class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md">
+                      บันทึกถ้อยคำของผู้กล่าวหา
+                    </div>
+                    <div class="col-12"><q-separator /></div>
+                    <div class="col-xs-12 q-pa-sm row">
                       <q-input
                         class="col-12"
                         dense
@@ -538,11 +574,12 @@ watch(props.data, async () => {
                         for="#recordAccuser"
                         v-model="formData.recordAccuser"
                         label="บันทึกถ้อยคำของผู้กล่าวหา"
+                        hide-bottom-space
                         type="textarea"
                         :rules="[(val:string) => !!val || `${'กรุณากรอกบันทึกถ้อยคำของผู้กล่าวหา'}`]"
                       />
                       <q-file
-                  class="col-12 q-pb-md"
+                        class="col-12 q-mt-sm"
                         outlined
                         dense
                         ref="filesRecordAccuserRef"
@@ -558,6 +595,16 @@ watch(props.data, async () => {
                           <q-icon name="attach_file" />
                         </template>
                       </q-file>
+                    </div>
+                  </q-card>
+                </div>
+                <div class="row col-12">
+                  <q-card bordered class="row col-12" style="border:1px solid #d6dee1;">
+                    <div class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-xs q-px-md">
+                      พยานและการบันทึกถ้อยคำ
+                    </div>
+                    <div class="col-12"><q-separator /></div>
+                    <div class="col-xs-12 q-pa-sm row">
                       <q-input
                         class="col-12"
                         dense
@@ -566,11 +613,12 @@ watch(props.data, async () => {
                         ref="witnessesRef"
                         v-model="formData.witnesses"
                         label="พยานและการบันทึกถ้อยคำ"
+                        hide-bottom-space
                         type="textarea"
                         :rules="[(val:string) => !!val || `${'กรุณากรอกพยานและการบันทึกถ้อยคำ'}`]"
                       />
                       <q-file
-                  class="col-12 q-pb-md"
+                        class="col-12 q-mt-sm"
                         outlined
                         dense
                         ref="filesWitnessesRef"
@@ -586,6 +634,9 @@ watch(props.data, async () => {
                           <q-icon name="attach_file" />
                         </template>
                       </q-file>
+                    </div>
+                  </q-card>
+                </div>
                 <q-input
                   class="col-12"
                   dense
@@ -594,6 +645,7 @@ watch(props.data, async () => {
                   ref="InvestResultsRef"
                   v-model="formData.InvestResults"
                   label="ผลการสอบสวน"
+                  hide-bottom-space
                   type="textarea"
                   :rules="[(val:string) => !!val || `${'กรุณากรอกผลการสอบสวน'}`]"
                 />
@@ -616,7 +668,6 @@ watch(props.data, async () => {
                 </q-file>
               </div>
           </div>
-          </div>
           <q-separator />
           <div class="row col-12 q-pa-sm">
             <q-space />

src/modules/11_discipline/components/6_BasicInformation/Channel/AddPage.vue

@@ -71,6 +71,7 @@ const clickBack = () => {
                   outlined
                   v-model="channel"
                   for="channel"
+                  hide-bottom-space
                   label="กรอกชื่อช่องทาง"
                   :rules="[(val:string) => !!val || `${'กรุณากรอกชื่อช่องทาง'}`]"
                 />
@@ -78,17 +79,13 @@ const clickBack = () => {
             </div>
           </div>
           <q-separator />
-          <q-separator />
           <div class="row col-12 q-pa-sm">
             <q-space />
             <q-btn
-              flat
+              label="บันทึก"
-              round
               color="public"
               @click="checkSave"
-              icon="mdi-content-save-outline"
             >
-              <q-tooltip>{{ edit ? "แก้ไขข้อมูล" : "บันทึกข้อมูล" }}</q-tooltip>
             </q-btn>
           </div>
         </q-card>

src/modules/11_discipline/components/6_BasicInformation/Director/Form.vue

@@ -81,12 +81,17 @@ function onValidate() {
 }
 </script>
 <template>
-  <form @submit.prevent.stop="onValidate" class="q-gutter-md">
+<form @submit.prevent.stop="onValidate">
-    <q-card bordered class="q-pa-md">
+    <q-card bordered>
-      <div v-if="data === null" class="row q-col-gutter-sm">
+      <div class="col-12 row q-pa-md">
-        <div class="col-3 row q-pa-md text-bold">
+        <div class="row q-col-gutter-md">
-          <label>ค้นหาบุคคลากรที่อยู่ในระบบ</label>
+          <div class="row col-12" v-if="data === null">
+            <q-card bordered class="row col-12" style="border:1px solid #d6dee1;">
+              <div class="col-xs-12 col-sm-12 text-weight-medium bg-grey-1 q-py-sm q-px-md">
+                ค้นหาบุคคลากรที่อยู่ในระบบ
               </div>
+              <div class="col-12"><q-separator /></div>
+              <div class="col-xs-12 q-pa-sm row">
                 <div class="col-6">
                   <q-input
                     dense
@@ -95,6 +100,7 @@ function onValidate() {
                     label="รหัสบัตรประชาชน"
                     ref="idCardRef"
                     for="idCardRef"
+                    hide-bottom-space
                     :rules="[(val: string) => !!val || `${'กรุณากรอกรหัสบัตรประชาชน'}`]"
                   />
                 </div>
@@ -103,15 +109,15 @@ function onValidate() {
                     unelevated
                     dense
                     color="primary"
-            class="q-px-md q-py-sm"
+                    class="q-px-md q-py-sm q-ml-sm"
                     @click="addEmployee"
                     label="เพิ่มบุคลากร"
                     id="addCustomer"
                   />
                 </div>
               </div>
-
+            </q-card>
-      <div class="row q-px-md q-col-gutter-sm">
+          </div>
           <div class="col-3">
             <q-input
               dense
@@ -120,6 +126,7 @@ function onValidate() {
               label="คำนำหน้า"
               ref="prefixRef"
               for="prefixRef"
+              hide-bottom-space
               :rules="[(val: string) => val !== null && val !== '' || `${'กรุณากรอกคำนำหน้า'}`]"
             />
           </div>
@@ -131,6 +138,7 @@ function onValidate() {
               label="ชื่อ"
               ref="firstnameRef"
               for="firstnameRef"
+              hide-bottom-space
               :rules="[(val: string) => val !== null && val !== '' || `${'กรุณากรอกชื่อ'}`]"
             />
           </div>
@@ -142,6 +150,7 @@ function onValidate() {
               label="นามสกุล"
               ref="lastnameRef"
               for="lastnameRef"
+              hide-bottom-space
               :rules="[(val: string) => !!val || `${'กรุณากรอกนามสกุล'}`]"
             />
           </div>
@@ -153,6 +162,7 @@ function onValidate() {
               label="ตำแหน่ง"
               ref="positionRef"
               for="positionRef"
+              hide-bottom-space
               :rules="[(val: string) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
             />
           </div>
@@ -164,6 +174,7 @@ function onValidate() {
               label="เบอร์โทร"
               ref="phoneRef"
               for="phoneRef"
+              hide-bottom-space
               :rules="[(val: string) => !!val || `${'กรุณากรอกเบอร์โทร'}`]"
             />
           </div>
@@ -174,12 +185,13 @@ function onValidate() {
               v-model="formData.email"
               label="อีเมล"
               ref="emailRef"
+              hide-bottom-space
               for="emailRef"
               :rules="[(val: string) => !!val || `${'กรุณากรอกอีเมล'}`]"
             />
           </div>
         </div>
-
+      </div>
     <q-separator />
     <div class="row col-12 q-pa-sm">
       <q-space />
@@ -193,5 +205,5 @@ function onValidate() {
       >
     </div>
   </q-card>
-  </form>
+</form>
 </template>

src/modules/11_discipline/interface/index/Main.ts

@@ -29,6 +29,7 @@ interface directorType {
   duty: string;
   email: string;
   telephone: string;
+  role: string;
 }
 
 export type {

src/modules/11_discipline/store/InvestigateDisStore.ts

@@ -51,6 +51,7 @@ export const useInvestigateDisStore = defineStore(
         duty: e.duty,
         email: e.email,
         telephone: e.telephone,
+        role: e.role,
       }));
       rows2.value = datalistDirector;
       selected.value = rows2.value;
@@ -204,6 +205,7 @@ export const useInvestigateDisStore = defineStore(
       "duty",
       "email",
       "telephone",
+      "role",
     ]);
     const columnsDirector = ref<QTableProps["columns"]>([
       {
@@ -260,6 +262,15 @@ export const useInvestigateDisStore = defineStore(
         headerStyle: "font-size: 14px",
         style: "font-size: 14px",
       },
+      {
+        name: "role",
+        align: "left",
+        label: "จำนวนเรื่องสืบสวน",
+        sortable: true,
+        field: "role",
+        headerStyle: "font-size: 14px",
+        style: "font-size: 14px",
+      },
     ]);
     return {
       fecthList,