From 7cbbc58218873bd0ecbd8f2333b270d7db5796e9 Mon Sep 17 00:00:00 2001
From: "STW_TTTY\\stwtt" <trx.setthawut@gmail.com>
Date: Wed, 26 Jun 2024 10:56:44 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=20UI?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Dialogs/DialogOrgSelect.vue    |  12 +-
 .../components/4_ChangeRound/DialogForm.vue   | 163 +++++++++---------
 2 files changed, 95 insertions(+), 80 deletions(-)

diff --git a/src/components/Dialogs/DialogOrgSelect.vue b/src/components/Dialogs/DialogOrgSelect.vue
index 8dd2e2eff..e6b7280be 100644
--- a/src/components/Dialogs/DialogOrgSelect.vue
+++ b/src/components/Dialogs/DialogOrgSelect.vue
@@ -586,7 +586,7 @@ function onSubmit() {
                   :key="index"
                   :name="item"
                 >
-                  <div class="column q-col-gutter-sm" style="height: 70vh">
+                  <div class="column q-col-gutter-sm" >
                     <!-- เลือกเลขที่ตำแหน่ง -->
                     <div class="col-7">
                       <q-card
@@ -731,7 +731,7 @@ function onSubmit() {
                     <div class="col-5">
                       <q-card
                         bordered
-                        style="height: 100%; border: 1px solid #d6dee1"
+                        style="min-height: 30vh; border: 1px solid #d6dee1"
                       >
                         <div
                           class="col-12 text-weight-medium bg-grey-1 q-py-sm q-px-md"
@@ -858,6 +858,14 @@ function onSubmit() {
                                             : col.value
                                         }}
                                       </div>
+                                      <div
+                                        v-else-if="col.name === 'positionArea'"
+                                         class="table_ellipsis"
+                                      >
+                                        {{
+                                          props.row.positionArea ? props.row.positionArea:'-'
+                                        }}
+                                      </div>
 
                                       <div v-else>
                                         {{ col.value ? col.value : "-" }}
diff --git a/src/modules/09_leave/components/4_ChangeRound/DialogForm.vue b/src/modules/09_leave/components/4_ChangeRound/DialogForm.vue
index 01dec13b6..7b34eb8f4 100644
--- a/src/modules/09_leave/components/4_ChangeRound/DialogForm.vue
+++ b/src/modules/09_leave/components/4_ChangeRound/DialogForm.vue
@@ -243,86 +243,93 @@ watch(
                   props.DataRow ? `${props.DataRow.currentRound} น.` : ""
                 }}</span>
               </div>
-              <div class="row q-mt-sm justify-between">
-                <q-select
-                  v-model="formData.round"
-                  label="รอบที่ต้องการเปลี่ยน"
-                  dense
-                  ref="roundRef"
-                  :rules="[(val) => !!val || 'กรุณาเลือกรอบที่ต้องการเปลี่ยน']"
-                  emit-value
-                  map-options
-                  option-label="name"
-                  :options="roundOp"
-                  option-value="id"
-                  lazy-rules
-                  hide-bottom-space
-                  :borderless="true"
-                  outlined
-                  style="width: 23.5rem"
-                />
+              <div class="row q-mt-sm q-col-gutter-sm">
+                <div class="col-6">
+                  <q-select
+                    v-model="formData.round"
+                    label="รอบที่ต้องการเปลี่ยน"
+                    dense
+                    ref="roundRef"
+                    :rules="[
+                      (val) => !!val || 'กรุณาเลือกรอบที่ต้องการเปลี่ยน',
+                    ]"
+                    emit-value
+                    map-options
+                    option-label="name"
+                    :options="roundOp"
+                    option-value="id"
+                    lazy-rules
+                    hide-bottom-space
+                    :borderless="true"
+                    outlined
+                    style="width: 23.5rem"
+                  />
+                </div>
+                <div class="col-6">
+                  <datepicker
+                    menu-class-name="modalfix"
+                    v-model="formData.effectiveDate"
+                    :locale="'th'"
+                    autoApply
+                    borderless
+                    :enableTimePicker="false"
+                    week-start="0"
+                    :min-date="
+                      dataToday
+                        ? new Date(dataToday.getTime() + 24 * 60 * 60 * 1000)
+                        : null
+                    "
+                  >
+                    <template #year="{ year }">
+                      {{ year + 543 }}
+                    </template>
+                    <template #year-overlay-value="{ value }">
+                      {{ parseInt(value + 543) }}
+                    </template>
+                    <template #trigger>
+                      <q-input
+                        for="inputDatereceive"
+                        outlined
+                        hide-bottom-space
+                        ref="effectiveDateRef"
+                        dense
+                        class="datepicker"
+                        :model-value="
+                          formData.effectiveDate != null
+                            ? date2Thai(formData.effectiveDate)
+                            : null
+                        "
+                        label="วันที่ให้มีผล"
+                        :rules="[
+                          (val) => !!val || `${'กรุณาเลือกวันที่ให้มีผล'}`,
+                        ]"
+                      >
+                        <template v-slot:prepend>
+                          <q-icon
+                            name="event"
+                            class="cursor-pointer"
+                            style="color: var(--q-primary)"
+                          >
+                          </q-icon>
+                        </template>
+                      </q-input>
+                    </template>
+                  </datepicker>
+                </div>
 
-                <datepicker
-                  menu-class-name="modalfix"
-                  v-model="formData.effectiveDate"
-                  :locale="'th'"
-                  autoApply
-                  borderless
-                  :enableTimePicker="false"
-                  week-start="0"
-                  :min-date="
-                    dataToday
-                      ? new Date(dataToday.getTime() + 24 * 60 * 60 * 1000)
-                      : null
-                  "
-                >
-                  <template #year="{ year }">
-                    {{ year + 543 }}
-                  </template>
-                  <template #year-overlay-value="{ value }">
-                    {{ parseInt(value + 543) }}
-                  </template>
-                  <template #trigger>
-                    <q-input
-                      for="inputDatereceive"
-                      outlined
-                      ref="effectiveDateRef"
-                      dense
-                      style="width: 23.5rem"
-                      class="datepicker"
-                      :model-value="
-                        formData.effectiveDate != null
-                          ? date2Thai(formData.effectiveDate)
-                          : null
-                      "
-                      label="วันที่ให้มีผล"
-                      :rules="[
-                        (val) => !!val || `${'กรุณาเลือกวันที่ให้มีผล'}`,
-                      ]"
-                    >
-                      <template v-slot:prepend>
-                        <q-icon
-                          name="event"
-                          class="cursor-pointer"
-                          style="color: var(--q-primary)"
-                        >
-                        </q-icon>
-                      </template>
-                    </q-input>
-                  </template>
-                </datepicker>
+                <div class="col-12">
+                  <q-input
+                    outlined
+                    stack-label
+                    ref="resonRef"
+                    v-model="formData.reson"
+                    label="เหตุผล"
+                    hide-bottom-space
+                    type="textarea"
+                    :rules="[(val) => !!val || `กรุณากรอกเหตุผล`]"
+                  ></q-input>
+                </div>
               </div>
-              <q-input
-                class="col-12 bg-white"
-                outlined
-                stack-label
-                ref="resonRef"
-                v-model="formData.reson"
-                label="เหตุผล"
-                hide-bottom-space
-                type="textarea"
-                :rules="[(val) => !!val || `กรุณากรอกเหตุผล`]"
-              ></q-input>
             </div>
           </q-card-section>
         </div>