ปรับ ui ระบบ KPI

src/modules/08_KPI/views/TabMain.vue

@@ -28,20 +28,28 @@ const itemsTab = ref<any>([
   },
 ]);
 
-const splitterModel = ref<number>(15);
+const splitterModel = ref<number>(12);
 </script>
 <template>
   <q-splitter v-model="splitterModel" disable>
     <template v-slot:before>
-      <q-tabs v-model="store.tabMain" vertical class="text-blue">
-        <q-tab
+      <q-tabs v-model="store.tabMain" vertical 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" label="ผู้บังคับบัญชา">
+         <div class="text-caption">เหนือขึ้นไป</div>
+        </q-tab>
+        <q-tab name="3" label="ผู้บังคับบัญชา">
+          <div class="text-caption">เหนือขึ้นไปอีกหนึ่งขั้น</div>
+        </q-tab>
+        <q-tab name="4" label="ไฟล์เอกสาร" />
       </q-tabs>
     </template>
 
@@ -53,12 +61,12 @@ const splitterModel = ref<number>(15);
         vertical
         transition-prev="jump-up"
         transition-next="jump-up"
-        class="q-px-md"
       >
         <q-tab-panel
           v-for="(tab, index) in itemsTab"
           :key="index"
           :name="tab.name"
+          class="q-pa-none"
         >
           <Assessment v-if="store.tabMain === '1'" />
           <CommanderAbove v-if="store.tabMain === '2'" />