2020-02-07

king

2020-02-07 7051e15582aee4163b3c8dd13dc85f4f1e2ce6eb

 src/tabviews/formtab/formgroup/index.jsx

@@ -1,6 +1,6 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { Form, Row, Col, Input, InputNumber, Select, DatePicker, notification } from 'antd'
import { Form, Row, Col, Input, InputNumber, Select, DatePicker, notification, Collapse } from 'antd'
import moment from 'moment'
import { formRule } from '@/utils/option.js'
import Utils from '@/utils/utils.js'
@@ -9,13 +9,14 @@

const {MonthPicker} = DatePicker
const { TextArea } = Input
const { Panel } = Collapse

class MainSearch extends Component {
  static propTpyes = {
    action: PropTypes.object,    // 按钮信息、表单列表
    setting: PropTypes.object,   // 基本信息
    groups: PropTypes.array,     // 表单组
    dict: PropTypes.object,      // 字典项
    data: PropTypes.any,         // 表格数据
    BData: PropTypes.any,        // 主表数据
    configMap: PropTypes.object, // 按钮及下拉表单配置信息集
    inputSubmit: PropTypes.func  // input回车提交
  }
@@ -27,90 +28,50 @@
  }

  componentDidMount () {
    const { data, BData } = this.props
    let action = JSON.parse(JSON.stringify(this.props.action))
    const { data, groups } = this.props

    let datatype = {}
    let readtype = {}
    let formlist = []
    if (action.groups.length > 0) {
      action.groups.forEach(group => {
        if (group.sublist.length === 0) return
    let _formlist = []

        if (!group.default) {
          formlist.push({
            type: 'title',
            label: group.label,
            uuid: group.uuid
          })
        }

        group.sublist.forEach(item => {
          datatype[item.field] = item.type
          readtype[item.field] = item.readonly === 'true'
          formlist.push(item)
        })
      })
    } else {
      formlist = action.fields.map(item => {
    let _groups = groups.map(group => {
      group.sublist = group.sublist.map(item => {
        datatype[item.field] = item.type
        readtype[item.field] = item.readonly === 'true'
  
        if (!/^date/.test(item.type) && data && data.hasOwnProperty(item.field)) {
          item.initval = data[item.field]
        }

        _formlist.push(item)

        return item
      })
    }

    let _inputfields = formlist.filter(item => item.type === 'text' || item.type === 'number') // 用于过滤下拉菜单关联表单

    formlist = formlist.map(item => {
      if (item.type === 'select' || item.type === 'link' || item.type === 'multiselect') {
        if (item.setAll === 'true') {
          item.options.unshift({
            key: Utils.getuuid(),
            Value: '',
            Text: this.props.dict['main.all']
          })
        }

        if (item.resourceType === '1' && this.props.configMap.hasOwnProperty(item.uuid)) {
          item.options = [...item.options, ...this.props.configMap[item.uuid]]
        }

        item.oriOptions = JSON.parse(JSON.stringify(item.options))

        if (item.linkSubField && item.linkSubField.length > 0) {
          let _fields = _inputfields.map(_item => _item.field)
          item.linkSubField = item.linkSubField.filter(_item => _fields.includes(_item))
        }
      }

      if (item.type === 'linkMain' && BData && BData.hasOwnProperty(item.field)) {
        item.initval = BData[item.field]
      } else if (!/^date/.test(item.type) && this.props.data && this.props.data.hasOwnProperty(item.field)) {
        item.initval = this.props.data[item.field]
      }

      return item
      return group
    })

    let error = false

    formlist = formlist.map(item => {
      if (item.type === 'link') {
        let supItem = formlist.filter(form => form.field === item.linkField)[0]

        if (!supItem && data && data.hasOwnProperty(item.linkField)) {
          supItem = {initval: data[item.linkField]}
    _groups = _groups.map(group => {
      group.sublist = group.sublist.map(item => {
        if (item.type === 'link') {
          let supItem = _formlist.filter(form => form.field === item.linkField)[0]
  
          if (!supItem && data && data.hasOwnProperty(item.linkField)) {
            supItem = {initval: data[item.linkField]}
          }
          
          if (!supItem) {
            error = true
          } else {
            item.options = item.oriOptions.filter(option => option.parentId === supItem.initval)
          }
        }
        
        if (!supItem) {
          error = true
        } else {
          item.options = item.oriOptions.filter(option => option.parentId === supItem.initval)
        }
      }
        return item
      })

      return item
      return group
    })

    if (error) {
@@ -124,21 +85,8 @@
    this.setState({
      readtype: readtype,
      datatype: datatype,
      formlist: formlist
    }, () => {
      if (action.setting && action.setting.focus) {
        try {
          let _form = document.getElementById('main-form-box')
          let _item = _form.getElementsByTagName('input')
          _item = [..._item]
          _item.forEach(input => {
            if (!input || input.id !== action.setting.focus) return
            input.select()
          })
        } catch {
          console.warn('表单获取失败！')
        }
      }
      formlist: _formlist,
      groups: _groups
    })
  }

@@ -204,28 +152,22 @@
    })
  }

  getFields() {
  getFields(formlist) {
    const { getFieldDecorator } = this.props.form

    const fields = []
    let cols = 2
    if (this.props.action.setting && this.props.action.setting.cols) {
      cols = parseInt(this.props.action.setting.cols)
    if (this.props.setting && this.props.setting.cols) {
      cols = parseInt(this.props.setting.cols)
      if (cols > 3 || cols < 1) {
        cols = 2
      }
    }

    this.state.formlist.forEach((item, index) => {
      if ((!item.field && item.type !== 'title') || item.hidden === 'true') return
    formlist.forEach((item, index) => {
      if (item.hidden === 'true') return
      
      if (item.type === 'title') {
        fields.push(
          <Col span={24} key={index}>
            <p>{item.label}</p>
          </Col>
        )
      } else if (item.type === 'text') {
      if (item.type === 'text') {
        fields.push(
          <Col span={24 / cols} key={index}>
            <Form.Item label={item.label}>
@@ -395,7 +337,6 @@
                  }
                ]
              })(
                // <DatePicker showTime getCalendarContainer={() => document.getElementById('form-box')} />
                <DatePicker showTime />
              )}
            </Form.Item>
@@ -453,15 +394,7 @@
          </Col>
        )
      } else if (item.type === 'funcvar') {
        // fields.push(
        //   <Col span={24 / cols} key={index}>
        //     <Form.Item label={item.label}>
        //       {getFieldDecorator(item.field, {
        //         initialValue: item.linkfield || '',
        //       })(<Input placeholder="" autoComplete="off" disabled={item.readonly === 'true'} />)}
        //     </Form.Item>
        //   </Col>
        // )

      } else if (item.type === 'textarea') {
        let _labelcol = cols !== 3 ? 8 / cols : 3
        let _wrapcol = cols !== 3 ? 16 + (cols - 1) * 4 : 21
@@ -619,6 +552,7 @@
  }

  render() {
    const { groups } = this.props
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
@@ -629,9 +563,20 @@
        sm: { span: 16 }
      }
    }

    let keys = groups.map(group => group.uuid)
    return (
      <Form {...formItemLayout} className="ant-advanced-search-form main-form-field" id="main-form-box">
        <Row gutter={24}>{this.getFields()}</Row>
      <Form {...formItemLayout}>
        <Collapse
          defaultActiveKey={keys}
          expandIconPosition='right'
        >
          {groups.map(group =>
            <Panel header={group.label} key={group.uuid}>
              <Row gutter={24}>{this.getFields(group.sublist)}</Row>
            </Panel>
          )}
        </Collapse>
      </Form>
    )
  }