| | |
| | | import { notification, Spin, Row, Col } from 'antd' |
| | | |
| | | import Api from '@/api' |
| | | import zhCN from '@/locales/zh-CN/main.js' |
| | | import enUS from '@/locales/en-US/main.js' |
| | | import Utils from '@/utils/utils.js' |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | import MKEmitter from '@/utils/events.js' |
| | |
| | | const AntvTabs = asyncComponent(() => import('@/tabviews/custom/components/tabs/antv-tabs')) |
| | | const MkBaseTable = asyncComponent(() => import('@/tabviews/custom/components/table/base-table')) |
| | | const SettingComponent = asyncComponent(() => import('@/tabviews/zshare/settingcomponent')) |
| | | const PagemsgComponent = asyncComponent(() => import('@/tabviews/zshare/pageMessage')) |
| | | const TableNodes = asyncComponent(() => import('@/tabviews/zshare/tablenodes')) |
| | | const AutoMatic = asyncComponent(() => import('@/tabviews/zshare/automatic')) |
| | | const DebugTable = asyncComponent(() => import('@/tabviews/debugtable')) |
| | | |
| | | class BasePage extends Component { |
| | |
| | | param: PropTypes.any, // 其他页面传递的参数 |
| | | Tab: PropTypes.string, // 弹窗标签 |
| | | MenuID: PropTypes.string, // 菜单Id |
| | | MenuNo: PropTypes.string, // 菜单参数 |
| | | MenuName: PropTypes.string // 菜单名称 |
| | | MenuName: PropTypes.string, // 菜单名称 |
| | | changeTemp: PropTypes.func |
| | | } |
| | | |
| | | state = { |
| | | dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, |
| | | ContainerId: Utils.getuuid(), // 菜单外层html Id |
| | | BID: '', // 页面跳转时携带ID |
| | | loadingview: true, // 页面加载中 |
| | | viewlost: false, // 页面丢失:1、未获取到配置-页面丢失;2、页面未启用 |
| | | lostmsg: '', // 页面丢失时的提示信息 |
| | | config: null, // 页面配置信息,包括组件等 |
| | | mainSearch: null, // 主搜索 |
| | | userConfig: null, // 用户自定义设置 |
| | | data: null, // 列表数据集 |
| | | loading: false, // 列表数据加载中 |
| | | visible: false, // 标签页控制 |
| | | shortcuts: null // 快捷键 |
| | | shortcuts: null, // 快捷键 |
| | | autoMatic: null |
| | | } |
| | | |
| | | /** |
| | | * @description 获取页面配置信息 |
| | | */ |
| | | async loadconfig () { |
| | | const { MenuID } = this.props |
| | | const { MenuID, MenuName } = this.props |
| | | |
| | | let _param = { |
| | | func: 'sPC_Get_LongParam', |
| | | MenuID: MenuID |
| | | } |
| | | |
| | | let result = await Api.getCacheConfig(_param) |
| | | |
| | | if (result.status) { |
| | |
| | | |
| | | try { // 配置信息解析 |
| | | config = window.decodeURIComponent(window.atob(result.LongParam)) |
| | | config = config.replace(/@mywebsite@\//ig, window.GLOB.baseurl) |
| | | config = JSON.parse(config) |
| | | config.MenuID = MenuID |
| | | config.MenuName = MenuName || config.MenuName |
| | | } catch (e) { |
| | | console.warn('Parse Failure') |
| | | config = '' |
| | | } |
| | | |
| | | // 页面配置解析错误时提示 |
| | | if (!config) { |
| | | this.setState({ |
| | | viewlost: true, |
| | | loadingview: false |
| | | }) |
| | | return |
| | | } |
| | | |
| | | // 页面未启用时,显示未启用页面 |
| | | if (!config.enabled) { |
| | | this.setState({ |
| | | viewlost: true, |
| | | loadingview: false, |
| | | lostmsg: '抱歉,您访问的页面未启用,请联系管理员。' |
| | | }) |
| | | return |
| | | } |
| | | |
| | | // 模板错误 |
| | | if (config.Template !== 'BaseTable') { |
| | | if (config.Template === 'CustomPage' || config.Template === 'CommonTable') { |
| | | this.props.changeTemp(MenuID, config.Template) |
| | | } else { |
| | | this.setState({ |
| | | viewlost: true, |
| | | loadingview: false, |
| | | lostmsg: '菜单信息错误,可能原因:1、当前用户无权限;2、打开此菜单的按钮需要更新。' |
| | | }) |
| | | } |
| | | return |
| | | } |
| | | |
| | | // HS不使用自定义设置 |
| | |
| | | } |
| | | } |
| | | |
| | | // 页面配置解析错误时提示 |
| | | if (!config) { |
| | | this.setState({ |
| | | viewlost: true, |
| | | loadingview: false |
| | | }) |
| | | return |
| | | } |
| | | |
| | | // 页面未启用时,显示未启用页面 |
| | | if (!config.enabled) { |
| | | this.setState({ |
| | | viewlost: true, |
| | | loadingview: false, |
| | | lostmsg: this.state.dict['main.view.unenabled'] |
| | | }) |
| | | return |
| | | } |
| | | |
| | | // 权限过滤 |
| | | let roleId = sessionStorage.getItem('role_id') || '' // 角色ID |
| | | let skip = window.GLOB.mkHS |
| | |
| | | |
| | | let userName = sessionStorage.getItem('User_Name') || '' |
| | | let fullName = sessionStorage.getItem('Full_Name') || '' |
| | | |
| | | if (sessionStorage.getItem('isEditState') === 'true') { |
| | | userName = sessionStorage.getItem('CloudUserName') || '' |
| | | fullName = sessionStorage.getItem('CloudFullName') || '' |
| | | } |
| | | |
| | | let regs = [ |
| | | { reg: /@userName@/ig, value: `'${userName}'` }, |
| | |
| | | }) |
| | | } |
| | | |
| | | config.components = this.filterComponent(config.components, roleId, window.GLOB.mkActions, skip, param, MenuID) |
| | | config.components = this.filterComponent(config.components, roleId, window.GLOB.mkActions, skip, param, MenuID, config.MenuName) |
| | | |
| | | let autoMatic = null |
| | | if (config.autoMatic && config.autoMatic.enable === 'true') { |
| | | config.components[0].action.forEach(item => { |
| | | if (item.uuid === config.autoMatic.action) { |
| | | autoMatic = config.autoMatic |
| | | autoMatic.OpenType = item.execMode || item.OpenType |
| | | config.components[0].wrap.selected = 'false' |
| | | config.components[0].MenuID = config.components[0].uuid |
| | | config.components[0].autoMatic = true |
| | | item.autoMatic = true |
| | | } |
| | | }) |
| | | } |
| | | |
| | | // 获取主搜索条件 |
| | | let mainSearch = [] |
| | | config.components.forEach(component => { |
| | | if (component.type === 'tabs') return |
| | | |
| | | component.search = component.search.map(item => { |
| | | item.oriInitval = item.initval |
| | | if (['text', 'select', 'link'].includes(item.type) && param.$searchkey === item.field) { |
| | | item.initval = param.$searchval |
| | | if (param.$searchkey) { |
| | | component.search = component.search.map(item => { |
| | | if (['text', 'select', 'link'].includes(item.type) && param.$searchkey === item.field) { |
| | | item.initval = param.$searchval |
| | | } |
| | | |
| | | return item |
| | | }) |
| | | |
| | | component.$searches = Utils.initMainSearch(component.search) |
| | | } |
| | | |
| | | if (component.$searches.length) { |
| | | component.$main = true |
| | | |
| | | window.GLOB.SearchBox.set(MenuID, component.$searches) |
| | | |
| | | if (component.$s_req) { |
| | | window.GLOB.SearchBox.set(MenuID + 'required', true) |
| | | } |
| | | |
| | | return item |
| | | }) |
| | | |
| | | mainSearch = Utils.initMainSearch(component.search) |
| | | } |
| | | }) |
| | | |
| | | let BID = param.$BID || '' |
| | | |
| | | config.components = this.formatSetting(config.components, mainSearch, regs) |
| | | config.components = this.formatSetting(config.components, regs) |
| | | |
| | | this.setState({ |
| | | BID: BID, |
| | | shortcuts: shortcuts.length > 0 ? shortcuts : null, |
| | | config, |
| | | mainSearch |
| | | autoMatic |
| | | }, () => { |
| | | setTimeout(() => { // 延时加载状态 |
| | | this.setState({ |
| | |
| | | } |
| | | } |
| | | |
| | | filterComponent = (components, roleId, permAction, skip, urlparam, pageId) => { |
| | | filterComponent = (components, roleId, permAction, skip, urlparam, pageId, MenuName) => { |
| | | return components.filter(item => { |
| | | item.$pageId = pageId |
| | | item.$searchId = pageId |
| | | |
| | | item.$menuname = (this.props.MenuName || '') + '-' + (item.name || '主表') |
| | | item.$menuname = (MenuName || '') + '-' + (item.name || '主表') |
| | | |
| | | if (item.type === 'tabs') { |
| | | item.subtabs = item.subtabs.filter(tab => { |
| | | if ( |
| | | tab.blacklist && tab.blacklist.length > 0 && |
| | | tab.blacklist.filter(v => roleId.indexOf(v) > -1).length > 0 |
| | | ) { |
| | | if (!skip && !permAction[tab.components[0].uuid] && tab.permission === 'true') { |
| | | return false |
| | | } else if (tab.hide === 'true') { |
| | | return false |
| | |
| | | |
| | | item.subtabs = item.subtabs.map(tab => { |
| | | tab.components[0].name = tab.label |
| | | tab.components = this.filterComponent(tab.components, roleId, permAction, skip, urlparam, pageId) |
| | | if (tab.permission !== 'true') { // 权限未开启不做权限控制 |
| | | skip = true |
| | | } |
| | | tab.components = this.filterComponent(tab.components, roleId, permAction, skip, urlparam, pageId, MenuName) |
| | | return tab |
| | | }) |
| | | |
| | | return true |
| | | } else { |
| | | item.name = (MenuName || '') |
| | | } |
| | | |
| | | // 搜索条件初始化 |
| | | if (item.search && item.search.length > 0) { |
| | | item.search = Utils.initSearchVal(item.search) |
| | | } |
| | | Utils.initSearchVal(item) |
| | | |
| | | item.$searches = Utils.initMainSearch(item.search) |
| | | |
| | | if (item.setting.supModule) { |
| | | let pid = item.setting.supModule.pop() |
| | |
| | | return false |
| | | } else if (col.Hide === 'true') { |
| | | return false |
| | | } else if (col.type === 'action') { |
| | | col.type = 'custom' |
| | | } |
| | | |
| | | if (col.type === 'number') { |
| | |
| | | return false |
| | | } |
| | | } else if (col.type === 'custom') { |
| | | col.elements = col.elements.map(cell => { |
| | | if (['text', 'number', 'formula'].includes(cell.eleType)) { |
| | | col.elements = col.elements.filter(cell => { |
| | | if (cell.eleType === 'button') { |
| | | if (cell.hidden === 'true') return false |
| | | |
| | | cell.logLabel = item.$menuname + '-' + cell.label |
| | | cell.Ot = cell.Ot || 'requiredSgl' |
| | | cell.ContainerId = this.state.ContainerId |
| | | cell.syncComponentId = cell.syncComponent ? (cell.syncComponent.pop() || '') : '' |
| | | cell.$menuId = item.uuid |
| | | cell.$MenuID = this.props.MenuID |
| | | cell.$view = 'popview' |
| | | |
| | | if (cell.syncComponentId) { |
| | | if (cell.syncComponentId === item.setting.supModule) { |
| | | cell.syncComponentId = '' |
| | | if (cell.execSuccess === 'line' || cell.execSuccess === 'grid') { |
| | | cell.execSuccess = 'mainline' |
| | | } |
| | | } else if (cell.syncComponentId === 'multiComponent') { |
| | | let ids = cell.syncComponents.map(m => { |
| | | return m.syncComId.pop() || '' |
| | | }) |
| | | |
| | | if (item.setting.supModule && ids.includes(item.setting.supModule)) { |
| | | if (cell.execSuccess === 'line' || cell.execSuccess === 'grid') { |
| | | cell.execSuccess = 'mainline' |
| | | } |
| | | ids = ids.filter(id => id !== item.setting.supModule) |
| | | } |
| | | |
| | | if (ids.length === 0) { |
| | | cell.syncComponentId = '' |
| | | } else { |
| | | cell.syncComponentIds = ids |
| | | } |
| | | } |
| | | } |
| | | |
| | | if (cell.OpenType === 'funcbutton' && cell.funcType === 'print' && cell.verify) { // 打印机设置 |
| | | cell = this.getPrinter(cell, item.uuid) |
| | | } |
| | | |
| | | if (cell.controlField) { |
| | | if (/,/ig.test(cell.controlVal)) { |
| | | cell.controlVals = cell.controlVal.split(',') |
| | | } else { |
| | | cell.controlVals = [(cell.controlVal || '')] |
| | | } |
| | | } |
| | | |
| | | return skip || permAction[cell.uuid] |
| | | } else if (['text', 'number', 'formula'].includes(cell.eleType)) { |
| | | if (!cell.height) { |
| | | cell.innerHeight = 'auto' |
| | | } |
| | |
| | | } |
| | | } |
| | | } |
| | | return cell |
| | | return true |
| | | }) |
| | | |
| | | if (col.elements.length === 0) { |
| | | return false |
| | | } |
| | | } |
| | | |
| | | if (col.linkmenu && col.linkmenu.length > 0) { |
| | |
| | | item.statFields = Array.from(new Set(statFields)) |
| | | |
| | | // 权限过滤 |
| | | let tabId = this.props.Tab ? this.props.Tab.uuid : '' // 弹窗标签按钮Id |
| | | if (item.action && item.action.length > 0) { |
| | | item.action = item.action.filter(cell => { |
| | | if (item.hidden === 'true') return false |
| | | |
| | | cell.logLabel = item.$menuname + '-' + cell.label |
| | | cell.ContainerId = this.state.ContainerId |
| | | cell.syncComponentId = cell.syncComponent ? (cell.syncComponent.pop() || '') : '' |
| | | cell.$menuId = item.uuid |
| | | cell.$MenuID = this.props.MenuID |
| | | cell.$tabId = tabId |
| | | cell.$view = 'BasePage' |
| | | cell.$toolbtn = true |
| | | |
| | | if (cell.syncComponentId === item.setting.supModule) { |
| | | cell.syncComponentId = '' |
| | | } |
| | | |
| | | if (cell.OpenType === 'funcbutton' && cell.funcType === 'print' && cell.verify) { // 打印机设置 |
| | | cell = this.getPrinter(cell, item.uuid) |
| | | } |
| | | |
| | | return skip || permAction[cell.uuid] |
| | | }) |
| | | } |
| | | |
| | | item.cols = item.cols.filter(col => { |
| | | if (col.type !== 'action') return true |
| | | col.elements = col.elements.filter(cell => { |
| | | if (cell.hidden === 'true') return false |
| | | |
| | | |
| | | cell.logLabel = item.$menuname + '-' + cell.label |
| | | cell.Ot = cell.Ot || 'requiredSgl' |
| | | cell.ContainerId = this.state.ContainerId |
| | | cell.syncComponentId = cell.syncComponent ? (cell.syncComponent.pop() || '') : '' |
| | | cell.$menuId = item.uuid |
| | | cell.$MenuID = this.props.MenuID |
| | | cell.$tabId = tabId |
| | | cell.$view = 'BasePage' |
| | | cell.$view = 'popview' |
| | | cell.$toolbtn = true |
| | | |
| | | if (cell.syncComponentId === item.setting.supModule) { |
| | | cell.syncComponentId = '' |
| | | if (cell.syncComponentId) { |
| | | if (cell.syncComponentId === item.setting.supModule) { |
| | | cell.syncComponentId = '' |
| | | if (cell.execSuccess === 'line' || cell.execSuccess === 'grid') { |
| | | cell.execSuccess = 'mainline' |
| | | } |
| | | } else if (cell.syncComponentId === 'multiComponent') { |
| | | let ids = cell.syncComponents.map(m => { |
| | | return m.syncComId.pop() || '' |
| | | }) |
| | | |
| | | if (item.setting.supModule && ids.includes(item.setting.supModule)) { |
| | | if (cell.execSuccess === 'line' || cell.execSuccess === 'grid') { |
| | | cell.execSuccess = 'mainline' |
| | | } |
| | | ids = ids.filter(id => id !== item.setting.supModule) |
| | | } |
| | | |
| | | if (ids.length === 0) { |
| | | cell.syncComponentId = '' |
| | | } else { |
| | | cell.syncComponentIds = ids |
| | | } |
| | | } |
| | | } |
| | | |
| | | if (cell.OpenType === 'funcbutton' && cell.funcType === 'print' && cell.verify) { // 打印机设置 |
| | | cell = this.getPrinter(cell, item.uuid) |
| | | } |
| | | |
| | | if (cell.controlField) { |
| | | if (/,/ig.test(cell.controlVal)) { |
| | | cell.controlVals = cell.controlVal.split(',') |
| | | } else { |
| | | cell.controlVals = [(cell.controlVal || '')] |
| | | } |
| | | } |
| | | |
| | | return skip || permAction[cell.uuid] |
| | | }) |
| | | return col.elements.length !== 0 |
| | | }) |
| | | } |
| | | |
| | | return true |
| | | }) |
| | |
| | | } |
| | | |
| | | component.setting.useMSearch = component.setting.useMSearch === 'true' |
| | | if (component.setting.useMSearch) { |
| | | if (!window.GLOB.SearchBox.has(component.$searchId)) { |
| | | component.setting.useMSearch = false |
| | | } else if (window.GLOB.SearchBox.has(component.$searchId + 'required')) { |
| | | component.$s_req = true |
| | | } |
| | | } |
| | | |
| | | if (component.setting.interType !== 'system') { // 不使用系统函数时 |
| | | component.setting.sync = 'false' |
| | |
| | | } |
| | | |
| | | if (sessionStorage.getItem('dataM') === 'true') { // 数据权限 |
| | | component.setting.dataresource = component.setting.dataresource.replace(/\$@/ig, '/*').replace(/@datam@/ig, '\'Y\'') |
| | | component.setting.dataresource = component.setting.dataresource.replace(/@\$/ig, '*/') |
| | | _customScript = _customScript.replace(/\$@/ig, '/*').replace(/@datam@/ig, '\'Y\'') |
| | | _customScript = _customScript.replace(/@\$/ig, '*/') |
| | | component.setting.dataresource = component.setting.dataresource.replace(/\$@/ig, '/*').replace(/@\$/ig, '*/').replace(/@datam@/ig, '\'Y\'') |
| | | _customScript = _customScript.replace(/\$@/ig, '/*').replace(/@\$/ig, '*/').replace(/@datam@/ig, '\'Y\'') |
| | | } else { |
| | | component.setting.dataresource = component.setting.dataresource.replace(/@\$|\$@/ig, '').replace(/@datam@/ig, '\'\'') |
| | | _customScript = _customScript.replace(/@\$|\$@/ig, '').replace(/@datam@/ig, '\'\'') |
| | |
| | | }) |
| | | |
| | | component.setting.customScript = _customScript // 整理后自定义脚本 |
| | | |
| | | if (component.setting.laypage) { |
| | | component.setting.custompage = /@pageSize@/i.test(component.setting.dataresource + component.setting.customScript) |
| | | } |
| | | |
| | | component.setting.delay = delay |
| | | delay += 20 |
| | |
| | | } else { |
| | | window.GLOB.CacheData.delete(item.uuid) |
| | | } |
| | | if (item.type !== 'tabs' && item.$main) { |
| | | window.GLOB.SearchBox.delete(item.$searchId) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | reloadview = () => { |
| | | window.GLOB.CacheData.delete(this.props.MenuID) |
| | | if (this.state.config) { |
| | | this.deleteCache(this.state.config.components) |
| | | } |
| | | |
| | | this.setState({ |
| | | BID: '', // 页面跳转时携带ID |
| | | loadingview: true, // 页面加载中 |
| | |
| | | config: null, // 页面配置信息,包括组件等 |
| | | loading: false, // 列表数据加载中 |
| | | shortcuts: null, |
| | | data: '' |
| | | }, () => { |
| | | this.loadconfig() |
| | | }) |
| | | } |
| | | |
| | | resetSearch = (search) => { |
| | | this.setState({mainSearch: null}, () => { |
| | | this.setState({mainSearch: search}) |
| | | }) |
| | | } |
| | | |
| | | getComponents = () => { |
| | | const { config, data, mainSearch } = this.state |
| | | const { config } = this.state |
| | | |
| | | if (!config || !config.components) return |
| | | |
| | |
| | | if (item.type === 'tabs') { |
| | | return ( |
| | | <Col span={item.width} key={item.uuid}> |
| | | <AntvTabs config={item} mainSearch={mainSearch} /> |
| | | <AntvTabs config={item}/> |
| | | </Col> |
| | | ) |
| | | } else { |
| | | return ( |
| | | <Col span={item.width} key={item.uuid}> |
| | | <MkBaseTable config={item} data={data}/> |
| | | <MkBaseTable config={item}/> |
| | | </Col> |
| | | ) |
| | | } |
| | |
| | | } |
| | | |
| | | render() { |
| | | const { loadingview, viewlost, config, loading, shortcuts } = this.state |
| | | const { loadingview, viewlost, config, loading, shortcuts, autoMatic } = this.state |
| | | |
| | | return ( |
| | | <div className={'custom-page-wrap ' + (loadingview || loading ? 'loading' : '')} id={this.state.ContainerId} style={config ? config.style : null}> |
| | | <div className={'custom-table-wrap ' + (loadingview || loading ? 'loading' : '')} id={this.state.ContainerId} style={config ? config.style : null}> |
| | | {(loadingview || loading) ? <Spin className="view-spin" size="large" /> : null} |
| | | <Row className="component-wrap">{this.getComponents()}</Row> |
| | | {config && window.GLOB.breakpoint ? <DebugTable /> : null} |
| | | {!window.GLOB.mkHS && window.GLOB.systemType !== 'production' ? <PagemsgComponent menu={{MenuName: this.props.MenuName, MenuNo: this.props.MenuNo}} config={config} dict={this.state.dict} /> : null} |
| | | {!window.GLOB.mkHS && config ? <SettingComponent config={config} dict={this.state.dict} shortcuts={shortcuts || []}/> : null} |
| | | {!window.GLOB.mkHS && config && autoMatic ? <AutoMatic autoMatic={autoMatic} tabId={config.MenuID} config={config.components[0]} /> : null} |
| | | {!window.GLOB.mkHS && window.GLOB.systemType !== 'production' ? <TableNodes config={config} /> : null} |
| | | {!window.GLOB.mkHS && config ? <SettingComponent config={config} shortcuts={shortcuts || []}/> : null} |
| | | {viewlost ? <NotFount msg={this.state.lostmsg} /> : null} |
| | | </div> |
| | | ) |