2021-11-12

king

2021-11-12 0c84df247914f893ef5e41d57a422e10a2dc814c

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { Form, Row, Col, Select, Checkbox, Tooltip, Radio } from 'antd'
import { QuestionCircleOutlined } from '@ant-design/icons'
// import './index.scss'
 
class MainTab extends Component {
  static propTpyes = {
    config: PropTypes.object,    // 页面配置
    dict: PropTypes.object,      // 字典项
    calendar: PropTypes.any      // 日历配置信息
  }
 
  handleConfirm = () => {
    // 表单提交时检查输入值是否正确
    return new Promise((resolve, reject) => {
      this.props.form.validateFieldsAndScroll((err, values) => {
        if (!err) {
          resolve(values)
        } else {
          reject(err)
        }
      })
    })
  }
 
  render() {
    const { getFieldDecorator } = this.props.form
    const { calendar, config } = this.props
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 8 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 10 }
      }
    }
    return (
      <Form {...formItemLayout}>
        <Row gutter={24}>
          <Col span={24}>
            <Form.Item label={'开始时间'}>
              {getFieldDecorator('startfield', {
                initialValue: calendar.startfield,
                rules: [
                  {
                    required: true,
                    message: this.props.dict['form.required.select'] + '开始时间!'
                  }
                ]
              })(
                <Select>
                  {config.columns.map(option =>
                    <Select.Option key={option.uuid} value={option.field}>{option.label}</Select.Option>
                  )}
                </Select>
              )}
            </Form.Item>
          </Col>
          <Col span={24}>
            <Form.Item label={'结束时间'}>
              {getFieldDecorator('endfield', {
                initialValue: calendar.endfield,
                rules: [
                  {
                    required: true,
                    message: this.props.dict['form.required.select'] + '结束时间!'
                  }
                ]
              })(
                <Select>
                  {config.columns.map(option =>
                    <Select.Option key={option.uuid} value={option.field}>{option.label}</Select.Option>
                  )}
                </Select>
              )}
            </Form.Item>
          </Col>
          <Col span={24}>
            <Form.Item label={'信息字段'}>
              {getFieldDecorator('remarkfield', {
                initialValue: calendar.remarkfield,
                rules: [
                  {
                    required: true,
                    message: this.props.dict['form.required.select'] + '信息字段!'
                  }
                ]
              })(
                <Select>
                  {config.columns.map(option =>
                    <Select.Option key={option.uuid} value={option.field}>{option.label}</Select.Option>
                  )}
                </Select>
              )}
            </Form.Item>
          </Col>
          <Col span={24}>
            <Form.Item label={'颜色字段'}>
              {getFieldDecorator('colorfield', {
                initialValue: calendar.colorfield,
                rules: [
                  {
                    required: false,
                    message: this.props.dict['form.required.select'] + '颜色字段!'
                  }
                ]
              })(
                <Select>
                  {config.columns.map(option =>
                    <Select.Option key={option.uuid} value={option.field}>{option.label}</Select.Option>
                  )}
                </Select>
              )}
            </Form.Item>
          </Col>
          <Col span={24}>
            <Form.Item label={'日历等级'}>
              {getFieldDecorator('levels', {
                initialValue: calendar.levels,
                rules: [
                  {
                    required: true,
                    message: this.props.dict['form.required.select'] + '日历等级!'
                  }
                ]
              })(
                <Checkbox.Group options={[{ value: 'day', label: '日' }, { value: 'month', label: '月' }, { value: 'year', label: '年' }]}/>
              )}
            </Form.Item>
          </Col>
          <Col span={24}>
            <Form.Item label={
              <Tooltip placement="topLeft" title="开启后，使用系统函数时会自动替换数据源及自定义脚本中的calendarDate与calendarDate1，其值分别为选择年份的开始和结束时间，使用自定义函数时，会增加calendarDate传参，其值为选择年份。">
                <QuestionCircleOutlined className="mk-form-tip" />
                数据刷新
              </Tooltip>
            }>
              {getFieldDecorator('refresh', {
                initialValue: calendar.refresh || 'false',
              })(
                <Radio.Group>
                  <Radio key="true" value="true">开启</Radio>
                  <Radio key="false" value="false">关闭</Radio>
                </Radio.Group>
              )}
            </Form.Item>
          </Col>
        </Row>
      </Form>
    )
  }
}
 
export default Form.create()(MainTab)