修复bug

src/services/matrix/craft.ts

@@ -6,7 +6,7 @@ export function getList(params: { pageSize: number; pageNum: number }) {
 	return httpRequest<BaseResponse>({
 		url: "/api/matrixCraft/list",
 		params: { ...params },
-		method: "GET",
+		method: "POST",
 	});
 }
 

src/services/matrix/manage.ts

@@ -6,7 +6,7 @@ export function getList(params: { pageNum: number; pageSize: number }){
   return httpRequest<BaseResponse<{ list: MatrixItem[]; total: number }>>({
       url: "/api/matrix/list",
       params: { ...params },
-      method: "GET",
+      method: "POST",
     });
 }
 

src/views/matrixCraft/index.vue

@@ -4,9 +4,30 @@
       <el-button type="primary" @click='addCraft'>新增工艺</el-button>
       <el-button @click="onEdit">编辑</el-button>
       <el-button @click="onDel">删除</el-button>
+      <el-input
+        class="ml-[20px]"
+        v-model="searchForm.matrixCraftName"
+        style="width: 240px"
+        placeholder="工艺名称"
+        clearable
+      />
+
+      <el-select
+        v-model="searchForm.matrixId"
+        placeholder="选择基质"
+        clearable
+        style="width: 120px">
+        <el-option
+          v-for="item in settingStore.matrixList"
+          :key="item.id"
+          :label="item.name"
+          :value="item.id" />
+      </el-select>
+
+      <el-button @click="getCraftList">搜索</el-button>
     </div>
     <div class="w-[90vw] ml-[3rem] mt-[2rem] h-[70vh]">
-      <el-table :data="tableData" stripe style="width: 100%" ref="craftTableRef">
+      <el-table empty-text="无数据" :data="tableData" stripe style="width: 100%" ref="craftTableRef" v-loading="loading" >
         <el-table-column type="selection" width="55" />
         <el-table-column prop="matrixName" label="基质名称" width="100" />
         <el-table-column prop="name" label="工艺名称"/>
@@ -74,6 +95,11 @@
   let sprayVisible = ref(false)
   let tableData = ref<any>([])
   let operType = ref('add')
+  let loading = ref(false)
+  const searchForm = ref({
+    matrixCraftName:undefined,
+    matrixId:undefined,
+  })
   const defaultCraft: CraftItem = {
     id: 1,
     name: '',
@@ -101,17 +127,21 @@
     getCraftList()
   })
 
-  //基质列表
 
   //工艺列表
   const getCraftList = () => {
     const params = {
       pageNum:1,
       pageSize:10,
+      ...searchForm.value
     }
+    
+    loading.value = true;
     getList(params).then((res:any)=>{
       tableData.value = res.data.list
       total.value = res.data.total
+    }).finally(()=>{
+      loading.value = false;
     })
   }
 
@@ -215,6 +245,7 @@
     background: linear-gradient(90deg, #0657c0 24%, #096ae0 101%);;
   }
   .spurt_print{
+    height: 80vh;
     .spurt_print_btn{
       margin-top: 2rem;
     }

src/views/matrixManage/matrixList.vue

@@ -1,17 +1,35 @@
 <template>
-  <main>
+  <main class="matrix_main">
     <div class="opt_btn p-[3rem]">
       <el-button type="primary" @click="onAdd">新增基质</el-button>
       <el-button @click="onEdit">编辑</el-button>
       <el-button @click="onDel">删除</el-button>
+
+      <el-input
+        class="ml-[20px]"
+        v-model="searchForm.matrixName"
+        style="width: 240px"
+        placeholder="基质名称"
+        clearable
+      />
+
+      <el-button @click="getMatrixList">搜索</el-button>
+
     </div>
-    <div class="matrix_list pl-[3rem]">
-      <div v-for="(item, index) in matrixList" class="w-[8rem] h-[3rem] matrix_module" @click="toggleSelection(index)" :style="{ backgroundColor: item.isSelected ? '#65a8ff' : '#ffffff' }">
+      <!-- <div v-for="(item, index) in matrixList" class="w-[8rem] h-[3rem] matrix_module" @click="toggleSelection(index)" :style="{ backgroundColor: item.isSelected ? '#65a8ff' : '#ffffff' }">
         {{ item.name }}
-      </div>
+      </div> -->
+    <div style="padding:20px">
+      <el-table :data="matrixList" empty-text="无数据" stripe style="width: 100%;" ref="matrixTableRef" v-loading="loading">
+        <el-table-column type="selection" />
+        <el-table-column prop="name" label="基质名称" />
+      </el-table>
     </div>
     <Add ref="addRef" @save="onSave"/>
   </main>
+  <footer class="footer">
+    <el-pagination background layout="prev, pager, next" :total="totalData" />
+  </footer>
 </template>
 <script lang="ts" setup>
   import { ref, reactive, onMounted } from 'vue'
@@ -21,6 +39,11 @@
   import Add from './add.vue'
   const addRef:any = ref()
   const matrixList = ref<Array<MatrixItem>>([])
+  const loading = ref(false)
+  const totalData = ref()
+  const searchForm = ref({
+    matrixName:'',
+  })
   onMounted(()=>{
     getMatrixList()
   })
@@ -29,12 +52,17 @@
     const params = {
       pageNum:1,
       pageSize:20,
+      ...searchForm.value
     }
+    loading.value = true;
     getList(params).then(res => {
       if(res.success){
-        const { list } = res.data;
+        const { list, total } = res.data;
         matrixList.value = list;
+        totalData.value = total
       }
+    }).finally(()=>{
+      loading.value = false;
     })
   }
   const toggleSelection = (index:number) => {
@@ -48,14 +76,18 @@
     name:'',
     id:0
   })
+
+  const matrixTableRef = ref()
   const onEdit = () => {
-    let list = matrixList.value.filter((item:MatrixItem) => !!item.isSelected)
-    if(list.length !== 1){
-      ElMessage.error("请选择一条数据")
+
+    const selectRows = matrixTableRef.value.getSelectionRows()
+    if(selectRows.length !== 1){
+      ElMessage.error('请选择一条数据进行编辑')
       return;
     }
-    editItem.value = list[0]
-    addRef.value.showDialog('edit', editItem.value)
+    const sel = selectRows[0]
+    editItem.value = sel
+    addRef.value.showDialog('edit', sel)
   }
   const onSave = (dataFrom:{name:string,id:number}, type:string) => {
     if(type == 'add'){
@@ -81,12 +113,12 @@
   }
 
   const onDel = ()=>{
-    let list = matrixList.value.filter((item:MatrixItem) => !!item.isSelected)
-    if(list.length !== 1){
-      ElMessage.error("请选择一条数据")
+    const selectRows = matrixTableRef.value.getSelectionRows()
+    if(selectRows.length !== 1){
+      ElMessage.error('请选择一条数据进行编辑')
       return;
     }
-    let item = list[0]
+    const item = selectRows[0]
     const ids = item.id;
     ElMessageBox.confirm('确认删除此条数据吗?','提示',{
       confirmButtonText: '确认',
@@ -121,6 +153,9 @@
     background: linear-gradient(90deg, #0657c0 24%, #096ae0 101%);;
   }
 
+  .matrix_main{
+    height:80vh;
+  }
   .matrix_list{
     display: grid;
     grid-template-columns:repeat(6, 1fr);
@@ -131,4 +166,16 @@
     line-height: 3rem;
     text-align: center;
   }
+
+  .footer{
+    display: flex;
+    justify-content: end;
+    position: relative;
+
+    .pagination{
+      position: absolute;
+      bottom: 0;
+      right: 3rem;
+    }
+  }
 </style>