增加材料清单

web/src/api/material.js

@@ -3,8 +3,8 @@ import service from '@/utils/request'
 export const queryProjectMaterial = (data) => {
     return service({
         url: '/project/queryProjectMaterialsList',
-        method: 'GET',
-        params: data
+        method: 'POST',
+        data
     })
 }
 

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

@@ -1,13 +1,81 @@
 <template>
-  <div>{{ id.currentCode }}</div>
+  <el-row>
+    <el-col :span="3">
+      <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-col>
+    <el-col :span="2" style="margin-left: 30px">
+      <el-button
+          @click="openMaterial"
+          type="primary"
+          icon="Plus">
+        新增
+      </el-button>
+    </el-col>
+  </el-row>
+<!--  <div>{{ id.currentCode }}</div>-->
+  <el-row style="margin-top: 10px">
+    <el-col :span="18">
+      <el-table :data="materialList">
+        <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>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-col>
+  </el-row>
+  <el-drawer
+      v-model="drawerShow"
+      title="新增材料"
+      direction="rtl"
+      :before-close="handleClose"
+  >
+    <el-form size="large" label-width="80" label-position="left">
+      <el-form-item label="材料名称">
+        <el-input placeholder="请输入材料名称" v-model="addCondition.name"/>
+      </el-form-item>
+      <el-form-item label="单位">
+        <el-input placeholder="请输入材料单位" v-model="addCondition.unit" />
+      </el-form-item>
+      <el-form-item label="数量">
+        <el-input
+            v-model="addCondition.number"
+            type="number"/>
+      </el-form-item>
+      <el-form-item label="备注">
+        <el-input
+            v-model="addCondition.remarks"
+            :rows="3"
+            type="textarea"
+            placeholder="请输入备注"/>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="drawer-footer">
+        <el-button @click="drawerShow = false">取消</el-button>
+        <el-button type="primary" @click="addMaterial">
+          确认
+        </el-button>
+      </div>
+    </template>
+  </el-drawer>
 </template>
 
 <script setup>
 import { codeOperate } from '@/pinia/code/code'
-import { queryProjectMaterial } from '@/api/material'
-import { defineExpose, reactive } from "vue";
+import { queryProjectMaterial, createProjectMaterial, updateProjectMaterial } from '@/api/material'
+import { defineExpose, reactive, ref } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
+const drawerShow = ref(false)
 const id = codeOperate()
-console.log('当前code', id.currentCode)
 const condition = reactive({
   pageInfo: {
     page: 1,
@@ -16,13 +84,86 @@ const condition = reactive({
   code: "",
   name: ""
 })
+
+const addCondition = reactive({
+  name: "",
+  unit: "",
+  number: 0,
+  remarks: "",
+  projectCode: ""
+})
+
+const materialList = reactive([])
+// 0表示新增 1表示编辑
+const currentOperation = ref(0)
+// 编辑id
+const editId = ref(0)
 const getProjectMaterial = (code) => {
   condition.code = code
-  // queryProjectMaterial(condition).then(res => {
-  //   if (res.code === 0) {
-  //     console.log(res.data)
-  //   }
-  // })
+  addCondition.projectCode = code
+  queryProjectMaterial(condition).then(res => {
+    if (res.code === 0) {
+      materialList.length = 0
+      console.log(res.data.list)
+      materialList.push(...res.data.list)
+    }
+  })
+}
+const openMaterial = () => {
+  currentOperation.value = 0
+  drawerShow.value = true
+  addCondition.name = ''
+  addCondition.unit = ''
+  addCondition.number = 0
+  addCondition.remarks = ''
+}
+
+const openMaterialEdit = (row) => {
+  currentOperation.value = 1
+  editId.value = row.ID
+  drawerShow.value = true
+  addCondition.name = row.name
+  addCondition.unit = row.unit
+  addCondition.number = row.number
+  addCondition.remarks = row.remarks
+}
+const addMaterial = () => {
+  addCondition.number = Number(addCondition.number)
+  if(currentOperation.value === 0) {
+    createProjectMaterial(addCondition).then(res => {
+      if (res.code === 0) {
+        drawerShow.value = false
+        ElMessage.success('新增成功')
+      }
+    })
+  } else {
+    const editData = {
+      id: editId.value,
+      name: addCondition.name,
+      unit: addCondition.unit,
+      number: addCondition.number,
+      remarks: addCondition.remarks,
+      projectCode: addCondition.projectCode
+    }
+    updateProjectMaterial(editData).then(res => {
+      if (res.code === 0) {
+        drawerShow.value = false
+        ElMessage.success('编辑成功')
+      }
+    })
+  }
+}
+const handleClose = () => {
+  drawerShow.value = false
+}
+
+const deleteMaterial = () => {}
+const searchMaterial = () => {
+  queryProjectMaterial(condition).then(res => {
+    if (res.code === 0) {
+      console.log(res.data)
+    }
+  })
 }
 defineExpose({
   getProjectMaterial