合同 集合付款登记

src/views/flow/components/payMx copy.vue

@@ -0,0 +1,529 @@
+<template>
+  <div>
+    <vxe-modal :value="isShow" show-footer :z-index="zIndex" title="支付审批明细" show-zoom show-confirm-button transfer
+      resize :width="defaultModalSize.width" :height="defaultModalSize.height" @input="e => $emit('update:isShow',e)">
+      <div>
+        <!-- 历史支付记录查看 -->
+        <h3>历史支付记录查看</h3>
+        <vxe-table ref="tables" stripe style="margin-top: 10px" keep-source :column-config="{ resizable: true }"
+          :print-config="{}" :export-config="{}" :expand-config="{
+              accordion: true,
+              padding: true,
+            }" :row-config="{ keyField: 'id' }" :custom-config="{ mode: 'popup' }" :data="paymentsList">
+
+          <vxe-column title="项目名称" width="250" align="left" field="contract.name">
+            <template #default="{ row }">
+              {{row.contract_id ? (row.contract?row.contract.name:'') : row.away.title}}
+            </template>
+          </vxe-column>
+          <vxe-column title="付款申请金额(元)" width="180" align="right" field="apply_money">
+            <template #default="{ row }">
+              {{Number(row.apply_money).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, "$1,")}}
+            </template>
+          </vxe-column>
+          <vxe-column title="实际支付金额(元)" width="180" align="right" field="act_money">
+            <template #default="{ row }">
+              {{Number(row.act_money).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, "$1,")}}
+            </template>
+          </vxe-column>
+          <vxe-column title="款项类型" width="120" align="center" field="type"></vxe-column>
+          <vxe-column title="预算计划" width="330" align="left" field="act_plan_link">
+            <template #default="{ row }">
+              <template v-if="row.act_plan_link && row.act_plan_link.length > 0">
+                <div v-for="item in row.act_plan_link">
+                  [{{item.plan?item.plan.year:''}}] {{(item.plan && item.plan.pid_info) ? item.plan.pid_info.name: ''}}
+                  - {{item.plan?item.plan.name:''}}
+                  <br />
+                  [使用金额] {{item.use_money}}元
+                </div>
+              </template>
+            </template>
+          </vxe-column>
+          <vxe-column title="审核状态" width="120" align="center" field="status">
+            <template #default="{ row }">
+              <div v-if="row.status===0">待审核</div>
+              <div v-else>已审核</div>
+            </template>
+          </vxe-column>
+          <vxe-column title="流程状态" width="120" align="center" field="fund_log_flow_links">
+            <template #default="{ row }">
+              <template v-for="item in row.fund_log_flow_links">
+                <div v-if="item.tag === 'pay'">
+                  {{flowStatus[item.flow_status]}}
+                </div>
+              </template>
+            </template>
+          </vxe-column>
+          <vxe-column title="次数" width="80" align="center" field="pay_count">
+            <template #default="{ row }">
+              {{row.contract_id ? row.pay_count : row.pay_count_away}}
+            </template>
+          </vxe-column>
+          <vxe-column title="是否为最后一笔" width="120" align="center" field="is_end">
+            <template #default="{ row }">
+              <div v-if="row.is_end===1">是</div>
+              <div v-else>否</div>
+            </template>
+          </vxe-column>
+          <vxe-column title="经办人" width="120" align="center" field="admin.name">
+            <template #default="{ row }">
+              {{row.admin?row.admin.name:''}}
+            </template>
+          </vxe-column>
+          <vxe-column title="业务科室" width="160" align="center" field="department.name">
+            <template #default="{ row }">
+              {{row.department?row.department.name:''}}
+            </template>
+          </vxe-column>
+          <vxe-column title="备注" width="460" align="left" field="remark">
+          </vxe-column>
+          <vxe-column title="创建信息" width="180" align="center" field="created_at">
+          </vxe-column>
+          <vxe-column
+            min-width="120"
+            header-align="center"
+            field="operate"
+            title="操作"
+            fixed="right"
+          >
+          <template #default="{ row }">
+            <el-button type="primary" size="small" @click="showDetail(row)"
+            >查看</el-button>
+          </template>
+
+          </vxe-column>
+        </vxe-table>
+        <div style="display: flex;justify-content: center;margin-top:15px">
+          <el-button :disabled="paymentsList.length>0?false:true" type="primary" size="small" @click="payClose">设为已支付完毕 <i class="el-icon-arrow-right"></i> </el-button>
+        </div>
+
+
+        <h3>发起新的支付审批</h3>
+        <div style="display: flex;align-items: center;justify-content: space-between;">
+          <div style="display: flex;align-items: center;">
+            <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 type="number" placeholder="请填写付款金额" v-model="fundlogForm.applyMoney"
+                style="width: 150px;margin-left:10px" />
+            </div>
+          </div>
+          <div style="display: flex;align-items: center;">
+            <div class="xy-table-item-label">
+              <span style="color: red; font-weight: 600; padding-right: 4px">*</span>款项类型
+            </div>
+            <div style="display: flex;align-items: center;">
+              <el-select placeholder="选择款项类型或直接录入其他类型" v-model="fundlogForm.type" style="width: 200px;margin-left:10px"
+                filterable allow-create clearable popper-append-to-body>
+                <el-option v-for="item in paymentType" :key="item" :label="item" :value="item">
+                </el-option>
+              </el-select>
+            </div>
+          </div>
+          <div style="display: flex;align-items: center;">
+            <div class="xy-table-item-label">
+              <span style="color: red; font-weight: 600; padding-right: 4px">*</span>是否为最后一笔
+            </div>
+            <div class="xy-table-item-content" style="margin-left:10px">
+              <el-switch v-model="fundlogForm.isLast" />
+              <!--                       @change="toggleSelection"-->
+            </div>
+          </div>
+        </div>
+        <vxe-table ref="table" stripe style="margin-top: 10px" keep-source :column-config="{ resizable: true }"
+          :print-config="{}" :export-config="{}" :expand-config="{
+              accordion: true,
+              padding: true,
+            }" :checkbox-config="{
+              reserve: true,
+              highlight: true,
+              range: true,
+              checkMethod: ({ row }) => {
+                return parseFloat(row.hasPayNum) < parseFloat(row.num)
+              }
+            }" :row-config="{ keyField: 'id' }" :custom-config="{ mode: 'popup' }" :data="list">
+          <vxe-column type="checkbox" width="50" align="center"></vxe-column>
+          <vxe-column title="本次报销数量" width="120" align="center" field="payNum">
+            <template #default="{ row }">
+
+              <vxe-number-input v-if="parseFloat(row.hasPayNum) < parseFloat(row.num)" v-model="row.payNum"
+                placeholder="数量"></vxe-number-input>
+              <div v-else>-</div>
+            </template>
+          </vxe-column>
+          <vxe-column title="已报销数量" width="100" align="center" field="hasPayNum">
+          </vxe-column>
+          <vxe-column align="center" v-for="item in table_item" :title="item.label" :field="item.prop"></vxe-column>
+
+        </vxe-table>
+      </div>
+
+      <template #footer>
+        <div style="margin-top: 20px;display: flex;justify-content: center;">
+          <el-button type="primary" size="small" @click="submit">发起支付审批 <i class="el-icon-arrow-right"></i> </el-button>
+        </div>
+      </template>
+    </vxe-modal>
+    <vxe-modal
+      fullscreen
+      :remember="true"
+      class-name="oa-modal"
+      title="流程查看"
+      v-model="isShowOaModal"
+      :z-index="zIndex+100"
+    >
+      <div style="width: 100%;height: 100%;">
+        <iframe style="width: 100%;height: 100%;border-radius: 0 0 6px 6px;" :src="oaUrl" frameborder="0"></iframe>
+      </div>
+    </vxe-modal>
+  </div>
+</template>
+
+<script>
+  import {
+    view,
+    fieldConfig
+  } from '@/api/flow'
+  import {
+    getItems,
+    detailContract,
+    getFundLog,
+    fundLogEnd
+  } from '@/api/flow/pay'
+  import {
+    PopupManager
+  } from 'element-ui/lib/utils/popup'
+  import {
+    defaultModalSize
+  } from "@/settings";
+import {getToken} from "@/utils/auth";
+  export default {
+    props: {
+      isShow: {
+        type: Boolean,
+        default: false,
+        required: true
+      },
+    },
+    data() {
+      return {
+        payId: '',
+        payList:'',
+        defaultModalSize,
+        zIndex: PopupManager.nextZIndex(),
+        list: [],
+        table_item: [],
+        flowDetail: {},
+        fundlogForm: {
+          applyMoney: 0,
+          type: '',
+          isLast: false,
+        },
+        paymentType: ["进度款", "结算款", "质保金"],
+        oaUrl: '',
+        isShowOaModal: false,
+        paymentsList: [],
+        flowStatus: {
+          '-1': '已退回',
+          '0': '办理中',
+          '1': '已完成'
+        }
+      }
+    },
+    methods: {
+      async getConfig() {
+        const loading = this.$loading({
+          lock: true,
+          text: "拼命加载中",
+          spinner: "el-icon-loading",
+          background: "rgba(0, 0, 0, 0.8)",
+        });
+        try {
+          const res = await view(this.payId);
+
+          const {
+            fields
+          } = res?.customModel;
+          this.flowDetail = res?.flow
+          const {
+            data
+          } = res?.flow
+          
+          fields.forEach((field) => {
+            if (field.type === 'relation') {
+              // 增加 自己提交的数量 和 已提交的数量
+              this.list = JSON.parse(data[field.name])
+              this.list.map(item => {
+                item.payNum = 0
+                item.hasPayNum = 0
+              })
+              this.getItemNum(this.payId)
+              this.getFieldConfig(field.sub_custom_model_id)
+            }
+          });
+          this.getFundLogList()
+          console.log("this.list", this.list)
+          loading.close();
+        } catch (err) {
+          console.error(err)
+          this.$message.error("配置失败");
+          loading.close();
+        }
+      },
+      // 获取历史支付明细
+      async getFundLogList() {
+        let payments =
+          (
+            await getFundLog({
+              contract_id: this.flowDetail.out_contract_id,
+              show_type: 1
+            })
+          )?.data || [];
+        this.paymentsList = payments
+        console.log("paymentsList", this.paymentsList)
+      },
+      // 获取采购明细
+      async getFieldConfig(id) {
+        try {
+          const res = await fieldConfig(id)
+          console.log("res", res)
+          const fields = res?.customModel?.fields
+          fields.forEach((field) => {
+            this.table_item.push({
+              label: field.label,
+              prop: field.name
+            })
+          });
+
+
+        } catch (err) {
+          console.error(err)
+        }
+
+      },
+      // 获取已提交的物资数量
+      async getItemNum(id) {
+        try {
+          const item = await getItems({
+            flow_id: id
+          })
+          console.log("item", item)
+          if (item.length > 0) {
+            const itemMap = new Map();
+            item.forEach(item => {
+              itemMap.set(item.wuzicaigou_item_id, item.total_num);
+            });
+            // 遍历 list 数组，根据 id 从 Map 中获取 total_num 并赋值给 hasPayNum
+            this.list.forEach(item => {
+              if (itemMap.has(item.id)) {
+                item.hasPayNum = itemMap.get(item.id);
+              }
+            });
+          }
+        } catch (err) {
+          console.error(err)
+        }
+      },
+      showDetail(row){
+        let url = `/oa/#/flow/detail?module_name=oa&auth_token=${window.encodeURIComponent(getToken())}&isSinglePage=1&flow_id=`
+        let pay = row.fund_log_flow_links.find(i => i.tag === 'pay')
+        //url += `&to=/flow/detail?flow_id=${caigou.id}`
+        url += pay?.flow_id
+        this.oaUrl = url
+        this.isShowOaModal = true
+      },
+      payClose(){
+        this.$confirm('将此采购记录设为“已⽀付完毕”，同时会将最后⼀笔⽀付记录的“是否为最后⼀笔”属性设置为“是”，请确认是否要进⾏此操作', '提示', {
+          confirmButtonText: '确定',
+          callback: action => {
+            if(action==='confirm'){
+              fundLogEnd({
+                contract_id:this.flowDetail.out_contract_id,
+              }).then(res=>{
+                this.$emit('update:isShow', false)
+                this.$emit('refresh')
+              })
+            }
+
+
+            // this.fundlogForm.isLast = true
+          }
+        });
+      },
+      async submit() {
+        try {
+          if (!this.fundlogForm.applyMoney) {
+            this.$message({
+              message: '请填写本次申请付款金额',
+              duration: 2000,
+              type: 'warning'
+            })
+            return
+          }
+          if (!this.fundlogForm.type) {
+            this.$message({
+              message: '请选择款项类型',
+              duration: 2000,
+              type: 'warning'
+            })
+            return
+          }
+          const records = this.$refs.table.getCheckboxRecords()
+          console.log("records", records)
+          let count = 0
+          let totalCount = 0
+          let allCount = 0 // 每一条本次报销数量+已报销数量 = 数量
+          if (records.length < 1) {
+            this.$message({
+              message: '请选择需要报销的明细',
+              duration: 2000,
+              type: 'warning'
+            })
+            return
+          }
+          records.map(item => {
+            if (parseFloat(item.payNum) === 0 || parseFloat(item.payNum) > parseFloat(item.num)) {
+              count++
+            }
+            if (parseFloat(item.payNum) + parseFloat(item.hasPayNum) > parseFloat(item.num)) {
+              totalCount++
+            }
+            if (parseFloat(item.payNum) + parseFloat(item.hasPayNum) === parseFloat(item.num)) {
+              allCount++
+            }
+          })
+          if (count > 0) {
+            this.$message({
+              message: '报销数量不能为0或报销数量大于总数量',
+              duration: 2000,
+              type: 'warning'
+            })
+            return
+          }
+          if (totalCount > 0) {
+            this.$message({
+              message: '本次报销数量大于剩余可报销数量',
+              duration: 2000,
+              type: 'warning'
+            })
+            return
+          }
+          if (allCount === records.length) {
+            this.$alert('本次报销数量已等于总数量，默认为最后一笔', '提示', {
+              confirmButtonText: '确定',
+              callback: action => {
+                this.fundlogForm.isLast = true
+              }
+            });
+          }
+          // return
+          //wuzicaigou_items 报销的物资明细数组
+          let wuzicaigou_items = []
+          let zhifutitle = ''
+          records.map(item => {
+            wuzicaigou_items.push({
+              flow_id: this.payId,
+              wuzicaigou_id: item.belongs_id,
+              wuzicaigou_item_id: item.id,
+              name: item.pinminghuofuwuxuqiu,
+              num: item.payNum,
+              total: item.num
+            })
+            zhifutitle += item.pinminghuofuwuxuqiu + '*' + item.payNum + ','
+          })
+
+          // 跳转到支付审批流程
+          let payments = this.paymentsList;
+          const actNumsTotal = () => {
+            return payments.reduce((pre, cur) => {
+              return pre + (!!Number(cur.act_money) ? Number(cur.act_money) : 0);
+            }, 0);
+          };
+          let contract;
+          if (this.flowDetail.out_contract_id) {
+            contract = await detailContract({
+              id: this.flowDetail.out_contract_id
+            });
+          }
+
+          // payments = this.paymentsList
+          // (
+          //   await getFundLog({
+          //     contract_id: this.flowDetail.out_contract_id,
+          //     show_type: 1
+          //   })
+          // )?.data || [];
+          // 付款登记的字段
+          let zhifutitle2 = zhifutitle.slice(0, -1)
+          zhifutitle += "（" + this.flowDetail.title + '）'
+          let baseInfo = {
+            "oaUrl": contract?.number,
+            "zhifutitle": zhifutitle,
+            // ?contract?.name
+            "contract_id": contract.id,
+            "type": this.fundlogForm.type,
+            "is_end": this.fundlogForm.isLast ? 1 : 0,
+            "amt": this.fundlogForm.applyMoney,
+            // out_pay_id: row?.id,
+            "xiangxishuoming": zhifutitle,
+            "yifujine": actNumsTotal(),
+            "xiangmuzonge": contract.money,
+            "zhifucishu": contract?.sign_plan?.length,
+            "cishu": payments.length,
+
+            "liezhiqudao": contract?.plans.map(i => i.name)?.toString(),
+            "contractno": contract?.number,
+            "guanlianliucheng": contract?.contract_flow_links?.map(i => i.flow_id)?.toString(),
+            "wuzicaigou_items": wuzicaigou_items
+          };
+          console.log(baseInfo, baseInfo)
+          let url =
+            `/flow/create?&module_name=oa&isSinglePage=1&module_id=75&default_json=${window.encodeURIComponent(JSON.stringify(baseInfo))}`;
+          this.$router.push(
+            url
+          );
+          // this.oaUrl = url;
+          // this.isShowOaModal = true;
+          this.$emit('update:isShow', false)
+        } catch (err) {
+          console.error(err)
+        }
+      }
+    },
+    computed: {},
+    watch: {
+      isShow(newVal) {
+        if (newVal) {
+          this.zIndex = PopupManager.nextZIndex()
+
+          if (this.payId) {
+            this.getConfig()
+
+          }
+        } else {
+          this.list = []
+          this.payId = ''
+          this.payList = []
+          this.oaUrl = ''
+          this.isShowOaModal = false
+          this.table_item = []
+          this.paymentsList = []
+          this.flowDetail = {}
+          this.fundlogForm = {
+            applyMoney: 0,
+            type: '',
+            isLast: false,
+          }
+          this.$refs.table.clearCheckboxRow()
+        }
+      }
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  ::v-deep .el-checkbox-group {
+    font-size: inherit;
+  }
+</style>

src/views/flow/components/payMx.vue

@@ -78,34 +78,37 @@
           <vxe-column title="备注" width="460" align="left" field="remark">
           </vxe-column>
           <vxe-column title="创建信息" width="180" align="center" field="created_at">
-          </vxe-column>
-          <vxe-column
-            min-width="120"
-            header-align="center"
-            field="operate"
-            title="操作"
-            fixed="right"
-          >
-          <template #default="{ row }">
-            <el-button type="primary" size="small" @click="showDetail(row)"
-            >查看</el-button>
-          </template>
-
           </vxe-column>
-        </vxe-table>
-        <div style="display: flex;justify-content: center;margin-top:15px">
-          <el-button :disabled="paymentsList.length>0?false:true" type="primary" size="small" @click="payClose">设为已支付完毕 <i class="el-icon-arrow-right"></i> </el-button>
-        </div>
+          <vxe-column
+            min-width="120"
+            header-align="center"
+            field="operate"
+            title="操作"
+            fixed="right"
+          >
+          <template #default="{ row }">
+            <el-button type="primary" size="small" @click="showDetail(row)"
+            >查看</el-button>
+          </template>
+
+          </vxe-column>
+        </vxe-table>
+        <div style="display: flex;justify-content: center;margin-top:15px">
+          <el-button :disabled="paymentsList.length>0?false:true" type="primary" size="small" @click="payClose">设为已支付完毕 <i class="el-icon-arrow-right"></i> </el-button>
+        </div>
 
 
         <h3>发起新的支付审批</h3>
+   
+        <div v-for="pay in payList" :key="pay.id" style="margin-top: 12px;">
+          <div style="font-weight: 600; margin: 6px 0;">{{ pay.title }}</div>
         <div style="display: flex;align-items: center;justify-content: space-between;">
           <div style="display: flex;align-items: center;">
             <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 type="number" placeholder="请填写付款金额" v-model="fundlogForm.applyMoney"
+                <el-input clearable type="number" placeholder="请填写付款金额" v-model="fundlogFormMap[pay.id].applyMoney"
                 style="width: 150px;margin-left:10px" />
             </div>
           </div>
@@ -114,7 +117,7 @@
               <span style="color: red; font-weight: 600; padding-right: 4px">*</span>款项类型
             </div>
             <div style="display: flex;align-items: center;">
-              <el-select placeholder="选择款项类型或直接录入其他类型" v-model="fundlogForm.type" style="width: 200px;margin-left:10px"
+                <el-select placeholder="选择款项类型或直接录入其他类型" v-model="fundlogFormMap[pay.id].type" style="width: 200px;margin-left:10px"
                 filterable allow-create clearable popper-append-to-body>
                 <el-option v-for="item in paymentType" :key="item" :label="item" :value="item">
                 </el-option>
@@ -126,12 +129,11 @@
               <span style="color: red; font-weight: 600; padding-right: 4px">*</span>是否为最后一笔
             </div>
             <div class="xy-table-item-content" style="margin-left:10px">
-              <el-switch v-model="fundlogForm.isLast" />
-              <!--                       @change="toggleSelection"-->
+                <el-switch v-model="fundlogFormMap[pay.id].isLast" />
+              </div>
             </div>
           </div>
-        </div>
-        <vxe-table ref="table" stripe style="margin-top: 10px" keep-source :column-config="{ resizable: true }"
+          <vxe-table :ref="'table_' + pay.id" stripe style="margin-top: 6px" keep-source :column-config="{ resizable: true }"
           :print-config="{}" :export-config="{}" :expand-config="{
               accordion: true,
               padding: true,
@@ -142,11 +144,10 @@
               checkMethod: ({ row }) => {
                 return parseFloat(row.hasPayNum) < parseFloat(row.num)
               }
-            }" :row-config="{ keyField: 'id' }" :custom-config="{ mode: 'popup' }" :data="list">
+              }" :row-config="{ keyField: 'id' }" :custom-config="{ mode: 'popup' }" :data="getGroupList(pay.id)">
           <vxe-column type="checkbox" width="50" align="center"></vxe-column>
           <vxe-column title="本次报销数量" width="120" align="center" field="payNum">
             <template #default="{ row }">
