From e00ed7a2245feb6273e2015693f4709616735883 Mon Sep 17 00:00:00 2001
From: Thanit Konmek <thanit@frappet.com>
Date: Thu, 13 Jul 2023 09:43:09 +0700
Subject: [PATCH 1/2] =?UTF-8?q?commit=20=E0=B9=81=E0=B8=81=E0=B9=89?=
 =?UTF-8?q?=E0=B9=84=E0=B8=82=20step4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../PersonalDetail/Information/Address.vue    | 15 +++++++++--
 .../05_placement/interface/index/Main.ts      | 27 ++++++++++++++++---
 2 files changed, 36 insertions(+), 6 deletions(-)

diff --git a/src/modules/05_placement/components/PersonalDetail/Information/Address.vue b/src/modules/05_placement/components/PersonalDetail/Information/Address.vue
index 623b91beb..3b61017e1 100644
--- a/src/modules/05_placement/components/PersonalDetail/Information/Address.vue
+++ b/src/modules/05_placement/components/PersonalDetail/Information/Address.vue
@@ -17,8 +17,15 @@ import type { RequestItemsHistoryObject } from "@/modules//05_placement/interfac
 import type { ResponseObject } from "@/modules//05_placement/interface/response/Address";
 import HistoryTable from "@/components/TableHistory.vue";
 import { useRoute } from "vue-router";
-import type { AddressOps } from "@/modules//05_placement/interface/index/Main";
+
+import { AddressDataDefualt } from "@/modules//05_placement/interface/index/Main";
+
+import type {
+  AddressOps,
+  Address as AddressType,
+} from "@/modules//05_placement/interface/index/Main";
 import type { QTableProps } from "quasar";
