Merge branch 'develop' of github.com:Frappet/bma-ehr-frontend into me

# Conflicts:
#	src/modules/05_placement/components/OrderPlacement/step/step03.vue

src/modules/05_placement/components/OrderPlacement/MainOrderPlacement.vue

@@ -1,10 +1,11 @@
 <template>
   <div class="toptitle text-dark col-12 row items-center">ออกคำสั่ง</div>
   <div>
-    <q-card flat bordered class="col-12 q-mt-sm">
-      <div class="row q-pa-md">
-        <div class="col-xs-12 col-sm-3 col-md-2">
+    <q-card flat bordered class="col-12 q-mt-sm q-pa-md">
+      <div class="row q-col-gutter-md">
+        <div class="row col-12 q-col-gutter-sm">
           <q-select
+            class="col-xs-12 col-sm-3 col-md-2"
             v-model="fiscalyear"
             label="ปีงบประมาณ"
             dense
@@ -21,26 +22,27 @@
             :hide-dropdown-icon="false"
             @update:model-value="searchfiscalyear"
           />
-        </div>
-        <div class="col-xs-12 col-sm-3 col-md-6">
-          <q-btn size="12px" flat round color="add" icon="mdi-plus">
-            <q-tooltip>เพิ่มข้อมูล</q-tooltip>
-            <q-menu>
-              <q-list style="min-width: 100px">
-                <q-item clickable v-close-popup disable>
-                  <q-item-section
-                    >ลายเซ็นอิเล็กทรอนิกส์ (ออนไลน์)</q-item-section
-                  >
-                </q-item>
-                <q-item clickable @click="clickAdd">
-                  <q-item-section>ลายเซ็นชื่อ (ออฟไลน์)</q-item-section>
-                </q-item>
-              </q-list>
-            </q-menu>
-          </q-btn>
-        </div>
-        <div class="col-xs-12 col-sm-3 col-md-2">
+          <div>
+            <q-btn size="12px" flat round color="add" icon="mdi-plus">
+              <q-tooltip>เพิ่มข้อมูล</q-tooltip>
+              <q-menu>
+                <q-list style="min-width: 100px">
+                  <q-item clickable v-close-popup disable>
+                    <q-item-section
+                      >ลายเซ็นอิเล็กทรอนิกส์ (ออนไลน์)</q-item-section
+                    >
+                  </q-item>
+                  <q-item clickable @click="clickAdd">
+                    <q-item-section>ลายเซ็นชื่อ (ออฟไลน์)</q-item-section>
+                  </q-item>
+                </q-list>
+              </q-menu>
+            </q-btn>
+          </div>
+          <q-space/>
+        
           <q-input
+            class="col-xs-12 col-sm-3 col-md-2"
             standout
             dense
             v-model="filterKeyword"
@@ -48,7 +50,6 @@
             outlined
             debounce="300"
             placeholder="ค้นหา"
-            class="q-ml-sm"
           >
             <template v-slot:append>
               <q-icon v-if="filterKeyword == ''" name="search" />
@@ -60,8 +61,7 @@
               />
             </template>
           </q-input>
-        </div>
-        <div class="col-xs-12 col-sm-3 col-md-2">
+        
           <q-select
             v-model="visibleColumns"
             multiple
@@ -75,15 +75,14 @@
             option-value="name"
             options-cover
             style="min-width: 150px"
-            class="gt-xs q-ml-sm"
+            class="col-xs-12 col-sm-3 col-md-2"
           />
         </div>
-      </div>
-      <div class="q-pt-sm q-pl-md q-pr-md q-pb-md">
-        <q-card bordered class="col-12 filter-card">
-          <div class="row q-pa-sm">
-            <div class="col-xs-12 col-sm-3 col-md- q-pl-sm">
+        <div class="col-12">
+          <q-card bordered class="col-12 filter-card q-pa-sm">
+            <div class="row col-12 q-col-gutter-sm">
               <q-select
+                class="col-xs-12 col-sm-3 col-md-2"
                 v-model="OrderType"
                 label="ประเภท"
                 dense
@@ -100,9 +99,8 @@
                 :hide-dropdown-icon="false"
                 @update:model-value="searchFilterTable"
               />
-            </div>
-            <div class="col-xs-12 col-sm-3 col-md- q-pl-sm">
               <q-select
