2019-12-08

king

2019-12-08 8c14d194348465710826ed5740173e64bd803f71

 src/templates/modalconfig/index.jsx

@@ -49,6 +49,7 @@
    selectedTables: [],    // 已选表名
    originMenu: null,      // 原始菜单
    groupVisible: false,   // 全局配置模态框
    curgroup: null         // 当前组，新建或编辑
  }

  /**
@@ -66,7 +67,6 @@
      _config = editAction.pageParam
    } else {
      _config = JSON.parse(JSON.stringify((Source.baseConfig)))
      _config.groups[0].sublist = _config.fields.map(field => field.uuid)
    }

    if (!_config.setting.title) {
@@ -192,11 +192,77 @@
   * 1、表单拖拽添加时，检查是否存在示例表单，如存在则去除示例
   * 2、表单移动后，保存移动后的顺序
   */
  handleList = (list) => {
  handleList = (list, group, elementId) => {
    let _config = JSON.parse(JSON.stringify(this.state.config))

    if (list.length > _config.fields.length) {
      _config.fields = list.filter(item => !item.origin)
    if (!group && !elementId) {
      if (list.length > _config.fields.length) {
        _config.fields = list.filter(item => !item.origin)
  
        this.setState({
          loading: true,
          config: _config
        }, () => {
          this.setState({
            loading: false
          })
        })
      } else {
        _config.fields = list
        this.setState({config: _config})
      }
    } else if (group && !elementId) {
      if (list.length > group.sublist.length) {
        group.sublist = list
        _config.groups = _config.groups.map(item => {
          if (item.uuid === group.uuid) {
            return group
          } else {
            return item
          }
        })
  
        this.setState({
          loading: true,
          config: _config
        }, () => {
          this.setState({
            loading: false
          })
        })
      } else {
        group.sublist = list
        _config.groups = _config.groups.map(item => {
          if (item.uuid === group.uuid) {
            return group
          } else {
            return item
          }
        })
        this.setState({config: _config})
      }
    } else if (group && elementId) {
      let element = null
      _config.groups.forEach(item => {
        item.sublist = item.sublist.filter(cell => {
          if (cell.id !== elementId) {
            return true
          } else {
            element = cell
            return false
          }
        })
      })

      group.sublist.push(element)

      _config.groups = _config.groups.map(item => {
        if (item.uuid === group.uuid) {
          return group
        } else {
          return item
        }
      })

      this.setState({
        loading: true,
@@ -206,9 +272,6 @@
          loading: false
        })
      })
    } else {
      _config.fields = list
      this.setState({config: _config})
    }
  }