-
               <vxe-number-input v-if="parseFloat(row.hasPayNum) < parseFloat(row.num)" v-model="row.payNum"
                 placeholder="数量"></vxe-number-input>
               <div v-else>-</div>
@@ -154,9 +155,9 @@
           </vxe-column>
           <vxe-column title="已报销数量" width="100" align="center" field="hasPayNum">
           </vxe-column>
-          <vxe-column align="center" v-for="item in table_item" :title="item.label" :field="item.prop"></vxe-column>
-
+            <vxe-column align="center" v-for="item in table_item" :key="item.prop + '_' + pay.id" :title="item.label" :field="item.prop"></vxe-column>
         </vxe-table>
+        </div>
       </div>
 
       <template #footer>
@@ -166,11 +167,11 @@
       </template>
     </vxe-modal>
     <vxe-modal
-      fullscreen
+      fullscreen
       :remember="true"
       class-name="oa-modal"
       title="流程查看"
-      v-model="isShowOaModal"
+      v-model="isShowOaModal"
       :z-index="zIndex+100"
     >
       <div style="width: 100%;height: 100%;">
@@ -188,7 +189,7 @@
   import {
     getItems,
     detailContract,
-    getFundLog,
+    getFundLog,
     fundLogEnd
   } from '@/api/flow/pay'
   import {
@@ -205,13 +206,21 @@ import {getToken} from "@/utils/auth";
         default: false,
         required: true
       },
