gm-printer 10.39.4-beta.2 → 10.39.4-beta.21

package/src/printer/compute_pages.js

@@ -0,0 +1,122 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+import _ from 'lodash'
+import { toJS } from 'mobx'
+import Printer from './printer'
+import getCSS from './get_css'
+import { afterImgAndSvgLoaded } from '../util'
+import { LONG_PRINT } from '../config'
+
+// 与 do_print.js 的容器隔离，使用独立 iframe，避免和打印任务互相 unmount 对方内容
+const printerId = '_gm-printer-compute-pages_' + Math.random()
+let $printer = null
+
+/**
+ * 初始化隐藏渲染容器
+ * 复制自 do_print.js 的 init({ isTest: true }) 分支（iframe 创建 + getCSS 注入），
+ * 差异仅 id 前缀与「永远隐藏」。⚠️ get_css / 容器初始化逻辑变更时两处需同步，
+ * 否则测量环境与打印环境漂移，分页边界不再一致
+ */
+function init() {
+  if (!$printer) {
+    $printer = window.document.createElement('iframe')
+    $printer.id = printerId
+    $printer.style.position = 'fixed'
+    $printer.style.top = '0'
+    $printer.style.width = '100%'
+    // 隐藏起来，用户不可见
+    $printer.style.left = '-2000px'
+    window.document.body.appendChild($printer)
+
+    const idocument = $printer.contentDocument
+    idocument.open()
+    idocument.write('<!DOCTYPE html><html><head></head><body></body></html>')
+    idocument.close()
+
+    const doc = $printer.contentWindow.document
+
+    const style = doc.createElement('style')
+    style.appendChild(doc.createTextNode(getCSS()))
+    doc.head.appendChild(style)
+
+    const div = doc.createElement('div')
+    div.id = 'appContainer'
+
+    doc.body.appendChild(div)
+  }
+}
+
+/**
+ * 按打印分页逻辑计算分页结果（不触发打印）
+ *
+ * 场景：导出功能需要拿到与打印完全一致的分页边界
+ *
+ * 不支持的模板类型（返回空 pages，调用方需自行降级）：
+ *   - batchPrintConfig === 2（合并打印）：componentDidMount 不跑 computedPages，pages 恒空
+ *   - page.type === LONG_PRINT（长条打印）：走 renderLongPage 全量渲染，pages 不对应真实布局
+ *
+ * @param {Object}  options
+ * @param {Object}  options.data             打印数据（结构同 doPrint 的 data，含 _table）
+ * @param {Object}  options.config           模板配置（结构同 doPrint 的 config）
+ * @param {boolean} [options.isSomeSubtotalTr] 每页合计是否展示多个字段（对齐 doPrint 第三参，
+ *                                            影响合计行渲染与行高，进而影响分页边界）
+ * @returns {Promise<{pages: Array, remainPageHeight: number, tableCustomerRowHeight: number}>}
+ *          pages: [[{type, index, begin, end}, ...], ...] 对 data._table[contents[i].dataKey] 行号的切片
+ *          remainPageHeight: 最后一页剩余高度（供行数填充换算）
+ *          tableCustomerRowHeight: 表格行高（供行数填充换算）
+ */
+function computePages({ data, config, isSomeSubtotalTr }) {
+  // 不支持的模板类型提前告警（不阻断，返回结果交由调用方降级处理）
+  if (config.batchPrintConfig === 2 || config.page?.type === LONG_PRINT) {
+    console.warn(
+      '[gm-printer] computePages: 当前模板为合并打印或长条打印，computedPages 不生效，pages 将为空'
+    )
+  }
+
+  return new window.Promise(resolve => {
+    init()
+
+    const $app = $printer.contentWindow.document.getElementById('appContainer')
+    ReactDOM.unmountComponentAtNode($app)
+
+    // computedPages 处理采购明细拆行时会原地 splice data._table，
+    // 深拷贝一份，避免污染调用方数据
+    const clonedData = _.cloneDeep(data)
+    // computedPages 会往 config 顶层写 isSave（store.js），浅拷贝隔离开调用方的
+    // template 对象（stationv2 导出时同一 template 跨多个 sheet 复用）
+    const clonedConfig = { ...config }
+
+    // 依赖 WithStorePrinter 实例字段 printerStore（printer.js）读取分页结果，
+    // Printer 组件重构（store 挂载方式变化）时此处需同步
+    let printerRef = null
+    ReactDOM.render(
+      <Printer
+        ref={ref => {
+          printerRef = ref
+        }}
+        isSomeSubtotalTr={isSomeSubtotalTr}
+        config={clonedConfig}
+        data={clonedData}
+        onReady={() => {
+          // onReady 触发时 componentDidMount 已同步执行完 computedPages()，pages 就绪
+          // 模板含图片时等图片加载完成，避免图片撑高导致测量偏差
+          afterImgAndSvgLoaded(() => {
+            const store = printerRef.printerStore
+            const result = {
+              pages: toJS(store.pages),
+              remainPageHeight: store.remainPageHeight,
+              tableCustomerRowHeight: store.computedTableCustomerRowHeight
+            }
+
+            // 读取完成后卸载，避免 DOM 累积
+            ReactDOM.unmountComponentAtNode($app)
+            resolve(result)
+          }, $app)
+        }}
+      />,
+      $app
+    )
+  })
+}
+
+export { computePages }

package/src/printer/index.js

@@ -7,6 +7,7 @@ import {
   doBatchFinancePrint,
   setPrintStyle
 } from './do_print'
