From 8137ac074ce6370e4b46295e7acf9c7870ef82d2 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期五, 17 二月 2023 22:19:23 +0800 Subject: [PATCH] 2023-02-17 --- src/tabviews/custom/index.jsx | 354 ++++++++++++++++++++++++++++++++++++---------------------- 1 files changed, 218 insertions(+), 136 deletions(-) diff --git a/src/tabviews/custom/index.jsx b/src/tabviews/custom/index.jsx index 9b9aa3b..093e914 100644 --- a/src/tabviews/custom/index.jsx +++ b/src/tabviews/custom/index.jsx @@ -21,6 +21,7 @@ const AntvScatter = asyncComponent(() => import('./components/chart/antv-scatter')) const DataCard = asyncComponent(() => import('./components/card/data-card')) const PropCard = asyncComponent(() => import('./components/card/prop-card')) +const DoubleDataCard = asyncComponent(() => import('./components/card/double-data-card')) const SimpleForm = asyncComponent(() => import('./components/form/simple-form')) const StepForm = asyncComponent(() => import('./components/form/step-form')) const TabForm = asyncComponent(() => import('./components/form/tab-form')) @@ -36,11 +37,14 @@ const NormalTree = asyncComponent(() => import('./components/tree/antd-tree')) const Balcony = asyncComponent(() => import('./components/card/balcony')) const SettingComponent = asyncComponent(() => import('@/tabviews/zshare/settingcomponent')) -const PagemsgComponent = asyncComponent(() => import('@/tabviews/zshare/pageMessage')) const CustomChart = asyncComponent(() => import('./components/chart/custom-chart')) const TimeLine = asyncComponent(() => import('./components/timeline/normal-timeline')) +const AntvG6 = asyncComponent(() => import('./components/chart/antv-G6')) const Voucher = asyncComponent(() => import('./components/module/voucher')) +const Account = asyncComponent(() => import('./components/module/account')) +const Iframe = asyncComponent(() => import('./components/iframe')) const DebugTable = asyncComponent(() => import('@/tabviews/debugtable')) +const TableNodes = asyncComponent(() => import('@/tabviews/zshare/tablenodes')) const MkInterfaces = asyncComponent(() => import('@/tabviews/custom/components/interfaces')) class CustomPage extends Component { @@ -49,7 +53,8 @@ Tab: PropTypes.string, // 寮圭獥鏍囩 MenuID: PropTypes.string, // 鑿滃崟Id MenuNo: PropTypes.string, // 鑿滃崟鍙傛暟 - MenuName: PropTypes.string // 鑿滃崟鍚嶇О + MenuName: PropTypes.string, // 鑿滃崟鍚嶇О + changeTemp: PropTypes.func } state = { @@ -93,21 +98,6 @@ config = '' } - // HS涓嶄娇鐢ㄨ嚜瀹氫箟璁剧疆 - if (result.LongParamUser && !window.GLOB.mkHS) { - try { // 閰嶇疆淇℃伅瑙f瀽 - let userConfig = JSON.parse(window.decodeURIComponent(window.atob(result.LongParamUser))) - if (userConfig) { - shortcuts = userConfig.action - userConfig.printers.forEach(item => { - window.GLOB.UserCacheMap.set(item.parentId + item.uuid, item) - }) - } - } catch (e) { - console.warn('Parse Failure') - } - } - // 椤甸潰閰嶇疆瑙f瀽閿欒鏃舵彁绀� if (!config) { this.setState({ @@ -125,6 +115,36 @@ lostmsg: this.state.dict['main.view.unenabled'] }) return + } + + // 妯℃澘閿欒 + if (config.Template !== 'CustomPage') { + if (config.Template === 'BaseTable' || config.Template === 'CommonTable') { + this.props.changeTemp(MenuID, config.Template) + } else { + this.setState({ + viewlost: true, + loadingview: false, + lostmsg: '鑿滃崟淇℃伅閿欒锛屽彲鑳藉師鍥狅細1銆佸綋鍓嶇敤鎴锋棤鏉冮檺锛�2銆佹墦寮�姝よ彍鍗曠殑鎸夐挳闇�瑕佹洿鏂般��' + }) + } + + return + } + + // HS涓嶄娇鐢ㄨ嚜瀹氫箟璁剧疆 + if (result.LongParamUser && !window.GLOB.mkHS) { + try { // 閰嶇疆淇℃伅瑙f瀽 + let userConfig = JSON.parse(window.decodeURIComponent(window.atob(result.LongParamUser))) + if (userConfig) { + shortcuts = userConfig.action + userConfig.printers.forEach(item => { + window.GLOB.UserCacheMap.set(item.parentId + item.uuid, item) + }) + } + } catch (e) { + console.warn('Parse Failure') + } } // 鏁版嵁缂撳瓨璁剧疆 @@ -172,9 +192,16 @@ }) } - config.interfaces = this.formatInterSetting(config.interfaces, regs) + let popview = 'CustomPage' - config.components = this.filterComponent(config.components, roleId, window.GLOB.mkActions, balMap, skip, param, MenuID, config.interfaces) + if (config.version === 2.0) { + popview = 'popview' + } + + config.$cache = config.cacheLocal === 'true' + + config.interfaces = this.formatInterSetting(config.interfaces, regs) + config.components = this.filterComponent(config.components, roleId, window.GLOB.mkActions, balMap, skip, param, MenuID, config.interfaces, popview, config.$cache) // 鑾峰彇涓绘悳绱㈡潯浠� let mainSearch = [] @@ -215,6 +242,15 @@ config, mainSearch }, () => { + if (config.normalcss) { + let node = document.getElementById(config.uuid) + node && node.remove() + + let ele = document.createElement('style') + ele.id = config.uuid + ele.innerHTML = config.normalcss + document.getElementsByTagName('head')[0].appendChild(ele) + } if (params.length === 0) { setTimeout(() => { // 寤舵椂鍔犺浇鐘舵�� this.setState({ @@ -282,9 +318,10 @@ } } - filterComponent = (components, roleId, permAction, balMap, skip, urlparam, pageId, interfaces) => { + filterComponent = (components, roleId, permAction, balMap, skip, urlparam, pageId, interfaces, popview, cache) => { return components.filter(item => { item.$pageId = pageId + item.$cache = cache if (item.style && item.style.boxShadow) { delete item.style.hShadow @@ -368,7 +405,7 @@ item.subtabs = item.subtabs.map(tab => { tab.$pageId = pageId - tab.components = this.filterComponent(tab.components, roleId, permAction, balMap, skip, urlparam, pageId, interfaces) + tab.components = this.filterComponent(tab.components, roleId, permAction, balMap, skip, urlparam, pageId, interfaces, popview, cache) return tab }) @@ -381,7 +418,7 @@ return false } - item.components = this.filterComponent(item.components, roleId, permAction, balMap, skip, urlparam, pageId, interfaces) + item.components = this.filterComponent(item.components, roleId, permAction, balMap, skip, urlparam, pageId, interfaces, popview, cache) return true } else if (['pie', 'bar', 'line', 'dashboard', 'scatter', 'chart'].includes(item.type)) { @@ -422,15 +459,12 @@ let statFields = [] let getCols = (cols) => { return cols.filter(col => { - if (item.subtype !== 'editable') { - if (col.blacklist && col.blacklist.filter(v => roleId.indexOf(v) > -1).length > 0) { - return false - } else if (col.Hide === 'true') { - return false - } - } else if (col.blacklist && col.blacklist.filter(v => roleId.indexOf(v) > -1).length > 0) { - col.Hide = 'true' + if (col.blacklist && col.blacklist.filter(v => roleId.indexOf(v) > -1).length > 0) { + return false + } else if (col.Hide === 'true') { + return false } + if (col.type === 'number') { if (col.sum === 'true' && !statFields.includes(col.field)) { statFields.push(col) @@ -492,18 +526,16 @@ } // 鏉冮檺杩囨护 - 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 + if (cell.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 = 'CustomPage' + cell.$view = popview cell.$toolbtn = true if (!mutil && cell.syncComponentId === item.setting.supModule) { @@ -542,8 +574,7 @@ cell.syncComponentId = cell.syncComponent ? (cell.syncComponent.pop() || '') : '' cell.$menuId = item.uuid cell.$MenuID = this.props.MenuID - cell.$tabId = tabId - cell.$view = 'CustomPage' + cell.$view = popview if (!mutil && cell.syncComponentId === item.setting.supModule) { cell.syncComponentId = '' @@ -583,8 +614,7 @@ cell.syncComponentId = cell.syncComponent ? (cell.syncComponent.pop() || '') : '' cell.$menuId = item.uuid cell.$MenuID = this.props.MenuID - cell.$tabId = tabId - cell.$view = 'CustomPage' + cell.$view = popview if (!mutil && cell.syncComponentId === item.setting.supModule) { cell.syncComponentId = '' @@ -629,8 +659,7 @@ cell.syncComponentId = cell.syncComponent ? (cell.syncComponent.pop() || '') : '' cell.$menuId = item.uuid cell.$MenuID = this.props.MenuID - cell.$tabId = tabId - cell.$view = 'CustomPage' + cell.$view = popview if (cell.syncComponentId === item.wrap.supModule) { cell.syncComponentId = '' @@ -665,8 +694,7 @@ cell.syncComponentId = cell.syncComponent ? (cell.syncComponent.pop() || '') : '' cell.$menuId = item.uuid cell.$MenuID = this.props.MenuID - cell.$tabId = tabId - cell.$view = 'CustomPage' + cell.$view = popview if (cell.syncComponentId === item.setting.supModule) { cell.syncComponentId = '' @@ -694,6 +722,7 @@ item.subcards = item.subcards.map(group => { group.subButton.uuid = group.uuid group.subButton.$menuId = group.uuid + group.subButton.$MenuID = this.props.MenuID // group.subButton.$forbid = true // 涓嶅0鏄庢暟鎹簮鍙橀噺 group.subButton.OpenType = 'formSubmit' group.subButton.execError = 'never' @@ -713,9 +742,8 @@ // 鏁版嵁婧恠ql璇彞锛岄澶勭悊锛屾潈闄愰粦鍚嶅崟瀛楁璁剧疆涓洪殣钘忚〃鍗� if (['select', 'link', 'multiselect', 'radio', 'checkbox', 'checkcard'].includes(cell.type) && cell.resourceType === '1') { let _option = Utils.getSelectQueryOptions(cell) - - cell.data_sql = Utils.formatOptions(_option.sql) - cell.base_sql = window.btoa(window.encodeURIComponent(_option.sql)) + + cell.base_sql = _option.sql cell.arr_field = _option.field } @@ -808,22 +836,25 @@ component = {...component, ...inherit} return component } else if (component.wrap && component.wrap.datatype === 'public') { + component.setting.useMSearch = false + return component - } - - if (component.setting) { - component.setting.useMSearch = component.setting.useMSearch === 'true' - component.setting.syncRefresh = (component.setting.useMSearch && component.setting.syncRefresh === 'true') - } - - if (component.wrap && component.wrap.datatype === 'static') { + } else if (component.wrap && component.wrap.datatype === 'static') { component.format = '' component.setting = component.setting || {} component.setting.useMSearch = false - component.setting.syncRefresh = false + + return component + } else if (!component.setting || !component.format) { + return component } - if (!component.setting || !component.format) return component // 1銆佷笉浣跨敤绯荤粺鍑芥暟鏃讹紱2銆� 娌℃湁鍔ㄦ�佹暟鎹� 鏁版嵁鏍煎紡 array 鎴� object + component.setting.useMSearch = component.setting.useMSearch === 'true' + + if (component.wrap && component.wrap.goback === 'true') { + component.setting.sync = 'false' + } + if (component.setting.interType !== 'system') { // 涓嶄娇鐢ㄧ郴缁熷嚱鏁版椂 component.setting.sync = 'false' component.setting.laypage = component.setting.laypage === 'true' @@ -896,9 +927,10 @@ } } else if (params) { component.setting.sync = 'false' - component.setting.delay = delay - delay += 20 } + + component.setting.delay = delay + delay += 20 if (balMap.has(component.uuid)) { component.setting.$hasSyncModule = true @@ -968,7 +1000,8 @@ * @description 涓昏〃鏁版嵁鍔犺浇 */ loadmaindata = (params) => { - let param = getStructuredParams(params, this.state.config, this.state.BID || '') + const { config } = this.state + let param = getStructuredParams(params, config, this.state.BID || '') this.setState({loading: true, loadingview: false}) @@ -978,6 +1011,16 @@ delete result.message delete result.ErrMesg delete result.ErrCode + + if (config.$cache) { + params.forEach((item) => { + let _data = result[item.name] || '' + if (_data && !Array.isArray(_data)) { + _data = [_data] + } + Api.writeCacheConfig(item.uuid, _data) + }) + } this.setState({ data: result, @@ -1067,6 +1110,15 @@ } reloadview = () => { + window.GLOB.CacheData.delete(this.props.MenuID) + + if (this.state.config) { + this.deleteCache(this.state.config.components) + this.state.config.interfaces.forEach(m => { + window.GLOB.CacheData.delete(m.uuid) + }) + } + this.setState({ BID: '', // 椤甸潰璺宠浆鏃舵惡甯D loadingview: true, // 椤甸潰鍔犺浇涓� @@ -1092,148 +1144,178 @@ if (!config || !config.components) return return config.components.map(item => { - if (item.type === 'bar' || item.type === 'line') { + let style = null + + if (item.style && item.style.clear === 'left') { + style = {clear: 'left'} + } + + if (item.type === 'card' && item.subtype === 'datacard') { return ( - <Col span={item.width} key={item.uuid}> - <AntvBarAndLine config={item} data={data} mainSearch={mainSearch}/> - </Col> - ) - } else if (item.type === 'pie') { - return ( - <Col span={item.width} key={item.uuid}> - <AntvPie config={item} data={data} mainSearch={mainSearch}/> - </Col> - ) - } else if (item.type === 'scatter') { - return ( - <Col span={item.width} key={item.uuid}> - <AntvScatter config={item} data={data} mainSearch={mainSearch}/> - </Col> - ) - } else if (item.type === 'dashboard') { - return ( - <Col span={item.width} key={item.uuid}> - <AntvDashboard config={item} data={data} mainSearch={mainSearch}/> - </Col> - ) - } else if (item.type === 'form' && item.subtype === 'simpleform') { - return ( - <Col span={item.width} key={item.uuid}> - <SimpleForm config={item} data={data} mainSearch={mainSearch}/> - </Col> - ) - } else if (item.type === 'form' && item.subtype === 'stepform') { - return ( - <Col span={item.width} key={item.uuid}> - <StepForm config={item} data={data} mainSearch={mainSearch}/> - </Col> - ) - } else if (item.type === 'form' && item.subtype === 'tabform') { - return ( - <Col span={item.width} key={item.uuid}> - <TabForm config={item} data={data} mainSearch={mainSearch}/> - </Col> - ) - } else if (item.type === 'search') { - return ( - <Col span={item.width} key={item.uuid}> - <MainSearch config={item} BID={BID} refreshdata={this.resetSearch} /> - </Col> - ) - } else if (item.type === 'tabs') { - return ( - <Col span={item.width} key={item.uuid}> - <AntvTabs config={item} mainSearch={mainSearch} /> - </Col> - ) - } else if (item.type === 'card' && item.subtype === 'datacard') { - return ( - <Col span={item.width} key={item.uuid}> + <Col span={item.width} style={style} key={item.uuid}> <DataCard config={item} data={data} mainSearch={mainSearch}/> </Col> ) } else if (item.type === 'card' && item.subtype === 'propcard') { return ( - <Col span={item.width} key={item.uuid}> + <Col span={item.width} style={style} key={item.uuid}> <PropCard config={item} data={data} mainSearch={mainSearch}/> + </Col> + ) + } else if (item.type === 'card' && item.subtype === 'dualdatacard') { + return ( + <Col span={item.width} style={style} key={item.uuid}> + <DoubleDataCard config={item} mainSearch={mainSearch}/> + </Col> + ) + } else if (item.type === 'table' && item.subtype === 'normaltable') { + return ( + <Col span={item.width} style={style} key={item.uuid}> + <NormalTable config={item} data={data} mainSearch={mainSearch}/> + </Col> + ) + } else if (item.type === 'bar' || item.type === 'line') { + return ( + <Col span={item.width} style={style} key={item.uuid}> + <AntvBarAndLine config={item} data={data} mainSearch={mainSearch}/> + </Col> + ) + } else if (item.type === 'pie') { + return ( + <Col span={item.width} style={style} key={item.uuid}> + <AntvPie config={item} data={data} mainSearch={mainSearch}/> + </Col> + ) + } else if (item.type === 'scatter') { + return ( + <Col span={item.width} style={style} key={item.uuid}> + <AntvScatter config={item} data={data} mainSearch={mainSearch}/> + </Col> + ) + } else if (item.type === 'dashboard') { + return ( + <Col span={item.width} style={style} key={item.uuid}> + <AntvDashboard config={item} data={data} mainSearch={mainSearch}/> + </Col> + ) + } else if (item.type === 'form' && item.subtype === 'simpleform') { + return ( + <Col span={item.width} style={style} key={item.uuid}> + <SimpleForm config={item} data={data} mainSearch={mainSearch}/> + </Col> + ) + } else if (item.type === 'form' && item.subtype === 'stepform') { + return ( + <Col span={item.width} style={style} key={item.uuid}> + <StepForm config={item} data={data} mainSearch={mainSearch}/> + </Col> + ) + } else if (item.type === 'form' && item.subtype === 'tabform') { + return ( + <Col span={item.width} style={style} key={item.uuid}> + <TabForm config={item} data={data} mainSearch={mainSearch}/> + </Col> + ) + } else if (item.type === 'search') { + return ( + <Col span={item.width} style={style} key={item.uuid}> + <MainSearch config={item} BID={BID} refreshdata={this.resetSearch} /> + </Col> + ) + } else if (item.type === 'tabs') { + return ( + <Col span={item.width} style={style} key={item.uuid}> + <AntvTabs config={item} mainSearch={mainSearch} /> </Col> ) } else if (item.type === 'balcony') { return ( - <Col span={item.width} key={item.uuid}> + <Col span={item.width} style={style} key={item.uuid}> <Balcony config={item} data={data}/> </Col> ) } else if (item.type === 'timeline') { return ( - <Col span={item.width} key={item.uuid}> + <Col span={item.width} style={style} key={item.uuid}> <TimeLine config={item} data={data} mainSearch={mainSearch}/> </Col> ) } else if (item.type === 'carousel' && item.subtype === 'datacard') { return ( - <Col span={item.width} key={item.uuid}> + <Col span={item.width} style={style} key={item.uuid}> <CarouselDataCard config={item} data={data} mainSearch={mainSearch}/> </Col> ) } else if (item.type === 'carousel' && item.subtype === 'propcard') { return ( - <Col span={item.width} key={item.uuid}> + <Col span={item.width} style={style} key={item.uuid}> <CarouselPropCard config={item} data={data} mainSearch={mainSearch}/> </Col> ) } else if (item.type === 'card' && item.subtype === 'tablecard') { return ( - <Col span={item.width} key={item.uuid}> + <Col span={item.width} style={style} key={item.uuid}> <TableCard config={item} data={data} mainSearch={mainSearch}/> - </Col> - ) - } else if (item.type === 'table' && item.subtype === 'normaltable') { - return ( - <Col span={item.width} key={item.uuid}> - <NormalTable config={item} data={data} mainSearch={mainSearch}/> </Col> ) } else if (item.type === 'table' && item.subtype === 'editable') { return ( - <Col span={item.width} key={item.uuid}> + <Col span={item.width} style={style} key={item.uuid}> <EditTable config={item} mainSearch={mainSearch}/> </Col> ) } else if (item.type === 'group' && item.subtype === 'normalgroup') { return ( - <Col span={item.width} key={item.uuid}> + <Col span={item.width} style={style} key={item.uuid}> <NormalGroup config={item} mainSearch={mainSearch}/> </Col> ) } else if (item.type === 'editor') { return ( - <Col span={item.width} key={item.uuid}> + <Col span={item.width} style={style} key={item.uuid}> <BraftEditor config={item} data={data} mainSearch={mainSearch}/> </Col> ) } else if (item.type === 'tree') { return ( - <Col span={item.width} key={item.uuid}> + <Col span={item.width} style={style} key={item.uuid}> <NormalTree config={item} data={data} mainSearch={mainSearch}/> </Col> ) } else if (item.type === 'code') { return ( - <Col span={item.width} key={item.uuid}> + <Col span={item.width} style={style} key={item.uuid}> <SandBox config={item} data={data} mainSearch={mainSearch}/> </Col> ) } else if (item.type === 'chart') { return ( - <Col span={item.width} key={item.uuid}> + <Col span={item.width} style={style} key={item.uuid}> <CustomChart config={item} data={data} mainSearch={mainSearch}/> + </Col> + ) + } else if (item.type === 'antvG6') { + return ( + <Col span={item.width} style={style} key={item.uuid}> + <AntvG6 config={item} data={data} mainSearch={mainSearch}/> </Col> ) } else if (item.type === 'module' && item.subtype === 'voucher') { return ( - <Col span={item.width} key={item.uuid}> + <Col span={item.width} style={style} key={item.uuid}> <Voucher config={item}/> + </Col> + ) + } else if (item.type === 'module' && item.subtype === 'account') { + return ( + <Col span={item.width} style={style} key={item.uuid}> + <Account config={item}/> + </Col> + ) + } else if (item.type === 'iframe') { + return ( + <Col span={item.width} style={style} key={item.uuid}> + <Iframe config={item} data={data} mainSearch={mainSearch}/> </Col> ) } else { @@ -1247,11 +1329,11 @@ return ( <div className={'custom-page-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> + {(loadingview || (loading && !config.$cache)) ? <Spin className="view-spin" size="large" /> : null} + <Row id={config ? 'menu' + config.uuid : ''} className="component-wrap">{this.getComponents()}</Row> {config && config.interfaces.length > 0 ? <MkInterfaces BID={BID} interfaces={config.interfaces}/> : null} {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 && window.GLOB.systemType !== 'production' ? <TableNodes config={config} /> : null} {!window.GLOB.mkHS && config ? <SettingComponent config={config} dict={this.state.dict} shortcuts={shortcuts || []}/> : null} {viewlost ? <NotFount msg={this.state.lostmsg} /> : null} </div> -- Gitblit v1.8.0