| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: card.subtype === 'ratioboard' ? 'array' : 'object', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | dataName: card.dataName || '', |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | dataName: card.dataName || '', |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | |
| | | const Card = ({ id, card, moveCard, findCard, delCard, updateConfig }) => { |
| | | const originalIndex = findCard(id).index |
| | | const [{ isDragging }, drag] = useDrag({ |
| | | item: { type: 'menu', id, originalIndex, floor: card.floor }, |
| | | item: { type: 'menu', id, originalIndex }, |
| | | collect: monitor => ({ |
| | | isDragging: monitor.isDragging(), |
| | | }), |
| | |
| | | accept: 'menu', |
| | | canDrop: () => true, |
| | | drop: (item) => { |
| | | const { id: draggedId, originalIndex, floor } = item |
| | | const { id: draggedId, originalIndex } = item |
| | | if (originalIndex === undefined) { |
| | | item.dropTargetId = id |
| | | } else if (draggedId && floor === card.floor) { |
| | | } else if (draggedId) { |
| | | if (draggedId === id) return |
| | | const { index: originIndex } = findCard(draggedId) |
| | | |
| | |
| | | width: item.width || 24, |
| | | dataName: Utils.getdataName(), |
| | | name: name, |
| | | floor: config.floor || 1, // 组件的层级 |
| | | isNew: true // 新添加标志,用于初始化 |
| | | } |
| | | |
| | |
| | | let _group = { |
| | | uuid: group.uuid, |
| | | type: group.type, |
| | | floor: group.floor, |
| | | tabId: group.tabId || '', |
| | | parentId: group.parentId || '', |
| | | subtype: group.subtype, |
| | |
| | | insert = (item) => { |
| | | let group = fromJS(this.state.group).toJS() |
| | | |
| | | item.floor = group.floor || 1 |
| | | item.parentId = group.parentId |
| | | |
| | | group.components.push(item) |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | width: 24, |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | |
| | | let _tabs = { |
| | | uuid: tabs.uuid, |
| | | type: tabs.type, |
| | | floor: tabs.floor, |
| | | tabId: tabs.tabId || '', |
| | | parentId: tabs.parentId || '', |
| | | subtype: tabs.subtype, |
| | |
| | | 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, floor: tabs.floor, label: 'Tab 1', icon: '', components: [] }, |
| | | { uuid: Utils.getuuid(), parentId: tabs.uuid, floor: tabs.floor, label: 'Tab 2', icon: '', components: [] }, |
| | | { uuid: Utils.getuuid(), parentId: tabs.uuid, floor: tabs.floor, label: 'Tab 3', icon: '', components: [] } |
| | | { 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: [] } |
| | | ] |
| | | } |
| | | this.setState({ |
| | |
| | | tab = { |
| | | uuid: '', |
| | | parentId: tabs.uuid, |
| | | floor: tabs.floor, |
| | | label: '', |
| | | icon: '', |
| | | components: [] |
| | |
| | | this.setState({visible: true}) |
| | | } |
| | | |
| | | resetconfig = (item, Tab, copyBtns, uuids = {}) => { |
| | | item.floor = Tab.floor + 1 |
| | | resetconfig = (item, Tab, copyBtns, uuids = {}, floor) => { |
| | | item.tabId = Tab.uuid |
| | | item.parentId = Tab.parentId |
| | | |
| | |
| | | tab.uuid = uuids[tab.uuid] |
| | | tab.parentId = item.uuid |
| | | |
| | | if (item.floor >= 3) { |
| | | 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) |
| | | cell = this.resetconfig(cell, tab, copyBtns, uuids, floor + 1) |
| | | return cell |
| | | }) |
| | | }) |
| | |
| | | item.name = item.setting.name |
| | | |
| | | item.components = item.components.map(cell => { |
| | | cell.floor = Tab.floor + 1 |
| | | cell.tabId = Tab.uuid |
| | | cell.parentId = Tab.parentId |
| | | |
| | |
| | | } |
| | | |
| | | let copyBtns = new Map() |
| | | let floor = MenuUtils.getFloor(Tab.parentId) |
| | | |
| | | res = this.resetconfig(res, Tab, copyBtns) |
| | | res = this.resetconfig(res, Tab, copyBtns, {}, floor) |
| | | |
| | | delete res.copyType |
| | | |
| | |
| | | const Card = ({ id, card, moveCard, findCard, delCard, updateConfig }) => { |
| | | const originalIndex = findCard(id).index |
| | | const [{ isDragging }, drag] = useDrag({ |
| | | item: { type: 'menu', id, originalIndex, floor: card.floor }, |
| | | item: { type: 'menu', id, originalIndex }, |
| | | collect: monitor => ({ |
| | | isDragging: monitor.isDragging(), |
| | | }), |
| | |
| | | accept: 'menu', |
| | | canDrop: () => true, |
| | | drop: (item) => { |
| | | const { id: draggedId, originalIndex, floor } = item |
| | | const { id: draggedId, originalIndex } = item |
| | | if (originalIndex === undefined) { |
| | | item.dropTargetId = id |
| | | } else if (draggedId && floor === card.floor) { |
| | | } else if (draggedId) { |
| | | if (draggedId === id) return |
| | | const { index: originIndex } = findCard(draggedId) |
| | | |
| | |
| | | }) |
| | | return |
| | | } |
| | | } else if (item.component === 'tabs' && config.floor === 3) { |
| | | } else if (item.component === 'tabs') { |
| | | let floor = MenuUtils.getFloor(config.parentId) |
| | | if (floor >= 3 ) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '标签页最多为三重结构!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | } |
| | | |
| | | let name = '' |
| | |
| | | width: item.width || 24, |
| | | dataName: Utils.getdataName(), |
| | | name: name, |
| | | floor: config.floor ? (config.floor + 1) : 2, // 组件的层级 |
| | | isNew: true // 新添加标志,用于初始化 |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | format: 'array', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | dataName: card.dataName || '', |
| | |
| | | if (appType === 'mob') { |
| | | let ms = null |
| | | menu.components.forEach(item => { |
| | | if (item.type === 'topbar' && (item.wrap.type === 'search' || (item.wrap.type === 'navbar' && item.wrap.search === 'true'))) { |
| | | if (item.type === 'topbar' && item.wrap.type !== 'navbar' && item.search) { |
| | | ms = item.search |
| | | } |
| | | }) |
| | | |
| | | if (config.floor > 1) { |
| | | let _search = null |
| | | let filterComponent = (box) => { |
| | | box.components.forEach(item => { |
| | | if (_search) return |
| | | |
| | | if (item.uuid === config.uuid) { |
| | | _search = box.slist.pop() |
| | | } else if (item.type === 'group') { |
| | | item.components.forEach(m => { |
| | | if (m.uuid !== config.uuid) return |
| | | _search = box.slist.pop() |
| | | }) |
| | | } else if (item.type === 'tabs') { |
| | | let able = item.setting.display === 'inline-block' && item.setting.position === 'top' |
| | | item.subtabs.forEach(tab => { |
| | | if (able && tab.hasSearch === 'icon' && tab.search) { |
| | | tab.slist = [...box.slist, tab.search] |
| | | } else { |
| | | tab.slist = [...box.slist] |
| | | } |
| | | |
| | | filterComponent(tab) |
| | | } else if (item.type === 'search' && item.wrap.field) { |
| | | search.push({ |
| | | type: 'text', |
| | | label: item.wrap.label, |
| | | field: item.wrap.field, |
| | | match: item.wrap.match, |
| | | required: item.wrap.required, |
| | | value: item.wrap.initval || '' |
| | | }) |
| | | } |
| | | }) |
| | | } |
| | | menu.slist = [] |
| | | filterComponent(menu) |
| | | |
| | | if (_search) { |
| | | ms = _search |
| | | } |
| | | } |
| | | |
| | | if (ms) { |
| | | if (ms.setting.type === 'search') { |
| | |
| | | }) |
| | | } |
| | | } else { |
| | | if (config.floor > 1) { |
| | | let _search = null |
| | | let filterComponent = (box) => { |
| | | box.components.forEach(item => { |
| | |
| | | |
| | | if (_search) { |
| | | search = _search |
| | | } |
| | | } else { |
| | | menu.components.forEach(item => { |
| | | if (item.type !== 'search') return |
| | |
| | | dataIndex: 'label', |
| | | inputType: 'input', |
| | | editable: true, |
| | | width: '28%' |
| | | width: '20%' |
| | | }, |
| | | { |
| | | title: '字段', |
| | |
| | | editable: true, |
| | | unique: true, |
| | | copy: true, |
| | | width: '28%' |
| | | width: '20%' |
| | | }, |
| | | { |
| | | title: '数据类型', |
| | |
| | | { value: 'datetime', text: 'datetime' }, |
| | | ], |
| | | editable: true, |
| | | width: '25%', |
| | | } |
| | | width: '20%', |
| | | }, |
| | | { |
| | | title: '备注', |
| | | dataIndex: 'remark', |
| | | inputType: 'textarea', |
| | | editable: true, |
| | | width: '20%' |
| | | }, |
| | | ], |
| | | scriptsColumns: [ |
| | | { |
| | |
| | | const Card = ({ id, card, moveCard, findCard, delCard, updateConfig }) => { |
| | | const originalIndex = findCard(id).index |
| | | const [{ isDragging }, drag] = useDrag({ |
| | | item: { type: 'menu', id, originalIndex, floor: card.floor }, |
| | | item: { type: 'menu', id, originalIndex }, |
| | | collect: monitor => ({ |
| | | isDragging: monitor.isDragging(), |
| | | }), |
| | |
| | | accept: 'menu', |
| | | canDrop: () => true, |
| | | drop: (item) => { |
| | | const { id: draggedId, originalIndex, floor } = item |
| | | const { id: draggedId, originalIndex } = item |
| | | if (originalIndex === undefined) { |
| | | item.dropTargetId = id |
| | | } else if (draggedId && floor === card.floor) { |
| | | } else if (draggedId) { |
| | | if (draggedId === id) return |
| | | const { index: originIndex } = findCard(draggedId) |
| | | |
| | |
| | | } |
| | | |
| | | tab.components = tab.components.map(cell => { |
| | | cell.floor = tab.floor + 1 |
| | | cell.tabId = tab.uuid |
| | | cell.parentId = tab.parentId |
| | | |
| | |
| | | item.name = item.setting.name |
| | | |
| | | item.components = item.components.map(cell => { |
| | | cell.floor = item.floor |
| | | cell.tabId = item.tabId || '' |
| | | cell.parentId = item.parentId || '' |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: '', |
| | | parentId: '', |
| | | format: 'object', // 组件属性 - 数据格式 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | format: 'object', // 组件属性 - 数据格式 |
| | | pageable: false, // 组件属性 - 是否可分页 |
| | | switchable: false, // 组件属性 - 数据是否可切换 |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | width: 24, |
| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Tabs, Popover, Modal } from 'antd' |
| | | import { Tabs, Popover, Modal, notification } from 'antd' |
| | | import { ToolOutlined, PlusOutlined, EditOutlined, FontColorsOutlined, DeleteOutlined, CloseOutlined } from '@ant-design/icons' |
| | | |
| | | import MKEmitter from '@/utils/events.js' |
| | |
| | | let _tabs = { |
| | | uuid: tabs.uuid, |
| | | type: tabs.type, |
| | | floor: tabs.floor, |
| | | tabId: tabs.tabId || '', |
| | | parentId: tabs.parentId || '', |
| | | subtype: tabs.subtype, |
| | |
| | | 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, floor: tabs.floor, label: 'Tab 1', icon: '', components: [] }, |
| | | { uuid: Utils.getuuid(), parentId: tabs.uuid, floor: tabs.floor, label: 'Tab 2', icon: '', components: [] }, |
| | | { uuid: Utils.getuuid(), parentId: tabs.uuid, floor: tabs.floor, label: 'Tab 3', icon: '', components: [] } |
| | | { 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: [] } |
| | | ] |
| | | } |
| | | |
| | |
| | | insert = (item, tab) => { |
| | | let tabs = fromJS(this.state.tabs).toJS() |
| | | |
| | | if (item.type === 'search') { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '移动端搜索组件不可粘贴!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | |
| | | tabs.subtabs.forEach(stab => { |
| | | if (stab.uuid === tab.uuid) { |
| | | stab.components.push(item) |
| | |
| | | tab = { |
| | | uuid: '', |
| | | parentId: tabs.uuid, |
| | | floor: tabs.floor, |
| | | label: '', |
| | | icon: '', |
| | | components: [] |
| | |
| | | const Card = ({ id, card, moveCard, findCard, delCard, updateConfig }) => { |
| | | const originalIndex = findCard(id).index |
| | | const [{ isDragging }, drag] = useDrag({ |
| | | item: { type: 'menu', id, originalIndex, floor: card.floor }, |
| | | item: { type: 'menu', id, originalIndex }, |
| | | collect: monitor => ({ |
| | | isDragging: monitor.isDragging(), |
| | | }), |
| | |
| | | accept: 'menu', |
| | | canDrop: () => true, |
| | | drop: (item) => { |
| | | const { id: draggedId, originalIndex, floor } = item |
| | | const { id: draggedId, originalIndex } = item |
| | | if (originalIndex === undefined) { |
| | | item.dropTargetId = id |
| | | } else if (draggedId && floor === card.floor) { |
| | | } else if (draggedId) { |
| | | if (draggedId === id) return |
| | | const { index: originIndex } = findCard(draggedId) |
| | | |
| | |
| | | |
| | | item.added = true |
| | | |
| | | if (item.component === 'search') { // 搜索组件不可重复添加 |
| | | if (cards.filter(card => card.type === 'search').length > 0) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '搜索条件不可重复添加!', |
| | | duration: 5 |
| | | }) |
| | | 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' && config.floor === 3) { |
| | | } else if (item.component === 'tabs') { |
| | | let floor = MenuUtils.getFloor(config.parentId) |
| | | if (floor >= 3 ) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '标签页最多为三重结构!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | } |
| | | |
| | | let name = '' |
| | |
| | | width: item.width || 24, |
| | | dataName: Utils.getdataName(), |
| | | name: name, |
| | | floor: config.floor ? (config.floor + 1) : 2, // 组件的层级 |
| | | isNew: true // 新添加标志,用于初始化 |
| | | } |
| | | |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | width: 24, |
| | | subtype: card.subtype, |
| | | wrap: { type: 'navbar', height: 50, title: 'NavBar', back: 'true', logout: 'false' }, |
| | |
| | | */ |
| | | export default function (wrap) { |
| | | let menulist = sessionStorage.getItem('appMenus') |
| | | let searchable = true |
| | | window.GLOB.customMenu.components.forEach(item => { |
| | | if (item.type === 'search') { |
| | | searchable = false |
| | | } |
| | | }) |
| | | |
| | | if (menulist) { |
| | | try { |
| | |
| | | required: false, |
| | | options: [ |
| | | {value: 'navbar', label: '导航栏'}, |
| | | {value: 'search', label: '搜索框'}, |
| | | {value: 'searchIcon', label: '搜索标'}, |
| | | {value: 'search', label: '搜索框', disabled: !searchable}, |
| | | {value: 'searchIcon', label: '搜索标', disabled: !searchable}, |
| | | ], |
| | | }, |
| | | { |
| | |
| | | const Card = ({ id, card, moveCard, findCard, delCard, updateConfig }) => { |
| | | const originalIndex = findCard(id).index |
| | | const [{ isDragging }, drag] = useDrag({ |
| | | item: { type: 'menu', id, originalIndex, floor: card.floor }, |
| | | item: { type: 'menu', id, originalIndex }, |
| | | collect: monitor => ({ |
| | | isDragging: monitor.isDragging(), |
| | | }), |
| | |
| | | accept: 'menu', |
| | | canDrop: () => true, |
| | | drop: (item) => { |
| | | const { id: draggedId, originalIndex, floor } = item |
| | | const { id: draggedId, originalIndex } = item |
| | | |
| | | if (originalIndex === undefined) { |
| | | item.dropTargetId = id |
| | | } else if (draggedId && floor === card.floor) { |
| | | } else if (draggedId) { |
| | | if (draggedId === id) return |
| | | const { index: originIndex } = findCard(draggedId) |
| | | |
| | |
| | | let style = null |
| | | |
| | | if (item.component === 'search') { // 搜索组件不可重复添加 |
| | | if (cards.filter(card => card.type === 'topbar' && card.wrap.type !== 'navbar').length > 0) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '导航栏使用了搜索,不可添加搜索组件!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | if (cards.filter(card => card.type === 'search').length > 0) { |
| | | notification.warning({ |
| | | top: 92, |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | tabId: card.tabId || '', |
| | | parentId: card.parentId || '', |
| | | dataName: card.dataName || '', |
| | |
| | | let _card = { |
| | | uuid: card.uuid, |
| | | type: card.type, |
| | | floor: card.floor, |
| | | dataName: card.dataName || '', |
| | | name: card.name, |
| | | subtype: card.subtype, |
| | |
| | | const Card = ({ id, card, moveCard, findCard, delCard, updateConfig }) => { |
| | | const originalIndex = findCard(id).index |
| | | const [{ isDragging }, drag] = useDrag({ |
| | | item: { type: 'menu', id, originalIndex, floor: card.floor }, |
| | | item: { type: 'menu', id, originalIndex }, |
| | | collect: monitor => ({ |
| | | isDragging: monitor.isDragging(), |
| | | }), |
| | |
| | | accept: 'menu', |
| | | canDrop: () => true, |
| | | drop: (item) => { |
| | | const { id: draggedId, originalIndex, floor } = item |
| | | const { id: draggedId, originalIndex } = item |
| | | |
| | | if (originalIndex === undefined) { |
| | | item.dropTargetId = id |
| | | } else if (draggedId && floor === card.floor) { |
| | | } else if (draggedId) { |
| | | if (draggedId === id) return |
| | | const { index: originIndex } = findCard(draggedId) |
| | | |
| | |
| | | } else { |
| | | params.push(getStructDefaultParam(component, searchlist, params.length === 0)) |
| | | } |
| | | } else if (component.floor === 1) { |
| | | } else if (params) { |
| | | // } else if (component.floor === 1) { |
| | | component.setting.sync = 'false' |
| | | } |
| | | |
| | |
| | | |
| | | if (['select', 'link', 'radio', 'checkbox', 'checkcard', 'multiselect'].includes(item.type)) { |
| | | item.options = item.options || [] |
| | | item.options = item.options.map(cell => { |
| | | // item.options = item.options.map(cell => { |
| | | // cell.value = cell.Value |
| | | // cell.label = cell.Text |
| | | |
| | | // return cell |
| | | // }) |
| | | item.options = item.options.filter(cell => { |
| | | cell.value = cell.Value |
| | | cell.label = cell.Text |
| | | return cell |
| | | |
| | | return !cell.Hide |
| | | }) |
| | | if (item.setAll === 'true' && ['select', 'link', 'radio'].includes(item.type)) { // 添加空值 |
| | | item.options.unshift({ |
| | |
| | | {options.map((item, i) => (<Radio key={i} value={item.field || item.value}> {item.label || item.text} </Radio>))} |
| | | </Radio.Group> |
| | | ) |
| | | } else if (inputType === 'textarea') { |
| | | return <Input.TextArea autoSize={true} placeholder=""/> |
| | | } else { |
| | | return <Input onPressEnter={() => this.getValue(form)}/> |
| | | } |
| | |
| | | > td:last-child { |
| | | padding: 0px; |
| | | } |
| | | textarea.ant-input { |
| | | vertical-align: middle; |
| | | } |
| | | } |
| | | .editable-row.active { |
| | | td { |
| | |
| | | import { is, fromJS } from 'immutable' |
| | | import { DndProvider, DragSource, DropTarget } from 'react-dnd' |
| | | import { Table, Input, Popconfirm, Form, notification } from 'antd' |
| | | import { PlusOutlined, EditOutlined, DeleteOutlined } from '@ant-design/icons' |
| | | import { PlusOutlined, EditOutlined, DeleteOutlined, SwapOutlined } from '@ant-design/icons' |
| | | |
| | | import Utils from '@/utils/utils.js' |
| | | import FileUpload from '@/tabviews/zshare/fileupload' |
| | |
| | | ) : ( |
| | | <div className={'operation-btn' + (editingKey !== '' ? ' disabled' : '')}> |
| | | <span className="primary" onClick={() => {editingKey === '' && this.edit(record.key)}}><EditOutlined /></span> |
| | | <span className="hide-control" title="显示/隐藏" onClick={() => {editingKey === '' && this.handleHide(record.key)}}><SwapOutlined /></span> |
| | | {editingKey === '' ? <Popconfirm |
| | | overlayClassName="popover-confirm" |
| | | title={this.props.dict['model.query.delete']} |
| | |
| | | this.setState({ editingKey: key }) |
| | | } |
| | | |
| | | handleHide = (key) => { |
| | | let _data = this.state.data.map(item => { |
| | | if (item.key === key) { |
| | | item.Hide = !item.Hide |
| | | } |
| | | return item |
| | | }) |
| | | this.setState({ |
| | | data: _data |
| | | }, () => { |
| | | this.props.onChange(_data) |
| | | }) |
| | | } |
| | | |
| | | moveRow = (dragIndex, hoverIndex) => { |
| | | const { editingKey } = this.state |
| | | let _data = fromJS(this.state.data).toJS() |
| | |
| | | rowKey="key" |
| | | dataSource={this.state.data} |
| | | columns={columns} |
| | | rowClassName="editable-row" |
| | | rowClassName={(record) => record.Hide ? 'editable-row hide' : 'editable-row'} |
| | | onRow={(record, index) => ({ |
| | | index, |
| | | moveAble: !this.state.editingKey, |
| | |
| | | } |
| | | } |
| | | } |
| | | .editable-row.hide { |
| | | td:not(:last-child) { |
| | | text-decoration: line-through; |
| | | } |
| | | } |
| | | .operation-btn { |
| | | font-size: 16px; |
| | | text-align: center; |
| | |
| | | .primary { |
| | | color: #1890ff; |
| | | } |
| | | .hide-control { |
| | | color: rgb(142, 68, 173); |
| | | } |
| | | .danger { |
| | | color: #ff4d4f; |
| | | } |
| | |
| | | .primary { |
| | | color: rgba(0, 0, 0, .25); |
| | | } |
| | | .hide-control { |
| | | color: rgba(0, 0, 0, .25); |
| | | } |
| | | .danger { |
| | | color: rgba(0, 0, 0, .25); |
| | | } |
| | |
| | | }) |
| | | } |
| | | |
| | | handleHide = (record) => { |
| | | let _data = this.state.dataSource.map(item => { |
| | | if (item.key === record.key) { |
| | | item.Hide = !item.Hide |
| | | } |
| | | return item |
| | | }) |
| | | this.setState({ |
| | | dataSource: _data |
| | | }, () => { |
| | | this.props.onChange(_data) |
| | | }) |
| | | } |
| | | |
| | | handleDelete = key => { |
| | | const { dataSource } = this.state |
| | | let _data = dataSource.filter(item => item.key !== key) |
| | |
| | | <div style={{fontSize: '15px'}}> |
| | | <span className="operation-btn" onClick={() => this.handleUpDown(record, 'up')} style={{color: '#1890ff'}}><ArrowUpOutlined /></span> |
| | | <span className="operation-btn" onClick={() => this.handleUpDown(record, 'down')} style={{color: '#ff4d4f'}}><ArrowDownOutlined /></span> |
| | | <span className="operation-btn" title="显示/隐藏" onClick={() => this.handleHide(record)} style={{color: 'rgb(142, 68, 173)'}}><SwapOutlined /></span> |
| | | <Popconfirm |
| | | title="确定删除吗?" |
| | | overlayClassName="popover-confirm" |
| | |
| | | <PlusOutlined className="add-row" onClick={this.handleAdd} /> |
| | | <Table |
| | | components={components} |
| | | rowClassName={() => 'editable-row'} |
| | | rowClassName={(record) => record.Hide ? 'editable-row hide' : 'editable-row'} |
| | | bordered |
| | | dataSource={dataSource} |
| | | columns={columns} |
| | |
| | | } |
| | | } |
| | | .operation-btn { |
| | | margin-right: 15px; |
| | | margin-right: 10px; |
| | | cursor: pointer; |
| | | } |
| | | .editable-row.hide { |
| | | text-decoration: line-through; |
| | | } |
| | | .ant-form-explain { |
| | | font-size: 12px; |
| | | } |
| | |
| | | } |
| | | |
| | | /** |
| | | * @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 |
| | | } |
| | | |
| | | /** |
| | | * @description 数据源名称,用于统一查询 |
| | | * @return {String} name |
| | | */ |
| | |
| | | insert = (item) => { |
| | | let config = fromJS(this.state.config).toJS() |
| | | |
| | | if (item.type === 'search') { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '移动端搜索组件不可粘贴!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | |
| | | if (item.type === 'topbar') { |
| | | if (config.components.findIndex(m => m.type === 'topbar') > -1) { |
| | | notification.warning({ |