king
2023-08-27 da64ab0923bf8817fc8599a6e37b953ce38f64c8
src/templates/zshare/editTable/index.jsx
@@ -3,17 +3,17 @@
import { is, fromJS } from 'immutable'
import { DndProvider, DragSource, DropTarget } from 'react-dnd'
import { Table, Input, InputNumber, Popconfirm, Form, Select, Radio, Cascader, notification, message, Modal, Typography } from 'antd'
import { CopyOutlined, EditOutlined, DeleteOutlined, SnippetsOutlined, SwapOutlined } from '@ant-design/icons'
import { CopyOutlined, EditOutlined, DeleteOutlined, SwapOutlined } from '@ant-design/icons'
import Utils from '@/utils/utils.js'
import ColorSketch from '@/mob/colorsketch'
import PasteForm from '@/templates/zshare/pasteform'
import asyncComponent from '@/utils/asyncComponent'
import CusSwitch from './cusSwitch'
import MKEmitter from '@/utils/events.js'
import './index.scss'
const MkEditIcon = asyncComponent(() => import('@/components/mkIcon'))
const PasteBoard = asyncComponent(() => import('@/components/pasteboard'))
const EditableContext = React.createContext()
const { confirm } = Modal
let dragingIndex = -1
@@ -172,7 +172,6 @@
  state = {
    data: [],
    editingKey: '',
    visible: false,
    editLineId: '',
    columns: []
  }
@@ -181,6 +180,15 @@
    const { data, actions } = this.props
    let columns = fromJS(this.props.columns).toJS()
    let operation = null
    let extra = null
    if (actions) {
      actions.forEach(item => {
        if (/^extra/.test(item)) {
          extra = item.split(':')
        }
      })
    }
    if (actions && (actions.includes('edit') || actions.includes('copy') || actions.includes('del'))) {
      let _operation = null
@@ -196,7 +204,7 @@
          操作
          <span className="copy-control">
            {actions.includes('copy') ? <CopyOutlined title="复制" onClick={() => this.copy()} /> : null}
            {actions.includes('copy') ? <SnippetsOutlined title="粘贴" onClick={this.paste} /> : null}
            {actions.includes('copy') ? <PasteBoard getPasteValue={this.pasteSubmit}/> : null}
            {actions.includes('clear') ? <DeleteOutlined title="清空" onClick={this.clear} /> : null}
          </span>
        </div>),
