king
2023-05-09 7b0dbecd1d6155d26ec67be0a47a16264c738c85
src/templates/sharecomponent/actioncomponent/verifyexcelin/index.jsx
@@ -1,7 +1,8 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { fromJS } from 'immutable'
import { Form, Tabs, Row, Col, Input, Button, Table, Popconfirm, Icon, Tooltip, notification, Modal, message, InputNumber, Radio, Typography } from 'antd'
import { Form, Tabs, Row, Col, Input, Button, Popconfirm, Tooltip, notification, Modal, message, InputNumber, Radio, Typography } from 'antd'
import { EditOutlined, QuestionCircleOutlined, StopOutlined, CheckCircleOutlined, SwapOutlined, DeleteOutlined } from '@ant-design/icons'
import moment from 'moment'
import Api from '@/api'
@@ -11,6 +12,7 @@
import ColumnForm from './columnform'
import CustomScript from './customscript'
import asyncComponent from '@/utils/asyncComponent'
import MKEmitter from '@/utils/events.js'
import './index.scss'
const { TabPane } = Tabs
@@ -21,7 +23,6 @@
class VerifyCard extends Component {
  static propTpyes = {
    columns: PropTypes.array,  // 显示列
    dict: PropTypes.object,    // 字典项
    card: PropTypes.object,
  }
@@ -31,7 +32,7 @@
    activeKey: 'basemsg',
    excelColumns: [
      {
        title: this.props.dict['model.form.field'],
        title: '字段',
        dataIndex: 'Column',
        width: '14%',
        inputType: 'input',
@@ -39,14 +40,14 @@
        editable: true
      },
      {
        title: this.props.dict['model.name'],
        title: '名称',
        dataIndex: 'Text',
        width: '14%',
        inputType: 'input',
        editable: true
      },
      {
        title: this.props.dict['model.form.type'],
        title: '类型',
        dataIndex: 'type',
        width: '15%',
        editable: true,
@@ -70,20 +71,20 @@
        ]
      },
      {
        title: this.props.dict['model.required'],
        title: '必填',
        dataIndex: 'required',
        width: '10%',
        editable: true,
        inputType: 'switch',
        render: (text, record) => record.required === 'true' ? this.props.dict['model.true'] : this.props.dict['model.false']
        render: (text, record) => record.required === 'true' ? '是' : '否'
      },
      {
        title: this.props.dict['model.import'],
        title: '导入',
        dataIndex: 'import',
        width: '10%',
        editable: true,
        inputType: 'switch',
        render: (text, record) => record.import !== 'false' ? this.props.dict['model.true'] : this.props.dict['model.false']
        render: (text, record) => record.import !== 'false' ? '是' : '否'
      },
      {
        title: '最小值',
@@ -121,7 +122,7 @@
      {
        title: '报错编码',
        dataIndex: 'errorCode',
        width: '12%',
        width: '10%',
        editable: true,
        inputType: 'select',
        options: [
@@ -134,13 +135,24 @@
      {
        title: '验证类型',
        dataIndex: 'verifyType',
        width: '12%',
        render: (text, record) => record.verifyType === 'logic' ? '逻辑验证' : '物理验证',
        width: '14%',
        render: (text, record) => {
          let names = {
            physical: '物理验证(全量验证)',
            logic: '逻辑验证(全量验证)',
            physical_temp: '物理验证(仅临时表)',
            logic_temp: '逻辑验证(仅临时表)',
          }
          return names[text] || '物理验证(全量验证)'
        },
        inputType: 'select',
        editable: true,
        options: [
          { value: 'physical', text: '物理验证' },
          { value: 'logic', text: '逻辑验证' }
          { value: 'physical', text: '物理验证(全量验证)' },
          { value: 'logic', text: '逻辑验证(全量验证)' },
          { value: 'physical_temp', text: '物理验证(仅临时表)' },
          { value: 'logic_temp', text: '逻辑验证(仅临时表)' }
        ]
      },
      {
@@ -152,15 +164,15 @@
        inputType: 'switch',
        render: (text, record) => record.status === 'false' ?
          (
            <div>
              {this.props.dict['model.status.forbidden']}
              <Icon style={{marginLeft: '5px'}} type="stop" theme="twoTone" twoToneColor="#ff4d4f" />
            <div style={{color: '#ff4d4f'}}>
              禁用
              <StopOutlined style={{marginLeft: '5px'}} />
            </div>
          ) :
          (
            <div>
              {this.props.dict['model.status.open']}
              <Icon style={{marginLeft: '5px'}} type="check-circle" theme="twoTone" twoToneColor="#52c41a" />
            <div style={{color: '#26C281'}}>
              启用
              <CheckCircleOutlined style={{marginLeft: '5px'}}/>
            </div>
          )
      },
@@ -173,12 +185,12 @@
        render: (text) => {
          let title = text.match(/^\s*\/\*.+\*\//)
          title = title && title[0] ? title[0] : ''
          text = title ? text.replace(title, '') : text
          let _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>
              {title ? <span style={{color: '#a50'}}>{title}<span style={{fontSize: '12px', marginLeft: '5px'}}>{_text.length}</span></span> : null}
              <Paragraph copyable={{ text: text }} ellipsis={{ rows: 4, expandable: true }}>{_text}</Paragraph>
            </div>
          )
        }
@@ -188,15 +200,13 @@
        dataIndex: 'position',
        width: '10%',
        render: (text, record) => {
          let _text = ''
          if (record.position === 'front') {
            _text = 'sql前'
          } else if (record.position === 'init') {
            _text = '初始化'
          if (record.position === 'init') {
            return <span style={{color: 'orange'}}>初始化</span>
          } else if (record.position === 'front') {
            return <span style={{color: '#26C281'}}>sql前</span>
          } else {
            _text = 'sql后'
            return <span style={{color: '#1890ff'}}>sql后</span>
          }
          return _text
        }
      },
      {
@@ -205,35 +215,33 @@
        width: '10%',
        render: (text, record) => record.status === 'false' ?
          (
            <div>
              {this.props.dict['model.status.forbidden']}
              <Icon style={{marginLeft: '5px'}} type="stop" theme="twoTone" twoToneColor="#ff4d4f" />
            <div style={{color: '#ff4d4f'}}>
              禁用
              <StopOutlined style={{marginLeft: '5px'}} />
            </div>
          ) :
          (
            <div>
              {this.props.dict['model.status.open']}
              <Icon style={{marginLeft: '5px'}} type="check-circle" theme="twoTone" twoToneColor="#52c41a" />
            <div style={{color: '#26C281'}}>
              启用
              <CheckCircleOutlined style={{marginLeft: '5px'}}/>
            </div>
          )
      },
      {
        title: '操作',
        align: 'center',
        width: '20%',
        width: '140px',
        dataIndex: 'operation',
        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, 'scripts', 'up')} style={{color: '#1890ff'}}><Icon type="arrow-up" /></span>
            <span className="operation-btn" title={this.props.dict['header.form.down']} onClick={() => this.handleUpDown(record, 'scripts', '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, 'scripts')} style={{color: '#8E44AD'}}><Icon type="swap" /></span>
          (<div style={{textAlign: 'center'}}>
            <span className="operation-btn" title="编辑" onClick={() => this.handleEdit(record, 'scripts')} style={{color: '#1890ff'}}><EditOutlined /></span>
            <span className="operation-btn" title="状态切换" onClick={() => this.handleStatus(record, 'scripts')} style={{color: '#8E44AD'}}><SwapOutlined /></span>
            <Popconfirm
              overlayClassName="popover-confirm"
              title={this.props.dict['model.query.delete']}
              title="确定删除吗?"
              onConfirm={() => this.handleDelete(record, 'scripts')
            }>
              <span className="operation-btn" style={{color: '#ff4d4f'}}><Icon type="delete" /></span>
              <span className="operation-btn" style={{color: '#ff4d4f'}}><DeleteOutlined /></span>
            </Popconfirm>
          </div>)
      }
@@ -242,13 +250,22 @@
  UNSAFE_componentWillMount() {
    const { card } = this.props
    let _verify = fromJS(card.verify || {range: 1}).toJS()
    let _verify = fromJS(card.verify || {}).toJS()
    let _columns = _verify.columns || []
    delete _verify.dataresource
    // 旧数据兼容
    _columns = _columns.map(col => {
      col.required = col.required || 'true'
      col.type = col.type || 'Nvarchar(50)'
      col.import = col.import || 'true'
      if (col.type === 'text' || col.type === 'image') {
        col.type = 'Nvarchar(50)'
      } else if (col.type === 'number') {
        col.type = 'Decimal(18,2)'
      }
      
      if (/^Nvarchar/ig.test(col.type)) {
        col.limit = col.type.match(/\d+/)[0]
@@ -260,6 +277,10 @@
      return col
    })
    if (!_verify.hasOwnProperty('range')) {
      _verify.range = 1
    }
    this.setState({
      verify: {
@@ -277,6 +298,17 @@
  }
  componentDidMount () {
    this.getsysScript()
  }
  getsysScript = () => {
    if (sessionStorage.getItem('mk_sys_scripts')) {
      this.setState({
        systemScripts: JSON.parse(sessionStorage.getItem('mk_sys_scripts'))
      })
      return
    }
    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)
@@ -290,18 +322,21 @@
    
    _sParam.timestamp = moment().format('YYYY-MM-DD HH:mm:ss')
    _sParam.secretkey = Utils.encrypt(_sParam.LText, _sParam.timestamp)
    _sParam.open_key = Utils.encryptOpenKey(_sParam.secretkey, _sParam.timestamp) // 云端数据验证
    
    Api.getSystemConfig(_sParam).then(res => {
      if (res.status) {
        let _scripts = res.data.map(item => {
          return {
            name: item.funcname,
            value: window.decodeURIComponent(window.atob(item.longparam))
          }
        })
        sessionStorage.setItem('mk_sys_scripts', JSON.stringify(_scripts))
        this.setState({
          systemScripts: res.data.map(item => {
            return {
              name: item.funcname,
              value: Utils.UnformatOptions(item.longparam)
            }
          })
          systemScripts: _scripts
        })
      } else {
        notification.warning({
@@ -340,7 +375,7 @@
    let _columns = JSON.parse(JSON.stringify(verify.columns))
    let _cols = _columns.map(col => col.Column )
    let _cols = _columns.map(col => col.Column)
    columns.forEach(col => {
      if (col.field && !_cols.includes(col.field)) {
@@ -430,6 +465,13 @@
    const { verify } = this.state
    columns = columns.map(col => {
      col.type = col.type || 'Nvarchar(50)'
      if (col.type === 'text' || col.type === 'image') {
        col.type = 'Nvarchar(50)'
      } else if (col.type === 'number') {
        col.type = 'Decimal(18,2)'
      }
      if (/^Nvarchar/ig.test(col.type)) {
        col.limit = col.type.match(/\d+/) ? col.type.match(/\d+/)[0] : '20000'
      } else if (/^Decimal/ig.test(col.type)) {
@@ -440,6 +482,9 @@
      } else {
        col.limit = ''
      }
      col.required = col.required || 'true'
      col.import = col.import || 'true'
      return col
    })
@@ -503,6 +548,8 @@
      verify.scripts.push(values)
    }
    MKEmitter.emit('editLineId', values.uuid)
    this.setState({
      verify: verify
    })
@@ -523,11 +570,12 @@
  }
  handleEdit = (record, type) => {
    let node = null
    if (type === 'scripts') {
      this.scriptsForm.edit(record)
      node = document.getElementById('mk-exin-script')
    }
    let node = document.getElementById('verify-excel-box-tab').parentNode
    if (node && node.scrollTop) {
      let inter = Math.ceil(node.scrollTop / 10)
@@ -563,68 +611,6 @@
          return item
        }
      })
    }
    this.setState({
      verify: verify
    })
  }
  handleUpDown = (record, type, direction) => {
    let verify = JSON.parse(JSON.stringify(this.state.verify))
    let index = 0
    if (type === 'columns') {
      verify.columns = verify.columns.filter((item, i) => {
        if (item.uuid === record.uuid) {
          index = i
        }
        return item.uuid !== record.uuid
      })
      if ((index === 0 && direction === 'up') || (index === verify.columns.length && direction === 'down')) {
        return
      }
      if (direction === 'up') {
        verify.columns.splice(index - 1, 0, record)
      } else {
        verify.columns.splice(index + 1, 0, record)
      }
    } else if (type === 'unique') {
      verify.uniques = verify.uniques.filter((item, i) => {
        if (item.uuid === record.uuid) {
          index = i
        }
        return item.uuid !== record.uuid
      })
      if ((index === 0 && direction === 'up') || (index === verify.uniques.length && direction === 'down')) {
        return
      }
      if (direction === 'up') {
        verify.uniques.splice(index - 1, 0, record)
      } else {
        verify.uniques.splice(index + 1, 0, record)
      }
    } else if (type === 'scripts') {
      verify.scripts = verify.scripts.filter((item, i) => {
        if (item.uuid === record.uuid) {
          index = i
        }
        return item.uuid !== record.uuid
      })
      if ((index === 0 && direction === 'up') || (index === verify.scripts.length && direction === 'down')) {
        return
      }
      if (direction === 'up') {
        verify.scripts.splice(index - 1, 0, record)
      } else {
        verify.scripts.splice(index + 1, 0, record)
      }
    }
    this.setState({
@@ -673,9 +659,7 @@
          if (this.scriptsForm && this.scriptsForm.state.editItem) {
            _loading = true
            this.setState({activeKey: 'scripts'})
          }
          if (this.scriptsForm && 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
            this.setState({activeKey: 'scripts'})
          }
@@ -782,19 +766,25 @@
    }
    return (
      <div id="verify-excel-box-tab">
        <Tabs activeKey={activeKey} className="verify-card-box" onChange={this.tabchange}>
      <div>
        {card.label ? <div className="mk-com-name">{card.label} - 验证信息</div> : null}
        <Tabs activeKey={activeKey} className="excelin-verify-card-box" onChange={this.tabchange}>
          <TabPane tab="基础验证" key="basemsg">
            <Form {...formItemLayout}>
              <Row gutter={24}>
                <Col span={8}>
                  <Form.Item label={this.props.dict['model.form.tablename']}>
                  <Form.Item label={
                    <Tooltip placement="bottomLeft" title="导入时工作表名与excel中必须一致,注:工作表名为Sheet1且excel中仅有一个工作表时不进行表名验证。">
                      <QuestionCircleOutlined className="mk-form-tip" />
                      工作表
                    </Tooltip>
                  }>
                    {getFieldDecorator('sheet', {
                      initialValue: verify.sheet || '',
                      rules: [
                        {
                          required: true,
                          message: this.props.dict['form.required.input'] + this.props.dict['model.form.tablename'] + '!'
                          message: '请输入工作表名!'
                        }
                      ]
                    })(<Input placeholder="" autoComplete="off" />)}
@@ -803,7 +793,7 @@
                <Col span={8}>
                  <Form.Item label={
                    <Tooltip placement="bottomLeft" title="忽略首行时,会校验excel中表头名称与excel列设置是否一致。">
                      <Icon type="question-circle" style={{color: '#c49f47', marginRight: '5px'}}/>
                      <QuestionCircleOutlined className="mk-form-tip" />
                      忽略行
                    </Tooltip>
                  }>
@@ -829,7 +819,7 @@
              {verify.columns.length ? <span className="count-tip">{verify.columns.length}</span> : null}
            </span>
          } key="excelcolumn">
            <ColumnForm dict={this.props.dict} columnChange={this.columnChange}/>
            <ColumnForm columnChange={this.columnChange}/>
            <Button className="excel-col-add mk-green" title="添加显示列字段" onClick={this.columnFieldInput}>
              同步显示列
            </Button>
@@ -837,7 +827,7 @@
              清空Excel列
            </Button>
            <Col style={{fontSize: '12px', color: '#757575', paddingLeft: '10px'}} span={24}>注:数值类型(int 或 decimal),内容为必填;最大值和最小值在类型为数值时有效。</Col>
            <EditTable data={verify.columns} columns={excelColumns} onChange={this.changeColumns}/>
            <EditTable actions={['edit', 'move', 'copy', 'del']} type="excelcolumn" data={verify.columns} columns={excelColumns} onChange={this.changeColumns}/>
          </TabPane>
          {card.intertype === 'system' ? <TabPane tab={
            <span>
@@ -845,17 +835,16 @@
              {verify.uniques.length ? <span className="count-tip">{verify.uniques.length}</span> : null}
            </span>
          } key="unique">
            <UniqueForm fields={verify.columns} dict={this.props.dict} uniqueChange={this.uniqueChange}/>
            <EditTable data={verify.uniques} columns={uniqueColumns} onChange={this.changeUniques}/>
            <UniqueForm fields={verify.columns} uniqueChange={this.uniqueChange}/>
            <EditTable actions={['edit', 'move', 'del', 'status']} data={verify.uniques} columns={uniqueColumns} onChange={this.changeUniques}/>
          </TabPane> : null}
          {card.intertype === 'system' ? <TabPane tab={
            <span>
              自定义脚本
              {verify.scripts.length ? <span className="count-tip">{verify.scripts.length}</span> : null}
            </span>
          } key="scripts">
          } key="scripts" id="mk-exin-script">
            <CustomScript
              dict={this.props.dict}
              btn={this.props.card}
              usefulfields={verify.columns}
              scripts={verify.scripts}
@@ -863,14 +852,7 @@
              scriptsChange={this.scriptsChange}
              wrappedComponentRef={(inst) => this.scriptsForm = inst}
            />
            <Table
              bordered
              rowKey="uuid"
              className="custom-table"
              dataSource={verify.scripts}
              columns={scriptsColumns}
              pagination={false}
            />
            <EditTable actions={['move']} data={verify.scripts} columns={scriptsColumns} onChange={(scripts) => {this.setState({verify: {...verify, scripts}})}}/>
          </TabPane> : null}
          <TabPane tab="信息提示" key="tip">
            <Form {...formItemLayout}>