材料预付款报表接口对接

src/api/modules/debit-pay/material/book.js

@@ -0,0 +1,29 @@
+import { HcApi } from '../../../request/index'
+//  合同材料
+export default {
+    //分页
+    async getPage(form, msg = true) {
+        return HcApi({
+            url: '/api/blade-meter/materialStartStatement/page',
+            method: 'get',
+            params: form,
+        }, msg)
+    },
+    //新增或修改
+    async submit(form, msg = true) {
+        return HcApi({
+            url: '/api/blade-meter/materialStartStatement/addOrUpdate',
+            method: 'post',
+            data: form,
+        }, msg)
+    },
+    //删除
+    async remove(form, msg = true) {
+        return HcApi({
+            url: '/api/blade-meter/materialStartStatement/remove',
+            method: 'post',
+            params: form,
+        }, msg)
+    },
+
+}

src/views/debit-pay/material/book.vue

@@ -9,8 +9,8 @@
         <hc-table :column="tableColumn" :datas="tableData" :loading="tableLoading" is-new :index-style="{ width: 60 }">
             <template #action="{ row }">
                 <el-link type="primary">查看报表</el-link>
-                <el-link type="success">修改</el-link>
-                <el-link type="danger">删除</el-link>
+                <el-link type="success" @click="editRow(row)">修改</el-link>
+                <el-link type="danger" @click="delCilck(row)">删除</el-link>
                 <el-link>重新计算</el-link>
             </template>
         </hc-table>
@@ -18,25 +18,27 @@
             <hc-pages :pages="searchForm" @change="pageChange" />
         </template>
         <!-- 新增/修改 -->
-        <hc-new-dialog v-model="formModalShow" is-to-body widths="30rem" title="材料计量单新增" @save="formModalSave" @close="formModalClose">
+        <hc-new-dialog v-model="formModalShow" is-to-body widths="30rem" title="材料计量单新增" :loading="saveLoading" @save="formModalSave" @close="formModalClose">
             <el-form ref="formRef" class="p-4" :model="formModel" :rules="formRules" label-position="top">
                 <el-form-item label="计量期：">
-                    <el-select v-model="formModel.key1" disabled block>
-                        <el-option label="第1期" value="1" />
-                        <el-option label="第2期" value="2" />
+                    <el-select v-if="editType === 'add'" v-model="formModel.meterPeriodId" placeholder="选择计量期" filterable clearable block @change="selectPeriod">
+                        <el-option v-for="item in periodData" :key="item.id" :label="item.periodName" :value="item.id" />
+                    </el-select>
+                    <el-select v-if="editType === 'edit'" v-model="formModel.meterPeriodId" placeholder="选择计量期" disabled filterable clearable block @change="selectPeriod">
+                        <el-option v-for="item in key1Data" :key="item.id" :label="item.periodName" :value="item.id" />
                     </el-select>
                 </el-form-item>
                 <el-form-item label="报表名称：">
-                    <el-input v-model="formModel.key2" />
+                    <el-input v-model="formModel.statementName" />
                 </el-form-item>
                 <el-form-item label="报表期：">
-                    <el-input v-model="formModel.key3" disabled />
+                    <el-input v-model="formModel.statementPeriod" disabled />
                 </el-form-item>
                 <el-form-item label="打印日期：">
-                    <el-date-picker v-model="formModel.key4" class="block" format="YYYY-MM-DD" type="date" value-format="YYYY-MM-DD" disabled />
+                    <el-date-picker v-model="formModel.printDate" class="block" format="YYYY-MM-DD" type="date" value-format="YYYY-MM-DD" disabled />
                 </el-form-item>
                 <el-form-item label="请款理由：">
-                    <el-input v-model="formModel.key5" :autosize="{ minRows: 3, maxRows: 6 }" type="textarea" />
+                    <el-input v-model="formModel.repaymentCause" :autosize="{ minRows: 3, maxRows: 6 }" type="textarea" />
                 </el-form-item>
             </el-form>
         </hc-new-dialog>
@@ -45,15 +47,63 @@
 
 <script setup>
 import { onMounted, ref } from 'vue'
+import bookApi from '~api/debit-pay/material/book.js'
+import periodApi from '~api/debit-pay/material/periods.js'
+import { useAppStore } from '~src/store'
+import { getArrValue, getObjValue } from 'js-fast-way'
+const useAppState = useAppStore()
+const contractId = ref(useAppState.getContractId)
+const projectId = ref(useAppState.getProjectId)
+import { delMessageV2 } from '~com/message/index.js'
 defineOptions({
     name: 'DebitPayMaterialBook',
 })
 
 //渲染完成
 onMounted(() => {
-
+    getTableData()
+    getPeriodData()
+    getKey1Data()
 })
 
