2020-07-15

king

2020-07-15 b8cdbe3fbd57bbd513509a7d76c529096b1a7153

 src/mob/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 } from 'antd'
import { Form, Tabs, Table, Popconfirm, Icon, notification, Modal, Typography, Spin } from 'antd'
import moment from 'moment'

import Api from '@/api'
@@ -10,10 +10,10 @@
import ColForm from './columnform'
import CustomScriptsForm from './customscript'
import SettingForm from './settingform'
import SettingUtils from './utils'
import './index.scss'

const { TabPane } = Tabs
const { confirm } = Modal
const { Paragraph } = Typography

class VerifyCard extends Component {
@@ -27,6 +27,7 @@
  state = {
    columns: [],
    activeKey: 'setting',
    loading: false,
    initsql: '',          // sql验证时变量声明及赋值
    usefulfields: '',
    defaultsql: '',         // 默认Sql
@@ -82,13 +83,13 @@
        render: (text, record) => record.status === 'false' ?
          (
            <div>
              {this.props.dict['header.form.status.forbidden']}
              {this.props.dict['mob.status.forbidden']}
              <Icon style={{marginLeft: '5px'}} type="stop" theme="twoTone" twoToneColor="#ff4d4f" />
            </div>
          ) :
          (
            <div>
              {this.props.dict['header.form.status.open']}
              {this.props.dict['mob.status.open']}
              <Icon style={{marginLeft: '5px'}} type="check-circle" theme="twoTone" twoToneColor="#52c41a" />
            </div>
          )
@@ -101,13 +102,13 @@
        render: (text, record) =>
          (<div>
            <span className="operation-btn" title={this.props.dict['model.edit']} onClick={() => this.handleEdit(record, 'scripts')} style={{color: '#1890ff'}}><Icon type="edit" /></span>
            <span className="operation-btn" title={this.props.dict['header.form.up']} onClick={() => this.handleUpDown(record, 'up')} style={{color: '#1890ff'}}><Icon type="arrow-up" /></span>
            <span className="operation-btn" title={this.props.dict['header.form.down']} onClick={() => this.handleUpDown(record, 'down')} style={{color: '#ff4d4f'}}><Icon type="arrow-down" /></span>
            <span className="operation-btn" title={this.props.dict['header.form.status.change']} onClick={() => this.handleStatus(record)} style={{color: '#8E44AD'}}><Icon type="swap" /></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['mob.status.change']} onClick={() => this.handleStatus(record)} style={{color: '#8E44AD'}}><Icon type="swap" /></span>
            <Popconfirm
              title={this.props.dict['header.form.query.delete']}
              okText={this.props.dict['model.confirm']}
              cancelText={this.props.dict['header.cancel']}
              title={this.props.dict['mob.query.delete']}
              okText={this.props.dict['mob.confirm']}
              cancelText={this.props.dict['mob.cancel']}
              onConfirm={() => this.deleteScript(record)
            }>
              <span className="operation-btn" style={{color: '#ff4d4f'}}><Icon type="delete" /></span>
@@ -127,13 +128,7 @@
    })
  }

  componentDidMount() {
    
  }

  getsysScript = () => {
    const { defaultsql } = this.state

    let _scriptSql = `Select distinct func+Remark as funcname,longparam, s.Sort from  s_custom_script s inner join (select OpenID from sapp where ID=@Appkey@) p on s.openid = case when s.appkey='' then s.openid else p.OpenID end order by s.Sort`

    _scriptSql = Utils.formatOptions(_scriptSql)
@@ -153,13 +148,6 @@
    Api.getSystemConfig(_sParam).then(res => {
      if (res.status) {
        let _scripts = []

        if (defaultsql) {
          _scripts.push({
            name: '默认sql',
            value: defaultsql
          })
        }

        res.data.forEach(item => {
          let _item = {
@@ -201,26 +189,6 @@

    this.setState({ columns })
  }

  scriptsChange = (values) => {
    let scripts = fromJS(this.state.scripts).toJS()

    if (values.uuid) {
      scripts = scripts.map(item => {
        if (item.uuid === values.uuid) {
          return values
        } else {
          return item
        }
      })
    } else {
      values.uuid = Utils.getuuid()
      scripts.push(values)
    }

    this.setState({ scripts })
  }


  deleteColumn = (record) => {
    this.setState({ columns: this.state.columns.filter(item => item.uuid !== record.uuid) })
@@ -292,63 +260,192 @@
    this.setState({ scripts })
  }

  handleConfirm = () => {
    const { card } = this.props
    const { setting, scripts, columns } = this.state
    
    // 表单提交时检查输入值是否正确
  scriptsChange = (values) => {
    let scripts = fromJS(this.state.scripts).toJS()

    if (values.uuid) {
      scripts = scripts.map(item => {
        if (item.uuid === values.uuid) {
          return values
        } else {
          return item
        }
      })
    } else {
      scripts.push(values)
    }

    return new Promise((resolve, reject) => {
      if (setting.default === 'false' && scripts.length === 0) {
        notification.warning({
          top: 92,
          message: '不执行默认sql时，必须设置自定义脚本！',
          duration: 5
        })
        return
      }

      let _loading = false
      if (this.scriptsForm && this.scriptsForm.state.editItem) {
        _loading = true
      }

      if (this.scriptsForm && this.scriptsForm.props.form.getFieldValue('sql')) {
        _loading = true
      }

      if (_loading) {
        confirm({
          content: `存在未保存项，确定提交吗？`,
          okText: this.props.dict['mob.confirm'],
          cancelText: this.props.dict['mob.cancel'],
          onOk() {
            resolve({
              uuid: card.uuid,
              setting: setting,
              columns: columns,
              scripts: scripts
            })
          },
          onCancel() {}
        })
      } else {
        resolve({
          uuid: card.uuid,
          setting: setting,
          columns: columns,
          scripts: scripts
        })
      }
      this.sqlverify(resolve, reject, false, scripts)
    })
  }

  scriptSubmit = (values) => {
    let scripts = fromJS(this.state.scripts).toJS()

    if (values.uuid) {
      scripts = scripts.map(item => {
        if (item.uuid === values.uuid) {
          return values
        } else {
          return item
        }
      })
    } else {
      values.uuid = Utils.getuuid()
      scripts.push(values)
    }

    this.setState({ scripts })
  }

  changeTab = (val) => {
    const { activeKey } = this.state

    this.setState({loading: true})
    if (activeKey === 'setting') {
      this.settingForm.handleConfirm().then(res => {
        console.log(res)
        this.setState({
          setting: res
        }, () => {
          this.sqlverify(() => { // 验证成功
            this.setState({
              activeKey: val,
              loading: false
            })
          }, () => {             // 验证失败
            this.setState({
              loading: false
            })
          }, true)
        })
      }, () => {
        this.setState({loading: false})
      })
    } else if (activeKey === 'columns') {
      this.sqlverify(() => { // 验证成功
        this.setState({
          activeKey: val,
          loading: false
        })
      }, () => {             // 验证失败
        this.setState({
          loading: false
        })
      }, true)
    } 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')) {
        _loading = true
      }

      if (_loading) {
        notification.warning({
          top: 92,
          message: '存在未保存脚本，请点击确定保存，或点击取消放弃修改！',
          duration: 5
        })
        this.setState({
          loading: false
        })
        return
      }

      this.sqlverify(() => { // 验证成功
        this.setState({
          activeKey: val,
          loading: false
        })
      }, () => {             // 验证失败
        this.setState({
          loading: false
        })
      }, true)
    }
  }

  submitDataSource = () => {
    const { card } = this.props
    const { activeKey, setting, columns, scripts } = this.state

    return new Promise((resolve, reject) => {
      if (activeKey === 'setting') {
        this.settingForm.handleConfirm().then(res => {
          this.setState({
            setting: res
          }, () => {
            this.sqlverify(() => { resolve({uuid: card.uuid, setting: res, columns, scripts }) }, reject, false)
          })
        }, () => {
          reject()
        })
      } else if (activeKey === 'columns') {
        this.sqlverify(() => { resolve({uuid: card.uuid, setting, columns, scripts }) }, reject, false)
      } 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')) {
          _loading = true
        }

        if (_loading) {
          notification.warning({
            top: 92,
            message: '存在未保存脚本，请点击确定保存，或点击取消放弃修改！',
            duration: 5
          })
          reject()
          return
        }

        this.sqlverify(() => { resolve({uuid: card.uuid, setting, columns, scripts }) }, reject, false)
      }
    })
  }

  sqlverify = (resolve, reject, change = false, testScripts) => {
    const { searches } = this.props
    const { columns, setting, scripts } = this.state

    let _scripts = scripts.filter(item => item.status !== 'false')

    if (testScripts) {
      _scripts = testScripts.filter(item => item.status !== 'false')
    }
    if (!change && setting.interType === 'inner' && !setting.innerFunc && setting.execute === 'false' && _scripts.length === 0) {
      notification.warning({
        top: 92,
        message: '不执行默认sql时，请添加自定义脚本！',
        duration: 5
      })
      reject()
      return
    }

    if ((setting.interType === 'inner' && !setting.innerFunc && setting.execute !== 'false') || _scripts.length > 0) {
      let param = {
        func: 's_debug_sql',
        LText: SettingUtils.getDebugSql(setting, _scripts, columns, searches)
      }
      param.LText = Utils.formatOptions(param.LText)
      param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') + '.000'
      param.secretkey = Utils.encrypt(param.LText, param.timestamp)
      
      Api.getLocalConfig(param).then(result => {
        if (result.status) {
          resolve()
        } else {
          reject()
          Modal.error({
            title: result.message
          })
        }
      })
    } else {
      resolve()
    }
  }

@@ -362,10 +459,11 @@
  }

  render() {
    const { columns, setting, scripts, colColumns, scriptsColumns, activeKey } = this.state
    const { columns, setting, scripts, colColumns, scriptsColumns, activeKey, loading } = this.state

    return (
      <div id="mob-verify-card-box-tab">
        {loading && <Spin size="large" />}
        <Tabs activeKey={activeKey} className="verify-card-box" onChange={this.changeTab}>
          <TabPane tab="数据源" key="setting">
            <SettingForm
@@ -373,6 +471,7 @@
              dict={this.props.dict}
              columns={columns}
              setting={setting}
              scripts={scripts}
              wrappedComponentRef={(inst) => this.settingForm = inst}
            />
          </TabPane>
@@ -400,6 +499,7 @@
              customScripts={scripts}
              systemScripts={this.state.systemScripts}
              scriptsChange={this.scriptsChange}
              scriptSubmit={this.scriptSubmit}
              wrappedComponentRef={(inst) => this.scriptsForm = inst}
            />
            <Table