king
2021-11-12 0c84df247914f893ef5e41d57a422e10a2dc814c
src/templates/sharecomponent/columncomponent/colspanform/index.jsx
@@ -1,9 +1,11 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { Form, Row, Col, Input, InputNumber, Select, Radio } from 'antd'
import { Form, Row, Col, Input, InputNumber, Select, Radio, Tooltip } from 'antd'
import { QuestionCircleOutlined } from '@ant-design/icons'
import { formRule } from '@/utils/option.js'
import TransferForm from '@/templates/zshare/transferform'
import './index.scss'
// import './index.scss'
class MainSearch extends Component {
  static propTpyes = {
@@ -19,7 +21,7 @@
      if (_form && _form.select) {
        _form.select()
      }
    } catch {
    } catch (e) {
      console.warn('表单focus失败!')
    }
  }
@@ -62,6 +64,7 @@
  }
  render() {
    const { card } = this.props
    const { getFieldDecorator } = this.props.form
    const formItemLayout = {
      labelCol: {
@@ -74,16 +77,16 @@
      }
    }
    return (
      <Form {...formItemLayout} className="commontable-cospan-column-form" id="columncolspan">
      <Form {...formItemLayout} style={{minHeight: '190px'}} id="columncolspan">
        <Row gutter={24}>
          <Col span={12}>
            <Form.Item label={this.props.dict['header.form.name']}>
            <Form.Item label={this.props.dict['model.name']}>
              {getFieldDecorator('label', {
                initialValue: this.props.card.label,
                initialValue: card.label,
                rules: [
                  {
                    required: true,
                    message: this.props.dict['form.required.input'] + this.props.dict['header.form.name'] + '!'
                    message: this.props.dict['form.required.input'] + this.props.dict['model.name'] + '!'
                  },
                  {
                    max: formRule.input.max,
@@ -94,66 +97,83 @@
            </Form.Item>
          </Col>
          <Col span={12}>
            <Form.Item label={this.props.dict['header.form.type']}>
            <Form.Item label={this.props.dict['model.form.type']}>
              {getFieldDecorator('type', {
                initialValue: this.props.dict['model.form.colspan'],
                rules: [
                  {
                    required: true,
                    message: this.props.dict['form.required.input'] + this.props.dict['header.form.type'] + '!'
                    message: this.props.dict['form.required.input'] + this.props.dict['model.form.type'] + '!'
                  }
                ]
              })(<Input placeholder="" autoComplete="off" disabled={true}/>)}
            </Form.Item>
          </Col>
          <Col span={12}>
            <Form.Item label={this.props.dict['header.form.align']}>
            <Form.Item label={this.props.dict['model.form.align']}>
              {getFieldDecorator('Align', {
                initialValue: this.props.card.Align,
                initialValue: card.Align,
                rules: [
                  {
                    required: true,
                    message: this.props.dict['form.required.select'] + this.props.dict['header.form.align'] + '!'
                    message: this.props.dict['form.required.select'] + this.props.dict['model.form.align'] + '!'
                  }
                ]
              })(
                <Select
                  getPopupContainer={() => document.getElementById('columncolspan')}
                >
                  <Select.Option value="left">{this.props.dict['header.form.alignLeft']}</Select.Option>
                  <Select.Option value="right">{this.props.dict['header.form.alignRight']}</Select.Option>
                  <Select.Option value="center">{this.props.dict['header.form.alignCenter']}</Select.Option>
                  <Select.Option value="left">{this.props.dict['model.form.alignLeft']}</Select.Option>
                  <Select.Option value="right">{this.props.dict['model.form.alignRight']}</Select.Option>
                  <Select.Option value="center">{this.props.dict['model.form.alignCenter']}</Select.Option>
                </Select>
              )}
            </Form.Item>
          </Col>
          <Col span={12}>
            <Form.Item label={this.props.dict['header.form.columnWidth']}>
            <Form.Item label={this.props.dict['model.form.columnWidth']}>
              {getFieldDecorator('Width', {
                initialValue: this.props.card.Width,
                initialValue: card.Width,
                rules: [
                  {
                    required: true,
                    message: this.props.dict['form.required.input'] + this.props.dict['header.form.columnWidth'] + '!'
                    message: this.props.dict['form.required.input'] + this.props.dict['model.form.columnWidth'] + '!'
                  }
                ]
              })(<InputNumber min={1} max={1000} precision={0} />)}
              })(<InputNumber min={1} max={1000} precision={0} onPressEnter={this.handleSubmit} />)}
            </Form.Item>
          </Col>
          <Col span={12}>
            <Form.Item label={this.props.dict['header.form.Hide']}>
            <Form.Item label={
              <Tooltip placement="topLeft" title="选择显示分组,表格会展开添加分组的子列,此时排列方式会失效。">
                <QuestionCircleOutlined className="mk-form-tip" />
                显示分组
              </Tooltip>
            }>
              {getFieldDecorator('unfold', {
                initialValue: card.unfold || 'false'
              })(
                <Radio.Group>
                  <Radio value="true">{this.props.dict['model.true']}</Radio>
                  <Radio value="false">{this.props.dict['model.false']}</Radio>
                </Radio.Group>
              )}
            </Form.Item>
          </Col>
          <Col span={12}>
            <Form.Item label={this.props.dict['model.hidden']}>
              {getFieldDecorator('Hide', {
                initialValue: this.props.card.Hide,
                initialValue: card.Hide || 'false',
                rules: [
                  {
                    required: true,
                    message: this.props.dict['form.required.select'] + this.props.dict['header.form.Hide'] + '!'
                    message: this.props.dict['form.required.select'] + this.props.dict['model.hidden'] + '!'
                  }
                ]
              })(
                <Radio.Group>
                  <Radio value="true">{this.props.dict['header.form.true']}</Radio>
                  <Radio value="false">{this.props.dict['header.form.false']}</Radio>
                  <Radio value="true">{this.props.dict['model.true']}</Radio>
                  <Radio value="false">{this.props.dict['model.false']}</Radio>
                </Radio.Group>
              )}
            </Form.Item>
@@ -161,7 +181,7 @@
          <Col span={12}>
            <Form.Item label={this.props.dict['header.form.order']}>
              {getFieldDecorator('order', {
                initialValue: this.props.card.order,
                initialValue: card.order,
                rules: [
                  {
                    required: true,
@@ -169,9 +189,7 @@
                  }
                ]
              })(
                <Select
                  getPopupContainer={() => document.getElementById('columncolspan')}
                >
                <Select getPopupContainer={() => document.getElementById('columncolspan')} >
                  <Select.Option value="vertical">{this.props.dict['header.form.vertical']}</Select.Option>
                  <Select.Option value="horizontal">{this.props.dict['header.form.horizontal']}</Select.Option>
                  <Select.Option value="vertical2">{this.props.dict['header.form.vertical2']}</Select.Option>
@@ -182,7 +200,7 @@
            </Form.Item>
          </Col>
          <Col span={24}>
            <TransferForm dict={this.props.dict} columns={this.props.columns} ref="column-transfer" selected={this.props.card.sublist}/>
            <TransferForm columns={this.props.columns} ref="column-transfer" selected={card.sublist}/>
          </Col>
        </Row>
      </Form>