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

src/modules/08_KPI/components/Tab/TabMain.vue

@@ -35,22 +35,14 @@ const splitterModel = ref<number>(12);
 </script>
 
 <template>
-  <q-splitter v-model="splitterModel" disable>
+  <q-splitter v-model="splitterModel" :horizontal="!$q.screen.gt.xs" disable>
     <template v-slot:before>
       <q-tabs
         v-model="store.tabMain"
-        vertical
+        :vertical="$q.screen.gt.xs"
         class="text-grey-7 text-weight-light"
         active-class="bg-blue-1 text-blue-8 text-weight-bold"
       >
-        <!-- <q-tab
-          class="hover-tab"
-          v-for="(tab, index) in itemsTab"
-          :key="index"
-          :name="tab.name"
-          :icon="tab.icon"
-          :label="tab.label"
-        /> -->
         <q-tab name="1" label="จัดทำข้อตกลง" />
         <q-tab
           name="2"
@@ -62,12 +54,6 @@ const splitterModel = ref<number>(12);
           label="รายงานผลสำเร็จของงาน"
           :disable="store.tabOpen < 3"
         />
-        <!-- <q-tab name="3" label="ผู้บังคับบัญชา">
-          <div class="text-caption">เหนือขึ้นไป</div>
-        </q-tab>
-        <q-tab name="4" label="ผู้บังคับบัญชา">
-          <div class="text-caption">เหนือขึ้นไปอีกชั้นหนึ่ง</div>
-        </q-tab> -->
         <q-tab name="5" label="ไฟล์เอกสาร" />
       </q-tabs>
     </template>