2020-11-06

king

2020-11-06 0bff15b120b3e3ff1f1c3d2ce4d9aa8d3ad3917e

 src/menu/components/card/table-card/index.jsx

@@ -14,7 +14,7 @@
import './index.scss'

const SettingComponent = asyncIconComponent(() => import('@/menu/datasource'))
const WrapComponent = asyncIconComponent(() => import('./wrapsetting'))
const WrapComponent = asyncIconComponent(() => import('../data-card/wrapsetting'))
const CardComponent = asyncComponent(() => import('../cardcomponent'))

const { confirm } = Modal
@@ -46,24 +46,18 @@
            elem.uuid = Utils.getuuid()
            return elem
          })
          scard.backElements = scard.backElements.map(elem => {
            elem.uuid = Utils.getuuid()
            return elem
          })
          return scard
        })
      } else {
        subcards = [{
          uuid: Utils.getuuid(),
          setting: { width: 6, type: 'simple'},
          setting: { width: 24, type: 'simple'},
          style: {
            borderWidth: '1px', borderColor: '#e8e8e8',
            paddingTop: '15px', paddingBottom: '15px', paddingLeft: '15px', paddingRight: '15px',
            marginLeft: '8px', marginRight: '8px', marginTop: '8px', marginBottom: '8px'
          },
          backStyle: {},
          elements: [],
          backElements: []
          elements: []
        }]
      }

@@ -73,15 +67,15 @@
        floor: card.floor,
        tabId: card.tabId || '',
        parentId: card.parentId || '',
        format: 'array',   // 组件属性 - 数据格式
        pageable: true,    // 组件属性 - 是否可分页
        switchable: true,  // 组件属性 - 数据是否可切换
        format: 'array',    // 组件属性 - 数据格式
        pageable: true,     // 组件属性 - 是否可分页
        switchable: false,  // 组件属性 - 数据是否可切换
        dataName: card.dataName || '',
        width: 24,
        width: 12,
        name: card.name,
        subtype: card.subtype,
        setting: { interType: 'system' },
        wrap: { name: card.name, width: 24, addable: 'false', switch: 'false' },
        wrap: { name: card.name, width: 12, addable: 'false', switch: 'false', datatype: 'dynamic' },
        style: { marginLeft: '0px', marginRight: '0px', marginTop: '8px', marginBottom: '8px' },
        columns: [],
        scripts: [],
@@ -185,23 +179,52 @@
    this.props.updateConfig(_card)
  }

  addCard = () => {
    let card = fromJS(this.state.card).toJS()

    let newcard = {
      uuid: Utils.getuuid(),
      setting: { width: 6, type: 'simple'},
      style: {
        borderWidth: '1px', borderColor: '#e8e8e8',
        paddingTop: '15px', paddingBottom: '15px', paddingLeft: '15px', paddingRight: '15px',
        marginLeft: '8px', marginRight: '8px', marginTop: '8px', marginBottom: '8px'
      },
      elements: []
    }

    if (card.subcards.length > 0) {
      newcard = fromJS(card.subcards[card.subcards.length - 1]).toJS()
      newcard.uuid = Utils.getuuid()
      newcard.elements = newcard.elements.map(elem => {
        elem.uuid = Utils.getuuid()
        return elem
      })
    }

    card.subcards.push(newcard)
    
    this.setState({card})
    this.props.updateConfig(card)
  }

  render() {
    const { card } = this.state

    return (
      <div className="menu-data-card-edit-box" style={card.style}>
      <div className="menu-prop-card-edit-box" style={{...card.style, minHeight: card.wrap.minHeight}}>
        <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={
          <div className="mk-popover-control">
            <WrapComponent config={card} updateConfig={this.updateComponent} />
            <Icon className="plus" title="添加卡片" onClick={this.addCard} type="plus" />
            <WrapComponent config={card} sysRoles={this.props.menu.sysRoles} updateConfig={this.updateComponent} />
            <Icon className="style" title="调整样式" onClick={this.changeStyle} type="font-colors" />
            <Icon className="close" title="删除组件" type="delete" onClick={() => this.props.deletecomponent(card.uuid)} />
            <SettingComponent config={card} updateConfig={this.updateComponent} />
            {card.wrap.datatype !== 'static' ? <SettingComponent config={card} updateConfig={this.updateComponent} /> : null}
          </div>
        } trigger="hover">
          <Icon type="tool" />
        </Popover>
        {card.subcards.map(subcard => (<CardComponent key={subcard.uuid} cards={card} card={subcard} updateElement={this.updateCard} deleteElement={this.deleteCard}/>))}
        {card.wrap.addable === 'true' ? <div className="card-add-button"><Icon type="plus" /></div> : null}
      </div>
    )
  }