| | |
| | | import './index.scss' |
| | | |
| | | const NormalForm = asyncIconComponent(() => import('@/components/normalform')) |
| | | const CopyComponent = asyncIconComponent(() => import('@/menu/components/share/copycomponent')) |
| | | |
| | | class NormalNavbar extends Component { |
| | | static propTpyes = { |
| | |
| | | subtype: card.subtype, |
| | | wrap: { type: 'navbar', height: 50, title: 'NavBar', back: 'true', search: 'false', logout: 'false' }, |
| | | style: {boxShadow: '0 0 3px #D9D9D9', shadowColor: '#D9D9D9', shadowBlur: '3px', paddingLeft: '10px', paddingRight: '10px', lineHeight: '2.8', fontSize: '18px' }, |
| | | searchStyle: {} |
| | | } |
| | | |
| | | if (card.config) { |
| | |
| | | |
| | | if (comIds[0] !== card.uuid) return |
| | | |
| | | let _card = {...card, style} |
| | | let _card = fromJS(card).toJS() |
| | | |
| | | if (comIds[1] === 'search') { |
| | | _card.searchStyle = style |
| | | } else { |
| | | _card.style = style |
| | | } |
| | | |
| | | this.setState({ |
| | | card: _card |
| | |
| | | const { card } = this.state |
| | | |
| | | MKEmitter.emit('changeStyle', [card.uuid], ['font', 'background', 'border', 'padding', 'shadow'], card.style) |
| | | } |
| | | |
| | | changeSearchStyle = () => { |
| | | const { card } = this.state |
| | | |
| | | MKEmitter.emit('changeStyle', [card.uuid, 'search'], ['font', 'background', 'border'], card.searchStyle || {}) |
| | | } |
| | | |
| | | clickComponent = (e) => { |
| | |
| | | this.updateComponent({...this.state.card, wrap: res}) |
| | | } |
| | | |
| | | skip = () => { |
| | | const { wrap } = this.state.card |
| | | |
| | | if (!wrap.linkmenu) return |
| | | |
| | | MKEmitter.emit('changeEditMenu', { |
| | | MenuID: wrap.linkmenu, |
| | | copyMenuId: '', |
| | | MenuNo: '', |
| | | MenuName: '', |
| | | }) |
| | | } |
| | | |
| | | render() { |
| | | const { card } = this.state |
| | | |
| | |
| | | right = <Icon type="logout" /> |
| | | } |
| | | if (card.wrap.scan === 'true') { |
| | | right = !right ? <ExpandOutlined /> : <Icon type="ellipsis" /> |
| | | right = !right ? <ExpandOutlined onDoubleClick={this.skip}/> : <Icon type="ellipsis" /> |
| | | } |
| | | if (card.wrap.refresh === 'true') { |
| | | right = !right ? <ReloadOutlined /> : <Icon type="ellipsis" /> |
| | | right = !right ? <ReloadOutlined /> : <Icon type="ellipsis" onDoubleClick={this.skip}/> |
| | | } |
| | | |
| | | return ( |
| | |
| | | <NormalForm title="导航栏设置" width={750} update={this.updateWrap} getForms={this.getWrapForms}> |
| | | <Icon type="edit" style={{color: '#1890ff'}} title="编辑"/> |
| | | </NormalForm> |
| | | <CopyComponent type="topbar" card={card}/> |
| | | <Icon className="style" title="调整样式" onClick={this.changeStyle} type="font-colors" /> |
| | | <Icon className="close" title="删除组件" type="delete" onClick={() => this.props.deletecomponent(card.uuid)} /> |
| | | </div> |
| | |
| | | </div> |
| | | {card.wrap.type !== 'search' ? |
| | | <div className="am-navbar-title">{card.wrap.title || ''}</div> : |
| | | <div className="am-navbar-search" onDoubleClick={this.setSearch}><div className="search-bar"><Icon type="search" /></div></div> |
| | | <div className="am-navbar-search" onDoubleClick={this.setSearch}> |
| | | <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ |
| | | <div className="mk-popover-control"> |
| | | <Icon className="style" title="调整样式" onClick={this.changeSearchStyle} type="font-colors" /> |
| | | </div> |
| | | } trigger="hover"> |
| | | <div style={card.searchStyle} className="search-bar"> |
| | | {card.search && card.search.setting.scan === 'true' ? <Icon type="scan" /> : <Icon type="search" />} |
| | | </div> |
| | | </Popover> |
| | | </div> |
| | | } |
| | | <div className="am-navbar-right"> |
| | | {card.wrap.search === 'true' ? <Icon type="search" onDoubleClick={this.setSearch}/> : null} |