+                class="col-xs-12 col-sm-3 col-md-2"
                 v-model="OrderStatus"
                 label="สถานะ"
                 dense
@@ -120,117 +118,118 @@
                 @update:model-value="searchFilterTable"
               />
             </div>
-          </div>
         </q-card>
-      </div>
-      <div class="q-pt-sm q-pl-md q-pr-md q-pb-md">
-        <q-table
-          ref="table"
-          :columns="columns"
-          :rows="UpdataData"
-          :filter="filterKeyword"
-          row-key="Order"
-          flat
-          bordered
-          :paging="true"
-          dense
-          class="custom-header-table"
-          v-bind="attrs"
-          :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">
-                <span class="text-weight-medium">{{ col.label }}</span>
-              </q-th>
-              <q-th auto-width />
-            </q-tr>
-          </template>
-          <template v-slot:body="props">
-            <q-tr :props="props" class="cursor-pointer">
-              <q-td
-                key="Order"
-                :props="props"
-                @click="redirectToPage(props.row.Order)"
-              >
-                {{ props.row.Order }}
-              </q-td>
-              <q-td
-                key="OrderNum"
-                :props="props"
-                @click="redirectToPage(props.row.Order)"
-              >
-                {{ props.row.OrderNum }}
-              </q-td>
-              <q-td
-                key="OrderDate"
-                :props="props"
-                @click="redirectToPage(props.row.Order)"
-              >
-                {{ props.row.OrderDate }}
-              </q-td>
-              <q-td
-                key="OrderBy"
-                :props="props"
-                @click="redirectToPage(props.row.Order)"
-              >
-                {{ props.row.OrderBy }}
-              </q-td>
-              <q-td
-                key="Signer"
-                :props="props"
-                @click="redirectToPage(props.row.Order)"
-              >
-                {{ props.row.Signer }}
-              </q-td>
-              <q-td
-                key="OrderStatus"
-                :props="props"
-                @click="redirectToPage(props.row.Order)"
-              >
-                <q-icon
-                  v-if="props.row.OrderStatus == 'ยังไม่ได้ออกคำสั่ง'"
-                  name="hourglass_top"
-                  color="orange"
-                  class="text-h5"
-                />
-                <q-icon
-                  v-if="props.row.OrderStatus == 'ออกคำสั่งแล้ว'"
-                  name="mdi-check"
-                  color="positive"
-                  class="text-h5"
-                />
-              </q-td>
-
-              <q-td auto-width>
-                <q-btn
-                  dense
-                  size="12px"
-                  flat
-                  round
-                  color="red"
-                  @click="clickDelete(props.row.id)"
-                  icon="mdi-delete"
+        </div>
+        <div class="col-12">
+          <q-table
+            ref="table"
+            :columns="columns"
+            :rows="UpdataData"
+            :filter="filterKeyword"
+            row-key="Order"
+            flat
+            bordered
+            :paging="true"
+            dense
+            class="custom-header-table"
+            v-bind="attrs"
+            :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">
+                  <span class="text-weight-medium">{{ col.label }}</span>
+                </q-th>
+                <q-th auto-width />
+              </q-tr>
+            </template>
+            <template v-slot:body="props">
+              <q-tr :props="props" class="cursor-pointer">
+                <q-td
+                  key="Order"
+                  :props="props"
+                  @click="redirectToPage(props.row.Order)"
                 >
