2023-06-14

king

2023-06-14 08cce3334a2dc81d690b518136b0aaea64e48b0b

 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
@@ -163,6 +163,7 @@
class EditTable extends Component {
  static propTpyes = {
    actions: PropTypes.any,         // 操作项
    searchKey: PropTypes.any,       // 搜索条件
    data: PropTypes.any,            // 数据列表
    columns: PropTypes.array,       // 显示列
    onChange: PropTypes.func        // 数据变化
@@ -171,7 +172,6 @@
  state = {
    data: [],
    editingKey: '',
    visible: false,
    editLineId: '',
    columns: []
  }
@@ -195,7 +195,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>),
@@ -351,16 +351,11 @@
    }
  }
  
  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 = []
@@ -411,6 +406,19 @@
        columns.forEach(col => {
          if (col.unique !== true || !unique) return

        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) {
@@ -421,12 +429,13 @@
            })
            unique = false
          }
        }
        })

        if (!unique) return

        data.unshift(res.data)
        this.setState({ data, editingKey: '', visible: false }, () => {
      this.setState({ data, editingKey: '', editLineId: res.data.uuid || '' }, () => {
          this.props.onChange(data)
        })
      } else if (res.type === 'array') {
@@ -435,10 +444,19 @@
          cell.uuid = Utils.getuuid()
          columns.forEach(col => {
            if (col.unique !== true || !unique) return

          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
            }
            }
          })
  
@@ -447,12 +465,13 @@
          data.push(cell)
        })

        this.setState({ data, editingKey: '', visible: false }, () => {
      this.setState({ data, editingKey: '' }, () => {
          this.props.onChange(data)
        })
      }

    callback()
      message.success('粘贴成功。')
    })
  }

  handleStatus = (record) => {
@@ -585,7 +604,7 @@
  }

  render() {
    const { actions, indexShow } = this.props
    const { actions, indexShow, searchKey } = this.props
    const { editLineId } = this.state

    let components = {
@@ -595,7 +614,7 @@
    }

    let moveprops = {}
    if (actions.includes('move')) {
    if (actions.includes('move') && !searchKey) {
      components.body.row = DragableBodyRow
      moveprops.moveAble = !this.state.editingKey
      moveprops.moveRow = this.moveRow
@@ -641,6 +660,8 @@
      return item
    })

    let reg = searchKey ? new RegExp(searchKey, 'ig') : null

    return (
      <EditableContext.Provider value={this.props.form}>
        <div className="modal-edit-table">
@@ -651,7 +672,18 @@
              components={components}
              dataSource={data}
              columns={columns}
              rowClassName={record => !editLineId || editLineId !== record.uuid ? 'editable-row' : 'editable-row active'}
              rowClassName={record => {
                let className = 'editable-row'
                if (editLineId && editLineId === record.uuid) {
                  className += ' active'
                }
                if (searchKey) {
                  if (!reg.test(record.field) && !reg.test(record.label)) {
                    className += ' hidden'
                  }
                }
                return className
              }}
              pagination={false}
              onRow={(record, index) => ({
                index,
@@ -659,18 +691,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>
    )