gm-printer 10.37.2 → 10.37.3-beta.0

package/package.json

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

package/src/common/editor_store.js

@@ -94,13 +94,45 @@ class EditorStore {
 
   @action
   setSubtotalFieldsCol(arr) {
-    // this.overallOrderShow = !this.overallOrderShow
-    // 重新计算每页合计的单元格
     const table = this.config.contents[arr[2]]
+    if (!table?.subtotal?.show) return
+
+    const colSpanLength = getColSpanLength(table)
+    if (!table.subtotal.fields?.length) {
+      set(table.subtotal, {
+        fields: [
+          {
+            name: '每页合计：',
+            valueField: 'real_item_price',
+            colSpan: colSpanLength
+          }
+        ]
+      })
+      return
+    }
+
     const subtotalLength = table.subtotal.fields.length
     table.subtotal.fields[subtotalLength - 1].colSpan += 1
   }
 
+  @action
+  updateSelectedRegionAfterContentInsert(insertIndex) {
+    const updateNameIndex = name => {
+      if (!name) return name
+      const parts = name.split('.')
+      if (parts[0] !== 'contents') return name
+      const regionIndex = ~~parts[2]
+      if (regionIndex >= insertIndex) {
+        parts[2] = String(regionIndex + 1)
+        return parts.join('.')
+      }
+      return name
+    }
+
+    this.selectedRegion = updateNameIndex(this.selectedRegion)
+    this.selected = updateNameIndex(this.selected)
+  }
+
   @action
   setMultiDigitDecimal(bool) {
     this.isMultiDigitDecimal = bool
@@ -266,6 +298,7 @@ class EditorStore {
       { batchPrintConfig: 1, isFixLastFooter: true },
       config
     )
+    this.defaultTableDataKey = config.defaultTableDataKey || 'orders'
     this.originConfig = config
     this.selected = null
     this.selectedRegion = null
@@ -1205,6 +1238,8 @@ class EditorStore {
             }
           })
         }
+        this.updateSelectedRegionAfterContentInsert(index)
+        this.config = toJS(this.config)
       }
     }
   }

package/src/editor/{editor2.js → editor_menu_config.js}

@@ -13,7 +13,7 @@ import EditorField from '../common/editor_edit_field'
 import EditorAddField from '../common/editor_add_field'
 import EditorPageSummary from '../common/editor_page_summary'
 import EditorCutomizedConfig from '../common/editor_customize_config'
-import ContextMenu from './context_menu2'
+import ContextMenu from './context_menu_config'
 import i18next from '../../locales'
 import withStore from '../common/hoc_with_store'
 
@@ -51,7 +51,6 @@ class Editor extends React.Component {
       customTableConfigs,
       menuConfig
     } = this.props
