king
2024-10-02 36276e96db8e9633f4bd68257e4c80fa0efe8c1d
src/views/menudesign/printmenuform/index.jsx
@@ -1,14 +1,20 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { Form, Row, Col, InputNumber, Select, Radio, Tooltip, Input } from 'antd'
import { Form, Row, Col, InputNumber, Select, Radio, Tooltip, Input, Modal } from 'antd'
import { QuestionCircleOutlined, EditOutlined } from '@ant-design/icons'
import CodeMirror from '@/templates/zshare/codemirror'
// import './index.scss'
class MainSearch extends Component {
  static propTpyes = {
    config: PropTypes.object,
    updateConfig: PropTypes.func
  }
  state = {
    visible: false,
    printScripts: ''
  }
  selectChange = (key, value) => {
@@ -76,9 +82,22 @@
    })
  }
  onScriptChange = (val) => {
    this.setState({printScripts: val})
  }
  submit = () => {
    const { config } = this.props
    const { printScripts } = this.state
    this.setState({visible: false})
    this.props.updateConfig({...config, printScripts})
  }
  render() {
    const { config } = this.props
    const { getFieldDecorator } = this.props.form
    const { visible, printScripts } = this.state
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
@@ -91,6 +110,7 @@
    }
    return (
      <>
      <Form {...formItemLayout}>
        <Row>
          <Col span={24}>
@@ -167,13 +187,19 @@
              {getFieldDecorator('printPage', {
                initialValue: config.printPage || 'auto'
              })(
                <Radio.Group onChange={(e) => this.selectChange('printPage', e.target.value)}>
                  <Radio.Group className="mini-radio" onChange={(e) => this.selectChange('printPage', e.target.value)}>
                  <Radio value="auto">自适应</Radio>
                  <Radio value="page">分页</Radio>
                    <Radio value="custom">自定义</Radio>
                </Radio.Group>
              )}
            </Form.Item>
          </Col>
            {config.printPage === 'custom' ? <Col span={24}>
              <Form.Item label="自定义脚本">
                <EditOutlined style={{color: '#1890ff'}} onClick={() => this.setState({visible: true, printScripts: config.printScripts || ''})} />
              </Form.Item>
            </Col> : null}
          {config.printPage === 'page' ? <Col span={24}>
            <Form.Item label="每页数(条)">
              {getFieldDecorator('everyPCount', {
@@ -271,6 +297,19 @@
          </Col>
        </Row>
      </Form>
        <Modal
          title="自定义脚本"
          wrapClassName="normal-css-modal"
          visible={visible}
          width={800}
          maskClosable={false}
          onOk={this.submit}
          onCancel={() => { this.setState({ visible: false })}}
          destroyOnClose
        >
          <CodeMirror mode="text/javascript" theme="cobalt" value={printScripts} onChange={this.onScriptChange} />
        </Modal>
      </>
    )
  }
}