主附表里,主表是自定义表单,如何在附表底部实现统计功能。

在底部统计所有的本期总电量和本期总水量,根据文档里的来没有效果。

评论区

超级管理员 2026-03-03 16:02

测试正常,看一下是不是你写错了: https://doc.jeelowcode.com/doc/1800-1-9

许汉超 2026-03-03 20:12

我用默认表单是可以显示底部统计数据的,换成自定义表单就不生效了。自定义表单里写了自动计算金额的js增强,自定义表单不知道支不支持实现底部附表统计的,支持的话要哪里调整修改一下。



// 计算缴费总和

function sumFun(bqsfjf, bqdfjf) {

 return (parseFloat(bqsfjf) || 0) + (parseFloat(bqdfjf) || 0)

}

// 计算每期电量差(本期电量 - 上期电量)

function sumFunDfl(sqdfds, bqdfds) {

 return (parseFloat(bqdfds) || 0) - (parseFloat(sqdfds) || 0)

}

/**

* 计算本期水电总额(抄表子表所有行的 sum_all 总和)

*/

function calculateBqsdze() {

 if (!formData.value.sub_tab_cbsf?.tb_sdfzb_cbsf ||

   !Array.isArray(formData.value.sub_tab_cbsf.tb_sdfzb_cbsf)) {

   return 0

 }

 const rows = formData.value.sub_tab_cbsf.tb_sdfzb_cbsf

 let total = 0

 rows.forEach(row => {

   if (row && row.sum_all !== undefined) {

     total += parseFloat(row.sum_all) || 0

   }

 })

 // 保留2位小数

 return Number(total.toFixed(2))

}

/**

* 更新 tb_sdfzb_jf 中的 bqsdze 字段

*/

function updateBqsdze() {

 if (!formData.value.tb_sdfzb_jf) {

   formData.value.tb_sdfzb_jf = { bqsfjf: 0, bqdfjf: 0, sum_bqjfzfy: 0, bqsdze: 0 }

 }

 const newBqsdze = calculateBqsdze()

 const oldBqsdze = parseFloat(formData.value.tb_sdfzb_jf.bqsdze) || 0

 if (Math.abs(newBqsdze - oldBqsdze) > 0.001) { // 使用一个小阈值来比较浮点数

   formData.value.tb_sdfzb_jf.bqsdze = newBqsdze

   console.log('更新本期水电总额:', newBqsdze)

   return true

 }

 return false

}

