รายการการประเมินผลการปฏิบัติราชการระดับบุคคล => ปรับ UI

src/modules/03_retire/views/DialogRetire.vue

@@ -20,7 +20,7 @@ const props = defineProps({
   fectData: { type: Function, require: true },
 });
 
-const id = ref<string>(route.params.id.toString());
+const id = ref<string>(route.params.id ? route.params.id.toString() : "");
 
 const mixin = useCounterMixin();
 const { dialogConfirm, messageError, showLoader, hideLoader, success } = mixin;

src/modules/03_retire/views/addRetire.vue

@@ -186,7 +186,12 @@ function downloadFile(data: string) {
             <div class="col-xs-12 col-sm-12">
               <div class="col-12 row q-pa-sm q-col-gutter-sm">
                 <q-input
-                  class="col-md-8 col-xs-12"
+                  :class="
+                    routeName !== 'AddRetire'
+                      ? 'col-md-8 col-xs-12'
+                      : 'col-md-8 col-xs-12 inputgreen'
+                  "
+                  class=""
                   dense
                   outlined
                   v-model="tranferOrg"
@@ -196,7 +201,11 @@ function downloadFile(data: string) {
                   :rules="[(val:string) => !!val || `${'กรุณากรอกสถานที่ยื่นขอลาออกจากราชการ'}`]"
                 />
                 <datepicker
-                  class="col-md-2 col-xs-12"
+                  :class="
+                    routeName !== 'AddRetire'
+                      ? 'col-md-2 col-xs-12'
+                      : 'col-md-2 col-xs-12 inputgreen'
+                  "
                   menu-class-name="modalfix"
                   v-model="dateCommand"
                   :locale="'th'"
@@ -240,7 +249,11 @@ function downloadFile(data: string) {
                   </template>
                 </datepicker>
                 <datepicker
-                  class="col-md-2 col-xs-12"
+                  :class="
+                    routeName !== 'AddRetire'
+                      ? 'col-md-2 col-xs-12'
+                      : 'col-md-2 col-xs-12 inputgreen'
+                  "
                   menu-class-name="modalfix"
                   v-model="dateLeave"
                   :locale="'th'"
@@ -284,7 +297,9 @@ function downloadFile(data: string) {
                   </template>
                 </datepicker>
                 <q-input
-                  class="col-12"
+                  :class="
+                    routeName !== 'AddRetire' ? 'col-12' : 'col-12 inputgreen'
+                  "
                   dense
                   outlined
                   v-model="noteReason"
@@ -300,7 +315,7 @@ function downloadFile(data: string) {
                 <div class="col-12 row" v-if="routeName == 'AddRetire'">
                   <q-file
                     v-model="files"
-                    class="col-xs-12 col-sm-12"
+                    class="col-xs-12 col-sm-12 inputgreen"
                     outlined
                     dense
                     lazy-rules

src/modules/03_retire/views/main.vue

@@ -256,7 +256,7 @@ const clickBack = () => {
                     <div v-if="col.name == 'no'">
                       {{ props.rowIndex + 1 }}
                     </div>
-                    <div>
+                    <div v-else>
                       {{ col.value }}
                     </div>
                   </q-td>