| | |
| | | * @description 单个卡片信息更新 |
| | | */ |
| | | deleteCard = (cell) => { |
| | | const { appType } = this.state |
| | | let card = fromJS(this.state.card).toJS() |
| | | let _this = this |
| | | |
| | |
| | | onOk() { |
| | | card.subcards = card.subcards.filter(item => item.uuid !== cell.uuid) |
| | | |
| | | let uuids = [] |
| | | cell.elements && cell.elements.forEach(c => { |
| | | if (c.eleType === 'button') { |
| | | uuids.push(c.uuid) |
| | | } |
| | | }) |
| | | cell.backElements && cell.backElements.forEach(c => { |
| | | if (c.eleType === 'button') { |
| | | uuids.push(c.uuid) |
| | | } |
| | | }) |
| | | MKEmitter.emit('delButtons', uuids) |
| | | |
| | | if (card.btnlog) { |
| | | card.btnlog = card.btnlog.filter(c => c.$parentId !== cell.uuid) |
| | | } |
| | | |
| | | _this.setState({card}) |
| | | _this.props.updateConfig(card) |
| | | |
| | | if (appType === 'mob') return |
| | | |
| | | let uuids = [] |
| | | |
| | | cell.elements && cell.elements.forEach(c => { |
| | | if (c.eleType !== 'button' || (appType === 'pc' && c.OpenType !== 'popview')) return |
| | | |
| | | uuids.push(c.uuid) |
| | | }) |
| | | cell.backElements && cell.backElements.forEach(c => { |
| | | if (c.eleType !== 'button' || (appType === 'pc' && c.OpenType !== 'popview')) return |
| | | |
| | | uuids.push(c.uuid) |
| | | }) |
| | | |
| | | if (uuids.length === 0) return |
| | | |
| | | MKEmitter.emit('delButtons', uuids) |
| | | }, |
| | | onCancel() {} |
| | | }) |
| | |
| | | changeStyle = () => { |
| | | const { card } = this.state |
| | | |
| | | MKEmitter.emit('changeStyle', [card.uuid], ['background', 'border', 'padding', 'margin'], card.style) |
| | | MKEmitter.emit('changeStyle', [card.uuid], ['background', 'border', 'padding', 'margin', 'shadow'], card.style) |
| | | } |
| | | |
| | | getStyle = (comIds, style) => { |
| | |
| | | } |
| | | |
| | | setSubConfig = (item) => { |
| | | const { card } = this.state |
| | | const { card, appType } = this.state |
| | | let btn = fromJS(item).toJS() |
| | | |
| | | if (btn.OpenType === 'pop' || btn.execMode === 'pop') { |
| | | if (!btn.modal) { |
| | | btn.modal = { |
| | | setting: { title: btn.label, width: 60, cols: '2', container: 'view', focus: '', finish: 'close', clickouter: 'unclose', display: 'modal' }, |
| | | setting: { title: btn.label, width: appType === 'mob' ? 100 : 60, cols: '2', container: 'view', focus: '', finish: 'close', clickouter: 'unclose', display: 'modal' }, |
| | | tables: [], |
| | | groups: [], |
| | | fields: [] |
| | | } |
| | | } |
| | | MKEmitter.emit('changeModal', card, btn) |
| | | } else if (btn.OpenType === 'popview') { |
| | | } else if (btn.OpenType === 'popview' && appType !== 'mob') { |
| | | MKEmitter.emit('changePopview', card, btn) |
| | | } |
| | | } |
| | |
| | | |
| | | addCard = () => { |
| | | let card = fromJS(this.state.card).toJS() |
| | | let height = card.subcards[0].style.height |
| | | if (height === 'auto') { |
| | | height = '100px' |
| | | } |
| | | |
| | | let newcard = { |
| | | uuid: Utils.getuuid(), |
| | | $cardType: 'extendCard', |
| | | setting: { width: 6, type: 'simple', click: 'button'}, |
| | | style: { |
| | | height, |
| | | borderWidth: '1px', borderColor: '#e8e8e8', |
| | | paddingTop: '15px', paddingBottom: '15px', paddingLeft: '15px', paddingRight: '15px', |
| | | marginLeft: '8px', marginRight: '8px', marginTop: '8px', marginBottom: '8px' |
| | |
| | | |
| | | card.subcards.push(newcard) |
| | | |
| | | this.setState({card}) |
| | | this.props.updateConfig(card) |
| | | } |
| | | |
| | | move = (item, direction) => { |
| | | let card = fromJS(this.state.card).toJS() |
| | | |
| | | let dragIndex = card.subcards.findIndex(c => c.uuid === item.uuid) |
| | | let hoverIndex = null |
| | | |
| | | if (direction === 'left') { |
| | | hoverIndex = dragIndex - 1 |
| | | } else { |
| | | hoverIndex = dragIndex + 1 |
| | | } |
| | | |
| | | if (hoverIndex === -1 || hoverIndex === card.subcards.length) return |
| | | |
| | | card.subcards.splice(hoverIndex, 0, ...card.subcards.splice(dragIndex, 1)) |
| | | |
| | | this.setState({card}) |
| | | this.props.updateConfig(card) |
| | | } |
| | |
| | | let _style = resetStyle(card.style) |
| | | |
| | | return ( |
| | | <div className="menu-data-card-edit-box" style={_style} onClick={this.clickComponent} id={card.uuid}> |
| | | <div className={'menu-data-card-edit-box ' + appType} style={_style} onClick={this.clickComponent} id={card.uuid}> |
| | | <NormalHeader defaultshow="hidden" config={card} updateComponent={this.updateComponent}/> |
| | | <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ |
| | | <div className="mk-popover-control"> |
| | | {appType !== 'mob' ? <Icon className="plus" title="添加卡片" onClick={this.addCard} type="plus" /> : null} |
| | | <Icon className="plus" title="添加卡片" onClick={this.addCard} type="plus" /> |
| | | {appType !== 'mob' ? <Icon className="plus" title="添加搜索" onClick={this.addSearch} type="plus-circle" /> : null} |
| | | <Icon className="plus" title="添加按钮" onClick={this.addButton} type="plus-square" /> |
| | | <WrapComponent config={card} updateConfig={this.updateComponent} /> |
| | |
| | | } trigger="hover"> |
| | | <Icon type="tool" /> |
| | | </Popover> |
| | | <ActionComponent config={card} setSubConfig={this.setSubConfig} updateaction={this.updateComponent}/> |
| | | {card.subcards.map((subcard, index) => (<CardComponent key={subcard.uuid} offset={!index ? offset : 0} cards={card} card={subcard} updateElement={this.updateCard} deleteElement={this.deleteCard}/>))} |
| | | <ActionComponent config={card} type="datacard" setSubConfig={this.setSubConfig} updateaction={this.updateComponent}/> |
| | | {card.subcards.map((subcard, index) => (<CardComponent key={subcard.uuid} offset={!index ? offset : 0} cards={card} card={subcard} move={this.move} updateElement={this.updateCard} deleteElement={this.deleteCard}/>))} |
| | | <div style={{clear: 'both'}}></div> |
| | | {card.wrap.pagestyle === 'page' && card.setting.laypage === 'true' && appType !== 'mob' ? <Pagination total={85} size="small" showTotal={total => `共 ${total} 条`} pageSize={20} defaultCurrent={1}/> : null} |
| | | {card.wrap.pagestyle === 'page' && card.setting.laypage === 'true' && appType === 'mob' ? <MobPagination /> : null} |