return {

 /**

  * 初始化数据:将后端返回的数据结构转换为前端展示所需的结构

  */

 initData(formData) {

   return new Promise(resolve => {

     console.log('初始化原始数据:', JSON.stringify(formData))

     if (!formData) {

       formData = {}

     }

     // 创建 sub_tab_cbsf 对象

     if (!formData.sub_tab_cbsf) {

       formData.sub_tab_cbsf = {}

     }

     // 将 tb_sdfzb_cbsf 数组移动到 sub_tab_cbsf 对象下

     if (formData.tb_sdfzb_cbsf && Array.isArray(formData.tb_sdfzb_cbsf)) {

       formData.sub_tab_cbsf.tb_sdfzb_cbsf = formData.tb_sdfzb_cbsf

       delete formData.tb_sdfzb_cbsf

     } else {

       formData.sub_tab_cbsf.tb_sdfzb_cbsf = []

     }

     // 确保 tb_sdfzb_jf 存在

     if (!formData.tb_sdfzb_jf) {

       formData.tb_sdfzb_jf = { bqsfjf: 0, bqdfjf: 0, sum_bqjfzfy: 0 }

     }

     console.log('初始化处理后数据:', JSON.stringify(formData))

     resolve(formData)

   })

 },

 /**

  * 提交前处理:将前端数据结构转换回后端需要的结构

  */

 beforeSubmit(submitData) {

   return new Promise((resolve, reject) => {

     console.log('提交前数据:', JSON.stringify(submitData))

     // 1. 处理子表数据:将 sub_tab_cbsf.tb_sdfzb_cbsf 移回顶层

     if (submitData.sub_tab_cbsf && submitData.sub_tab_cbsf.tb_sdfzb_cbsf) {

       submitData.tb_sdfzb_cbsf = submitData.sub_tab_cbsf.tb_sdfzb_cbsf

     } else {

       submitData.tb_sdfzb_cbsf = []

     }

     // 2. 处理缴费对象:将 tb_sdfzb_jf 对象包装成数组

     if (submitData.tb_sdfzb_jf) {

       submitData.tb_sdfzb_jf = [submitData.tb_sdfzb_jf]

     } else {

       submitData.tb_sdfzb_jf = [{}]

     }

     // 3. 清理临时字段

     if (submitData.sub_tab_cbsf) {

       delete submitData.sub_tab_cbsf.tb_sdfzb_cbsf

     }

     if (submitData.tb_sdfzb_cbsf && Array.isArray(submitData.tb_sdfzb_cbsf)) {

       submitData.tb_sdfzb_cbsf.forEach(row => {

         delete row.$cellEdit

         delete row.$index

       })

     }

     console.log('提交处理后数据:', JSON.stringify(submitData))

     resolve(submitData)

   })

 },

 /**

  * 初始化选项:设置各种监听器,实现自动计算功能

  */

 initOption() {

   console.log('initOption执行,当前数据:', JSON.parse(JSON.stringify(formData.value)))

   // 确保数据结构存在

   function ensureDataStructure() {

     if (!formData.value.sub_tab_cbsf) {

       formData.value.sub_tab_cbsf = { tb_sdfzb_cbsf: [] }

     }

     if (!formData.value.sub_tab_cbsf.tb_sdfzb_cbsf) {

       formData.value.sub_tab_cbsf.tb_sdfzb_cbsf = []

     }

     if (!formData.value.tb_sdfzb_jf) {

       formData.value.tb_sdfzb_jf = { bqsfjf: 0, bqdfjf: 0, sum_bqjfzfy: 0 }

     }

   }

   /**

    * 计算单行数据

    */

   function calculateSingleRow(row, index) {

     if (typeof row !== 'object' || row === null) {

       return false

     }

     let hasChanges = false

     // 电量相关计算

     const sqdfds = parseFloat(row.sqdfds) || 0

     const bqdfds = parseFloat(row.bqdfds) || 0

     const bqdfl = bqdfds - sqdfds

     const dfdj = parseFloat(row.dfdj) || 0

     const sum_money = Number((dfdj * bqdfl).toFixed(2))

     // 水费相关计算

     const sqsfds = parseFloat(row.sqsfds) || 0

     const bqsfds = parseFloat(row.bqsfds) || 0

     const bqsfl = bqsfds - sqsfds

     const sfdj = parseFloat(row.sfdj) || 0

     const sum_sfbqzfy = Number((sfdj * bqsfl).toFixed(2))

     // 合计金额

     const sum_all = Number((sum_money + sum_sfbqzfy).toFixed(2))

     // 更新值并记录变化

     if (row.bqdfl !== bqdfl) {

       row.bqdfl = bqdfl

       hasChanges = true

     }

     if (row.sum_money !== sum_money) {

       row.sum_money = sum_money

       hasChanges = true

     }

     if (row.bqsfl !== bqsfl) {

       row.bqsfl = bqsfl

       hasChanges = true

     }

     if (row.sum_sfbqzfy !== sum_sfbqzfy) {

       row.sum_sfbqzfy = sum_sfbqzfy

       hasChanges = true

     }

     if (row.sum_all !== sum_all) {

       row.sum_all = sum_all

       hasChanges = true

     }

     if (hasChanges) {

       console.log(`第${index}行数据更新:`, {

         bqdfl, sum_money, bqsfl, sum_sfbqzfy, sum_all

       })

     }

     return hasChanges

   }

   /**

    * 计算所有行的数据

    */

   function calculateAllRows() {

     if (!formData.value.sub_tab_cbsf?.tb_sdfzb_cbsf ||

       !Array.isArray(formData.value.sub_tab_cbsf.tb_sdfzb_cbsf)) {

       return false

     }

     const rows = formData.value.sub_tab_cbsf.tb_sdfzb_cbsf

     let hasAnyChanges = false

     rows.forEach((row, index) => {

       if (!row) return

       const rowChanged = calculateSingleRow(row, index)

       if (rowChanged) {

         hasAnyChanges = true

       }

     })

     // 如果有行数据变化,更新本期水电总额

     if (hasAnyChanges) {

       const bqsdzeUpdated = updateBqsdze()

       if (bqsdzeUpdated) {

         hasAnyChanges = true

       }

     }

     return hasAnyChanges

   }

   /**

    * 根据路径计算特定行

    */

   function calculateRowByPath(path) {

     if (!path) return false

     const match = path.match(/sub_tab_cbsf\.tb_sdfzb_cbsf\[(\d+)\]/)

     if (match && formData.value.sub_tab_cbsf?.tb_sdfzb_cbsf) {

       const index = parseInt(match[1])

       const rows = formData.value.sub_tab_cbsf.tb_sdfzb_cbsf

       if (rows && rows[index]) {

         const rowChanged = calculateSingleRow(rows[index], index)

         if (rowChanged) {

           // 行数据变化后更新本期水电总额

           updateBqsdze()

           return true

         }

       }

     }

     return false

   }

   // ==================== 监听器设置 ====================

   // 1. 监听整个子表数组的变化

   useFun.setPropConfig('sub_tab_cbsf.tb_sdfzb_cbsf', {

     change: ({ value }) => {

       console.log('子表数据整体变化:', value)

       setTimeout(() => {

         const hasChanges = calculateAllRows()

         if (hasChanges) {

           formData.value = { ...formData.value }

         }

       }, 50)

     }

   })

   // 2. 监听各个字段的变化

   const fieldsToWatch = ['sqdfds', 'bqdfds', 'dfdj', 'sqsfds', 'bqsfds', 'sfdj']

   fieldsToWatch.forEach(field => {

     useFun.setPropConfig(field, {

       change: ({ value, path }) => {

         console.log(`${field}变化:`, value, 'path:', path)

         setTimeout(() => {

           const hasChanges = calculateRowByPath(path)

           if (hasChanges) {

             formData.value = { ...formData.value }

           }

         }, 30)

       }

     })

   })

   // 3. 监听缴费字段

   useFun.setPropConfig('bqsfjf', {

     change: ({ value }) => {

       if (formData.value.tb_sdfzb_jf) {

         const bqsfjf = parseFloat(value) || 0

         const bqdfjf = parseFloat(formData.value.tb_sdfzb_jf.bqdfjf) || 0

         const newSum = bqsfjf + bqdfjf

         if (formData.value.tb_sdfzb_jf.sum_bqjfzfy !== newSum) {

           formData.value.tb_sdfzb_jf.sum_bqjfzfy = newSum

           formData.value = { ...formData.value }

         }

       }

     }

   })

   useFun.setPropConfig('bqdfjf', {

     change: ({ value }) => {

       if (formData.value.tb_sdfzb_jf) {

         const bqdfjf = parseFloat(value) || 0

         const bqsfjf = parseFloat(formData.value.tb_sdfzb_jf.bqsfjf) || 0

         const newSum = bqsfjf + bqdfjf

         if (formData.value.tb_sdfzb_jf.sum_bqjfzfy !== newSum) {

           formData.value.tb_sdfzb_jf.sum_bqjfzfy = newSum

           formData.value = { ...formData.value }

         }

       }

     }

   })

   // 4. 监听表格操作

   useFun.setPropConfig('addRow', {

     click: () => {

       setTimeout(() => {

         const hasChanges = calculateAllRows()

         // 确保总额也被更新

         updateBqsdze()

         if (hasChanges) {

           formData.value = { ...formData.value }

         }

       }, 100)

     }

   })

   useFun.setPropConfig('deleteRow', {

     click: () => {

       setTimeout(() => {

         const hasChanges = calculateAllRows()

         // 确保总额也被更新

         updateBqsdze()

         if (hasChanges) {

           formData.value = { ...formData.value }

         }

       }, 100)

     }

   })

   // ==================== 初始化 ====================

   setTimeout(() => {

     ensureDataStructure()

     const hasChanges = calculateAllRows()

     // 初始化时也计算一次总额

     updateBqsdze()

     if (hasChanges) {

       formData.value = { ...formData.value }

     }

     console.log('初始化完成,当前数据结构:', {

       hasSubTabCbsf: !!formData.value?.sub_tab_cbsf,

       rowCount: formData.value?.sub_tab_cbsf?.tb_sdfzb_cbsf?.length || 0,

       hasJf: !!formData.value?.tb_sdfzb_jf

     })

   }, 200)

   // ==================== 定时器作为后备机制 ====================

   setInterval(() => {

     if (formData.value.sub_tab_cbsf?.tb_sdfzb_cbsf) {

       const hasChanges = calculateAllRows()

       if (hasChanges) {

         console.log('定时器触发更新')

         formData.value = { ...formData.value }

       }

     }

   }, 300) // 每300ms检查一次

 }

}

回复

扫码关注

添加客服
图片未加载,请刷新后再试
联系我们