2023-06-15

king

2023-06-15 a29d9d644a2a30e9ef4afcc6d728c20c218dc359

 src/templates/subtableconfig/index.jsx

@@ -1,15 +1,13 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import {connect} from 'react-redux'
import { is, fromJS } from 'immutable'
import { DndProvider } from 'react-dnd'
import HTML5Backend from 'react-dnd-html5-backend'
import { Button, Card, Modal, Collapse, notification, Spin, Icon, Switch, Tooltip, Col } from 'antd'
import moment from 'moment'
import { Button, Card, Modal, Collapse, notification, Spin, Switch, Tooltip, Col } from 'antd'
import { QuestionCircleOutlined, RedoOutlined } from '@ant-design/icons'
// import moment from 'moment'

import Api from '@/api'
import zhCN from '@/locales/zh-CN/model.js'
import enUS from '@/locales/en-US/model.js'
import Utils from '@/utils/utils.js'
import { updateSubTable } from '@/utils/utils-update.js'

@@ -26,6 +24,8 @@
const { Panel } = Collapse
const { confirm } = Modal

const Versions = asyncComponent(() => import('@/menu/versions'))
// const ReplaceField = asyncComponent(() => import('@/menu/replaceField'))
const EditComponent = asyncComponent(() => import('@/templates/zshare/editcomponent'))
const SettingComponent = asyncComponent(() => import('@/templates/sharecomponent/settingcomponent'))
const TableComponent = asyncComponent(() => import('@/templates/sharecomponent/tablecomponent'))
@@ -47,10 +47,8 @@
  }

  state = {
    dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,        // 字典
    config: null,            // 页面配置
    visible: false,          // 搜索条件、按钮、显示列，模态框显示控制
    tableFields: [],         // 已选表字段集
    menuloading: false,      // 菜单保存中
    menucloseloading: false, // 菜单关闭时，选择保存
    loading: false,          // 加载中，页面spin
@@ -60,10 +58,9 @@
    delActions: [],          // 删除按钮列表
    copyActions: [],         // 复制按钮组
    tabviews: [],            // 所有标签页
    thawButtons: [],         // 已选择要解冻的按钮
    activeKey: '0',          // 默认展开基本信息
    chartview: null,         // 当前视图
    openEdition: ''          // 编辑版本标记，防止多人操作
    openEdition: '',         // 编辑版本标记，防止多人操作
  }

  /**
@@ -115,7 +112,7 @@

    this.setState({
      openEdition: editSubTab ? (editSubTab.open_edition || '') : (editTab.open_edition || ''),
      chartview: _config.charts[0].uuid,
      chartview: _config.charts ? _config.charts[0].uuid : '',
      originActions: _oriActions,
      config: _config,
      activeKey: _activeKey || '0',
@@ -130,6 +127,54 @@
   */
  componentDidMount () {
    this.reloadTab(false)
    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 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: '请保存' + msg,
            duration: 5
          })
          return false
        }

        let node = document.getElementById('save-config')
        if (node && node.click) {
          node.click()
        }
        return false
      }
    }
  }

  /**
@@ -189,6 +234,7 @@
    this.setState = () => {
      return
    }
    document.onkeydown = () => {}
  }

  // 页面返回
@@ -237,7 +283,7 @@
   * @description 标签页保存
   */
  submitConfig = () => {
    const { delActions, thawButtons, openEdition } = this.state
    const { delActions, openEdition } = this.state
    let _config = fromJS(this.state.config).toJS()
    let copyreg = /\d{4}-\d{2}-\d{2}\s\d{2}:\d{2}:\d{2}$/ig

@@ -245,7 +291,7 @@
    if (!_config.tabName || !_config.tabNo) {
      notification.warning({
        top: 92,
        message: this.state.dict['model.menu.basemsg'],
        message: '请完善菜单基本信息！',
        duration: 5
      })
      this.setState({activeKey: '0'})
@@ -273,6 +319,10 @@
      }
    }

    if (_config.setting.doubleClick && _config.action.findIndex((item) => item.uuid === _config.setting.doubleClick) === -1) {
      _config.setting.doubleClick = ''
    }

    // 未设置数据源或主键时，启用状态为false
    let result = this.verifyconfig(_config)
  
