From 9e0e0c3fc7089e526d53e71c87aac6b56d753ab5 Mon Sep 17 00:00:00 2001
From: lynn <lynnlinyong@qq.com>
Date: Thu, 22 May 2025 16:47:35 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../contract/components/contractSign.vue      |   6 +-
 .../contract/components/contractSign_bk.vue   | 738 ++++++++++++++++++
 .../components/paymentRegistration.vue        | 222 +++++-
 .../components/paymentRegistration_bk.vue     | 495 ++++++++++++
 src/views/contract/contractList.vue           | 154 ++--
 5 files changed, 1504 insertions(+), 111 deletions(-)
 create mode 100644 src/views/contract/components/contractSign_bk.vue
 create mode 100644 src/views/contract/components/paymentRegistration_bk.vue

diff --git a/src/views/contract/components/contractSign.vue b/src/views/contract/components/contractSign.vue
index fc4677d..3e482f0 100644
--- a/src/views/contract/components/contractSign.vue
+++ b/src/views/contract/components/contractSign.vue
@@ -93,7 +93,7 @@
         </div>
       </template>
 
-      <template v-slot:guaranteeMoney>
+      <template v-slot:guaranteeMoney v-if="contract.contract_type !== 160">
         <div class="xy-table-item">
           <div class="xy-table-item-label">
             <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>质保金
@@ -127,7 +127,7 @@
           </div>
         </div>
       </template>
-      <template v-slot:guaranteeYear>
+      <template v-slot:guaranteeYear v-if="contract.contract_type !== 160">
         <div class="xy-table-item">
           <div class="xy-table-item-label">
             <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>质保期
@@ -138,7 +138,7 @@
           </div>
         </div>
       </template>
-      <template v-slot:extraFormBottom>
+      <template v-slot:extraFormBottom v-if="contract.contract_type !== 160">
         <div class="base-info add-plan" style="margin-top: 20px;margin-bottom: 20px">
           <div class="base-info-title">付款计划</div>
           <Button type="primary" style="margin-left: 50px;" @click="isShowAddPlan = true">新增计划</Button>