+      // 新增：接收支付列表，包含各项的 out_contract_id
+      // payList: {
+      //   type: Array,
+      //   default: () => []
+      // }
     },
     data() {
       return {
         payId: '',
+        payList:[],
         defaultModalSize,
         zIndex: PopupManager.nextZIndex(),
         list: [],
+        // 每个区块（pay.id）对应的表单：申请金额/类型/是否最后一笔
+        fundlogFormMap: {},
         table_item: [],
         flowDetail: {},
         fundlogForm: {
@@ -231,7 +240,12 @@ import {getToken} from "@/utils/auth";
       }
     },
     methods: {
+      // 获取某一 pay 的分组数据
+      getGroupList(flowId) {
+        return (this.list || []).filter(r => r.sourceFlowId === flowId)
+      },
       async getConfig() {
+        // 改造：不再通过 view 接口获取，直接使用传入的 payList
         const loading = this.$loading({
           lock: true,
           text: "拼命加载中",
@@ -239,45 +253,98 @@ import {getToken} from "@/utils/auth";
           background: "rgba(0, 0, 0, 0.8)",
         });
         try {
-          const res = await view(this.payId);
+          console.log('this.payList', this.payList)
+          // 初始化本地可编辑列表（聚合 payList 的各自明细：JSON.parse(data.caigoumingxi)）
+          this.list = [];
+          (this.payList || []).forEach(pay => {
+            let subList = []
+            try {
+              subList = JSON.parse(pay?.data?.caigoumingxi || '[]')
+            } catch(e) {
+              subList = []
+            }
+            // 初始化每个区块的表单默认值
+            if (!this.fundlogFormMap[pay.id]) {
+              this.$set(this.fundlogFormMap, pay.id, {
+                applyMoney: 0,
+                type: '',
+                isLast: false
+              })
+            }
+            subList.forEach(item => {
+              const newItem = Object.assign({}, item, {
+                payNum: 0,
+                hasPayNum: 0,
+                sourceFlowId: pay.id
+              })
+              this.list.push(newItem)
+            })
+          })
+          console.log('this.list', this.list)
 
-          const {
-            fields
-          } = res?.customModel;
-          this.flowDetail = res?.flow
-          const {
-            data
-          } = res?.flow
-          fields.forEach((field) => {
-            if (field.type === 'relation') {
-              // 增加 自己提交的数量 和 已提交的数量
-              this.list = JSON.parse(data[field.name])
-              this.list.map(item => {
-                item.payNum = 0
-                item.hasPayNum = 0
+          // 组装逗号分隔的 flow_id / id 字符串用于 getItemNum
+          const ids = (this.payList || [])
+            .map(i => i && (i.id))
+            .filter(id => !!id)
+            .join(',')
+
+          if (ids) {
+            await this.getItemNum(ids)
+          }
+
+          // 获取字段配置：取第一条的 sub_custom_model_id
+          // const firstSubModelId = this.payList && this.payList[0] && (this.payList[0].sub_custom_model_id || this.payList[0].field?.sub_custom_model_id)
+          // if (firstSubModelId) {
+            await this.getFieldConfig(81)
+          // }
+
+          // 历史支付记录由 payList 汇总的 out_contract_id 直接获取
+          await this.getFundLogList()
+
+          // 确保子表渲染到最新数据
+          this.$nextTick(() => {
+            try {
+              (this.payList || []).forEach(pay => {
+                const refKey = 'table_' + pay.id
+                const tableRef = this.$refs[refKey]
+                const data = this.getGroupList(pay.id)
+                if (tableRef && data) {
+                  if (typeof tableRef.reloadData === 'function') {
+                    tableRef.reloadData(data)
+                  } else if (typeof tableRef.loadData === 'function') {
+                    tableRef.loadData(data)
+                  }
+                }
               })
-              this.getItemNum(this.payId)
-              this.getFieldConfig(field.sub_custom_model_id)
+            } catch(e) {
+              console.warn('vxe-table reloadData failed', e)
             }
-          });
-          this.getFundLogList()
-          console.log("this.list", this.list)
-          loading.close();
+          })
+
+          loading.close()
         } catch (err) {
           console.error(err)
-          this.$message.error("配置失败");
-          loading.close();
+          this.$message.error("配置失败")
+          loading.close()
         }
       },
       // 获取历史支付明细
       async getFundLogList() {
-        let payments =
-          (
+        // 从传入的 payList 中汇总 out_contract_id，用逗号连接
+        const contractIds = (this.payList || [])
+          .map(i => i && i.out_contract_id)
+          .filter(id => !!id)
+          .join(',');
+
+        let payments = []
+        if (contractIds) {
+          payments = (
             await getFundLog({
-              contract_id: this.flowDetail.out_contract_id,
+              contract_id: contractIds,
               show_type: 1
             })
-          )?.data || [];
+          )?.data || []
+        }
         this.paymentsList = payments
         console.log("paymentsList", this.paymentsList)
       },
@@ -312,66 +379,61 @@ import {getToken} from "@/utils/auth";
             item.forEach(item => {
               itemMap.set(item.wuzicaigou_item_id, item.total_num);
             });
-            // 遍历 list 数组，根据 id 从 Map 中获取 total_num 并赋值给 hasPayNum
-            this.list.forEach(item => {
-              if (itemMap.has(item.id)) {
-                item.hasPayNum = itemMap.get(item.id);
+            // 遍历合并后的 list，根据 id 从 Map 中获取 total_num 并赋值给 hasPayNum
+            this.list.forEach(row => {
+              if (itemMap.has(row.id)) {
+                row.hasPayNum = itemMap.get(row.id)
               }
-            });
+            })
           }
         } catch (err) {
           console.error(err)
         }
-      },
-      showDetail(row){
-        let url = `/oa/#/flow/detail?module_name=oa&auth_token=${window.encodeURIComponent(getToken())}&isSinglePage=1&flow_id=`
-        let pay = row.fund_log_flow_links.find(i => i.tag === 'pay')
-        //url += `&to=/flow/detail?flow_id=${caigou.id}`
-        url += pay?.flow_id
-        this.oaUrl = url
-        this.isShowOaModal = true
-      },
-      payClose(){
-        this.$confirm('将此采购记录设为“已⽀付完毕”，同时会将最后⼀笔⽀付记录的“是否为最后⼀笔”属性设置为“是”，请确认是否要进⾏此操作', '提示', {
-          confirmButtonText: '确定',
-          callback: action => {
-            if(action==='confirm'){
-              fundLogEnd({
-                contract_id:this.flowDetail.out_contract_id,
-              }).then(res=>{
-                this.$emit('update:isShow', false)
-                this.$emit('refresh')
-              })
-            }
-
-
-            // this.fundlogForm.isLast = true
-          }
-        });
+      },
+      showDetail(row){
+        let url = `/oa/#/flow/detail?module_name=oa&auth_token=${window.encodeURIComponent(getToken())}&isSinglePage=1&flow_id=`
+        let pay = row.fund_log_flow_links.find(i => i.tag === 'pay')
+        //url += `&to=/flow/detail?flow_id=${caigou.id}`
+        url += pay?.flow_id
+        this.oaUrl = url
+        this.isShowOaModal = true
+      },
+      payClose(){
+        this.$confirm('将此采购记录设为“已⽀付完毕”，同时会将最后⼀笔⽀付记录的“是否为最后⼀笔”属性设置为“是”，请确认是否要进⾏此操作', '提示', {
+          confirmButtonText: '确定',
+          callback: action => {
+            if(action==='confirm'){
+              fundLogEnd({
+                contract_id:this.flowDetail.out_contract_id,
+              }).then(res=>{
+                this.$emit('update:isShow', false)
+                this.$emit('refresh')
+              })
+            }
+
+
+            // this.fundlogForm.isLast = true
+          }
+        });
       },
       async submit() {
         try {
-          if (!this.fundlogForm.applyMoney) {
-            this.$message({
-              message: '请填写本次申请付款金额',
-              duration: 2000,
-              type: 'warning'
-            })
-            return
-          }
-          if (!this.fundlogForm.type) {
-            this.$message({
-              message: '请选择款项类型',
-              duration: 2000,
-              type: 'warning'
-            })
-            return
-          }
-          const records = this.$refs.table.getCheckboxRecords()
+
+          // 收集所有子表勾选记录
+          let records = []
+          this.payList.forEach(pay => {
+            const refKey = 'table_' + pay.id
+            let tableRef = this.$refs[refKey]
+            // 兼容 v-for 下 ref 可能为数组的情况
+            if (Array.isArray(tableRef)) tableRef = tableRef[0]
+            if (tableRef) {
+              const sel = typeof tableRef.getCheckboxRecords === 'function' ? (tableRef.getCheckboxRecords() || []) : []
+              const reserveSel = typeof tableRef.getCheckboxReserveRecords === 'function' ? (tableRef.getCheckboxReserveRecords() || []) : []
+              records = records.concat(sel, reserveSel)
+            }
+          })
           console.log("records", records)
-          let count = 0
-          let totalCount = 0
-          let allCount = 0 // 每一条本次报销数量+已报销数量 = 数量
+          // 分组逐块校验数量
           if (records.length < 1) {
             this.$message({
               message: '请选择需要报销的明细',
@@ -380,20 +442,57 @@ import {getToken} from "@/utils/auth";
             })
             return
           }
-          records.map(item => {
-            if (parseFloat(item.payNum) === 0 || parseFloat(item.payNum) > parseFloat(item.num)) {
-              count++
+          // 校验每个分组（pay.id）的区块表单是否填写（金额、类型）
+          const idToTitle = {}
+          ;(this.payList || []).forEach(p => { idToTitle[p.id] = p.title })
+          const groupIds = Array.from(new Set(records.map(r => r.sourceFlowId)))
+          for (const gid of groupIds) {
+            const form = this.fundlogFormMap[gid] || {}
+            if (!form.applyMoney || Number(form.applyMoney) <= 0) {
+              this.$message({
+                message: `【${idToTitle[gid] || gid}】请填写本次申请付款金额`,
+                duration: 2000,
+                type: 'warning'
+              })
+              return
             }
-            if (parseFloat(item.payNum) + parseFloat(item.hasPayNum) > parseFloat(item.num)) {
-              totalCount++
+            if (!form.type) {
+              this.$message({
+                message: `【${idToTitle[gid] || gid}】请选择款项类型`,
+                duration: 2000,
+                type: 'warning'
+              })
+              return
             }
-            if (parseFloat(item.payNum) + parseFloat(item.hasPayNum) === parseFloat(item.num)) {
-              allCount++
+          }
+          // 数量校验：按分组逐块处理，并在“等于总数量”时自动设置该块为最后一笔
+          const groupMap = records.reduce((acc, row) => {
+            const gid = row.sourceFlowId
+            if (!acc[gid]) acc[gid] = []
+            acc[gid].push(row)
+            return acc
+          }, {})
+          const groupsToAutoEnd = []
+          for (const gid of Object.keys(groupMap)) {
+            const rows = groupMap[gid]
+            let count = 0
+            let totalCount = 0
+            let allToRemain = true
+            rows.forEach(item => {
+              const payNum = Number(item.payNum)
+              const num = Number(item.num)
+              const hasPay = Number(item.hasPayNum)
+              const remain = num - hasPay
+              if (isNaN(payNum) || payNum === 0 || payNum > num) count++
+              if (payNum + hasPay > num) totalCount++
+              // 判断是否每一条都“正好补齐剩余”
+              if (!(payNum > 0 && Math.abs(payNum - remain) < 1e-6)) {
+                allToRemain = false
             }
           })
           if (count > 0) {
             this.$message({
-              message: '报销数量不能为0或报销数量大于总数量',
+                message: `【${idToTitle[gid] || gid}】报销数量不能为0或报销数量大于总数量`,
               duration: 2000,
               type: 'warning'
             })
@@ -401,88 +500,111 @@ import {getToken} from "@/utils/auth";
           }
           if (totalCount > 0) {
             this.$message({
-              message: '本次报销数量大于剩余可报销数量',
+                message: `【${idToTitle[gid] || gid}】本次报销数量大于剩余可报销数量`,
               duration: 2000,
               type: 'warning'
             })
             return
           }
-          if (allCount === records.length) {
-            this.$alert('本次报销数量已等于总数量，默认为最后一笔', '提示', {
-              confirmButtonText: '确定',
-              callback: action => {
-                this.fundlogForm.isLast = true
-              }
-            });
+            // 记录需要自动置为“最后一笔”的分组，统一在提交前弹一次提示
+            if (allToRemain && this.fundlogFormMap[gid] && !this.fundlogFormMap[gid].isLast) {
+              groupsToAutoEnd.push(gid)
+            }
           }
-          // return
-          //wuzicaigou_items 报销的物资明细数组
+          if (groupsToAutoEnd.length > 0) {
+            // 等待用户确认后再继续，避免先跳转
+            await this.$alert('本次报销数量已等于总数量，默认为最后一笔', '提示', {
+              confirmButtonText: '确定'
+            })
+            groupsToAutoEnd.forEach(gid => {
+              if (this.fundlogFormMap[gid]) this.$set(this.fundlogFormMap[gid], 'isLast', true)
+            })
+          }
+          // 组合成单个审批
           let wuzicaigou_items = []
           let zhifutitle = ''
-          records.map(item => {
+          // 建立 flowId -> contractId 映射
+          const flowIdToContractId = {}
+          ;(this.payList || []).forEach(p => {
+            const fid = p.id
+            if (fid) flowIdToContractId[fid] = p.out_contract_id
+          })
+          records.forEach(item => {
+            const form = this.fundlogFormMap[item.sourceFlowId] || { applyMoney: 0, type: '', isLast: false }
             wuzicaigou_items.push({
-              flow_id: this.payId,
+              flow_id: item.sourceFlowId || this.payId,
+              contract_id: flowIdToContractId[item.sourceFlowId] || undefined,
               wuzicaigou_id: item.belongs_id,
               wuzicaigou_item_id: item.id,
               name: item.pinminghuofuwuxuqiu,
               num: item.payNum,
-              total: item.num
+              total: item.num,
+              // 区块级的额外字段注入到每条明细，便于后端识别
+              apply_money: form.applyMoney,
+              type: form.type,
+              is_end: form.isLast ? 1 : 0
             })
             zhifutitle += item.pinminghuofuwuxuqiu + '*' + item.payNum + ','
           })
+          console.log("wuzicaigou_items",wuzicaigou_items)
+          // return
+          // 聚合相关合同信息：从 payList 收集 contract_id，逐个请求 detailContract 并整合为数组
+          const contractIds = Array.from(new Set((this.payList || []).map(p => p.out_contract_id).filter(Boolean)))
+          let contracts = []
+          if (contractIds.length > 0) {
+            try {
+              contracts = await Promise.all(contractIds.map(id => detailContract({ id })))
+            } catch (e) {
+              console.warn('fetch contracts failed', e)
+            }
+          }
+          // 仍以第一份合同作为展示主合同（标题等），其余信息通过聚合参与计算
+          const mainContract = contracts && contracts.length > 0 ? contracts[0] : null
 
-          // 跳转到支付审批流程
           let payments = this.paymentsList;
-          const actNumsTotal = () => {
-            return payments.reduce((pre, cur) => {
-              return pre + (!!Number(cur.act_money) ? Number(cur.act_money) : 0);
-            }, 0);
-          };
-          let contract;
-          if (this.flowDetail.out_contract_id) {
-            contract = await detailContract({
-              id: this.flowDetail.out_contract_id
-            });
-          }
+          const actNumsTotal = () => payments.reduce((pre, cur) => pre + (!!Number(cur.act_money) ? Number(cur.act_money) : 0), 0)
 
-          // payments = this.paymentsList
-          // (
-          //   await getFundLog({
-          //     contract_id: this.flowDetail.out_contract_id,
-          //     show_type: 1
-          //   })
-          // )?.data || [];
-          // 付款登记的字段
           let zhifutitle2 = zhifutitle.slice(0, -1)
-          zhifutitle += "（" + this.flowDetail.title + '）'
-          let baseInfo = {
-            "oaUrl": contract?.number,
-            "zhifutitle": zhifutitle,
-            // ?contract?.name
-            "contract_id": contract.id,
-            "type": this.fundlogForm.type,
-            "is_end": this.fundlogForm.isLast ? 1 : 0,
-            "amt": this.fundlogForm.applyMoney,
-            // out_pay_id: row?.id,
-            "xiangxishuoming": zhifutitle,
-            "yifujine": actNumsTotal(),
-            "xiangmuzonge": contract.money,
-            "zhifucishu": contract?.sign_plan?.length,
-            "cishu": payments.length,
+          if (mainContract?.name) zhifutitle += `（${mainContract.name} 等${contractIds.length}个合同）`
+
+          // 从明细中聚合主数据：合同ID串与金额合计
+          const contractIdStr = Array.from(new Set(wuzicaigou_items.map(i => i.contract_id).filter(Boolean))).join(',')
+          const amtTotal = wuzicaigou_items.reduce((sum, i) => sum + (Number(i.group_apply_money || i.apply_money) || 0), 0)
+
+          // 从合同列表聚合展示数据
+          const sumMoney = (contracts || []).reduce((sum, c) => sum + (Number(c?.money) || 0), 0)
+          const sumPlanLen = (contracts || []).reduce((sum, c) => sum + ((c?.sign_plan?.length) || 0), 0)
+          const plansNames = Array.from(new Set((contracts || []).flatMap(c => (c?.plans || []).map(p => p?.name)).filter(Boolean))).join(',')
+          const contractNos = (contracts || []).map(c => c?.number).filter(Boolean).join(',')
+          const relatedFlows = Array.from(new Set((contracts || []).flatMap(c => (c?.contract_flow_links || []).map(l => l?.flow_id)).filter(Boolean))).join(',')
+
+          const baseInfo = {
+            // oaUrl: mainContract?.number,
+            zhifutitle,
+            contract_id: contractIdStr,
+            type: '',
+            is_end: '',
+            amt: amtTotal,
+            xiangxishuoming: zhifutitle,
+            yifujine: actNumsTotal(),
+            cishu: payments.length,
 
-            "liezhiqudao": contract?.plans.map(i => i.name)?.toString(),
-            "contractno": contract?.number,
-            "guanlianliucheng": contract?.contract_flow_links?.map(i => i.flow_id)?.toString(),
-            "wuzicaigou_items": wuzicaigou_items
-          };
-          console.log(baseInfo, baseInfo)
-          let url =
-            `/flow/create?&module_name=oa&isSinglePage=1&module_id=75&default_json=${window.encodeURIComponent(JSON.stringify(baseInfo))}`;
-          this.$router.push(
-            url
-          );
-          // this.oaUrl = url;
-          // this.isShowOaModal = true;
+            xiangmuzonge: sumMoney,
+            zhifucishu: sumPlanLen,
+            liezhiqudao: plansNames,
+            contractno: contractNos,
+            guanlianliucheng: relatedFlows,
+            
+            // xiangmuzonge: mainContract?.money,
+            // zhifucishu: mainContract?.sign_plan?.length,
+            // liezhiqudao: mainContract?.plans.map(i => i.name)?.toString(),
+            // contractno: mainContract?.number,
+            // guanlianliucheng: mainContract?.contract_flow_links?.map(i => i.flow_id)?.toString(),
+            
+            wuzicaigou_items
+          }
+          const url = `/flow/create?&module_name=oa&isSinglePage=1&module_id=75&default_json=${window.encodeURIComponent(JSON.stringify(baseInfo))}`
+          this.$router.push(url)
           this.$emit('update:isShow', false)
         } catch (err) {
           console.error(err)
@@ -495,14 +617,16 @@ import {getToken} from "@/utils/auth";
         if (newVal) {
           this.zIndex = PopupManager.nextZIndex()
 
-          if (this.payId) {
+          // 直接拉取历史支付记录（无需依赖 getConfig）
+          console.log("this.payList123", this.payList)
+          this.getFundLogList()
+          // 加载表格字段配置与数量统计（基于传入的 payList）
             this.getConfig()
-
-          }
         } else {
           this.list = []
           this.payId = ''
           this.oaUrl = ''
+          this.payList = []
           this.isShowOaModal = false
           this.table_item = []
           this.paymentsList = []
@@ -523,4 +647,4 @@ import {getToken} from "@/utils/auth";
   ::v-deep .el-checkbox-group {
     font-size: inherit;
   }
-</style>
+</style>

src/views/flow/create.vue

@@ -797,8 +797,9 @@ export default {
         this.$message.warning('数据校验失败')
         return
       }
-
-      copyForm = deepCopy(this.$refs["desktopForm"].form);
+      console.log("this.$refs['desktopForm'].form",this.$refs["desktopForm"].form)
+      // copyForm = deepCopy(this.$refs["desktopForm"].form);
+      copyForm = this.$refs["desktopForm"].form;
       const uploadHandler = (form, fields) => {
         let keys = Object.keys(form)
         keys.forEach(key => {

src/views/flow/list.vue

@@ -53,7 +53,7 @@
                 ></el-option>
               </el-select>
               <el-select
-              v-if="select.custom_model_id"
+                v-if="select.custom_model_id"
                 style="width: 180px"
                 filterable
                 clearable
@@ -69,7 +69,13 @@
                 ></el-option>
               </el-select>
 
-              <el-input size="small" style="width: 180px" v-if="select.custom_model_id" v-model="select.field_keyword" placeholder="关键词"></el-input>
+              <el-input
+                size="small"
+                style="width: 180px"
+                v-if="select.custom_model_id"
+                v-model="select.field_keyword"
+                placeholder="关键词"
+              ></el-input>
 
               <el-select
                 style="width: 100px"
@@ -121,7 +127,7 @@
                 clearable
               >
                 <el-option
-                  v-for="item in [{value:1,label:'我退回过'}]"
+                  v-for="item in [{ value: 1, label: '我退回过' }]"
                   :key="item.value"
                   :value="item.value"
                   :label="item.label"
@@ -147,15 +153,27 @@
                 type="primary"
                 size="small"
                 @click="showExport"
-              >导出</el-button
+                >导出</el-button
               >
-             <!-- <el-button
+              <!-- <el-button
                v-if="$route.path === '/flow/list/todo'"
                icon="el-icon-edit"
                type="primary"
                size="small"
                plain
                @click="multiDeal">批量审批</el-button> -->
+              <el-button
+                v-if="
+                  $route.path === '/flow/list/handled' &&
+                  select.custom_model_id == 99
+                "
+                icon="el-icon-edit"
+                type="primary"
+                size="small"
+                plain
+                @click="multiPay"
+                >批量支付</el-button
+              >
             </div>
           </template>
         </vxe-toolbar>
@@ -163,10 +181,20 @@
           <el-tag
             v-for="(model, index) in todoTotal"
             :key="model.custom_model_id"
-            :effect="select.custom_model_id === model.custom_model_id ? 'dark' : 'plain'"
-            :type="['success', 'info', 'warning', 'danger'][index%4]"
-            @click="select.custom_model_id = model.custom_model_id,getFields(model.custom_model_id),getList()">
-            {{ model.custom_model ? model.custom_model.name : '' }}{{ model.total }}
+            :effect="
+              select.custom_model_id === model.custom_model_id
+                ? 'dark'
+                : 'plain'
+            "
+            :type="['success', 'info', 'warning', 'danger'][index % 4]"
+            @click="
+              (select.custom_model_id = model.custom_model_id),
+                getFields(model.custom_model_id),
+                getList()
+            "
+          >
+            {{ model.custom_model ? model.custom_model.name : ""
+            }}{{ model.total }}
           </el-tag>
         </div>
       </template>
@@ -192,17 +220,28 @@
               range: true,
               checkMethod: ({ row }) => {
                 if ($route.path !== '/flow/list/todo') {
-                  return true
+                  if ($route.path == '/flow/list/handled') {
+                    if (
+                      select.custom_model_id == 99 &&
+                      row.custom_model_id === 99 &&
+                      row.status === 1 &&
+                      row.fund_log_is_end === 0
+                    ) {
+                      return true;
+                    }
+                  } else {
+                    return true;
+                  }
                 } else {
-                  if (!select.custom_model_id) return false
+                  if (!select.custom_model_id) return false;
                   if (multiDealFlows.length === 0) {
-                    return true
+                    return true;
                   } else {
-                    const firstFlow = multiDealFlows[0]
-                    return row.current_node.id === firstFlow.current_node.id
+                    const firstFlow = multiDealFlows[0];
+                    return row.current_node.id === firstFlow.current_node.id;
                   }
                 }
-              }
+              },
             }"
             :row-config="{ keyField: 'id' }"
             :custom-config="{ mode: 'popup' }"
@@ -215,77 +254,76 @@
             @menu-click="contextMenuClickEvent"
           >
             <vxe-column type="checkbox" width="50" align="center"></vxe-column>
-            <vxe-column :visible="$store.getters.device === 'mobile'" field="m-operate" type="expand" title="操作" width="60" align="center">
+            <vxe-column
+              :visible="$store.getters.device === 'mobile'"
+              field="m-operate"
+              type="expand"
+              title="操作"
+              width="60"
+              align="center"
+            >
               <template #content="{ row }">
                 <div>
                   <div class="mobile-desc">
                     <div class="mobile-desc-row">
-                      <div class="mobile-desc-row__title">
-                        流程名称
-                      </div>
+                      <div class="mobile-desc-row__title">流程名称</div>
                       <div class="mobile-desc-row__value">
-                        {{ row['custom_model'] ? row['custom_model']['name'] :'' }}
+                        {{
+                          row["custom_model"] ? row["custom_model"]["name"] : ""
+                        }}
                       </div>
                     </div>
                     <div class="mobile-desc-row">
-                      <div class="mobile-desc-row__title">
-                        发起人
-                      </div>
+                      <div class="mobile-desc-row__title">发起人</div>
                       <div class="mobile-desc-row__value">
-                        {{ row['creator'] ? row['creator']['name'] :'' }}
+                        {{ row["creator"] ? row["creator"]["name"] : "" }}
                       </div>
                     </div>
                     <div class="mobile-desc-row">
-                      <div class="mobile-desc-row__title">
-                        发起人
-                      </div>
+                      <div class="mobile-desc-row__title">发起人</div>
                       <div class="mobile-desc-row__value">
-                        {{ (row['last_log'] && row['last_log']['user']) ? row['last_log']['user']['name'] :'' }}
+                        {{
+                          row["last_log"] && row["last_log"]["user"]
+                            ? row["last_log"]["user"]["name"]
+                            : ""
+                        }}
                       </div>
                     </div>
                     <div class="mobile-desc-row">
-                      <div class="mobile-desc-row__title">
-                        当前节点
-                      </div>
+                      <div class="mobile-desc-row__title">当前节点</div>
                       <div class="mobile-desc-row__value">
-                        {{ (row['current_node']) ? row['current_node']['name'] :'' }}
+                        {{
+                          row["current_node"] ? row["current_node"]["name"] : ""
+                        }}
                       </div>
                     </div>
                     <div class="mobile-desc-row">
-                      <div class="mobile-desc-row__title">
-                        简要
-                      </div>
+                      <div class="mobile-desc-row__title">简要</div>
                       <div class="mobile-desc-row__value">
-                        {{ row['_simple'] }}
+                        {{ row["_simple"] }}
                       </div>
                     </div>
                     <div class="mobile-desc-row">
-                      <div class="mobile-desc-row__title">
-                        发起日期
-                      </div>
+                      <div class="mobile-desc-row__title">发起日期</div>
                       <div class="mobile-desc-row__value">
-                        {{ row['created_at'] }}
+                        {{ row["created_at"] }}
                       </div>
                     </div>
                     <div class="mobile-desc-row">
-                      <div class="mobile-desc-row__title">
-                        当前状态
-                      </div>
+                      <div class="mobile-desc-row__title">当前状态</div>
                       <div class="mobile-desc-row__value">
                         <el-tag
                           size="mini"
                           :type="statusColor.get(row.status)"
                           effect="dark"
-                        >{{ myStatus.get(row.status) }}</el-tag
+                          >{{ myStatus.get(row.status) }}</el-tag
                         >
                       </div>
                     </div>
                     <div class="mobile-desc-row">
-                      <div class="mobile-desc-row__title">
-                        我是否退回过
-                      </div>
+                      <div class="mobile-desc-row__title">我是否退回过</div>
                       <div class="mobile-desc-row__value">
-                        {{ row.flow_log_cancel?'是':'否' }}
+                        {{ row.flow_log_cancel ? "是" : "否" }}
                       </div>
                     </div>
                   </div>
@@ -295,14 +333,14 @@
                       type="primary"
                       size="mini"
                       @click="handle(row)"
-                    >办理</el-button
+                      >办理</el-button
                     >
                     <el-button
                       plain
                       type="primary"
                       size="mini"
                       @click="copyTo(row)"
-                    >抄送</el-button
+                      >抄送</el-button
                     >
                     <el-button
                       v-if="row.can_recall"
@@ -310,20 +348,24 @@
                       type="danger"
                       size="mini"
                       @click="recall(row)"
-                    >撤回</el-button
+                      >撤回</el-button
                     >
                     <el-button
-                      v-if="row.can_delete || ($store.state.user.adminId === 1)"
+                      v-if="row.can_delete || $store.state.user.adminId === 1"
                       plain
                       type="danger"
                       size="mini"
                       @click="destroy(row)"
-                    >删除</el-button
+                      >删除</el-button
                     >
                   </template>
 
-                  <el-button plain type="success" size="mini" @click="detail(row)"
-                  >查看</el-button
+                  <el-button
+                    plain
+                    type="success"
+                    size="mini"
+                    @click="detail(row)"
+                    >查看</el-button
                   >
                 </div>
               </template>
@@ -334,7 +376,10 @@
               field="title"
               title="工作名称"
               show-overflow
-              :title-prefix="{ content: '点击工作名称查看简要。\n批量审批请先选择流程类型，并勾选同一节点的流程。' }"
+              :title-prefix="{
+                content:
+                  '点击工作名称查看简要。\n批量审批请先选择流程类型，并勾选同一节点的流程。',
+              }"
             ></vxe-column>
             <vxe-column
               :visible="$route.params.type === 'all'"
@@ -351,7 +396,10 @@
               field="creator.name"
             ></vxe-column>
             <vxe-column
-              :visible="$route.params.type !== 'all' && $store.getters.device === 'desktop'"
+              :visible="
+                $route.params.type !== 'all' &&
+                $store.getters.device === 'desktop'
+              "
               width="80"
               title="承办人员"
               align="center"
@@ -372,14 +420,20 @@
               title="简要"
             ></vxe-column>
             <vxe-column
-              :visible="$route.params.type !== 'all' && $store.getters.device === 'desktop'"
+              :visible="
+                $route.params.type !== 'all' &&
+                $store.getters.device === 'desktop'
+              "
               align="center"
               width="140"
               field="current_node.name"
               title="当前节点"
             ></vxe-column>
             <vxe-column
-              :visible="$route.params.type !== 'all' && $store.getters.device === 'desktop'"
+              :visible="
+                $route.params.type !== 'all' &&
+                $store.getters.device === 'desktop'
+              "
               title="收藏状态"
               width="90"
               field="my_fav"
@@ -404,7 +458,10 @@
             ></vxe-column>
             <vxe-column
               width="200"
-              :visible="$route.params.type === 'all' && $store.getters.device === 'desktop'"
+              :visible="
+                $route.params.type === 'all' &&
+                $store.getters.device === 'desktop'
+              "
               align="center"
               field="created_at"
               title="发起日期"
@@ -445,11 +502,10 @@
               title="我是否退回过"
             >
               <template #default="{ row }">
-                {{ row.flow_log_cancel?'是':'否' }}
+                {{ row.flow_log_cancel ? "是" : "否" }}
               </template>
             </vxe-column>
 
-
             <vxe-column
               :visible="$store.getters.device === 'desktop'"
               min-width="360"
@@ -465,14 +521,14 @@
                     type="primary"
                     size="mini"
                     @click="handle(row)"
-                  >办理</el-button
+                    >办理</el-button
                   >
                   <el-button
                     plain
                     type="primary"
                     size="mini"
                     @click="copyTo(row)"
-                  >抄送</el-button
+                    >抄送</el-button
                   >
                   <el-button
                     v-if="row.can_recall"
@@ -480,7 +536,7 @@
                     type="danger"
                     size="mini"
                     @click="recall(row)"
-                  >撤回</el-button
+                    >撤回</el-button
                   >
                   <el-button
                     v-if="row.can_delete"
@@ -488,14 +544,20 @@
                     type="danger"
                     size="mini"
                     @click="destroy(row)"
-                  >删除</el-button
+                    >删除</el-button
                   >
                   <el-button
-                    v-if="$route.params.type === 'handled' && row.custom_model_id===99 && row.status===1 && row.fund_log_is_end===0"
+                    v-if="
+                      $route.params.type === 'handled' &&
+                      row.custom_model_id === 99 &&
+                      row.status === 1 &&
+                      row.fund_log_is_end === 0
+                    "
                     type="primary"
                     size="mini"
                     @click="toOutPay(row)"
-                  >支付</el-button>
+                    >支付</el-button
+                  >
                 </template>
                 <template v-else>
                   <el-button
@@ -504,12 +566,12 @@
                     type="danger"
                     size="mini"
                     @click="destroy(row)"
-                  >删除</el-button
+                    >删除</el-button
                   >
                 </template>
 
                 <el-button plain type="success" size="mini" @click="detail(row)"
-                >查看</el-button
+                  >查看</el-button
                 >
               </template>
             </vxe-column>
@@ -534,7 +596,11 @@
             :page-sizes="[10, 20, 30, 50, 100]"
             :page-size.sync="select.page_size"
             :small="$store.getters.device === 'mobile'"
-            :layout="$store.getters.device === 'desktop' ? 'total, ->, prev, pager, next, sizes, jumper' : 'total, ->, prev, pager, next'"
+            :layout="
+              $store.getters.device === 'desktop'
+                ? 'total, ->, prev, pager, next, sizes, jumper'
+                : 'total, ->, prev, pager, next'
+            "
             :total="total"
           ></el-pagination>
         </div>
@@ -542,23 +608,43 @@
     </el-card>
 
     <share ref="share" :is-show.sync="isShowShare" :flow="pickedFlow"></share>
-    <payMx ref="payMx" :is-show.sync="isShowPay"  @refresh="getList"></payMx>
-    <list-popover :is-show.sync="isShowListPopover" :id="listPopoverId" :pos="listPopoverPos" />
-    <multi-deal :is-show.sync="isShowMultiDeal" :deal-flows="multiDealFlows" @refresh="getList" />
-    <field-export ref="isShowFieldExport" :is-show.sync="isShowFieldExport" :select="select" />
+    <payMx ref="payMx" :is-show.sync="isShowPay" @refresh="getList"></payMx>
+    <list-popover
+      :is-show.sync="isShowListPopover"
+      :id="listPopoverId"
+      :pos="listPopoverPos"
+    />
+    <multi-deal
+      :is-show.sync="isShowMultiDeal"
+      :deal-flows="multiDealFlows"
+      @refresh="getList"
+    />
+    <field-export
+      ref="isShowFieldExport"
+      :is-show.sync="isShowFieldExport"
+      :select="select"
+    />
   </div>
 </template>
 
 <script>
-import { flowList, toggleFav, destroy, recall, updateFlowTime, todoTotal,fieldConfig } from "@/api/flow";
+import {
+  flowList,
+  toggleFav,
+  destroy,
+  recall,
+  updateFlowTime,
+  todoTotal,
+  fieldConfig,
+} from "@/api/flow";
 import moment from "moment/moment";
 import ListPopover from "./components/ListPopover.vue";
-import MultiDeal from "./components/MultiDeal.vue"
+import MultiDeal from "./components/MultiDeal.vue";
 import share from "./components/share.vue";
 import payMx from "./components/payMx.vue";
 
 import FieldExport from "./components/FieldExport.vue";
-import { departmentListNoAuth } from "@/api/common"
+import { departmentListNoAuth } from "@/api/common";
 export default {
   name: "flowList",
   components: {
@@ -566,7 +652,7 @@ export default {
     payMx,
     ListPopover,
     MultiDeal,
-    FieldExport
+    FieldExport,
   },
   data() {
     return {
@@ -580,24 +666,26 @@ export default {
       listPopoverId: "",
       listPopoverPos: {
         top: 100,
-        left: 100
+        left: 100,
       },
       myStatus: new Map([
         [-1, "已退回"],
         [0, "办理中"],
         [1, "已完成"],
       ]),
-      myStatusList:[
+      myStatusList: [
         {
-          value:-1,
-          label:'已退回'
-        },{
-          value:0,
-          label:'办理中'
-        },{
-          value:1,
-          label:'已完成'
-        }
+          value: -1,
+          label: "已退回",
+        },
+        {
+          value: 0,
+          label: "办理中",
+        },
+        {
+          value: 1,
+          label: "已完成",
+        },
       ],
       statusColor: new Map([
         [-1, "warning"],
@@ -663,43 +751,48 @@ export default {
           },
         ],
       },
-      dateRange:'',
+      dateRange: "",
       select: {
         page: 1,
         page_size: 20,
         sort_name: "",
         sort_type: "",
         keyword: "",
-        flow_log_cancel:'',
-        status:'',
+        flow_log_cancel: "",
+        status: "",
         department_id: "",
         is_fav: "",
         custom_model_id: "",
         date_range: "",
         date_type: "create_date",
-        field_id:'',
-        operator:'',
-        field_keyword:''
+        field_id: "",
+        operator: "",
+        field_keyword: "",
+        can_pay: "",
       },
       loading: false,
       list: [],
       total: 0,
 
       title: "",
-      sub2ModelFields:[],
+      sub2ModelFields: [],
       models: [],
-      config:{},
-      modelsField:[],
-      modelsFieldOpr:[{
-        id:'eq',
-        label:'等于'
-      },{
-        id:'neq',
-        label:'不等于'
-      },{
-        id:'like',
-        label:'包含'
-      }],
+      config: {},
+      modelsField: [],
+      modelsFieldOpr: [
+        {
+          id: "eq",
+          label: "等于",
+        },
+        {
+          id: "neq",
+          label: "不等于",
+        },
+        {
+          id: "like",
+          label: "包含",
+        },
+      ],
       dataTypes: [
         {
           value: "create_date",
@@ -713,76 +806,95 @@ export default {
 
       departments: [],
       isShowShare: false,
-      isShowPay:false,
+      isShowPay: false,
       pickedFlow: {},
     };
   },
   methods: {
-    changeDatePicker(e){
-      console.log(e)
-      if(e){
-        this.select.date_range = e.join('~')
-      }else{
-        this.select.date_range = ''
+    changeDatePicker(e) {
+      console.log(e);
+      if (e) {
+        this.select.date_range = e.join("~");
+      } else {
+        this.select.date_range = "";
       }
-      console.log("this.select.date_range",this.select.date_range)
+      console.log("this.select.date_range", this.select.date_range);
     },
     async getDepartments() {
       try {
         this.departments = await departmentListNoAuth({
           page: 1,
-          page_size: 9999
-        })
+          page_size: 9999,
+        });
       } catch (err) {
-        console.error(err)
+        console.error(err);
       }
     },
     // 选择明细
     async toOutPay(row) {
-      this.$refs.payMx.payId = row.id
-      this.isShowPay = true
+      // this.$refs.payMx.payId = row.id;
+      this.$refs.payMx.payList = records;
+      this.isShowPay = true;
+    },
+    // 批量支付
+    multiPay() {
+      const records = this.$refs["table"]?.getCheckboxRecords(true) || [];
+      console.log(records);
+      if (records.length < 1) {
+        this.$message.warning("请选择需要支付的明细");
+        return;
+      }
+      this.$refs.payMx.payList = records;
+      this.isShowPay = true;
     },
 
     contextMenuClickEvent({ menu, row, column }) {
       switch (menu.code) {
-        case 'edit':
+        case "edit":
           // 示例
           if (row && column) {
             const target = this.$router.resolve({
-              path: '/flow/edit',
+              path: "/flow/edit",
               query: {
-                flow_id: row.id
-              }
-            })
-            window.open(target.href, '_blank')
+                flow_id: row.id,
+              },
+            });
+            window.open(target.href, "_blank");
           }
-          break
+          break;
         default:
       }
     },
     contentFormatter(row) {
-      const { data, fields } = row
-      let text = ''
+      const { data, fields } = row;
+      let text = "";
       fields.forEach((field, index) => {
-        let options = []
-        if(data){
-          if (field.show_in_list && field.type !== 'relation' && data[field.name]) {
+        let options = [];
+        if (data) {
+          if (
+            field.show_in_list &&
+            field.type !== "relation" &&
+            data[field.name]
+          ) {
             if (field?.selection_model) {
               options = field.selection_model_items || [];
             }
-            text += `${field.label}:${(field?.selection_model ? options.find(j => j.id === data[field.name])?.name : data[field.name]) ?? '-'}。\n`
+            text += `${field.label}:${
+              (field?.selection_model
+                ? options.find((j) => j.id === data[field.name])?.name
+                : data[field.name]) ?? "-"
+            }。\n`;
           }
-          row._simple = text
+          row._simple = text;
         }
-
-      })
+      });
     },
     cellClickEvent(e) {
-      if (e.column?.field !== 'title') return
-      this.listPopoverId = e.row.id
-      this.listPopoverPos.top = e.$event.clientX
-      this.listPopoverPos.left = e.$event.clientY
-      this.isShowListPopover = true
+      if (e.column?.field !== "title") return;
+      this.listPopoverId = e.row.id;
+      this.listPopoverPos.top = e.$event.clientX;
+      this.listPopoverPos.left = e.$event.clientY;
+      this.isShowListPopover = true;
     },
 
     handle(row) {
@@ -801,7 +913,6 @@ export default {
       this.isShowShare = true;
     },
 
-
     async toggleFav(row) {
       try {
         await toggleFav({
@@ -817,56 +928,58 @@ export default {
       } catch (err) {}
     },
     async destroy(row) {
-      if (row.can_delete || (this.$store.state.user.adminId === 1)) {
+      if (row.can_delete || this.$store.state.user.adminId === 1) {
         try {
           await destroy({ id: row.id });
           await this.getList();
         } catch (err) {}
       }
     },
-    changeModelId(e){
-      console.log("e",e)
-      this.select.field_id = ''
-      this.select.operator = ''
-      this.select.field_keyword = ''
-      if(e){
-        this.getFields(e)
-        this.getList()
+    changeModelId(e) {
+      console.log("e", e);
+      this.select.field_id = "";
+      this.select.operator = "";
+      this.select.field_keyword = "";
+      if (e) {
+        this.getFields(e);
+        this.getList();
       }
     },
     // 获取 字段
-    showExport(){
-      this.$refs.isShowFieldExport.config = this.config
-      this.$refs.isShowFieldExport.sub2ModelFields = this.sub2ModelFields
-      this.isShowFieldExport = true
+    showExport() {
+      this.$refs.isShowFieldExport.config = this.config;
+      this.$refs.isShowFieldExport.sub2ModelFields = this.sub2ModelFields;
+      this.isShowFieldExport = true;
     },
     async getFields(id) {
       try {
-        const { customModel } = await fieldConfig(id)
-        this.modelsField = customModel.fields
-        this.config = customModel
+        const { customModel } = await fieldConfig(id);
+        this.modelsField = customModel.fields;
+        this.config = customModel;
       } catch (err) {
-        console.error(id)
+        console.error(id);
       }
     },
-    async getList(refresh=false) {
-      if (this.loading) return
+    async getList(refresh = false) {
+      if (this.loading) return;
       this.loading = true;
       try {
         if (refresh) {
-          this.select.page = 1
+          this.select.page = 1;
         }
         const res = await flowList(this.$route.params.type, this.select, false);
-        res.data?.data?.forEach(i => this.contentFormatter(i))
+        res.data?.data?.forEach((i) => this.contentFormatter(i));
         this.list = res?.data?.data || [];
         this.total = res?.data?.total ?? 0;
         this.models = res.customModels;
         this.title = res.pageTitle;
-        if(res.sub2ModelFields instanceof Object){
-          this.sub2ModelFields = Object.entries(res.sub2ModelFields).map(([key, value]) => ({
-            label: value,
-            name: key
-          }));
+        if (res.sub2ModelFields instanceof Object) {
+          this.sub2ModelFields = Object.entries(res.sub2ModelFields).map(
+            ([key, value]) => ({
+              label: value,
+              name: key,
+            })
+          );
         }
 
         this.loading = false;
@@ -877,84 +990,94 @@ export default {
     },
 
     async cellDblclickEvent({ row, column }) {
-      if(this.$store.state.user.username !== 'admin') return
-      if(column.field === 'created_at' || column.field === 'updated_at') {
-        this.$prompt('请输入时间', '提示', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          inputPattern:  /^(?:19|20)[0-9][0-9]-(?:(?:0[1-9])|(?:1[0-2]))-(?:(?:[0-2][1-9])|(?:[1-3][0-1])) (?:(?:[0-2][0-3])|(?:[0-1][0-9])):[0-5][0-9]:[0-5][0-9]$/,
-          inputErrorMessage: '时间格式不正确'
+      if (this.$store.state.user.username !== "admin") return;
+      if (column.field === "created_at" || column.field === "updated_at") {
+        this.$prompt("请输入时间", "提示", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          inputPattern:
+            /^(?:19|20)[0-9][0-9]-(?:(?:0[1-9])|(?:1[0-2]))-(?:(?:[0-2][1-9])|(?:[1-3][0-1])) (?:(?:[0-2][0-3])|(?:[0-1][0-9])):[0-5][0-9]:[0-5][0-9]$/,
+          inputErrorMessage: "时间格式不正确",
         }).then(({ value }) => {
           updateFlowTime({
             id: row.id,
-            date: value
-          }).then(_ => {
-            this.$message.success('更新成功')
-            this.getList()
-          })
-        })
+            date: value,
+          }).then((_) => {
+            this.$message.success("更新成功");
+            this.getList();
+          });
+        });
       }
     },
 
     checkboxChange() {
-      const reserveRecords = this.$refs['table']?.getCheckboxReserveRecords() || []
-      const records = this.$refs['table']?.getCheckboxRecords(true) || []
-      this.multiDealFlows = [...reserveRecords, ...records]
+      const reserveRecords =
+        this.$refs["table"]?.getCheckboxReserveRecords() || [];
+      const records = this.$refs["table"]?.getCheckboxRecords(true) || [];
+      this.multiDealFlows = [...reserveRecords, ...records];
       if (this.multiDealFlows.length > 0) {
-        const firstFlow = this.multiDealFlows[0]
-        this.multiDealFlows = this.multiDealFlows.filter(flow => {
+        const firstFlow = this.multiDealFlows[0];
+        this.multiDealFlows = this.multiDealFlows.filter((flow) => {
           if (flow.current_node.id === firstFlow.current_node.id) {
-            return true
+            return true;
           } else {
-            this.$refs['table'].setCheckboxRow(flow, false)
+            this.$refs["table"].setCheckboxRow(flow, false);
           }
-        })
+        });
       }
     },
     async getTodoTotal() {
       try {
-        const res = await todoTotal()
-        console.log(res)
-        this.todoTotal = res?.todo || []
+        const res = await todoTotal();
+        console.log(res);
+        this.todoTotal = res?.todo || [];
       } catch (err) {
-        console.error(err)
+        console.error(err);
       }
     },
     multiDeal() {
       if (this.multiDealFlows.length === 0) {
-        this.$message.warning('请先勾选需要审批的流程')
-        return
+        this.$message.warning("请先勾选需要审批的流程");
+        return;
       }
-      this.isShowMultiDeal = true
-    }
+      this.isShowMultiDeal = true;
+    },
   },
   computed: {
     menuConfig() {
-      console.log("this.$store.state",this.$store.state,this.$store.state.user.roles.includes('全局流程监管'))
-      if (this.$store.state.user.roles.includes('全局流程监管')) {
+      console.log(
+        "this.$store.state",
+        this.$store.state,
+        this.$store.state.user.roles.includes("全局流程监管")
+      );
+      if (this.$store.state.user.roles.includes("全局流程监管")) {
         return {
-          className: 'my-menus',
+          className: "my-menus",
           body: {
             options: [
               [
-                { code: 'edit', name: '编辑', prefixConfig: { icon: 'vxe-icon-feedback' } },
+                {
+                  code: "edit",
+                  name: "编辑",
+                  prefixConfig: { icon: "vxe-icon-feedback" },
+                },
               ],
-            ]
-          }
-        }
+            ],
+          },
+        };
       } else {
-        return {}
+        return {};
       }
-    }
+    },
   },
   watch: {
-    'select.custom_model_id': {
+    "select.custom_model_id": {
       handler: function () {
-        this.$refs['table'].clearCheckboxRow()
-        this.$refs['table'].clearCheckboxReserve()
-        this.multiDealFlows = []
-      }
-    }
+        this.$refs["table"].clearCheckboxRow();
+        this.$refs["table"].clearCheckboxReserve();
+        this.multiDealFlows = [];
+      },
+    },
   },
   activated() {
     this.getTodoTotal();
@@ -986,7 +1109,6 @@ export default {
   margin-left: 4px;
 }
 .mobile-desc {
-
   &-row {
     display: flex;
     margin-bottom: 20px;