king
2022-11-21 f6626b05f1275cc2f8ca77f773d4f6a6af1b0a89
src/views/tabledesign/index.jsx
@@ -6,11 +6,13 @@
import HTML5Backend from 'react-dnd-html5-backend'
import { ConfigProvider, notification, Modal, Collapse, Card, Switch, Button, Typography } from 'antd'
import { DoubleLeftOutlined, DoubleRightOutlined } from '@ant-design/icons'
import md5 from 'md5'
import Api from '@/api'
import Utils, { setGLOBFuncs } from '@/utils/utils.js'
import antdZhCN from 'antd/es/locale/zh_CN'
import MKEmitter from '@/utils/events.js'
import { getTables } from '@/utils/utils-custom.js'
import SourceElement from '@/templates/zshare/dragsource'
import asyncComponent from '@/utils/asyncComponent'
import Source from './source'
@@ -24,6 +26,8 @@
const _locale = antdZhCN
const MenuForm = asyncComponent(() => import('./menuform'))
const PopView = asyncComponent(() => import('./popview'))
const TableNodes = asyncComponent(() => import('@/menu/tablenodes'))
const TableSource = asyncComponent(() => import('./tablesource'))
const Header = asyncComponent(() => import('@/menu/header'))
const MenuShell = asyncComponent(() => import('@/menu/tableshell'))
@@ -31,9 +35,12 @@
const StyleController = asyncComponent(() => import('@/menu/stylecontroller'))
const ReplaceField = asyncComponent(() => import('@/menu/replaceField'))
const Versions = asyncComponent(() => import('@/menu/versions'))
const Transfer = asyncComponent(() => import('@/menu/transfer'))
const Unattended = asyncComponent(() => import('@/templates/zshare/unattended'))
const UrlFieldComponent = asyncComponent(() => import('@/menu/urlfieldcomponent'))
const ModalController = asyncComponent(() => import('@/menu/modalconfig/controller'))
const TableComponent = asyncComponent(() => import('@/templates/sharecomponent/tablecomponent'))
const PasteBaseTable = asyncComponent(() => import('@/menu/components/share/pastebasetable'))
sessionStorage.setItem('isEditState', 'true')
sessionStorage.setItem('appType', '')          // 应用类型
@@ -49,10 +56,10 @@
    menuloading: false,
    oriConfig: null,
    config: null,
    customComponents: [],
    comloading: false,
    settingshow: true,
    modalStatus: false       // 弹窗是否开启,判断ctrl+s是否可用
    settingshow: sessionStorage.getItem('settingshow') !== 'false',
    view: null,
    popConfig: null
  }
  UNSAFE_componentWillMount() {
@@ -88,20 +95,9 @@
  }
  componentDidMount () {
    MKEmitter.addListener('modalStatus', this.modalStatus)
    MKEmitter.addListener('changePopview', this.initPopview)
    MKEmitter.addListener('triggerMenuSave', this.triggerMenuSave)
    MKEmitter.addListener('updateCustomComponent', this.updateCustomComponent)
    setTimeout(() => {
      if (sessionStorage.getItem('app_custom_components')) {
        let list = sessionStorage.getItem('app_custom_components')
        list = JSON.parse(list)
        this.setCustomComponent(list)
      } else {
        this.updateCustomComponent()
      }
      this.getAppPictures()
      this.getPrintTemp()
      this.getRoleFields()
      setGLOBFuncs()
@@ -126,16 +122,32 @@
      let _shortcut = `${preKey}+${keyCode}`
      if (_shortcut === 'ctrl+83') {
        if (this.state.modalStatus) {
        let modals = document.querySelectorAll('.mk-pop-modal')
        let msg = null
        for (let i = 0; i < modals.length; i++) {
          if (msg) {
            break
          }
          let node = modals[i].querySelector('.mk-com-name')
          if (node) {
            msg = node.innerText
          }
        }
        if (msg) {
          notification.warning({
            top: 92,
            message: '请保存' + this.state.modalStatus,
            message: '请保存' + msg,
            duration: 5
          })
          return false
        }
        let node = document.getElementById('save-modal-config')
        if (!node) {
          node = document.getElementById('save-pop-config')
        }
        if (!node) {
          node = document.getElementById('save-config')
        }
@@ -155,17 +167,13 @@
    this.setState = () => {
      return
    }
    MKEmitter.removeListener('modalStatus', this.modalStatus)
    MKEmitter.removeListener('changePopview', this.initPopview)
    MKEmitter.removeListener('triggerMenuSave', this.triggerMenuSave)
    MKEmitter.removeListener('updateCustomComponent', this.updateCustomComponent)
  }
  modalStatus = (val) => {
    this.setState({modalStatus: val})
  }
  triggerMenuSave = () => {
    if (this.state.view === 'popview') return
    this.submitConfig()
  }
@@ -213,110 +221,102 @@
    }
  }
  getAppPictures = () => {
    if (sessionStorage.getItem('app_videos') || sessionStorage.getItem('app_pictures')) return
    Api.getSystemConfig({
      func: 's_url_db_adduptdel',
      PageIndex: 0,  // 0 代表全部
      PageSize: 0,   // 0 代表全部
      typecharone: 'image',
      type: 'search'
    }).then(res => {
      if (res.status) {
        sessionStorage.setItem('app_pictures', JSON.stringify(res.data || []))
      }
      Api.getSystemConfig({
        func: 's_url_db_adduptdel',
        PageIndex: 0,  // 0 代表全部
        PageSize: 0,   // 0 代表全部
        typecharone: 'video',
        type: 'search'
      }).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 || []))
        }
      })
    })
  }
  updateCustomComponent = () => {
    Api.getSystemConfig({
      func: 's_get_custom_components',
      typename: '',
      typecharone: ''
    }).then(res => {
      if (!res.status) {
        notification.warning({
          top: 92,
          message: res.message,
          duration: 5
        })
      } else if (res.cus_list) {
        sessionStorage.setItem('app_custom_components', JSON.stringify(res.cus_list))
        this.setCustomComponent(res.cus_list)
      }
    })
  }
  setCustomComponent = (cus_list) => {
    let coms = []
    cus_list.forEach(item => {
      let config = ''
      try {
        config = JSON.parse(window.decodeURIComponent(window.atob(item.long_param)))
      } catch (e) {
        console.warn('Parse Failure')
        config = ''
      }
      if (!config || !item.c_name) return
      window.GLOB.UserComponentMap.set(item.c_id, item.c_name)
      coms.push({
        uuid: item.c_id,
        type: 'menu',
        title: item.c_name,
        url: item.images,
        component: config.type,
        subtype: config.subtype,
        config
      })
    })
    this.setState({customComponents: coms})
  }
  initPopview = (card, btn) => {
    const { oriConfig, config } = this.state
    const { config } = this.state
    if (!is(fromJS(oriConfig), fromJS(config))) {
      notification.warning({
        top: 92,
        message: '配置已修改,请保存!',
        duration: 5
      })
    if (!this.checkBase()) {
      return
    }
    let _btn = fromJS(btn).toJS()
    _btn.MenuName = config.MenuName + '-' + card.name + '-' + btn.label
    _btn.ParentMenuID = config.uuid
    this.props.history.push('/popdesign/' + window.btoa(window.encodeURIComponent((JSON.stringify(_btn)))))
    if (_btn.config) {
      _btn.config.uuid = _btn.uuid
      _btn.config.MenuID = _btn.uuid
      _btn.config.ParentId = card.uuid
      _btn.config.MenuName = _btn.label
    } else {
      _btn.config = {
        uuid: _btn.uuid,
        MenuID: _btn.uuid,
        ParentId: card.uuid,
        enabled: false,
        MenuName: _btn.label,
        tables: config.tables || [],
        Template: 'BaseTable',
        components: [{
          uuid: Utils.getuuid(),
          type: 'table',
          width: 24,
          name: '主表',
          subtype: 'basetable',
          isNew: true
        }],
        viewType: 'popview',
        style: { backgroundColor: '#ffffff', backgroundImage: '', paddingTop: '16px', paddingBottom: '40px', paddingLeft: '16px', paddingRight: '16px' }
      }
    }
    this.setState({view: 'popview', popConfig: _btn})
  }
  submitPopConfig = (btnconfig) => {
    let config = fromJS(this.state.config).toJS()
    config.components.forEach(item => {
      if (item.type === 'tabs') {
        item.subtabs.forEach(tab => {
          if (btnconfig.ParentId !== tab.components[0].uuid) return
          tab.components[0].action.forEach(btn => {
            if (btn.OpenType === 'popview' && btn.uuid === btnconfig.uuid) {
              btn.config = btnconfig
            }
          })
          tab.components[0].cols.forEach(col => {
            if (col.type !== 'action') return
            col.elements.forEach(btn => {
              if (btn.OpenType === 'popview' && btn.uuid === btnconfig.uuid) {
                btn.config = btnconfig
              }
            })
          })
          tab.components[0].$tables = getTables(tab.components[0])
        })
      } else if (item.uuid === btnconfig.ParentId) {
        item.action.forEach(btn => {
          if (btn.OpenType === 'popview' && btn.uuid === btnconfig.uuid) {
            btn.config = btnconfig
          }
        })
        item.cols.forEach(col => {
          if (col.type !== 'action') return
          col.elements.forEach(btn => {
            if (btn.OpenType === 'popview' && btn.uuid === btnconfig.uuid) {
              btn.config = btnconfig
            }
          })
        })
        item.$tables = getTables(item)
      }
    })
    this.setState({ config }, () => {
      this.submitConfig()
    })
  }
  closePop = () => {
    const { config } = this.state
    sessionStorage.setItem('editMenuType', 'menu')
    window.GLOB.urlFields = config.urlFields || []
    window.GLOB.customMenu = config
    this.setState({view: '', popConfig: null})
  }
  closeView = () => {
@@ -383,15 +383,21 @@
              }
            ],
            viewType: 'menu',
            style: {
              backgroundColor: '#ffffff', backgroundImage: '',
              paddingTop: '16px', paddingBottom: '80px', paddingLeft: '16px', paddingRight: '16px'
            },
            style: { backgroundColor: '#ffffff', paddingTop: '16px', paddingBottom: '80px', paddingLeft: '16px', paddingRight: '16px'},
          }
        } else {
          config.uuid = MenuId
          config.MenuID = MenuId
          config.Template = 'BaseTable'
          config.components.forEach(item => {
            if (item.type === 'tabs') {
              item.subtabs.forEach(tab => {
                tab.components[0].name = tab.label
              })
            } else {
              item.name = '主表'
            }
          })
        }
        config.open_edition = result.open_edition || ''
