中间支付申请

src/views/debit-pay/admin/certificate.vue

@@ -28,7 +28,7 @@
         <HcAddModal v-model="addModalShow" @finish="addModalFinish" />
 
         <!-- 中间计量编辑 -->
-        <HcEditModal v-model="editModalShow" />
+        <HcEditModal v-model="editModalShow" :ids="editModalIds" />
 
         <!-- 查看报表 -->
         <hc-view-report v-model="isReportDrawer" />
@@ -106,7 +106,9 @@ const addModalFinish = () => {
 
 //修改
 const editModalShow = ref(false)
+const editModalIds = ref('')
 const rowEditClick = (row) => {
+    editModalIds.value = row.id
     editModalShow.value = true
 }
 </script>

src/views/debit-pay/admin/components/certificate/addModal.vue

@@ -37,9 +37,9 @@
 </template>
 
 <script setup>
-import { getArrValue } from 'js-fast-way'
 import { ref, watch } from 'vue'
 import { useAppStore } from '~src/store'
+import { getArrValue } from 'js-fast-way'
 import mainApi from '~api/debit-pay/admin/certificate'
 
 //事件

src/views/debit-pay/admin/components/certificate/editModal.vue

@@ -7,28 +7,30 @@
                     <el-row :gutter="20">
                         <el-col :span="8">
                             <el-form-item label="计量期：">
-                                <el-input v-model="formModel.key1" disabled />
+                                <el-select v-model="formModel.contractPeriodId" disabled block>
+                                    <el-option v-for="item in allPeriodData" :key="item.id" :label="item.periodNumber" :value="item.id" />
+                                </el-select>
                             </el-form-item>
                         </el-col>
                         <el-col :span="8">
                             <el-form-item label="证书编号：">
-                                <el-input v-model="formModel.key2" />
+                                <el-input v-model="formModel.certificateNumber" />
                             </el-form-item>
                         </el-col>
                         <el-col :span="8" />
                         <el-col :span="8">
                             <el-form-item label="开始日期：">
-                                <el-date-picker v-model="formModel.key3" class="block" format="YYYY-MM-DD" type="date" value-format="YYYY-MM-DD" disabled />
+                                <el-date-picker v-model="formModel.startDate" class="block" format="YYYY-MM-DD" type="date" value-format="YYYY-MM-DD" disabled />
                             </el-form-item>
                         </el-col>
                         <el-col :span="8">
                             <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.endDate" class="block" format="YYYY-MM-DD" type="date" value-format="YYYY-MM-DD" disabled />
                             </el-form-item>
                         </el-col>
                         <el-col :span="8">
                             <el-form-item label="打印日期：">
-                                <el-date-picker v-model="formModel.key5" 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-col>
                     </el-row>
@@ -36,19 +38,19 @@
                 <el-form class="no-rules" :model="formModel" label-position="left" label-width="auto">
                     <el-form-item label="开工预付计量期：">
                         <div class="form-item-div hc-flex flex-1">
-                            <el-checkbox-group v-model="formModel.key6">
-                                <el-checkbox :label="3">第一期</el-checkbox>
-                                <el-checkbox :label="6">第二期</el-checkbox>
-                                <el-checkbox :label="9">第三期</el-checkbox>
+                            <el-checkbox-group v-model="startPeriodIds">
+                                <template v-for="item in startPeriodData" :key="item.id">
+                                    <el-checkbox v-if="item.periodNumber" :label="item.periodNumber">{{ item.periodName }}</el-checkbox>
+                                </template>
                             </el-checkbox-group>
                         </div>
                     </el-form-item>
                     <el-form-item label="材料计量期：">
                         <div class="form-item-div hc-flex flex-1">
-                            <el-checkbox-group v-model="formModel.key7">
-                                <el-checkbox :label="3">第一期</el-checkbox>
-                                <el-checkbox :label="6">第二期</el-checkbox>
-                                <el-checkbox :label="9">第三期</el-checkbox>
+                            <el-checkbox-group v-model="materialPeriodIds">
+                                <template v-for="item in meterPeriodData" :key="item.id">
+                                    <el-checkbox v-if="item.periodNumber" :label="item.periodNumber">{{ item.periodName }}</el-checkbox>
+                                </template>
                             </el-checkbox-group>
                         </div>
                     </el-form-item>
@@ -68,7 +70,10 @@
 </template>
 
 <script setup>
-import { ref, watch } from 'vue'
+import { onMounted, ref, watch } from 'vue'
+import { useAppStore } from '~src/store'
+import { getArrValue, getObjValue } from 'js-fast-way'
+import mainApi from '~api/debit-pay/admin/certificate'
 
 const props = defineProps({
     ids: {
@@ -80,31 +85,86 @@ const props = defineProps({
 //事件
 const emit = defineEmits(['finish', 'close'])
 
+//变量
+const useAppState = useAppStore()
+const projectId = ref(useAppState.getProjectId || '')
+const contractId = ref(useAppState.getContractId || '')
+
 //双向绑定
 // eslint-disable-next-line no-undef
 const isShow = defineModel('modelValue', {
     default: false,
 })
 
+onMounted(() => {
+    getAllPeriod()
+    getMeterPeriod()
+    getStartPeriod()
+})
+
 //监听
-watch(() => [
-    props.ids,
-], ([ids]) => {
-    console.log('ids', ids)
+const dataId = ref(props.ids)
+watch(() => props.ids, (id) => {
+    dataId.value = id
 }, { immediate: true })
 
 //监听
 watch(isShow, (val) => {
     if (val) {
-        console.log('处理数据')
+        getDataDetail()
     }
 })
 
+//获取合同计量期
+const allPeriodData = ref([])
+const getAllPeriod = async () => {
+    const { data } = await mainApi.getAllPeriod({
+        projectId: projectId.value,
+        contractId: contractId.value,
+    })
+    allPeriodData.value = getArrValue(data)
+}
+
+//获取材料计量期
+const meterPeriodData = ref([])
+const materialPeriodIds = ref([])
+const getMeterPeriod = async () => {
+    const { data } = await mainApi.getMeterPeriod({
+        projectId: projectId.value,
+        contractId: contractId.value,
+        type: 1,
+    })
+    meterPeriodData.value = getArrValue(data)
+}
+
+//获取开工计量期
+const startPeriodData = ref([])
+const startPeriodIds = ref([])
+const getStartPeriod = async () => {
+    const { data } = await mainApi.getMeterPeriod({
+        projectId: projectId.value,
+        contractId: contractId.value,
+        type: 2,
+    })
+    startPeriodData.value = getArrValue(data)
+}
+
+
 //表单数据
 const formRef = ref(null)
 const formModel = ref({})
 const formRules = {}
 
+//获取详情
+const getDataDetail = async () => {
+    const { data } = await mainApi.getDetail({ id: dataId.value })
+    const form = getObjValue(data)
+    formModel.value = form
+    tableData.value = getArrValue(form['payList'])
+    materialPeriodIds.value = form['materialPeriodIds'].split(',')
+    startPeriodIds.value = form['startPeriodIds'].split(',')
+}
+
 //表格数据
 const tableColumn = ref([
     { key: 'key1', name: '支付章号' },
@@ -116,9 +176,7 @@ const tableColumn = ref([
     { key: 'key7', name: '上期未累计完成(元)' },
     { key: 'key8', name: '本期完成(元)' },
 ])
-const tableData = ref([
-    { key1: '1111' },
-])
+const tableData = ref([])
 
 
 const addModalSave = () => {
@@ -132,7 +190,3 @@ const addModalClose = () => {
     emit('close')
 }
 </script>
-
-<style scoped lang="scss">
-
-</style>