-                  <q-tooltip>ลบข้อมูล</q-tooltip>
-                </q-btn>
-              </q-td>
-            </q-tr>
-          </template>
-          <template v-slot:pagination="scope">
-            <q-pagination
-              v-model="pagination.page"
-              color="primary"
-              :max="scope.pagesNumber"
-              :max-pages="5"
-              size="sm"
-              boundary-links
-              direction-links
-            ></q-pagination>
-          </template>
-        </q-table>
+                  {{ props.row.Order }}
+                </q-td>
+                <q-td
+                  key="OrderNum"
+                  :props="props"
+                  @click="redirectToPage(props.row.Order)"
+                >
+                  {{ props.row.OrderNum }}
+                </q-td>
+                <q-td
+                  key="OrderDate"
+                  :props="props"
+                  @click="redirectToPage(props.row.Order)"
+                >
+                  {{ props.row.OrderDate }}
+                </q-td>
+                <q-td
+                  key="OrderBy"
+                  :props="props"
+                  @click="redirectToPage(props.row.Order)"
+                >
+                  {{ props.row.OrderBy }}
+                </q-td>
+                <q-td
+                  key="Signer"
+                  :props="props"
+                  @click="redirectToPage(props.row.Order)"
+                >
+                  {{ props.row.Signer }}
+                </q-td>
+                <q-td
+                  key="OrderStatus"
+                  :props="props"
+                  @click="redirectToPage(props.row.Order)"
+                >
+                  <q-icon
+                    v-if="props.row.OrderStatus == 'ยังไม่ได้ออกคำสั่ง'"
+                    name="mdi-timer-sand"
+                    color="orange"
+                    size="20px"
+                  />
+                  <q-icon
+                    v-if="props.row.OrderStatus == 'ออกคำสั่งแล้ว'"
+                    name="mdi-check"
+                    color="positive"
+                    size="20px"
+                  />
+                </q-td>
+
+                <q-td auto-width>
+                  <q-btn
+                    dense
+                    size="12px"
+                    flat
+                    round
+                    color="red"
+                    @click="clickDelete(props.row.id)"
+                    icon="mdi-delete"
+                  >
+                    <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="dark"
+                :max="scope.pagesNumber"
+                :max-pages="5"
+                size="sm"
+                boundary-links
+                direction-links
+              ></q-pagination>
+            </template>
+          </q-table>
+        </div>
       </div>
     </q-card>
   </div>
