gm-printer 10.30.1 → 10.30.2-beta.6

package/package.json

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

package/src/common/editor_edit_field.js

@@ -78,6 +78,11 @@ class EditorField extends React.Component {
     editStore.setCategoryStyle(value)
   }
 
+  handleClassificationAndLabelTally = style => {
+    const { editStore } = this.props
+    editStore.setClassificationAndLabelTally('style', style)
+  }
+
   handleSubtotalStyleChange = value => {
     const { editStore } = this.props
     editStore.setSubtotalStyle(value)
@@ -198,7 +203,12 @@ class EditorField extends React.Component {
   }
 
   renderTable() {
-    const { tableDataKeyList, editStore, isSomeSubtotalTr } = this.props
+    const {
+      tableDataKeyList,
+      editStore,
+      isSomeSubtotalTr,
+      mergeClassificationAndLabel
+    } = this.props
     const { head, headStyle, text, style } = editStore.computedSelectedInfo
     const { config } = editStore
     const isLongPrint = config?.page?.type === LONG_PRINT
@@ -294,6 +304,22 @@ class EditorField extends React.Component {
     const diyOverallOrderValueField =
       editStore.computedTableSpecialConfig?.diyOverallOrder?.fields?.[0]
         .valueField
+
+    // 分类/标签小计 是否需要大写
+    const classificationAndLabelTallyNeedUpperCase =
+      (editStore.computedTableSpecialConfig?.specialConfig &&
+        get(specialConfig, 'needUpperCase')) ||
+      false
+    const classificationAndLabelTallyUpperCaseBefore =
+      (editStore.computedTableSpecialConfig?.specialConfig &&
+        get(specialConfig, 'isUpperCaseBefore')) ||
+      false
+    // 自定义整单合计大写和小写的金额是否分开
+    const classificationAndLabelTallyLowerCaseSeparate =
+      (editStore.computedTableSpecialConfig?.specialConfig &&
+        get(specialConfig, 'isUpperLowerCaseSeparate')) ||
+      false
+
     return (
       <div>
         <Title title={i18next.t('编辑字段')} />
@@ -446,38 +472,41 @@ class EditorField extends React.Component {
         />
         <Gap />
 
-        <Flex>
-          <Flex>{i18next.t('分类设置')}：</Flex>
-          <Fonter
-            style={categoryStyle}
-            onChange={this.handleCategoryStyleChange}
-          />
-          <Separator />
-          <TextAlign
-            style={categoryStyle}
-            onChange={this.handleCategoryStyleChange}
-          />
-        </Flex>
-
-        <Flex>
-          <Flex>{i18next.t('小计设置')}：</Flex>
-          <Fonter
-            style={specialStyle}
-            onChange={this.handleSpecialStyleChange}
-          />
-          <Separator />
-          <TextAlign
-            style={specialStyle}
-            onChange={this.handleSpecialStyleChange}
-          />
-        </Flex>
+        {!mergeClassificationAndLabel && (
+          <>
+            <Flex>
+              <Flex>{i18next.t('分类设置')}：</Flex>
+              <Fonter
+                style={categoryStyle}
+                onChange={this.handleCategoryStyleChange}
+              />
+              <Separator />
+              <TextAlign
+                style={categoryStyle}
+                onChange={this.handleCategoryStyleChange}
+              />
+            </Flex>
 
-        <EditorSubtotalCheck
-          subtotalCheckDisabled
-          subtotalChecked={specialTrNeedUpperCase}
-          subtotalCheckOnChange={editStore.setSpecialUpperCase}
-          subtotalCheckText='显示大写金额'
-        />
+            <Flex>
+              <Flex>{i18next.t('小计设置')}：</Flex>
+              <Fonter
+                style={specialStyle}
+                onChange={this.handleSpecialStyleChange}
+              />
+              <Separator />
+              <TextAlign
+                style={specialStyle}
+                onChange={this.handleSpecialStyleChange}
+              />
+            </Flex>
+            <EditorSubtotalCheck
+              subtotalCheckDisabled
+              subtotalChecked={specialTrNeedUpperCase}
+              subtotalCheckOnChange={editStore.setSpecialUpperCase}
+              subtotalCheckText='显示大写金额'
+            />
+          </>
+        )}
 
         <Flex>
           <Flex>{i18next.t('每页合计设置')}：</Flex>
@@ -685,7 +714,10 @@ class EditorField extends React.Component {
                       : ''
                   }
                   onChange={editStore.setDiyOverallOrderFields}
-                  style={{ width: '100px', margin: '5px 0 5px 0px' }}
+                  style={{
+                    width: '100px',
+                    margin: '5px 0 5px 0px'
+                  }}
                 />
               </Flex>
               <Textarea
@@ -699,6 +731,79 @@ class EditorField extends React.Component {
             </div>
           </Flex>
         )}
+        {mergeClassificationAndLabel && (
+          <>
+            <Flex>{i18next.t('分类/标签小计')}：</Flex>
+            <Flex style={{ marginLeft: 57 }}>
+              <div>
+                <Fonter
+                  style={specialStyle}
+                  onChange={this.handleClassificationAndLabelTally}
+                />
+                <Separator />
+                <TextAlign
+                  style={specialStyle}
+                  onChange={this.handleClassificationAndLabelTally}
+                />
+                <Flex style={{ marginLeft: 0 }}>
+                  {subtotalRadioList.map((fields, i) => {
+                    return (
+                      <Radio
+                        style={{ marginLeft: 5 }}
+                        id={`${fields.id}${i}`}
+                        value={fields.value}
+                        key={fields.id}
+                        inputName='classificationAndLabelTallyRadio'
+                        checked={
+                          (specialConfig?.fields?.[0]?.valueField ??
+                            '出库金额') === fields.id
+                        }
+                        radioChecked={() =>
+                          editStore.setClassificationAndLabelTallyField(fields)
+                        }
+                      />
+                    )
+                  })}
+                </Flex>
+                <EditorSubtotalCheck
+                  subtotalCheckDisabled
+                  subtotalChecked={classificationAndLabelTallyNeedUpperCase}
+                  subtotalCheckOnChange={() =>
+                    editStore.setClassificationAndLabelTally('needUpperCase')
+                  }
+                  subtotalCheckText='显示大写金额'
+                  marginLeft
+                />
+                <EditorSubtotalCheck
+                  subtotalCheckDisabled={
+                    classificationAndLabelTallyNeedUpperCase
+                  }
+                  subtotalChecked={classificationAndLabelTallyUpperCaseBefore}
+                  subtotalCheckOnChange={() =>
+                    editStore.setClassificationAndLabelTally(
+                      'isUpperCaseBefore'
+                    )
+                  }
+                  subtotalCheckText='大写金额在前'
+                  marginLeft
+                />
+                <EditorSubtotalCheck
+                  subtotalCheckDisabled={
+                    classificationAndLabelTallyNeedUpperCase
+                  }
+                  subtotalChecked={classificationAndLabelTallyLowerCaseSeparate}
+                  subtotalCheckOnChange={() =>
+                    editStore.setClassificationAndLabelTally(
+                      'isUpperLowerCaseSeparate'
+                    )
+                  }
+                  subtotalCheckText='大、小写金额分左右两边展示'
+                  marginLeft
+                />
+              </div>
+            </Flex>
+          </>
+        )}
       </div>
     )
   }
@@ -720,7 +825,8 @@ EditorField.propTypes = {
   editStore: PropTypes.object,
   tableDataKeyList: PropTypes.array,
   showNewDate: PropTypes.bool,
-  isSomeSubtotalTr: PropTypes.bool
+  isSomeSubtotalTr: PropTypes.bool,
+  mergeClassificationAndLabel: PropTypes.bool
 }
 EditorField.defaultProps = {
   showNewDate: false

package/src/common/editor_store.js

@@ -1271,6 +1271,69 @@ class EditorStore {
     }
   }
 
+  // 分类/标签 小计
+  @action.bound setClassificationAndLabelTally(key, value = null) {
+    if (this.selectedRegion) {
+      const arr = this.selectedRegion.split('.')
+      const tableConfig = this.config.contents[arr[2]]
+
+      const initValue = {
+        style: {},
+        needUpperCase: false,
+        isUpperCaseBefore: false,
+        isUpperLowerCaseSeparate: false
+      }
+
+      const oldValue = tableConfig.specialConfig
+        ? tableConfig.specialConfig[key] || initValue[key]
+        : initValue[key]
+
+      let newValue = null
+      if (typeof oldValue === 'boolean' && !value) {
+        newValue = !oldValue
+      } else if (typeof value === 'object' && value !== null) {
+        newValue = {
+          ...oldValue,
+          ...value
+        }
+      }
+
+      set(tableConfig, {
+        specialConfig: {
+          ...tableConfig.specialConfig,
+          [key]: newValue
+        }
+      })
+
+      // 没有大写金额时，将大写在前和大小写分开的多选框设置为false
+      if (tableConfig?.specialConfig?.needUpperCase === false) {
+        tableConfig.specialConfig.isUpperCaseBefore &&
+          set(tableConfig.specialConfig, { isUpperCaseBefore: false })
+        tableConfig.specialConfig.isUpperLowerCaseSeparate &&
+          set(tableConfig.specialConfig, { isUpperLowerCaseSeparate: false })
+      }
+    }
+  }
+
+  // 分类/标签 小计设置金额字段
+  @action.bound setClassificationAndLabelTallyField(fields) {
+    if (this.selectedRegion) {
+      const arr = this.selectedRegion.split('.')
+      const tableConfig = this.config.contents[arr[2]]
+
+      set(tableConfig, {
+        specialConfig: {
+          ...tableConfig.specialConfig,
+          fields: [
+            {
+              valueField: fields.id
+            }
+          ]
+        }
+      })
+    }
+  }
+
   @action.bound
   setSpecialUpperCase() {
     if (this.selectedRegion) {

package/src/editor/editor.js

@@ -40,7 +40,14 @@ export const noSubtotalBtnTableDataKeySet = new Set(
 @observer
 class Editor extends React.Component {
   render() {
-    const { onSave, showEditor, addFields, showNewDate, mockData } = this.props
+    const {
+      onSave,
+      showEditor,
+      addFields,
+      showNewDate,
+      mockData,
+      mergeClassificationAndLabel
+    } = this.props
 
     return (
       <div className='gm-printer-edit'>
@@ -83,6 +90,7 @@ class Editor extends React.Component {
             <EditorField
               tableDataKeyList={tableDataKeyList}
               showNewDate={showNewDate}
+              mergeClassificationAndLabel={mergeClassificationAndLabel}
             />
             <Gap height='5px' />
             <EditorAddField addFields={addFields} />
@@ -109,7 +117,8 @@ Editor.propTypes = {
   showEditor: PropTypes.bool,
   mockData: PropTypes.object.isRequired,
   addFields: PropTypes.object.isRequired,
-  showNewDate: PropTypes.bool
+  showNewDate: PropTypes.bool,
+  mergeClassificationAndLabel: PropTypes.bool
 }
 
 Editor.defaultProps = {

package/src/printer/table_special_tr.js

@@ -3,6 +3,7 @@ import _ from 'lodash'
 import PropTypes from 'prop-types'
 import { observer } from 'mobx-react'
 import { has, get } from 'mobx'
+import { Flex } from '../components'
 
 /**
  * 分类小计组件
@@ -13,7 +14,15 @@ import { has, get } from 'mobx'
 const SpecialTr = ({ data, config }) => {
   const specialConfig =
     has(config, 'specialConfig') && get(config, 'specialConfig')
-  const { style, template_text, separator, needUpperCase } = specialConfig
+  const {
+    style,
+    template_text,
+    separator,
+    needUpperCase,
+    isUpperCaseBefore,
+    isUpperLowerCaseSeparate,
+    fields
+  } = specialConfig
   const { list, type, fixedSize } = data
 
   let compiled
@@ -85,16 +94,44 @@ const SpecialTr = ({ data, config }) => {
       if (!data.text)
         throw Error('_special缺少text,请检查data_to_key处理table数据代码!')
 
+      if (isUpperLowerCaseSeparate) {
+        return (
+          <tr>
+            <td
+              colSpan={99}
+              style={Object.assign({ fontWeight: 'bold' }, style)}
+            >
+              <Flex
+                className='gm-flex-justify-between'
+                dangerouslySetInnerHTML={{
+                  __html:
+                    data[fields[0].valueField]?.upperLowerCaseSeparate ||
+                    data.text
+                }}
+              />
+            </td>
+          </tr>
+        )
+      }
+
+      // eslint-disable-next-line no-case-declarations
+      const getHtml = () => {
+        if (isUpperCaseBefore) {
+          return data[fields[0].valueField]?.upperCaseBefore
+        }
+        if (needUpperCase) {
+          return data[fields[0].valueField]?.upperCaseText
+        }
+        return data[fields?.[0]?.valueField]?.text || data.text
+      }
+
       return (
         <tr>
           <td
             colSpan={99}
             style={Object.assign({ fontWeight: 'bold' }, style)}
             dangerouslySetInnerHTML={{
-              __html:
-                needUpperCase && data.upperCaseText
-                  ? data.upperCaseText
-                  : data.text
+              __html: getHtml() || data.text
             }}
           />
         </tr>