| | |
| | | { |
| | | "appId": "202108312122504607B107A83F55B40C98CCF", |
| | | "appkey": "20210831212235413F287EC3BF489424496C8", |
| | | "appId": "201912040924165801464FF1788654BC5AC73", |
| | | "appkey": "20191106103859640976D6E924E464D029CF0", |
| | | "mainSystemApi": "http://sso.mk9h.cn/cloud/webapi/dostars", |
| | | "systemType": "", |
| | | "externalDatabase": "false", |
| | | "lineColor": "", |
| | | "filter": "false", |
| | | "defaultApp": "mkindustry", |
| | | "defaultApp": "mk", |
| | | "defaultLang": "zh-CN", |
| | | "WXAppID": "", |
| | | "WXminiAppID": "", |
| | |
| | | "transfer": "false", |
| | | "keepPassword": "true", |
| | | "platforms": ["H5", "wechat", "android", "ios", "wxMiniProgram"], |
| | | "host": "http://demo.mk9h.cn", |
| | | "service": "erp_new/" |
| | | "host": "http://qingqiumarket.cn", |
| | | "service": "MKWMS/" |
| | | } |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | const clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'cardcell') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', card, parent, 'cardcell') |
| | | MKEmitter.emit('clickComponent', card.uuid, parent.uuid) |
| | | } |
| | | } |
| | | |
| | |
| | | |
| | | if (cardCell.uuid !== parentId) return |
| | | |
| | | const { elements } = this.state |
| | | |
| | | let _elements = elements.map(item => { |
| | | let _elements = this.state.elements.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | return this.resetCardStyle(item, {...item.style, ...style}) |
| | | } |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | | pageable: true, // 组件属性 - 是否可分页 |
| | | switchable: true, // 组件属性 - 数据是否可切换 |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: true, // 组件属性 - 数据是否可切换 |
| | |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('mkUpdateInter', this.mkUpdateInter) |
| | | MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | |
| | | return |
| | | } |
| | | MKEmitter.removeListener('mkUpdateInter', this.mkUpdateInter) |
| | | MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | updateComponentStyle = (parentId, keys, style) => { |
| | | const { card } = this.state |
| | | |
| | | if (card.uuid !== parentId) return |
| | | |
| | | let subcards = card.subcards.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | item.style = {...item.style, ...style} |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | this.setState({card: {...card, subcards: []}}, () => { |
| | | this.updateComponent({...card, subcards: subcards}) |
| | | }) |
| | | } |
| | | |
| | | mkUpdateInter = (inter, split) => { |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | | pageable: true, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | } |
| | | } |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | | return !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | updateComponentStyle = (parentId, keys, style) => { |
| | | const { card } = this.state |
| | | |
| | | if (card.uuid !== parentId) return |
| | | |
| | | let subcards = card.subcards.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | item.style = {...item.style, ...style} |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | this.setState({card: {...card, subcards: []}}, () => { |
| | | this.updateComponent({...card, subcards: subcards}) |
| | | }) |
| | | } |
| | | |
| | | /** |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: card.type === 'bar' ? true : false, // 组件属性 - 数据是否可切换 |
| | |
| | | handleTabsChange = (parentId) => { |
| | | const { card } = this.state |
| | | |
| | | if (parentId === card.parentId || parentId === 'all') { |
| | | if (parentId.indexOf(card.uuid) > -1 || parentId === 'all') { |
| | | let _element = document.getElementById(card.uuid + 'canvas') |
| | | if (_element) { |
| | | _element.innerHTML = '' |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.updateComponent(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: card.subtype === 'ratioboard' ? 'array' : 'object', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | handleTabsChange = (parentId) => { |
| | | const { card } = this.state |
| | | |
| | | if (parentId === card.parentId || parentId === 'all') { |
| | | if (parentId.indexOf(card.uuid) > -1 || parentId === 'all') { |
| | | let _element = document.getElementById(card.uuid + 'dashboard') |
| | | if (_element) { |
| | | _element.innerHTML = '' |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.updateComponent(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | handleTabsChange = (parentId) => { |
| | | const { card } = this.state |
| | | |
| | | if (parentId === card.parentId || parentId === 'all') { |
| | | if (parentId.indexOf(card.uuid) > -1 || parentId === 'all') { |
| | | let _element = document.getElementById(card.uuid + 'canvas') |
| | | if (_element) { |
| | | _element.innerHTML = '' |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.updateComponent(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | handleTabsChange = (parentId) => { |
| | | const { card } = this.state |
| | | |
| | | if (parentId === card.parentId || parentId === 'all') { |
| | | if (parentId.indexOf(card.uuid) > -1 || parentId === 'all') { |
| | | let _element = document.getElementById(card.uuid + 'canvas') |
| | | if (_element) { |
| | | _element.innerHTML = '' |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.updateComponent(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | handleTabsChange = (parentId) => { |
| | | const { card } = this.state |
| | | |
| | | if (parentId === card.parentId || parentId === 'all') { |
| | | if (parentId.indexOf(card.uuid) > -1 || parentId === 'all') { |
| | | let _element = document.getElementById(card.uuid + 'canvas') |
| | | if (_element) { |
| | | _element.innerHTML = '' |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.updateComponent(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | } |
| | | } |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | | return !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | updateComponentStyle = (parentId, keys, style) => { |
| | | const { card } = this.state |
| | | |
| | | if (card.uuid !== parentId) return |
| | | |
| | | let subcards = card.subcards.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | item.style = {...item.style, ...style} |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | this.setState({card: {...card, subcards: []}}, () => { |
| | | this.updateComponent({...card, subcards: subcards}) |
| | | }) |
| | | } |
| | | |
| | | /** |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | } |
| | | } |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | | return !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | updateComponentStyle = (parentId, keys, style) => { |
| | | const { card } = this.state |
| | | |
| | | if (card.uuid !== parentId) return |
| | | |
| | | let subcards = card.subcards.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | item.style = {...item.style, ...style} |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | this.setState({card: {...card, subcards: []}}, () => { |
| | | this.updateComponent({...card, subcards: subcards}) |
| | | }) |
| | | } |
| | | |
| | | /** |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | } |
| | | } |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | | return !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | updateComponentStyle = (parentId, keys, style) => { |
| | | const { card } = this.state |
| | | |
| | | if (card.uuid !== parentId) return |
| | | |
| | | let subcards = card.subcards.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | item.style = {...item.style, ...style} |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | this.setState({card: {...card, subcards: []}}, () => { |
| | | this.updateComponent({...card, subcards: subcards}) |
| | | }) |
| | | } |
| | | |
| | | /** |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | |
| | | let newcard = { |
| | | uuid: Utils.getuuid(), |
| | | tabId: config.uuid, |
| | | parentId: config.parentId, |
| | | type: item.component, |
| | | subtype: item.subtype, |
| | | config: item.config, |
| | |
| | | let _group = { |
| | | uuid: group.uuid, |
| | | type: group.type, |
| | | tabId: group.tabId || '', |
| | | parentId: group.parentId || '', |
| | | subtype: group.subtype, |
| | | width: 24, |
| | | name: group.name, |
| | |
| | | return !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('tabsChange', this.handleTabsChange) |
| | | MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | /** |
| | | * @description 组件销毁,清除state更新,清除快捷键设置 |
| | | */ |
| | |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('tabsChange', this.handleTabsChange) |
| | | MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | updateComponentStyle = (parentId, keys, style) => { |
| | | const { group } = this.state |
| | | |
| | | if (group.uuid !== parentId) return |
| | | |
| | | let components = group.components.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | item.style = {...item.style, ...style} |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | this.setState({ |
| | | group: {...group, components: []} |
| | | }, () => { |
| | | this.updateComponent({...group, components: components}) |
| | | }) |
| | | } |
| | | |
| | | changeStyle = () => { |
| | |
| | | this.props.updateConfig(_card) |
| | | } |
| | | |
| | | handleTabsChange = (parentId) => { |
| | | const { group } = this.state |
| | | |
| | | if (parentId === group.parentId) { |
| | | MKEmitter.emit('tabsChange', group.uuid) |
| | | } |
| | | } |
| | | |
| | | updateComponent = (component) => { |
| | | const { group } = this.state |
| | | |
| | | if (!is(fromJS(group.setting), fromJS(component.setting)) || !is(fromJS(group.style), fromJS(component.style))) { |
| | | // 注册事件-标签变化,通知组内元素 |
| | | MKEmitter.emit('tabsChange', group.uuid) |
| | | let ids = [] |
| | | group.components.forEach(item => { |
| | | ids.push(item.uuid) |
| | | }) |
| | | MKEmitter.emit('tabsChange', ids.join(',')) |
| | | } |
| | | |
| | | component.width = component.setting.width |
| | |
| | | |
| | | insert = (item) => { |
| | | let group = fromJS(this.state.group).toJS() |
| | | |
| | | item.parentId = group.parentId |
| | | |
| | | group.components.push(item) |
| | | |
| | |
| | | this.updateComponent({...this.state.group, setting: res}) |
| | | } |
| | | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.group) |
| | | } |
| | | } |
| | | |
| | | render() { |
| | | const { group } = this.state |
| | | let _style = resetStyle(group.style) |
| | |
| | | } |
| | | |
| | | return ( |
| | | <div className={'menu-group-edit-box ' + (paddingTop ? 'padding ' : '') + (group.setting.layout || '')} style={_style} onClick={this.clickComponent} id={group.uuid}> |
| | | <div className={'menu-group-edit-box ' + (paddingTop ? 'padding ' : '') + (group.setting.layout || '')} style={_style} id={group.uuid}> |
| | | <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ |
| | | <div className="mk-popover-control"> |
| | | <NormalForm title="分组设置" width={700} update={this.updateWrap} getForms={this.getWrapForms}> |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | width: 24, |
| | | name: card.name, |
| | | subtype: card.subtype, |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | | pageable: true, // 组件属性 - 是否可分页 |
| | | switchable: true, // 组件属性 - 数据是否可切换 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | | pageable: true, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | | pageable: true, // 组件属性 - 是否可分页 |
| | | switchable: true, // 组件属性 - 数据是否可切换 |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _tabs = { |
| | | uuid: tabs.uuid, |
| | | type: tabs.type, |
| | | tabId: tabs.tabId || '', |
| | | parentId: tabs.parentId || '', |
| | | subtype: tabs.subtype, |
| | | width: 24, |
| | | name: tabs.name, |
| | | setting: {width: 24, position: 'top', tabStyle: 'line', name: tabs.name}, |
| | | style: { marginLeft: '8px', marginRight: '8px', marginTop: '8px', marginBottom: '8px' }, |
| | | subtabs: [ |
| | | { uuid: Utils.getuuid(), parentId: tabs.uuid, label: 'Tab 1', icon: '', components: [] }, |
| | | { uuid: Utils.getuuid(), parentId: tabs.uuid, label: 'Tab 2', icon: '', components: [] }, |
| | | { uuid: Utils.getuuid(), parentId: tabs.uuid, label: 'Tab 3', icon: '', components: [] } |
| | | { uuid: Utils.getuuid(), label: 'Tab 1', icon: '', components: [] }, |
| | | { uuid: Utils.getuuid(), label: 'Tab 2', icon: '', components: [] }, |
| | | { uuid: Utils.getuuid(), label: 'Tab 3', icon: '', components: [] } |
| | | ] |
| | | } |
| | | this.setState({ |
| | |
| | | return !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('submitSearch', this.getSearch) |
| | | MKEmitter.addListener('tabsChange', this.handleTabsChange) |
| | | MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | /** |
| | | * @description 组件销毁,清除state更新,清除快捷键设置 |
| | | */ |
| | |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('submitSearch', this.getSearch) |
| | | MKEmitter.removeListener('tabsChange', this.handleTabsChange) |
| | | MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | updateComponentStyle = (parentId, keys, style) => { |
| | | const { tabs } = this.state |
| | | |
| | | if (tabs.subtabs.findIndex(tab => tab.uuid === parentId) === -1) return |
| | | |
| | | let _tabs = fromJS(tabs).toJS() |
| | | let _tabs_ = fromJS(tabs).toJS() |
| | | |
| | | let components = [] |
| | | _tabs.subtabs.forEach(tab => { |
| | | if (tab.uuid === parentId) { |
| | | components = tab.components.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | item.style = {...item.style, ...style} |
| | | } |
| | | return item |
| | | }) |
| | | tab.components = [] |
| | | } |
| | | }) |
| | | |
| | | _tabs_.subtabs = _tabs_.subtabs.map(tab => { |
| | | if (tab.uuid === parentId) { |
| | | tab.components = components |
| | | } |
| | | return tab |
| | | }) |
| | | |
| | | this.setState({tabs: _tabs}, () => { |
| | | this.updateComponent(_tabs_) |
| | | }) |
| | | } |
| | | |
| | | changeStyle = () => { |
| | |
| | | this.props.updateConfig(_card) |
| | | } |
| | | |
| | | handleTabsChange = (parentId) => { |
| | | const { tabs } = this.state |
| | | |
| | | if (parentId === tabs.parentId) { |
| | | MKEmitter.emit('tabsChange', tabs.uuid) |
| | | } |
| | | getSubIds = (components, ids) => { |
| | | components.forEach(item => { |
| | | if (item.type === 'tabs') { |
| | | item.subtabs.forEach(tab => { |
| | | this.getSubIds(tab.components, ids) |
| | | }) |
| | | } else if (item.type === 'group') { |
| | | this.getSubIds(item.components, ids) |
| | | } else { |
| | | ids.push(item.uuid) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | updateComponent = (component) => { |
| | |
| | | |
| | | if (!is(fromJS(tabs.setting), fromJS(component.setting)) || !is(fromJS(tabs.style), fromJS(component.style))) { |
| | | // 注册事件-标签变化,通知标签内元素 |
| | | MKEmitter.emit('tabsChange', tabs.uuid) |
| | | let ids = [] |
| | | tabs.subtabs.forEach(tab => { |
| | | this.getSubIds(tab.components, ids) |
| | | }) |
| | | MKEmitter.emit('tabsChange', ids.join(',')) |
| | | } |
| | | |
| | | component.width = component.setting.width |
| | |
| | | this.props.updateConfig(tabs) |
| | | } |
| | | |
| | | getSearch = (config) => { |
| | | const { tabs } = this.state |
| | | |
| | | if (tabs.uuid !== config.uuid) return |
| | | |
| | | let _tabs = fromJS(tabs).toJS() |
| | | |
| | | _tabs.subtabs = _tabs.subtabs.map(t => { |
| | | if (t.uuid === config.tabId) { |
| | | t.search = config.search |
| | | } |
| | | return t |
| | | }) |
| | | |
| | | this.setState({ |
| | | tabs: _tabs |
| | | }) |
| | | this.props.updateConfig(_tabs) |
| | | } |
| | | |
| | | setSearch = (tab) => { |
| | | const { tabs } = this.state |
| | | let card = { |
| | | uuid: tabs.uuid, |
| | | tabId: tab.uuid, |
| | | search: tab.search |
| | | } |
| | | |
| | | if (!card.search) { |
| | | card.search = { |
| | | floor: 1, |
| | | setting: { type: 'title', field: '', title: '', focus: 'true', btn: 'hidden' }, |
| | | groups: [], |
| | | fields: [] |
| | | } |
| | | } |
| | | MKEmitter.emit('changeSearch', card) |
| | | } |
| | | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.tabs) |
| | | } |
| | | } |
| | | |
| | | getTabForms = (tab) => { |
| | | const { tabs } = this.state |
| | | |
| | | if (!tab) { |
| | | tab = { |
| | | uuid: '', |
| | | parentId: tabs.uuid, |
| | | label: '', |
| | | icon: '', |
| | | components: [] |
| | |
| | | let _style = resetStyle(tabs.style) |
| | | |
| | | return ( |
| | | <div className={'menu-tabs-edit-box ' + (tabs.setting.display || '')} style={_style} onClick={this.clickComponent} id={tabs.uuid}> |
| | | <div className={'menu-tabs-edit-box ' + (tabs.setting.display || '')} style={_style} id={tabs.uuid}> |
| | | <DraggableTabs defaultActiveKey={defaultActiveKey} tabBarStyle={{background: tabs.setting.backgroundColor || 'transparent'}} tabPosition={tabs.setting.position} type={tabs.setting.tabStyle} tabsMove={this.moveSwitch} onChange={this.onChange}> |
| | | {tabs.subtabs.map(tab => ( |
| | | <TabPane tab={ |
| | |
| | | <span style={{textDecoration: tab.hide === 'true' ? 'line-through' : 'none'}}>{tab.icon ? <MkIcon type={tab.icon} /> : null}{tab.label}</span> |
| | | </Popover> |
| | | } key={tab.uuid} style={{backgroundColor: tab.backgroundColor || 'transparent'}}> |
| | | {/* {appType === 'mob' && tabs.setting.position === 'top' && tabs.setting.display === 'inline-block' && tab.hasSearch === 'icon' ? |
| | | <SearchOutlined className="search-icon" onDoubleClick={() => this.setSearch(tab)}/> : null} */} |
| | | <TabComponents config={tab} handleList={this.updateTabComponent} deleteCard={this.deleteCard} /> |
| | | </TabPane> |
| | | ))} |
| | |
| | | this.setState({visible: true}) |
| | | } |
| | | |
| | | resetconfig = (item, Tab, copyBtns, uuids = {}, floor) => { |
| | | item.tabId = Tab.uuid |
| | | item.parentId = Tab.parentId |
| | | |
| | | resetconfig = (item, copyBtns, uuids = {}) => { |
| | | if (item.type === 'tabs') { |
| | | uuids[item.uuid] = MenuUtils.getuuid() |
| | | item.uuid = uuids[item.uuid] |
| | |
| | | item.subtabs.forEach(tab => { |
| | | uuids[tab.uuid] = MenuUtils.getuuid() |
| | | tab.uuid = uuids[tab.uuid] |
| | | tab.parentId = item.uuid |
| | | |
| | | if (floor >= 3) { |
| | | tab.components = tab.components.filter(cell => cell.type !== 'tabs') |
| | | } |
| | | |
| | | tab.components = tab.components.map(cell => { |
| | | cell = this.resetconfig(cell, tab, copyBtns, uuids, floor + 1) |
| | | cell = this.resetconfig(cell, copyBtns, uuids) |
| | | return cell |
| | | }) |
| | | }) |
| | |
| | | item.name = item.setting.name |
| | | |
| | | item.components = item.components.map(cell => { |
| | | cell.tabId = Tab.uuid |
| | | cell.parentId = Tab.parentId |
| | | |
| | | cell = MenuUtils.resetComponentConfig(cell, copyBtns, uuids) |
| | | |
| | | return cell |
| | |
| | | } |
| | | |
| | | let copyBtns = new Map() |
| | | let floor = MenuUtils.getFloor(Tab.parentId) |
| | | |
| | | res = this.resetconfig(res, Tab, copyBtns, {}, floor) |
| | | res = this.resetconfig(res, copyBtns, {}) |
| | | |
| | | delete res.copyType |
| | | |
| | |
| | | }) |
| | | return |
| | | } |
| | | } else if (item.component === 'tabs') { |
| | | let floor = MenuUtils.getFloor(config.parentId) |
| | | if (floor >= 3 ) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '标签页最多为三重结构!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | } |
| | | |
| | | let name = '' |
| | |
| | | |
| | | let newcard = { |
| | | uuid: Utils.getuuid(), |
| | | tabId: config.uuid, |
| | | parentId: config.parentId, |
| | | type: item.component, |
| | | subtype: item.subtype, |
| | | config: item.config, |
| | |
| | | } |
| | | |
| | | state = { |
| | | appType: sessionStorage.getItem('appType'), |
| | | tabs: null, |
| | | editab: null, |
| | | defaultActiveKey: '' |
| | |
| | | let _tabs = { |
| | | uuid: tabs.uuid, |
| | | type: tabs.type, |
| | | tabId: tabs.tabId || '', |
| | | parentId: tabs.parentId || '', |
| | | subtype: tabs.subtype, |
| | | width: 24, |
| | | name: tabs.name, |
| | | setting: {width: 24, position: 'top', tabStyle: 'line', name: tabs.name}, |
| | | style: { marginLeft: '8px', marginRight: '8px', marginTop: '8px', marginBottom: '8px' }, |
| | | subtabs: [ |
| | | { uuid: Utils.getuuid(), parentId: tabs.uuid, label: 'Tab 1', icon: '', components: [] }, |
| | | { uuid: Utils.getuuid(), parentId: tabs.uuid, label: 'Tab 2', icon: '', components: [] }, |
| | | { uuid: Utils.getuuid(), parentId: tabs.uuid, label: 'Tab 3', icon: '', components: [] } |
| | | { uuid: Utils.getuuid(), label: 'Tab 1', icon: '', components: [] }, |
| | | ] |
| | | } |
| | | this.setState({ |
| | |
| | | return !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('submitSearch', this.getSearch) |
| | | MKEmitter.addListener('tabsChange', this.handleTabsChange) |
| | | MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | componentDidMount () {} |
| | | |
| | | /** |
| | | * @description 组件销毁,清除state更新,清除快捷键设置 |
| | |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('submitSearch', this.getSearch) |
| | | MKEmitter.removeListener('tabsChange', this.handleTabsChange) |
| | | MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | updateComponentStyle = (parentId, keys, style) => { |
| | | const { tabs } = this.state |
| | | |
| | | if (tabs.subtabs.findIndex(tab => tab.uuid === parentId) === -1) return |
| | | |
| | | let _tabs = fromJS(tabs).toJS() |
| | | let _tabs_ = fromJS(tabs).toJS() |
| | | |
| | | let components = [] |
| | | _tabs.subtabs.forEach(tab => { |
| | | if (tab.uuid === parentId) { |
| | | components = tab.components.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | item.style = {...item.style, ...style} |
| | | } |
| | | return item |
| | | }) |
| | | tab.components = [] |
| | | } |
| | | }) |
| | | |
| | | _tabs_.subtabs = _tabs_.subtabs.map(tab => { |
| | | if (tab.uuid === parentId) { |
| | | tab.components = components |
| | | } |
| | | return tab |
| | | }) |
| | | |
| | | this.setState({tabs: _tabs}, () => { |
| | | this.updateComponent(_tabs_) |
| | | }) |
| | | } |
| | | |
| | | changeStyle = () => { |
| | |
| | | this.props.updateConfig(_card) |
| | | } |
| | | |
| | | handleTabsChange = (parentId) => { |
| | | const { tabs } = this.state |
| | | |
| | | if (parentId === tabs.parentId) { |
| | | MKEmitter.emit('tabsChange', tabs.uuid) |
| | | } |
| | | } |
| | | |
| | | updateComponent = (component) => { |
| | | const { tabs } = this.state |
| | | |
| | | if (!is(fromJS(tabs.setting), fromJS(component.setting)) || !is(fromJS(tabs.style), fromJS(component.style))) { |
| | | // 注册事件-标签变化,通知标签内元素 |
| | | MKEmitter.emit('tabsChange', tabs.uuid) |
| | | } |
| | | |
| | | component.width = component.setting.width |
| | | component.name = component.setting.name |
| | | |
| | |
| | | this.props.updateConfig(tabs) |
| | | } |
| | | |
| | | getSearch = (config) => { |
| | | const { tabs } = this.state |
| | | |
| | | if (tabs.uuid !== config.uuid) return |
| | | |
| | | let _tabs = fromJS(tabs).toJS() |
| | | |
| | | _tabs.subtabs = _tabs.subtabs.map(t => { |
| | | if (t.uuid === config.tabId) { |
| | | t.search = config.search |
| | | } |
| | | return t |
| | | }) |
| | | |
| | | this.setState({ |
| | | tabs: _tabs |
| | | }) |
| | | this.props.updateConfig(_tabs) |
| | | } |
| | | |
| | | setSearch = (tab) => { |
| | | const { tabs } = this.state |
| | | let card = { |
| | | uuid: tabs.uuid, |
| | | tabId: tab.uuid, |
| | | search: tab.search |
| | | } |
| | | |
| | | if (!card.search) { |
| | | card.search = { |
| | | floor: 1, |
| | | setting: { type: 'title', field: '', title: '', focus: 'true', btn: 'hidden' }, |
| | | groups: [], |
| | | fields: [] |
| | | } |
| | | } |
| | | MKEmitter.emit('changeSearch', card) |
| | | } |
| | | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.tabs) |
| | | } |
| | | } |
| | | |
| | | getTabForms = (tab) => { |
| | | const { tabs } = this.state |
| | | |
| | | if (!tab) { |
| | | tab = { |
| | | uuid: '', |
| | | parentId: tabs.uuid, |
| | | label: '', |
| | | icon: '', |
| | | components: [] |
| | |
| | | |
| | | editab.label = res.label |
| | | editab.icon = res.icon |
| | | // editab.hasSearch = res.hasSearch || '' |
| | | editab.hide = res.hide || 'false' |
| | | editab.backgroundColor = res.backgroundColor |
| | | editab.controlVal = res.controlVal || '' |
| | |
| | | let _style = resetStyle(tabs.style) |
| | | |
| | | return ( |
| | | <div className={'menu-tabs-edit-box ' + (tabs.setting.display || '')} style={_style} onClick={this.clickComponent} id={tabs.uuid}> |
| | | <div className={'menu-tabs-edit-box ' + (tabs.setting.display || '')} style={_style} id={tabs.uuid}> |
| | | <DraggableTabs defaultActiveKey={defaultActiveKey} tabBarStyle={{background: tabs.setting.backgroundColor || 'transparent'}} tabPosition={tabs.setting.position} type={tabs.setting.tabStyle} tabsMove={this.moveSwitch} onChange={this.onChange}> |
| | | {tabs.subtabs.map(tab => ( |
| | | <TabPane tab={ |
| | |
| | | <span style={{textDecoration: tab.hide === 'true' ? 'line-through' : 'none'}}>{tab.icon ? <MkIcon type={tab.icon} /> : null}{tab.label}</span> |
| | | </Popover> |
| | | } key={tab.uuid} style={{backgroundColor: tab.backgroundColor || 'transparent'}}> |
| | | {/* {appType === 'mob' && tabs.setting.position === 'top' && tabs.setting.display === 'inline-block' && tab.hasSearch === 'icon' ? |
| | | <SearchOutlined className="search-icon" onDoubleClick={() => this.setSearch(tab)}/> : null} */} |
| | | <TabComponents config={tab} handleList={this.updateTabComponent} deleteCard={this.deleteCard} /> |
| | | </TabPane> |
| | | ))} |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: true, // 组件属性 - 数据是否可切换 |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | item.subtabs.forEach(tab => { |
| | | uuids[tab.uuid] = MenuUtils.getuuid() |
| | | tab.uuid = uuids[tab.uuid] |
| | | tab.parentId = item.uuid |
| | | |
| | | if (appType !== 'mob') { |
| | | tab.components = tab.components.filter(cell => cell.type !== 'menubar') |
| | | } |
| | | |
| | | tab.components = tab.components.map(cell => { |
| | | cell.tabId = tab.uuid |
| | | cell.parentId = tab.parentId |
| | | |
| | | cell = this.resetconfig(cell, copyBtns, uuids) |
| | | return cell |
| | | }) |
| | |
| | | item.name = item.setting.name |
| | | |
| | | item.components = item.components.map(cell => { |
| | | cell.tabId = item.tabId || '' |
| | | cell.parentId = item.parentId || '' |
| | | |
| | | cell = MenuUtils.resetComponentConfig(cell, copyBtns, uuids) |
| | | return cell |
| | | }) |
| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { fromJS } from 'immutable' |
| | | import { Button } from 'antd' |
| | | import { FontColorsOutlined } from '@ant-design/icons' |
| | | |
| | |
| | | type: '', |
| | | components: [] |
| | | } |
| | | |
| | | type = null |
| | | |
| | | components = {} |
| | | |
| | | componentDidMount () { |
| | | sessionStorage.setItem('style-control', 'false') |
| | |
| | | } |
| | | |
| | | submitCombineStyle = (style) => { |
| | | const { components, parent } = this.state |
| | | |
| | | let keys = components.map(item => item.uuid) |
| | | |
| | | MKEmitter.emit('submitComponentStyle', parent.uuid, keys, style) |
| | | |
| | | setTimeout(() => { |
| | | keys.forEach(key => { |
| | | document.getElementById(key).classList.add('selected-control-element') |
| | | }) |
| | | }, 100) |
| | | } |
| | | |
| | | clickComponent = (card, _p, _type) => { |
| | | const { menu } = this.props |
| | | const { parent, type } = this.state |
| | | let components = fromJS(this.state.components).toJS() |
| | | |
| | | if (!parent) { |
| | | let _parent = null |
| | | |
| | | if (_type === 'cardcell') { |
| | | _parent = _p |
| | | MKEmitter.emit('switchMultiStyle', 'open') |
| | | } else { |
| | | let getParents = (box) => { |
| | | box.components.forEach(item => { |
| | | if (item.type === 'tabs') { |
| | | item.subtabs.forEach(tab => { |
| | | if (tab.components.findIndex(cell => cell.uuid === card.uuid) > -1) { |
| | | _parent = tab |
| | | } else { |
| | | getParents(tab) |
| | | } |
| | | }) |
| | | } else if (item.type === 'group') { |
| | | if (item.components.findIndex(cell => cell.uuid === card.uuid) > -1) { |
| | | _parent = item |
| | | } |
| | | } |
| | | }) |
| | | } |
| | | |
| | | if (menu.components.findIndex(cell => cell.uuid === card.uuid) > -1) { |
| | | _parent = menu |
| | | } else { |
| | | getParents(menu) |
| | | } |
| | | |
| | | MKEmitter.emit('switchMultiStyle', 'open') |
| | | } |
| | | |
| | | document.getElementById(card.uuid).classList.add('selected-control-element') |
| | | |
| | | sessionStorage.setItem('style-control', (_type ? _type : 'component')) |
| | | |
| | | this.setState({ |
| | | type: _type ? _type : 'component', |
| | | parent: _parent, |
| | | components: [card] |
| | | if (this.type === 'component') { |
| | | Object.keys(this.components).forEach((key, i) => { |
| | | setTimeout(() => { |
| | | this.components[key](style) |
| | | }, i * 10) |
| | | }) |
| | | } else { |
| | | if (components.findIndex(cell => cell.uuid === card.uuid) > -1) { |
| | | components = components.filter(cell => cell.uuid !== card.uuid) |
| | | document.getElementById(card.uuid).classList.remove('selected-control-element') |
| | | } else if (type === 'cardcell' && parent.elements.findIndex(cell => cell.uuid === card.uuid) > -1) { |
| | | components.push(card) |
| | | document.getElementById(card.uuid).classList.add('selected-control-element') |
| | | } |
| | | |
| | | if (components.length === 0) { |
| | | MKEmitter.emit('switchMultiStyle', 'close') |
| | | sessionStorage.setItem('style-control', 'true') |
| | | } |
| | | |
| | | this.setState({ |
| | | components: components, |
| | | parent: components.length ? parent : null |
| | | Object.keys(this.components).forEach((key, i) => { |
| | | setTimeout(() => { |
| | | MKEmitter.emit('submitComponentStyle', key, this.components[key], style) |
| | | }, i * 10) |
| | | }) |
| | | } |
| | | } |
| | | |
| | | clickComponent = (id, pid, callback) => { |
| | | if (!this.type) { |
| | | if (pid) { |
| | | this.type = 'cardcell' |
| | | } else { |
| | | this.type = 'component' |
| | | } |
| | | } else if ((this.type === 'cardcell' && !pid) || (this.type === 'component' && pid)) { |
| | | return |
| | | } |
| | | |
| | | let plus = true |
| | | if (this.type === 'cardcell') { |
| | | if (this.components[pid]) { |
| | | if (this.components[pid].includes(id)) { |
| | | this.components[pid] = this.components[pid].filter(item => item !== id) |
| | | if (this.components[pid].length === 0) { |
| | | delete this.components[pid] |
| | | } |
| | | plus = false |
| | | } else { |
| | | this.components[pid].push(id) |
| | | } |
| | | } else { |
| | | this.components[pid] = [id] |
| | | } |
| | | } else { |
| | | if (this.components[id]) { |
| | | delete this.components[id] |
| | | plus = false |
| | | } else { |
| | | this.components[id] = callback |
| | | } |
| | | } |
| | | |
| | | if (plus) { |
| | | document.getElementById(id).classList.add('selected-control-element') |
| | | MKEmitter.emit('switchMultiStyle', 'open', this.type) |
| | | } else { |
| | | document.getElementById(id).classList.remove('selected-control-element') |
| | | } |
| | | |
| | | let length = Object.keys(this.components).length |
| | | |
| | | if (length === 0) { |
| | | MKEmitter.emit('switchMultiStyle', 'close') |
| | | sessionStorage.setItem('style-control', 'true') |
| | | this.type = null |
| | | } else { |
| | | sessionStorage.setItem('style-control', this.type) |
| | | } |
| | | } |
| | | |
| | | triggerStyleChange = () => { |
| | | const { label, components } = this.state |
| | | const { label } = this.state |
| | | |
| | | if (label === '批量调整') { |
| | | document.body.className = 'style-control' |
| | |
| | | document.body.className = '' |
| | | sessionStorage.setItem('style-control', 'false') |
| | | |
| | | components.forEach(item => { |
| | | document.getElementById(item.uuid).classList.remove('selected-control-element') |
| | | }) |
| | | if (this.type === 'cardcell') { |
| | | Object.keys(this.components).forEach(key => { |
| | | this.components[key].forEach(id => { |
| | | document.getElementById(id).classList.remove('selected-control-element') |
| | | }) |
| | | }) |
| | | } else { |
| | | Object.keys(this.components).forEach(key => { |
| | | document.getElementById(key).classList.remove('selected-control-element') |
| | | }) |
| | | } |
| | | |
| | | MKEmitter.emit('switchMultiStyle', 'close') |
| | | this.components = {} |
| | | this.type = null |
| | | |
| | | this.setState({label: '批量调整', parent: null, components: []}) |
| | | this.setState({label: '批量调整'}) |
| | | } |
| | | } |
| | | |
| | |
| | | |
| | | state = { |
| | | style: {}, |
| | | type: '', |
| | | borposition: 'outer' |
| | | } |
| | | |
| | |
| | | MKEmitter.removeListener('switchMultiStyle', this.switchMultiStyle) |
| | | } |
| | | |
| | | switchMultiStyle = (type) => { |
| | | if (type === 'open') { |
| | | switchMultiStyle = (swit, type) => { |
| | | if (swit === 'open') { |
| | | this.setState({ |
| | | visible: true, |
| | | style: {}, |
| | | type: type, |
| | | borposition: 'outer' |
| | | }) |
| | | } else { |
| | |
| | | <div className="menu-combine-style-controller"> |
| | | <Form {...formItemLayout}> |
| | | <Collapse expandIconPosition="right" destroyInactivePanel={true} defaultActiveKey="margin"> |
| | | <Panel header="字体" key="font"> |
| | | {this.state.type === 'cardcell' ? <Panel header="字体" key="font"> |
| | | <Col span={12}> |
| | | <Form.Item colon={false} label={<FontSizeOutlined title="字体大小"/>}> |
| | | <InputNumber defaultValue={''} min={12} max={100} precision={0} onChange={this.changeFontSize} /> |
| | |
| | | </Radio.Group> |
| | | </Form.Item> |
| | | </Col> |
| | | </Panel> |
| | | </Panel> : null} |
| | | <Panel header="背景" key="background"> |
| | | <Col span={24}> |
| | | <Form.Item |
| | |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | import './index.scss' |
| | | |
| | | const AntvTabs = asyncComponent(() => import('@/menu/components/tabs/antv-tabs')) |
| | | const AntvTabs = asyncComponent(() => import('@/menu/components/tabs/table-tabs')) |
| | | const BaseTable = asyncComponent(() => import('@/menu/components/table/base-table')) |
| | | |
| | | const Card = ({ id, card, delCard, updateConfig }) => { |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: '', |
| | | parentId: '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: '', |
| | | parentId: '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | width: 24, |
| | | name: card.name, |
| | | subtype: card.subtype, |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | width: 24, |
| | | name: card.name, |
| | | subtype: card.subtype, |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | let _tabs = { |
| | | uuid: tabs.uuid, |
| | | type: tabs.type, |
| | | tabId: tabs.tabId || '', |
| | | parentId: tabs.parentId || '', |
| | | subtype: tabs.subtype, |
| | | width: 24, |
| | | name: tabs.name, |
| | | setting: {width: 24, position: 'top', tabStyle: 'line', name: tabs.name}, |
| | | style: { marginLeft: '8px', marginRight: '8px', marginTop: '8px', marginBottom: '8px' }, |
| | | subtabs: [ |
| | | { uuid: Utils.getuuid(), parentId: tabs.uuid, label: 'Tab 1', icon: '', components: [] }, |
| | | { uuid: Utils.getuuid(), parentId: tabs.uuid, label: 'Tab 2', icon: '', components: [] }, |
| | | { uuid: Utils.getuuid(), parentId: tabs.uuid, label: 'Tab 3', icon: '', components: [] } |
| | | { uuid: Utils.getuuid(), label: 'Tab 1', icon: '', components: [] }, |
| | | { uuid: Utils.getuuid(), label: 'Tab 2', icon: '', components: [] }, |
| | | { uuid: Utils.getuuid(), label: 'Tab 3', icon: '', components: [] } |
| | | ] |
| | | } |
| | | |
| | |
| | | return !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('submitSearch', this.getSearch) |
| | | MKEmitter.addListener('tabsChange', this.handleTabsChange) |
| | | MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | /** |
| | | * @description 组件销毁,清除state更新,清除快捷键设置 |
| | | */ |
| | |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('submitSearch', this.getSearch) |
| | | MKEmitter.removeListener('tabsChange', this.handleTabsChange) |
| | | MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle) |
| | | } |
| | | |
| | | updateComponentStyle = (parentId, keys, style) => { |
| | | const { tabs } = this.state |
| | | |
| | | if (tabs.subtabs.findIndex(tab => tab.uuid === parentId) === -1) return |
| | | |
| | | let _tabs = fromJS(tabs).toJS() |
| | | let _tabs_ = fromJS(tabs).toJS() |
| | | |
| | | let components = [] |
| | | _tabs.subtabs.forEach(tab => { |
| | | if (tab.uuid === parentId) { |
| | | components = tab.components.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | item.style = {...item.style, ...style} |
| | | } |
| | | return item |
| | | }) |
| | | tab.components = [] |
| | | } |
| | | }) |
| | | |
| | | _tabs_.subtabs = _tabs_.subtabs.map(tab => { |
| | | if (tab.uuid === parentId) { |
| | | tab.components = components |
| | | } |
| | | return tab |
| | | }) |
| | | |
| | | this.setState({tabs: _tabs}, () => { |
| | | this.updateComponent(_tabs_) |
| | | }) |
| | | } |
| | | |
| | | changeStyle = () => { |
| | |
| | | this.props.updateConfig(_card) |
| | | } |
| | | |
| | | handleTabsChange = (parentId) => { |
| | | const { tabs } = this.state |
| | | |
| | | if (parentId === tabs.parentId) { |
| | | MKEmitter.emit('tabsChange', tabs.uuid) |
| | | } |
| | | getSubIds = (components, ids) => { |
| | | components.forEach(item => { |
| | | if (item.type === 'tabs') { |
| | | item.subtabs.forEach(tab => { |
| | | this.getSubIds(tab.components, ids) |
| | | }) |
| | | } else if (item.type === 'group') { |
| | | this.getSubIds(item.components, ids) |
| | | } else { |
| | | ids.push(item.uuid) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | updateComponent = (component) => { |
| | |
| | | |
| | | if (!is(fromJS(tabs.setting), fromJS(component.setting)) || !is(fromJS(tabs.style), fromJS(component.style))) { |
| | | // 注册事件-标签变化,通知标签内元素 |
| | | MKEmitter.emit('tabsChange', tabs.uuid) |
| | | let ids = [] |
| | | tabs.subtabs.forEach(tab => { |
| | | this.getSubIds(tab.components, ids) |
| | | }) |
| | | MKEmitter.emit('tabsChange', ids.join(',')) |
| | | } |
| | | |
| | | component.width = component.setting.width |
| | |
| | | this.props.updateConfig(tabs) |
| | | } |
| | | |
| | | getSearch = (config) => { |
| | | const { tabs } = this.state |
| | | |
| | | if (tabs.uuid !== config.uuid) return |
| | | |
| | | let _tabs = fromJS(tabs).toJS() |
| | | |
| | | _tabs.subtabs = _tabs.subtabs.map(t => { |
| | | if (t.uuid === config.tabId) { |
| | | t.search = config.search |
| | | } |
| | | return t |
| | | }) |
| | | |
| | | this.setState({ |
| | | tabs: _tabs |
| | | }) |
| | | this.props.updateConfig(_tabs) |
| | | } |
| | | |
| | | setSearch = (tab) => { |
| | | const { tabs } = this.state |
| | | let card = { |
| | | uuid: tabs.uuid, |
| | | tabId: tab.uuid, |
| | | search: tab.search |
| | | } |
| | | |
| | | if (!card.search) { |
| | | card.search = { |
| | | floor: 1, |
| | | setting: { type: 'title', field: '', title: '', focus: 'true', btn: 'hidden' }, |
| | | groups: [], |
| | | fields: [] |
| | | } |
| | | } |
| | | MKEmitter.emit('changeSearch', card) |
| | | } |
| | | |
| | | getTabForms = (tab) => { |
| | | const { tabs } = this.state |
| | | |
| | | if (!tab) { |
| | | tab = { |
| | | uuid: '', |
| | | parentId: tabs.uuid, |
| | | label: '', |
| | | icon: '', |
| | | components: [] |
| | |
| | | window.GLOB.TabsMap.set(tabs.uuid, key) |
| | | } |
| | | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.tabs) |
| | | } |
| | | } |
| | | |
| | | render() { |
| | | const { tabs, defaultActiveKey } = this.state |
| | | let _style = resetStyle(tabs.style) |
| | | let _tabStyle = resetStyle(tabs.tabStyle) |
| | | |
| | | return ( |
| | | <div className={'mob-tabs-edit-box ' + tabs.setting.display} style={_style} onClick={this.clickComponent} id={tabs.uuid}> |
| | | <div className={'mob-tabs-edit-box ' + tabs.setting.display} style={_style} id={tabs.uuid}> |
| | | <DraggableTabs defaultActiveKey={defaultActiveKey} tabBarStyle={{background: tabs.setting.backgroundColor || 'transparent'}} tabPosition={'top'} type={tabs.setting.tabStyle} tabsMove={this.moveSwitch} onChange={this.onChange}> |
| | | {tabs.subtabs.map(tab => ( |
| | | <TabPane tab={ |
| | |
| | | <span style={{..._tabStyle, textDecoration: tab.hide === 'true' ? 'line-through' : 'none'}}>{tab.icon ? <MkIcon type={tab.icon} /> : null}{tab.label}</span> |
| | | </Popover> |
| | | } key={tab.uuid} style={{backgroundColor: tab.backgroundColor || 'transparent'}}> |
| | | {/* {appType === 'mob' && tabs.setting.display === 'inline-block' && tab.hasSearch === 'icon' ? |
| | | <SearchOutlined className="search-icon" onDoubleClick={() => this.setSearch(tab)}/> : null} */} |
| | | <TabComponents config={tab} handleList={this.updateTabComponent} deleteCard={this.deleteCard} /> |
| | | </TabPane> |
| | | ))} |
| | |
| | | import { useDrop } from 'react-dnd' |
| | | import { is, fromJS } from 'immutable' |
| | | import update from 'immutability-helper' |
| | | import { Empty, notification, Modal } from 'antd' |
| | | import { Empty, Modal } from 'antd' |
| | | |
| | | import Utils from '@/utils/utils.js' |
| | | import MKEmitter from '@/utils/events.js' |
| | |
| | | item.added = true |
| | | |
| | | if (item.component === 'search') { // 移动端标签页中不可添加搜索 |
| | | // if (cards.filter(card => card.type === 'search').length > 0) { |
| | | // notification.warning({ |
| | | // top: 92, |
| | | // message: '搜索条件不可重复添加!', |
| | | // duration: 5 |
| | | // }) |
| | | // return |
| | | // } |
| | | item.added = false |
| | | return |
| | | } else if (item.component === 'tabs') { |
| | | let floor = MenuUtils.getFloor(config.parentId) |
| | | if (floor >= 3 ) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '标签页最多为三重结构!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | } |
| | | |
| | | let name = '' |
| | |
| | | |
| | | let newcard = { |
| | | uuid: Utils.getuuid(), |
| | | tabId: config.uuid, |
| | | parentId: config.parentId, |
| | | type: item.component, |
| | | subtype: item.subtype, |
| | | config: item.config, |
| | |
| | | MKEmitter.emit('changeStyle', ['font', 'background', 'border'], card.searchStyle || {}, this.getSearchStyle) |
| | | } |
| | | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | } |
| | | } |
| | | |
| | | getSearch = (config) => { |
| | | const { card } = this.state |
| | | |
| | |
| | | } |
| | | |
| | | return ( |
| | | <div className="normal-topbar-edit-box" style={card.style} onClick={this.clickComponent} id={card.uuid}> |
| | | <div className="normal-topbar-edit-box" style={card.style} id={card.uuid}> |
| | | <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ |
| | | <div className="mk-popover-control"> |
| | | <NormalForm title="导航栏设置" width={900} update={this.updateWrap} getForms={this.getWrapForms}> |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | width: card.width || 24, |
| | | name: card.name, |
| | | subtype: card.subtype, |
| | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | MKEmitter.emit('clickComponent', this.state.card.uuid, null, (style) => { |
| | | let _card = {...this.state.card} |
| | | _card.style = {..._card.style, ...style} |
| | | |
| | | this.setState({ card: _card }) |
| | | this.props.updateConfig(_card) |
| | | }) |
| | | } |
| | | } |
| | | |
| | |
| | | MKEmitter.emit('changeStyle', ['width', 'margin'], card.logoStyle, this.getLogoStyle) |
| | | } |
| | | |
| | | clickComponent = (e) => { |
| | | if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') { |
| | | e.stopPropagation() |
| | | MKEmitter.emit('clickComponent', this.state.card) |
| | | } |
| | | } |
| | | |
| | | changeMenu = (menu) => { |
| | | if (menu.property === 'link') { |
| | | window.open(menu.link) |
| | |
| | | const { card } = this.state |
| | | |
| | | return ( |
| | | <div className="normal-navbar-edit-box" style={card.style} onClick={this.clickComponent} id={card.uuid}> |
| | | <div className="normal-navbar-edit-box" style={card.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} /> |
| | |
| | | btn={card} |
| | | BData={data.$$BData || ''} |
| | | disabled={_disabled} |
| | | setting={cards.setting} |
| | | selectedData={_data} |
| | | /> |
| | | </Col> |
| | |
| | | btn={card} |
| | | BData={data.$$BData || ''} |
| | | disabled={_disabled} |
| | | setting={cards.setting} |
| | | selectedData={_data} |
| | | /> |
| | | </Col> |
| | |
| | | btn={item} |
| | | BData={BData} |
| | | MenuID={MenuID} |
| | | setting={setting} |
| | | selectedData={selectedData} |
| | | /> |
| | | ) |
| | |
| | | disabled={lock || false} |
| | | btn={item} |
| | | BData={BData} |
| | | setting={setting} |
| | | selectedData={selectedData} |
| | | /> |
| | | ) |
| | |
| | | BData: PropTypes.any, // 主表数据 |
| | | btn: PropTypes.object, // 按钮 |
| | | selectedData: PropTypes.any, // 子表中选择数据 |
| | | setting: PropTypes.any, // 页面通用设置 |
| | | disabled: PropTypes.any, // 行按钮禁用 |
| | | } |
| | | |
| | |
| | | * @description 触发按钮操作 |
| | | */ |
| | | actionTrigger = (triggerId, record, type) => { |
| | | const { setting, btn, selectedData } = this.props |
| | | const { btn, selectedData } = this.props |
| | | const { disabled } = this.state |
| | | |
| | | if (disabled) return |
| | |
| | | let MenuNo = '' |
| | | let Remark = '' |
| | | if (btn.Ot === 'requiredSgl' && data[0]) { |
| | | Id = setting.primaryKey ? (data[0][setting.primaryKey] || '') : '' |
| | | Id = data[0].$$uuid || '' |
| | | name = data[0].PrintTempName || '' |
| | | MenuNo = data[0].PrintTempNO || '' |
| | | Remark = data[0].Remark || '' |
| | |
| | | _name = '单据打印' |
| | | if (btn.Ot === 'required' && data && data.length > 0) { |
| | | data.forEach((item, i) => { |
| | | let _id = setting.primaryKey ? (item[setting.primaryKey] || '') : '' |
| | | let _id = item.$$uuid || '' |
| | | let url = '#/billprint/' + window.btoa(window.encodeURIComponent(JSON.stringify({ id: _id, tempId: btn.printTemp, dataM: sessionStorage.getItem('dataM') }))) |
| | | window.open(url) |
| | | }) |
| | |
| | | MenuID: PropTypes.string, // 菜单ID |
| | | btn: PropTypes.object, // 按钮 |
| | | selectedData: PropTypes.any, // 子表中选择数据 |
| | | setting: PropTypes.any, // 页面通用设置 |
| | | disabled: PropTypes.any, // 行按钮禁用 |
| | | } |
| | | |
| | |
| | | * @description 触发按钮操作 |
| | | */ |
| | | actionTrigger = (triggerId, record, type) => { |
| | | const { setting, btn, selectedData } = this.props |
| | | const { btn, selectedData } = this.props |
| | | const { disabled } = this.state |
| | | |
| | | if (disabled) return |
| | |
| | | |
| | | let primaryId = '' |
| | | |
| | | if (btn.Ot === 'requiredSgl' && setting.primaryKey) { |
| | | primaryId = data[0][setting.primaryKey] || '' |
| | | if (btn.Ot === 'requiredSgl') { |
| | | primaryId = data[0].$$uuid || '' |
| | | } else if (btn.Ot === 'notRequired' && data[0]) { |
| | | primaryId = data[0].$$BID || '' |
| | | } |
| | | |
| | | let newtab = {} |
| | |
| | | key={item.uuid} |
| | | btn={item} |
| | | MenuID={MenuID} |
| | | setting={setting} |
| | | selectedData={[data]} |
| | | /> |
| | | ) |
| | |
| | | <NewPageButton |
| | | key={item.uuid} |
| | | btn={item} |
| | | setting={setting} |
| | | selectedData={[data]} |
| | | /> |
| | | ) |
| | |
| | | selectedData={[record]} |
| | | BData={this.props.BData} |
| | | MenuID={this.props.MenuID} |
| | | setting={this.props.setting} |
| | | /> |
| | | ) |
| | | } else if (btn.OpenType === 'innerpage' || btn.OpenType === 'outerpage') { |
| | |
| | | disabled={record.$disabled} |
| | | selectedData={[record]} |
| | | BData={this.props.BData} |
| | | setting={this.props.setting} |
| | | /> |
| | | ) |
| | | } |
| | |
| | | item.subtabs.forEach(tab => { |
| | | uuids[tab.uuid] = this.getuuid() |
| | | tab.uuid = uuids[tab.uuid] |
| | | tab.parentId = item.uuid |
| | | |
| | | tab.components = tab.components.map(cell => { |
| | | cell.tabId = tab.uuid |
| | | cell.parentId = item.uuid |
| | | return cell |
| | | }) |
| | | |
| | | tab.components = this.resetConfig(tab.components, uuids, clear) |
| | | }) |
| | | } else if (item.type === 'group') { |
| | | item.components = item.components.map(cell => { |
| | | cell.parentId = item.uuid |
| | | return cell |
| | | }) |
| | | item.components = this.resetConfig(item.components, uuids, clear) |
| | | } else if (item.type === 'menubar') { |
| | | item.subMenus = item.subMenus.map(cell => { |
| | |
| | | |
| | | return item |
| | | }) |
| | | } |
| | | |
| | | /** |
| | | * @description 重置菜单配置,页面整体复制 |
| | | * @return {String} components 配置信息 |
| | | */ |
| | | static getFloor = (id) => { |
| | | let floor = 1 |
| | | let finish = false |
| | | |
| | | let reCheck = (components, f) => { |
| | | components.forEach(item => { |
| | | if (finish) return |
| | | if (item.type === 'tabs') { |
| | | if (item.uuid === id) { |
| | | floor = f |
| | | finish = true |
| | | } else { |
| | | item.subtabs.forEach(tab => { |
| | | reCheck(tab.components, f + 1) |
| | | }) |
| | | } |
| | | } |
| | | }) |
| | | } |
| | | |
| | | reCheck(window.GLOB.customMenu.components, 1) |
| | | |
| | | return floor |
| | | } |
| | | |
| | | /** |
| | |
| | | createDate: '', |
| | | formData: [], |
| | | headers: [], |
| | | interface: window.GLOB.baseurl + 'webapi/logon', |
| | | interface: window.GLOB.baseurl + 'webapi/dologon', |
| | | method: 'POST', |
| | | params: [], |
| | | raw: "{\n \"UserName\":\"******\",\n \"Password\":\"******\",\n \"systemType\":\"local\",\n \"Type\":\"公钥\",\n \"privatekey\":\"私钥\",\n \"timestamp\":\"" + moment().format('YYYY-MM-DD HH:mm:ss') + "\",\n \"appkey\":\"" + window.GLOB.appkey + "\"\n}", |
| | | uuid: 'dologon' |
| | | } |
| | | |
| | | if (window.GLOB.mainSystemApi) { |
| | | m.raw = "{\n \"UserName\":\"******\",\n \"Password\":\"******\",\n \"systemType\":\"local\",\n \"Type\":\"公钥\",\n \"privatekey\":\"私钥\",\n \"timestamp\":\"" + moment().format('YYYY-MM-DD HH:mm:ss') + "\",\n \"appkey\":\"" + window.GLOB.appkey + "\",\n \"rduri\":\"" + window.GLOB.mainSystemApi.replace(/\/webapi(.*)/, '/webapi/dologon') + "\"\n}" |
| | | } |
| | | MKEmitter.emit('useInterface', m) |
| | | } |
| | |
| | | <div className="line-title">示例</div> |
| | | <div className="line-item" key="dologon"> |
| | | <div className="method">POST</div> |
| | | <div className="inter" style={{lineHeight: '40px'}}>logon</div> |
| | | <div className="inter" style={{lineHeight: '40px'}}>dologon</div> |
| | | <div className="action" style={{paddingLeft: '40px'}}> |
| | | <RightOutlined onClick={this.uselogon} /> |
| | | </div> |
| | |
| | | MKEmitter.addListener('copyButtons', this.copyButtons) |
| | | MKEmitter.addListener('changePopview', this.initPopview) |
| | | MKEmitter.addListener('triggerMenuSave', this.triggerMenuSave) |
| | | MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle) |
| | | MKEmitter.addListener('updateCustomComponent', this.updateCustomComponent) |
| | | setTimeout(() => { |
| | | if (sessionStorage.getItem('app_custom_components')) { |
| | |
| | | MKEmitter.removeListener('copyButtons', this.copyButtons) |
| | | MKEmitter.removeListener('changePopview', this.initPopview) |
| | | MKEmitter.removeListener('triggerMenuSave', this.triggerMenuSave) |
| | | MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle) |
| | | MKEmitter.removeListener('updateCustomComponent', this.updateCustomComponent) |
| | | } |
| | | |
| | |
| | | }) |
| | | }) |
| | | this.setState({customComponents: coms}) |
| | | } |
| | | |
| | | updateComponentStyle = (parentId, keys, style) => { |
| | | const { config } = this.state |
| | | |
| | | if (config.uuid !== parentId) return |
| | | |
| | | let components = config.components.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | item.style = {...item.style, ...style} |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | this.setState({ |
| | | config: {...config, components}, |
| | | comloading: true |
| | | }, () => { |
| | | this.setState({ |
| | | comloading: false |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | delButtons = (items) => { |
| | |
| | | MKEmitter.addListener('modalStatus', this.modalStatus) |
| | | MKEmitter.addListener('triggerMenuSave', this.submitConfig) |
| | | MKEmitter.addListener('changeEditMenu', this.changeEditMenu) |
| | | MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle) |
| | | MKEmitter.addListener('updateCustomComponent', this.updateCustomComponent) |
| | | setTimeout(() => { |
| | | if (sessionStorage.getItem('app_custom_components')) { |
| | |
| | | MKEmitter.removeListener('modalStatus', this.modalStatus) |
| | | MKEmitter.removeListener('triggerMenuSave', this.submitConfig) |
| | | MKEmitter.removeListener('changeEditMenu', this.changeEditMenu) |
| | | MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle) |
| | | MKEmitter.removeListener('updateCustomComponent', this.updateCustomComponent) |
| | | } |
| | | |
| | |
| | | this.setState({customComponents: coms}) |
| | | } |
| | | |
| | | updateComponentStyle = (parentId, keys, style) => { |
| | | const { config } = this.state |
| | | |
| | | if (config.uuid !== parentId) return |
| | | |
| | | let components = config.components.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | item.style = {...item.style, ...style} |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | this.setState({ |
| | | config: {...config, components}, |
| | | comloading: true |
| | | }, () => { |
| | | this.setState({ |
| | | comloading: false |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | closeView = () => { |
| | | const { oriConfig, config } = this.state |
| | | |
| | |
| | | backElements: [] |
| | | } |
| | | ], |
| | | headerStyle: {}, parentId: '', width: 24, scripts: [], pageable: false, |
| | | headerStyle: {}, width: 24, scripts: [], pageable: false, |
| | | wrap: {name: 'logo', width: 24, datatype: 'static', cardType: '', blacklist: []}, |
| | | name: 'logo', floor: 1, switchable: true, |
| | | setting:{interType: 'system'}, tabId: '', style:{paddingTop: '8vh', paddingBottom: '10vh'}, format: 'object', subtype: 'propcard', type: 'card', uuid: Utils.getuuid(), columns: [] |
| | | setting:{interType: 'system'}, style:{paddingTop: '8vh', paddingBottom: '10vh'}, format: 'object', subtype: 'propcard', type: 'card', uuid: Utils.getuuid(), columns: [] |
| | | }) |
| | | |
| | | config.components.push({ |
| | | uuid: Utils.getuuid(), |
| | | type: 'login', |
| | | floor: 1, |
| | | tabId: '', |
| | | parentId: '', |
| | | width: 24, |
| | | name: '用户绑定', |
| | | subtype: 'bindlogin', |
| | |
| | | backElements: [] |
| | | } |
| | | ], |
| | | headerStyle: {}, parentId: '', width: 24, scripts: [], pageable: false, |
| | | headerStyle: {}, width: 24, scripts: [], pageable: false, |
| | | wrap: {name: 'Power', width: 24, datatype: 'static', cardType: '', blacklist: []}, |
| | | name: 'Power', floor: 1, switchable: true, |
| | | setting:{interType: 'system'}, tabId: '', style:{}, format: 'object', subtype: 'propcard', type: 'card', uuid: Utils.getuuid(), columns: [] |
| | | setting:{interType: 'system'}, style:{}, format: 'object', subtype: 'propcard', type: 'card', uuid: Utils.getuuid(), columns: [] |
| | | }) |
| | | } |
| | | |
| | |
| | | MKEmitter.addListener('changePopview', this.initPopview) |
| | | MKEmitter.addListener('changeEditMenu', this.changeEditMenu) |
| | | MKEmitter.addListener('triggerMenuSave', this.triggerMenuSave) |
| | | MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle) |
| | | MKEmitter.addListener('updateCustomComponent', this.updateCustomComponent) |
| | | setTimeout(() => { |
| | | if (sessionStorage.getItem('app_custom_components')) { |
| | |
| | | MKEmitter.removeListener('changePopview', this.initPopview) |
| | | MKEmitter.removeListener('changeEditMenu', this.changeEditMenu) |
| | | MKEmitter.removeListener('triggerMenuSave', this.triggerMenuSave) |
| | | MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle) |
| | | MKEmitter.removeListener('updateCustomComponent', this.updateCustomComponent) |
| | | } |
| | | |
| | |
| | | }) |
| | | }) |
| | | this.setState({customComponents: coms}) |
| | | } |
| | | |
| | | updateComponentStyle = (parentId, keys, style) => { |
| | | const { config } = this.state |
| | | |
| | | if (config.uuid !== parentId) return |
| | | |
| | | let components = config.components.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | item.style = {...item.style, ...style} |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | this.setState({ |
| | | config: {...config, components}, |
| | | comloading: true |
| | | }, () => { |
| | | this.setState({ |
| | | comloading: false |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | delButtons = (items) => { |
| | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('delButtons', this.delButtons) |
| | | MKEmitter.addListener('triggerMenuSave', this.submitConfig) |
| | | MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle) |
| | | MKEmitter.addListener('updateCustomComponent', this.updateCustomComponent) |
| | | setTimeout(() => { |
| | | if (sessionStorage.getItem('app_custom_components')) { |
| | |
| | | } |
| | | MKEmitter.removeListener('delButtons', this.delButtons) |
| | | MKEmitter.removeListener('triggerMenuSave', this.submitConfig) |
| | | MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle) |
| | | MKEmitter.removeListener('updateCustomComponent', this.updateCustomComponent) |
| | | } |
| | | |
| | |
| | | }) |
| | | }) |
| | | this.setState({customComponents: coms}) |
| | | } |
| | | |
| | | updateComponentStyle = (parentId, keys, style) => { |
| | | const { config } = this.state |
| | | |
| | | if (config.uuid !== parentId) return |
| | | |
| | | let components = config.components.map(item => { |
| | | if (keys.includes(item.uuid)) { |
| | | item.style = {...item.style, ...style} |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | this.setState({ |
| | | config: {...config, components}, |
| | | comloading: true |
| | | }, () => { |
| | | this.setState({ |
| | | comloading: false |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | delButtons = (items) => { |
| | |
| | | |
| | | changeSetting = () => { |
| | | this.setState({settingshow: !this.state.settingshow}) |
| | | |
| | | setTimeout(() => { |
| | | MKEmitter.emit('tabsChange', 'all') |
| | | }, 400) |
| | | } |
| | | |
| | | render () { |