2023-08-04

king

2023-08-04 465be8b618c1fb139d56ed779ff6f4dbc8d89b89

 src/views/basedesign/index.jsx

@@ -1,42 +1,28 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
// import { is, fromJS } from 'immutable'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import { notification, Spin } from 'antd'
// import moment from 'moment'
import { notification, Spin, ConfigProvider } from 'antd'
import enUS from 'antd/es/locale/en_US'
import zhCN from 'antd/es/locale/zh_CN'

import Api from '@/api'
import MKEmitter from '@/utils/events.js'
import zhCN from '@/locales/zh-CN/model.js'
import enUS from '@/locales/en-US/model.js'
// import Utils from '@/utils/utils.js'
import MenuUtils from '@/utils/utils-custom.js'
import asyncComponent from '@/utils/asyncComponent'
import asyncLoadComponent from '@/utils/asyncLoadComponent'

import '@/assets/css/design.scss'
import './index.scss'

const _locale = sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS
const Header = asyncComponent(() => import('@/menu/header'))
const ComTableConfig = asyncLoadComponent(() => import('@/templates/comtableconfig'))
const TreePageConfig = asyncLoadComponent(() => import('@/templates/treepageconfig'))
const CalendarPageConfig = asyncLoadComponent(() => import('@/templates/calendarconfig'))
const FormTabConfig = asyncLoadComponent(() => import('@/templates/formtabconfig'))
const ModalConfig = asyncLoadComponent(() => import('@/templates/modalconfig'))
const SubTable = asyncLoadComponent(() => import('@/templates/subtableconfig'))
const UpdateFormTab = asyncLoadComponent(() => import('./updateFormTab'))

document.body.className = ''

class BaseDesign extends Component {
  static propTpyes = {
    menulist: PropTypes.any,     // 三级菜单列表
    exitEdit: PropTypes.func,    // 退出编辑状态
    supMenu: PropTypes.object,   // 对应的上级菜单
    supMenuList: PropTypes.array // 上级菜单列表，用于三级菜单切换上级菜单
  }