@@ -627,11 +690,21 @@
      })
    })

    config.fields.forEach(item => {
      if (columns.has(item.field)) {
        columns.set(item.field, {...item, selected: true})
      }
    })
    if (config.groups.length > 1) {
      config.groups.forEach(group => {
        group.sublist.forEach(item => {
          if (columns.has(item.field)) {
            columns.set(item.field, {...item, selected: true})
          }
        })
      })
    } else {
      config.fields.forEach(item => {
        if (columns.has(item.field)) {
          columns.set(item.field, {...item, selected: true})
        }
      })
    }

    this.setState({
      tableVisible: true,
@@ -661,32 +734,33 @@
      columns.set(card.field, card)
    })

    let items = []
    _config.fields.forEach(item => {
      if (columns.has(item.field)) {
        let cell = columns.get(item.field)

        if (cell.selected && cell.type === item.type) { // 数据选择状态及类型未修改时，直接添加
          items.push(item)
        } else if (cell.selected) {                     // 数据类型修改时，重置类型及初始值
          item.type = cell.type
          item.initval = ''
          items.push(item)
        }
        columns.delete(item.field)
      } else if (!item.origin) {                        // 过滤示例项
        items.push(item)
      }
    })

    let _columns = [...columns.values()]
    let indexes = items.map(card => {return card.id})
    let id = Math.max(...indexes, 0) + 1

    _columns.forEach(item => { // 循环添加新增字段
      if (item.selected) {
        let newcard = {
          id: id,
    if (_config.groups.length > 1) {
      _config.groups.forEach(group => {
        let items = []
        group.sublist.forEach(item => {
          if (columns.has(item.field)) {
            let cell = columns.get(item.field)
    
            if (cell.selected && cell.type === item.type) { // 数据选择状态及类型未修改时，直接添加
              items.push(item)
            } else if (cell.selected) {                     // 数据类型修改时，重置类型及初始值
              item.type = cell.type
              item.initval = ''
              items.push(item)
            }
            columns.delete(item.field)
          } else if (!item.origin) {                        // 过滤示例项
            items.push(item)
          }
        })
        group.sublist = items
      })
      
      let _columns = [...columns.values()]
  
      let _additems = _columns.map(item => { // 循环添加新增字段
        return {
          id: Utils.getuuid(),
          uuid: Utils.getuuid(),
          label: item.label,
          field: item.field,
@@ -702,13 +776,56 @@
          orderBy: '',
          orderType: 'asc',
        }
      })
      _config.groups[_config.groups.length - 1].sublist = [..._config.groups[_config.groups.length - 1].sublist, ..._additems]

        items.push(newcard)
        id++
      }
    })

    _config.fields = items
    } else {
      let items = []
      _config.fields.forEach(item => {
        if (columns.has(item.field)) {
          let cell = columns.get(item.field)
  
          if (cell.selected && cell.type === item.type) { // 数据选择状态及类型未修改时，直接添加
            items.push(item)
          } else if (cell.selected) {                     // 数据类型修改时，重置类型及初始值
            item.type = cell.type
            item.initval = ''
            items.push(item)
          }
          columns.delete(item.field)
        } else if (!item.origin) {                        // 过滤示例项
          items.push(item)
        }
      })
  
      let _columns = [...columns.values()]
  
      _columns.forEach(item => { // 循环添加新增字段
        if (item.selected) {
          let newcard = {
            id: Utils.getuuid(),
            uuid: Utils.getuuid(),
            label: item.label,
            field: item.field,
            initval: '',
            type: item.type,
            resourceType: '0',
            setAll: 'false',
            options: [],
            dataSource: '',
            linkField: '',
            valueField: '',
            valueText: '',
            orderBy: '',
            orderType: 'asc',
          }
  
          items.push(newcard)
        }
      })
  
      _config.fields = items
    }

    this.setState({
      tableVisible: false,
@@ -816,12 +933,105 @@
    })
  }

  handleGroup = () => {
  handleGroup = (group) => {
    let curgroup = ''

    if (group) {
      curgroup = group
    } else {
      curgroup = {
        isnew: true,
        label: '',
        default: false,
        uuid: Utils.getuuid(),
        sublist: []
      }
    }

    this.setState({
      groupVisible: true,
      curgroup: curgroup
    })
  }

  closeGroup = (group) => {
    let _this = this

    confirm({
      content: `确定删除分组<<${group.label}>>吗？`,
      okText: this.state.dict['header.confirm'],
      cancelText: this.state.dict['header.cancel'],
      onOk() {
        let _config = JSON.parse(JSON.stringify(_this.state.config))
        _config.groups = _config.groups.filter(item => !(item.uuid === group.uuid))
        let _length = _config.groups.length
        
        if (_length === 1) {
          _config.fields = [...group.sublist, ..._config.groups[0].sublist]
          _config.groups[0].sublist = []
        } else {
          _config.groups[_length - 1].sublist = [...group.sublist, ..._config.groups[_length - 1].sublist]
        }

        _this.setState({
          config: _config,
          loading: true
        }, () => {
          _this.setState({
            loading: false
          })
        })
      },
      onCancel() {}
    })
  }

  handleGroupSave = () => {
    let _group = JSON.parse(JSON.stringify(this.state.curgroup))
    let config = JSON.parse(JSON.stringify(this.state.config))

    this.groupRef.handleConfirm().then(res => {
      _group = {..._group, ...res.target}

      if (_group.isnew) {
        delete _group.isnew
        config.groups.unshift(_group)
        config.groups = config.groups.map(item => {
          if (item.default) {
            return res.default
          } else {
            return item
          }
        })
      } else {
        config.groups = config.groups.map(item => {
          if (item.uuid === _group.uuid) {
            return _group
          } else if (item.default) {
            return res.default
          } else {
            return item
          }
        })
      }

      config.fields = []

      config.groups = config.groups.sort((a, b) => {
        return a.sort - b.sort
      })
      
      this.setState({
        groupVisible: false,
        curgroup: '',
        loading: true,
        config: config
      }, () => {
        this.setState({
          loading: false
        })
      })
    })
  }

  render () {
@@ -903,9 +1113,14 @@
                      config.groups.map(group => {
                        return (
                          <div key={group.uuid}>
                            <p className="group-title">{group.label}</p>
                            <p className={'group-title' + (group.default ? ' default' : '')}>
                              <span>{group.label}</span>
                              <Icon className="edit" type="edit" onClick={() => {this.handleGroup(group)}} />
                              <Icon className="edit close" type="close" onClick={() => {this.closeGroup(group)}} />
                            </p>
                            <DragElement
                              list={config.fields}
                              group={group}
                              list={group.sublist}
                              setting={config.setting}
                              placeholder={this.state.dict['header.form.modal.placeholder']}
                              handleList={this.handleList}
@@ -959,6 +1174,7 @@
          />}
        </Modal>
        <Modal
          wrapClassName="modal-fields"
          title={this.state.dict['header.edit']}
          visible={this.state.tableVisible}
          width={'65vw'}
@@ -1011,9 +1227,10 @@
          destroyOnClose
        >
          <GroupForm
            data={config.setting}
            config={config}
            group={this.state.curgroup}
            dict={this.state.dict}
            wrappedComponentRef={(inst) => this.settingRef = inst}
            wrappedComponentRef={(inst) => this.groupRef = inst}
          />
        </Modal>
      </div>