Merge branch 'develop' into dev-tee

src/modules/06_retirement/components/ExitInterview/exitMain.vue

@@ -315,31 +315,79 @@ const saveOrder = async () => {
             </template>
             <template v-slot:body="props">
               <q-tr :props="props" class="cursor-pointer">
-                <q-td key="no" :props="props">
+                <q-td
+                  key="no"
+                  :props="props"
+                  @click="
+                    router.push(`/exit-Interview/questionnair/${props.row.id}`)
+                  "
+                >
                   {{ props.rowIndex + 1 }}
                 </q-td>
-                <q-td key="realReason" :props="props">
+                <q-td
+                  key="realReason"
+                  :props="props"
+                  @click="
+                    router.push(`/exit-Interview/questionnair/${props.row.id}`)
+                  "
+                >
                   {{ props.row.realReason }}
                 </q-td>
-                <q-td key="notExitFactor" :props="props">
+                <q-td
+                  key="notExitFactor"
+                  :props="props"
+                  @click="
+                    router.push(`/exit-Interview/questionnair/${props.row.id}`)
+                  "
+                >
                   {{ props.row.notExitFactor }}
                 </q-td>
-                <q-td key="futureWork" :props="props">
+                <q-td
+                  key="futureWork"
+                  :props="props"
+                  @click="
+                    router.push(`/exit-Interview/questionnair/${props.row.id}`)
+                  "
+                >
                   {{ props.row.futureWork ? "ใช่" : "ไม่" }}
                 </q-td>
-                <q-td key="futureWorkReason" :props="props">
+                <q-td
+                  key="futureWorkReason"
+                  :props="props"
+                  @click="
+                    router.push(`/exit-Interview/questionnair/${props.row.id}`)
+                  "
+                >
                   {{ props.row.futureWorkReason }}
                 </q-td>
-                <q-td key="havejob" :props="props">
+                <q-td
+                  key="havejob"
+                  :props="props"
+                  @click="
+                    router.push(`/exit-Interview/questionnair/${props.row.id}`)
+                  "
+                >
                   {{ props.row.havejob ? "ใช่" : "ไม่" }}
                 </q-td>
 
-                <q-td key="havejobReason" :props="props">
+                <q-td
+                  key="havejobReason"
+                  :props="props"
+                  @click="
+                    router.push(`/exit-Interview/questionnair/${props.row.id}`)
+                  "
+                >
                   <div class="table_ellipsis">
                     {{ props.row.havejobReason }}
                   </div>
                 </q-td>
-                <q-td key="datetext" :props="props">
+                <q-td
+                  key="datetext"
+                  :props="props"
+                  @click="
+                    router.push(`/exit-Interview/questionnair/${props.row.id}`)
+                  "
+                >
                   {{ props.row.datetext }}
                 </q-td>
                 <q-td auto-width>

src/modules/06_retirement/components/ExitInterview/exitRegistry.vue

@@ -10,12 +10,12 @@
       class="q-mr-sm"
       @click="router.go(-1)"
     />
-    รายละเอียด Exit interview ของ {{ responseData.fullname }}
+    รายละเอียด Exit interview ของ {{ prefix }} {{ fullname }}
   </div>
   <q-card bordered class="row col-12 text-dark">
     <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
       <div class="q-pl-sm text-weight-bold text-subtitle2">
-        {{ responseData.fullname }}
+        {{ fullname }}
       </div>
       <q-space />
     </div>
@@ -23,17 +23,14 @@
     <div class="row col-12 q-pa-md">
       <div class="col-12 row bg-white q-col-gutter-md">
         <div class="col-xs-3 col-sm-2 col-md-1 row">
-          <q-img
+          <q-img :src="avata" v-if="avata !== ''" />
-            :src="responseData.avataPath"
-            v-if="responseData.avataPath !== ''"
-          />
           <q-img src="@/assets/avatar_user.jpg" v-else />
         </div>
         <div class="col-xs-6 col-sm-3 row items-center">
           <div class="col-12 q-pl-md">
             <div class="col-12 text-top">ตำแหน่งในสายงาน</div>
             <div class="col-12 text-detail">
-              {{ responseData.positionTypeOld }}
+              {{ Position }}
             </div>
           </div>
         </div>
@@ -41,7 +38,7 @@
           <div class="col-12">
             <div class="col-12 text-top">ระดับ</div>
             <div class="col-12 text-detail">
-              {{ responseData.positionLevelOld }}
+              {{ PositionLevel }}
             </div>
           </div>
         </div>
@@ -49,7 +46,7 @@
           <div class="col-12">
             <div class="col-12 text-top">สังกัด</div>
             <div class="col-12 text-detail">
-              {{ responseData.organizationPositionOld }}
+              {{ Org }}
             </div>
           </div>
         </div>
@@ -98,180 +95,257 @@
     </div>
     <div class="col-12"><q-separator /></div>
     <q-form ref="myForm">
-      <div class="row col-12 q-pa-md">
+      <div class="col-12 row q-col-gutter-md q-pa-md">
-        <div class="col-12 row bg-white q-col-gutter-md">
+        <div class="col-xs-12 col-sm-12">
-          <div class="col-xs-12 row items-center">
+          <q-card bordered flat>
-            <div class="col-12">
+            <div
-              <div class="text-weight-bold text-grey">
+              class="q-pa-xs bg-grey-2 row items-center q-py-sm q-px-md justify-center text-bold"
-                แสดงข้อมูลแบบสอบถามเป็นคำถามเเละคำตอบ
+            >
+              แบบสอบถาม
+            </div>
+            <q-separator />
+            <div class="col-12 row q-pa-sm q-col-gutter-sm">
+              <div class="col-12 text-top0 items-center">
+                1. เหตุใดท่านจึงตัดสินใจร่วมงานกับกรุงเทพมหานคร (เลือกได้มากกว่า
+                1 ข้อ)
               </div>
-            </div>
+              <q-option-group
-            <div class="col-12">
+                :options="reasonWork_option"
-              <q-input
+                type="checkbox"
-                :class="getClass(edit)"
+                v-model="reasonWork"
-                :outlined="edit"
+                disable
-                dense
-                lazy-rules
-                :readonly="!edit"
-                :borderless="!edit"
-                v-model="organizationPositionOld"
-                :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง/สังกัด'}`]"
-                hide-bottom-space
-                :label="`${'ตำแหน่ง/สังกัด'}`"
-                type="textarea"
               />
-            </div>
+              <div class="col-12 text-top0 items-center">
-          </div>
+                <q-item-label>
-          <div class="col-xs-6 col-sm-3 row items-center">
-            <div class="col-12">
-              <q-input
-                :class="getClass(edit)"
-                :outlined="edit"
-                dense
-                lazy-rules
-                :readonly="!edit"
-                :borderless="!edit"
-                v-model="positionTypeOld"
-                :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งประเภท'}`]"
-                hide-bottom-space
-                :label="`${'ตำแหน่งประเภท'}`"
-              />
-            </div>
-          </div>
-          <div class="col-xs-6 col-sm-3 row items-center">
-            <div class="col-12">
-              <q-input
-                :class="getClass(edit)"
-                :outlined="edit"
-                dense
-                lazy-rules
-                :readonly="!edit"
-                :borderless="!edit"
-                v-model="positionLevelOld"
-                :rules="[(val) => !!val || `${'กรุณากรอกระดับ'}`]"
-                hide-bottom-space
-                :label="`${'ระดับ'}`"
-              />
-            </div>
-          </div>
-          <div class="col-xs-6 col-sm-3 row items-center">
-            <div class="col-12">
-              <q-input
-                :class="getClass(edit)"
-                :outlined="edit"
-                dense
-                lazy-rules
-                :readonly="!edit"
-                :borderless="!edit"
-                v-model="posNo"
-                :rules="[(val) => !!val || `${'กรุณากรอกเลขที่'}`]"
-                hide-bottom-space
-                :label="`${'เลขที่'}`"
-              />
-            </div>
-          </div>
-          <div class="col-xs-6 col-sm-3 row items-center">
-            <div class="col-12">
-              <!-- <q-input
-                  :class="getClass(edit)"
-                  :outlined="edit"
-                  dense
-                  lazy-rules
-                  :readonly="!edit"
-                  :borderless="!edit"
-                  v-model="salary"
-                  :rules="[(val) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
-                  hide-bottom-space
-                  :label="`${'เงินเดือน'}`"
-                  type="number"
-                /> -->
-
-              <CurrencyInput
-                v-model="salary"
-                :edit="edit"
-                :options="{
-                  currency: 'THB',
-                }"
-                :label="`${'เงินเดือน'}`"
-              />
-            </div>
-          </div>
-          <div class="col-12"><q-separator /></div>
-          <div class="col-xs-6 col-sm-6 row items-center">
-            <div class="col-12">
-              <q-input
-                :class="getClass(edit)"
-                :outlined="edit"
-                dense
-                lazy-rules
-                :readonly="!edit"
-                :borderless="!edit"
-                v-model="organization"
-                :rules="[(val) => !!val || `${'กรุณากรอกการให้ออกสังกัด'}`]"
-                hide-bottom-space
-                :label="`${'การให้ออกสังกัด'}`"
-              />
-            </div>
-          </div>
-          <div class="col-xs-6 col-sm-6 row items-center">
-            <div class="col-12">
-              <datepicker
-                menu-class-name="modalfix"
-                :readonly="!edit"
-                v-model="date"
-                :locale="'th'"
-                autoApply
-                :enableTimePicker="false"
-                week-start="0"
-              >
-                <template #year="{ year }">{{ year + 543 }}</template>
-                <template #year-overlay-value="{ value }">{{
-                  parseInt(value + 543)
-                }}</template>
-                <template #trigger>
                   <q-input