+import { computePages } from './compute_pages'
 import getCSS from './get_css'
 
 export {
@@ -17,5 +18,6 @@ export {
   getCSS,
   getPrintContainerHTML,
   doBatchFinancePrint,
-  setPrintStyle
+  setPrintStyle,
+  computePages
 }

package/src/printer/long_print_table/index.js

@@ -111,7 +111,8 @@ class Table extends React.Component {
       range,
       pageIndex,
       printerStore,
-      isSomeSubtotalTr
+      isSomeSubtotalTr,
+      isLastTablePage
     } = this.props
     // 数据
     dataKey = getDataKey(dataKey, arrange)
@@ -202,7 +203,8 @@ class Table extends React.Component {
                               ? printerStore.templateSpecialDetails(
                                   col,
                                   dataKey,
-                                  i
+                                  i,
+                                  config.specialConfig?.template_text
                                 )
                               : printerStore
                                   .templateTable(
@@ -227,6 +229,7 @@ class Table extends React.Component {
           range={range}
           config={config}
           printerStore={printerStore}
+          isLastTablePage={isLastTablePage}
         />
         <DiyOverallOrder
           range={range}
@@ -307,7 +310,8 @@ class Table extends React.Component {
                             ? printerStore.templateSpecialDetails(
                                 col,
                                 dataKey,
-                                i
+                                i,
+                                config.specialConfig?.template_text
                               )
                             : printerStore
                                 .templateTable(col.text, dataKey, i, pageIndex)
@@ -327,6 +331,7 @@ class Table extends React.Component {
             range={range}
             config={config}
             printerStore={printerStore}
+            isLastTablePage={isLastTablePage}
           />
           <DiyOverallOrder
             range={range}
@@ -385,7 +390,12 @@ Table.propTypes = {
   pageIndex: PropTypes.number.isRequired,
   placeholder: PropTypes.string,
   printerStore: PropTypes.object,
-  isSomeSubtotalTr: PropTypes.bool
+  isSomeSubtotalTr: PropTypes.bool,
+  isLastTablePage: PropTypes.bool
+}
+
+Table.defaultProps = {
+  isLastTablePage: true
 }
 
 export default Table

package/src/printer/multi_column.js

@@ -5,6 +5,7 @@ export const INDEX_KEY = '序号'
 
 const SPECIAL_ROW_KEYS = [
   '_special',
+  '_specialText', // 分类标题行（三级分类/商品分类的品类名行），漏掉会在多栏重排时被当普通行丢弃
   '_diyCategorySubtotal',
   '_diyTagSubtotal',
   '_customTr'

package/src/printer/page_summary.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import _ from 'lodash'
-import { getDataKey, isMultiTable } from '../util'
+import { getDataKey, isMultiTable, isMaskedValue, MASKED_VALUE } from '../util'
 import Big from 'big.js'
 import { observer } from 'mobx-react'
 import { get } from 'mobx'
@@ -19,6 +19,8 @@ const regExp = text => {
  * @returns {*|string}
  */
 const sumCol = (key, dataList, summaryFieldsResultToNumber = []) => {
+  // 任一值脱敏 '***' 则合计显 '***'(原逻辑 Big('***') 抛异常被 catch,合计显空串)
+  if (dataList.some(item => isMaskedValue(item[key]))) return MASKED_VALUE
   let result
   try {
     result = dataList

package/src/printer/printer.js

@@ -14,6 +14,20 @@ import { LONG_PRINT } from '../config'
 import { getDataKey } from '../util'
 import Big from 'big.js'
 
+/** 当前 panel 是否为该表格 content 在全部分页中的最后一次出现 */
+const isLastTablePanel = (pages, pageIndex, panelIndexInPage, tableIndex) => {
+  for (let pi = pages.length - 1; pi >= 0; pi--) {
+    const page = pages[pi] || []
+    for (let pji = page.length - 1; pji >= 0; pji--) {
+      const p = page[pji]
+      if (p?.type === 'table' && p.index === tableIndex) {
+        return pi === pageIndex && pji === panelIndexInPage
+      }
+    }
+  }
+  return true
+}
+
 // Header Sign Footer 相对特殊，要单独处理
 const Header = props => (
   <Panel {...props} name='header' placeholder={i18next.t('页眉')} />
@@ -104,9 +118,7 @@ class Printer extends React.Component {
   componentDidMount() {
     const { printerStore, config, getremainpageHeight } = this.props
     const batchPrintConfig = config.batchPrintConfig
-    // didMount 代表第一次渲染完成
-    printerStore.setReady(true)
-    // 连续打印不需要分页计算
+    // didMount 代表第一次渲染完成，先分页再 ready，避免空 pages 触发 renderPage
     if (batchPrintConfig !== 2) {
       // 先分页拿到剩余高度，再补空行，最后按补空后的数据重新分页
       // （若先分页后补空却不重算，panel.end 仍是补空前行数，空行/后半数据会被裁掉）
@@ -121,8 +133,10 @@ class Printer extends React.Component {
         printerStore.changeTableData()
         printerStore.computedPages()
       }
+      // 获取剩余空白高度，传到 editor
       getremainpageHeight && getremainpageHeight(printerStore.remainPageHeight)
     }
+    printerStore.setReady(true)
 
     // Printer 不是立马就呈现出最终样式，有个过程。这个过程需要时间，什么 ready，不太清楚，估借 setState 来获取过程结束时刻
     this.setState({}, () => {
@@ -292,6 +306,12 @@ class Printer extends React.Component {
                         placeholder={`${i18next.t('区域')} ${panel.index}`}
                         pageIndex={i}
                         isSomeSubtotalTr={isSomeSubtotalTr}
+                        isLastTablePage={isLastTablePanel(
+                          printerStore.pages,
+                          i,
+                          ii,
+                          panel.index
+                        )}
                       />
                     )