| | |
| | | import { is, fromJS } from 'immutable' |
| | | import HTML5Backend from 'react-dnd-html5-backend' |
| | | import { ConfigProvider, notification, Modal, Collapse, Switch, Button, message, Spin, Typography } from 'antd' |
| | | import { DoubleLeftOutlined, DoubleRightOutlined, HomeOutlined, LoginOutlined, RedoOutlined, ArrowLeftOutlined, EyeOutlined, EyeInvisibleOutlined } from '@ant-design/icons' |
| | | import { DoubleLeftOutlined, DoubleRightOutlined, HomeOutlined, LoginOutlined, ArrowLeftOutlined, EyeOutlined, EyeInvisibleOutlined } from '@ant-design/icons' |
| | | import moment from 'moment' |
| | | import md5 from 'md5' |
| | | |
| | |
| | | import Utils, { setGLOBFuncs } from '@/utils/utils.js' |
| | | import antdZhCN from 'antd/es/locale/zh_CN' |
| | | import MKEmitter from '@/utils/events.js' |
| | | import MenuUtils, { getTables } from '@/utils/utils-custom.js' |
| | | import MenuUtils, { getTables, getFuncsAndInters } from '@/utils/utils-custom.js' |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | |
| | | import '@/assets/css/design.scss' |
| | |
| | | const { Paragraph } = Typography |
| | | |
| | | const Header = asyncComponent(() => import('@/mob/header')) |
| | | const Debug = asyncComponent(() => import('@/menu/debug')) |
| | | const MenuForm = asyncComponent(() => import('./menuform')) |
| | | const MobShell = asyncComponent(() => import('@/mob/mobshell')) |
| | | const CreateView = asyncComponent(() => import('@/pc/createview')) |
| | |
| | | const TableComponent = asyncComponent(() => import('@/templates/sharecomponent/tablecomponent')) |
| | | const PopView = asyncComponent(() => import('./popview')) |
| | | |
| | | sessionStorage.setItem('isEditState', 'true') |
| | | sessionStorage.setItem('editMenuType', 'menu') // 编辑菜单类型 |
| | | sessionStorage.setItem('appType', 'mob') // 应用类型 |
| | | document.body.className = '' |
| | |
| | | window.GLOB.CacheIndependent = new Map() |
| | | window.GLOB.urlFields = [] // url变量 |
| | | window.GLOB.customMenu = null // 保存菜单信息 |
| | | |
| | | const memberLevel = Utils.getMemberLevel() |
| | | |
| | | class MobDesign extends Component { |
| | | state = { |
| | |
| | | } |
| | | |
| | | UNSAFE_componentWillMount() { |
| | | if (sessionStorage.getItem('devError') === 'true') { |
| | | sessionStorage.clear() |
| | | window.history.replaceState(null, null, window.location.href.split('#')[0] + '#/login') |
| | | window.location.reload() |
| | | return |
| | | } |
| | | |
| | | if (!sessionStorage.getItem('UserID')) { |
| | | sessionStorage.removeItem('isEditState') |
| | | sessionStorage.removeItem('editMenuType') |
| | | sessionStorage.removeItem('appType') |
| | | this.props.history.replace('/login') |
| | | return |
| | | } |
| | | |
| | | if (memberLevel < 30) return |
| | | if (window.GLOB.memberLevel < 30) return |
| | | |
| | | window.GLOB.developing = true |
| | | |
| | | try { |
| | | let param = JSON.parse(window.decodeURIComponent(window.atob(this.props.match.params.param))) |
| | | |
| | |
| | | window.GLOB.winHeight = 738 |
| | | window.GLOB.shellWidth = 376 |
| | | window.GLOB.shellHeight = 680 |
| | | window.GLOB.curDate = moment().format('YYYY-MM-DD') |
| | | |
| | | let adapters = sessionStorage.getItem('adapter') |
| | | if (adapters) { |
| | |
| | | |
| | | componentDidMount () { |
| | | if (!sessionStorage.getItem('UserID')) return |
| | | if (memberLevel < 30) { |
| | | if (window.GLOB.memberLevel < 30) { |
| | | document.getElementById('mk-mob-design-view').innerHTML = '<div style="text-align: center; font-size: 30px; margin-top: 40vh; height: 100vh; background: #fff;">本应用没有PC端页面的编辑权限,请联系管理员!</div>' |
| | | return |
| | | } |
| | |
| | | MKEmitter.addListener('triggerMenuSave', this.submitConfig) |
| | | MKEmitter.addListener('changeEditMenu', this.changeEditMenu) |
| | | setTimeout(() => { |
| | | this.getAppPictures() |
| | | this.getRoleFields() |
| | | setGLOBFuncs() |
| | | }, 1000) |
| | |
| | | } |
| | | |
| | | getAppMessage = (MenuID) => { |
| | | Api.getSystemConfig({ |
| | | Api.getCloudConfig({ |
| | | func: 's_get_keyids', |
| | | bid: sessionStorage.getItem('appId') |
| | | }).then(res => { |
| | |
| | | let param = { |
| | | func: 's_kei_link_keyids_addupt', |
| | | BID: sessionStorage.getItem('appId'), |
| | | exec_type: 'y', |
| | | exec_type: 'x', |
| | | LText: '' |
| | | } |
| | | |
| | |
| | | |
| | | param.LText = appViewList.map(item => `select '${item.keys_id}','${item.keys_type}','${item.kei_no}','${item.appkey}','${item.bid}','${sessionStorage.getItem('CloudUserID')}','${item.remark}'`) |
| | | param.LText = param.LText.join(' union all ') |
| | | param.LText = Utils.formatOptions(param.LText) |
| | | param.LText = Utils.formatOptions(param.LText, 'x') |
| | | |
| | | param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') |
| | | param.secretkey = Utils.encrypt('', param.timestamp) |
| | | |
| | | Api.getSystemConfig(param).then(result => { |
| | | Api.getCloudConfig(param).then(result => { |
| | | if (!result.status) { |
| | | notification.warning({ |
| | | top: 92, |
| | |
| | | sessionStorage.setItem('appViewList', JSON.stringify(appViewList)) |
| | | this.props.history.replace('/mobdesign/' + window.btoa(window.encodeURIComponent(JSON.stringify({MenuID: MenuID || homeId, type: 'view'})))) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | getAppPictures = () => { |
| | | if (sessionStorage.getItem('app_pictures')) return |
| | | |
| | | let deffers = [] |
| | | let param = { |
| | | func: 's_url_db_adduptdel', |
| | | PageIndex: 0, // 0 代表全部 |
| | | PageSize: 0, // 0 代表全部 |
| | | type: 'search' |
| | | } |
| | | deffers = [new Promise(resolve => { |
| | | setTimeout(() => { |
| | | Api.getSystemConfig({...param, typecharone: 'image'}).then(res => { |
| | | resolve(res.data) |
| | | }) |
| | | }, 500) |
| | | }), new Promise(resolve => { |
| | | setTimeout(() => { |
| | | Api.getSystemConfig({...param, typecharone: 'video'}).then(res => { |
| | | resolve(res.data) |
| | | }) |
| | | }, 1000) |
| | | }), new Promise(resolve => { |
| | | setTimeout(() => { |
| | | Api.getSystemConfig({...param, typecharone: 'color'}).then(res => { |
| | | resolve(res.data) |
| | | }) |
| | | }, 1500) |
| | | })] |
| | | |
| | | Promise.all(deffers).then(response => { |
| | | sessionStorage.setItem('app_pictures', JSON.stringify(response[0] || [])) |
| | | sessionStorage.setItem('app_videos', JSON.stringify(response[1] || [])) |
| | | sessionStorage.setItem('app_colors', JSON.stringify(response[2] || [])) |
| | | }) |
| | | } |
| | | |
| | |
| | | MenuID: MenuId |
| | | } |
| | | |
| | | Api.getSystemConfig(param).then(result => { |
| | | Api.getCloudConfig(param).then(result => { |
| | | if (!result.status) { |
| | | notification.warning({ |
| | | top: 92, |
| | |
| | | |
| | | config.uuid = MenuId |
| | | config.MenuID = MenuId |
| | | config.Template = 'webPage' |
| | | config.open_edition = result.open_edition || '' |
| | | config.direction = config.direction || sessionStorage.getItem('direction') || 'vertical' |
| | | window.GLOB.urlFields = config.urlFields || [] |
| | |
| | | |
| | | config.uuid = MenuId |
| | | config.MenuID = MenuId |
| | | config.Template = 'webPage' |
| | | config.open_edition = result.open_edition || '' |
| | | |
| | | this.setState({ |
| | |
| | | |
| | | _param.secretkey = Utils.encrypt(_param.LText, _param.timestamp) |
| | | |
| | | Api.getSystemConfig(_param).then(res => { |
| | | Api.getCloudConfig(_param).then(res => { |
| | | if (!res.status) { |
| | | notification.warning({ |
| | | top: 92, |
| | |
| | | MenuID: urlParam.copyMenuId |
| | | } |
| | | |
| | | Api.getSystemConfig(param).then(result => { |
| | | Api.getCloudConfig(param).then(result => { |
| | | if (!result.status) { |
| | | notification.warning({ |
| | | top: 92, |
| | |
| | | config.uuid = MenuId |
| | | config.MenuID = MenuId |
| | | config.open_edition = '' |
| | | config.Template = 'webPage' |
| | | config.MenuName = urlParam.MenuName || '' |
| | | // config.MenuNo = urlParam.MenuNo || '' |
| | | config.MenuNo = '' |
| | |
| | | } |
| | | |
| | | jointComponents = (config, navItem) => { |
| | | Api.getSystemConfig({ |
| | | Api.getCloudConfig({ |
| | | func: 'sPC_Get_LongParam', |
| | | TypeCharOne: sessionStorage.getItem('kei_no'), |
| | | typename: sessionStorage.getItem('typename'), |
| | |
| | | menuloading: true |
| | | }) |
| | | |
| | | window.GLOB.saving = true |
| | | |
| | | setTimeout(() => { |
| | | let _pass = this.verifyConfig(config) |
| | | |
| | |
| | | let menus_used_list = subMenus.map(m => `'${config.uuid}','${config.MenuName || ''}','${config.MenuNo || ''}','${m.MenuID}','${m.MenuName}'`).join(';') |
| | | menus_used_list = window.btoa(window.encodeURIComponent(menus_used_list || 'del')) |
| | | |
| | | let interfaces = getFuncsAndInters(config) |
| | | roleParam.interfaces = interfaces |
| | | |
| | | let param = { |
| | | func: 'sPC_TrdMenu_AddUpt', |
| | | FstID: 'mk_app', |
| | |
| | | TypeCharOne: sessionStorage.getItem('kei_no'), |
| | | Typename: sessionStorage.getItem('typename'), |
| | | MenuName: config.MenuName || '', |
| | | PageParam: JSON.stringify({Template: 'webPage'}), |
| | | PageParam: JSON.stringify({Template: 'webPage', interfaces}), |
| | | open_edition: config.open_edition, |
| | | menus_rolelist: window.btoa(window.encodeURIComponent(JSON.stringify(roleParam))), |
| | | LText: '', |
| | |
| | | _param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') |
| | | _param.secretkey = Utils.encrypt('', _param.timestamp) |
| | | |
| | | Api.getSystemConfig(_param).then(res => { |
| | | Api.getCloudConfig(_param).then(res => { |
| | | if (res.status) { |
| | | NavBar.open_edition = res.open_edition || '' |
| | | window.GLOB.CacheIndependent.set(NavBar.uuid, fromJS(NavBar).toJS()) |
| | |
| | | let kparam = { |
| | | func: 's_kei_link_keyids_addupt', |
| | | BID: sessionStorage.getItem('appId'), |
| | | exec_type: 'y', |
| | | exec_type: 'x', |
| | | LText: '' |
| | | } |
| | | |
| | | kparam.LText = _appViewList.map(item => `select '${item.keys_id}','${item.keys_type}','${item.kei_no}','${item.appkey}','${item.bid}','${sessionStorage.getItem('CloudUserID')}','${item.remark}'`) |
| | | kparam.LText = kparam.LText.join(' union all ') |
| | | kparam.LText = Utils.formatOptions(kparam.LText) |
| | | kparam.LText = Utils.formatOptions(kparam.LText, 'x') |
| | | |
| | | kparam.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') |
| | | kparam.secretkey = Utils.encrypt('', kparam.timestamp) |
| | | |
| | | Api.getSystemConfig(kparam).then(result => { |
| | | Api.getCloudConfig(kparam).then(result => { |
| | | if (result.status) { |
| | | sessionStorage.setItem('appViewList', viewList) |
| | | } |
| | |
| | | }).then(res => { // 页面保存 |
| | | if (!res || !res.status) return res |
| | | |
| | | return Api.getSystemConfig(param) |
| | | return Api.getCloudConfig(param) |
| | | }).then(res => { |
| | | this.setState({ |
| | | menuloading: false |
| | | }) |
| | | |
| | | window.GLOB.saving = false |
| | | |
| | | if (!res) return |
| | | |
| | |
| | | message: '保存成功', |
| | | duration: 2 |
| | | }) |
| | | MKEmitter.emit('completeSave') |
| | | } else { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: res.message, |
| | | duration: 5 |
| | | Modal.warning({ |
| | | width: 400, |
| | | title: res.message, |
| | | okText: '知道了' |
| | | }) |
| | | } |
| | | MKEmitter.emit('completeSave') |
| | | }, this.netError) |
| | | }, 300 + (+sessionStorage.getItem('mkDelay'))) |
| | | } |
| | |
| | | menuloading: false |
| | | }) |
| | | |
| | | window.GLOB.saving = false |
| | | |
| | | if (!error) { |
| | | notification.warning({ |
| | | top: 92, |
| | |
| | | duration: 5 |
| | | }) |
| | | } |
| | | MKEmitter.emit('completeSave') |
| | | } |
| | | |
| | | getRoleFields = () => { |
| | | if (sessionStorage.getItem('sysRoles')) return |
| | | |
| | | Api.getSystemConfig({func: 'sPC_Get_Roles_sModular'}).then(res => { |
| | | Api.getCloudConfig({func: 'sPC_Get_Roles_sModular'}).then(res => { |
| | | if (res.status) { |
| | | let _permFuncField = [] |
| | | let _sysRoles = [] |
| | |
| | | insert = (item) => { |
| | | let config = fromJS(this.state.config).toJS() |
| | | |
| | | if (item.type === 'search') { |
| | | if (config.components.filter(card => card.type === 'topbar' && card.wrap.type !== 'navbar').length > 0) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '导航栏使用了搜索,不可添加搜索组件!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | if (config.components.filter(card => card.type === 'search').length > 0) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '搜索条件不可重复添加!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | } |
| | | |
| | | if (item.type === 'topbar') { |
| | | if (config.components.findIndex(m => m.type === 'topbar') > -1) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '导航栏不可重复添加!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | if (!config.style.paddingTop) { |
| | | config.style.paddingTop = '50px' |
| | | } |
| | | if (item.type === 'topbar' && !config.style.paddingTop) { |
| | | config.style.paddingTop = '50px' |
| | | } |
| | | |
| | | config.components.push(item) |
| | | |
| | | this.setState({config}) |
| | | window.GLOB.customMenu = config |
| | | |
| | | notification.success({ |
| | | top: 92, |
| | | message: '粘贴成功!', |
| | | duration: 2 |
| | | }) |
| | | } |
| | | |
| | | refreshView = () => { |
| | | const { oriConfig, config } = this.state |
| | | |
| | | if (!is(fromJS(oriConfig || {}), fromJS(config || {}))) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '配置信息未保存!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | |
| | | sessionStorage.removeItem('sysRoles') |
| | | sessionStorage.removeItem('permFuncField') |
| | | sessionStorage.removeItem('app_videos') |
| | | sessionStorage.removeItem('app_pictures') |
| | | |
| | | window.location.reload() |
| | | } |
| | | |
| | | setHomeView = () => { |
| | |
| | | let param = { |
| | | func: 's_kei_link_keyids_addupt', |
| | | BID: sessionStorage.getItem('appId'), |
| | | exec_type: 'y', |
| | | exec_type: 'x', |
| | | LText: '' |
| | | } |
| | | |
| | |
| | | |
| | | param.LText = appViewList.map(item => `select '${item.keys_id}','${item.keys_type}','${item.kei_no}','${item.appkey}','${item.bid}','${sessionStorage.getItem('CloudUserID')}','${item.remark}'`) |
| | | param.LText = param.LText.join(' union all ') |
| | | param.LText = Utils.formatOptions(param.LText) |
| | | param.LText = Utils.formatOptions(param.LText, 'x') |
| | | |
| | | param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') |
| | | param.secretkey = Utils.encrypt('', param.timestamp) |
| | |
| | | title: '确定设置本页面为首页吗?', |
| | | content: '', |
| | | onOk() { |
| | | Api.getSystemConfig(param).then(result => { |
| | | Api.getCloudConfig(param).then(result => { |
| | | if (!result.status) { |
| | | notification.warning({ |
| | | top: 92, |
| | |
| | | let param = { |
| | | func: 's_kei_link_keyids_addupt', |
| | | BID: sessionStorage.getItem('appId'), |
| | | exec_type: 'y', |
| | | exec_type: 'x', |
| | | LText: '' |
| | | } |
| | | |
| | |
| | | |
| | | param.LText = appViewList.map(item => `select '${item.keys_id}','${item.keys_type}','${item.kei_no}','${item.appkey}','${item.bid}','${sessionStorage.getItem('CloudUserID')}','${item.remark}'`) |
| | | param.LText = param.LText.join(' union all ') |
| | | param.LText = Utils.formatOptions(param.LText) |
| | | param.LText = Utils.formatOptions(param.LText, 'x') |
| | | |
| | | param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') |
| | | param.secretkey = Utils.encrypt('', param.timestamp) |
| | |
| | | title: '确定设置本页面为登录页吗?', |
| | | content: hasLogin ? '' : '当前页面尚未添加登录组件。', |
| | | onOk() { |
| | | Api.getSystemConfig(param).then(result => { |
| | | Api.getCloudConfig(param).then(result => { |
| | | if (!result.status) { |
| | | notification.warning({ |
| | | top: 92, |
| | |
| | | window.GLOB.customMenu = config |
| | | } |
| | | |
| | | checklog = () => { |
| | | const { oriConfig, config } = this.state |
| | | |
| | | return is(fromJS(oriConfig), fromJS(config)) |
| | | } |
| | | |
| | | updateLogConfig = (config) => { |
| | | this.setState({ |
| | | config: null |
| | | }, () => { |
| | | this.setState({ |
| | | config: config |
| | | }) |
| | | }) |
| | | |
| | | window.GLOB.customMenu = config |
| | | } |
| | | |
| | | |
| | | render () { |
| | | const { view, viewType, comloading, loading, settingshow, controlshow, activeKey, MenuId, config, menuloading, adapters, eyeopen, needUpdate } = this.state |
| | |
| | | <Collapse accordion activeKey={activeKey} bordered={false} onChange={(key) => this.setState({activeKey: key})}> |
| | | {/* 基本信息 */} |
| | | <Panel header="基本信息" forceRender className="basedata" key="basedata"> |
| | | {/* 菜单信息 */} |
| | | {config ? <MenuForm |
| | | config={config} |
| | | MenuId={MenuId} |
| | | adapters={adapters} |
| | | updateConfig={(con) => { |
| | | this.updateConfig(con) |
| | | if (con.direction !== config.direction) { |
| | | this.changeView(con.direction) |
| | | } |
| | | }} |
| | | /> : null} |
| | | {config ? <UrlFieldComponent config={config} updateConfig={this.updateConfig}/> : null} |
| | | {/* 表名添加 */} |
| | | {config ? <TableComponent config={config} updatetable={this.updateConfig}/> : null} |
| | | {config ? <Paragraph style={{padding: '15px 0px 0px 18px'}} copyable={{ text: MenuId }}>菜单ID</Paragraph> : null} |
| | | {config ? <Paragraph style={{padding: '10px 0px 0px 18px'}} copyable={{ text: `${window.GLOB.baseurl}mob/index.html#/index/${sessionStorage.getItem('kei_no')}/${sessionStorage.getItem('typename')}/${sessionStorage.getItem('lang')}/${MenuId}/@BID@` }}>菜单链接</Paragraph> : null} |
| | | {config ? <NormalCss config={config} updateConfig={this.updateConfig}/> : null} |
| | | {config ? <> |
| | | <MenuForm |
| | | config={config} |
| | | MenuId={MenuId} |
| | | adapters={adapters} |
| | | updateConfig={(con) => { |
| | | this.updateConfig(con) |
| | | if (con.direction !== config.direction) { |
| | | this.changeView(con.direction) |
| | | } |
| | | }} |
| | | /> |
| | | <UrlFieldComponent config={config} updateConfig={this.updateConfig}/> |
| | | {/* 表名添加 */} |
| | | <TableComponent config={config} updatetable={this.updateConfig}/> |
| | | <Paragraph style={{padding: '15px 0px 0px 18px'}} copyable={{ text: MenuId }}>菜单ID</Paragraph> |
| | | <Paragraph style={{padding: '10px 0px 0px 18px'}} copyable={{ text: `${window.GLOB.baseurl}mob/index.html#/index/${sessionStorage.getItem('kei_no')}/${sessionStorage.getItem('typename')}/${sessionStorage.getItem('lang')}/${MenuId}/@BID@` }}>菜单链接</Paragraph> |
| | | <NormalCss config={config} updateConfig={this.updateConfig}/> |
| | | </> : null} |
| | | </Panel> |
| | | {/* 组件添加 */} |
| | | <Panel header="组件" className="component" key="component"> |
| | |
| | | <Button type="primary" className={needUpdate ? 'update-tip' : ''} onClick={this.submitConfig} id="save-config" loading={menuloading}>保存</Button> |
| | | {config ? <Switch className="big" checkedChildren="启" unCheckedChildren="停" checked={config.enabled} onChange={this.onEnabledChange} /> : null} |
| | | <ArrowLeftOutlined title="后退" className="back-view" onClick={this.backView}/> |
| | | {config ? <Debug config={config}/> : null} |
| | | <Button className="mk-border-purple" onClick={() => this.setState({eyeopen: !eyeopen})}>{!eyeopen ? <EyeOutlined /> : <EyeInvisibleOutlined />} 组件名</Button> |
| | | <CreateView resetmenu={this.getAppMenus} /> |
| | | <PasteController insert={this.insert} /> |
| | |
| | | <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" onClick={this.refreshView}><RedoOutlined /> 强制刷新</Button> |
| | | {config ? <Versions MenuId={MenuId} Template="webPage" checklog={this.checklog} updateConfig={this.updateLogConfig}/> : null} |
| | | <Button type="default" onClick={this.closeView}>关闭</Button> |
| | | </div> |
| | | </div> |