物资类型管理 调整

src/views/comprehensiveGuarantee/MaterialReserveManagement/TypesMaterialsManagement.vue

@@ -11,20 +11,20 @@
             </el-col>
           </el-row>
         </transition>
-        <el-table ref="multipleTable" v-loading="loading" :data="tableData" border :max-height="maxHeight" style="width: 96%">
-          <el-table-column label="物资类别名称" align="center" prop="material_category_name" show-overflow-tooltip />
-          <el-table-column label="物资类别等级" align="center" prop="material_category_level" show-overflow-tooltip>
+        <el-table ref="multipleTable" v-loading="loading" :data="tableData" border :max-height="maxHeight">
+          <el-table-column label="物资类别名称" align="center" prop="material_category_name" />
+          <el-table-column label="物资类别等级" align="center" prop="material_category_level">
             <template #default="scope">
               <dict-tag :options="material_category_level" :value="scope.row.material_category_level" />
             </template>
           </el-table-column>
-          <el-table-column label="排序" align="center" prop="sort_order" show-overflow-tooltip />
-          <el-table-column label="显示状态" align="center" prop="display_status" show-overflow-tooltip>
+          <el-table-column label="排序" align="center" prop="sort_order" />
+          <el-table-column label="显示状态" align="center" prop="display_status">
             <template #default="scope">
               <dict-tag :options="show_status" :value="scope.row.display_status" />
             </template>
           </el-table-column>
-          <el-table-column label="操作" align="center" style="width: 120px" fixed="right" class-name="small-padding fixed-width">
+          <el-table-column label="操作" align="center" width="140px" fixed="right" class-name="small-padding fixed-width">
             <template #default="scope">
               <el-button type="text" class="common-btn-text-primary" @click="handleView(scope.row.id)">详情</el-button>
               <el-button type="text" class="common-btn-text-primary" @click="handleEdit(scope.row.id)">编辑</el-button>
@@ -32,13 +32,7 @@
             </template>
           </el-table-column>
         </el-table>
-        <pagination
-          v-show="total > 0"
-          v-model:page="queryParams.page"
-          v-model:limit="queryParams.pageSize"
-          :total="total"
-          @change-page="handlePaginationChange"
-        />
+        <pagination v-show="total > 0" v-model:page="queryParams.page" v-model:limit="queryParams.pageSize" :total="total" @pagination="getList" />
       </div>
     </div>
     <addTypesMaterials v-if="addTypesMaterialsState.show" :id="detailId" @close="handleCancel" />
@@ -66,8 +60,8 @@ const handleResize = () => {
   maxHeight.value = window.innerHeight * 0.8;
 };
 const queryParams = reactive({
-  page: '1',
-  pageSize: '10'
+  page: 1,
+  pageSize: 10
 });
 
 const tableData = ref([]);
@@ -118,14 +112,14 @@ const handleCancel = () => {
   addTypesMaterialsState.show = false;
   impotTypesMaterialsState.show = false;
   TypesMaterialsDetailsState.show = false;
-  handlePaginationChange('1');
+  handlePaginationChange(1);
 };
 
 const handleImport = () => {
   impotTypesMaterialsState.show = true;
 };
 
-const handlePaginationChange = (page: string) => {
+const handlePaginationChange = (page: number) => {
   queryParams.page = page;
   getList();
 };
@@ -133,6 +127,7 @@ const handlePaginationChange = (page: string) => {
 const getList = () => {
   getMaterialTypeList(queryParams).then((res) => {
     tableData.value = res.data;
+    total.value = res.total;
   });
 };