@@ -412,48 +418,68 @@
    })
  }
  getMenuMessage = (delButtons) => {
  getMenuMessage = (tbs) => {
    const { config } = this.state
    let buttons = []
    let _sort = 1
    let traversal = (components) => {
      components.forEach(item => {
    config.components.forEach(item => {
        if (item.type === 'tabs') {
          item.subtabs.forEach(tab => {
            traversal(tab.components)
          })
        } else {
          item.action && item.action.forEach(btn => {
            if (btn.hidden === 'true') {
              delButtons.push(btn.uuid)
              return
            }
            buttons.push(`select '${btn.uuid}' as menuid, '${item.name + '-' + btn.label}' as menuname, '${_sort * 10}' as Sort`)
            _sort++
          })
          item.cols && item.cols.forEach(col => {
            if (col.type !== 'action') return
            col.elements.forEach(btn => {
              if (btn.hidden === 'true') {
                delButtons.push(btn.uuid)
                return
              }
              buttons.push(`select '${btn.uuid}' as menuid, '${item.name + '-' + btn.label}' as menuname, '${_sort * 10}' as Sort`)
              _sort++
            })
          })
        }
      })
          if (tab.components[0].$tables) {
            tbs.push(...tab.components[0].$tables)
    }
    traversal(config.components)
          if (tab.permission !== 'true' || tab.hide === 'true') return
          buttons.push(`select '${tab.components[0].uuid}' as menuid, '${tab.label}' as menuname, '${_sort * 10}' as Sort, '${config.uuid}' as parentid, 40 as Type`)
          _sort++
          let _s = 1
          tab.components[0].action.forEach(btn => {
            if (btn.hidden === 'true') return
            buttons.push(`select '${btn.uuid}' as menuid, '${btn.label}' as menuname, '${_s * 10}' as Sort, '${tab.components[0].uuid}' as parentid, 60 as Type`)
            _s++
          })
          tab.components[0].cols.forEach(col => {
            if (col.type !== 'action') return
            col.elements.forEach(btn => {
              if (btn.hidden === 'true') return
              buttons.push(`select '${btn.uuid}' as menuid, '${btn.label}' as menuname, '${_s * 10}' as Sort, '${tab.components[0].uuid}' as parentid, 60 as Type`)
              _s++
            })
          })
        })
      } else {
        if (item.$tables) {
          tbs.push(...item.$tables)
        }
        item.action.forEach(btn => {
          if (btn.hidden === 'true') return
          buttons.push(`select '${btn.uuid}' as menuid, '${btn.label}' as menuname, '${_sort * 10}' as Sort, '${config.uuid}' as parentid, 40 as Type`)
          _sort++
        })
        item.cols.forEach(col => {
          if (col.type !== 'action') return
          col.elements.forEach(btn => {
            if (btn.hidden === 'true') return
            buttons.push(`select '${btn.uuid}' as menuid,  '${btn.label}' as menuname, '${_sort * 10}' as Sort, '${config.uuid}' as parentid, 40 as Type`)
            _sort++
          })
        })
      }
    })
    return buttons
  }
  submitConfig = () => {
    let config = fromJS(this.state.config).toJS()
  checkBase = () => {
    const { config } = this.state
    if (!config.MenuName || !config.MenuNo || !config.fstMenuId || !config.parentId) {
      notification.warning({
@@ -461,6 +487,15 @@
        message: '请完善菜单基本信息!',
        duration: 5
      })
      return false
    }
    return true
  }
  submitConfig = () => {
    let config = fromJS(this.state.config).toJS()
    if (!this.checkBase()) {
      return
    }
@@ -471,6 +506,37 @@
    setTimeout(() => {
      if (config.enabled && this.verifyConfig()) {
        config.enabled = false
      }
      let tbs = []
      let btns = this.getMenuMessage(tbs)
      let arr = []
      tbs = tbs.filter(tb => {
        let _tb = tb.toLowerCase()
        if (arr.includes(_tb)) return false
        arr.push(_tb)
        return true
      })
      tbs.sort()
      if (tbs.length && sessionStorage.getItem('mk_tb_names')) {
        let names = sessionStorage.getItem('mk_tb_names')
        tbs = tbs.filter(tb => names.indexOf(',' + tb.toLowerCase() + ',') > -1)
      }
      tbs = tbs.map(tb => `'${tb}'`).join(';')
      let key = md5(config.uuid + tbs.toLowerCase())
      let url = ''
      if (config.tbkey === key) {
        key = ''
      } else {
        let urlparam = JSON.parse(window.decodeURIComponent(window.atob(this.props.match.params.param)))
        urlparam.type = 'admin'
        urlparam.MenuType = 'BaseTable'
        url = window.btoa(window.encodeURIComponent(JSON.stringify(urlparam)))
        config.tbkey = key
      }
      let param = {
@@ -484,10 +550,13 @@
        Template: 'BaseTable',
        MenuName: config.MenuName || '',
        PageParam: JSON.stringify({Template: 'BaseTable', OpenType: config.OpenType || 'newtab', hidden: config.hidden || 'false'}),
        LongParam: window.btoa(window.encodeURIComponent(JSON.stringify(config))),
        open_edition: config.open_edition,
        LText: '',
        LTexttb: ''
        LTexttb: '',
        debug_md5: key,
        debug_url: url,
        debug_list: window.btoa(tbs),
        LongParam: window.btoa(window.encodeURIComponent(JSON.stringify(config)))
      }
      param.LText = Utils.formatOptions(param.LText)
@@ -500,102 +569,52 @@
        ParentID: config.uuid,
        MenuNo: config.MenuNo,
        Template: 'BaseTable',
        PageParam: '',
        LongParam: '',
        LText: []
        button_proc_edition: 'Y'
      }
      let delButtons = []
      btnParam.LText = this.getMenuMessage(delButtons)
      btnParam.LText = btnParam.LText.join(' union all ')
      btnParam.LText = btns.join(' union all ')
      btnParam.LText = Utils.formatOptions(btnParam.LText)
      btnParam.timestamp = moment().format('YYYY-MM-DD HH:mm:ss')
      btnParam.secretkey = Utils.encrypt(btnParam.LText, btnParam.timestamp)
      new Promise(resolve => {
        resolve(true)
      }).then(res => { // 按钮删除
        if (delButtons.length === 0) {
          return {
            status: true
          }
        } else {
          let _param = {
            func: 'sPC_MainMenu_Del',
            MenuID: delButtons.join(',')
          }
          return Api.getSystemConfig(_param)
        }
      }).then(res => { // 页面保存
        if (!res) return
        if (res.status) {
          return Api.getSystemConfig(param)
        } else {
          notification.warning({
            top: 92,
            message: res.message,
            duration: 5
        Api.getSystemConfig(param).then(res => {
          resolve(res)
          })
          return false
        }
      }).then(res => { // 页面按钮关系保存
        if (!res) return
      }).then(res => {
        if (!res || !res.status) return res
        if (res.status) {
          let ori = this.state.oriConfig
          if (config.MenuName !== ori.MenuName || config.MenuNo !== ori.MenuNo || config.parentId !== ori.parentId) {
            localStorage.setItem('menuUpdate', new Date().getTime())
          }
        localStorage.setItem('menuUpdate', new Date().getTime() + ',' + config.uuid)
          config.open_edition = res.open_edition || ''
          this.setState({
            config,
            oriConfig: fromJS(config).toJS(),
          })
          if (btnParam.LText) {
            return Api.getSystemConfig(btnParam)
          } else {
            return {
              status: true
            }
          }
        } else {
          notification.warning({
            top: 92,
            message: res.message,
            duration: 5
          })
          return false
        }
      }).then(res => { // 按钮复制
        if (!res) return
        if (!res.status) {
          notification.warning({
            top: 92,
            message: res.message,
            duration: 5
          })
          return false
        }
      }).then(res => {
        if (res && res.status) {
          this.setState({
            menuloading: false
          })
        if (!res) return
        if (res.status) {
          notification.success({
            top: 92,
            message: '保存成功',
            duration: 2
          })
          MKEmitter.emit('completeSave')
        } else {
          this.setState({
            menuloading: false
          notification.warning({
            top: 92,
            message: res.message,
            duration: 5
          })
        }
        MKEmitter.emit('completeSave')
      })
    }, 300 + (+sessionStorage.getItem('mkDelay')))
  }
@@ -648,30 +667,36 @@
    const { config } = this.state
    let error = ''
    let check = (components) => {
      components.forEach(item => {
    config.components.forEach(item => {
        if (error) return
        
        if (item.type === 'tabs') {
          item.subtabs.forEach(tab => {
            check(tab.components)
          if (!tab.components[0].errors || tab.components[0].errors.length === 0 || error) return
          tab.components[0].errors.forEach(err => {
            if (err.level !== 0 || error) return
            error = `子表《${tab.label}》${err.detail}`
          })
          return
        } else if (item.type === 'group') {
          check(item.components)
          return
        } else if (!item.errors || item.errors.length === 0) {
          return
        }
        })
      } else {
        item.errors.forEach(err => {
          if (err.level !== 0 || error) return
          error = `组件《${item.name}》${err.detail}`
        })
          error = `主表 ${err.detail}`
      })
    }
    })
    check(config.components)
    if (!error && config.autoMatic && config.autoMatic.enable === 'true') {
      let pass = false
      config.components[0].action.forEach(item => {
        if (item.uuid === config.autoMatic.action && (['pop', 'prompt', 'exec'].includes(item.OpenType) || (item.OpenType === 'funcbutton' && item.funcType === 'print'))) {
          pass = true
        }
      })
      if (!pass) {
        error = '无人值守设置无效!'
      }
    }
    if (show && error) {
      notification.warning({
@@ -707,30 +732,37 @@
  insert = (item) => {
    let config = fromJS(this.state.config).toJS()
    config.components.push(item)
    let tabs = {
      uuid: Utils.getuuid(),
      type: 'tabs',
      subtype: 'tabletabs',
      width: 24,
      setting: {},
      style: {},
      subtabs: [
        { uuid: Utils.getuuid(), label: item.name || '子表1', icon: '', components: [item] },
      ]
    }
    config.components.push(tabs)
    this.setState({config})
    window.GLOB.customMenu = config
    notification.success({
      top: 92,
      message: '粘贴成功!',
      duration: 2
    })
  }
  changeSetting = () => {
    this.setState({settingshow: !this.state.settingshow})
    sessionStorage.setItem('settingshow', '' + !this.state.settingshow)
  }
  render () {
    const { activeKey, comloading, MenuId, config, settingshow, ParentId, menuloading } = this.state
    const { view, activeKey, comloading, MenuId, config, settingshow, ParentId, menuloading } = this.state
    return (
      <ConfigProvider locale={_locale}>
        <div className="pc-table-view">
          <Header />
          <DndProvider backend={HTML5Backend}>
        {view !== 'popview' ? <div className="pc-table-view">
            <div className="menu-body">
              <div className={'menu-setting ' + (!settingshow ? 'hidden' : '')}>
                <div className="draw">
@@ -778,8 +810,12 @@
                  <div style={{paddingLeft: '15px'}}> {config && config.MenuName} </div>
                } bordered={false} extra={
                  <div>
                    {config ? <Transfer config={config}/> : null}
                    {config ? <Unattended config={config} updateConfig={this.updateConfig}/> : null}
                    <Versions MenuId={MenuId} open_edition={config ? config.open_edition : ''}/>
                    <TableNodes config={config} />
                    <ReplaceField type="custom" config={config} updateConfig={this.resetConfig}/>
                    <PasteBaseTable type="page" insert={this.insert}/>
                    <Switch className="big" checkedChildren="启" unCheckedChildren="停" checked={config && config.enabled} onChange={this.onEnabledChange} />
                    <Button type="primary" id="save-config" onClick={this.submitConfig} loading={menuloading}>保存</Button>
                    <Button type="default" onClick={this.closeView}>关闭</Button>
@@ -789,10 +825,10 @@
                </Card>
              </div>
            </div>
          </div> : <PopView btn={this.state.popConfig} save={this.submitPopConfig} cancel={this.closePop}/>}
          </DndProvider>
          <StyleController />
          <ModalController />
        </div>
      </ConfigProvider>
    )
  }