+
+//计量期
+const periodData = ref([])
+//未被引用的
+const getPeriodData = async ()=>{
+    const { error, code, data } = await periodApi.conditionPeriod({
+       contractId:contractId.value,
+       type:1,
+    })
+    tableLoading.value = false
+    if (!error && code === 200) {
+        periodData.value = getArrValue(data)
+    } else {
+        periodData.value = []
+    }
+}
+//所有计量期
+const key1Data = ref([])
+const getKey1Data = async ()=>{
+    const { error, code, data } = await periodApi.allPeriod({
+       contractId:contractId.value,
+       type:1,
+    })
+    tableLoading.value = false
+    if (!error && code === 200) {
+        key1Data.value = getArrValue(data)
+    } else {
+        key1Data.value = []
+    }
+}
+const selectPeriod = (val)=>{
+    periodData.value.forEach((ele)=>{
+        if (ele.id === val) {
+            formModel.value.statementPeriod = ele.periodName
+            formModel.value.printDate = ele.formPrintDate
+        }
+    })
+}
 //搜索表单
 const searchForm = ref({
     current: 1, size: 10, total: 0,
@@ -68,34 +118,91 @@ const pageChange = ({ current, size }) => {
 //表格数据
 const tableLoading = ref(false)
 const tableColumn = ref([
-    { key: 'key1', name: '计量期' },
-    { key: 'key2', name: '报表名称' },
-    { key: 'key3', name: '打印日期' },
-    { key: 'key4', name: '重新计算时间' },
+    { key: 'periodNumber', name: '计量期' },
+    { key: 'statementName', name: '报表名称' },
+    { key: 'printDate', name: '打印日期' },
+    { key: 'calculateDate', name: '重新计算时间' },
     { key: 'action', name: '操作', width: 230 },
 ])
-const tableData = ref([
-    { key1: '1111' },
-])
-
+const tableData = ref([])
+const getTableData = async () => {
+    tableLoading.value = true
+    const { error, code, data } = await bookApi.getPage({
+       ...searchForm.value,
+       contractId:contractId.value,
+       type:1,
+    //    meterPeriodId:searchForm.value.key1,
+    })
+    tableLoading.value = false
+    if (!error && code === 200) {
+        tableData.value = getArrValue(data['records'])
+    } else {
+        tableData.value = []
+    }
+}
 //新增
 const formModalShow = ref(false)
+const editType = ref('')
 const addModalClick = () => {
     formModalShow.value = true
+    formModel.value = {}
+    editType.value = 'add'
+}
+const editRow = (row)=>{
+    formModalShow.value = true
+    console.log(row, 'row')
+    formModel.value = row
+    editType.value = 'edit'
+}
+const delCilck = (row)=>{
+    delMessageV2(async (action, instance, done) => {
+            if (action === 'confirm') {
+                instance.confirmButtonLoading = true
+                removeProPay(row.id)
+                instance.confirmButtonLoading = false
+                done()
+            } else {
+                done()
+            }
+    })
+}
+const removeProPay = async (id) => {
+    const { error, code } = await bookApi.remove({
+        ids: id, 
+    })
+    if (!error && code === 200) {
+        window?.$message?.success('删除成功')
+       getTableData()
+     
+    }
 }
-
 //表单
 const formRef = ref(null)
 const formModel = ref({})
 const formRules = []
 
-
-const formModalSave = () => {
+const saveLoading = ref(false)
+const formModalSave = async () => {
+    saveLoading.value = true
+    const { error, code, msg } = await bookApi.submit({
+        ...formModel.value,
+        contractId:contractId.value,
+        projectId:projectId.value,
+        type:1,
+        })
+        //判断状态
+        saveLoading.value = false
+        if (!error && code === 200) {
+            window?.$message?.success(msg)
+            
+         
+        }
     formModalClose()
 }
 
 const formModalClose = () => {
     formModalShow.value = false
+    getTableData()
 }
 </script>
 

src/views/debit-pay/material/order.vue

@@ -113,7 +113,6 @@ import { getArrValue, getObjValue } from 'js-fast-way'
 import { useAppStore } from '~src/store'
 const useAppState = useAppStore()
 const contractId = ref(useAppState.getContractId)
-const projectId = ref(useAppState.getProjectId)
 import { delMessageV2 } from '~com/message/index.js'
 
 defineOptions({