-    console.log('menuConfig', menuConfig)
     return (
       <div className='gm-printer-edit'>
         <Flex className='gm-printer-edit-title-fixed'>

package/src/editor/index.js

@@ -1,6 +1,6 @@
 import withShadowDom from '../common/hoc_with_shadow_dom'
 import Editor from './editor'
-import Editor22 from './editor2'
+import EditorMenuConfig from './editor_menu_config'
 
 export default withShadowDom(Editor)
-export const Editor2 = withShadowDom(Editor22)
+export const Editor2 = withShadowDom(EditorMenuConfig)

package/src/examining_report_editor/context_menu.js

@@ -0,0 +1,94 @@
+import i18next from '../../locales'
+import React from 'react'
+import PropTypes from 'prop-types'
+import CommonContextMenu from '../common/common_context_menu'
+import { inject, observer } from 'mobx-react'
+import _ from 'lodash'
+import { Printer } from '../printer'
+
+const blockTypeList = [
+  { value: '', text: i18next.t('插入文本') },
+  { value: 'line', text: i18next.t('插入线条') },
+  { value: 'image', text: i18next.t('插入图片') }
+]
+
+@inject(stores => ({
+  editStore: stores.editStore,
+  mockData: stores.mockData
+}))
+@observer
+class ContextMenu extends React.Component {
+  isMenuItemEnabled = key => {
+    const { menuConfig } = this.props
+    if (!menuConfig) return true
+    if (Array.isArray(menuConfig)) return menuConfig.includes(key)
+    if (typeof menuConfig === 'object') return !!menuConfig[key]
+    return true
+  }
+
+  hasSubtotalBtn = name => {
+    if (!name) return false
+    const arr = name.split('.')
+    if (!_.includes(arr, 'table')) return false
+    const dataKey = this.props.editStore.config.contents[arr[2]].dataKey
+    return dataKey === 'examiningDetail' || dataKey.startsWith('examiningDetail_')
+  }
+
+  handleChangeTableDataKey = (key, name) => {
+    const { editStore } = this.props
+    editStore.changeTableDataKey(name, key)
+  }
+
+  renderTableAction = name => {
+    if (!this.hasSubtotalBtn(name)) {
+      return null
+    }
+
+    const arr = name.split('.')
+    const { dataKey } = this.props.editStore.config.contents[arr[2]]
+    const keyArr = dataKey.split('_')
+    const isMultiActive = keyArr.includes('multi')
+
+    return (
+      <>
+        {this.isMenuItemEnabled('multi') && (
+          <div
+            onClick={this.handleChangeTableDataKey.bind(this, 'multi', name)}
+            className={isMultiActive ? 'active' : ''}
+          >
+            {i18next.t('双栏商品')}
+          </div>
+        )}
+      </>
+    )
+  }
+
+  render() {
+    const { editStore, mockData } = this.props
+    return (
+      <CommonContextMenu
+        renderTableAction={this.renderTableAction}
+        insertBlockList={blockTypeList}
+      >
+        <Printer
+          key={editStore.computedPrinterKey}
+          selected={editStore.selected}
+          selectedRegion={editStore.selectedRegion}
+          config={editStore.config}
+          data={mockData}
+        />
+      </CommonContextMenu>
+    )
+  }
+}
+
+ContextMenu.propTypes = {
+  editStore: PropTypes.object,
+  mockData: PropTypes.object,
+  menuConfig: PropTypes.oneOfType([
+    PropTypes.arrayOf(PropTypes.string),
+    PropTypes.object
+  ])
+}
+
+export default ContextMenu

package/src/examining_report_editor/editor.js

@@ -0,0 +1,85 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import _ from 'lodash'
+import { Flex } from '../components'
+import { Gap, Title } from '../common/component'
+import editStore from './store'
+import { observer, inject } from 'mobx-react'
+import EditorTitle from '../common/editor_title'
+import EditorSelect from '../common/editor_select'
+import EditorField from '../common/editor_edit_field'
+import EditorAddField from '../common/editor_add_field'
+import ContextMenu from './context_menu'
+import i18next from '../../locales'
+import withStore from '../common/hoc_with_store'
+
+const tableDataKeyList = [
+  {
+    value: 'examiningDetail',
+    text: i18next.t('检测明细'),
+    hasSubtotalBtn: true
+  }
+]
+
+@withStore(editStore)
+@inject('editStore')
+@observer
+class Editor extends React.Component {
+  render() {
+    const { onSave, showEditor, addFields, menuConfig } = this.props
+
+    return (
+      <div className='gm-printer-edit'>
+        <Flex className='gm-printer-edit-title-fixed'>
+          <Title
+            title={i18next.t('模板预览')}
+            text={
+              <span className='gm-text-desc gm-padding-left-5'>
+                {i18next.t(
+                  '说明：选中内容进行编辑，可拖动字段移动位置，右键使用更多功能'
+                )}
+              </span>
+            }
+          />
+        </Flex>
+
+        {showEditor && (
+          <div className='gm-printer-edit-zone'>
+            <EditorTitle onSave={onSave} />
+            <Gap height='10px' />
+            <EditorSelect />
+            <Gap height='5px' />
+            <EditorField tableDataKeyList={tableDataKeyList} />
+            <Gap height='5px' />
+            <EditorAddField addFields={addFields} />
+
+            <div id='gm-printer-tip' />
+            <div id='gm-printer-modal' />
+          </div>
+        )}
+
+        <div className='gm-printer-edit-wrap'>
+          <ContextMenu menuConfig={menuConfig} />
+        </div>
+      </div>
+    )
+  }
+}
+
+Editor.propTypes = {
+  config: PropTypes.object.isRequired,
+  onSave: PropTypes.func,
+  showEditor: PropTypes.bool,
+  mockData: PropTypes.object.isRequired,
+  addFields: PropTypes.object.isRequired,
+  menuConfig: PropTypes.oneOfType([
+    PropTypes.arrayOf(PropTypes.string),
+    PropTypes.object
+  ])
+}
+
+Editor.defaultProps = {
+  onSave: _.noop
+}
+
+export default Editor

package/src/examining_report_editor/index.js

@@ -0,0 +1,4 @@
+import withShadowDom from '../common/hoc_with_shadow_dom'
+import Editor from './editor'
+
+export default withShadowDom(Editor)

package/src/examining_report_editor/store.js

@@ -0,0 +1,74 @@
+import EditorStore from '../common/editor_store'
+import { action, toJS } from 'mobx'
+import i18next from '../../locales'
+
+const DEFAULT_TABLE_COLUMNS = [
+  {
+    head: i18next.t('序号'),
+    text: i18next.t('{{列.序号}}'),
+    style: { textAlign: 'center' },
+    headStyle: { textAlign: 'center' }
+  },
+  {
+    head: i18next.t('样品名称'),
+    text: i18next.t('{{列.样品名称}}'),
+    style: { textAlign: 'center' },
+    headStyle: { textAlign: 'center' }
+  },
+  {
+    head: i18next.t('样品编码'),
+    text: i18next.t('{{列.样品编码}}'),
+    style: { textAlign: 'center' },
+    headStyle: { textAlign: 'center' }
+  },
+  {
+    head: i18next.t('检测结果'),
+    text: i18next.t('{{列.检测结果}}'),
+    style: { textAlign: 'center' },
+    headStyle: { textAlign: 'center' }
+  }
+]
+
+class Store extends EditorStore {
+  constructor({ defaultTableDataKey }) {
+    super()
+    this.defaultTableDataKey = defaultTableDataKey
+  }
+
+  getDefaultTableConfig() {
+    return {
+      dataKey: this.defaultTableDataKey,
+      subtotal: { show: false },
+      columns: DEFAULT_TABLE_COLUMNS
+    }
+  }
+
+  @action
+  init(config, data) {
+    super.init(config, data)
+    this.defaultTableDataKey = 'examiningDetail'
+  }
+
+  @action.bound
+  addContent(name, index, type, tableConfig = null) {
+    if (type === 'table' && !tableConfig) {
+      tableConfig = this.getDefaultTableConfig()
+    }
+    super.addContent(name, index, type, tableConfig)
+    this.config = toJS(this.config)
+  }
+
+  @action
+  changeTableDataKey(name, key, options = {}) {
+    super.changeTableDataKey(name, key, options)
+    this.config = toJS(this.config)
+  }
+
+  @action
+  removeContent(name) {
+    super.removeContent(name)
+    this.config = toJS(this.config)
+  }
+}
+
+export default new Store({ defaultTableDataKey: 'examiningDetail' })

package/src/index.js

@@ -3,6 +3,7 @@ import '../locales'
 import Editor, { Editor2 } from './editor'
 
 import EditorPurchase from './editor_purchase'
+import examiningReportEditor from './examining_report_editor'
 import EditorStockIn from './editor_stockin'
 import EditorStockOut from './editor_stockout'
 import EditorSettle from './editor_settle'
@@ -32,6 +33,7 @@ export {
   EditorStockIn,
   EditorStockOut,
   EditorPurchase,
+  examiningReportEditor,
   EditorSettle,
   EditorStatement,
   EditorAccoutStatement,

package/src/printer/printer.js

@@ -103,10 +103,10 @@ class Printer extends React.Component {
   componentDidMount() {
     const { printerStore, config, getremainpageHeight } = this.props
     const batchPrintConfig = config.batchPrintConfig
-    // 连续打印不需要计算
+    // didMount 代表第一次渲染完成
+    printerStore.setReady(true)
+    // 连续打印不需要分页计算
     if (batchPrintConfig !== 2) {
-      // didMount 代表第一次渲染完成
-      printerStore.setReady(true)
       printerStore.computedPages()
       if (config.autoFillConfig?.checked) {
         this.props.printerStore.setAutofillConfig(