@@ -329,7 +328,7 @@ const columns = ref<QTableProps["columns"]>([
   },
   {
     name: "OrderStatus",
-    align: "left",
+    align: "center",
     label: "สถานะคำสั่ง",
     sortable: false,
     field: "OrderStatus",
@@ -703,7 +702,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
 
 <style lang="scss" scope>
 .filter-card {
-  background-color: #ededed;
+  background-color: #f1f1f1b0;
 }
 
 .toggle-expired-account {

src/modules/05_placement/components/OrderPlacement/detailOrderPlacement.vue

@@ -18,6 +18,7 @@
       ref="stepper"
       color="primary"
       animated
+      class="step"
       header-class="bg-grey-1"
     >
       <q-step
@@ -96,4 +97,11 @@ const previousStep = () => {
 .q-stepper--horizontal .q-stepper__step-inner {
   padding: 0px;
 }
+.step .q-stepper__tab--done .q-stepper__title,.step .q-stepper__tab--active .q-stepper__title{
+  color: #35473C !important;
+  font-weight: 500 ;
+}
+.step .q-stepper__header--standard-labels .q-stepper__tab{
+  min-height: 60px;
+}
 </style>

src/modules/05_placement/components/OrderPlacement/step/step01.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <div class="q-pa-md" style="min-height: 70vh; overflow-y: scroll">
+    <div class="q-pa-md" style="max-height: 68vh; overflow-y: scroll">
       <q-form ref="myForm">
         <div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md">
           <div class="col-xs-12 col-md-6">
@@ -369,15 +369,14 @@
       </q-form>
     </div>
     <q-separator />
-    <div class="flex justify-end q-px-md q-gutter-sm">
+    <div class="flex justify-end q-pa-sm q-gutter-sm">
       <q-btn
-        flat
-        round
+        unelevated
+        label="บันทึก"
         color="public"
-        icon="mdi-content-save-outline"
         @click="next"
-      >
-        <q-tooltip>บันทึก</q-tooltip>
+      ><!-- icon="mdi-content-save-outline"
+        <q-tooltip>บันทึก</q-tooltip> -->
       </q-btn>
       <!-- <q-btn flat round color="primary" icon="chevron_left" @click="previous">
         <q-tooltip>ย้อนกลับ</q-tooltip>

src/modules/05_placement/components/OrderPlacement/step/step02.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
-    <div class="q-pa-md" style="min-height: 70vh; overflow-y: scroll">
-      <div class="col-12 row q-py-sm items-center">
+    <div class="q-pa-sm" style="max-height: 68vh; overflow-y: scroll">
+      <div class="col-12 row q-pb-sm items-center">
         <q-btn flat round color="primary" @click="refresh" icon="mdi-refresh">
           <q-tooltip>อัปเดตข้อมูล</q-tooltip>
         </q-btn>
@@ -144,22 +144,29 @@
       </q-table>
     </div>
     <q-separator />
-    <div class="flex justify-end q-px-md q-gutter-sm">
+    <div class="flex justify-end q-pa-sm q-gutter-sm">
+      <q-btn 
+        dense 
+        outline 
+        color="primary" 
+        icon="chevron_left" 
+        @click="previous" 
+        class="q-pr-md"
+        label="กรอกรายละเอียด">
+      </q-btn>
       <q-btn
-        flat
-        round
+        dense
+        unelevated
+        label="บันทึก"
         color="public"
-        icon="mdi-content-save-outline"
         @click="next"
-      >
-        <q-tooltip>บันทึก</q-tooltip>
+        class="q-px-md"
+      ><!-- icon="mdi-content-save-outline"
+        <q-tooltip>บันทึก</q-tooltip> -->
       </q-btn>
-      <q-btn flat round color="primary" icon="chevron_left" @click="previous">
-        <q-tooltip>ย้อนกลับ</q-tooltip>
-      </q-btn>
-      <q-btn flat round color="primary" icon="chevron_right" @click="next">
+      <!-- <q-btn dense flat round color="primary" icon="chevron_right" @click="next">
         <q-tooltip>ต่อไป</q-tooltip>
-      </q-btn>
+      </q-btn> -->
     </div>
   </div>
 </template>
@@ -321,7 +328,6 @@ const getClass = (val: boolean) => {
   color: #4154b3;
 }
 .custom-header-table {
-  max-height: 64vh;
   .q-table tr:nth-child(odd) td {
     background: white;
   }

src/modules/05_placement/components/OrderPlacement/step/step03.vue

@@ -141,22 +141,30 @@
       </q-table>
     </div>
     <q-separator />
-    <div class="flex justify-end q-px-md q-gutter-sm">
+    <div class="flex justify-end q-pa-sm q-gutter-sm">
       <q-btn
-        flat
-        round
-        color="public"
-        icon="mdi-content-save-outline"
-        @click="next"
+        dense
+        outline
+        color="primary"
+        icon="chevron_left"
+        @click="previous"
+        class="q-pr-md"
+        label="เลือกรายชื่อ"
       >
-        <q-tooltip>บันทึก</q-tooltip>
       </q-btn>
-      <q-btn flat round color="primary" icon="chevron_left" @click="previous">
-        <q-tooltip>ย้อนกลับ</q-tooltip>
+      <q-btn
+        dense
+        unelevated
+        label="บันทึก"
+        color="public"
+        @click="next"
+        class="q-px-md"
+        ><!-- icon="mdi-content-save-outline"
+        <q-tooltip>บันทึก</q-tooltip> -->
       </q-btn>
-      <q-btn flat round color="primary" icon="chevron_right" @click="next">
+      <!-- <q-btn flat round color="primary" icon="chevron_right" @click="next">
         <q-tooltip>ต่อไป</q-tooltip>
-      </q-btn>
+      </q-btn> -->
     </div>
   </div>
 

src/modules/05_placement/components/OrderPlacement/step/step04.vue

@@ -96,19 +96,25 @@
       </q-splitter>
     </div>
     <q-separator />
-    <div class="flex justify-end q-px-md q-gutter-sm">
+    <div class="flex justify-end q-pa-sm q-gutter-sm">
+      <q-btn 
+        dense 
+        outline 
+        color="primary" 
+        icon="chevron_left" 
+        @click="previous" 
+        class="q-pr-md"
+        label="เลือกรายชื่อส่งสำเนา">
+      </q-btn>
       <q-btn
-        flat
-        round
+        unelevated
+        label="บันทึก"
         color="public"
-        icon="mdi-content-save-outline"
         @click="next"
-      >
-        <q-tooltip>บันทึก</q-tooltip>
-      </q-btn>
-      <q-btn flat round color="primary" icon="chevron_left" @click="previous">
-        <q-tooltip>ย้อนกลับ</q-tooltip>
+      > <!-- icon="mdi-content-save-outline"
+        <q-tooltip>บันทึก</q-tooltip> -->
       </q-btn>
+     
       <!-- <q-btn flat round color="primary" icon="chevron_right" @click="next">
         <q-tooltip>ต่อไป</q-tooltip>
       </q-btn> -->