แก้แสดง ลำดับ วินัย

src/modules/11_discipline/components/4_Result/MainPage.vue

@@ -23,7 +23,7 @@ const initialPagination = ref<Pagination>({
 });
 
 const page = ref<number>(1);
-const pageSize = ref<number>(5);
+const pageSize = ref<number>(10);
 const maxPage = ref<number>(1);
 const filter = ref<string>("");
 
@@ -95,24 +95,9 @@ onMounted(async () => {
         :pageSize="pageSize"
         :maxPage="maxPage"
         @update:queryString="updateQueryString"
+        v-model:open-edit="openEdit"
       >
-        <template #columns="props">
-          <q-tr :props="props" class="cursor-pointer">
-            <q-td
-              v-for="col in props.cols"
-              :key="col.name"
-              :props="props"
-              @click="openEdit(props.row.id)"
-            >
-              <div v-if="col.name == 'no'">
-                {{ props.rowIndex + 1 }}
-              </div>
-              <div v-else>
-                {{ col.value }}
-              </div>
-            </q-td>
-          </q-tr>
-        </template>
+
       </Table>
     </div>
   </q-card>

src/modules/11_discipline/components/4_Result/Table.vue

@@ -21,6 +21,10 @@ const props = defineProps({
     type: Function,
     default: () => console.log("not function"),
   },
+  openEdit: {
+    type: Function,
+    default: () => console.log("not function"),
+  },
   nornmalData: {
     type: Boolean,
     defualt: true,
@@ -156,6 +160,7 @@ watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
     :rows-per-page-options="[10, 25, 50, 100]"
     :pagination="pagination"
     @update:pagination="updateRowsPerPage"
+
   >
     <template v-slot:header="props">
       <q-tr :props="props">
@@ -164,8 +169,26 @@ watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
         </q-th>
       </q-tr>
     </template>
-    <template #body="props">
-      <slot v-bind="props" name="columns"></slot>
+    <template v-slot:body="props">
+      <q-tr :props="props" class="cursor-pointer">
+        <q-td
+          v-for="col in props.cols"
+          :key="col.name"
+          :props="props"
+          @click="openEdit(props.row.id)"
+        >
+          <div v-if="col.name == 'no'">
+            {{
+              (currentPage - 1) * Number(pagination.rowsPerPage) +
+              props.rowIndex +
+              1
+            }}
+          </div>
+          <div v-else>
+            {{ col.value }}
+          </div>
+        </q-td>
+      </q-tr>
     </template>
     <template v-slot:pagination="scope">
       <q-pagination
@@ -178,6 +201,7 @@ watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
         direction-links
       ></q-pagination>
     </template>
+    
   </d-table>
 </template>