@@ -218,9 +226,10 @@
            </div>
          ) : (
            <div className={'edit-operation-btn' + (editingKey !== '' ? ' disabled' : '')} style={{minWidth: '110px', whiteSpace: 'nowrap'}}>
              {actions.includes('edit') ? <span className="primary" onClick={() => {editingKey === '' && this.edit(record.uuid)}}><EditOutlined /></span> : null}
              {actions.includes('copy') ? <span className="copy" onClick={() => {editingKey === '' && this.copy(record)}}><CopyOutlined /></span> : null}
              {actions.includes('status') ? <span className="status" onClick={() => {editingKey === '' && this.handleStatus(record)}}><SwapOutlined /></span> : null}
              {actions.includes('edit') ? <span className="primary" title="编辑" onClick={() => {editingKey === '' && this.edit(record.uuid)}}><EditOutlined /></span> : null}
              {extra ? <span className="status" title={extra[2]} onClick={() => {editingKey === '' && this.handleStatus(record, extra[1])}}><SwapOutlined /></span> : null}
              {actions.includes('status') ? <span className="status" title="是否启用" onClick={() => {editingKey === '' && this.handleStatus(record, 'status')}}><SwapOutlined /></span> : null}
              {actions.includes('copy') ? <span className="copy" title="复制" onClick={() => {editingKey === '' && this.copy(record)}}><CopyOutlined /></span> : null}
              {actions.includes('del') && editingKey === '' ? <Popconfirm
                overlayClassName="popover-confirm"
                title="确定删除吗?"
@@ -352,66 +361,76 @@
    }
  }
  
  paste = () => {
    this.setState({visible: true})
  }
  pasteSubmit = () => {
  pasteSubmit = (res, callback) => {
    const { type } = this.props
    const { columns } = this.state
    let data = fromJS(this.state.data).toJS()
    this.pasteFormRef.handleConfirm().then(res => {
      if (res.copyType === 'columns' && type === 'datasourcefield') {
        res.type = 'array'
        res.data = []
        res.columns.forEach(col => {
          if (!col.field) return
          if (col.type === 'number') {
            let datatype = 'Int'
            if (col.decimal) {
              datatype = `Decimal(18,${col.decimal})`
            }
            res.data.push({
              $index: res.data.length + 1,
              datatype: datatype,
              field: col.field,
              decimal: col.decimal,
              label: col.label,
              type: 'number',
              uuid: Utils.getuuid()
            })
          } else {
            let datatype = 'Nvarchar(50)'
            let fieldlength = 50
            if (col.fieldlength && [10, 20, 50, 100, 256, 512, 1024, 2048].includes(col.fieldlength)) {
              fieldlength = col.fieldlength
              datatype = `Nvarchar(${fieldlength})`
            }
            res.data.push({
              $index: res.data.length + 1,
              datatype: datatype,
              field: col.field,
              fieldlength: fieldlength,
              label: col.label,
              type: 'text',
              uuid: Utils.getuuid()
            })
    if (res.copyType === 'columns' && type === 'datasourcefield') {
      res.type = 'array'
      res.data = []
      res.columns.forEach(col => {
        if (!col.field) return
        if (col.type === 'number') {
          let datatype = 'Int'
          if (col.decimal) {
            datatype = `Decimal(18,${col.decimal})`
          }
        })
      } else if (res.key !== type) {
        message.warning('配置信息格式错误!')
        return
      }
      if (res.type === 'line') {
        let unique = true
        res.data.uuid = Utils.getuuid()
        columns.forEach(col => {
          if (col.unique !== true || !unique) return
          res.data.push({
            $index: res.data.length + 1,
            datatype: datatype,
            field: col.field,
            decimal: col.decimal,
            label: col.label,
            type: 'number',
            uuid: Utils.getuuid()
          })
        } else {
          let datatype = 'Nvarchar(50)'
          let fieldlength = 50
          if (col.fieldlength && [10, 20, 50, 100, 256, 512, 1024, 2048].includes(col.fieldlength)) {
            fieldlength = col.fieldlength
            datatype = `Nvarchar(${fieldlength})`
          }
          res.data.push({
            $index: res.data.length + 1,
            datatype: datatype,
            field: col.field,
            fieldlength: fieldlength,
            label: col.label,
            type: 'text',
            uuid: Utils.getuuid()
          })
        }
      })
    } else if (res.key !== type) {
      message.warning('配置信息格式错误!')
      return
    }
    if (res.type === 'line') {
      let unique = true
      res.data.uuid = Utils.getuuid()
      columns.forEach(col => {
        if (col.unique !== true || !unique) return
        if (col.uniqueFunc) {
          unique = col.uniqueFunc(data, res.data)
        } else if (col.strict) {
          let key = res.data[col.dataIndex].toLowerCase()
          let _index = data.findIndex(item => key === item[col.dataIndex].toLowerCase())
          if (_index > -1) {
            notification.warning({
              top: 92,
              message: col.title + '不可重复!',
              duration: 5
            })
            unique = false
          }
        } else {
          let _index = data.findIndex(item => res.data[col.dataIndex] === item[col.dataIndex])
          if (_index > -1) {
@@ -422,44 +441,57 @@
            })
            unique = false
          }
        })
        }
      })
        if (!unique) return
      if (!unique) return
        data.unshift(res.data)
        this.setState({ data, editingKey: '', visible: false }, () => {
          this.props.onChange(data)
        })
      } else if (res.type === 'array') {
        res.data.forEach(cell => {
          let unique = true
          cell.uuid = Utils.getuuid()
          columns.forEach(col => {
            if (col.unique !== true || !unique) return
      data.unshift(res.data)
      this.setState({ data, editingKey: '', editLineId: res.data.uuid || '' }, () => {
        this.props.onChange(data)
      })
    } else if (res.type === 'array') {
      res.data.forEach(cell => {
        let unique = true
        cell.uuid = Utils.getuuid()
        columns.forEach(col => {
          if (col.unique !== true || !unique) return
          if (col.uniqueFunc) {
            unique = col.uniqueFunc(data, cell)
          } else if (col.strict) {
            let _index = data.findIndex(item => cell[col.dataIndex].toLowerCase() === item[col.dataIndex].toLowerCase())
            if (_index > -1) {
              unique = false
            }
          } else {
            let _index = data.findIndex(item => cell[col.dataIndex] === item[col.dataIndex])
  
            if (_index > -1) {
              unique = false
            }
          })
          if (!unique) return
          data.push(cell)
          }
        })
        this.setState({ data, editingKey: '', visible: false }, () => {
          this.props.onChange(data)
        })
      }
      message.success('粘贴成功。')
    })
        if (!unique) return
        data.push(cell)
      })
      this.setState({ data, editingKey: '' }, () => {
        this.props.onChange(data)
      })
    }
    callback()
    message.success('粘贴成功。')
  }
  handleStatus = (record) => {
  handleStatus = (record, type) => {
    const { data } = this.state
    record.status = record.status === 'false' ? 'true' : 'false'
    record[type] = record[type] === 'false' ? 'true' : 'false'
    let newData = data.map(item => {
      if (record.uuid === item.uuid) return record
@@ -490,15 +522,32 @@
    columns.forEach(col => {
      if (col.unique !== true || !unique) return
      let _index = newData.findIndex(item => record.uuid !== item.uuid && record[col.dataIndex] === item[col.dataIndex])
      if (col.uniqueFunc) {
        unique = col.uniqueFunc(newData, record)
        return
      } else if (col.strict) {
        let key = record[col.dataIndex].toLowerCase()
        let _index = newData.findIndex(item => record.uuid !== item.uuid && key === item[col.dataIndex].toLowerCase())
      if (_index > -1) {
        notification.warning({
          top: 92,
          message: col.title + '不可重复!',
          duration: 5
        })
        unique = false
        if (_index > -1) {
          notification.warning({
            top: 92,
            message: col.title + '不可重复!',
            duration: 5
          })
          unique = false
        }
      } else {
        let _index = newData.findIndex(item => record.uuid !== item.uuid && record[col.dataIndex] === item[col.dataIndex])
        if (_index > -1) {
          notification.warning({
            top: 92,
            message: col.title + '不可重复!',
            duration: 5
          })
          unique = false
        }
      }
    })
@@ -529,31 +578,49 @@
      }
      const newData = [...this.state.data]
      const index = newData.findIndex(item => uuid === item.uuid)
      if (index > -1) {
        row = {...newData[index], ...row}
      } else {
        row.uuid = uuid
      }
      let unique = true
      columns.forEach(col => {
        if (col.unique !== true || !unique) return
        let _index = newData.findIndex(item => uuid !== item.uuid && row[col.dataIndex] === item[col.dataIndex])
        if (_index > -1) {
          notification.warning({
            top: 92,
            message: col.title + '不可重复!',
            duration: 5
          })
          unique = false
        if (col.uniqueFunc) {
          unique = col.uniqueFunc(newData, row)
          return
        } else if (col.strict) {
          let key = row[col.dataIndex].toLowerCase()
          let _index = newData.findIndex(item => row.uuid !== item.uuid && key === item[col.dataIndex].toLowerCase())
          if (_index > -1) {
            notification.warning({
              top: 92,
              message: col.title + '不可重复!',
              duration: 5
            })
            unique = false
          }
        } else {
          let _index = newData.findIndex(item => row.uuid !== item.uuid && row[col.dataIndex] === item[col.dataIndex])
          if (_index > -1) {
            notification.warning({
              top: 92,
              message: col.title + '不可重复!',
              duration: 5
            })
            unique = false
          }
        }
      })
      if (!unique) return
      if (index > -1) {
        const item = newData[index]
        newData.splice(index, 1, {
          ...item,
          ...row,
        })
        newData.splice(index, 1, row)
        this.setState({ data: newData, editingKey: '' }, () => {
          this.props.onChange(newData)
        })
@@ -642,7 +709,7 @@
      return item
    })
    let reg = searchKey ? new RegExp(searchKey, 'ig') : null
    let reg = searchKey ? new RegExp(searchKey, 'i') : null
    return (
      <EditableContext.Provider value={this.props.form}>
@@ -673,18 +740,6 @@
              })}
            />
          </DndProvider>
          {/* 信息粘贴 */}
          <Modal
            title="粘贴"
            visible={this.state.visible}
            width={600}
            maskClosable={false}
            onOk={this.pasteSubmit}
            onCancel={() => {this.setState({visible: false})}}
            destroyOnClose
          >
            <PasteForm wrappedComponentRef={(inst) => this.pasteFormRef = inst} inputSubmit={this.pasteSubmit}/>
          </Modal>
        </div>
      </EditableContext.Provider>
    )