2021-11-30

king

2021-11-30 81c3fd3ac5017591d987d9c9fe42042fae5c7d7d

 src/views/mobdesign/index.jsx

@@ -5,7 +5,7 @@
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 } from 'antd'
import { ConfigProvider, notification, Modal, Collapse, Switch, Button, message, Spin, Icon, Typography } from 'antd'

import Api from '@/api'
import Utils, { setGLOBFuncs } from '@/utils/utils.js'
@@ -21,12 +21,14 @@

const { Panel } = Collapse
const { confirm } = Modal
const { Paragraph } = Typography

const Header = asyncComponent(() => import('@/mob/header'))
const MenuForm = asyncComponent(() => import('./menuform'))
const MobShell = asyncComponent(() => import('@/mob/mobshell'))
const CreateView = asyncComponent(() => import('@/pc/createview'))
const Transfer = asyncComponent(() => import('@/pc/transfer'))
const Versions = asyncComponent(() => import('@/menu/versions'))
const SourceWrap = asyncComponent(() => import('@/mob/modulesource'))
const BgController = asyncComponent(() => import('@/pc/bgcontroller'))
const ReplaceField = asyncComponent(() => import('@/menu/replaceField'))
@@ -47,6 +49,7 @@
sessionStorage.setItem('appType', 'mob')       // 应用类型
document.body.className = ''
window.GLOB.UserComponentMap = new Map() // 缓存用户自定义组件
window.GLOB.TabsMap = new Map()          // 缓存用户操作的标签页
window.GLOB.CacheIndependent = new Map()
window.GLOB.urlFields = []               // url变量
window.GLOB.customMenu = null            // 保存菜单信息
@@ -82,12 +85,13 @@
        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')

        this.setState({
          localedict: sessionStorage.getItem('lang') !== 'en-US' ? antdZhCN : antdEnUS,
          dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS
        })
        this.getAppMessage()
        this.getAppMessage(param.MenuID)
      } else if (param.type === 'view') {
        window.GLOB.winWidth = 420
        window.GLOB.winHeight = 738
@@ -107,7 +111,7 @@
          this.getMenuParam(param)
        })
      }
    } catch {
    } catch (e) {
      notification.warning({
        top: 92,
        message: '菜单信息解析错误！',
@@ -217,7 +221,7 @@
    this.props.history.push('/mobdesign/' + param)
  }

  getAppMessage = () => {
  getAppMessage = (MenuID) => {
    Api.getSystemConfig({
      func: 's_get_keyids',
      bid: sessionStorage.getItem('appId')
@@ -231,9 +235,9 @@
        return
      }

      let homeId = ''
      let homeId = MenuID || ''
      let appViewList = []
      if (res.data && res.data.length > 0) {
      if (!homeId && res.data && res.data.length > 0) {
        appViewList = res.data
        appViewList.forEach(item => {
          if (item.keys_type === 'index') {
@@ -310,6 +314,17 @@
      }).then(res => {
        if (res.status) {
          sessionStorage.setItem('app_videos', JSON.stringify(res.data || []))
        }
      })
      Api.getSystemConfig({
        func: 's_url_db_adduptdel',
        PageIndex: 0,  // 0 代表全部
        PageSize: 0,   // 0 代表全部
        typecharone: 'color',
        type: 'search'
      }).then(res => {
        if (res.status) {
          sessionStorage.setItem('app_colors', JSON.stringify(res.data || []))
        }
      })
    })
@@ -566,6 +581,7 @@
        }
      } else {
        config.components = MenuUtils.resetConfig(config.components)
        config.enabled = false
        message.success('复制成功，保存后生效。')
      }
      
@@ -680,7 +696,7 @@
          children: []
        }

        if (item.type === 'topbar' || item.type === 'login') {
        if (item.type === 'topbar' || item.type === 'login' || item.type === 'navbar') {
          return null
        } else if (item.type === 'tabs') {
          let tabs = []
@@ -718,16 +734,8 @@
                title: cell.label,
              })
            })
            card.backElements && card.backElements.forEach(cell => {
              if (cell.eleType !== 'button') return
              this.checkBtn(cell)
              m.children.push({
                key: cell.uuid,
                title: cell.label,
              })
            })
          })
        } else if (item.type === 'carousel') {
        } else if (item.type === 'carousel' || item.type === 'timeline') {
          item.subcards.forEach(card => {
            card.elements && card.elements.forEach(cell => {
              if (cell.eleType !== 'button') return
@@ -818,21 +826,85 @@
    }
  }

  filterConfig = (components) => {
    return components.map(item => {
      if (item.type === 'tabs') {
        item.subtabs.forEach(tab => {
          tab.components = this.filterConfig(tab.components)
        })
      } else if (item.type === 'group') {
        item.components = this.filterConfig(item.components)
      } else if (item.type === 'table' && item.subtype === 'normaltable') {
        item.search = item.search.filter(a => !a.origin)
        item.action = item.action.filter(a => !a.origin)
        item.cols = item.cols.filter(a => !a.origin)
      }
      return item
  getMiniStyle = (config) => {
    config.miniStyle = this.transferStyle(config.style)

    let traversal = (components) => {
      return components.map(item => {
        if (item.style) {
          item.miniStyle = this.transferStyle(item.style)
        }
        if (item.headerStyle) {
          item.miniHeaderStyle = this.transferStyle(item.headerStyle)
        }

        if (item.action && item.action.length > 0) {
          item.action = item.action.map(btn => {
            btn.miniStyle = this.transferStyle(btn.style)
            return btn
          })
        }

        if (item.type === 'tabs') {
          item.subtabs.forEach(tab => {
            tab.components = traversal(tab.components)
          })
        } else if (item.type === 'group') {
          item.components = traversal(item.components)
        } else if (['card', 'carousel', 'timeline'].includes(item.type) || (item.type === 'table' && item.subtype === 'tablecard')) {
          item.subcards.forEach(card => {
            card.miniStyle = this.transferStyle(card.style)
            card.elements = card.elements.map(cell => {
              cell.miniStyle = this.transferStyle(cell.style)
              return cell
            })
          })
        } else if (item.type === 'balcony') {
          item.elements && item.elements.forEach(cell => {
            cell.miniStyle = this.transferStyle(cell.style)
          })
        } else if (item.type === 'menubar') {
          item.subMenus = item.subMenus.map(menu => {
            menu.miniStyle = this.transferStyle(menu.style)
            return menu
          })
        } else if (item.type === 'table' && item.subtype === 'normaltable') {
          let getCols = (cols) => {
            return cols.map(col => {
              if (col.type === 'colspan') {
                col.subcols = getCols(col.subcols || [])
              } else if (col.type === 'custom' || col.type === 'action') {
                col.elements = col.elements.map(cell => {
                  cell.miniStyle = this.transferStyle(cell.style)
                  return cell
                })
              }
  
              return col
            })
          }
          
          item.cols = getCols(item.cols)
        }

        return item
      })
    }

    config.components = traversal(config.components)

    return config
  }

  transferStyle = (style = {}) => {
    let _style = ''
    Object.keys(style).forEach(key => {
      if (['hShadow', 'vShadow', 'shadowBlur', 'shadowColor'].includes(key)) return
      if (!style[key]) return
      _style += `${key.replace(/[A-Z]/g, m => '-' + m.toLowerCase())}:${style[key]};`
    })

    return _style
  }

  submitConfig = () => {
@@ -856,14 +928,23 @@
    })

    setTimeout(() => {
      config.components = this.filterConfig(config.components)

      if (config.enabled && this.verifyConfig()) {
        config.enabled = false
      }

      let roleParam = {type: 'view', key: config.uuid, title: config.MenuName, children: []}
      roleParam.children = this.getMenuMessage()

      if (config.components.findIndex(item => item.type === 'login') > -1) {
        roleParam.login = true
        config.loginview = true
      } else {
        config.loginview = false
      }

      if (sessionStorage.getItem('adapter') === 'true') {
        config = this.getMiniStyle(config)
      }

      let param = {
        func: 'sPC_TrdMenu_AddUpt',
@@ -943,7 +1024,7 @@
                Typename: sessionStorage.getItem('typename'),
                MenuName: item.name || '',
                PageParam: JSON.stringify({Template: item.type}),
                open_edition: item.open_edition || '',
                open_edition: _item.open_edition || '',
                menus_rolelist: window.btoa(window.encodeURIComponent(JSON.stringify(roles))),
                LText: '',
                LTexttb: ''
@@ -1135,6 +1216,7 @@

        if (['propcard', 'brafteditor', 'sandbox', 'tabbar', 'stepform', 'tabform'].includes(item.subtype) && item.wrap.datatype === 'static') return
        if (['balcony'].includes(item.type) && item.wrap.datatype === 'static') return
        if (['menubar'].includes(item.type) && item.wrap.datatype !== 'dynamic') return

        if (item.setting) {
          if (item.setting.interType === 'system' && item.setting.execute !== 'false' && !item.setting.dataresource) {
@@ -1143,6 +1225,8 @@
            error = `组件《${item.name}》未设置数据源！`
          } else if (!item.setting.primaryKey) {
            error = `组件《${item.name}》未设置主键！`
          } else if (!item.setting.supModule && !['navbar', 'balcony', 'menubar'].includes(item.type)) {
            error = `组件《${item.name}》未设置上级组件！`
          }
        }
        if (item.type === 'bar' || item.type === 'line' || item.type === 'pie') {
@@ -1182,10 +1266,25 @@
  insert = (item) => {
    let config = fromJS(this.state.config).toJS()

    if (item.type === 'topbar' && config.components.findIndex(m => m.type === 'topbar') > -1) {
      notification.warning({
        top: 92,
        message: '导航栏不可重复添加！',
        duration: 5
      })
      return
    }

    config.components.push(item)

    this.setState({config})
    window.GLOB.customMenu = config

    notification.success({
      top: 92,
      message: '粘贴成功！',
      duration: 2
    })
  }

  refreshView = () => {
@@ -1267,6 +1366,67 @@
    })
  }

  setLoginView = () => {
    const { oriConfig, config } = this.state

    if (!oriConfig || !is(fromJS(oriConfig), fromJS(config))) {
      notification.warning({
        top: 92,
        message: '配置信息未保存！',
        duration: 5
      })
      return
    }

    let param = {
      func: 's_kei_link_keyids_addupt',
      BID: sessionStorage.getItem('appId'),
      exec_type: 'y',
      LText: ''
    }

    let appViewList = sessionStorage.getItem('appViewList')
    appViewList = appViewList ? JSON.parse(appViewList) : []
    appViewList = appViewList.filter(item => item.keys_type !== 'login')

    appViewList.unshift({
      appkey: window.GLOB.appkey || '',
      bid: sessionStorage.getItem('appId') || '',
      kei_no: sessionStorage.getItem('kei_no') || '',
      keys_id: config.MenuID,
      keys_type: 'login',
      remark: config.MenuName
    })

    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.timestamp = moment().format('YYYY-MM-DD HH:mm:ss')
    param.secretkey = Utils.encrypt('', param.timestamp)

    let hasLogin = config.components.findIndex(item => item.type === 'login') > -1

    confirm({
      title: '确定设置本页面为登录页吗？',
      content: hasLogin ? '' : '当前页面尚未添加登录组件。',
      onOk() {
        Api.getSystemConfig(param).then(result => {
          if (!result.status) {
            notification.warning({
              top: 92,
              message: result.message,
              duration: 5
            })
          } else {
            sessionStorage.setItem('appViewList', JSON.stringify(appViewList))
          }
        })
      },
      onCancel() {}
    })
  }

  changeView = (val) => {
    if (val !== 'vertical') {
      window.GLOB.winWidth = 992
@@ -1330,6 +1490,7 @@
                    {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}
                  </Panel>
                  {/* 组件添加 */}
                  <Panel header={dict['mob.component']} key="component">
@@ -1349,19 +1510,23 @@
                {controlshow ? <Icon onClick={() => {this.setState({controlshow: false})}} type="double-right" /> : null}
                {!controlshow ? <Icon onClick={() => {this.setState({controlshow: true})}} type="double-left" /> : null}
              </div>
              <Button type="primary" onClick={this.submitConfig} loading={menuloading}>{dict['mob.save']}</Button>
              <Switch className="big" checkedChildren={dict['mob.enable']} unCheckedChildren={dict['mob.disable']} checked={config && config.enabled} onChange={this.onEnabledChange} />
              <CreateView resetmenu={this.getAppMenus} />
              <PasteController type="menu" Tab={null} 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-danger" icon="redo" onClick={this.refreshView}>强制刷新</Button>
              <ReplaceField type="custom" config={config} updateConfig={this.resetConfig}/>
              <Transfer MenuID={MenuId} />
              <Button type="default" onClick={this.closeView}>关闭</Button>
              <div className="wrap">
                <Button type="primary" onClick={this.submitConfig} loading={menuloading}>{dict['mob.save']}</Button>
                <Switch className="big" checkedChildren={dict['mob.enable']} unCheckedChildren={dict['mob.disable']} checked={config && config.enabled} onChange={this.onEnabledChange} />
                <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>
                <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 type="default" onClick={this.closeView}>关闭</Button>
              </div>
            </div>
            <div className={'menu-body menu-view' + (menuloading ? 'saving' : '')}>
              {config && !comloading ? <div className="mob-shell" style={{width: window.GLOB.shellWidth, height: window.GLOB.shellHeight}}>