2021-03-23

king

2021-03-23 a8e94242166881639cecf3809e45ca527233ebd7

 src/tabviews/zshare/mutilform/index.jsx

@@ -33,7 +33,6 @@
  }

  state = {
    cols: 2,         // 显示为多少列
    datatype: null,  // 数据类型
    readtype: null,  // 是否只读
    readin: null,    // 行数据是否写入
@@ -44,20 +43,6 @@
    record: {}       // 记录下拉表单关联字段，用于数据写入
  }

  UNSAFE_componentWillMount () {
    let cols = 2
    if (this.props.action.setting && this.props.action.setting.cols) {
      cols = parseInt(this.props.action.setting.cols)
      if (cols > 4 || cols < 1) {
        cols = 2
      }
    }

    this.setState({
      cols: cols
    })
  }

  componentDidMount () {
    const { data, BData, action } = this.props
    
@@ -66,34 +51,13 @@
    let readin = {}
    let writein = {}
    let fieldlen = {}
    let formlist = []
    let intercepts = []
    let _inputfields = []

    if (action.groups && action.groups.length > 0) {
      let groups = fromJS(action.groups).toJS()
      groups.forEach(group => {
        if (group.sublist.length === 0) return

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

        formlist.push(...group.sublist)
      })
    } else {
      formlist = fromJS(action.fields).toJS()
    }

    let linkFields = {} // 关联菜单
    let supItemVal = {} // 上级菜单初始值
    let deForms = []    // 需要动态获取下拉菜单的表单

    formlist.forEach(item => {
    action.fields.forEach(item => {
      if (item.type === 'text' || item.type === 'number') {              // 用于过滤下拉菜单关联表单
        _inputfields.push(item.field)
      } else if (item.type === 'textarea') {
@@ -107,8 +71,11 @@
      }
    })

    formlist = formlist.map(item => {
      if (item.type === 'title') return item
    let formlist = action.fields.map(item => {
      if (item.labelwidth) {
        item.labelCol = {style: {width: item.labelwidth + '%'}}
      }
      if (item.type === 'split' || item.type === 'hint') return item

      // 数据自动填充
      let _readin = item.readin !== 'false'
@@ -716,13 +683,13 @@

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

    const fields = []
    let filtration = {}

    formlist.forEach((item, index) => {
      if ((!item.field && item.type !== 'title' && item.type !== 'hint') || item.hidden === 'true' || item.type === 'funcvar') return
      if ((!item.field && item.type !== 'split' && item.type !== 'hint') || item.hidden === 'true' || item.type === 'funcvar') return
      if (item.supField) { // 多层表单控制
        let _supVal = this.props.form.getFieldValue(item.supField)

@@ -738,12 +705,7 @@
        }
      }

      let _colspan = 24 / cols
      if (item.entireLine === 'true') {
        _colspan = 24
      }

      if (item.type === 'title') {
      if (item.type === 'split') {
        fields.push(
          <Col span={24} key={index}>
            <p>{item.label}</p>
@@ -751,8 +713,8 @@
        )
      } else if (item.type === 'hint') {
        fields.push(
          <Col span={24} key={index}>
            <Form.Item colon={!!item.label} label={item.label || ' '} className="hint">
          <Col span={item.span || 24} key={index}>
            <Form.Item colon={!!item.label} label={item.label || ' '} labelCol={item.labelCol} className="hint">
              <div className="message">{item.message}</div>
            </Form.Item>
          </Col>
@@ -789,8 +751,8 @@
        }

        fields.push(
          <Col span={_colspan} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -817,8 +779,8 @@
        let precision = (item.decimal || item.decimal === 0) ? item.decimal : null

        fields.push(
          <Col span={_colspan} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -845,8 +807,8 @@
        )
      } else if (item.type === 'color') { // 颜色选择
        fields.push(
          <Col span={_colspan} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -868,8 +830,8 @@
        )
      } else if (item.type === 'checkcard') { // 多选框
        fields.push(
          <Col span={24} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -889,8 +851,8 @@
        )
      } else if (item.type === 'switch') { // 多选框
        fields.push(
          <Col span={_colspan} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -912,8 +874,8 @@
        let _initval = item.initval ? item.initval.split(',').filter(Boolean) : []
        
        fields.push(
          <Col span={_colspan} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -937,8 +899,8 @@
        )
      } else if (item.type === 'radio') { // 单选框
        fields.push(
          <Col span={_colspan} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -962,8 +924,8 @@
        )
      } else if (item.type === 'select' || item.type === 'link') { // 下拉搜索
        fields.push(
          <Col span={_colspan} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -996,8 +958,8 @@
      } else if (item.type === 'multiselect') { // 多选
        let _initval = item.initval ? item.initval.split(',').filter(Boolean) : []
        fields.push(
          <Col span={_colspan} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -1028,8 +990,8 @@
        )
      } else if (item.type === 'date') { // 时间搜索
        fields.push(
          <Col span={_colspan} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -1051,8 +1013,8 @@
        )
      } else if (item.type === 'datemonth') {
        fields.push(
          <Col span={_colspan} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -1074,8 +1036,8 @@
        )
      } else if (item.type === 'datetime') {
        fields.push(
          <Col span={_colspan} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -1116,8 +1078,8 @@
        }

        fields.push(
          <Col span={_colspan} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -1139,8 +1101,8 @@
        )
      } else if (item.type === 'linkMain') {
        fields.push(
          <Col span={_colspan} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -1170,8 +1132,8 @@
          }]
        }
        fields.push(
          <Col span={24} key={index}>
            <Form.Item label={item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -1198,8 +1160,8 @@
        let _max = item.fieldlength || 512

        fields.push(
          <Col span={24} key={index}>
            <Form.Item label={item.hidelabel !== 'true' && item.tooltip ?
          <Col span={item.span || 24} key={index}>
            <Form.Item extra={item.extra || null} labelCol={item.labelCol} label={item.hidelabel !== 'true' && item.tooltip ?
              <Tooltip placement="topLeft" title={item.tooltip}>
                <Icon type="question-circle" />
                {item.label}
@@ -1389,21 +1351,9 @@
  }

  render() {
    const { cols } = this.state
    const formItemLayout = {
      // labelCol: {
      //   xs: { span: 24 },
      //   sm: { span: 8 }
      // },
      // wrapperCol: {
      //   xs: { span: 24 },
      //   sm: { span: 16 }
      // }
    }

    return (
      <Form {...formItemLayout} className="main-form-field" id="main-form-box">
        <Row className={'cols' + cols} gutter={24}>{this.getFields()}</Row>
      <Form className="main-form-field" id="main-form-box">
        <Row gutter={24}>{this.getFields()}</Row>
      </Form>
    )
  }