Blame view

ant-design-vue-jeecg/src/components/jeecg/JVxeTable/install.js 3.39 KB
肖超群 authored
1
import Vue from 'vue'
肖超群 authored
2
3
import {getEventPath} from '@/utils/util'
import JVxeTable, {AllCells, JVXETypes} from './index'
肖超群 authored
4
5
6
import './less/j-vxe-table.less'
// 引入 vxe-table
import 'xe-utils'
肖超群 authored
7
import VXETable, {Grid} from 'vxe-table'
肖超群 authored
8
9
10
import VXETablePluginAntd from 'vxe-table-plugin-antd'
import 'vxe-table/lib/index.css'
import 'vxe-table-plugin-antd/dist/style.css'
肖超群 authored
11
import {getEnhancedMixins, installAllCell, installOneCell} from '@/components/jeecg/JVxeTable/utils/cellUtils'
肖超群 authored
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105

// VxeGrid所有的方法映射
const VxeGridMethodsMap = {}
Object.keys(Grid.methods).forEach(key => {
  // 使用eval可以避免闭包(但是要注意不要写es6的代码)
  VxeGridMethodsMap[key] = eval(`(function(){return this.$refs.vxe.${key}.apply(this.$refs.vxe,arguments)})`)
})
// 将Grid所有的方法都映射(继承)到JVxeTable上
JVxeTable.methods = Object.assign({}, VxeGridMethodsMap, JVxeTable.methods)

// VXETable 全局配置
const VXETableSettings = {
  // z-index 起始值
  zIndex: 1000,
  table: {
    validConfig: {
      // 校验提示方式:强制使用tooltip
      message: 'tooltip'
    }
  }
}

// 执行注册方法
Vue.use(VXETable, VXETableSettings)
VXETable.use(VXETablePluginAntd)
Vue.component(JVxeTable.name, JVxeTable)

// 注册自定义组件
installAllCell(VXETable)

// 添加事件拦截器 event.clearActived
// 比如点击了某个组件的弹出层面板之后,此时被激活单元格不应该被自动关闭,通过返回 false 可以阻止默认的行为。
VXETable.interceptor.add('event.clearActived', function (params, event, target) {
  // 获取组件增强
  let col = params.column.own
  const interceptor = getEnhancedMixins(col.$type, 'interceptor')
  // 执行增强
  let flag = interceptor['event.clearActived'].apply(this, arguments)
  if (flag === false) {
    return false
  }

  let path = getEventPath(event)
  for (let p of path) {
    let className = p.className || ''
    className = typeof className === 'string' ? className : className.toString()

    /* --- 特殊处理以下组件,点击以下标签时不清空编辑状态 --- */

    // 点击的标签是JInputPop
    if (className.includes('j-input-pop')) {
      return false
    }
    // 点击的标签是JPopup的弹出层、部门选择、用户选择
    if (className.includes('j-popup-modal') || className.includes('j-depart-select-modal') || className.includes('j-user-select-modal')) {
      return false
    }
    // 执行增强
    let flag = interceptor['event.clearActived.className'].apply(this, [className, ...arguments])
    if (flag === false) {
      return false
    }
  }
})

/**
 * 注册map
 * @param type 类型
 * @param cell 输入组件
 * @param span 显示组件,可空,默认为 JVxeNormalCell 组件
 */
export function mapCell(type, cell, span) {
  let cells = {[type]: cell}
  if (span) {
    cells[type + ':span'] = span
  }
  return cells
}

/**
 * 注册自定义组件
 *
 * @param type 类型
 * @param cell 输入组件
 * @param span 显示组件,可空,默认为 JVxeNormalCell 组件
 */
export function installCell(type, cell, span) {
  let exclude = [JVXETypes.rowNumber, JVXETypes.rowCheckbox, JVXETypes.rowRadio, JVXETypes.rowExpand, JVXETypes.rowDragSort]
  if (exclude.includes(type)) {
    throw new Error(`【installCell】不能使用"${type}"作为组件的type,因为这是关键字。`)
  }
  Object.assign(AllCells, mapCell(type, cell, span))
  installOneCell(VXETable, type)
}