Update index.vue

src/pages/bai-viet/index.vue

@@ -42,7 +42,12 @@
         row-key="postName"
         separator="cell"
         :no-data-label="$t('emptyData')"
+        :rows-per-page-label="$t('recordPerPage')"
+        :pagination="{
+          rowsPerPage: 0,
+        }"
         hide-pagination
+        wrap-cells
         class="sticky-header-table"
       >
         <template v-slot:body-cell-stt="item">
@@ -79,11 +84,9 @@
           </q-td>
         </template>
         <template v-slot:body-cell-image="image">
-          <q-td style="padding: auto; height: 100%" class="flex flex-center">
+          <q-td style="padding: auto; height: 100%; text-align: center">
             <q-img
-              style="width: 9rem"
-              fit="contain"
-              :ratio="16 / 9"
+              style="width: 12rem; height: 8rem"
               :src="configImg.API_IMAGE_ENDPOINT + image.row.image"
             ></q-img>
           </q-td>
@@ -197,7 +200,7 @@ export default defineComponent({
         field: 'name',
         required: true,
         label: i18n.global.t('post.tableColumnsPost.name'),
-        headerStyle: 'text-align: center !important;',
+        headerStyle: 'text-align: center !important; width: 30%;',
         align: 'left',
         sortable: false,
       },
@@ -206,7 +209,7 @@ export default defineComponent({
         field: 'image',
         required: true,
         label: i18n.global.t('post.tableColumnsPost.image'),
-        headerStyle: 'text-align: center !important;',
+        headerStyle: 'text-align: center !important; width: 20%;',
         align: 'center',
         sortable: false,
       },
@@ -215,52 +218,52 @@ export default defineComponent({
         field: 'category',
         required: true,
         label: i18n.global.t('post.tableColumnsPost.category'),
-        headerStyle: 'text-align: center !important;',
-        align: 'left',
-        sortable: false,
-      },
-      {
-        name: 'createBy',
-        field: 'createBy',
-        required: true,
-        label: i18n.global.t('post.tableColumnsPost.createBy'),
-        headerStyle: 'text-align: center !important;',
-        align: 'left',
-        sortable: false,
-      },
-      {
-        name: 'createTime',
-        field: 'createTime',
-        required: true,
-        label: i18n.global.t('post.tableColumnsPost.createTime'),
-        headerStyle: 'text-align: center !important;',
-        align: 'left',
-        sortable: false,
-      },
-      {
-        name: 'updateBy',
-        field: 'updateBy',
-        required: true,
-        label: i18n.global.t('post.tableColumnsPost.updateBy'),
-        headerStyle: 'text-align: center !important;',
-        align: 'left',
-        sortable: false,
-      },
-      {
-        name: 'updateTime',
-        field: 'updateTime',
-        required: true,
-        label: i18n.global.t('post.tableColumnsPost.updateTime'),
-        headerStyle: 'text-align: center !important;',
+        headerStyle: 'text-align: center !important; width: 20%;',
         align: 'left',
         sortable: false,
       },
+      // {
+      //   name: 'createBy',
+      //   field: 'createBy',
+      //   required: true,
+      //   label: i18n.global.t('post.tableColumnsPost.createBy'),
+      //   headerStyle: 'text-align: center !important;',
+      //   align: 'left',
+      //   sortable: false,
+      // },
+      // {
+      //   name: 'createTime',
+      //   field: 'createTime',
+      //   required: true,
+      //   label: i18n.global.t('post.tableColumnsPost.createTime'),
+      //   headerStyle: 'text-align: center !important;',
+      //   align: 'left',
+      //   sortable: false,
+      // },
+      // {
+      //   name: 'updateBy',
+      //   field: 'updateBy',
+      //   required: true,
+      //   label: i18n.global.t('post.tableColumnsPost.updateBy'),
+      //   headerStyle: 'text-align: center !important;',
+      //   align: 'left',
+      //   sortable: false,
+      // },
+      // {
+      //   name: 'updateTime',
+      //   field: 'updateTime',
+      //   required: true,
+      //   label: i18n.global.t('post.tableColumnsPost.updateTime'),
+      //   headerStyle: 'text-align: center !important;',
+      //   align: 'left',
+      //   sortable: false,
+      // },
       {
         name: 'status',
         field: 'status',
         required: true,
         label: i18n.global.t('post.tableColumnsPost.status'),
-        headerStyle: 'text-align: center !important;',
+        headerStyle: 'text-align: center !important; width: 17%;',
         align: 'center',
         sortable: false,
       },
@@ -269,7 +272,7 @@ export default defineComponent({
         field: 'action',
         required: true,
         label: i18n.global.t('post.tableColumnsPost.action'),
-        headerStyle: 'text-align: center !important;',
+        headerStyle: 'text-align: center !important; width: 17%;',
         align: 'center',
         sortable: false,
       },