king
2021-03-05 e36eb1999794bd71e76482b92a0b0b20f49d0032
src/menu/datasource/verifycard/index.jsx
@@ -1,7 +1,7 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { fromJS } from 'immutable'
import { Form, Tabs, Table, Popconfirm, Icon, notification, Modal, Typography, Spin } from 'antd'
import { Form, Tabs, Popconfirm, Icon, notification, Modal, Typography, Spin } from 'antd'
import moment from 'moment'
import Api from '@/api'
@@ -33,11 +33,8 @@
    loading: false,
    initsql: '',          // sql验证时变量声明及赋值
    usefulfields: '',
    defaultsql: '',         // 默认Sql
    systemScripts: [{
      name: '默认sql',
      value: ''
    }],
    defaultsql: '',       // 默认Sql
    systemScripts: [],
    colColumns: [
      {
        title: '名称',
@@ -51,6 +48,7 @@
        dataIndex: 'field',
        inputType: 'input',
        editable: true,
        unique: true,
        width: '28%'
      },
      {
@@ -93,15 +91,24 @@
      {
        title: 'SQL',
        dataIndex: 'sql',
        width: '65%',
        render: (text) => (
          <Paragraph copyable ellipsis={{ rows: 4, expandable: true }}>{text}</Paragraph>
        )
        width: '72%',
        render: (text) => {
          let title = text.match(/^\s*\/\*.+\*\//)
          title = title && title[0] ? title[0] : ''
          text = title ? text.replace(title, '') : text
          return (
            <div>
              {title ? <span style={{color: '#a50'}}>{title}</span> : null}
              <Paragraph copyable ellipsis={{ rows: 4, expandable: true }}>{text}</Paragraph>
            </div>
          )
        }
      },
      {
        title: '状态',
        dataIndex: 'status',
        width: '15%',
        width: '13%',
        render: (text, record) => record.status === 'false' ?
          (
            <div>
@@ -119,13 +126,11 @@
      {
        title: '操作',
        align: 'center',
        width: '20%',
        width: '15%',
        dataIndex: 'operation',
        render: (text, record) =>
          (<div>
          (<div style={{textAlign: 'center'}}>
            <span className="operation-btn" title={this.props.dict['model.edit']} onClick={() => this.handleEdit(record)} style={{color: '#1890ff'}}><Icon type="edit" /></span>
            <span className="operation-btn" onClick={() => this.handleUpDown(record, 'up')} style={{color: '#1890ff'}}><Icon type="arrow-up" /></span>
            <span className="operation-btn" onClick={() => this.handleUpDown(record, 'down')} style={{color: '#ff4d4f'}}><Icon type="arrow-down" /></span>
            <span className="operation-btn" title={this.props.dict['model.status.change']} onClick={() => this.handleStatus(record)} style={{color: '#8E44AD'}}><Icon type="swap" /></span>
            <Popconfirm
              overlayClassName="popover-confirm"
@@ -152,13 +157,25 @@
    let getcomponentmarks = (box, conf) => {
      if (!conf.parentId && box.Template === 'CustomPage') {
        box.components.forEach(item => {
          if (item.uuid !== conf.uuid && item.setting && item.setting.varMark) {
          if (item.type === 'group') {
            item.components.forEach(cell => {
              if (cell.uuid !== conf.uuid && cell.setting && cell.setting.varMark) {
                Marks.push(cell.setting.varMark.toLowerCase())
              }
            })
          } else if (item.uuid !== conf.uuid && item.setting && item.setting.varMark) {
            Marks.push(item.setting.varMark.toLowerCase())
          }
        })
      } else if (conf.parentId === box.parentId && conf.tabId === box.uuid) {
        box.components.forEach(item => {
          if (item.uuid !== conf.uuid && item.setting && item.setting.varMark) {
          if (item.type === 'group') {
            item.components.forEach(cell => {
              if (cell.uuid !== conf.uuid && cell.setting && cell.setting.varMark) {
                Marks.push(cell.setting.varMark.toLowerCase())
              }
            })
          } else if (item.uuid !== conf.uuid && item.setting && item.setting.varMark) {
            Marks.push(item.setting.varMark.toLowerCase())
          }
        })
@@ -177,10 +194,6 @@
    let _setting = fromJS(config.setting).toJS()
    if (_setting.varMark === undefined) {
      _setting.varMark = this.getMark(Marks)
    }
    this.setState({
      columns: fromJS(config.columns).toJS(),
      setting: _setting,
@@ -190,27 +203,6 @@
    })
    this.getsysScript()
  }
  getMark = (varMarks) => {
    let m = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z']
    let i = 0
    let n = 25
    let name = ''
    while (!name) {
      name = `${m[n]}${m[i]}_`
      if (varMarks.includes(name) && n > 0) {
        i++
        if (i >= 26) {
          n--
          i = 0
        }
        name = ''
      }
    }
    return name
  }
  getsysScript = () => {
@@ -237,14 +229,14 @@
        res.data.forEach(item => {
          let _item = {
            name: item.funcname,
            value: Utils.UnformatOptions(item.longparam)
            value: window.decodeURIComponent(window.atob(item.longparam))
          }
          _scripts.push(_item)
        })
        this.setState({
          systemScripts: [...this.state.systemScripts, ..._scripts]
          systemScripts: _scripts
        })
      } else {
        notification.warning({
@@ -259,6 +251,16 @@
  columnChange = (values) => {
    const { columns } = this.state
    let fields = columns.map(item => item.field.toLowerCase())
    if (fields.includes(values.field.toLowerCase())) {
      notification.warning({
        top: 92,
        message: '字段已存在!',
        duration: 5
      })
      return
    }
    values.uuid = Utils.getuuid()
    this.setState({ columns: [...columns, values] })
@@ -271,7 +273,7 @@
  handleEdit = (record) => {
    this.scriptsForm.edit(record)
    
    let node = document.getElementById('model-verify-card-box-tab').parentNode
    let node = document.getElementById('model-data-source-wrap').parentNode
    if (node && node.scrollTop) {
      let inter = Math.ceil(node.scrollTop / 10)
@@ -302,30 +304,6 @@
    this.setState({ scripts })
  }
  handleUpDown = (record, direction) => {
    let scripts = fromJS(this.state.scripts).toJS()
    let index = 0
    scripts = scripts.filter((item, i) => {
      if (item.uuid === record.uuid) {
        index = i
      }
      return item.uuid !== record.uuid
    })
    if ((index === 0 && direction === 'up') || (index === scripts.length && direction === 'down')) {
      return
    }
    if (direction === 'up') {
      scripts.splice(index - 1, 0, record)
    } else {
      scripts.splice(index + 1, 0, record)
    }
    this.setState({ scripts })
  }
  scriptsChange = (values) => {
    let scripts = fromJS(this.state.scripts).toJS()
@@ -344,6 +322,10 @@
    return new Promise((resolve, reject) => {
      this.sqlverify(resolve, reject, false, scripts)
    })
  }
  changeScripts = (scripts) => {
    this.setState({ scripts })
  }
  scriptSubmit = (values) => {
@@ -399,11 +381,13 @@
              activeKey: val,
              loading: false
            })
            this.getdefaultSql()
          }, () => {             // 验证失败
            this.setState({
              activeKey: val,
              loading: false
            })
            this.getdefaultSql()
          }, true)
        })
      }, () => {
@@ -414,11 +398,12 @@
        activeKey: val,
        loading: false
      })
      this.getdefaultSql()
    } else if (activeKey === 'scripts') {
      let _loading = false
      if (this.scriptsForm && this.scriptsForm.state.editItem) {
        _loading = true
      } else if (this.scriptsForm && this.scriptsForm.props.form.getFieldValue('sql') && this.scriptsForm.props.form.getFieldValue('sql') !== ' ') {
      } else if (this.scriptsForm && this.scriptsForm.props.form.getFieldValue('sql') && !/^\s+$/.test(this.scriptsForm.props.form.getFieldValue('sql'))) {
        _loading = true
      }
@@ -439,6 +424,84 @@
        loading: false
      })
    }
  }
  getdefaultSql = () => {
    const { columns, searches, setting } = this.state
    let defaultsql = ''
    let arr_field = columns.map(col => col.field).join(',')
    let _search = this.formatSearch(searches)
    _search = Utils.joinMainSearchkey(_search)
    _search = _search.replace(/@\$@/ig, '')
    _search = _search ? 'where ' + _search : ''
    if (setting.dataresource) {
      let _dataresource = setting.dataresource
      if (/\s/.test(_dataresource)) {
        _dataresource = '(' + _dataresource + ') tb'
      }
      defaultsql = `select top @pageSize@ ${arr_field} from (select ${arr_field} ,ROW_NUMBER() over(order by @orderBy@) as rows from ${_dataresource} ${_search}) tmptable where rows > (@pageSize@ * (@pageIndex@ - 1)) order by tmptable.rows`
    }
    this.setState({defaultsql})
  }
  /**
   * @description 获取全部搜索条件
   * @param {Array} searches 搜索条件数组
   */
  formatSearch (searches) {
    if (!searches || searches.length === 0) return []
    let newsearches = []
    searches.forEach(search => {
      if (!search.field) return
      let item = {
        key: search.field,
        match: search.match,
        type: search.type,
        label: search.label,
        value: search.initval,
        required: search.required === 'true'
      }
      if (item.type === 'group') {
        let copy = fromJS(item).toJS()
        copy.key = search.datefield
        item.value = search.initval && search.initval[0] ? search.initval[0] : '@$@'
        item.match = '='
        copy.type = 'daterange'
        copy.match = 'between'
        copy.value = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')]
        if (search.transfer === 'true') {
          newsearches.push(item)
        }
        newsearches.push(copy)
        return
      } else if (item.type === 'date') {
        item.value = moment().format('YYYY-MM-DD')
      } else if (item.type === 'datemonth') {
        item.value = moment().format('YYYY-MM')
      } else if (item.type === 'dateweek') {
        item.value = [moment().startOf('week').format('YYYY-MM-DD'), moment().endOf('week').format('YYYY-MM-DD')]
      } else if (item.type === 'daterange') {
        item.value = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')]
      } else if (item.type === 'multiselect') {
        item.value = ['@$@']
      } else {
        item.value = '@$@'
      }
      newsearches.push(item)
    })
    return newsearches
  }
  submitDataSource = () => {
@@ -479,7 +542,7 @@
        let _loading = false
        if (this.scriptsForm && this.scriptsForm.state.editItem) {
          _loading = true
        } else if (this.scriptsForm && this.scriptsForm.props.form.getFieldValue('sql') && this.scriptsForm.props.form.getFieldValue('sql') !== ' ') {
        } else if (this.scriptsForm && this.scriptsForm.props.form.getFieldValue('sql') && !/^\s+$/.test(this.scriptsForm.props.form.getFieldValue('sql'))) {
          _loading = true
        }
@@ -531,11 +594,12 @@
      let param = {
        func: 's_debug_sql',
        exec_type: 'y',
        LText: result.sql
      }
      param.LText = Utils.formatOptions(param.LText)
      param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss')
      param.secretkey = Utils.encrypt(param.LText, param.timestamp)
      param.secretkey = Utils.encrypt('', param.timestamp)
      
      Api.getLocalConfig(param).then(result => {
        if (result.status) {
@@ -569,12 +633,12 @@
  render() {
    const { menu, config } = this.props
    const { columns, setting, scripts, colColumns, scriptsColumns, activeKey, loading, searches } = this.state
    const { columns, setting, scripts, colColumns, scriptsColumns, activeKey, loading, searches, defaultsql } = this.state
    return (
      <div id="model-verify-card-box-tab">
      <div id="model-data-source-wrap">
        {loading && <Spin size="large" />}
        <Tabs activeKey={activeKey} className="verify-card-box" onChange={this.changeTab}>
        <Tabs activeKey={activeKey} className="data-source-card-box" onChange={this.changeTab}>
          <TabPane tab="数据源" key="setting">
            <SettingForm
              menu={menu}
@@ -591,10 +655,9 @@
            <FieldsComponent
              config={{...config, columns}}
              type="fields"
              tableFields={menu.tableFields}
              updatefield={this.updatefields}
            />
            <EditTable data={columns} columns={colColumns} onChange={(columns) => this.setState({columns})}/>
            <EditTable actions={['edit', 'move', 'copy', 'del']} type="datasourcefield" data={columns} columns={colColumns} onChange={(columns) => this.setState({columns})}/>
          </TabPane>
          <TabPane tab={
            <span>
@@ -605,6 +668,7 @@
            <CustomScriptsForm
              setting={setting}
              searches={searches}
              defaultsql={defaultsql}
              initsql={this.state.initsql}
              dict={this.props.dict}
              customScripts={scripts}
@@ -613,14 +677,7 @@
              scriptSubmit={this.scriptSubmit}
              wrappedComponentRef={(inst) => this.scriptsForm = inst}
            />
            <Table
              bordered
              rowKey="uuid"
              className="custom-table"
              dataSource={scripts}
              columns={scriptsColumns}
              pagination={false}
            />
            <EditTable actions={['move']} data={scripts} columns={scriptsColumns} onChange={this.changeScripts}/>
          </TabPane>
        </Tabs>
      </div>