From d59f518f466274b2caeb2e01c10c92deafe7c93b Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期三, 09 二月 2022 11:48:29 +0800 Subject: [PATCH] 2022-02-09 --- src/mob/components/navbar/normal-navbar/index.jsx | 94 +++++++++++++++++----------------------------- 1 files changed, 35 insertions(+), 59 deletions(-) diff --git a/src/mob/components/navbar/normal-navbar/index.jsx b/src/mob/components/navbar/normal-navbar/index.jsx index 7f03f32..8244a70 100644 --- a/src/mob/components/navbar/normal-navbar/index.jsx +++ b/src/mob/components/navbar/normal-navbar/index.jsx @@ -1,17 +1,17 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import { is, fromJS } from 'immutable' -import { Icon, Popover } from 'antd' +import { Popover } from 'antd' +import { SettingOutlined, EditOutlined, ToolOutlined, DeleteOutlined, FontColorsOutlined, PlusOutlined } from '@ant-design/icons' import asyncIconComponent from '@/utils/asyncIconComponent' - import MKEmitter from '@/utils/events.js' -import zhCN from '@/locales/zh-CN/model.js' -import enUS from '@/locales/en-US/model.js' +import getWrapForm from './options' import './index.scss' -const WrapComponent = asyncIconComponent(() => import('./wrapsetting')) -const MenuComponent = asyncIconComponent(() => import('./menusetting')) +const NormalForm = asyncIconComponent(() => import('@/components/normalform')) +const MenuComponent = asyncIconComponent(() => import('./menus')) +const SettingComponent = asyncIconComponent(() => import('@/menu/datasource')) class NormalNavbar extends Component { static propTpyes = { @@ -21,7 +21,6 @@ } state = { - dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, card: null, back: false } @@ -33,14 +32,18 @@ let _card = { uuid: card.uuid, type: card.type, - floor: card.floor, - dataName: '', - width: card.width || 24, + format: 'object', // 缁勪欢灞炴�� - 鏁版嵁鏍煎紡 + pageable: false, // 缁勪欢灞炴�� - 鏄惁鍙垎椤� + switchable: false, // 缁勪欢灞炴�� - 鏁版嵁鏄惁鍙垏鎹� + dataName: card.dataName || '', name: card.name, subtype: card.subtype, - wrap: { name: card.name, width: card.width || 1200 }, - style: { }, + setting: { interType: 'system' }, + wrap: { name: card.name, datatype: 'static', height: 50 }, + style: {boxShadow: '0 0 3px #D9D9D9', shadowColor: '#D9D9D9', shadowBlur: '3px', paddingTop: '5px', fontSize: '13px' }, menus: [], + columns: [], + scripts: [], } if (card.config) { @@ -88,7 +91,6 @@ card: component }) - component.width = component.wrap.width component.name = component.wrap.name this.props.updateConfig(component) @@ -99,10 +101,7 @@ if (comIds[0] !== card.uuid) return - let _card = {...card} - if (comIds.length === 1) { - _card = {...card, style} - } + let _card = {...card, style} this.setState({ card: _card @@ -114,65 +113,42 @@ changeStyle = () => { const { card } = this.state - MKEmitter.emit('changeStyle', [card.uuid], ['font', 'background', 'shadow'], card.style) + MKEmitter.emit('changeStyle', [card.uuid], ['font', 'background', 'border', 'padding', 'shadow'], card.style) } - clickComponent = (e) => { - if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { - e.stopPropagation() - MKEmitter.emit('clickComponent', this.state.card) - } + getWrapForms = () => { + const { wrap } = this.state.card + + return getWrapForm(wrap) } - changeMenu = (menu) => { - if (menu.property === 'link') { - window.open(menu.link) - return - } - MKEmitter.emit('changeEditMenu', { - fixed: menu.property === 'menu', - MenuID: menu.property === 'linkmenu' ? menu.linkMenuId : menu.MenuID, - copyMenuId: menu.property === 'menu' ? menu.copyMenuId : '', - MenuNo: menu.MenuNo, - MenuName: menu.name, - }) + updateWrap = (res) => { + this.updateComponent({...this.state.card, wrap: res}) } render() { const { card } = this.state let _style = {...card.style} - if (_style.shadow) { - _style.boxShadow = '0 0 4px ' + _style.shadow - } + _style.height = card.wrap.height return ( - <div className="normal-navbar-edit-box" style={_style} onClick={this.clickComponent} id={card.uuid}> + <div className="normal-navbar-edit-box" style={_style} id={card.uuid}> <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ <div className="mk-popover-control"> - <MenuComponent config={card} updateConfig={this.updateComponent} /> - <WrapComponent config={card} 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)} /> + <PlusOutlined className="plus" title="娣诲姞鑿滃崟" onClick={() => MKEmitter.emit('addmobmenu')}/> + <NormalForm title="鑿滃崟鏍忚缃�" width={800} update={this.updateWrap} getForms={this.getWrapForms}> + <EditOutlined style={{color: '#1890ff'}} title="缂栬緫"/> + </NormalForm> + <FontColorsOutlined className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle} /> + <DeleteOutlined className="close" title="鍒犻櫎缁勪欢" onClick={() => this.props.deletecomponent(card.uuid)} /> + {card.wrap.datatype !== 'static' ? <SettingComponent config={card} updateConfig={this.updateComponent} /> : null} + {card.wrap.datatype === 'static' ? <SettingOutlined style={{color: '#eeeeee', cursor: 'not-allowed'}}/> : null} </div> } trigger="hover"> - <Icon type="tool" /> + <ToolOutlined /> </Popover> - <div className="menu"> - {card.menus.map(menu => { - return ( - <div class="am-tab-bar-tab"> - <div class="am-tab-bar-tab-icon"> - <span class="am-badge am-tab-bar-tab-badge tab-badge"> - <Icon type="font-colors" /> - <sup class="am-badge-text">1</sup> - </span> - </div> - <p class="am-tab-bar-tab-title">{menu.name}</p> - </div> - ) - })} - </div> + <MenuComponent menus={card.menus} columns={card.columns} updateConfig={(menus) => this.updateComponent({...card, menus: menus})}/> </div> ) } -- Gitblit v1.8.0