OnlAutoListMixin.js
4 KB
1
2
3
4
5
6
7
8
9
10
11
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
106
107
108
109
110
111
112
113
114
115
116
import { filterMultiDictText } from '@/components/dict/JDictSelectUtil'
export const HrefJump = {
data() {
return {
fieldHrefSlots: [],
hrefComponent: {
model: {
title: '',
width: '100%',
visible: false,
destroyOnClose: true,
style: {
top: 0,
left: 0,
height: '100%',
margin: 0,
padding: 0
},
bodyStyle: { padding: '8px', height: 'calc(100vh - 108px)', overflow: 'auto', overflowX: 'hidden' },
// 隐藏掉取消按钮
cancelButtonProps: { style: { display: 'none' } }
},
on: {
ok: () => this.hrefComponent.model.visible = false,
cancel: () => this.hrefComponent.model.visible = false
},
is: null,
params: {},
}
}
},
methods: {
// 处理接收href参数
handleAcceptHrefParams(){
this.acceptHrefParams={}
let hrefparam = this.$route.query;
if(hrefparam){
this.acceptHrefParams = {...hrefparam}
}
},
//支持链接href跳转
handleClickFieldHref(field, record) {
let href = field.href
let urlPattern = /(ht|f)tp(s?)\:\/\/[0-9a-zA-Z]([-.\w]*[0-9a-zA-Z])*(:(0-9)*)*(\/?)([a-zA-Z0-9\-\.\?\,\'\/\\\+&%\$#_]*)?/
let compPattern = /\.vue(\?.*)?$/
if (typeof href === 'string') {
href = href.trim().replace(/\${([^}]+)?}/g, (s1, s2) => record[s2])
if (urlPattern.test(href)) {
window.open(href, '_blank')
} else if (compPattern.test(href)) {
this.openHrefCompModal(href)
} else {
this.$router.push(href)
}
}
},
openHrefCompModal(href) {
// 解析 href 参数
let index = href.indexOf('?')
let path = href
if (index !== -1) {
path = href.substring(0, index)
let paramString = href.substring(index + 1, href.length)
let paramArray = paramString.split('&')
let params = {}
paramArray.forEach(paramObject => {
let paramItem = paramObject.split('=')
params[paramItem[0]] = paramItem[1]
})
this.hrefComponent.params = params
} else {
this.hrefComponent.params = {}
}
this.hrefComponent.model.visible = true
this.hrefComponent.model.title = '操作'
this.hrefComponent.is = () => import('@/views/' + (path.startsWith('/') ? path.slice(1) : path))
},
/** 处理列中的 href 跳转和 dict 字典，使两者可以兼容存在 */
handleColumnHrefAndDict(column = {}, fieldHrefSlotKeysMap = {}) {
let { customRender, hrefSlotName } = column
if (!hrefSlotName && (column.scopedSlots && column.scopedSlots.customRender)) {
//hrefSlotName = column.scopedSlots.customRender
}
// 如果 customRender 有值则代表使用了字典
// 如果 hrefSlotName 有值则代表使用了href跳转
// 两者可以兼容。兼容的具体思路为：先获取到字典替换的值，再添加href链接跳转
if (customRender || hrefSlotName) {
let dictCode = customRender
let replaceFlag = '_replace_text_'
column.customRender = (text, record) => {
let value = text
// 如果 dictCode 有值，就进行字典转换
if (dictCode) {
if (dictCode.startsWith(replaceFlag)) {
let textFieldName = dictCode.replace(replaceFlag, '')
value = record[textFieldName]
} else {
value = filterMultiDictText(this.dictOptions[dictCode], text)
}
}
// 如果 hrefSlotName 有值，就生成一个 a 标签，包裹住字典替换后（或原生）的值
if (hrefSlotName) {
let field = fieldHrefSlotKeysMap[hrefSlotName]
if (field) {
// 此处为 JSX 语法
return (<a onClick={() => this.handleClickFieldHref(field, record)}>{value}</a>)
}
}
return value
}
}
},
}
}