king
2023-08-15 a94b0a4d15b26ecf8fe99f0a1c3e60d60b97766d
src/views/menudesign/printmenuform/index.jsx
@@ -1,7 +1,7 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { Form, Row, Col, InputNumber, Select, Radio, Tooltip } from 'antd'
import { QuestionCircleOutlined } from '@ant-design/icons'
import { Form, Row, Col, InputNumber, Select, Radio, Tooltip, Input } from 'antd'
import { QuestionCircleOutlined, EditOutlined } from '@ant-design/icons'
// import './index.scss'
@@ -11,49 +11,24 @@
    updateConfig: PropTypes.func
  }
  changeCount = (val) => {
    if (typeof(val) !== 'number') {
      val = ''
  selectChange = (key, value) => {
    const { config } = this.props
    if (['everyPCount', 'printWidth', 'printHeight'].includes(key)) {
      if (typeof(value) !== 'number') {
        value = ''
      }
    } else if (key === 'callNo') {
      if (!/^[a-zA-Z0-9_]+$/.test(value)) {
        value = ''
      }
    }
    this.props.updateConfig({...this.props.config, everyPCount: val})
  }
  changePrintWidth = (val) => {
    if (typeof(val) !== 'number') {
      val = ''
    this.props.updateConfig({...config, [key]: value})
    if (['pageSize', 'pageLayout', 'pagePadding', 'printCustom'].includes(key)) {
      this.resetPage()
    }
    this.props.updateConfig({...this.props.config, printWidth: val})
  }
  changePrintHeight = (val) => {
    if (typeof(val) !== 'number') {
      val = ''
    }
    this.props.updateConfig({...this.props.config, printHeight: val})
  }
  onPrintPageChange = (val) => {
    this.props.updateConfig({...this.props.config, printPage: val})
  }
  pageSizeChange = (val) => {
    this.props.updateConfig({...this.props.config, pageSize: val})
    this.resetPage()
  }
  onLayoutChange = (val) => {
    this.props.updateConfig({...this.props.config, pageLayout: val})
    this.resetPage()
  }
  onPaddingChange = (val) => {
    this.props.updateConfig({...this.props.config, pagePadding: val})
    this.resetPage()
  }
  onPrintCustomChange = (val) => {
    this.props.updateConfig({...this.props.config, printCustom: val})
    this.resetPage()
  }
  resetPage = () => {
@@ -143,7 +118,7 @@
                  }
                ]
              })(
                <Select onChange={this.pageSizeChange}>
                <Select onChange={(val) => this.selectChange('pageSize', val)}>
                  <Select.Option value="A3">A3</Select.Option>
                  <Select.Option value="A4">A4</Select.Option>
                  <Select.Option value="A5">A5</Select.Option>
@@ -162,7 +137,7 @@
                  }
                ]
              })(
                <Radio.Group onChange={(e) => {this.onLayoutChange(e.target.value)}}>
                <Radio.Group onChange={(e) => this.selectChange('pageLayout', e.target.value)}>
                  <Radio value="vertical">纵向</Radio>
                  <Radio value="horizontal">横向</Radio>
                </Radio.Group>
@@ -180,7 +155,7 @@
                  }
                ]
              })(
                <Radio.Group onChange={(e) => {this.onPaddingChange(e.target.value)}}>
                <Radio.Group onChange={(e) => this.selectChange('pagePadding', e.target.value)}>
                  <Radio value="default">默认</Radio>
                  <Radio value="without">无</Radio>
                </Radio.Group>
@@ -192,26 +167,13 @@
              {getFieldDecorator('printPage', {
                initialValue: config.printPage || 'auto'
              })(
                <Radio.Group onChange={(e) => {this.onPrintPageChange(e.target.value)}}>
                <Radio.Group onChange={(e) => this.selectChange('printPage', e.target.value)}>
                  <Radio value="auto">自适应</Radio>
                  <Radio value="page">分页</Radio>
                </Radio.Group>
              )}
            </Form.Item>
          </Col>
          {/* <Col span={24}>
            <Form.Item label="首页数(条)">
              {getFieldDecorator('firstCount', {
                initialValue: config.firstCount,
                rules: [
                  {
                    required: true,
                    message: '请输入首页数!'
                  }
                ]
              })(<InputNumber min={1} max={1000} precision={1} onChange={this.changeFirstCount}/>)}
            </Form.Item>
          </Col> */}
          {config.printPage === 'page' ? <Col span={24}>
            <Form.Item label="每页数(条)">
              {getFieldDecorator('everyPCount', {
@@ -222,16 +184,9 @@
                    message: '请输入每页数!'
                  }
                ]
              })(<InputNumber min={1} max={1000} precision={1} onChange={this.changeCount}/>)}
              })(<InputNumber min={1} max={1000} precision={1} onChange={(val) => this.selectChange('everyPCount', val)}/>)}
            </Form.Item>
          </Col> : null}
          {/* <Col span={24}>
            <Form.Item label="尾页数(条)">
              {getFieldDecorator('lastCount', {
                initialValue: config.lastCount
              })(<InputNumber min={1} max={1000} precision={1} onChange={this.changeLastCount}/>)}
            </Form.Item>
          </Col> */}
          <Col span={24}>
            <Form.Item label={
              <Tooltip placement="topLeft" title="针对不规则纸张,可自定义设置打印高度和宽度,注:同时设置打印宽度和高度后方可生效。">
@@ -242,7 +197,7 @@
              {getFieldDecorator('printCustom', {
                initialValue: config.printCustom || 'false'
              })(
                <Radio.Group onChange={(e) => {this.onPrintCustomChange(e.target.value)}}>
                <Radio.Group onChange={(e) => this.selectChange('printCustom', e.target.value)}>
                  <Radio value="false">不启用</Radio>
                  <Radio value="true">启用</Radio>
                </Radio.Group>
@@ -253,14 +208,48 @@
            <Form.Item label="打印宽度">
              {getFieldDecorator('printWidth', {
                initialValue: config.printWidth || ''
              })(<InputNumber min={10} max={9999} precision={0} onChange={this.changePrintWidth}/>)}
              })(<InputNumber min={10} max={9999} precision={0} onChange={(val) => this.selectChange('printWidth', val)}/>)}
            </Form.Item>
          </Col> : null}
          {config.printCustom === 'true' ? <Col span={24}>
            <Form.Item label="打印高度">
              {getFieldDecorator('printHeight', {
                initialValue: config.printHeight || ''
              })(<InputNumber min={10} max={9999} precision={0} onChange={this.changePrintHeight}/>)}
              })(<InputNumber min={10} max={9999} precision={0} onChange={(val) => this.selectChange('printHeight', val)}/>)}
            </Form.Item>
          </Col> : null}
          <Col span={24}>
            <Form.Item label="回调">
              {getFieldDecorator('callback', {
                initialValue: config.callback || 'false'
              })(
                <Radio.Group onChange={(e) => this.selectChange('callback', e.target.value)}>
                  <Radio value="false">不启用</Radio>
                  <Radio value="true">启用</Radio>
                </Radio.Group>
              )}
            </Form.Item>
          </Col>
          {config.callback === 'true' ? <Col span={24}>
            <Form.Item label="回调函数">
              s_print_proc <EditOutlined style={{cursor: 'pointer'}} onClick={() => {window.open('#/proc/s_print_proc')}}/>
            </Form.Item>
          </Col> : null}
          {config.callback === 'true' ? <Col span={24}>
            <Form.Item label="回调参数">
              {getFieldDecorator('callNo', {
                initialValue: config.callNo || '',
                rules: [
                  {
                    required: true,
                    message: '请填写回调参数!'
                  },
                  {
                    pattern: /^[a-zA-Z0-9_]+$/,
                    message: '回调参数只可使用字母、数字以及_'
                  }
                ]
              })(<Input onChange={(e) => this.selectChange('callNo', e.target.value)}/>)}
            </Form.Item>
          </Col> : null}
        </Row>