+import type { PropType } from "vue";
 
 const props = defineProps({
   statusEdit: {
@@ -33,6 +40,10 @@ const props = defineProps({
     type: Function,
     default: () => console.log("not function"),
   },
+  data: {
+    type: Object as PropType<AddressType>,
+    default: AddressDataDefualt,
+  },
 });
 const emit = defineEmits(["update:statusEdit"]);
 
@@ -835,4 +846,4 @@ const getClass = (val: boolean) => {
       </q-tr>
     </template>
   </HistoryTable>
-</template>
\ No newline at end of file
+</template>
diff --git a/src/modules/05_placement/interface/index/Main.ts b/src/modules/05_placement/interface/index/Main.ts
index 528de79ab..1be6b591d 100644
--- a/src/modules/05_placement/interface/index/Main.ts
+++ b/src/modules/05_placement/interface/index/Main.ts
@@ -1,12 +1,12 @@
 import type { zipCodeOption } from "../../components/PersonalDetail/profileType";
 interface DataOption {
-  id: number|null;
-  name:string|null;
+  id: number | null;
+  name: string | null;
   disable?: boolean;
 }
 interface DataOption1 {
-  id: string|null;
-  name:string|null;
+  id: string | null;
+  name: string | null;
   disable?: boolean;
 }
 interface DataOptionInsignia {
@@ -133,6 +133,24 @@ interface Address {
   registSame: boolean;
 }
 
+const AddressDataDefualt: Address = {
+  registSubDistrict: "",
+  registSubDistrictId: "",
+  registZipCode: "",
+  registDistrict: "",
+  registDistrictId: "",
+  registProvince: "",
+  registProvinceId: "",
+  currentSubDistrict: "",
+  currentSubDistrictId: "",
+  currentZipCode: "",
+  currentDistrict: "",
+  currentDistrictId: "",
+  currentProvince: "",
+  currentProvinceId: "",
+  registSame: false,
+};
+
 export type {
   DataOption,
   DataOptionInsignia,
@@ -149,4 +167,5 @@ export type {
   Education,
   Family,
   Address,
+  AddressDataDefualt,
 };

From 2149f2ae5e905d98a9c7b43b34e522cbe0a4d475 Mon Sep 17 00:00:00 2001
From: Thanit Konmek <thanit@frappet.com>
Date: Thu, 13 Jul 2023 09:46:15 +0700
Subject: [PATCH 2/2] =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=E0=B9=84?=
 =?UTF-8?q?=E0=B8=82=20step=E0=B8=A0=20=E0=B8=97=E0=B8=B5=E0=B9=88?=
 =?UTF-8?q?=E0=B8=AB=E0=B8=B2=E0=B8=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/OrderPlacement/step/step04.vue | 235 +++++++++++++-----
 1 file changed, 173 insertions(+), 62 deletions(-)

diff --git a/src/modules/05_placement/components/OrderPlacement/step/step04.vue b/src/modules/05_placement/components/OrderPlacement/step/step04.vue
index 7d9d21328..62502cd72 100644
--- a/src/modules/05_placement/components/OrderPlacement/step/step04.vue
+++ b/src/modules/05_placement/components/OrderPlacement/step/step04.vue
@@ -22,11 +22,15 @@
                 <q-menu>
                   <q-list style="min-width: 150px">
                     <q-item clickable v-close-popup>
-                      <q-item-section avatar><q-icon color="red" name="mdi-file-pdf" /></q-item-section>
+                      <q-item-section avatar
+                        ><q-icon color="red" name="mdi-file-pdf"
+                      /></q-item-section>
                       <q-item-section>ไฟล์ .PDF</q-item-section>
                     </q-item>
                     <q-item clickable v-close-popup>
-                      <q-item-section avatar><q-icon color="blue" name="mdi-file-word" /></q-item-section>
+                      <q-item-section avatar
+                        ><q-icon color="blue" name="mdi-file-word"
+                      /></q-item-section>
                       <q-item-section>ไฟล์ .docx</q-item-section>
                     </q-item>
                   </q-list>
@@ -47,82 +51,84 @@
                 <q-menu>
                   <q-list style="min-width: 150px">
                     <q-item clickable v-close-popup>
-                      <q-item-section avatar><q-icon color="red" name="mdi-file-pdf" /></q-item-section>
+                      <q-item-section avatar
+                        ><q-icon color="red" name="mdi-file-pdf"
+                      /></q-item-section>
                       <q-item-section>ไฟล์ .PDF</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 avatar
+                        ><q-icon color="green-7" name="mdi-file-excel"
+                      /></q-item-section>
                       <q-item-section>ไฟล์ .xls</q-item-section>
                     </q-item>
                   </q-list>
                 </q-menu>
               </q-btn>
             </div>
+            <q-space />
+            <q-btn
+              class="text-dark"
+              flat
+              dense
+              icon="mdi-fullscreen"
+              color="add"
+              @click="dialog = true"
+            />
           </div>
-          <q-separator style="margin-top: -1px; z-index: 1;" />
+          <q-separator style="margin-top: -1px; z-index: 1" />
           <q-card bordered class="card-pdf q-ma-md q-pa-md">
-              <div
-                class="justify-between items-center align-center q-pb-sm row"
+            <div class="justify-between items-center align-center q-pb-sm row">
+              <q-btn
+                class="text-dark bg-grey-4"
+                flat
+                dense
+                @click="page = page > 1 ? page - 1 : page"
               >
-                <q-btn
-                  class="text-dark bg-grey-4"
-                  flat
-                  dense
-                  @click="page = page > 1 ? page - 1 : page"
-                >
-                  <q-icon name="mdi-chevron-left" />
-                </q-btn>
+                <q-icon name="mdi-chevron-left" />
+              </q-btn>
 
-                <span class="body-2 grey--text">
-                  หน้าที่ {{ page }} จาก {{ numOfPages }}
-                </span>
+              <span class="body-2 grey--text">
+                หน้าที่ {{ page }} จาก {{ numOfPages }}
+              </span>
 
-                <q-btn
-                  class="text-dark bg-grey-4"
-                  flat
-                  dense
-                  @click="page = page < numOfPages ? page + 1 : page"
-                >
-                  <q-icon name="mdi-chevron-right" />
-                </q-btn>
-              </div>
-              <div class="pdfWidth">
-                <VuePDF ref="vuePDFRef" :pdf="pdfSrc" :page="page" fit-parent />
-                <!-- <VuePdf :key="page" :src="pdfSrc" :page="page" /> -->
-              </div>
-              <div
-                class="justify-between items-center align-center q-pt-sm row"
+              <q-btn
+                class="text-dark bg-grey-4"
+                flat
+                dense
+                @click="page = page < numOfPages ? page + 1 : page"
               >
-                <q-btn
-                  class="text-dark bg-grey-4"
-                  flat
-                  dense
-                  @click="page = page > 1 ? page - 1 : page"
-                >
-                  <q-icon name="mdi-chevron-left" />
-                </q-btn>
+                <q-icon name="mdi-chevron-right" />
+              </q-btn>
+            </div>
+            <div class="pdfWidth">
+              <VuePDF ref="vuePDFRef" :pdf="pdfSrc" :page="page" fit-parent />
+              <!-- <VuePdf :key="page" :src="pdfSrc" :page="page" /> -->
+            </div>
+            <div class="justify-between items-center align-center q-pt-sm row">
+              <q-btn
+                class="text-dark bg-grey-4"
+                flat
+                dense
+                @click="page = page > 1 ? page - 1 : page"
+              >
+                <q-icon name="mdi-chevron-left" />
+              </q-btn>
 
-                <span class="body-2 grey--text">
-                  หน้าที่ {{ page }} จาก {{ numOfPages }}
-                </span>
+              <span class="body-2 grey--text">
+                หน้าที่ {{ page }} จาก {{ numOfPages }}
+              </span>
 
-                <q-btn
-                  class="text-dark bg-grey-4"
-                  flat
-                  dense
-                  @click="page = page < numOfPages ? page + 1 : page"
-                >
-                  <q-icon name="mdi-chevron-right" />
-                </q-btn>
-              </div>
+              <q-btn
+                class="text-dark bg-grey-4"
+                flat
+                dense
+                @click="page = page < numOfPages ? page + 1 : page"
+              >
+                <q-icon name="mdi-chevron-right" />
+              </q-btn>
+            </div>
           </q-card>
-          <!-- <div class="card-pdf q-ma-md q-pa-md" v-if="tab == 'main'">
-            <pdf-viewer v-model:PDFV="vuePDFRef" />
-          </div> -->
-          <!-- <div class="card-pdf q-ma-md q-pa-md" v-else>
-            <pdf-viewer v-model:PDFV="vuePDFRef" />
-          </div> -->
-          <!-- <pdf-viewer /> -->
         </template>
 
         <template v-slot:separator>
@@ -275,6 +281,21 @@
                   </div>
                 </div>
               </fieldset>
+              <div class="flex justify-around">
+                <q-btn
+                  unelevated
+                  label="ออกคำสั่ง"
+                  :color="validateForm() ? 'public' : 'grey'"
+                  :disable="!validateForm()"
+                />
+                <q-btn
+                  class="text-dark"
+                  unelevated
+                  label="ส่งไปลงนาม"
+                  color="grey"
+                  disable
+                />
+              </div>
             </div>
           </q-form>
         </template>
@@ -302,9 +323,97 @@
       </q-btn>
 
       <!-- <q-btn flat round color="primary" icon="chevron_right" @click="next">
-        <q-tooltip>ต่อไป</q-tooltip>
-      </q-btn> -->
+          <q-tooltip>ต่อไป</q-tooltip>
+        </q-btn> -->
     </div>
+
+    <q-dialog
+      v-model="dialog"
+      persistent
+      :maximized="true"
+      transition-show="slide-up"
+      transition-hide="slide-down"
+    >
+      <q-card class="bg-white text-white">
+        <!-- <q-bar>
+            <q-space />
+  
+            <q-btn dense flat icon="close" v-close-popup>
+              <q-tooltip>ปิดหน้าต่าง</q-tooltip>
+            </q-btn>
+          </q-bar> -->
+
+        <div class="flex justify-end items-center align-center q-mr-md q-mt-sm">
+          <q-btn
+            icon="close"
+            unelevated
+            round
+            dense
+            style="color: #ff8080; background-color: #ffdede"
+            size="12px"
+            v-close-popup
+          />
+        </div>
+        <q-card-section bordered class="card-pdf q-ma-md q-pa-md">
+          <div class="justify-between items-center align-center q-pb-sm row">
+            <q-btn
+              class="text-dark bg-grey-4"
+              flat
+              dense
+              @click="page = page > 1 ? page - 1 : page"
+            >
+              <q-icon name="mdi-chevron-left" />
+            </q-btn>
+
+            <span class="body-2 grey--text text-black">
+              หน้าที่ {{ page }} จาก {{ numOfPages }}
+            </span>
+
+            <q-btn
+              class="text-dark bg-grey-4"
+              flat
+              dense
+              @click="page = page < numOfPages ? page + 1 : page"
+            >
+              <q-icon name="mdi-chevron-right" />
+            </q-btn>
+          </div>
+          <div class="pdfWidth">
+            <VuePDF
+              ref="vuePDFRef"
+              :pdf="pdfSrc"
+              :page="page"
+              fit-parent
+              :scale="0.1"
+            />
+            <!-- <VuePdf :key="page" :src="pdfSrc" :page="page" /> -->
+          </div>
+          <div class="justify-between items-center align-center q-pt-sm row">
+            <q-btn
+              class="text-dark bg-grey-4"
+              flat
+              dense
+              @click="page = page > 1 ? page - 1 : page"
+            >
+              <q-icon name="mdi-chevron-left" />
+            </q-btn>
+
+            <span class="body-2 grey--text text-black">
+              หน้าที่ {{ page }} จาก {{ numOfPages }}
+            </span>
+
+            <q-btn
+              class="text-dark bg-grey-4"
+              flat
+              dense
+              @click="page = page < numOfPages ? page + 1 : page"
+            >
+              <q-icon name="mdi-chevron-right" />
+            </q-btn>
+          </div>
+        </q-card-section>
+      </q-card>
+    </q-dialog>
   </div>
 </template>
 <script setup lang="ts">
@@ -317,6 +426,8 @@ import { useCounterMixin } from "@/stores/mixin";
 const mixin = useCounterMixin();
 const { date2Thai } = mixin;
 
+const dialog = ref<boolean>(false);
+
 // onUnmounted(() => {
 //   window.removeEventListener("resize", (e: any) => {
 //     myEventHandler(e);