gm-printer 10.42.4-beta.1 → 10.42.4-beta.2

package/locales/en.json

@@ -16,6 +16,9 @@
   "粗细": "",
   "高": "",
   "图片大小不能超过500Kb": "",
+  "图片大小不能超过2M": "Image size cannot exceed 2M",
+  "仅支持jpg、jpeg、png格式的图片": "Only JPG, JPEG, and PNG images are supported",
+  "支持插入2M以内的jpg、jpeg、png格式图片": "Support inserting JPG, JPEG, or PNG images within 2M",
   "配送单特殊控制": "",
   "添加字段": "",
   "编辑字段": "",

package/locales/th.json

@@ -16,6 +16,9 @@
   "粗细": "",
   "高": "",
   "图片大小不能超过500Kb": "",
+  "图片大小不能超过2M": "ขนาดรูปภาพต้องไม่เกิน 2M",
+  "仅支持jpg、jpeg、png格式的图片": "รองรับเฉพาะรูปภาพรูปแบบ jpg, jpeg, png",
+  "支持插入2M以内的jpg、jpeg、png格式图片": "รองรับการแทรกรูปภาพ jpg, jpeg, png ขนาดไม่เกิน 2M",
   "配送单特殊控制": "",
   "添加字段": "",
   "编辑字段": "",

package/locales/zh-HK.json

@@ -16,6 +16,9 @@
   "粗细": "粗細",
   "高": "高",
   "图片大小不能超过500Kb": "圖片大小不能超過500Kb",
+  "图片大小不能超过2M": "圖片大小不能超過2M",
+  "仅支持jpg、jpeg、png格式的图片": "僅支持jpg、jpeg、png格式的圖片",
+  "支持插入2M以内的jpg、jpeg、png格式图片": "支持插入2M以內的jpg、jpeg、png格式圖片",
   "添加字段": "添加字段",
   "编辑字段": "編輯字段",
   "配送单特殊控制": "配送单特殊控制",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gm-printer",
-  "version": "10.42.4-beta.1",
+  "version": "10.42.4-beta.2",
   "description": "diy printer",
   "main": "src/index.js",
   "scripts": {

package/src/common/common_context_menu.js

@@ -109,7 +109,7 @@ class CommonContextMenu extends React.Component {
     })
   }
 