-                    :class="getClass(edit)"
+                    v-if="reasonWork.includes(12)"
-                    :outlined="edit"
+                    v-model="reasonWorkOther"
+                    disable
+                    label="กรอกข้อความ"
                     dense
                     lazy-rules
-                    :borderless="!edit"
+                    type="text"
-                    :model-value="date !== null ? date2Thai(date) : null"
+                    autogrow
-                    :rules="[(val) => !!val || `${'กรุณาเลือกตั้งแต่วัน'}`]"
                     hide-bottom-space
-                    :label="`${'ตั้งแต่วัน'}`"
+                    outlined
-                  >
+                    class="bg-white"
-                    <template v-slot:prepend>
+                    :rules="[
-                      <q-icon
+                      (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
-                        name="event"
+                    ]"
-                        class="cursor-pointer"
+                  />
-                        :style="
+                </q-item-label>
-                          edit
+              </div>
-                            ? 'color: var(--q-primary)'
+              <div class="col-12 text-top0 items-center">
-                            : 'color: var(--q-grey)'
+                2. สำหรับการลาออกในครั้งนี้
-                        "
+                ท่านได้คิดทบทวนอย่างจริงจังเป็นระยะเวลานานเท่าใด
-                      >
+              </div>
-                      </q-icon>
+              <q-option-group
-                    </template>
+                :options="timeThink_option"
-                  </q-input>
+                type="radio"
-                </template>
+                v-model="timeThink"
-              </datepicker>
+                disable
+              />
+
+              <div class="col-12 text-top0 items-center">
+                3. ปัจจัยใดที่ทำให้ท่านตัดสินใจลาออกจากราชการ (เลือกได้มากกว่า 1
+                ข้อ )
+              </div>
+              <q-option-group
+                :options="exitFactor_option"
+                type="checkbox"
+                v-model="exitFactor"
+                disable
+              />
+              <div class="col-12 text-top0 items-center">
+                <q-item-label>
+                  <q-input
+                    v-if="exitFactor.includes(15)"
+                    v-model="exitFactorOther"
+                    label="กรอกข้อความ"
+                    dense
+                    disable
+                    lazy-rules
+                    type="text"
+                    autogrow
+                    hide-bottom-space
+                    outlined
+                    class="bg-white"
+                    :rules="[
+                      (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
+                    ]"
+                  />
+                </q-item-label>
+              </div>
+
+              <div class="col-12 text-top0 items-center">
+                4. อะไรคือสิ่งที่ท่านเห็นว่าควรปรับปรุง (เลือกได้มากกว่า 1 ข้อ)
+              </div>
+              <q-list>
+                <q-option-group
+                  :options="adjust_option"
+                  type="checkbox"
+                  v-model="adjust"
+                  disable
+                />
+              </q-list>
+              <div class="col-12 text-top0 items-center">
+                <q-item-label>
+                  <q-input
+                    v-if="adjust.includes(15)"
+                    v-model="adjustOther"
+                    label="กรอกอื่นๆ"
+                    dense
+                    disable
+                    lazy-rules
+                    type="text"
+                    autogrow
+                    hide-bottom-space
+                    outlined
+                    class="bg-white"
+                    :rules="[
+                      (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
+                    ]"
+                  />
+                </q-item-label>
+              </div>
+              <div class="col-12 text-top0 items-center">
+                5. โปรดระบุสาเหตุที่แท้จริง
+                ที่ทำให้ท่านตัดสินใจลาออกจากการปฏิบัติราชการกับกรุงเทพมหานคร ?
+              </div>
+              <q-input
+                class="col-12"
+                dense
+                disable
+                outlined
+                v-model="realReason"
+                label="  "
+                type="textarea"
+              />
+
+              <div class="col-12 text-top0 items-center">
+                6. ปัจจัยใดที่จะช่วยทำให้ท่านเปลี่ยนใจ
+                ไม่อยากลาออกจากการปฏิบัติราชการกับกรุงเทพมหานคร
+              </div>
+              <q-input
+                class="col-12"
+                dense
+                outlined
+                disable
+                v-model="notExitFactor"
+                label="  "
+                type="textarea"
+              />
+
+              <div class="col-12 text-top0 items-center">
+                7. ท่านมีงานใหม่หรือไม่ ถ้ามี (โปรดระบุ
+                ชื่อบริษัทเอกชน/หน่วยงานภาครัฐ)
+                และอะไรคือสิ่งที่ที่ทำงานใหม่ให้กับท่าน
+                ซึ่งท่านรู้สึกว่าเป็นที่น่าพอใจมากกว่าการปฏิบัติราชการกับกรุงเทพมหานคร
+              </div>
+              <q-option-group
+                :options="haveJob_option"
+                type="radio"
+                v-model="haveJob"
+                disable
+              />
+              <div class="col-12 text-top0 items-center">
+                <q-item-label>
+                  <q-input
+                    v-if="haveJob === true"
+                    v-model="haveJobReason"
+                    label="กรอกอื่นๆ"
+                    dense
+                    disable
+                    lazy-rules
+                    type="text"
+                    autogrow
+                    hide-bottom-space
+                    outlined
+                    class="bg-white"
+                    :rules="[
+                      (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
+                    ]"
+                  />
+                </q-item-label>
+              </div>
+              <div class="col-12 text-top0 items-center">
+                8. ท่านจะแนะนำเพื่อนให้มาร่วมงานกับกรุงเทพมหานครหรือไม่ (ถ้าไม่
+                โปรดระบุเหตุผล)
+              </div>
+              <q-option-group
+                :options="suggestFriends_option"
+                type="radio"
+                v-model="suggestFriends"
+                disable
+              />
+              <div class="col-12 text-top0 items-center">
+                <q-item-label>
+                  <q-input
+                    v-if="suggestFriends === false"
+                    v-model="suggestFriendsReason"
+                    label="กรอกข้อความ"
+                    dense
+                    lazy-rules
+                    disable
+                    type="text"
+                    autogrow
+                    hide-bottom-space
+                    outlined
+                    class="bg-white"
+                    :rules="[
+                      (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
+                    ]"
+                  />
+                </q-item-label>
+              </div>
+              <div class="col-12 text-top0 items-center">
+                9. หากท่านมีโอกาสในอนาคต
+                ท่านอยากกลับมาร่วมงานกับกรุงเทพมหานครหรือไม่ (ถ้าไม่
+                โปรดระบุเหตุผล)
+              </div>
+              <q-option-group
+                :options="futureWork_option"
+                type="radio"
+                v-model="futureWork"
+                disable
+              />
+              <div class="col-12 text-top0 items-center">
+                <q-item-label>
+                  <q-input
+                    v-if="futureWork === false"
+                    v-model="futureWorkReason"
+                    label="กรอกข้อความ"
+                    dense
+                    lazy-rules
+                    type="text"
+                    autogrow
+                    hide-bottom-space
+                    outlined
+                    disable
+                    class="bg-white"
+                    :rules="[
+                      (val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
+                    ]"
+                  />
+                </q-item-label>
+              </div>
+
+              <div class="col-12 text-top0 items-center">
+                10. ความคิดเห็นและข้อเสนอแนะอื่น ๆ
+              </div>
+              <q-input
+                class="col-12"
+                dense
+                disable
+                outlined
+                v-model="suggestion"
+                label="  "
+                type="textarea"
+              />
+
+              <q-separator />
             </div>
