2021-10-08

king

2021-10-08 24bba05db141f358bf1a8bb7213a2432c9de355e

 src/menu/components/table/edit-table/columns/index.jsx

@@ -51,44 +51,23 @@
  render() {
    const { connectDragSource, connectDropTarget, moveCol, addElement, updateCol, editColumn, changeStyle, deleteCol, index, column, align, fields, children, ...restProps } = this.props

    if (index !== undefined) {
      return connectDragSource(
        connectDropTarget(<th {...restProps} index={index} style={{ cursor: 'move', textAlign: align }} onDoubleClick={() => column && this.props.editColumn(column)}>
          <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={
            <div className="mk-popover-control">
              {column && ['custom', 'action'].includes(column.type) ?
                <Icon className="plus" title="添加" type="plus" onClick={() => this.props.addElement(column)} /> : null
              }
              <Icon className="edit" title="编辑" type="edit" onClick={() => this.props.editColumn(column)} />
              {column && column.type === 'custom' ? <Icon className="style" title="调整样式" onClick={() => this.props.changeStyle(column)} type="font-colors" /> : null}
              <Icon className="close" title="删除" type="delete" onClick={this.deleteCol} />
              {column && ['text', 'number'].includes(column.type) ? <MarkColumn columns={fields} marks={column.marks} onSubmit={this.updateMarks} /> : null }
            </div>
          } trigger="hover">
            {children}
          </Popover>
        </th>),
      )
    } else if (column) {
      return (
        <th {...restProps} key={column.uuid} onDoubleClick={() => this.props.editColumn(column)}>
          <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={
            <div className="mk-popover-control">
              {column && ['custom'].includes(column.type) ?
                <Icon className="plus" title="添加" type="plus" onClick={() => this.props.addElement(column)} /> : null
              }
              <Icon className="edit" title="编辑" type="edit" onClick={() => this.props.editColumn(column)} />
              <Icon className="close" title="删除" type="delete" onClick={this.deleteCol} />
              {column && ['text', 'number'].includes(column.type) ? <MarkColumn columns={fields} marks={column.marks} onSubmit={this.updateMarks} /> : null }
            </div>
          } trigger="hover">
            {children}
          </Popover>
        </th>
      )
    } else {
      return (<th {...restProps}>{children}</th>)
    }
    return connectDragSource(
      connectDropTarget(<th {...restProps} index={index} style={{ cursor: 'move', textAlign: align }} onDoubleClick={() => column && this.props.editColumn(column)}>
        <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={
          <div className="mk-popover-control">
            {column && ['custom', 'action'].includes(column.type) ?
              <Icon className="plus" title="添加" type="plus" onClick={() => this.props.addElement(column)} /> : null
            }
            <Icon className="edit" title="编辑" type="edit" onClick={() => this.props.editColumn(column)} />
            {column && column.type === 'custom' ? <Icon className="style" title="调整样式" onClick={() => this.props.changeStyle(column)} type="font-colors" /> : null}
            <Icon className="close" title="删除" type="delete" onClick={this.deleteCol} />
            {column && ['text', 'number'].includes(column.type) ? <MarkColumn columns={fields} marks={column.marks} onSubmit={this.updateMarks} /> : null }
          </div>
        } trigger="hover">
          {children}
        </Popover>
      </th>),
    )
  }
}

@@ -416,36 +395,6 @@
    document.body.removeChild(oInput)
  }

  handlecolumns = (columns, fields, config, isSub) => {
    return columns.map((col, index) => {
      return {
        title: col.label,
        dataIndex: col.uuid,
        align: col.Align,
        sorter: !isSub && col.IsSort === 'true',
        onCell: () => ({
          column: col,
          width: col.Width,
          config: config,
          upComponent: this.updateCol
        }),
        onHeaderCell: () => ({
          index: isSub ? undefined : index,
          column: col,
          fields: fields,
          align: col.Align,
          moveCol: this.moveCol,
          updateCol: this.updateCol,
          addElement: this.addElement,
          editColumn: this.editColumn,
          changeStyle: this.changeStyle,
          deleteCol: this.deleteCol,
        }),
        children: col.subcols && col.subcols.length ? this.handlecolumns(col.subcols, fields, config, true) : null,
      }
    })
  }

  syncfield = () => {
    const { fields } = this.state
    let columns = fromJS(this.state.columns).toJS()
@@ -526,7 +475,32 @@
      }
    }

    const columns = this.handlecolumns(this.state.columns, fields, config)
    const columns = this.state.columns.map((col, index) => {
      return {
        title: col.label,
        dataIndex: col.uuid,
        align: col.Align,
        sorter: col.IsSort === 'true',
        onCell: () => ({
          column: col,
          width: col.Width,
          config: config,
          upComponent: this.updateCol
        }),
        onHeaderCell: () => ({
          index,
          column: col,
          fields: fields,
          align: col.Align,
          moveCol: this.moveCol,
          updateCol: this.updateCol,
          addElement: this.addElement,
          editColumn: this.editColumn,
          changeStyle: this.changeStyle,
          deleteCol: this.deleteCol,
        }),
      }
    })

    let style = {}
    if (config.wrap.color) {
@@ -537,7 +511,7 @@
    }

    return (
      <div className={`normal-table-columns ${config.setting.laypage} ${config.wrap.tableType} ${config.wrap.mode || ''}`} id={tableId}>
      <div className={`edit-table-columns ${config.setting.laypage} ${config.wrap.mode || ''}`} id={tableId}>
        <div className="col-control">
          <Icon title="复制显示列" type="copy" onClick={this.copycolumn} />
          <MarkColumn columns={fields} type="line" marks={lineMarks} onSubmit={this.updateLineMarks} />
@@ -553,7 +527,6 @@
            bordered={config.wrap.bordered !== 'false'}
            components={components}
            dataSource={this.state.data}
            rowSelection={config.wrap.tableType ? { type: 'radio' } : null}
            columns={columns}
            pagination={{
              current: 1,
@@ -565,7 +538,7 @@
            }}
          />
        </DndProvider>
        <EditColumn column={card} dict={dict} fields={fields} submitCol={this.submitCol} cancelCol={this.cancelCol}/>
        <EditColumn column={card} dict={dict} columns={this.state.columns} fields={fields} submitCol={this.submitCol} cancelCol={this.cancelCol}/>
      </div>
    )
  }