增加材料清单

web/src/view/finance/financeAnalysis/components/material.vue

@@ -4,7 +4,7 @@
       <el-input placeholder="请输入材料名称" v-model="condition.name"></el-input>
     </el-col>
     <el-col :span="1" style="margin-left: 20px">
-      <el-button @click="searchMaterial" icon="Search" type="primary">搜索</el-button>
+      <el-button @click="getMaterialList(condition)" icon="Search" type="primary">搜索</el-button>
     </el-col>
     <el-col :span="2" style="margin-left: 30px">
       <el-button
@@ -18,20 +18,35 @@
 <!--  <div>{{ id.currentCode }}</div>-->
   <el-row style="margin-top: 10px">
     <el-col :span="18">
-      <el-table :data="materialList">
+      <el-table :data="materialList" height="495">
         <el-table-column label="材料名称" prop="name" align="center"></el-table-column>
         <el-table-column label="计量单位" prop="unit" align="center"></el-table-column>
         <el-table-column label="数量" prop="number" align="center"></el-table-column>
         <el-table-column label="操作" align="center">
           <template #default="scope">
             <el-button text icon="Edit" type="primary" @click="openMaterialEdit(scope.row)">编辑</el-button>
-            <el-button text icon="ChatLineSquare" type="primary">备注</el-button>
-            <el-button text icon="Edit" type="primary" @click="deleteMaterial">删除</el-button>
+            <el-button text icon="Delete" type="primary" @click="deleteMaterial(scope.row.ID)">删除</el-button>
+            <el-tooltip :content="scope.row.remarks" effect="light" placement="top">
+              <el-button text icon="ChatLineSquare" type="primary">备注</el-button>
+            </el-tooltip>
           </template>
         </el-table-column>
       </el-table>
     </el-col>
   </el-row>
+  <el-row style="margin-top: 10px">
+    <el-col :span="18">
+      <div style="width: 100%;display: flex;justify-content: end">
+        <el-pagination
+            background layout="prev, pager, next"
+            :total="materialTotal"
+            @change="changePage"
+            v-model:current-page="condition.pageInfo.page"
+            :page-size="condition.pageInfo.pageSize"
+        />
+      </div>
+    </el-col>
+  </el-row>
   <el-drawer
       v-model="drawerShow"
       title="新增材料"
@@ -71,15 +86,16 @@
 
 <script setup>
 import { codeOperate } from '@/pinia/code/code'
-import { queryProjectMaterial, createProjectMaterial, updateProjectMaterial } from '@/api/material'
+import { queryProjectMaterial, createProjectMaterial, updateProjectMaterial, deleteProjectMaterial } from '@/api/material'
 import { defineExpose, reactive, ref } from "vue";
 import { ElMessage, ElMessageBox } from "element-plus";
 const drawerShow = ref(false)
 const id = codeOperate()
+const materialTotal = ref(0)
 const condition = reactive({
   pageInfo: {
     page: 1,
-    pageSize: 100
+    pageSize: 8
   },
   code: "",
   name: ""
@@ -101,10 +117,13 @@ const editId = ref(0)
 const getProjectMaterial = (code) => {
   condition.code = code
   addCondition.projectCode = code
-  queryProjectMaterial(condition).then(res => {
+  getMaterialList(condition)
+}
+const getMaterialList = (data) => {
+  queryProjectMaterial(data).then(res => {
     if (res.code === 0) {
       materialList.length = 0
-      console.log(res.data.list)
+      materialTotal.value = res.data.total
       materialList.push(...res.data.list)
     }
   })
@@ -128,12 +147,21 @@ const openMaterialEdit = (row) => {
   addCondition.remarks = row.remarks
 }
 const addMaterial = () => {
+  for (const key in addCondition) {
+    if ((key === 'name' || key === 'unit') && addCondition.hasOwnProperty(key)) {
+      if (addCondition[key] === '') {
+        ElMessage.error('请将材料名称和计量单位填写完整')
+        return
+      }
+    }
+  }
   addCondition.number = Number(addCondition.number)
   if(currentOperation.value === 0) {
     createProjectMaterial(addCondition).then(res => {
       if (res.code === 0) {
         drawerShow.value = false
         ElMessage.success('新增成功')
+        getMaterialList(condition)
       }
     })
   } else {
@@ -149,6 +177,7 @@ const addMaterial = () => {
       if (res.code === 0) {
         drawerShow.value = false
         ElMessage.success('编辑成功')
+        getMaterialList(condition)
       }
     })
   }
@@ -157,14 +186,39 @@ const handleClose = () => {
   drawerShow.value = false
 }
 
-const deleteMaterial = () => {}
-const searchMaterial = () => {
-  queryProjectMaterial(condition).then(res => {
-    if (res.code === 0) {
-      console.log(res.data)
-    }
-  })
+const deleteMaterial = (id) => {
+  ElMessageBox.confirm(
+      '确定删除该材料吗',
+      '删除',
+      {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      }
+  )
+      .then(() => {
+        deleteProjectMaterial(id).then(res => {
+          if (res.code === 0) {
+            ElMessage({
+              type: 'success',
+              message: '删除成功',
+            })
+            getMaterialList(condition)
+          }
+        })
+      })
+      .catch(() => {
+        ElMessage({
+          type: 'info',
+          message: '取消删除',
+        })
+      })
+}
+
+const changePage = () => {
+  getMaterialList(condition)
 }
+
 defineExpose({
   getProjectMaterial
 })