-          </div>
+          </q-card>
-          <div class="col-12">
-            <q-input
-              :class="getClass(edit)"
-              :outlined="edit"
-              dense
-              lazy-rules
-              :readonly="!edit"
-              :borderless="!edit"
-              v-model="reason"
-              :rules="[(val) => !!val || `${'กรุณากรอกหมายเหตุ '}`]"
-              hide-bottom-space
-              :label="`${'หมายเหตุ '}`"
-              type="textarea"
-            />
-          </div>
         </div>
       </div>
     </q-form>
@@ -292,7 +366,9 @@ import type { QTableProps, QForm } from "quasar";
 import type {
   TypeFile,
   ResponseDataDetail,
-} from "@/modules/06_retirement/interface/response/expulsion";
+} from "@/modules/06_retirement/interface/response/exit";
+import PositionSide from "@/modules/01_metadata/components/positionEmployee/PositionSide.vue";
+import FullCalendarComponent from "@fullcalendar/vue3";
 
 const $q = useQuasar();
 const route = useRoute();
@@ -312,64 +388,126 @@ const {
 const myForm = ref<QForm | null>(null);
 const roleAdmin = ref<boolean>(false);
 const edit = ref<boolean>(false);
+const Org = ref<string>("");
+const PositionLevel = ref<string>("");
+const Position = ref<string>("");
+const prefix = ref<string>("");
+const exitFactor = ref<any>([]);
+const reasonWork = ref<any>([]);
+const adjust = ref<any>([]);
+const timeThink = ref<any>([]);
+const fullname = ref<any>("");
+const avata = ref<any>("");
+const realReason = ref<any>("");
+const notExitFactor = ref<any>("");
+const haveJob = ref<any>("");
+const suggestFriends = ref<any>([]);
+const futureWork = ref<any>([]);
+const suggestion = ref<any>("");
 
-const organizationPositionOld = ref<string>("");
+const reasonWorkOther = ref("");
-const positionTypeOld = ref<string>("");
+const reasonWork_option = ref<any>([
-const positionLevelOld = ref<string>("");
+  { label: "ความมั่นคงในการทำงาน ", value: 0 },
-const posNo = ref<string>("");
+  { label: "สิทธิประโยชน์/สวัสดิการ", value: 1 },
-const salary = ref<number>(0);
+  { label: "อัตราเงินเดือน ", value: 2 },
-const organization = ref<string>("");
+  { label: "ลักษณะงาน ", value: 3 },
-const date = ref<Date | null>(null);
+  { label: "วัฒนธรรมการทำงานของข้าราชการ ", value: 4 },
-const reason = ref<string>("");
+  { label: "นโยบายของหน่วยงาน ", value: 5 },
+  { label: "ระบบการทำงาน", value: 6 },
+  { label: "สมดุลชีวิตการทำงาน ", value: 7 },
+  { label: "บรรยากาศในการทำงาน  ", value: 8 },
+  { label: "การพัฒนาในสายอาชีพ  ", value: 9 },
+  { label: "โอกาสความก้าวหน้า  ", value: 10 },
+  { label: "การได้รับการยอมรับจากสังคม  ", value: 11 },
+  { label: "อื่น ๆ (ระบุ)  ", value: 12 },
+]);
+const exitFactorOther = ref("");
+const exitFactor_option = ref<any>([
+  { label: "อัตราเงินเดือน ", value: 0 },
+  { label: "สวัสดิการ", value: 1 },
+  { label: "ลักษณะงาน ", value: 2 },
+  { label: "ระบบการทำงาน ", value: 3 },
+  { label: "ระบบสนับสนุนการปฏิบัติงาน ", value: 4 },
+  { label: "การมอบหมายงานที่ชัดเจนและเหมาะสม ", value: 5 },
+  { label: "การบริหารงานของผู้บังคับบัญชา", value: 6 },
+  { label: "การทำงานเป็นทีมกับเพื่อนร่วมงาน ", value: 7 },
+  { label: "ระบบบริหารงานภายในหน่วยงาน  ", value: 8 },
+  { label: "บรรยากาศในการทำงาน  ", value: 9 },
+  { label: "การปฏิบัติอย่างเป็นธรรม  ", value: 10 },
+  { label: "การยอมรับความแตกต่างหลากหลาย  ", value: 11 },
+  { label: "การดูแลและให้ความช่วยเหลือในช่วงเริ่มต้นปฏิบัติงาน  ", value: 12 },
+  { label: "การพัฒนาอย่างเป็นระบบและต่อเนื่อง ", value: 13 },
+  { label: "โอกาสความก้าวหน้า  ", value: 14 },
+  { label: "อื่น ๆ (ระบุ)  ", value: 15 },
+]);
+const suggestFriendsReason = ref("");
+const suggestFriends_option = ref<any>([
+  { label: "แนะนำ  ", value: true },
+  { label: "ไม่แนะนำ (ระบุ)", value: false },
+]);
+const timeThink_option = ref<any>([
+  { label: "น้อยกว่า 2 สัปดาห์ ", value: 0 },
+  { label: "1 เดือน - 3 เดือน", value: 1 },
+  { label: "3 เดือน - 6 เดือน  ", value: 2 },
+  { label: "6 เดือนขึ้นไป  ", value: 3 },
+]);
+const haveJobReason = ref<any>("");
+const haveJob_option = ref<any>([
+  { label: "มี  (ระบุ) ", value: true },
+  { label: "ไม่มี", value: false },
+]);
+const futureWorkReason = ref<any>("");
+const futureWork_option = ref<any>([
+  { label: "อยาก  ", value: true },
+  { label: "ไม่อยาก (ระบุ)", value: false },
+]);
+const adjustOther = ref("");
+const adjust_option = ref<any>([
+  { label: "อัตราเงินเดือน ", value: 0 },
+  { label: "สวัสดิการ", value: 1 },
+  { label: "ลักษณะงาน ", value: 2 },
+  { label: "ระบบการทำงาน ", value: 3 },
+  { label: "ระบบสนับสนุนการปฏิบัติงาน ", value: 4 },
+  { label: "การมอบหมายงานที่ชัดเจนและเหมาะสม ", value: 5 },
+  { label: "การบริหารงานของผู้บังคับบัญชา", value: 6 },
+  { label: "การทำงานเป็นทีมกับเพื่อนร่วมงาน ", value: 7 },
+  { label: "ระบบบริหารงานภายในหน่วยงาน  ", value: 8 },
+  { label: "บรรยากาศในการทำงาน  ", value: 9 },
+  { label: "การปฏิบัติอย่างเป็นธรรม  ", value: 10 },
+  { label: "การยอมรับความแตกต่างหลากหลาย  ", value: 11 },
+  { label: "การดูแลและให้ความช่วยเหลือในช่วงเริ่มต้นปฏิบัติงาน  ", value: 12 },
+  { label: "การพัฒนาอย่างเป็นระบบและต่อเนื่อง ", value: 13 },
+  { label: "โอกาสความก้าวหน้า  ", value: 14 },
+  { label: "อื่น ๆ (ระบุ)  ", value: 15 },
+]);
 
-const responseData = ref<ResponseDataDetail>({
+const responseData = ref<any>({
-  personId: "",
+  Position: "",
-  avataPath: "",
+  PositionLevel: "",
-  createdAt: new Date(),
+  Org: "",
-  date: new Date(),
+  Prefix: "",
-  id: "",
+  Avatar: "",
-  organization: "",
-  organizationPositionOld: "",
-  positionLevelOld: "",
-  positionNumberOld: "",
-  positionTypeOld: "",
   reason: "",
   salary: 0,
   status: "",
   fullname: "",
+  ReasonWork: 0,
+  ReasonWorkOther: "",
+  TimeThink: 0,
+  ExitFactor: 0,
+  ExitFactorOther: "",
+  Adjust: 0,
+  AdjustOther: "",
+  RealReason: "",
+  NotExitFactor: "",
+  Havejob: null,
+  HavejobReason: "",
+  SuggestFriends: null,
+  SuggestFriendsReason: "",
+  FutureWork: null,
+  FutureWorkReason: "",
 });
 
-const rows = ref<TypeFile[]>([]);
-const columns = ref<QTableProps["columns"]>([
-  {
-    name: "no",
-    align: "left",
-    label: "ลำดับ",
-    sortable: true,
-    field: "no",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "fileName",
-    align: "left",
-    label: "ชื่อไฟล์",
-    sortable: true,
-    field: "fileName",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-  {
-    name: "btnMicrosoft",
-    align: "right",
-    label: "ปุ่ม",
-    sortable: true,
-    field: "btnMicrosoft",
-    headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
-  },
-]);
-
 onMounted(async () => {
   if (keycloak.tokenParsed != null) {
     roleAdmin.value = await keycloak.tokenParsed.role.includes("placement1");
@@ -384,34 +522,29 @@ const getData = async () => {
     .get(config.API.ExitInterviewByid(dataId))
     .then((res: any) => {
       const data = res.data.result;
-
+      avata.value = data.avatar ?? "";
-      responseData.value.personId = data.profileId;
+      Position.value = data.position ?? "";
-      responseData.value.createdAt = data.createdAt;
+      PositionLevel.value = data.positionLevel ?? "";
-      responseData.value.date =
+      Org.value = data.org ?? "";
-        data.date !== null ? new Date(data.date) : new Date();
+      fullname.value = data.fullname ?? "";
-      responseData.value.id = data.id ?? "";
+      prefix.value = data.prefix ?? "";
-      responseData.value.organization = data.organization ?? "";
+      reasonWork.value = data.reasonWork ?? [];
-      responseData.value.organizationPositionOld =
+      reasonWorkOther.value = data.ReasonWorkOther ?? "";
-        data.organizationPositionOld ?? "";
+      timeThink.value = data.TimeThink ?? 0;
-      responseData.value.positionLevelOld = data.positionLevelOld ?? "";
+      exitFactor.value = data.exitFactor ?? [];
-      responseData.value.positionNumberOld = data.positionNumberOld ?? "";
+      exitFactorOther.value = data.exitFactorOther ?? 0;
-      responseData.value.positionTypeOld = data.positionTypeOld ?? "";
+      adjust.value = data.adjust ?? [];
-      responseData.value.reason = data.reason ?? "";
+      adjustOther.value = data.adjustOther ?? "";
-      responseData.value.salary = data.salary !== null ? data.salary : 0;
+      realReason.value = data.realReason ?? "";
-      responseData.value.status = data.status ?? "";
+      notExitFactor.value = data.notExitFactor ?? "";
-      responseData.value.avataPath = data.avataPath ?? "";
+      haveJob.value = data.havejob ?? null;
-      responseData.value.fullname = `${data.firstName ?? "-"} ${
+      haveJobReason.value = data.havejobReason ?? "";
-        data.lastName ?? "-"
+      suggestFriends.value = data.suggestFriends ?? null;
-      }`;
+      suggestFriendsReason.value = data.suggestFriendsReason ?? "";
-
+      futureWork.value = data.futureWork ?? null;
-      organizationPositionOld.value = data.organizationPositionOld ?? "";
+      futureWorkReason.value = data.futureWorkReason ?? "";
-      positionTypeOld.value = data.positionTypeOld ?? "";
+      suggestion.value = data.suggestion ?? "";
-      positionLevelOld.value = data.positionLevelOld ?? "";
+      //   console.log(data.value);
-      posNo.value = data.posNo ?? "";
-      salary.value = data.salary ?? "";
-      organization.value = data.organization ?? "";
-      date.value = data.date !== null ? new Date(data.date) : null;
-      reason.value = data.reason ?? "";
     })
     .catch((e) => {
       messageError($q, e);
@@ -441,16 +574,7 @@ const conditionSave = async () => {
 };
 
 const saveData = async () => {
-  const body = {
+  const body = {};
-    organization: organization.value,
-    reason: reason.value,
-    organizationPositionOld: organizationPositionOld.value,
-    date: date.value,
-    positionTypeOld: positionTypeOld.value,
-    positionLevelOld: positionLevelOld.value,
-    positionNumberOld: posNo.value,
-    amountOld: salary.value,
-  };
   showLoader();
   await http
     .put(config.API.ExitInterviewByid(dataId), body)

src/modules/06_retirement/components/ListRetirement/TableList.vue

@@ -392,11 +392,13 @@ const paginationLabel = (start: number, end: number, total: number) => {
           </q-btn>
           <q-file
             bg-color="white"
+            clearable
             outlined
             dense
             v-model="fileUpload"
             accept=".pdf"
-            :style="fileUpload === null ? 'width: 100px' : 'width: auto'"
+            :style="fileUpload === null ? 'width: 150px' : 'width: auto'"
+            label="อัพโหลดไฟล์"
             v-if="statusUpload !== true"
           >
             <template v-slot:prepend>

src/modules/06_retirement/router.ts

@@ -31,8 +31,10 @@ const expulsionMain = () =>
 const expulsionDetails = () =>
   import("@/modules/06_retirement/components/Expulsion/expulsionRegistry.vue");
 
-const ExitInterviewMain = () =>
+const exitInterviewMain = () =>
   import("@/modules/06_retirement/components/ExitInterview/exitMain.vue");
+const exitInterviewDetails = () =>
+  import("@/modules/06_retirement/components/ExitInterview/exitRegistry.vue");
 
 export default [
   {
@@ -48,7 +50,17 @@ export default [
   {
     path: "/exit-Interview",
     name: "exit-Interview",
-    component: ExitInterviewMain,
+    component: exitInterviewMain,
+    meta: {
+      Auth: true,
+      Key: [7.3],
+      Role: "retirement",
+    },
+  },
+  {
+    path: "/exit-Interview/questionnair/:id",
+    name: "exit-Interview-details",
+    component: exitInterviewDetails,
     meta: {
       Auth: true,
       Key: [7.3],

src/modules/07_insignia/components/2_Manage/Tab2.vue

@@ -195,47 +195,112 @@ const dialogNote = ref<boolean>(false);
 const dialogTitle = ref<string>("");
 const dialogDesc = ref<string>("");
 const showReson = (name: string, requestNote: string) => {
-  dialogTitle.value = 'หมายเหตุของ' + name;
+  dialogTitle.value = "หมายเหตุของ" + name;
   dialogDesc.value = requestNote;
   dialogNote.value = true;
-}
+};
 
 const closeReson = () => {
   dialogNote.value = false;
-}
+};
-
 </script>
 <template>
   <div class="col-12 row q-pa-md">
     <div class="row col-12">
       <!-- {{ DataStore.typeinsigniaOptions }} -->
       <div class="row col-12 q-col-gutter-sm">
-        <q-select v-if="props.roleUser == 'admin'" v-model="organization" label="หน่วยงาน" dense emit-value map-options
+        <q-select
-          :options="organizationOptions" option-value="id" option-label="name" lazy-rules hide-bottom-space
+          v-if="props.roleUser == 'admin'"
-          :readonly="false" :borderless="false" :outlined="true" :hide-dropdown-icon="false" style="min-width: 150px"
+          v-model="organization"
-          @update:model-value="changtypeOc" />
+          label="หน่วยงาน"
-        <q-select v-model="DataStore.typeinsignia" label="ปรเภทเครื่องราชฯ" dense emit-value map-options
+          dense
-          :options="DataStore.typeinsigniaOptions" option-value="id" option-label="name" lazy-rules hide-bottom-space
+          emit-value
-          :readonly="false" :borderless="false" :outlined="true" :hide-dropdown-icon="false" style="min-width: 150px"
+          map-options
-          @update:model-value="DataStore.searchFilterTable" />
+          :options="organizationOptions"
+          option-value="id"
+          option-label="name"
+          lazy-rules
+          hide-bottom-space
+          :readonly="false"
+          :borderless="false"
+          :outlined="true"
+          :hide-dropdown-icon="false"
+          style="min-width: 150px"
+          @update:model-value="changtypeOc"
+        />
+        <q-select
+          v-model="DataStore.typeinsignia"
+          label="ปรเภทเครื่องราชฯ"
+          dense
+          emit-value
+          map-options
+          :options="DataStore.typeinsigniaOptions"
+          option-value="id"
+          option-label="name"
+          lazy-rules
+          hide-bottom-space
+          :readonly="false"
+          :borderless="false"
+          :outlined="true"
+          :hide-dropdown-icon="false"
+          style="min-width: 150px"
+          @update:model-value="DataStore.searchFilterTable"
+        />
         <q-space />
 
-        <q-input class="col-xs-12 col-sm-3 col-md-2" standout dense v-model="filterKeyword" ref="filterRef" outlined
+        <q-input
-          debounce="300" placeholder="ค้นหา">
+          class="col-xs-12 col-sm-3 col-md-2"
+          standout
+          dense
+          v-model="filterKeyword"
+          ref="filterRef"
+          outlined
+          debounce="300"
+          placeholder="ค้นหา"
+        >
           <template v-slot:append>
             <q-icon v-if="filterKeyword == ''" name="search" />
-            <q-icon v-if="filterKeyword !== ''" name="clear" class="cursor-pointer" @click="resetFilter" />
+            <q-icon
+              v-if="filterKeyword !== ''"
+              name="clear"
+              class="cursor-pointer"
+              @click="resetFilter"
+            />
           </template>
         </q-input>
 
-        <q-select v-model="visibleColumns" multiple outlined dense options-dense :display-value="$q.lang.table.columns"
+        <q-select
-          emit-value map-options :options="columns" option-value="name" options-cover style="min-width: 150px"
+          v-model="visibleColumns"
-          class="col-xs-12 col-sm-3 col-md-2" />
+          multiple
+          outlined
+          dense
+          options-dense
+          :display-value="$q.lang.table.columns"
+          emit-value
+          map-options
+          :options="columns"
+          option-value="name"
+          options-cover
+          style="min-width: 150px"
+          class="col-xs-12 col-sm-3 col-md-2"
+        />
       </div>
       <div class="col-12 q-pt-sm">
-        <q-table ref="table" :columns="columns" :rows="DataStore.rows" :filter="filterKeyword" row-key="name" flat
+        <q-table
-          bordered :paging="true" dense class="custom-header-table" :visible-columns="visibleColumns"
+          ref="table"
-          :pagination-label="paginationLabel" v-model:pagination="pagination">
+          :columns="columns"
+          :rows="DataStore.rows"
+          :filter="filterKeyword"
+          row-key="name"
+          flat
+          bordered
+          :paging="true"
+          dense
+          class="custom-header-table"
+          :visible-columns="visibleColumns"
+          :pagination-label="paginationLabel"
+          v-model:pagination="pagination"
+        >
           <template v-slot:header="props">
             <q-tr :props="props">
               <q-th v-for="col in props.cols" :key="col.name" :props="props">
@@ -245,7 +310,11 @@ const closeReson = () => {
             </q-tr>
           </template>
           <template v-slot:body="props">
-            <q-tr :props="props" class="cursor-pointer" @click="nextPage(props.row.profileId)">
+            <q-tr
+              :props="props"
+              class="cursor-pointer"
+              @click="nextPage(props.row.profileId)"
+            >
               <q-td key="no" :props="props">
                 {{ props.rowIndex + 1 }}
               </q-td>
@@ -274,21 +343,42 @@ const closeReson = () => {
               <q-td key="insigniaLevel" :props="props">
                 {{ props.row.insigniaLevel }}
               </q-td>
-              <q-td v-if="props.row.requestNote != ''" auto-width>
+              <q-td v-if="props.row.requestNote != null" auto-width>
-                <q-btn dense size="12px" flat round color="blue" @click.stop
+                <q-btn
-                  @click="showReson(props.row.name, props.row.requestNote)" icon="mdi-information-outline">
+                  dense
+                  size="12px"
+                  flat
+                  round
+                  color="blue"
+                  @click.stop
+                  @click="showReson(props.row.name, props.row.requestNote)"
+                  icon="mdi-information-outline"
+                >
                   <q-tooltip>เหตุผลการไม่ยื่นขอ</q-tooltip>
                 </q-btn>
               </q-td>
             </q-tr>
           </template>
           <template v-slot:pagination="scope">
-            <q-pagination v-model="pagination.page" active-color="primary" color="primary" :max="scope.pagesNumber"
+            <q-pagination
-              :max-pages="5" size="sm" boundary-links direction-links></q-pagination>
+              v-model="pagination.page"
+              active-color="primary"
+              color="primary"
+              :max="scope.pagesNumber"
+              :max-pages="5"
+              size="sm"
+              boundary-links
+              direction-links
+            ></q-pagination>
           </template>
         </q-table>
 
-        <DialogInformation :modal="dialogNote" :title="dialogTitle" :desc="dialogDesc" :click-close="closeReson" />
+        <DialogInformation
+          :modal="dialogNote"
+          :title="dialogTitle"
+          :desc="dialogDesc"
+          :click-close="closeReson"
+        />
       </div>
     </div>
   </div>

src/modules/07_insignia/components/2_Manage/Tab3.vue

@@ -4,6 +4,7 @@ import { useQuasar } from "quasar";
 import type { QTableProps } from "quasar";
 import { useInsigniaDataStore } from "@/modules/07_insignia/store";
 import { useRouter } from "vue-router";
+import DialogInformation from "@/components/Dialogs/Information.vue";
 
 const router = useRouter();
 const DataStore = useInsigniaDataStore();
@@ -185,9 +186,16 @@ const paginationLabel = (start: number, end: number, total: number) => {
 };
 
 const dialogNote = ref<boolean>(false);
-const showNote = (requestNote: string) => {
+const note = ref<string>("");
+const noteTitle = ref<string>("");
+const showNote = (row: any) => {
+  note.value = row.requestNote;
+  noteTitle.value = "เหตุผลกรลบออกของ" + " " + row.name;
   dialogNote.value = true;
 };
+const closeReson = () => {
+  dialogNote.value = false;
+};
 </script>
 <template>
   <div class="col-12 row q-pa-md">
@@ -327,7 +335,7 @@ const showNote = (requestNote: string) => {
               <q-td key="insigniaLevel" :props="props">
                 {{ props.row.insigniaLevel }}
               </q-td>
-              <q-td v-if="props.row.requestNote != ''" auto-width>
+              <q-td v-if="props.row.requestNote != null" auto-width>
                 <q-btn
                   dense
                   size="12px"
@@ -335,7 +343,7 @@ const showNote = (requestNote: string) => {
                   round
                   color="blue"
                   @click.stop
-                  @click="showNote(props.row.requestNote)"
+                  @click="showNote(props.row)"
                   icon="mdi-information-outline"
                 >
                   <q-tooltip>เหตุผลการลบ</q-tooltip>
@@ -359,4 +367,10 @@ const showNote = (requestNote: string) => {
       </div>
     </div>
   </div>
+  <DialogInformation
+    :modal="dialogNote"
+    :title="noteTitle"
+    :desc="note"
+    :click-close="closeReson"
+  />
 </template>

src/modules/07_insignia/components/3_result/DialogForm.vue

@@ -340,6 +340,7 @@ const searchcardid = () => {
                 v-model="employeeClass"
                 :label="`ขรก.สามัญ/ลูกจ้างประจำ`"
                 @update:model-value="selectType"
+                :disable="status !== ''"
               />
             </div>
             <div class="col-12 text-weight-bold text-grey">
@@ -347,7 +348,7 @@ const searchcardid = () => {
             </div>
             <div class="col-xs-12 col-sm-4">
               <q-input
-                :disable="disbleStatus || status == 'DONE'"
+                :disable="disbleStatus || status == 'DONE' ||  status == 'PENDING'"
                 hide-bottom-space
                 outlined
                 class="inputgreen"
@@ -549,7 +550,9 @@ const searchcardid = () => {
             </div>
             <div class="col-xs-12 col-sm-6">
               <q-input
-                :disable="disbleStatus || status == 'DONE'"
+                :disable="
+                  disbleStatus || status == 'DONE' || status == 'PENDING'
+                "
                 :rules="[(val) => !!val || 'กรุณากรอกสังกัด']"
                 hide-bottom-space
                 dense
@@ -575,7 +578,9 @@ const searchcardid = () => {
             </div>
             <div class="col-xs-12 col-sm-6">
               <q-input
-                :disable="disbleStatus || status == 'DONE'"
+                :disable="
+                  disbleStatus || status == 'DONE' || status == 'PENDING'
+                "
                 :rules="[(val) => !!val || 'กรุณากรอกสังกัด']"
                 hide-bottom-space
                 dense
@@ -794,7 +799,6 @@ const searchcardid = () => {
                 <template #trigger>
                   <q-input
                     :disable="disbleStatus"
-                    :rules="[(val) => !!val || 'กรุณาเลือกวันที่']"
                     dense
                     borderless
                     outlined
@@ -833,13 +837,11 @@ const searchcardid = () => {
                 map-options
                 v-model="payment"
                 :label="`เลือกรูปแบบการจ่าย`"
-                :rules="[(val) => !!val || 'เลือกรูปแบบการจ่าย']"
               />
             </div>
             <div v-if="payment === 'จัดส่งทางไปรษณี'" class="col-12">
               <q-input
                 :disable="disbleStatus"
-                :rules="[(val) => !!val || 'กรุณากรอกที่อยู่ที่จ่าย']"
                 label="ที่อยู่ที่จ่าย"
                 class="bg-white"
                 dense

src/modules/07_insignia/storeResult.ts

@@ -1,27 +1,76 @@
 import { defineStore } from "pinia";
 import { ref, } from "vue";
+import { useCounterMixin } from "@/stores/mixin";
 
-
+const mixin = useCounterMixin();
+const {
+  date2Thai,
+  dialogConfirm,
+  showLoader,
+  hideLoader,
+  messageError,
+  success,
+} = mixin;
 
 export const useResultDataStore = defineStore("insigniaResult", () => {
   const insignia = ref<string>('')
   const insigniaOp = ref<any[]>([{ name: "ทั้งหมด", id: "" }])
   const insigniaOp2 = ref<any[]>([])
   const insigniaType = ref<any>()
+  const invoiceType = ref<string>('all')
+  const invoiceTypeop = ref<any>([{ name: "ทั้งหมด", id: "all" }, { name: "ใบกำกับที่ค้างจ่าย", id: "noDate" }, { name: "ใบกำกับที่จ่ายแล้ว", id: "haveDate" }])
+  const rows = ref<any>([])
+  const listInsignia = ref<any>([])
 
 
   const fetchDatainsignia = async (data: any) => {
+    insignia.value = ''
+    invoiceType.value = 'all'
     data.forEach((e: any) => {
       insigniaOp.value.push({ name: e.name, id: e.id })
     });
     data.forEach((e: any) => {
       insigniaOp2.value.push({ name: e.name, id: e.id })
     });
-
   }
   const fetchDatainsigniaType = async (data: any) => {
     insigniaType.value = data.map((e: any) => ({ name: e.id, label: e.name }))
   }
+  const fetchlistinsignia = async (data: any) => {
+    rows.value = [];
+    let alllist = await data.map((e: any) => ({
+      id: e.id,
+      citizenId: e.citizenId,
+      prefix: e.prefix,
+      position: e.position,
+      status: status(e.status),
+      dateReceive: date2Thai(e.dateReceive),
+      name: e.fullName,
+      type: e.requestInsignia,
+      employeeType: profileType(e.profileType),
+      profileType: e.profileType,
+      page: e.page,
+      number: e.no,
+      vatnumber: e.number,
+      datepay: date2Thai(e.datePayment),
+      typepay: e.typePayment,
+      address: e.address,
+    }));
+    rows.value = alllist
+    listInsignia.value = alllist
+    selectInvoice(invoiceType.value)
+
+  }
+  const selectInvoice = (invoice: string) => {
+    console.log(invoice);
+    if (invoice === "noDate") {
+      let list = listInsignia.value.filter((e: any) => e.datepay === null)
+      rows.value = list
+    } else if (invoice === "haveDate") {
+      let list = listInsignia.value.filter((e: any) => e.datepay !== null)
+      rows.value = list
+    } else rows.value = listInsignia.value
+  }
   const status = (val: string) => {
     switch (val) {
       case "PENDING":
@@ -43,13 +92,18 @@ export const useResultDataStore = defineStore("insigniaResult", () => {
     }
   }
   return {
+    rows,
     insignia,
     insigniaOp,
     insigniaOp2,
     insigniaType,
+    invoiceType,
+    invoiceTypeop,
     fetchDatainsignia,
     fetchDatainsigniaType,
     status,
     profileType,
+    fetchlistinsignia,
+    selectInvoice,
   };
 });

src/modules/07_insignia/views/ResultPage.vue

@@ -45,9 +45,11 @@ const fecthRound = async () => {
     .get(config.API.noteround())
     .then((res) => {
       let data = res.data.result;
-      selectRoundOption.value = data;
+      selectRoundOption.value = data.map((e: any) => ({
+        name: "รอบการเสนอพระราชทานเครื่องราชปี" + "  " + (e.year + 543),
+        id: e.id,
+      }));
       selectRound.value = data[0].id;
-      // console.log(selectRound.value);
     })
     .catch((err) => {
       console.log(err);
@@ -57,7 +59,7 @@ const fecthInsignia = async () => {
   await http
     .get(config.API.insignia)
     .then((res) => {
-      // console.log(res);
+      console.log(res);
       let data = res.data.result;
       DataStore.fetchDatainsignia(data);
     })
@@ -80,8 +82,10 @@ const fecthInsigniaType = async () => {
 const visibleColumns = ref<String[]>([
   "no",
   "status",
+  "citizenId",
   "name",
   "type",
+  "dateReceive",
   "employeeType",
   "page",
   "number",
@@ -101,6 +105,7 @@ const columns = ref<QTableProps["columns"]>([
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
+
   {
     name: "status",
     align: "left",
@@ -110,6 +115,15 @@ const columns = ref<QTableProps["columns"]>([
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
+  {
+    name: "citizenId",
+    align: "left",
+    label: "เลขบัตรประชาชน",
+    field: "citizenId",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
   {
     name: "name",
     align: "left",
@@ -122,12 +136,21 @@ const columns = ref<QTableProps["columns"]>([
   {
     name: "type",
     align: "left",
-    label: "ประเภทเครื่องราชฯ",
+    label: "เครื่องราชฯ",
     field: "type",
     sortable: true,
     sort: (a: string, b: string) =>
       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
   },
+  {
+    name: "dateReceive",
+    align: "left",
+    label: "วันที่ได้รับพระราชทาน",
+    field: "dateReceive",
+    sortable: true,
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
   {
     name: "employeeType",
     align: "left",
@@ -198,20 +221,6 @@ const columns = ref<QTableProps["columns"]>([
     field: "",
   },
 ]);
-const rows = ref<any>([
-  // {
-  //   no: "1",
-  //   status: "รอบันทึกข้อมูล",
-  //   name: "นางสาวรัชภรณ์ ภักดี",
-  //   type: "ทั้งหมด",
-  //   page: "8",
-  //   number: "11",
-  //   vatnumber: "5647833",
-  //   datepay: null,
-  //   typepay: null,
-  //   address: "เลขที่ 2/3 หมู่ที่ 14 ถนนบ...",
-  // },
-]);
 watch(tab, () => {
   if (tab.value !== "doc") {
     fecthlistInsignia();
@@ -239,24 +248,8 @@ const fecthlistInsignia = async () => {
     .post(config.API.noteSearch(), data)
     .then((res) => {
       let data = res.data.result;
-      rows.value = [];
+      console.log(data);
-      rows.value = data.map((e: any) => ({
+      DataStore.fetchlistinsignia(data);
-        id: e.id,
-        citizenId: e.citizenId,
-        prefix: e.prefix,
-        position: e.position,
-        status: DataStore.status(e.status),
-        name: e.fullName,
-        type: e.requestInsignia,
-        employeeType: DataStore.profileType(e.profileType),
-        profileType: e.profileType,
-        page: e.page,
-        number: e.no,
-        vatnumber: e.number,
-        datepay: date2Thai(e.datePayment),
-        typepay: e.typePayment,
-        address: e.address,
-      }));
     })
     .catch((err) => {
       console.log(err);
@@ -280,6 +273,7 @@ const uploadFile = async (event: any, action: string) => {
         })
         .catch((err) => {
           console.log(err);
+          messageError($q, err);
         })
         .finally(async () => {
           await fecthlistInsignia();
@@ -295,6 +289,7 @@ const uploadFile = async (event: any, action: string) => {
         })
         .catch((err) => {
           console.log(err);
+          messageError($q, err);
         })
         .finally(async () => {
           await fecthlistInsignia();
@@ -374,51 +369,19 @@ const resetFilter = () => {
       <div v-for="item in DataStore.insigniaType">
         <q-tab :name="item.name" :label="item.label" />
       </div>
-      <!-- <q-tab name="hight" label="ขั้นสายสะพาน" />
-      <q-tab name="low" label="ขั้นต่ำกว่าสายสะพาน" />
-      <q-tab name="medal" label="เหรียญตรา" /> -->
 
       <q-tab name="doc" label="เอกสารอ้างอิง" />
     </q-tabs>
-
     <q-separator />
-
+    <q-tab-panels v-model="tab" animated>
-    <div>
+      <q-tab-panel
-      <div v-for="item in DataStore.insigniaType">
+        v-for="item in DataStore.insigniaType"
-        <div v-if="tab == item.name" class="q-pa-md">
+        :key="item.name"
+        :name="item.name"
+        class="q-pa-none"
+      >
+        <div class="q-pa-md">
           <div class="row col-12 q-pb-sm q-col-gutter-x-xs">
-            <div>
-              <q-select
-                v-model="DataStore.insignia"
-                dense
-                outlined
-                lazy-rules
-                hide-bottom-space
-                :label="`${'เครื่องราชฯ'}`"
-                emit-value
-                map-options
-                option-label="name"
-                :options="DataStore.insigniaOp"
-                option-value="id"
-                :readonly="false"
-                :borderless="false"
-                style="min-width: 150px"
-                @update:model-value="selectorInsignia"
-              />
-            </div>
-
-            <div>
-              <q-btn
-                @click="addData()"
-                size="12px"
-                flat
-                round
-                color="add"
-                icon="mdi-plus"
-              >
-                <q-tooltip>เพิ่ม</q-tooltip>
-              </q-btn>
-            </div>
             <div>
               <q-file
                 dense
@@ -436,27 +399,6 @@ const resetFilter = () => {
                   >อัพโหลดไฟล์บันทึกผลการได้รับพระราชทานเครื่องราชย์อิสริยสภรณ์</q-tooltip
                 >
               </q-file>
-
-              <!-- <q-btn flat round color="light-blue" icon="upload">
-                <q-menu>
-                  <q-list style="min-width: 150px">
-                    <q-item clickable v-close-popup>
-                      <q-item-section avatar
-                        ><q-icon color="green-7" name="mdi-file-excel"
-                      /></q-item-section>
-                      <q-item-section
-                        >บันทึกผลการได้รับพระราชทานเครื่องราชย์อิสริยสภรณ์</q-item-section
-                      >
-                    </q-item>
-                    <q-item clickable v-close-popup>
-                      <q-item-section avatar
-                        ><q-icon color="green-7" name="mdi-file-excel"
-                      /></q-item-section>
-                      <q-item-section>บันทึกผลการจ่ายใบกำกับ</q-item-section>
-                    </q-item>
-                  </q-list>
-                </q-menu>
-              </q-btn> -->
             </div>
             <div v-if="fileResult !== null">
               <q-btn
@@ -500,6 +442,61 @@ const resetFilter = () => {
                 <q-tooltip>อัพโหลดไฟล์บันทึกผลการจ่ายใบกำกับ</q-tooltip>
               </q-btn>
             </div>
+          </div>
+          <div class="row col-12 q-pb-sm q-col-gutter-x-xs">
+            <div>
+              <q-select
+                v-model="DataStore.insignia"
+                dense
+                outlined
+                lazy-rules
+                hide-bottom-space
+                :label="`${'เครื่องราชฯ'}`"
+                emit-value
+                map-options
+                option-label="name"
+                :options="DataStore.insigniaOp"
+                option-value="id"
+                :readonly="false"
+                :borderless="false"
+                style="min-width: 150px"
+                @update:model-value="selectorInsignia"
+              />
+            </div>
+            <div>
+              <q-select
+                v-model="DataStore.invoiceType"
+                dense
+                outlined
+                lazy-rules
+                hide-bottom-space
+                :label="`${'ใบกำกับ'}`"
+                emit-value
+                map-options
+                option-label="name"
+                :options="DataStore.invoiceTypeop"
+                option-value="id"
+                :readonly="false"
+                :borderless="false"
+                style="min-width: 150px"
+                @update:model-value="
+                  DataStore.selectInvoice(DataStore.invoiceType)
+                "
+              />
+            </div>
+
+            <div>
+              <q-btn
+                @click="addData()"
+                size="12px"
+                flat
+                round
+                color="add"
+                icon="mdi-plus"
+              >
+                <q-tooltip>เพิ่ม</q-tooltip>
+              </q-btn>
+            </div>
 
             <q-space />
 
@@ -543,9 +540,8 @@ const resetFilter = () => {
               />
             </div>
           </div>
-
           <d-table
-            :rows="rows"
+            :rows="DataStore.rows"
             :columns="columns"
             :visible-columns="visibleColumns"
             :filter="filter"
@@ -578,274 +574,11 @@ const resetFilter = () => {
             </template>
           </d-table>
         </div>
-
+      </q-tab-panel>
-        <div v-else-if="tab == item.name" class="q-pa-md">
+      <q-tab-panel name="doc" class="q-pa-none">
-          <div class="row col-12 q-pb-sm q-col-gutter-x-xs">
-            <selector
-              outlined
-              dense
-              lazy-rules
-              v-model="DataStore.insignia"
-              hide-bottom-space
-              :label="`${'เครื่องราชฯ'}`"
-              emit-value
-              map-options
-              option-label="name"
-              :options="DataStore.insigniaOp"
-              option-value="id"
-              use-input
-              input-debounce="0"
-              style="min-width: 150px"
-            />
-            <div>
-              <q-btn
-                @click="addData()"
-                size="12px"
-                flat
-                round
-                color="add"
-                icon="mdi-plus"
-              >
-                <q-tooltip>เพิ่ม</q-tooltip>
-              </q-btn>
-            </div>
-            <div>
-              <q-btn flat round color="light-blue" icon="upload">
-                <!-- <q-tooltip>อัพโหลดไฟล์</q-tooltip> -->
-                <q-menu>
-                  <q-list style="min-width: 150px">
-                    <q-item clickable v-close-popup>
-                      <q-item-section avatar
-                        ><q-icon color="green-7" name="mdi-file-excel"
-                      /></q-item-section>
-                      <q-item-section
-                        >บันทึกผลการได้รับพระราชทานเครื่องราชย์อิสริยสภรณ์</q-item-section
-                      >
-                    </q-item>
-                    <q-item clickable v-close-popup>
-                      <q-item-section avatar
-                        ><q-icon color="green-7" name="mdi-file-excel"
-                      /></q-item-section>
-                      <q-item-section>บันทึกผลการจ่ายใบกำกับ</q-item-section>
-                    </q-item>
-                  </q-list>
-                </q-menu>
-              </q-btn>
-            </div>
-
-            <q-space />
-
-            <div class="items-center" style="display: flex">
-              <!-- ค้นหาข้อความใน table -->
-              <q-input
-                standout
-                dense
-                v-model="filter"
-                ref="filterRef"
-                outlined
-                debounce="300"
-                placeholder="ค้นหา"
-                style="max-width: 200px"
-                class="q-ml-sm"
-              >
-                <template v-slot:append>
-                  <q-icon v-if="filter == ''" name="search" />
-                  <q-icon
-                    v-if="filter !== ''"
-                    name="clear"
-                    class="cursor-pointer"
-                    @click="resetFilter"
-                  />
-                </template>
-              </q-input>
-              <!-- แสดงคอลัมน์ใน table -->
-              <q-select
-                v-model="visibleColumns"
-                :display-value="$q.lang.table.columns"
-                multiple
-                outlined
-                dense
-                :options="columns"
-                options-dense
-                option-value="name"
-                map-options
-                emit-value
-                style="min-width: 150px"
-                class="gt-xs q-ml-sm"
-              />
-            </div>
-          </div>
-
-          <d-table
-            :rows="rows"
-            :columns="columns"
-            :visible-columns="visibleColumns"
-            :filter="filter"
-            row-key="name"
-          >
-            <template v-slot:body-cell="props">
-              <q-td :props="props">
-                <div v-if="props.col.name == 'no'">
-                  {{ props.rowIndex + 1 }}
-                </div>
-
-                <div v-else-if="props.col.name == 'action'">
-                  <q-btn
-                    dense
-                    size="12px"
-                    flat
-                    round
-                    color="primary"
-                    @click="editData(props.row)"
-                    icon="mdi-pencil-outline"
-                  >
-                    <q-tooltip>แก้ไขข้อมูล</q-tooltip>
-                  </q-btn>
-                </div>
-
-                <div v-else>
-                  {{ props.value }}
-                </div>
-              </q-td>
-            </template>
-          </d-table>
-        </div>
-
-        <div v-else-if="tab == item.name" class="q-pa-md">
-          <div class="row col-12 q-pb-sm q-col-gutter-x-xs">
-            <selector
-              outlined
-              dense
-              lazy-rules
-              v-model="DataStore.insignia"
-              hide-bottom-space
-              :label="`${'เครื่องราชฯ'}`"
-              emit-value
-              map-options
-              option-label="name"
-              :options="DataStore.insigniaOp"
-              option-value="id"
-              use-input
-              input-debounce="0"
-              style="min-width: 150px"
-            />
-            <div>
-              <q-btn
-                @click="addData()"
-                size="12px"
-                flat
-                round
-                color="add"
-                icon="mdi-plus"
-              >
-                <q-tooltip>เพิ่ม</q-tooltip>
-              </q-btn>
-            </div>
-            <div>
-              <q-btn flat round color="light-blue" icon="upload">
-                <!-- <q-tooltip>อัพโหลดไฟล์</q-tooltip> -->
-                <q-menu>
-                  <q-list style="min-width: 150px">
-                    <q-item clickable v-close-popup>
-                      <q-item-section avatar
-                        ><q-icon color="green-7" name="mdi-file-excel"
-                      /></q-item-section>
-                      <q-item-section
-                        >บันทึกผลการได้รับพระราชทานเครื่องราชย์อิสริยสภรณ์</q-item-section
-                      >
-                    </q-item>
-                    <q-item clickable v-close-popup>
-                      <q-item-section avatar
-                        ><q-icon color="green-7" name="mdi-file-excel"
-                      /></q-item-section>
-                      <q-item-section>บันทึกผลการจ่ายใบกำกับ</q-item-section>
-                    </q-item>
-                  </q-list>
-                </q-menu>
-              </q-btn>
-            </div>
-            <q-space />
-
-            <div class="items-center" style="display: flex">
-              <!-- ค้นหาข้อความใน table -->
-              <q-input
-                standout
-                dense
-                v-model="filter"
-                ref="filterRef"
-                outlined
-                debounce="300"
-                placeholder="ค้นหา"
-                style="max-width: 200px"
-                class="q-ml-sm"
-              >
-                <template v-slot:append>
-                  <q-icon v-if="filter == ''" name="search" />
-                  <q-icon
-                    v-if="filter !== ''"
-                    name="clear"
-                    class="cursor-pointer"
-                    @click="resetFilter"
-                  />
-                </template>
-              </q-input>
-              <!-- แสดงคอลัมน์ใน table -->
-              <q-select
-                v-model="visibleColumns"
-                :display-value="$q.lang.table.columns"
-                multiple
-                outlined
-                dense
-                :options="columns"
-                options-dense
-                option-value="name"
-                map-options
-                emit-value
-                style="min-width: 150px"
-                class="gt-xs q-ml-sm"
-              />
-            </div>
-          </div>
-
-          <d-table
-            :rows="rows"
-            :columns="columns"
-            :visible-columns="visibleColumns"
-            :filter="filter"
-            row-key="name"
-          >
-            <template v-slot:body-cell="props">
-              <q-td :props="props">
-                <div v-if="props.col.name == 'no'">
-                  {{ props.rowIndex + 1 }}
-                </div>
-
-                <div v-else-if="props.col.name == 'action'">
-                  <q-btn
-                    dense
-                    size="12px"
-                    flat
-                    round
-                    color="primary"
-                    @click="editData(props.row)"
-                    icon="mdi-pencil-outline"
-                  >
-                    <q-tooltip>แก้ไขข้อมูล</q-tooltip>
-                  </q-btn>
-                </div>
-
-                <div v-else>
-                  {{ props.value }}
-                </div>
-              </q-td>
-            </template>
-          </d-table>
-        </div>
-      </div>
-      <div v-if="tab == 'doc'">
         <fileUploadview :roundId="selectRound" />
-      </div>
+      </q-tab-panel>
-    </div>
+    </q-tab-panels>
 
     <DialogForm
       :modal="modal"

src/modules/10_order/components/Detail.vue

@@ -7,9 +7,7 @@
   <q-card flat bordered class="col-12 q-my-sm q-mt-sm">
     <q-stepper v-model="step" ref="stepper" color="primary" animated class="step" header-class="bg-grey-1">
       <q-step :name="1" title="รายละเอียดการออกคำสั่ง" prefix="1" :done="step > 1" :header-nav="step > 1" />
-
       <q-step :name="2" title="เลือกรายชื่อ" prefix="2" :done="step > 2" :header-nav="step > 2" />
-
       <q-step :name="3" title="เลือกรายชื่อส่งสำเนาคำสั่ง" prefix="3" :done="step > 3" :header-nav="step > 3" />
       <q-step :name="4" title="รายละเอียดคำสั่งและแนบท้าย" prefix="4" :done="step > 4" :header-nav="step > 4" />
       <template v-slot:message>