  state = {
    dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
    loading: false,         // 编辑菜单或使用已使用模板时，获取配置信息
    btnParam: null,         // 编辑按钮的配置信息
    menulist: null,         // 编辑中的菜单
    tabview: '',            // 选择模板窗口（template）、基础表格配置（CommonTable）、表单（Modal）、子表（SubTable）
    editMenu: null,         // 编辑菜单
    editAction: null,       // 编辑按钮
@@ -53,6 +39,20 @@
  }

  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')) {
      this.props.history.replace('/login')
      return
    }

    window.GLOB.developing = true

    try {
      let param = JSON.parse(window.decodeURIComponent(window.atob(this.props.match.params.param)))

@@ -92,20 +92,58 @@
      loading: true
    })

    Api.getSystemConfig(param).then(res => {
    Api.getCloudConfig(param).then(res => {
      if (res.status) {
        let _LongParam = ''
        editMenu.open_edition = res.open_edition || ''
        editMenu.LongParam = ''

        if (res.LongParam) {
          let _LongParam = ''
          try {
            _LongParam = JSON.parse(window.decodeURIComponent(window.atob(res.LongParam)))
          } catch (e) {
            console.warn('Parse Failure')
            _LongParam = ''
          }
          editMenu.LongParam = _LongParam
        } else if (editMenu.PageParam.copyMenuId) {
          let _param = {
            func: 'sPC_Get_LongParam',
            MenuID: editMenu.PageParam.copyMenuId
          }
      
          Api.getCloudConfig(_param).then(res => {
            if (res.status) {
              if (res.LongParam) {
                let _LongParam = ''
                try {
                  _LongParam = JSON.parse(window.decodeURIComponent(window.atob(res.LongParam)))
                  _LongParam.type = 'user'
                } catch (e) {
                  console.warn('Parse Failure')
                  _LongParam = ''
                }
                editMenu.LongParam = _LongParam
              }
              
              this.setState({
                editMenu: editMenu,
                loading: false,
                tabview: editMenu.type
              })
            } else {
              this.setState({
                loading: false
              })
              notification.warning({
                top: 92,
                message: res.message,
                duration: 5
              })
            }
          })
          return
        }

        editMenu.LongParam = _LongParam
        editMenu.open_edition = res.open_edition || ''
        
        this.setState({
          editMenu: editMenu,
@@ -140,140 +178,72 @@
    }, () => {
      if (param) {
        this.setState(param)
      }
    })
  }

  copyMenu = (param, MenuId) => {
    Api.getSystemConfig({
      func: 'sPC_Get_LongParam',
      MenuID: MenuId
    }).then(result => {
      if (result.status) {
        let config = null
  
        try {
          config = result.LongParam ? JSON.parse(window.decodeURIComponent(window.atob(result.LongParam))) : null
        } catch (e) {
          console.warn('Parse Failure')
          config = null
        }
  
        if (config) {
          config.uuid = param.MenuID
          config.MenuID = param.MenuID
          config.parentId = param.ParentID
          config.MenuName = param.MenuName
          config.MenuNo = param.MenuNo
          config.easyCode = ''
          config.components = MenuUtils.resetConfig(config.components)
          config.enabled = false

          param.LongParam = window.btoa(window.encodeURIComponent(JSON.stringify(config)))
        }

        Api.getSystemConfig(param).then(response => {
          if (response.status) {
            this.setState({
              handleMVisible: false,
              sysMenu: null
            })
  
            MKEmitter.emit('mkUpdateMenuList')
          } else {
            notification.warning({
              top: 92,
              message: response.message,
              duration: 5
            })
          }
        })
      } else {
        notification.warning({
          top: 92,
          message: result.message,
          duration: 5
        })
        window.close()
      }
    })
  }

  render () {
    const { loading } = this.state
    const { loading, editMenu, subConfig, btnTab } = this.state

    return (
      <div className="mk-base-design-wrap">
        <Header/>
        {this.state.tabview === 'TreePage' ?
          <TreePageConfig
            menu={this.state.editMenu}
            reloadmenu={() => {localStorage.setItem('menuUpdate', new Date().getTime())}}
            handleView={this.handleView}
          /> : null
        }
        {this.state.tabview === 'CalendarPage' ?
          <CalendarPageConfig
            menu={this.state.editMenu}
            reloadmenu={() => {localStorage.setItem('menuUpdate', new Date().getTime())}}
            handleView={this.handleView}
          /> : null
        }
        {this.state.tabview === 'CommonTable' ?
          <ComTableConfig
            menu={this.state.editMenu}
            reloadmenu={() => {localStorage.setItem('menuUpdate', new Date().getTime())}}
            handleView={this.handleView}
          /> : null
        }
        {this.state.tabview === 'Modal' ?
          <ModalConfig
            menu={this.state.editMenu}
            editTab={this.state.editTab}
            tabConfig={this.state.tabConfig}
            editSubTab={this.state.editSubTab}
            subTabConfig={this.state.subTabConfig}
            btnTab={this.state.btnTab}
            btnTabConfig={this.state.btnTabConfig}
            editAction={this.state.editAction}
            subConfig={this.state.subConfig}
            handleView={this.handleView}
          /> : null
        }
        {this.state.tabview === 'SubTable' ?
          <SubTable
            menu={this.state.editMenu}
            editTab={this.state.editTab}
            editSubTab={this.state.editSubTab}
            tabConfig={this.state.tabConfig}
            btnTab={this.state.btnTab}
            btnTabConfig={this.state.btnTabConfig}
            config={this.state.subConfig}
            handleView={this.handleView}
          /> : null
        }
        {this.state.tabview === 'FormTab' ?
          <FormTabConfig
            menu={this.state.editMenu}
            btnTab={this.state.btnTab}
            config={this.state.subConfig}
            handleView={this.handleView}
          /> : null
        }
        {loading ? <Spin className="loading-view" /> : null}
        <ConfigProvider locale={_locale}>
          <Header/>
          {this.state.tabview === 'CommonTable' ?
            <ComTableConfig
              menu={editMenu}
              reloadmenu={() => {localStorage.setItem('menuUpdate', new Date().getTime())}}
              handleView={this.handleView}
            /> : null
          }
          {this.state.tabview === 'SubTable' ?
            <SubTable
              menu={editMenu}
              editTab={this.state.editTab}
              editSubTab={this.state.editSubTab}
              tabConfig={this.state.tabConfig}
              btnTab={btnTab}
              btnTabConfig={this.state.btnTabConfig}
              config={subConfig}
              handleView={this.handleView}
            /> : null
          }
          {this.state.tabview === 'Modal' ?
            <ModalConfig
              menu={editMenu}
              editTab={this.state.editTab}
              tabConfig={this.state.tabConfig}
              editSubTab={this.state.editSubTab}
              subTabConfig={this.state.subTabConfig}
              btnTab={btnTab}
              btnTabConfig={this.state.btnTabConfig}
              editAction={this.state.editAction}
              subConfig={subConfig}
              handleView={this.handleView}
            /> : null
          }
          {this.state.tabview === 'TreePage' ?
            <TreePageConfig
              menu={editMenu}
              reloadmenu={() => {localStorage.setItem('menuUpdate', new Date().getTime())}}
              handleView={this.handleView}
            /> : null
          }
          {this.state.tabview === 'FormTab' ?
            <UpdateFormTab
              menu={editMenu}
              btnTab={btnTab}
              config={subConfig}
              handleView={this.handleView}
            /> : null
          }
          {loading ? <Spin className="loading-view" size="large"/> : null}
        </ConfigProvider>
      </div>
    )
  }
}

const mapStateToProps = (state) => {
  return {
    mainMenu: state.mainMenu,
    menuTree: state.menuTree
  }
}

const mapDispatchToProps = () => {
  return {}
}

export default withRouter(connect(mapStateToProps, mapDispatchToProps)(BaseDesign))
export default BaseDesign