-  handleInsertBlock = (type, link) => {
+  handleInsertBlock = (type, link, ratio) => {
     const { editStore } = this.props
     const { name, block } = this.state
 
@@ -120,7 +120,8 @@ class CommonContextMenu extends React.Component {
         left: block.left + 'px',
         top: block.top + 'px'
       },
-      link
+      link,
+      ratio
     )
 
     this.setState({
@@ -160,8 +161,8 @@ class CommonContextMenu extends React.Component {
     })
   }
 
-  handleInsertImage = imgURL => {
-    this.handleInsertBlock('image', imgURL)
+  handleInsertImage = (imgURL, ratio) => {
+    this.handleInsertBlock('image', imgURL, ratio)
   }
 
   handleRemove = () => {
@@ -327,6 +328,7 @@ class CommonContextMenu extends React.Component {
               onSuccess={this.handleInsertImage}
               key={v.value}
               text={v.text}
+              imageConfig={this.props.editStore.imageConfig}
             />
           ) : (
             <div

package/src/common/component.js

@@ -391,12 +391,26 @@ Line.propTypes = {
 
 class Size extends React.Component {
   handleChange = (type, value) => {
-    const { onChange, style } = this.props
+    const { onChange, style, ratio } = this.props
 
-    onChange({
+    const next = {
       ...style,
       [type]: value
-    })
+    }
+
+    // 电子签章:有原始比例时宽高联动,不允许拉变形
+    if (ratio && value !== '' && !value.endsWith('%')) {
+      const num = parseFloat(value)
+      if (!_.isNaN(num) && num > 0) {
+        if (type === 'width') {
+          next.height = Math.round(num / ratio) + 'px'
+        } else {
+          next.width = Math.round(num * ratio) + 'px'
+        }
+      }
+    }
+
+    onChange(next)
   }
 
   render() {
@@ -420,7 +434,8 @@ class Size extends React.Component {
 
 Size.propTypes = {
   style: PropTypes.object.isRequired,
-  onChange: PropTypes.func.isRequired
+  onChange: PropTypes.func.isRequired,
+  ratio: PropTypes.number
 }
 
 class ImageUploader extends React.Component {
@@ -437,7 +452,26 @@ class ImageUploader extends React.Component {
       : event.target.files
     const file = droppedFiles[0]
 
-    if (file.size > 512 * 1024) {
+    if (!file) return
+
+    const { imageConfig } = this.props
+
+    if (imageConfig) {
+      // 增强模式(电子签章):校验类型与大小,提示文案由配置方给出
+      const acceptTypes = imageConfig.acceptTypes || [
+        'image/jpeg',
+        'image/jpg',
+        'image/png'
+      ]
+      if (!_.includes(acceptTypes, file.type)) {
+        Tip.warning(imageConfig.wrongTypeTip)
+        return
+      }
+      if (file.size > imageConfig.maxSize) {
+        Tip.warning(imageConfig.overSizeTip)
+        return
+      }
+    } else if (file.size > 512 * 1024) {
       Tip.warning(i18next.t('图片大小不能超过500Kb'))
       return
     }
@@ -463,7 +497,21 @@ class ImageUploader extends React.Component {
       .post()
       .then(json => {
         const imgURL = `${url.imgUrl}/${json.data.img_path_id}`
-        this.props.onSuccess(imgURL)
+
+        // 增强模式下加载原图尺寸,记录原始比例供锁比例使用
+        if (imageConfig) {
+          const img = document.createElement('img')
+          img.onload = () => {
+            this.props.onSuccess(imgURL, img.naturalWidth / img.naturalHeight)
+          }
+          img.onerror = () => {
+            // 拿不到尺寸时降级:只插入不锁比例
+            this.props.onSuccess(imgURL)
+          }
+          img.src = imgURL
+        } else {
+          this.props.onSuccess(imgURL)
+        }
       })
   }
 
@@ -473,16 +521,23 @@ class ImageUploader extends React.Component {
   }
 
   render() {
+    const { imageConfig } = this.props
+
     return (
       <>
         <div onClick={this.handleClick} onDrop={this.handleUpload}>
           {this.props.text}
+          {imageConfig && imageConfig.acceptHint && (
+            <div className='gm-printer-contextmenu-hint'>
+              {imageConfig.acceptHint}
+            </div>
+          )}
         </div>
         <input
           style={{ display: 'none' }}
           type='file'
           ref={this.input}
-          accept='image/*'
+          accept={(imageConfig && imageConfig.accept) || 'image/*'}
           onChange={this.handleUpload}
         />
       </>
@@ -492,7 +547,8 @@ class ImageUploader extends React.Component {
 
 ImageUploader.propTypes = {
   onSuccess: PropTypes.func.isRequired,
-  text: PropTypes.string.isRequired
+  text: PropTypes.string.isRequired,
+  imageConfig: PropTypes.object
 }
 
 class InputWithUnit extends React.Component {

package/src/common/editor_edit_field.js

@@ -100,7 +100,7 @@ class EditorField extends React.Component {
 
   renderBlocks() {
     const { editStore, showNewDate } = this.props
-    const { type, text, style, link } = editStore.computedSelectedInfo
+    const { type, text, style, link, ratio } = editStore.computedSelectedInfo
 
     return (
       <div>
@@ -149,6 +149,11 @@ class EditorField extends React.Component {
             <Size
               style={style}
               onChange={this.handleChangeBlock.bind(this, 'style')}
+              ratio={
+                editStore.imageConfig && editStore.imageConfig.resizable
+                  ? ratio
+                  : undefined
+              }
             />
             <Gap />
 

package/src/common/editor_store.js

@@ -38,6 +38,10 @@ class EditorStore {
   @observable
   tableCustomStyle = 'default'
 
+  // 插入图片增强配置(电子签章),null 时保持旧行为(500Kb/image/*)
+  // { maxSize, maxSizeLabel, accept, acceptHint, resizable }
+  imageConfig = null
+
   @observable
   emptyTableData = []
 
@@ -259,24 +263,6 @@ class EditorStore {
     this.remainPageHeihgt = remainHeight
   }
 
-  @action
-  getFilledTableData(tableData) {
-    const { autoFillConfig } = this.config
-    if (!this.selectedRegion && !autoFillConfig?.checked) return []
-    let tr_count = 0
-
-    tr_count = Math.floor(
-      this.remainPageHeihgt / this.computedTableCustomerRowHeight
-    )
-    if (tr_count <= 0) return []
-
-    const sample = (tableData || []).find(item => item && !item._isEmptyData)
-    const dataKey =
-      this.computedTableSpecialConfig?.dataKey || autoFillConfig?.dataKey
-    const colNumber = detectColNumber(dataKey, tableData)
-    return createEmptyRows(tr_count, sample, colNumber)
-  }
-
   /** 多栏表缺失时（如双栏切三栏），从单栏/双栏源表现场打包到 mockData */
   @action
   ensureMockMultiTable(dataKey) {
@@ -341,18 +327,14 @@ class EditorStore {
       this.ensureMockMultiTable(getDataKey(dataKey, 'vertical'))
     }
 
+    // 开启时不在编辑器侧预推空行：预推依赖挂载时上报的剩余高度，布局（纸张/表格/
+    // 排列）变化后会过期，第一次开启填充会按旧基准多推，把已渲染完的表格撑到下一页。
+    // 空行统一由 Printer 侧「先分页拿基准 → 补空 → 重分页」写入（见 printer.js）
     const syncEmptyRows = key => {
       if (!this.mockData._table?.[key]) return
-      const list = this.mockData._table[key]
-      const hasHadEmptyData = _.some(list, data => data?._isEmptyData)
-      if (isAutoFilling && !hasHadEmptyData) {
-        list.push(...this.getFilledTableData(list))
-      }
       if (!isAutoFilling) {
         this.clearExtraTableData(key)
-        return
       }
-      this.mockData._table[key] = list
     }
 
     const numberEmptyRows = key => {
@@ -381,13 +363,12 @@ class EditorStore {
         const baseRowCount = sourceItems.length
           ? Math.max(1, Math.ceil(sourceItems.length / colNumber))
           : 0
-        // 钉死总行：repack 后 _isEmptyData 会变少，不能再用 emptyTable.length
+        // 钉死总行：repack 后 _isEmptyData 会变少，不能再用 emptyTable.length；
+        // 无空行时不预推，交由 Printer 按当前分页基准补
         const emptyCount = resolveVerticalEmptyCount(
           list.length,
           baseRowCount,
-          emptyTable.length > 0
-            ? emptyTable.length
-            : this.getFilledTableData(list).length,
+          emptyTable.length,
           emptyTable.length > 0
         )
         const dataRows = baseRowCount
@@ -493,6 +474,11 @@ class EditorStore {
   @action.bound
   setPageSize(field, value) {
     this.config.page.size[field] = value
+    // 页面几何变化会让预览 Printer 重挂载；行数填充开启时清掉按旧页高算出的空行，
+    // 重挂载后按新几何重补（对齐切换商品排列时的处理，见 setTableDataKeyEffect）
+    if (this.isAutoFilling || this.config?.autoFillConfig?.checked) {
+      this.clearAllTableEmptyData()
+    }
   }
 
   @computed
@@ -544,6 +530,10 @@ class EditorStore {
           height: size.width
         }
       }
+      // 可用页高变了，行数填充开启时清掉按旧方向算出的空行，重挂载后重补
+      if (this.isAutoFilling || this.config?.autoFillConfig?.checked) {
+        this.clearAllTableEmptyData()
+      }
     }
   }
 
@@ -584,6 +574,12 @@ class EditorStore {
       gap,
       name
     }
+    // 纸张类型/内边距变了，可用页高随之变化；行数填充开启时清掉按旧纸张算出的
+    // 空行（fillTableEmptyIndex 对已有空行沿用旧数量不重算，旧数量会把同页后续
+    // 表格挤到下一页），交给 Printer 重挂载后按新页高重补
+    if (this.isAutoFilling || this.config?.autoFillConfig?.checked) {
+      this.clearAllTableEmptyData()
+    }
   }
 
   @action
@@ -730,7 +726,7 @@ class EditorStore {
   }
 
   @action
-  addConfigBlock(name, type, pos = {}, link = '') {
+  addConfigBlock(name, type, pos = {}, link = '', ratio) {
     let blocks
     const arr = name.split('.')
 
@@ -770,19 +766,25 @@ class EditorStore {
           }
         })
         break
-      case 'image':
+      case 'image': {
+        // 有原始比例时按比例初始化高度,避免插入即变形;无 ratio(降级/旧链路)保持 100x100
+        const w = 100
+        const h = ratio ? Math.round(w / ratio) : w
         blocks.push({
           type: 'image',
           link: link,
+          // 电子签章:记录原图宽高比,锁比例用;旧数据无此字段则不锁
+          ratio: ratio,
           style: {
             position: 'absolute',
             left: pos.left || '0px',
             top: pos.top || '0px',
-            width: '100px',
-            height: '100px'
+            width: w + 'px',
+            height: h + 'px'
           }
         })
         break
+      }
       case 'counter':
         blocks.push({
           type: 'counter',

package/src/common/hoc_with_store.js

@@ -1,13 +1,22 @@
 import React from 'react'
+import PropTypes from 'prop-types'
 import { Provider } from 'mobx-react'
 import { getStyleWithDiff } from '../util'
 
 const withStore = store => WrapComponent =>
   class extends React.Component {
+    static propTypes = {
+      config: PropTypes.object,
+      mockData: PropTypes.object,
+      imageConfig: PropTypes.object
+    }
+
     constructor(props) {
       super(props)
       this.store = store
       this.store.init(props.config, props.mockData)
+      // 插入图片增强配置(电子签章):由业务侧 props 传入,不传为 null 保持旧行为
+      this.store.imageConfig = props.imageConfig || null
     }
 
     componentDidMount() {

package/src/common/style.lesss

@@ -166,6 +166,18 @@
         color: white;
         background: rgb(82, 146, 247);
       }
+
+      // 电子签章:插入图片菜单项下的格式提示小字
+      .gm-printer-contextmenu-hint {
+        font-size: 10px;
+        color: #f5222d;
+        line-height: 1.4;
+        padding: 0;
+        &:hover {
+          color: #f5222d;
+          background: transparent;
+        }
+      }
     }
   }
 
@@ -244,6 +256,37 @@
         outline: 1px solid rgb(82, 146, 247);
         z-index: 11;
       }
+
+      // 电子签章:图片四角黑色加粗拖拽手柄
+      .gm-printer-resize-handle {
+        position: absolute;
+        width: 10px;
+        height: 10px;
+        background: #000;
+        border: 2px solid #fff;
+        z-index: 12;
+
+        &.gm-printer-resize-lt {
+          left: -6px;
+          top: -6px;
+          cursor: nwse-resize;
+        }
+        &.gm-printer-resize-rt {
+          right: -6px;
+          top: -6px;
+          cursor: nesw-resize;
+        }
+        &.gm-printer-resize-lb {
+          left: -6px;
+          bottom: -6px;
+          cursor: nesw-resize;
+        }
+        &.gm-printer-resize-rb {
+          right: -6px;
+          bottom: -6px;
+          cursor: nwse-resize;
+        }
+      }
     }
 
     .gm-printer-table {

package/src/editor/store.js

@@ -1,6 +1,19 @@
 import EditorStore from '../common/editor_store'
 import i18next from '../../locales'
 
+// 配送单"电子签章"插入图片增强预设(1056076):2M/指定格式/锁比例/四角拖拽
+// 由业务侧显式传入 <Editor imageConfig={imageConfigDelivery} /> 才生效,不传保持旧行为
+export const imageConfigDelivery = {
+  maxSize: 2 * 1024 * 1024,
+  maxSizeLabel: '2M',
+  accept: 'image/jpeg,image/jpg,image/png',
+  acceptTypes: ['image/jpeg', 'image/jpg', 'image/png'],
+  acceptHint: i18next.t('支持插入2M以内的jpg、jpeg、png格式图片'),
+  overSizeTip: i18next.t('图片大小不能超过2M'),
+  wrongTypeTip: i18next.t('仅支持jpg、jpeg、png格式的图片'),
+  resizable: true
+}
+
 class Store extends EditorStore {
   // 复写父类方法
   setTableDataKeyEffect(target, dataKey) {

package/src/finance_voucher/components/table_subtotal_tr.js

@@ -3,8 +3,7 @@ import i18next from '../../../locales'
 import PropTypes from 'prop-types'
 import _ from 'lodash'
 import { MULTI_SUFFIX } from '../../config'
-import Big from 'big.js'
-import { coverDigit2Uppercase, getDataKey } from '../../util'
+import { coverDigit2Uppercase, getDataKey, maskedSum } from '../../util'
 import { observer } from 'mobx-react'
 import { get } from 'mobx'
 
@@ -47,22 +46,17 @@ const SubtotalTr = props => {
   const tableData = printerStore.data._table[getDataKey(dataKey, arrange)] || []
   // 计算合计
   const sumData = (list, field) => {
-    return _.reduce(
-      list,
-      (a, b) => {
-        let result = a
-
-        const _origin = b._origin || {}
-        const _origin2 = b['_origin' + MULTI_SUFFIX] || {}
-
-        result = a.plus(_origin[field] || 0)
-        if (_origin2[field]) {
-          result = result.plus(_origin2[field])
-        }
-        return result
-      },
-      Big(0)
-    ).toFixed(2)
+    // 收集本列所有值(含多栏 _origin),任一脱敏 '***' 则合计显 '***',否则 Big('***') 会崩溃
+    const values = []
+    _.each(list, b => {
+      const _origin = b._origin || {}
+      const _origin2 = b['_origin' + MULTI_SUFFIX] || {}
+      values.push(_origin[field])
+      if (_origin2[field]) {
+        values.push(_origin2[field])
+      }
+    })
+    return maskedSum(values)
   }
 
   // 每页小计

package/src/index.js

@@ -1,6 +1,7 @@
 // ‼️优先初始化语言设置(必须先初始化语言)
 import '../locales'
 import Editor, { Editor2 } from './editor'
+import { imageConfigDelivery } from './editor/store'
 
 import EditorPurchase from './editor_purchase'
 import EditorExaminingReport from './examining_report_editor'
@@ -31,6 +32,7 @@ export { setLocale } from '../locales'
 export {
   Editor,
   Editor2,
+  imageConfigDelivery,
   EditorStockIn,
   EditorStockOut,
   EditorPurchase,