@@ -290,11 +340,11 @@
      })
    }

    let _LongParam = ''

    // 保存时删除配置类型，system 、user
    delete _config.type
    delete _config.isAdd

    let _LongParam = ''

    try {
      _LongParam = window.btoa(window.encodeURIComponent(JSON.stringify(_config)))
@@ -312,40 +362,41 @@
      return
    }

    let btnParam = {
      func: 'sPC_Button_AddUpt',
      Type: 40,
      ParentID: _config.uuid,
      MenuNo: _config.tabNo,
      Template: 'SubTable',
      PageParam: '',
      LongParam: '',
      LText: []
    }
    // let btnParam = {
    //   func: 'sPC_Button_AddUpt',
    //   Type: 40,
    //   ParentID: _config.uuid,
    //   MenuNo: _config.tabNo,
    //   Template: 'SubTable',
    //   PageParam: '',
    //   LongParam: '',
    //   LText: []
    // }

    let btntabs = []
    // let btntabs = []

    _config.action.forEach((item, index) => {
      if (item.OpenType === 'popview') {
        btntabs.push(`select '${item.uuid}' as MenuID ,'${item.linkTab}' as Tabid,'${item.label}' as TabName ,'${(index + 1) * 10}' as Sort`)
      }
      btnParam.LText.push(`select '${item.uuid}' as menuid, '${item.label}' as menuname, '${(index + 1) * 10}' as Sort`)
    })
    // _config.action.forEach((item, index) => {
    //   if (item.hidden === 'true') return
    //   if (item.OpenType === 'popview') {
    //     btntabs.push(`select '${item.uuid}' as MenuID ,'${item.linkTab}' as Tabid,'${item.label}' as TabName ,'${(index + 1) * 10}' as Sort`)
    //   }
    //   btnParam.LText.push(`select '${item.uuid}' as menuid, '${item.label}' as menuname, '${(index + 1) * 10}' as Sort`)
    // })

    btnParam.LText = btnParam.LText.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)
    // btnParam.LText = btnParam.LText.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)

    let tabParam = { // 添加标签按钮tab页
      func: 'sPC_sMenusTab_AddUpt',
      MenuID: _config.uuid,
      LText: btntabs.join(' union all ')
    }
    // let tabParam = { // 添加标签按钮tab页
    //   func: 'sPC_sMenusTab_AddUpt',
    //   MenuID: _config.uuid,
    //   LText: btntabs.join(' union all ')
    // }

    tabParam.LText = Utils.formatOptions(tabParam.LText)
    tabParam.timestamp = moment().format('YYYY-MM-DD HH:mm:ss')
    tabParam.secretkey = Utils.encrypt(tabParam.LText, tabParam.timestamp)
    // tabParam.LText = Utils.formatOptions(tabParam.LText)
    // tabParam.timestamp = moment().format('YYYY-MM-DD HH:mm:ss')
    // tabParam.secretkey = Utils.encrypt(tabParam.LText, tabParam.timestamp)

    let param = {
      func: 'sPC_Tab_AddUpt',
@@ -424,26 +475,7 @@
    }).then(resp => {
      if (resp === false) return

      if (thawButtons.length > 0) {
        let defers = thawButtons.map(item => {
          return new Promise((resolve) => {
            Api.getSystemConfig({
              func: 'sPC_MainMenu_ReDel',
              MenuID: item
            }).then(res => {
              if (res.status) {
                resolve('')
              } else {
                resolve(res.message)
              }
            })
          })
        })

        return Promise.all(defers)
      } else {
        return true
      }
      return true
    }).then(res => {
      if (res === true || res === false) return res

@@ -456,9 +488,6 @@
        })
        return false
      } else {
        this.setState({
          thawButtons: []
        })
        return true
      }
    }).then(resp => {
@@ -475,8 +504,16 @@
              menuloading: false,
              menucloseloading: false
            })
            this.submitAction(btnParam, tabParam)
            notification.success({
              top: 92,
              message: '保存成功',
              duration: 2
            })
            if (this.state.closeVisible) {
              this.handleViewBack()
            }
          })
          this.submitAction()
        } else {
          this.setState({
            menuloading: false,
@@ -495,131 +532,56 @@
  /**
   * @description 保存或修改菜单按钮
   */
  submitAction = (btnParam, tabParam) => {
  submitAction = () => {
    const { config } = this.state

    new Promise(resolve => {
      let deffers = []
    let oriActions = []
    this.state.originActions.forEach(item => {
      let curBtn = config.action.filter(cell => item.curuuid === cell.uuid)[0] // 查看初始化按钮是否存在
      if (!curBtn) return
      if (curBtn.OpenType !== item.prebtn.OpenType) return
      if (curBtn.OpenType === 'funcbutton' && curBtn.execMode !== 'pop') return

      if (tabParam.LText) {
        let defer = new Promise(resolve => {
          Api.getSystemConfig(tabParam).then(result => {
            resolve(result)
          })
        })
        deffers.push(defer)
      }

      if (btnParam.LText) {
        let defer = new Promise(resolve => {
          Api.getSystemConfig(btnParam).then(result => {
            if (result.status) {
              this.setState({ // 保存成功后清空复制列表
                copyActions: []
              })
            }
            resolve(result)
          })
        })
        deffers.push(defer)
      }

      if (deffers.length === 0) {
        resolve(true)
      } else {
        Promise.all(deffers).then(result => {
          let error = false
          result.forEach(res => {
            if (!res.status) {
              error = res
            }
          })

          if (error) {
            notification.warning({
              top: 92,
              message: error.message,
              duration: 5
            })
            resolve(false)
          } else {
            resolve(true)
          }
        })
      }
    }).then(response => {
      if (response === false) return response

      let oriActions = []
      this.state.originActions.forEach(item => {
        let curBtn = config.action.filter(cell => item.curuuid === cell.uuid)[0] // 查看初始化按钮是否存在
        if (!curBtn) return
        if (curBtn.OpenType !== item.prebtn.OpenType) return
        if (curBtn.OpenType === 'funcbutton' && curBtn.execMode !== 'pop') return

        oriActions.push({
          prebtn: item.prebtn,
          curBtn: curBtn
        })
      oriActions.push({
        prebtn: item.prebtn,
        curBtn: curBtn
      })
    })

      if (oriActions.length === 0) return 'true'
    if (oriActions.length === 0) return

      oriActions.forEach(action => {
        Api.getSystemConfig({
          func: 'sPC_Get_LongParam',
          MenuID: action.prebtn ? action.prebtn.uuid : ''
        }).then(result => {
          if (result.status && result.LongParam) {
            let _LongParam = ''
  
            if (result.LongParam) {
              try {
                _LongParam = JSON.parse(window.decodeURIComponent(window.atob(result.LongParam)))
              } catch (e) {
                console.warn('Parse Failure')
                _LongParam = ''
              }
            }
    oriActions.forEach(action => {
      Api.getSystemConfig({
        func: 'sPC_Get_LongParam',
        MenuID: action.prebtn ? action.prebtn.uuid : ''
      }).then(result => {
        if (result.status && result.LongParam) {
          let _LongParam = ''

            if (_LongParam) {
              let param = {
                func: 'sPC_ButtonParam_AddUpt',
                ParentID: config.uuid,
                MenuID: action.curBtn.uuid,
                MenuNo: config.tabNo,
                Template: _LongParam.type,
                MenuName: action.curBtn.label,
                PageParam: JSON.stringify({Template: _LongParam.type}),
                LongParam: result.LongParam
              }
              Api.getSystemConfig(param).then(() => {})
          if (result.LongParam) {
            try {
              _LongParam = JSON.parse(window.decodeURIComponent(window.atob(result.LongParam)))
            } catch (e) {
              console.warn('Parse Failure')
              _LongParam = ''
            }
          }
        })
      })
      return 'true'
    }).then(response => {
      if (response === 'true') {
        notification.success({
          top: 92,
          message: '保存成功',
          duration: 2
        })
        if (this.state.closeVisible) {
          this.handleViewBack()
        } else {
          this.setState({
            menuloading: false,
            menucloseloading: false
          })

          if (_LongParam) {
            let param = {
              func: 'sPC_ButtonParam_AddUpt',
              ParentID: config.uuid,
              MenuID: action.curBtn.uuid,
              MenuNo: config.tabNo,
              Template: _LongParam.type,
              MenuName: action.curBtn.label,
              PageParam: JSON.stringify({Template: _LongParam.type}),
              LongParam: result.LongParam
            }
            Api.getSystemConfig(param).then(() => {})
          }
        }
      } else {
        this.setState({
          menuloading: false,
          menucloseloading: false
        })
      }
      })
    })
  }

@@ -822,27 +784,7 @@
      }
    })

    config.action && config.action.forEach((btn) => {
      if (['prompt', 'exec', 'pop'].includes(btn.OpenType) && btn.Ot === 'required' && btn.verify && btn.verify.scripts && btn.verify.scripts.length > 0) {
        let hascheck = false
        btn.verify.scripts.forEach(item => {
          if (item.status === 'false') return
    
          if (/\$check@|@check\$/ig.test(item.sql)) {
            hascheck = true
          }
        })
        if (hascheck) {
          notification.warning({
            top: 92,
            message: `可选择多行的按钮《${btn.label}》中 $check@ 或 @check$ 将不会生效！`,
            duration: 5
          })
        }
      }
    })

    if ((config.setting.interType === 'system' || config.setting.requestMode === 'system') && config.setting.default === 'false' && config.setting.scripts && config.setting.scripts.filter(item => item.status !== 'false').length === 0) {
    if (config.setting.interType === 'system' && config.setting.default === 'false' && config.setting.scripts && config.setting.scripts.filter(item => item.status !== 'false').length === 0) {
      return '数据源中不执行默认sql，且未添加自定义脚本，不可启用！'
    } else if (config.setting.interType === 'custom' && config.setting.procMode !== 'inner' && config.setting.preScripts && config.setting.preScripts.filter(item => item.status !== 'false').length === 0) {
      return '数据源未设置前置脚本，不可启用！'
@@ -862,17 +804,12 @@
  }

  /**
   * @description 编辑功能完成更新，包括解冻按钮、粘贴、替换等
   * @description 编辑功能完成更新，包括解冻按钮等
   */
  updateConfig = (res) => {
    if (res.type === 'thaw') {
      this.setState({
        thawButtons: res.thawButtons,
        config: res.config
      })
    } else if (res.type === 'paste') {
      this.setState({config: res.config})
    }
    this.setState({
      config: res.config
    })
  }

  /**
@@ -916,30 +853,66 @@
      chartview: _chartview
    })
  }

  
  /**
   * @description 更新常用表信息，快捷添加后更新配置信息
   */
  updatetable = (config, fields) => {
    const { tableFields } = this.state
  refreshConfig = () => {
    const { config } = this.props
    
    let param = {
      func: 'sPC_Get_LongParam',
      MenuID: config.uuid
    }

    this.setState({
      config: config,
      tableFields: fields ? fields : tableFields
    })
  }
    Api.getSystemConfig(param).then(res => {
      if (res.status) {
        let _config = ''
        if (res.LongParam) {
          try {
            _config = JSON.parse(window.decodeURIComponent(window.atob(res.LongParam)))
          } catch (e) {
            console.warn('Parse Failure')
            _config = ''
          }
        }

  /**
   * @description 批量添加，更新配置信息
   */
  updatefield = (config) => {
    this.setState({
      config: config
        if (!_config) {
          notification.warning({
            top: 92,
            message: '未获取到配置信息！',
            duration: 5
          })
          return
        }

        // 版本兼容
        _config = updateSubTable(_config)

        this.setState({
          config: null
        }, () => {
          this.setState({
            chartview: _config.charts ? _config.charts[0].uuid : '',
            config: _config,
            openEdition: res.open_edition || '',
            activeKey: '0',
            originActions: [],
            originConfig: fromJS(_config).toJS()
          })
        })
      } else {
        notification.warning({
          top: 92,
          message: res.message,
          duration: 5
        })
      }
    })
  }

  render () {
    const { activeKey, config, chartview } = this.state
    const { activeKey, config, chartview, openEdition } = this.state

    if (!config) return null

    const confActions = config.action.filter(_action => !_action.origin && (['pop', 'popview'].includes(_action.OpenType) || (_action.OpenType === 'funcbutton' && _action.execMode === 'pop')))

@@ -953,7 +926,6 @@
              <Panel forceRender={true} header={'标签基本信息'} key="0" id="subtable-basedata">
                {/* 菜单信息 */}
                <MenuForm
                  dict={this.state.dict}
                  config={config}
                  updatemenu={this.updateconfig}
                />
@@ -961,25 +933,20 @@
                <TableComponent
                  config={config}
                  containerId="subtable-basedata"
                  updatetable={this.updatetable}
                  updatetable={this.updateconfig}
                />
              </Panel>
              {/* 搜索条件添加 */}
              <Panel header={this.state.dict['header.menu.search']} key="1">
              <Panel header="搜索" key="1">
                <div className="search-element">
                  {Source.searchItems.map((item, index) => {
                    return (<SourceElement key={index} content={item}/>)
                  })}
                </div>
                <FieldsComponent
                  config={config}
                  type="search"
                  tableFields={this.state.tableFields}
                  updatefield={this.updatefield}
                />
                <FieldsComponent config={config} type="search" />
              </Panel>
              {/* 按钮添加 */}
              <Panel header={this.state.dict['header.menu.action']} key="2">
              <Panel header="按钮" key="2">
                <div className="search-element">
                  {Source.actionItems.map((item, index) => {
                    return (<SourceElement key={index} content={item}/>)
@@ -989,9 +956,9 @@
                  {confActions.length > 0 ?
                    <p className="config-btn-title">
                      <Tooltip placement="topLeft" title="点击按钮，可完成或查看按钮配置信息。">
                        <Icon type="question-circle" />
                        <QuestionCircleOutlined className="mk-form-tip" />
                      </Tooltip>
                      {this.state.dict['header.menu.action.configurable']}
                      按钮配置
                    </p> : null
                  }
                </div>
@@ -1009,18 +976,13 @@
                })}
              </Panel>
              {/* 添加显示列 */}
              <Panel header={this.state.dict['header.menu.column']} key="3">
              <Panel header="显示列" key="3">
                <div className="search-element">
                  {Source.columnItems.map((item, index) => {
                    return (<SourceElement key={index} content={item}/>)
                  })}
                </div>
                <FieldsComponent
                  config={config}
                  type="columns"
                  tableFields={this.state.tableFields}
                  updatefield={this.updatefield}
                />
                <FieldsComponent config={config} type="columns" />
              </Panel>
            </Collapse>
          </div>
@@ -1028,14 +990,16 @@
            <Card title={
              <div>
                标签（子表）页面配置 
                <Icon type="redo" style={{marginLeft: '10px'}} title="刷新标签列表" onClick={() => this.reloadTab(true)} />
                <RedoOutlined style={{marginLeft: '10px'}} title="刷新标签列表" onClick={() => this.reloadTab(true)} />
              </div>
            } bordered={false} extra={
              <div>
                <EditComponent dict={this.state.dict} options={['search', 'action', 'columns']} config={config} MenuID={config.uuid} thawButtons={this.state.thawButtons} refresh={this.updateConfig}/>
                <Versions MenuId={config.uuid} open_edition={openEdition} updateConfig={this.refreshConfig}/>
                {/* <ReplaceField type="table" config={config} updateConfig={this.updateconfig}/> */}
                <EditComponent type="table" options={['search', 'form', 'action', 'columns']} config={config} refresh={this.updateConfig}/>
                <Switch className="big" checkedChildren="启" unCheckedChildren="停" checked={config.enabled} onChange={this.onEnabledChange} />
                <Button type="primary" onClick={this.submitConfig} loading={this.state.menuloading}>{this.state.dict['model.save']}</Button>
                <Button onClick={this.cancelConfig}>{this.state.dict['model.back']}</Button>
                <Button type="primary" id="save-config" onClick={this.submitConfig} loading={this.state.menuloading}>保存</Button>
                <Button onClick={this.cancelConfig}>返回</Button>
              </div>
            } style={{ width: '100%' }}>
              <SettingComponent
@@ -1048,12 +1012,12 @@
                config={config}
                updatesearch={this.updatesearch}
              />
              <div className="chart-view" style={{position: 'relative'}}>
                {/* 视图组 权限 会员等级20+ */}
                {this.props.memberLevel >= 20 ? <ChartGroupComponent
              {config.charts ? <div className="chart-view" style={{position: 'relative'}}>
                {/* 视图组 已弃用 */}
                <ChartGroupComponent
                  config={config}
                  updatechartgroup={this.updatechartgroup}
                /> : null}
                />
                {config.charts.map(item => {
                  if (!config.expand && chartview !== item.uuid) return ''

@@ -1098,7 +1062,21 @@
                    )
                  }
                })}
              </div>
              </div> : <>
                <ActionComponent
                  type="subtable"
                  menu={{MenuID: config.uuid, MenuName: config.tabName, MenuNo: config.tabNo, fstMenuList: this.props.menu.fstMenuList}}
                  config={config}
                  tabs={this.state.tabviews}
                  setSubConfig={this.setSubConfig}
                  updateaction={this.updateaction}
                />
                <ColumnComponent
                  config={config}
                  menu={this.props.menu}
                  updatecolumn={this.updateconfig}
                />
              </>}
            </Card>
          </div>
        </DndProvider>
@@ -1109,13 +1087,13 @@
          visible={this.state.closeVisible}
          onCancel={() => { this.setState({closeVisible: false}) }}
          footer={[
            <Button key="save" className="mk-btn mk-green" loading={this.state.menucloseloading} onClick={this.submitConfig}>{this.state.dict['model.save']}</Button>,
            <Button key="confirm" className="mk-btn mk-yellow" onClick={this.handleViewBack}>{this.state.dict['model.notsave']}</Button>,
            <Button key="cancel" onClick={() => { this.setState({closeVisible: false}) }}>{this.state.dict['model.cancel']}</Button>
            <Button key="save" className="mk-btn mk-green" loading={this.state.menucloseloading} onClick={this.submitConfig}>保存</Button>,
            <Button key="confirm" className="mk-btn mk-yellow" onClick={this.handleViewBack}>不保存</Button>,
            <Button key="cancel" onClick={() => { this.setState({closeVisible: false}) }}>取消</Button>
          ]}
          destroyOnClose
        >
          {this.state.dict['header.menu.config.placeholder']}
          配置已修改，是否保存配置信息？
        </Modal>
        {this.state.loading && <Spin size="large" />}
      </div>
@@ -1123,14 +1101,4 @@
  }
}

const mapStateToProps = (state) => {
  return {
    memberLevel: state.memberLevel
  }
}

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

export default connect(mapStateToProps, mapDispatchToProps)(SubTableConfig)
export default SubTableConfig