From f6a1ab6a58215cf7546976a86eb6face1a7be32f Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期五, 30 七月 2021 15:37:17 +0800 Subject: [PATCH] 2021-07-30 --- src/menu/components/card/data-card/index.jsx | 102 ++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 80 insertions(+), 22 deletions(-) diff --git a/src/menu/components/card/data-card/index.jsx b/src/menu/components/card/data-card/index.jsx index 2bd98ab..eab3104 100644 --- a/src/menu/components/card/data-card/index.jsx +++ b/src/menu/components/card/data-card/index.jsx @@ -15,6 +15,7 @@ const SettingComponent = asyncIconComponent(() => import('@/menu/datasource')) const WrapComponent = asyncIconComponent(() => import('./wrapsetting')) const CardComponent = asyncComponent(() => import('../cardcomponent')) +const MobPagination = asyncIconComponent(() => import('@/menu/components/share/mobPagination')) const LogComponent = asyncIconComponent(() => import('@/menu/components/share/logcomponent')) const CopyComponent = asyncIconComponent(() => import('@/menu/components/share/copycomponent')) const UserComponent = asyncIconComponent(() => import('@/menu/components/share/usercomponent')) @@ -193,6 +194,7 @@ * @description 鍗曚釜鍗$墖淇℃伅鏇存柊 */ deleteCard = (cell) => { + const { appType } = this.state let card = fromJS(this.state.card).toJS() let _this = this @@ -201,25 +203,31 @@ 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() {} }) @@ -228,7 +236,7 @@ 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) => { @@ -293,20 +301,20 @@ } 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) } } @@ -375,6 +383,54 @@ } } + 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' + }, + backStyle: {}, + elements: [], + backElements: [] + } + + 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) + } + clickComponent = (e) => { if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { e.stopPropagation() @@ -399,15 +455,16 @@ 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"> + <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} /> <CopyComponent type="datacard" card={card}/> - <PasteComponent config={card} options={['action', 'search', 'form']} updateConfig={this.updateComponent} /> + <PasteComponent config={card} options={['action', 'search', 'form', 'cardcell']} updateConfig={this.updateComponent} /> <Icon className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle} type="font-colors" /> <LogComponent btnlog={card.btnlog || []} handlelog={this.handleLog} /> <UserComponent config={card}/> @@ -417,10 +474,11 @@ } 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' ? <Pagination total={85} size="small" showTotal={total => `鍏� ${total} 鏉} pageSize={20} defaultCurrent={1}/> : null} + {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} </div> ) } -- Gitblit v1.8.0