no

src/modules/14_KPI/components/Tab/Topic/03_Develop.vue

@@ -38,6 +38,15 @@ const formData = reactive({
   isDevelopment10: false,
 });
 const columns = ref<QTableProps["columns"]>([
+  {
+    name: "no",
+    align: "center",
+    label: "ลำดับ",
+    sortable: false,
+    field: "no",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
   {
     name: "name",
     align: "left",
@@ -97,8 +106,8 @@ const columns = ref<QTableProps["columns"]>([
 
 const visibleColumns = ref<string[]>(
   store.tabOpen === 3 && store.tabMain === "3"
-    ? ["name", "develop", "target", "achievement", "summary"]
-    : ["name", "develop", "target"]
+  ? ['no',"name", "develop", "target", "achievement", "summary"]
+  : ['no',"name", "develop", "target"]
 );
 
 function onAdd() {
@@ -255,7 +264,9 @@ onMounted(() => {
               <div v-if="col.name == 'createDate'">
                 {{ col.value ? date2Thai(col.value) : "-" }}
               </div>
-
+              <div v-else-if="col.name == 'no'" class="text-center">
+                {{ props.rowIndex + 1 }}
+              </div>
               <div v-else-if="col.name == 'develop'">
                 <div class="column">
                   <q-checkbox