From 46f79b491173d284a4900d19e7aecf7509481438 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期五, 21 一月 2022 17:21:25 +0800 Subject: [PATCH] 2022-01-21 --- src/views/mobdesign/index.jsx | 259 ++++++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 230 insertions(+), 29 deletions(-) diff --git a/src/views/mobdesign/index.jsx b/src/views/mobdesign/index.jsx index d4474f5..0bac9a5 100644 --- a/src/views/mobdesign/index.jsx +++ b/src/views/mobdesign/index.jsx @@ -5,7 +5,8 @@ import { is, fromJS } from 'immutable' import moment from 'moment' import HTML5Backend from 'react-dnd-html5-backend' -import { ConfigProvider, notification, Modal, Collapse, Switch, Button, message, Spin, Icon, Typography } from 'antd' +import { ConfigProvider, notification, Modal, Collapse, Switch, Button, message, Spin, Typography } from 'antd' +import { DoubleLeftOutlined, DoubleRightOutlined, HomeOutlined, LoginOutlined, RedoOutlined } from '@ant-design/icons' import Api from '@/api' import Utils, { setGLOBFuncs } from '@/utils/utils.js' @@ -16,6 +17,7 @@ import MKEmitter from '@/utils/events.js' import MenuUtils from '@/utils/utils-custom.js' import asyncComponent from '@/utils/asyncComponent' +import backurl from '@/assets/img/back.jpg' import './index.scss' @@ -70,7 +72,9 @@ direction: 'vertical', settingshow: true, controlshow: true, - comloading: false + comloading: false, + adapters: [], + viewType: 'menu' } UNSAFE_componentWillMount() { @@ -85,7 +89,10 @@ sessionStorage.setItem('role_type', param.role_type || 'true') sessionStorage.setItem('login_types', param.login_types || 'false') sessionStorage.setItem('typename', param.typename || 'mob') - sessionStorage.setItem('adapter', param.adapter || 'false') + sessionStorage.setItem('adapter', param.adapter || '') + sessionStorage.setItem('sysBgColor', param.sysBgColor || '#ffffff') + sessionStorage.setItem('userbind', param.userbind || '') + sessionStorage.setItem('instantMessage', param.instantMessage || '') this.setState({ localedict: sessionStorage.getItem('lang') !== 'en-US' ? antdZhCN : antdEnUS, @@ -105,8 +112,17 @@ window.GLOB.shellHeight = 853 } + let adapters = sessionStorage.getItem('adapter') + if (adapters) { + adapters = adapters.split(',') + } else { + adapters = [] + } + this.setState({ - MenuId: param.MenuID + adapters, + MenuId: param.MenuID, + viewType: /^userbind/.test(param.MenuID) ? 'userbind' : 'menu' }, () => { this.getMenuParam(param) }) @@ -145,6 +161,37 @@ this.getSmStemp() setGLOBFuncs() }, 1000) + + document.onkeydown = (event) => { + let e = event || window.event + let keyCode = e.keyCode || e.which || e.charCode + let preKey = '' + + if (e.ctrlKey) { + preKey = 'ctrl' + } + if (e.shiftKey) { + preKey = 'shift' + } else if (e.altKey) { + preKey = 'alt' + } + + if (!preKey || !keyCode) return + + let _shortcut = `${preKey}+${keyCode}` + + if (_shortcut === 'ctrl+83') { + let node = document.getElementById('save-modal-config') + if (!node) { + node = document.getElementById('save-config') + } + + if (node) { + node.click() + } + return false + } + } } /** @@ -203,6 +250,16 @@ duration: 5 }) return + } else if (['AIService'].includes(menu.MenuID)) { + notification.warning({ + top: 92, + message: '绯荤粺椤甸潰涓嶅彲缂栬緫锛�', + duration: 5 + }) + return + } else if (menu.routerUrl) { + this.props.history.push(menu.routerUrl) + return } let param = { @@ -235,9 +292,9 @@ return } - let homeId = MenuID || '' + let homeId = '' let appViewList = [] - if (!homeId && res.data && res.data.length > 0) { + if (res.data && res.data.length > 0) { appViewList = res.data appViewList.forEach(item => { if (item.keys_type === 'index') { @@ -247,7 +304,7 @@ } if (!homeId) { - homeId = Utils.getuuid() + homeId = MenuID || Utils.getuuid() let param = { func: 's_kei_link_keyids_addupt', @@ -286,7 +343,7 @@ }) } else { sessionStorage.setItem('appViewList', JSON.stringify(appViewList)) - this.props.history.replace('/mobdesign/' + window.btoa(window.encodeURIComponent(JSON.stringify({MenuID: homeId, type: 'view'})))) + this.props.history.replace('/mobdesign/' + window.btoa(window.encodeURIComponent(JSON.stringify({MenuID: MenuID || homeId, type: 'view'})))) } }) } @@ -395,10 +452,7 @@ if (!config) { window.close() - return - } - - if (!oriConfig || !is(fromJS(oriConfig), fromJS(config))) { + } else if (!oriConfig || !is(fromJS(oriConfig), fromJS(config))) { confirm({ title: '閰嶇疆淇℃伅鏈繚瀛橈紝纭畾鍏抽棴鍚楋紵', content: '', @@ -409,6 +463,25 @@ }) } else { window.close() + } + } + + backView = () => { + const { oriConfig, config } = this.state + + if (!config) { + window.history.back() + } else if (!oriConfig || !is(fromJS(oriConfig), fromJS(config))) { + confirm({ + title: '閰嶇疆淇℃伅鏈繚瀛橈紝纭畾鍚庨��鍚楋紵', + content: '', + onOk() { + window.history.back() + }, + onCancel() {} + }) + } else { + window.history.back() } } @@ -444,6 +517,11 @@ config = null } + if (/^userbind/.test(MenuId)) { + this.setUserBindMenu(config, result) + return + } + if (!config) { isCreate = true config = { @@ -457,8 +535,9 @@ tables: [], components: [], viewType: 'menu', + statusBarbgColor: sessionStorage.getItem('sysBgColor') || '#ffffff', style: { - backgroundColor: '#ffffff', backgroundImage: '' + backgroundColor: sessionStorage.getItem('sysBgColor') || '#ffffff', backgroundImage: '' } } } @@ -491,6 +570,88 @@ this.getAppMenus() } + setUserBindMenu = (config, result) => { + const { MenuId } = this.state + let isCreate = !config + + if (!config) { + config = { + version: 1.0, + uuid: MenuId, + MenuID: MenuId, + Template: 'webPage', + enabled: false, + MenuName: '鐢ㄦ埛缁戝畾', + MenuNo: 'user_bind', + tables: [], + components: [], + viewType: 'userbind', + statusBarbgColor: '#ffffff', + style: { + backgroundColor: '#ffffff', backgroundImage: '' + } + } + + config.components.push({ + subcards:[ + { + uuid: Utils.getuuid(), setting: {width:24, primaryId: '', click: ''}, style: {}, backStyle: {}, + elements: [{maxWidth: 120, datatype: 'static', width: 24, marks: null, url: 'http://cloud.mk9h.cn/Content/images/20220120/cb5cd13a-2ef4-41cc-ab6a-a202f1c04da5.png', style: {borderRadius: '50%'}, eleType: 'picture', link: '', uuid: Utils.getuuid(), lenWidRadio: '1:1', $type: ''}], + backElements: [] + } + ], + headerStyle: {}, parentId: '', width: 24, scripts: [], btnlog: [], 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'}, dataName: Utils.getuuid(), format: 'object', subtype: 'propcard', type: 'card', uuid: Utils.getuuid(), columns: [] + }) + + config.components.push({ + uuid: Utils.getuuid(), + type: 'login', + floor: 1, + tabId: '', + parentId: '', + dataName: '', + width: 24, + name: '鐢ㄦ埛缁戝畾', + subtype: 'bindlogin', + wrap: { name: '鐢ㄦ埛缁戝畾', width: 24, loginWays: ['uname_pwd'], shortcut: 'none', height: '45vh' }, + style: {}, + loginWays: [ + {type: 'uname_pwd', label: '璐﹀彿鐧诲綍', shortcut: 'none'}, + {type: 'sms_vcode', label: '鐭俊鐧诲綍'}, + ] + }) + + config.components.push({ + subcards:[ + { + uuid: Utils.getuuid(), setting: {width:24, primaryId: '', click: ''}, style: {}, backStyle: {}, + elements: [{datatype: 'static', width: 24, marks: null, height: null, value: 'Power by Minkesoft', style: { fontSize: '13px', textAlign: 'center'}, eleType: 'text', link: '', uuid: Utils.getuuid(), $type: ''}], + backElements: [] + } + ], + headerStyle: {}, parentId: '', width: 24, scripts: [], btnlog: [], pageable: false, + wrap: {name: 'Power', width: 24, datatype: 'static', cardType: '', blacklist: []}, + name: 'Power', floor: 1, switchable: true, + setting:{interType: 'system'}, tabId: '', style:{}, dataName: Utils.getuuid(), format: 'object', subtype: 'propcard', type: 'card', uuid: Utils.getuuid(), columns: [] + }) + } + + config.uuid = MenuId + config.MenuID = MenuId + config.open_edition = result.open_edition || '' + + this.setState({ + oriConfig: isCreate ? null : config, + config: fromJS(config).toJS(), + activeKey: isCreate ? 'basedata' : 'component', + loading: false + }) + window.GLOB.customMenu = config + } + getAppMenus = () => { let _param = { func: 's_get_app_menus', @@ -515,6 +676,13 @@ let appIndeList = sessionStorage.getItem('appViewList') appIndeList = JSON.parse(appIndeList) appIndeList = appIndeList.map(item => (item.keys_type !== 'index' ? item.keys_id : '')).join(',') + + if (sessionStorage.getItem('userbind')) { + appIndeList = appIndeList + ',' + sessionStorage.getItem('userbind') + } + if (sessionStorage.getItem('instantMessage')) { + appIndeList = appIndeList + ',' + sessionStorage.getItem('instantMessage') + } let menus = res.menus.filter(item => appIndeList.indexOf(item.MenuID) === -1) menus = menus.map(item => { @@ -908,6 +1076,7 @@ } submitConfig = () => { + const { adapters } = this.state let config = fromJS(this.state.config).toJS() if (!config.MenuName || !config.MenuNo || (config.cacheUseful === 'true' && !config.cacheTime)) { @@ -942,7 +1111,7 @@ config.loginview = false } - if (sessionStorage.getItem('adapter') === 'true') { + if (adapters.includes('wxmini')) { config = this.getMiniStyle(config) } @@ -1024,7 +1193,7 @@ Typename: sessionStorage.getItem('typename'), MenuName: item.name || '', PageParam: JSON.stringify({Template: item.type}), - open_edition: _item.open_edition || '', + open_edition: _item ? (_item.open_edition || '') : '', menus_rolelist: window.btoa(window.encodeURIComponent(JSON.stringify(roles))), LText: '', LTexttb: '' @@ -1196,8 +1365,10 @@ } verifyConfig = (show) => { - const { config } = this.state + const { config, viewType } = this.state let error = '' + let searchSum = 0 + let swipes = [] let check = (components) => { components.forEach(item => { @@ -1212,6 +1383,24 @@ return } else if (item.type === 'navbar' && !item.wrap.MenuNo) { error = `瀵艰埅鏍忋��${item.name}銆嬫湭璁剧疆鑿滃崟鍙傛暟锛乣 + } else if (item.type === 'topbar') { + if (item.wrap.type === 'search' || item.wrap.type === 'searchIcon' || (item.wrap.type === 'navbar' && item.wrap.search === 'true')) { + searchSum += 1 + } + } else if (item.type === 'search') { + searchSum += 1 + if (!item.wrap.field) { + error = `鎼滅储鏉′欢銆�${item.name}銆嬫湭璁剧疆鎼滅储瀛楁锛乣 + } + } else if (item.subtype === 'propcard' && item.subcards.length === 0) { + error = `缁勪欢銆�${item.name}銆嬩腑鍗$墖涓嶅彲涓虹┖锛乣 + return + } else if (item.type === 'login' && !item.wrap.linkmenu && item.wrap.link !== 'menu') { + error = '鐧诲綍缁勪欢鏈缃叧鑱旇彍鍗曪紒' + return + } + if (item.wrap && item.wrap.pagestyle === 'slide') { + swipes.push(item.name) } if (['propcard', 'brafteditor', 'sandbox', 'tabbar', 'stepform', 'tabform'].includes(item.subtype) && item.wrap.datatype === 'static') return @@ -1242,6 +1431,16 @@ } check(config.components) + + if (!error && viewType === 'userbind' && config.components.filter(item => item.type === 'login').length === 0) { + error = '鐢ㄦ埛缁戝畾椤甸潰蹇呴』娣诲姞鐧诲綍銆�' + } + + if (!error && searchSum > 1) { + error = '鎼滅储缁勪欢涓庡鑸爮鐨勬悳绱㈠姛鑳戒笉鍙悓鏃朵娇鐢ㄣ��' + } else if (!error && swipes.length > 1) { + error = `椤甸潰涓笉鍙悓鏃朵娇鐢ㄥ涓粦鍔ㄥ姞杞界粍浠躲�傦紙${swipes.join('銆�')}锛塦 + } if (show && error) { notification.warning({ @@ -1463,28 +1662,29 @@ render () { - const { localedict, comloading, loading, settingshow, controlshow, activeKey, dict, MenuId, config, menuloading, customComponents } = this.state + const { viewType, localedict, comloading, loading, settingshow, controlshow, activeKey, dict, MenuId, config, menuloading, customComponents, adapters } = this.state return ( <ConfigProvider locale={localedict}> - <div className="mk-mob-view" id="mk-mob-design-view"> + <div className={'mk-mob-view ' + viewType} id="mk-mob-design-view"> <Header changeView={this.changeView}/> {loading ? <Spin className="view-spin" size="large" /> : null} <DndProvider backend={HTML5Backend}> <div className={'menu-setting ' + (!settingshow ? 'hidden' : '')}> <div className="draw"> - {settingshow ? <Icon onClick={() => {this.setState({settingshow: false})}} type="double-left" /> : null} - {!settingshow ? <Icon onClick={() => {this.setState({settingshow: true})}} type="double-right" /> : null} + {settingshow ? <DoubleLeftOutlined onClick={() => {this.setState({settingshow: false})}} /> : null} + {!settingshow ? <DoubleRightOutlined onClick={() => {this.setState({settingshow: true})}} /> : null} </div> <div className="pc-setting-tools"> <Collapse accordion activeKey={activeKey} bordered={false} onChange={(key) => this.setState({activeKey: key})}> {/* 鍩烘湰淇℃伅 */} - <Panel header={dict['mob.basemsg']} forceRender key="basedata"> + <Panel header={dict['mob.basemsg']} forceRender className="basedata" key="basedata"> {/* 鑿滃崟淇℃伅 */} {config ? <MenuForm dict={dict} config={config} MenuId={MenuId} + adapters={adapters} updateConfig={this.updateConfig} /> : null} {config ? <UrlFieldComponent config={config} updateConfig={this.updateConfig}/> : null} @@ -1493,10 +1693,10 @@ {config ? <Paragraph style={{padding: '15px 0px 0px 18px'}} copyable={{ text: MenuId }}>鑿滃崟ID</Paragraph> : null} </Panel> {/* 缁勪欢娣诲姞 */} - <Panel header={dict['mob.component']} key="component"> + <Panel header={dict['mob.component']} className="component" key="component"> <SourceWrap /> </Panel> - {customComponents && customComponents.length ? <Panel header="鑷畾涔夌粍浠�" key="cuscomponent"> + {customComponents && customComponents.length ? <Panel header="鑷畾涔夌粍浠�" className="cuscomponent" key="cuscomponent"> <SourceWrap components={customComponents} /> </Panel> : null} <Panel header={'椤甸潰鏍峰紡'} key="background"> @@ -1507,24 +1707,25 @@ </div> <div className={'menu-control ' + (!controlshow ? 'hidden' : '')}> <div className="draw"> - {controlshow ? <Icon onClick={() => {this.setState({controlshow: false})}} type="double-right" /> : null} - {!controlshow ? <Icon onClick={() => {this.setState({controlshow: true})}} type="double-left" /> : null} + {controlshow ? <DoubleRightOutlined onClick={() => {this.setState({controlshow: false})}}/> : null} + {!controlshow ? <DoubleLeftOutlined onClick={() => {this.setState({controlshow: true})}}/> : null} </div> <div className="wrap"> - <Button type="primary" onClick={this.submitConfig} loading={menuloading}>{dict['mob.save']}</Button> + <Button type="primary" onClick={this.submitConfig} id="save-config" loading={menuloading}>{dict['mob.save']}</Button> <Switch className="big" checkedChildren={dict['mob.enable']} unCheckedChildren={dict['mob.disable']} checked={config && config.enabled} onChange={this.onEnabledChange} /> + <img title="鍚庨��" className="back-view" onClick={this.backView} src={backurl} alt=""/> <CreateView resetmenu={this.getAppMenus} /> <PasteController insert={this.insert} /> <StyleCombControlButton menu={config} /> <SysInterface config={config} updateConfig={this.updateConfig}/> <PictureController/> <Quotecomponent config={config} updateConfig={this.updateConfig}/> - <Button className="mk-border-green" icon="home" onClick={this.setHomeView}>璁句负棣栭〉</Button> - <Button className="mk-border-purple" icon="login" onClick={this.setLoginView}>璁句负鐧诲綍椤�</Button> + <Button className="mk-border-green set-home" onClick={this.setHomeView}><HomeOutlined /> 璁句负棣栭〉</Button> + <Button className="mk-border-purple set-login" onClick={this.setLoginView}><LoginOutlined /> 璁句负鐧诲綍椤�</Button> <ReplaceField type="custom" config={config} updateConfig={this.resetConfig}/> <Transfer MenuID={MenuId} /> <Versions MenuId={MenuId} open_edition={config ? config.open_edition : ''}/> - <Button className="mk-border-danger" icon="redo" onClick={this.refreshView}>寮哄埗鍒锋柊</Button> + <Button className="mk-border-danger" onClick={this.refreshView}><RedoOutlined /> 寮哄埗鍒锋柊</Button> <Button type="default" onClick={this.closeView}>鍏抽棴</Button> </div> </div> -- Gitblit v1.8.0