diff --git a/src/views/contract/components/contractSign_bk.vue b/src/views/contract/components/contractSign_bk.vue
new file mode 100644
index 0000000..fc4677d
--- /dev/null
+++ b/src/views/contract/components/contractSign_bk.vue
@@ -0,0 +1,738 @@
+<template>
+  <div>
+    <xy-dialog :is-show.sync="isShow" title="合同签订" type="form" :form="form" :rules="rules" @submit="sign" ok-text="提交">
+      <template v-slot:extraFormTop>
+        <div class="base-info" style="margin-bottom: 20px;">
+          <div class="base-info-title">合同信息</div>
+          <div class="base-info-item">
+            <div class="base-info-item-title">合同名称</div>
+            <div class="base-info-item-content">{{contract.name}}</div>
+          </div>
+        </div>
+      </template>
+      <template v-slot:number>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>合同编号
+          </div>
+          <div class="xy-table-item-content">
+            <el-input placeholder="请填写合同编号" v-model="form.number" style="width: 300px;" />
+          </div>
+        </div>
+      </template>
+      <template v-slot:supply>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>承包商\供应商
+          </div>
+          <div class="xy-table-item-content">
+            <el-input placeholder="请填写承包商\供应商" v-model="form.supply" style="width: 300px;" />
+          </div>
+        </div>
+      </template>
+      <template v-slot:carryDepartment>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>执行部门
+          </div>
+          <div class="xy-table-item-content">
+            <el-input placeholder="请填写执行部门" v-model="form.carryDepartment" style="width: 300px;" />
+          </div>
+        </div>
+      </template>
+      <template v-slot:money>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>合同金额
+          </div>
+          <div class="xy-table-item-content xy-table-item-price">
+            <el-input placeholder="请填写合同金额" v-model="form.money" style="width: 300px;" @change="planMonthLists"/>
+          </div>
+        </div>
+      </template>
+      <template v-slot:time>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>合同服务时间
+          </div>
+          <div class="xy-table-item-content">
+            <el-date-picker style="width: 300px;" value-format="yyyy-MM-dd" v-model="form.time" type="daterange"
+              range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" @change="dateRangePick">
+            </el-date-picker>
+          </div>
+        </div>
+      </template>
+
+
+
+      <template v-slot:is_assurance>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label" style="width: 200px">是否收取履约保函
+          </div>
+          <div class="xy-table-item-content">
+            <el-switch v-model="form.is_assurance" />
+          </div>
+        </div>
+      </template>
+      <template v-if="form.is_assurance" v-slot:assurance_money>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label" style="width: 200px">保函金额
+          </div>
+          <div class="xy-table-item-content xy-table-item-price">
+            <el-input-number v-model="form.assurance_money" :controls="false" :precision="2" placeholder="请输入保函金额" style="width: 300px;"></el-input-number>
+          </div>
+        </div>
+      </template>
+      <template v-if="form.is_assurance" v-slot:assurance_expire>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label" style="width: 200px">保函有效期
+          </div>
+          <div class="xy-table-item-content">
+            <el-date-picker value-format="yyyy-MM-dd" v-model="form.assurance_expire" placeholder="请输入保函有效期" style="width: 300px;"/>
+          </div>
+        </div>
+      </template>
+
+      <template v-slot:guaranteeMoney>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>质保金
+          </div>
+          <div class="xy-table-item-content xy-table-item-price">
+            <el-input-number :precision="2" :controls="false" placeholder="请填写质保金" v-model="form.guaranteeMoney"
+              style="width: 300px;" />
+          </div>
+        </div>
+      </template>
+      <template #has_continue>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label" style="width: 200px;">
+            是否为延续类项目
+          </div>
+          <div class="xy-table-item-content">
+            <el-switch v-model="form.has_continue" active-text="是" inactive-text="否" :active-value="1" :inactive-value="0"/>
+          </div>
+        </div>
+      </template>
+      <template v-slot:date>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+
+            <span style="color: red;">*</span>
+            签订日期
+          </div>
+          <div class="xy-table-item-content">
+            <el-date-picker style="width: 300px;" value-format="yyyy-MM-dd" v-model="form.date" type="date">
+            </el-date-picker>
+          </div>
+        </div>
+      </template>
+      <template v-slot:guaranteeYear>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>质保期
+          </div>
+          <div class="xy-table-item-content xy-table-item-year">
+            <el-input-number :controls="false" placeholder="请填写质保期" v-model="form.guaranteeYear"
+              style="width: 300px;" />
+          </div>
+        </div>
+      </template>
+      <template v-slot:extraFormBottom>
+        <div class="base-info add-plan" style="margin-top: 20px;margin-bottom: 20px">
+          <div class="base-info-title">付款计划</div>
+          <Button type="primary" style="margin-left: 50px;" @click="isShowAddPlan = true">新增计划</Button>
+          <Button type="primary" style="margin-left: 20px;" @click="isShowAddManyPlan = true">批量添加</Button>
+        </div>
+
+        <xy-table :list="signList" :table-item="signTable" :show-index="false" :height="240"
+          @delete="deleteContractSign"
+          @editor="(row)=>{$refs['detailContractSign'].planId = row.id;$refs['detailContractSign'].isShow = true}">
+
+        </xy-table>
+      </template>
+    </xy-dialog>
+
+    <!--    新增计划-->
+    <xy-dialog :is-show.sync="isShowAddPlan" type="form" title="新增计划" :form="planForm" :rules="planRules" :width="48"
+      @submit="submit">
+      <template v-slot:date>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red;">*</span>
+            <span>日期</span>
+          </div>
+          <div class="xy-table-item-content">
+            <el-datePicker style="width: 300px" v-model="planForm.date" type="date" placeholder="请选择日期"></el-datePicker>
+          </div>
+        </div>
+      </template>
+      <template v-slot:content>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red;">*</span>
+            <span>内容</span>
+          </div>
+          <div class="xy-table-item-content">
+            <el-input style="width: 300px" type="textarea" v-model="planForm.content" placeholder="请输入内容" />
+          </div>
+        </div>
+      </template>
+      <template v-slot:money>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red;">*</span>
+            <span>金额</span>
+          </div>
+          <div class="xy-table-item-content xy-table-item-price">
+            <el-input style="width: 300px" v-model="planForm.money" placeholder="请输入金额" />
+          </div>
+        </div>
+      </template>
+      <template v-slot:remark>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span>备注</span>
+          </div>
+          <div class="xy-table-item-content">
+            <el-input style="width: 300px" type="textarea" v-model="planForm.remark" placeholder="请输入备注" />
+          </div>
+        </div>
+      </template>
+    </xy-dialog>
+
+    <Modal
+      v-model="isShowAddManyPlan"
+      title="计划任务"
+      @on-ok="manyCreate">
+
+      <div class="many-plan">
+        <div class="many-plan-item">
+          <p>合同总金额</p>
+          <div>{{ form.money }}</div>
+        </div>
+
+        <div class="many-plan-item">
+          <p>开始日期</p>
+          <el-date-picker v-model="manySetting.startMonth" size="mini" value-format="yyyy-MM-dd" @change="planMonthLists"></el-date-picker>
+        </div>
+
+        <div class="many-plan-item">
+          <p>付款月份数</p>
+          <el-input-number v-model="manySetting.lastMonth" :controls="false" size="mini" :precision="0" :min="1" :max="12" @change="planMonthLists"></el-input-number>
+        </div>
+
+        <div class="many-plan-item">
+          <p>付款日期</p>
+          <el-input-number v-model="manySetting.day" :controls="false" size="mini" :precision="0" :min="1" :max="31" @change="planMonthLists"></el-input-number>
+        </div>
+
+        <div class="many-plan-item">
+          <p>生成付款日期</p>
+          <div>
+            <div style="display: none;">{{ planMonthLists }}</div>
+            <xy-table :list="manyForm" :height="300" :table-item="manyTable">
+              <template #btns></template>
+            </xy-table>
+          </div>
+        </div>
+      </div>
+
+    </Modal>
+
+    <detailContractSign ref="detailContractSign" @editorSuccess="getContractSignList"></detailContractSign>
+  </div>
+</template>
+
+<script>
+  import { MessageBox } from 'element-ui';
+  import {
+    addContractSign,
+    getContractSign,
+    delContractSign,
+    httpCurl
+  } from "@/api/contractSign/contractSign";
+  import {
+    detailContract,
+    editorContract
+  } from "@/api/contract/contract";
+  import {
+    Message
+  } from "element-ui";
+  import {
+    parseTime,
+    moneyFormatter
+  } from "@/utils"
+
+  import detailContractSign from "@/views/contract/components/detailContractSign";
+  import {
+    getOatoken
+  } from "@/api/oatoken";
+  import axios from "axios";
+  export default {
+    components: {
+      detailContractSign
+    },
+    data() {
+      return {
+        isShowAddManyPlan: false,
+        manySetting: {
+          day: 1,
+          lastMonth: 1,
+          startMonth: ''
+        },
+        manyForm: [],
+        manyTable: [
+          {
+            prop: "date",
+            label: "付款日期",
+            width: 160,
+            customFn:row => {
+              return (
+                <el-date-picker style="width: 130px;" vModel={row.date} size="mini" value-format="yyyy-MM-dd"></el-date-picker>
+              )
+            }
+          },
+          {
+            prop: "money",
+            label: "金额",
+            width: 180,
+            customFn:row => {
+              return (
+                <el-input-number size="mini" vModel={row.money} precision={2} controls={false}></el-input-number>
+              )
+            }
+          },
+          {
+            prop: "operate",
+            label: "操作",
+            customFn:(row,{ $index }) => {
+              return (
+                <Button type="error"
+                        size="small"
+                        on={{
+                          ['click']:_ => {
+                            this.manyForm.splice($index, 1)
+                          }
+                        }}>移除</Button>
+              )
+            }
+          }
+        ],
+
+        form: {
+          number: '',
+          supply: '',
+          has_continue: 0,
+          carryDepartment: '',
+          money: '',
+          time: [],
+          guaranteeMoney: '',
+          guaranteeYear: '',
+          date: "",
+          is_assurance: false,
+          assurance_money:'',
+          assurance_expire:''
+        },
+        rules: {
+          number: [{
+            required: true,
+            message: "必填"
+          }],
+          date: [{
+            required: true,
+            message: "必填"
+          }],
+          supply: [{
+            required: true,
+            message: "必填"
+          }],
+          carryDepartment: [{
+            required: true,
+            message: "必填"
+          }],
+          money: [{
+              required: true,
+              message: "必填"
+            },
+            {
+              pattern: /^\d+(\.\d+)?$/,
+              message: '必须为数字'
+            }
+          ],
+          time: [{
+            required: true,
+            message: "必选"
+          }],
+          guaranteeMoney: [{
+            required: true,
+            message: "必填"
+          }],
+          guaranteeYear: [{
+            required: true,
+            message: "必填"
+          }]
+        },
+
+        isShow: false,
+        contractId: null,
+        contract: {},
+        signList: [],
+        signTable: [{
+            prop: 'date',
+            label: '日期',
+            width: 170,
+            sortable: false,
+          },
+          {
+            prop: 'money',
+            label: '金额',
+            align: 'right',
+            width: 120,
+            sortable: false,
+            formatter: (v1, v2, value) => {
+              return moneyFormatter(value)
+            }
+          },
+          {
+            prop: 'content',
+            label: '内容',
+            minWidth: 180,
+            align: 'left',
+            sortable: false,
+          },
+          {
+            prop: 'remark',
+            label: '备注',
+            minWidth: 180,
+            align: 'left',
+            sortable: false,
+          }
+        ],
+
+        isShowAddPlan: false,
+        planForm: {
+          date: '',
+          money: '',
+          content: '',
+          remark: ''
+        },
+        planRules: {
+          date: [{
+            required: true,
+            message: "必填"
+          }],
+          content: [{
+            required: true,
+            message: "必填"
+          }],
+          money: [{
+              required: true,
+              message: "必填"
+            },
+            {
+              pattern: /^\d+(\.\d+)?$/,
+              message: '必须为数字'
+            }
+          ]
+        }
+      }
+    },
+    methods: {
+      dateRangePick (e) {
+        if (e[0] && e[1]) {
+          this.manySetting.startMonth = e[0] ? e[0] : '';
+          this.manySetting.lastMonth = this.$moment(e[1]).diff(this.$moment(e[0]),'months')
+        } else {
+          this.manySetting.startMonth = '';
+          this.manySetting.lastMonth = 1;
+        }
+
+        this.planMonthLists();
+      },
+
+      //合同签订
+      sign() {
+        if (this.signList.length == 0) {
+          Message({
+            type: 'error',
+            message: '该项目未设置付款计划，请设置付款计划后保存'
+          })
+          return false;
+        }
+
+        const signMoneyTotal = this.signList.reduce((pre, cur) => (pre + Number(cur.money || 0)),0)
+        if (signMoneyTotal !== Number(this.form.money)) {
+          Message({
+            type: 'warning',
+            message: '付款计划总金额与合同总金额不相等'
+          })
+          return
+        }
+
+        editorContract({
+          id: this.contractId,
+          number: this.form.number,
+          supply: this.form.supply,
+          has_continue: this.form.has_continue,
+          carry_department: this.form.carryDepartment,
+          money: this.form.money,
+          status: 2,
+          guarantee_money: this.form.guaranteeMoney,
+          guarantee_year: this.form.guaranteeYear,
+          start_date: this.form.time[0],
+          end_date: this.form.time[1],
+          date: this.form.date,
+          is_assurance: this.form.is_assurance,
+          assurance_money:this.form.assurance_money,
+          assurance_expire:this.form.assurance_expire
+        }).then(res => {
+          this.isShow = false
+          Message({
+            type: 'success',
+            message: '操作成功'
+          })
+          this.$emit('signSuccess')
+        })
+      },
+
+      async getContractSignList() {
+        const res = await getContractSign({
+          contract_id: this.contractId,
+          page: 1,
+          page_size: 999
+        })
+        this.signList = res.data
+      },
+      async getContract() {
+        const res = await detailContract({
+          id: this.contractId
+        })
+        this.contract = res;
+        Object.assign(this.form, res);
+        if (res.start_date && res.end_date)
+          this.form.time = [res.start_date, res.end_date];
+        else
+          this.form.time = [];
+        this.form.carryDepartment = res.carry_department;
+        this.form.guaranteeMoney = res.guarantee_money;
+        this.form.guaranteeYear = res.guarantee_year;
+        this.form.is_assurance = res.is_assurance === 1
+        this.form.assurance_expire = res.assurance_expire
+        this.form.assurance_money = res.assurance_money
+        console.log(this.form)
+      },
+      deleteContractSign(row) {
+        delContractSign({
+          id: row.id
+        }).then(res => {
+          this.getContractSignList()
+          Message({
+            type: 'success',
+            message: '操作成功'
+          })
+        })
+      },
+      submit() {
+        console.log(this.planForm)
+
+        addContractSign({
+          contract_id: this.contract.id,
+          date: `${new Date(this.planForm.date).getFullYear()}-${new Date(this.planForm.date).getMonth()+1}-${new Date(this.planForm.date).getDate()}`,
+          content: this.planForm.content,
+          money: this.planForm.money,
+          remark: this.planForm.remark
+        }).then(res => {
+          this.isShowAddPlan = false
+          this.getContractSignList()
+          console.log(res)
+          Message({
+            type: 'success',
+            message: '操作成功'
+          })
+        })
+      },
+
+      manyCreate () {
+        Promise.all(this.manyForm.map(i => {
+          return addContractSign({
+            contract_id: this.contract.id,
+            date: i.date,
+            content: '',
+            money: i.money,
+            remark: ''
+          })
+        })).then(res => {
+          this.getContractSignList()
+          Message({
+            type: 'success',
+            message: '操作成功'
+          })
+          this.isShowAddManyPlan = false;
+        })
+      },
+
+      //获取oa合同信息
+      async getOaContractInfo() {
+        try {
+          let resToken = await getOatoken();
+          let ourl =`/oa/admin/flow/view/${this.contract.join_last_flow_id}?oatoken=${resToken.oatoken}&get_raw=1`
+
+          console.log(ourl)
+          let url =
+            `${process.env.VUE_APP_OUT_URL}/admin/flow/view/${this.contract.join_last_flow_id}`
+            //?oatoken=${res.oatoken}&get_raw=1
+          let paras={oatoken:resToken.oatoken,get_raw:1};
+          const res = await httpCurl(paras,true,'/Api/flowDetail','GET',url);
+          console.log(res)
+          this.form.money = Number(res.flow['合同金额（元）'])
+          this.form.number = res.flow['合同编号']
+          this.form.supply = res.flow['承包商\\供应商']
+          this.form.carryDepartment = res.flow['执行部门']
+
+
+          // let res = await getOatoken()
+          // let url =
+          //   `/oa/admin/flow/view/${this.contract.join_last_flow_id}?oatoken=${res.oatoken}&get_raw=1`
+          // const oaInfo = await axios.get(url)
+          // this.form.money = Number(oaInfo.data.flow['合同金额（元）'])
+          // this.form.number = oaInfo.data.flow['合同编号']
+          // this.form.supply = oaInfo.data.flow['承包商\\供应商']
+          // this.form.carryDepartment = oaInfo.data.flow['执行部门']
+        } catch {
+
+        }
+
+      },
+
+
+      planMonthLists () {
+        const [startDate,endDate] = this.form.time;
+        const actStartDate = this.manySetting.startMonth;
+        const actStartYear = new Date(actStartDate).getFullYear();
+        const actStartMonth = new Date(actStartDate).getMonth();
+        let dates = [];
+        if (actStartDate && this.manySetting.day) {
+          let index = 0;
+          let nowDate = this.$moment(new Date(actStartYear,actStartMonth,this.manySetting.day)).add(index,'months')
+
+          while ((nowDate.valueOf() <= this.$moment(endDate).valueOf())) {
+            if (nowDate.valueOf() >= this.$moment(actStartDate).valueOf()) {
+              dates.push(nowDate.format('YYYY-MM-DD'));
+            }
+            index++;
+            nowDate = this.$moment(new Date(actStartYear,actStartMonth,this.manySetting.day)).add(index,'months');
+          }
+
+          let returnRes = dates.slice(0,this.manySetting.lastMonth)
+          this.manyForm = returnRes.map(i => ({
+            money: (Number(this.form.money || 0) / returnRes.length).toFixed(2),
+            date: i,
+            content: ""
+          }))
+        }
+      }
+    },
+    computed: {
+    },
+    watch: {
+      async contractId() {
+        await this.getContractSignList()
+        await this.getContract()
+        await this.getOaContractInfo()
+      }
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .many-plan {
+    &-item {
+      display: flex;
+
+      margin-bottom: 20px;
+      & > p {
+        flex-basis: 30%;
+        flex-shrink: 0;
+      }
+    }
+  }
+  .base-info {
+
+    &-title {
+      font-weight: 600;
+
+      padding: 0 10px;
+    }
+
+    &-item {
+      display: flex;
+
+      margin-top: 8px;
+
+      &-title {
+
+        padding: 0 20px;
+      }
+
+      &-content {}
+
+      &-unit {
+
+        margin-left: 20px;
+      }
+    }
+  }
+
+  .add-plan {
+    display: flex;
+    align-items: center;
+  }
+
+  .xy-table-item-label {
+    width: 200px;
+  }
+
+  .xy-table-item-price {
+    position: relative;
+
+    &::after {
+      position: absolute;
+      right: 0;
+      top: 0;
+      content: '（元）'
+    }
+  }
+
+  .xy-table-item-price-wan {
+    position: relative;
+
+    &::after {
+      position: absolute;
+      right: 0;
+      top: 0;
+      content: '（万元）'
+    }
+
+    ::v-deep .el-input__clear {
+      position: relative;
+      right: 46px;
+      z-index: 2;
+    }
+  }
+
+  .xy-table-item-year {
+    position: relative;
+
+    &::after {
+      position: absolute;
+      right: 4%;
+      top: 0;
+      content: '年'
+    }
+  }
+
+  ::v-deep .el-input__inner {
+    text-align: left;
+  }
+</style>
diff --git a/src/views/contract/components/paymentRegistration.vue b/src/views/contract/components/paymentRegistration.vue
index fcf9b0b..a819071 100644
--- a/src/views/contract/components/paymentRegistration.vue
+++ b/src/views/contract/components/paymentRegistration.vue
@@ -58,17 +58,18 @@
           </div>
         </div>
       </template>
-      <template #act_date>
+
+      <template v-slot:act_date v-if="currentStep === 1">
         <div class="xy-table-item">
-          <div class="xy-table-item-label">实付日期
-          </div>
+          <div class="xy-table-item-label">实付日期</div>
           <div class="xy-table-item-content">
             <el-date-picker v-model="paymentRegistrationForm.act_date" value-format="yyyy-MM-dd" style="width: 150px;">
             </el-date-picker>
           </div>
         </div>
       </template>
-      <template v-slot:applyMoney>
+
+      <template v-slot:applyMoney v-if="currentStep === 1">
         <div class="xy-table-item">
           <div class="xy-table-item-label">
             <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>申请付款金额
@@ -80,16 +81,16 @@
         </div>
       </template>
 
-      <template v-slot:audit_money>
+      <template v-slot:audit_money v-if="currentStep === 1">
         <div class="xy-table-item">
-          <div class="xy-table-item-label">审计金额
-          </div>
+          <div class="xy-table-item-label">审计金额</div>
           <div class="xy-table-item-content xy-table-item-price">
             <el-input clearable placeholder="请填写审计金额" v-model="form.audit_money" style="width: 150px;" />
           </div>
         </div>
       </template>
-      <template v-slot:deductionMoney>
+
+      <template v-slot:deductionMoney v-if="currentStep === 1">
         <div class="xy-table-item">
           <div class="xy-table-item-label">
             <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>本期扣款金额
@@ -101,17 +102,17 @@
         </div>
       </template>
 
-      <template v-slot:remark>
+      <template v-slot:remark v-if="currentStep === 1">
         <div class="xy-table-item">
-          <div class="xy-table-item-label">备注
-          </div>
+          <div class="xy-table-item-label">备注</div>
           <div class="xy-table-item-content">
             <el-input type="textarea" clearable placeholder="进度款日期：2022.6.8-2022.7.7"
               v-model="paymentRegistrationForm.remark" style="width: 300px;" />
           </div>
         </div>
       </template>
-      <template v-slot:type>
+
+      <template v-slot:type v-if="currentStep === 1">
         <div class="xy-table-item">
           <div class="xy-table-item-label">
             <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>款项类型
@@ -125,35 +126,54 @@
           </div>
         </div>
       </template>
-      <template v-slot:isLast>
+
+      <template v-slot:isLast v-if="currentStep === 1">
         <div class="xy-table-item">
           <div class="xy-table-item-label" style="width: 200px">
             <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>是否为最后一笔
           </div>
           <div class="xy-table-item-content">
             <el-switch v-model="paymentRegistrationForm.isLast" />
-            <!--                       @change="toggleSelection"-->
           </div>
         </div>
       </template>
-      <template v-slot:extraFormBottom v-if="false">
-        <Input search enter-button="搜 索" placeholder="搜索预算计划.." v-model="searchContent" @on-search="getBudgets" />
-        <xy-table :list="plans" :show-index="false" :table-item="planTable" :height="310" style="margin-top: 10px;"
-          ref="planTable" @select="selectPlan">
-          <template v-slot:btns>
-            <el-table-column label="使用金额" header-align="center">
-              <template slot-scope="scope">
-                <Input :value="scope.row.useMoney" @input="(e)=>scope.row.useMoney = e" />
-              </template>
-            </el-table-column>
-          </template>
-        </xy-table>
-
-        <div style="display: flex;justify-content: flex-end;">
-          <Page :total="planTotal" show-elevator @on-change="pageChange" />
+
+      <template v-slot:extraFormBottom>
+        <div v-if="currentStep === 2" class="payment-table-section">
+          <div class="section-title">
+            事后支付表格
+            <el-button type="text" @click="openZoomedTable" style="margin-left: 10px;">
+              <i class="el-icon-zoom-in"></i> 放大查看
+            </el-button>
+          </div>
+          <div v-if="forms && forms.length > 0" v-html="forms" ref="zoomedForms"></div>
+          <div v-else-if="contractTemplate" v-html="contractTemplate" ref="zoomedTemplate"></div>
+          <div v-else class="no-data">暂无支付表格数据</div>
+        </div>
+      </template>
+
+      <template v-slot:footerContent>
+        <div class="dialog-footer">
+          <el-button v-if="currentStep === 2" @click="currentStep = 1">上一步</el-button>
+          <el-button v-if="currentStep === 1 && forms && forms.length > 0" @click="nextStep">下一步</el-button>
+          <el-button v-if="currentStep === 2 || (currentStep === 1 && (!forms || !forms.length))" type="primary" @click="submit">确定</el-button>
+          <el-button @click="resetForm">重置</el-button>
         </div>
       </template>
     </xy-dialog>
+
+    <!-- 放大后的表格弹窗 -->
+    <el-dialog
+      title="事后支付表格"
+      :visible.sync="showZoomedTable"
+      width="80%"
+      :append-to-body="true"
+      custom-class="zoomed-table-dialog"
+      @close="handleZoomedDialogClose">
+      <div v-if="forms && forms.length > 0" v-html="forms" ref="previewPaymentForm"></div>
+      <div v-else-if="contractTemplate" v-html="contractTemplate" ref="previewPaymentForm"></div>
+      <div v-else class="no-data">暂无支付表格数据</div>
+    </el-dialog>
   </div>
 </template>
 
@@ -179,9 +199,35 @@
     parseTime
   } from "@/utils";
 
+  // 添加同步表单DOM到HTML的函数
+  function syncFormDomToHtml(dom, contractTemplateFields) {
+    if (!dom) return '';
+    const inputs = dom.querySelectorAll('input, select, textarea');
+    inputs.forEach(input => {
+      const fieldName = input.getAttribute('data-field');
+      if (fieldName && contractTemplateFields) {
+        const field = contractTemplateFields.find(f => f.field === fieldName);
+        if (field) {
+          if (input.type === 'checkbox' || input.type === 'radio') {
+            const checkedInput = dom.querySelector(`[data-field="${fieldName}"]:checked`);
+            field.value = checkedInput ? checkedInput.value : '';
+            if (checkedInput) {
+              checkedInput.setAttribute('checked', 'checked');
+            }
+          } else {
+            field.value = input.value;
+            input.setAttribute('value', input.value);
+          }
+        }
+      }
+    });
+    return dom.innerHTML;
+  }
+
   export default {
     data() {
       return {
+        currentStep: 1, // 当前步骤
         searchContent: "",
         planTotal: 0,
         pageIndex: 1,
@@ -190,6 +236,8 @@
         planTypes: [],
         contract: {},
         payment: [], //合同关联的付款登记
+        contractTemplate: null, // 合同模板HTML
+        forms: null, // 实际表单HTML
         payTable: [{
             label: '申请金额',
             prop: 'apply_money',
@@ -279,6 +327,7 @@
             align: 'right'
           }
         ],
+        showZoomedTable: false, // 控制放大表格弹窗的显示
       }
     },
     methods: {
@@ -353,7 +402,21 @@
           page_size: 999
         })
 
-        this.payment = res.data
+        this.payment = res.data;
+        console.log(this.contract.contract_template)
+        console.log(this.contract.forms)
+        // 获取合同模板和表单数据
+        if (this.contract.contract_template) {
+          this.contractTemplate = this.contract.contract_template.template;
+          this.forms = this.contract.forms;
+          
+          // 确保 contract_template_fields 存在
+          if (!this.contract.contract_template.contract_template_fields) {
+            this.contract.contract_template.contract_template_fields = this.contract.other_data || [];
+          }
+          
+          console.log('Contract template fields:', this.contract.contract_template.contract_template_fields);
+        }
       },
 
       submit() {
@@ -365,13 +428,19 @@
           is_end: this.paymentRegistrationForm.isLast ? 1 : 0,
           remark: this.paymentRegistrationForm.remark,
           audit_money: this.paymentRegistrationForm.audit_money,
+          // 添加事后支付表格数据
+          forms: this.forms,
+          other_data: this.contract.contract_template?.contract_template_fields || []
         }
         addFundLog(data).then(res => {
           this.isShowPaymentRegistration = false
           //付款申请后同时更新一下合同中审计金额
           editorContract({
             id: this.contract.id,
-            audit_money: this.form.audit_money
+            audit_money: this.form.audit_money,
+            // 同时更新合同的事后支付表格数据
+            forms: this.forms,
+            other_data: this.contract.contract_template?.contract_template_fields || []
           }).then(r => {
             Message({
               type: 'success',
@@ -433,6 +502,44 @@
           this.$refs['planTable'].clearSelection();
         }
       },
+      nextStep() {
+        // 使用和提交一样的验证逻辑
+        this.$refs['paymentRegistration'].$refs['elForm'].validate().then(res => {
+          if (res) {
+            this.currentStep = 2;
+          }
+        }).catch(err => {
+          this.$Message.warning({
+            content: '请填写完整信息',
+            duration: 1
+          });
+        });
+      },
+
+      resetForm() {
+        this.currentStep = 1;
+        this.$refs['paymentRegistration'].reset();
+      },
+
+      // 打开放大预览前，先同步当前表单数据
+      openZoomedTable() {
+        const dom = this.$refs.zoomedForms || this.$refs.zoomedTemplate;
+        if (dom && this.contract.contract_template) {
+          console.log(this.contract.contract_template.contract_template_fields)
+          this.forms = syncFormDomToHtml(dom, this.contract.contract_template.contract_template_fields);
+          this.contract.forms = this.forms;
+        }
+        this.showZoomedTable = true;
+      },
+
+      handleZoomedDialogClose() {
+        const dom = this.$refs.previewPaymentForm;
+        if (dom && this.contract.contract_template) {
+          this.forms = syncFormDomToHtml(dom, this.contract.contract_template.contract_template_fields);
+          this.contract.forms = this.forms;
+        }
+        this.showZoomedTable = false;
+      },
     },
     computed: {
       priceFormat() {
@@ -444,7 +551,8 @@
     watch: {
       isShowPaymentRegistration(newVal) {
         if (newVal) {
-          this.getBudgets()
+          this.getBudgets();
+          this.currentStep = 1; // 重置到第一步
         }
       }
     },
@@ -456,14 +564,11 @@
 
 <style scoped lang="scss">
   .payment-registration {
-
     &-row {
       display: flex;
-
       padding: 6px 0;
 
       &-title {
-
         padding: 0 10px;
       }
 
@@ -471,6 +576,44 @@
     }
   }
 
+  .payment-table-section {
+    margin-top: 20px;
+    padding: 0 20px;
+
+    .section-title {
+      font-size: 14px;
+      font-weight: bold;
+      margin-bottom: 10px;
+      color: #333;
+      display: flex;
+      align-items: center;
+    }
+
+    .no-data {
+      text-align: center;
+      color: #909399;
+      padding: 20px 0;
+    }
+
+    ::v-deep table {
+      width: 100%;
+      border-collapse: collapse;
+      margin-bottom: 20px;
+
+      th, td {
+        border: 1px solid #EBEEF5;
+        padding: 8px;
+        text-align: center;
+      }
+
+      th {
+        background-color: #F5F7FA;
+        color: #606266;
+        font-weight: 500;
+      }
+    }
+  }
+
   .xy-table-item-label {
     width: 140px;
   }
@@ -492,4 +635,13 @@
       z-index: 2;
     }
   }
+
+  ::v-deep .zoomed-table-dialog {
+    .el-dialog__body {
+      padding: 20px;
+      max-height: 70vh;
+      overflow-y: auto;
+    }
+  }
 </style>
+
diff --git a/src/views/contract/components/paymentRegistration_bk.vue b/src/views/contract/components/paymentRegistration_bk.vue
new file mode 100644
index 0000000..fcf9b0b
--- /dev/null
+++ b/src/views/contract/components/paymentRegistration_bk.vue
@@ -0,0 +1,495 @@
+<template>
+  <div>
+    <!--    付款登记-->
+    <xy-dialog title="付款登记" :is-show.sync="isShowPaymentRegistration" type="form" class="payment-registration"
+      :form="paymentRegistrationForm" :rules="paymentRegistrationRules" @submit="submit" ref="paymentRegistration">
+      <template v-slot:extraFormTop>
+        <div class="payment-registration-row">
+          <div class="payment-registration-row-title">受款单位</div>
+          <div class="payment-registration-row-content">{{contract.supply}}</div>
+        </div>
+        <div class="payment-registration-row">
+          <div class="payment-registration-row-title">合同名称</div>
+          <div class="payment-registration-row-content">{{contract.name}}</div>
+        </div>
+        <div class="payment-registration-row">
+          <div class="payment-registration-row-title">合同金额</div>
+          <div class="payment-registration-row-content">{{priceFormat(contract.money)}} （元）</div>
+        </div>
+        <div style="display: flex">
+          <div class="payment-registration-row">
+            <div class="payment-registration-row-title">已申请金额</div>
+            <div class="payment-registration-row-content">{{totalApplyMoney()}} （元）</div>
+          </div>
+          <div class="payment-registration-row">
+            <div class="payment-registration-row-title">已申请笔数</div>
+            <div class="payment-registration-row-content">{{payment.length}}</div>
+          </div>
+        </div>
+        <div style="display: flex">
+          <div class="payment-registration-row">
+            <div class="payment-registration-row-title">已付金额</div>
+            <div class="payment-registration-row-content">{{totalMoney()}} （元）</div>
+          </div>
+          <div class="payment-registration-row">
+            <div class="payment-registration-row-title">支付占比</div>
+            <div class="payment-registration-row-content">{{percentPay()}}%</div>
+          </div>
+          <div class="payment-registration-row">
+            <div class="payment-registration-row-title">已付笔数</div>
+            <div class="payment-registration-row-content">{{actNumsTotal()}}</div>
+            <div class="payment-registration-row-content" style="color: #ff0000;padding-left: 16px;cursor: pointer;">
+              <Poptip :transfer="true">
+                <div>点击查看列表</div>
+                <template v-slot:content>
+                  <template v-if="payment&&payment.length>0">
+                    <xy-table :height="200" :list="payment" :table-item="payTable">
+                      <template v-slot:btns>
+                        <p></p>
+                      </template>
+                    </xy-table>
+                  </template>
+                  <template v-else>
+                    <div style="text-align: center">暂无已付笔数</div>
+                  </template>
+                </template>
+              </Poptip>
+            </div>
+          </div>
+        </div>
+      </template>
+      <template #act_date>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">实付日期
+          </div>
+          <div class="xy-table-item-content">
+            <el-date-picker v-model="paymentRegistrationForm.act_date" value-format="yyyy-MM-dd" style="width: 150px;">
+            </el-date-picker>
+          </div>
+        </div>
+      </template>
+      <template v-slot:applyMoney>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>申请付款金额
+          </div>
+          <div class="xy-table-item-content xy-table-item-price">
+            <el-input clearable placeholder="请填写付款金额" v-model="paymentRegistrationForm.applyMoney"
+              style="width: 150px;" @input="checkIsEnd"/>
+          </div>
+        </div>
+      </template>
+
+      <template v-slot:audit_money>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">审计金额
+          </div>
+          <div class="xy-table-item-content xy-table-item-price">
+            <el-input clearable placeholder="请填写审计金额" v-model="form.audit_money" style="width: 150px;" />
+          </div>
+        </div>
+      </template>
+      <template v-slot:deductionMoney>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>本期扣款金额
+          </div>
+          <div class="xy-table-item-content xy-table-item-price">
+            <el-input clearable placeholder="请填写扣款金额" v-model="paymentRegistrationForm.deductionMoney"
+              style="width: 150px;" />
+          </div>
+        </div>
+      </template>
+
+      <template v-slot:remark>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">备注
+          </div>
+          <div class="xy-table-item-content">
+            <el-input type="textarea" clearable placeholder="进度款日期：2022.6.8-2022.7.7"
+              v-model="paymentRegistrationForm.remark" style="width: 300px;" />
+          </div>
+        </div>
+      </template>
+      <template v-slot:type>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>款项类型
+          </div>
+          <div class="xy-table-item-content">
+            <el-select placeholder="选择款项类型或直接录入其他类型" v-model="paymentRegistrationForm.type" style="width: 150px;"
+              filterable allow-create clearable>
+              <el-option v-for="item in paymentType" :key="item" :label="item" :value="item">
+              </el-option>
+            </el-select>
+          </div>
+        </div>
+      </template>
+      <template v-slot:isLast>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label" style="width: 200px">
+            <span style="color: red;font-weight: 600;padding-right: 4px;">*</span>是否为最后一笔
+          </div>
+          <div class="xy-table-item-content">
+            <el-switch v-model="paymentRegistrationForm.isLast" />
+            <!--                       @change="toggleSelection"-->
+          </div>
+        </div>
+      </template>
+      <template v-slot:extraFormBottom v-if="false">
+        <Input search enter-button="搜 索" placeholder="搜索预算计划.." v-model="searchContent" @on-search="getBudgets" />
+        <xy-table :list="plans" :show-index="false" :table-item="planTable" :height="310" style="margin-top: 10px;"
+          ref="planTable" @select="selectPlan">
+          <template v-slot:btns>
+            <el-table-column label="使用金额" header-align="center">
+              <template slot-scope="scope">
+                <Input :value="scope.row.useMoney" @input="(e)=>scope.row.useMoney = e" />
+              </template>
+            </el-table-column>
+          </template>
+        </xy-table>
+
+        <div style="display: flex;justify-content: flex-end;">
+          <Page :total="planTotal" show-elevator @on-change="pageChange" />
+        </div>
+      </template>
+    </xy-dialog>
+  </div>
+</template>
+
+<script>
+  import {
+    getparameter
+  } from "@/api/system/dictionary"
+  import {
+    getFundLog,
+    addFundLog
+  } from "@/api/paymentRegistration/fundLog"
+  import {
+    getBudget
+  } from "@/api/budget/budget";
+  import {
+    detailContract,
+    editorContract
+  } from "@/api/contract/contract";
+  import {
+    Message
+  } from "element-ui";
+  import {
+    parseTime
+  } from "@/utils";
+
+  export default {
+    data() {
+      return {
+        searchContent: "",
+        planTotal: 0,
+        pageIndex: 1,
+        //付款登记
+        plans: [],
+        planTypes: [],
+        contract: {},
+        payment: [], //合同关联的付款登记
+        payTable: [{
+            label: '申请金额',
+            prop: 'apply_money',
+            sortable: false,
+            width: 160,
+            align: 'right'
+          },
+          {
+            label: '已付金额',
+            prop: 'act_money',
+            sortable: false,
+            width: 160,
+            align: 'right'
+          },
+          {
+            label: '时间',
+            prop: 'created_at',
+            sortable: false,
+            width: 120,
+            formatter: (t1, t2, value) => {
+              return parseTime(new Date(value), '{y}-{m}-{d}')
+            }
+          }
+        ],
+        paymentType: ["预付款","进度款", "结算款", "质保金"],
+        isShowPaymentRegistration: false,
+        paymentRegistrationForm: {
+          applyMoney: "",
+          deductionMoney: "",
+          audit_money: "",
+          act_date: '',
+          type: "",
+          isLast: false,
+          plan: [],
+          remark: ""
+        },
+        form: {
+          audit_money: 0
+        },
+        paymentRegistrationRules: {
+          applyMoney: [{
+              required: true,
+              message: "必填"
+            },
+            {
+              pattern: /(^-?(?:\d+|\d{1,3}(?:,\d{3})+)(?:\.\d{1,2})?$)/,
+              message: '必须为数字'
+            }
+          ],
+          deductionMoney: [{
+              required: true,
+              message: "必填"
+            },
+            {
+              pattern: /(^-?(?:\d+|\d{1,3}(?:,\d{3})+)(?:\.\d{1,2})?$)/,
+              message: '必须为数字'
+            }
+          ],
+          type: [{
+            required: true,
+            message: "必选"
+          }]
+        },
+        planTable: [{
+            sortable: false,
+            width: 36,
+            type: 'selection'
+          },
+          {
+            label: "分类",
+            prop: 'type',
+            formatter: (cell, data, value) => {
+              let res = this.planTypes.filter(item => {
+                return item.id === value
+              })
+              return res[0]?.value || '未知'
+            }
+          },
+          {
+            label: "名称",
+            prop: 'name',
+            align: 'left'
+          },
+          {
+            label: "计划金额",
+            prop: 'money',
+            align: 'right'
+          }
+        ],
+      }
+    },
+    methods: {
+      checkIsEnd (e) {
+        this.paymentRegistrationForm.isLast = (Number(this.totalMoney()) + Number(e)) >= (this.contract.money * 0.95);
+      },
+
+      async getPlanTypes() {
+        const res = await getparameter({
+          number: 'money_way'
+        })
+        this.planTypes = res.detail
+      },
+
+      //翻页
+      pageChange(e) {
+        this.pageIndex = e
+        this.getBudgets()
+      },
+
+      //合计申请金额
+      totalApplyMoney() {
+        let total = 0.00
+        this.payment.map(item => {
+          total += Number(item.apply_money)
+        })
+        return total.toFixed(2)
+      },
+      //合计金额
+      totalMoney() {
+        let total = 0.00
+        this.payment.map(item => {
+          total += Number(item.act_money)
+        })
+        return total.toFixed(2)
+      },
+      //已付笔数
+      actNumsTotal() {
+        let total = 0
+        this.payment.map(item => {
+          if (Number(item.act_money)) {
+            total++
+          }
+        })
+        return total
+      },
+      //支付占比
+      percentPay() {
+        let total = this.totalMoney()
+        return ((total / this.contract.money) * 100).toFixed(2) || 0
+      },
+
+      //获取合同信息
+      async getContract(info) {
+        this.contract = await detailContract({
+          id: info.id
+        });
+
+        this.paymentRegistrationForm.plan = this.contract.plans.map(item => {
+          return {
+            plan_id: item.id,
+            use_money: item.useMoney,
+            new_money: item.money,
+          }
+        });
+
+        this.form.audit_money = this.contract.audit_money;
+
+        const res = await getFundLog({
+          contract_id: this.contract.id,
+          page: 1,
+          page_size: 999
+        })
+
+        this.payment = res.data
+      },
+
+      submit() {
+        let data = {
+          contract_id: this.contract.id,
+          apply_money: this.paymentRegistrationForm.applyMoney,
+          discount_money: this.paymentRegistrationForm.deductionMoney,
+          type: this.paymentRegistrationForm.type,
+          is_end: this.paymentRegistrationForm.isLast ? 1 : 0,
+          remark: this.paymentRegistrationForm.remark,
+          audit_money: this.paymentRegistrationForm.audit_money,
+        }
+        addFundLog(data).then(res => {
+          this.isShowPaymentRegistration = false
+          //付款申请后同时更新一下合同中审计金额
+          editorContract({
+            id: this.contract.id,
+            audit_money: this.form.audit_money
+          }).then(r => {
+            Message({
+              type: 'success',
+              message: "操作成功"
+            })
+          });
+          this.$refs['paymentRegistration'].reset()
+        })
+      },
+
+      //计划
+      //获取预算计划
+      async getBudgets() {
+        let res = await getBudget({
+          name: this.searchContent,
+          page_size: 10,
+          page: this.pageIndex
+        })
+        this.plans = res.list.data
+        this.planTotal = res.list.total
+
+        // this.toggleSelection(this.paymentRegistrationForm.plan.map(item => {
+        //   return item.plan_id
+        // }))
+      },
+      planPageChange(e) {
+        this.plansPageIndex = e
+        this.getBudgets()
+      },
+      selectPlan(sel, row) {
+        if (sel) {
+          this.paymentRegistrationForm.plan = sel.map(item => {
+            return {
+              plan_id: item.id,
+              use_money: item.useMoney,
+              new_money: item.money
+            }
+          })
+        } else {
+          this.paymentRegistrationForm.plan = []
+        }
+      },
+      toggleSelection(e) {
+        if (!e) {
+          return
+        }
+        let plans = this.paymentRegistrationForm.plan.map(item => {
+          return item.plan_id
+        })
+        if (plans) {
+          this.plans.filter(plan => {
+            return plans.includes(plan.id)
+          }).map(row => {
+            this.$nextTick(() => {
+              this.$refs['planTable'].toggleRowSelection(row);
+            })
+          })
+        } else {
+          this.$refs['planTable'].clearSelection();
+        }
+      },
+    },
+    computed: {
+      priceFormat() {
+        return function(price) {
+          return Number(price).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,')
+        }
+      }
+    },
+    watch: {
+      isShowPaymentRegistration(newVal) {
+        if (newVal) {
+          this.getBudgets()
+        }
+      }
+    },
+    mounted() {
+      this.getPlanTypes()
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .payment-registration {
+
+    &-row {
+      display: flex;
+
+      padding: 6px 0;
+
+      &-title {
+
+        padding: 0 10px;
+      }
+
+      &-content {}
+    }
+  }
+
+  .xy-table-item-label {
+    width: 140px;
+  }
+
+  .xy-table-item-price {
+    position: relative;
+
+    &::after {
+      z-index: 1;
+      position: absolute;
+      right: 0;
+      top: 0;
+      content: '（元）'
+    }
+
+    ::v-deep .el-input__clear {
+      position: relative;
+      right: 30px;
+      z-index: 2;
+    }
+  }
+</style>
diff --git a/src/views/contract/contractList.vue b/src/views/contract/contractList.vue
index 025ca30..c61b6f5 100644
--- a/src/views/contract/contractList.vue
+++ b/src/views/contract/contractList.vue
@@ -177,6 +177,15 @@
                 </template>
               </template>
 
+                               <!-- 添加打印按钮 -->
+    
+                  <template v-if="scope.row.is_simple === 1&&scope.row.status === 1">
+                <Button class="slot-btns-item" size="small" type="primary"
+                        @click="checkFormsBeforePayment(scope.row)">
+                  付款登记
+                </Button>
+              </template>
+
               <template v-if="scope.row.status === 1 && scope.row.join_status === 3">
                 <Button class="slot-btns-item" size="small" type="primary"
                         @click="$refs['contractSign'].isShow = true,$refs['contractSign'].contractId = scope.row.id">
@@ -262,7 +271,7 @@
           <span class="step-number">2</span>
           <span class="step-text">基本信息</span>
         </div>
-        <div class="step" :class="{ active: currentStep === 3 }">
+        <div class="step" :class="{ active: currentStep === 3 }" v-if="currentStep > 1 && form.before_contract_template">
           <span class="step-number">3</span>
           <span class="step-text">附件信息</span>
         </div>
@@ -272,31 +281,31 @@
       <div class="step-content">
         <!-- Step 1: Type Selection -->
         <div v-show="currentStep === 1" class="step-content">
-          <div class="form-group">
+          <div class="form-group" v-if="categoryOptions && categoryOptions.length > 0">
             <label class="form-label">分类</label>
             <Select v-model="form.category" @on-change="handleCategoryChange" placeholder="请选择分类" class="form-input">
               <Option v-for="item in categoryOptions" :key="item.id" :value="item.id">{{ item.value || item.name }}</Option>
             </Select>
           </div>
-          <div class="form-group">
+          <div class="form-group" v-if="affairTypeOptions && affairTypeOptions.length > 0">
             <label class="form-label">事项类型</label>
             <Select v-model="form.affairType" @on-change="handleAffairTypeChange" placeholder="请选择事项类型" class="form-input">
               <Option v-for="item in affairTypeOptions" :key="item.id" :value="item.id">{{ item.value || item.name }}</Option>
             </Select>
           </div>
-          <div class="form-group">
+          <div class="form-group" v-if="contractTypeOptions && contractTypeOptions.length > 0">
             <label class="form-label">合同类型</label>
             <Select v-model="form.contractType" @on-change="handleContractTypeChange" placeholder="请选择合同类型" class="form-input">
               <Option v-for="item in contractTypeOptions" :key="item.id" :value="item.id">{{ item.value || item.name }}</Option>
             </Select>
           </div>
-          <div class="form-group">
+          <div class="form-group" v-if="purchaseFormOptions && purchaseFormOptions.length > 0">
             <label class="form-label">采购形式</label>
             <Select v-model="form.purchaseForm" @on-change="handlePurchaseFormChange" placeholder="请选择采购形式" class="form-input">
               <Option v-for="item in purchaseFormOptions" :key="item.id" :value="item.id">{{ item.value || item.name }}</Option>
             </Select>
           </div>
-          <div class="form-group">
+          <div class="form-group" v-if="purchaseMethodOptions && purchaseMethodOptions.length > 0">
             <label class="form-label">采购方式</label>
             <Select v-model="form.purchaseMethod" @on-change="handlePurchaseMethodChange" placeholder="请选择采购方式" class="form-input">
               <Option v-for="item in purchaseMethodOptions" :key="item.id" :value="item.id">{{ item.value || item.name }}</Option>
@@ -310,23 +319,23 @@
           <div class="template-info">
             <div class="info-title">合同类型</div>
             <div class="info-content">
-              <div class="info-item">
+              <div class="info-item" v-if="form.category && getCategoryName(form.category)">
                 <span class="label">合同分类：</span>
                 <span class="value">{{ getCategoryName(form.category) }}</span>
               </div>
-              <div class="info-item">
+              <div class="info-item" v-if="form.affairType && getAffairTypeName(form.affairType)">
                 <span class="label">事务类型：</span>
                 <span class="value">{{ getAffairTypeName(form.affairType) }}</span>
               </div>
-              <div class="info-item">
+              <div class="info-item" v-if="form.contractType && getContractTypeName(form.contractType)">
                 <span class="label">合同类型：</span>
                 <span class="value">{{ getContractTypeName(form.contractType) }}</span>
               </div>
-              <div class="info-item">
+              <div class="info-item" v-if="form.purchaseForm && getPurchaseFormName(form.purchaseForm)">
                 <span class="label">采购形式：</span>
                 <span class="value">{{ getPurchaseFormName(form.purchaseForm) }}</span>
               </div>
-              <div class="info-item">
+              <div class="info-item" v-if="form.purchaseMethod && getPurchaseMethodName(form.purchaseMethod)">
                 <span class="label">采购方式：</span>
                 <span class="value">{{ getPurchaseMethodName(form.purchaseMethod) }}</span>
               </div>
@@ -455,11 +464,11 @@
         </div>
 
         <!-- Step 3: Attachment Information -->
-        <div v-show="currentStep === 3" class="step-content">
+        <div v-show="currentStep === 3 && form.before_contract_template" class="step-content">
           <!-- 事前支付表格 -->
           <div v-if="form.before_contract_template && !form.showAfterPayment" class="form-section">
             <div class="section-title" style="display: flex; align-items: center;">
-              事前支付表格
+              事前审批表格
               <el-button type="text" icon="el-icon-zoom-in" @click="openPaymentFormPreview('before')">放大</el-button>
             </div>
             <div v-if="!showPaymentFormPreview || previewType !== 'before'">
@@ -508,43 +517,21 @@
           <!-- 正常编辑模式时的按钮控制 -->
           <template v-else>
             <Button v-if="currentStep > 1" @click="prevStep" class="action-button">上一步</Button>
-            <Button v-if="currentStep < 3" type="primary" @click="nextStep" class="action-button">下一步</Button>
-            <!-- 当有事前支付表格且未显示事后支付表格时 -->
-            <template v-if="currentStep === 3 && form.before_contract_template && !form.showAfterPayment">
-              <!-- 新增模式下显示跳过按钮 -->
-              <template v-if="!isEditMode">
-                <Button type="primary" @click="nextPaymentStep" class="action-button">下一步</Button>
-                <Button @click="skipPrePayment" class="action-button">跳过，稍后填写</Button>
+            <!-- 第二步时，根据是否有事前支付表格决定显示下一步还是提交按钮 -->
+            <template v-if="currentStep === 2">
+              <template v-if="form.before_contract_template">
+                <Button type="primary" @click="nextStep" class="action-button">下一步</Button>
               </template>
-              <!-- 编辑模式下，只有当before_forms为空时才显示跳过按钮 -->
-              <template v-else-if="(!form.before_forms || form.before_forms.trim() === '' || !form.skipBeforeTemplate)">
-                <Button type="primary" @click="nextPaymentStep" class="action-button">下一步</Button>
-                <Button @click="skipPrePayment" class="action-button">跳过，稍后填写</Button>
-              </template>
-              <!-- 编辑模式下，如果before_forms不为空，只显示下一步按钮 -->
-              <template v-else>
-                <Button type="primary" @click="nextPaymentStep" class="action-button">下一步</Button>
-              </template>
-            </template>
-            <!-- 当显示事后支付表格时 -->
-            <template v-else-if="currentStep === 3 && form.contract_template">
-              <!-- 新增模式下显示跳过按钮 -->
-              <template v-if="!isEditMode">
-                <Button type="primary" @click="submit" class="action-button">提交</Button>
-                <Button @click="skipPostPayment" class="action-button">跳过，稍后填写</Button>
-              </template>
-              <!-- 编辑模式下，只有当forms为空时才显示跳过按钮 -->
-              <template v-else-if="(!form.forms || form.forms.trim() === '' || !form.skipAfterTemplate)">
-                <Button type="primary" @click="submit" class="action-button">提交</Button>
-                <Button @click="skipPostPayment" class="action-button">跳过，稍后填写</Button>
-              </template>
-              <!-- 编辑模式下，如果forms不为空，只显示提交按钮 -->
               <template v-else>
                 <Button type="primary" @click="submit" class="action-button">提交</Button>
               </template>
             </template>
-            <!-- 当没有支付表格时，只显示"提交"按钮 -->
-            <Button v-else-if="currentStep === 3" type="primary" @click="submit" class="action-button">提交</Button>
+            <!-- 第三步时的按钮控制 -->
+            <template v-else-if="currentStep === 3">
+              <Button type="primary" @click="submit" class="action-button">提交</Button>
+            </template>
+            <!-- 第一步时显示下一步按钮 -->
+            <Button v-else-if="currentStep === 1" type="primary" @click="nextStep" class="action-button">下一步</Button>
           </template>
           <Button @click="cancel" class="action-button">取消</Button>
         </div>
@@ -650,6 +637,10 @@
       </div>
     </Modal>
 
+    <!-- 添加打印组件 -->
+    <printRegistration ref="printRegistration"></printRegistration>
+    <printFundApproval ref="printFundApproval"></printFundApproval>
+    <printPaymentForm ref="printPaymentForm"></printPaymentForm>
   </div>
 </template>
 
@@ -700,6 +691,9 @@ import govPlane from './components/govPlane.vue';
 import {
   download
 } from '@/utils/downloadRequest'
+import printRegistration from "./components/printRegistration";
+import printFundApproval from "./components/printFundApproval";
+import printPaymentForm from "./components/printPaymentForm";
 
 function syncFormDomToHtml(dom, contractTemplateFields) {
   if (!dom) return '';
@@ -733,6 +727,9 @@ export default {
     contractSign,
     contractPaymentRegistration,
     govPlane,
+    printRegistration,
+    printFundApproval,
+    printPaymentForm,
   },
   data() {
     var planPass = (rule, value, callback) => {
@@ -2169,10 +2166,22 @@ export default {
 
       // 获取当前选中的分类
       const selectedCategory = this.categoryOptions.find(item => item.id === this.form.category)
-      if (!selectedCategory) return
+      if (!selectedCategory) {
+        // 如果有分类选项但没有选中值，自动选择第一个
+        if (this.categoryOptions && this.categoryOptions.length > 0) {
+          this.form.category = this.categoryOptions[0].id
+          this.handleCategoryChange()
+        }
+        return
+      }
 
       // 更新事项类型选项
       this.affairTypeOptions = selectedCategory.children || []
+      // 如果有事项类型选项但没有选中值，自动选择第一个
+      if (this.affairTypeOptions.length > 0 && !this.form.affairType) {
+        this.form.affairType = this.affairTypeOptions[0].id
+        this.handleAffairTypeChange()
+      }
 
       // 获取当前选中的事项类型
       const selectedAffairType = this.affairTypeOptions.find(item => item.id === this.form.affairType)
@@ -2180,6 +2189,11 @@ export default {
 
       // 更新合同类型选项
       this.contractTypeOptions = selectedAffairType.children || []
+      // 如果有合同类型选项但没有选中值，自动选择第一个
+      if (this.contractTypeOptions.length > 0 && !this.form.contractType) {
+        this.form.contractType = this.contractTypeOptions[0].id
+        this.handleContractTypeChange()
+      }
 
       // 获取当前选中的合同类型
       const selectedContractType = this.contractTypeOptions.find(item => item.id === this.form.contractType)
@@ -2187,6 +2201,11 @@ export default {
 
       // 更新采购形式选项
       this.purchaseFormOptions = selectedContractType.children || []
+      // 如果有采购形式选项但没有选中值，自动选择第一个
+      if (this.purchaseFormOptions.length > 0 && !this.form.purchaseForm) {
+        this.form.purchaseForm = this.purchaseFormOptions[0].id
+        this.handlePurchaseFormChange()
+      }
 
       // 获取当前选中的采购形式
       const selectedPurchaseForm = this.purchaseFormOptions.find(item => item.id === this.form.purchaseForm)
@@ -2206,6 +2225,12 @@ export default {
       else if (selectedPurchaseForm.children) {
         this.purchaseMethodOptions = selectedPurchaseForm.children
       }
+      
+      // 如果有采购方式选项但没有选中值，自动选择第一个
+      if (this.purchaseMethodOptions.length > 0 && !this.form.purchaseMethod) {
+        this.form.purchaseMethod = this.purchaseMethodOptions[0].id
+        this.handlePurchaseMethodChange()
+      }
     },
 
     nextStep() {
@@ -2273,8 +2298,6 @@ export default {
           }
         });
 
-        console.log(missingFields);
-
         if (missingFields.length > 0) {
           this.$Message.warning('请填写所有必填项');
           return;
@@ -2291,14 +2314,14 @@ export default {
           this.form.moneyWay = [];
         }
 
-        // 如果存在事前支付表格，则跳转到事前支付表格
-        if (this.form.before_contract_template) {
-          this.form.showAfterPayment = false;
+        // 检查是否有支付表格
+        if (!this.form.before_contract_template) {
+          // 如果没有事前支付表格，直接提交
+          this.submit();
+        } else {
+          // 如果有事前支付表格，进入第三步
+          this.currentStep++;
         }
-
-        this.currentStep++;
-      } else if (this.currentStep === 3) {
-        this.currentStep++;
       }
     },
 
@@ -3180,22 +3203,6 @@ export default {
         const res = await detailContract({ id: row.id });
         if (res) {
           console.log("detail", res);
-          
-          // // 检查是否有事前支付表格且未填写
-          // if (res.before_contract_template && res.before_forms.length === 0) {
-          //   // 有事前支付表格但未填写,进入编辑模式
-          //   await this.handleEdit(row, true);
-          //   return;
-          // }
-          
-          // // 检查是否有事后支付表格且未填写
-          // if (res.contract_template && res.forms.length === 0) {
-          //   // 有事后支付表格但未填写,进入编辑模式
-          //   await this.handleEdit(row, true);
-          //   return;
-          // }
-          
-          // 如果都有填写或没有配置支付表格,则继续付款登记流程
           this.$refs['paymentRegistration'].getContract(row);
           this.$refs['paymentRegistration'].isShowPaymentRegistration = true;
         } else {
@@ -3345,7 +3352,7 @@ export default {
 
   .steps-header {
     display: flex;
-    justify-content: space-between;
+    justify-content: center;
     margin-bottom: 32px;
     padding: 0 20px;
 
@@ -3354,7 +3361,8 @@ export default {
       flex-direction: column;
       align-items: center;
       position: relative;
-      flex: 1;
+      flex: 0 0 auto;
+      width: 200px;
 
       &:not(:last-child)::after {
         content: '';