sh-view 2.8.4 → 2.8.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +2 -2
- package/packages/components/sh-form/js/useForm.js +0 -20
- package/packages/components/sh-noticebar/index.vue +33 -35
- package/packages/components/sh-table/js/useTable.js +0 -34
- package/packages/components/sh-tabs/index.vue +11 -7
- package/types/alert.ts +30 -30
- package/types/component.d.ts +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "sh-view",
|
|
3
|
-
"version": "2.8.
|
|
3
|
+
"version": "2.8.5",
|
|
4
4
|
"description": "基于vxe-table二次封装,更包含Alert,Badge,Card,CodeEditor,Col,Corner,CountTo,Drawer,Empty,Form,Header,Icon,List,Loading,Modal,Noticebar,Poptip,Progress,PullRefresh,Query,Result,Row,Split,Grid,Table,Tabs,Tag,Toolbar,Tree,Upload,WaterFall,WaterMark等丰富组件库",
|
|
5
5
|
"main": "packages/index.js",
|
|
6
6
|
"typings": "types/index.d.ts",
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
"jszip": "^3.10.1",
|
|
32
32
|
"lunar-typescript": "^1.6.10",
|
|
33
33
|
"popper.js": "^1.16.1",
|
|
34
|
-
"sh-tools": "^2.2.
|
|
34
|
+
"sh-tools": "^2.2.6",
|
|
35
35
|
"tinymce": "^5.10.5",
|
|
36
36
|
"vue": "^3.3.4",
|
|
37
37
|
"vue-masonry": "^0.16.0",
|
|
@@ -86,16 +86,6 @@ export default function (props, context, proxy, isForm) {
|
|
|
86
86
|
const validate = callback => {
|
|
87
87
|
return formRef.value.validate(callback)
|
|
88
88
|
}
|
|
89
|
-
// 初始化表单字段
|
|
90
|
-
const initFormData = () => {
|
|
91
|
-
let initItems = isForm ? props.items : props.items.filter(item => item.search && item.search !== '0')
|
|
92
|
-
$vUtils.eachTree(initItems, item => {
|
|
93
|
-
let renderProps = item.renderProps || item.itemRender?.props || {}
|
|
94
|
-
if (!$vUtils.isNone(renderProps?.defaultValue) && $vUtils.isNone($vUtils.get(props.data, item.field))) {
|
|
95
|
-
$vUtils.set(props.data, item.field, renderProps.defaultValue)
|
|
96
|
-
}
|
|
97
|
-
})
|
|
98
|
-
}
|
|
99
89
|
// 初始化表单项
|
|
100
90
|
const initFormItems = () => {
|
|
101
91
|
let rules = getFieldsRules(props.items)
|
|
@@ -124,7 +114,6 @@ export default function (props, context, proxy, isForm) {
|
|
|
124
114
|
// tag: vxe-form在 item监听时数据length为0时没有刷新视图补充
|
|
125
115
|
refreshRender()
|
|
126
116
|
}
|
|
127
|
-
initFormData()
|
|
128
117
|
}
|
|
129
118
|
// 初始化验证规则
|
|
130
119
|
const initEditRules = rules => {
|
|
@@ -177,15 +166,6 @@ export default function (props, context, proxy, isForm) {
|
|
|
177
166
|
initFormItems()
|
|
178
167
|
}
|
|
179
168
|
)
|
|
180
|
-
watch(
|
|
181
|
-
() => props.data,
|
|
182
|
-
() => {
|
|
183
|
-
initFormData()
|
|
184
|
-
},
|
|
185
|
-
{
|
|
186
|
-
immediate: true
|
|
187
|
-
}
|
|
188
|
-
)
|
|
189
169
|
watch(
|
|
190
170
|
() => props.items,
|
|
191
171
|
nv => {
|
|
@@ -84,7 +84,7 @@ export default defineComponent({
|
|
|
84
84
|
const styles = computed(() => {
|
|
85
85
|
return {
|
|
86
86
|
color: props.color,
|
|
87
|
-
backgroundColor: $vUtils.fade(props.color,
|
|
87
|
+
backgroundColor: $vUtils.fade(props.color, 20)
|
|
88
88
|
}
|
|
89
89
|
})
|
|
90
90
|
const animateStyles = computed(() => {
|
|
@@ -164,44 +164,42 @@ export default defineComponent({
|
|
|
164
164
|
z-index: 15;
|
|
165
165
|
padding: 10px 0 10px 15px;
|
|
166
166
|
box-sizing: border-box;
|
|
167
|
-
|
|
167
|
+
&-round {
|
|
168
168
|
border-radius: 6px;
|
|
169
169
|
}
|
|
170
|
-
|
|
171
|
-
|
|
170
|
+
&-left,
|
|
171
|
+
&-right {
|
|
172
|
+
display: flex;
|
|
173
|
+
align-items: center;
|
|
172
174
|
}
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
}
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
line-height: 1.5;
|
|
199
|
-
white-space: normal;
|
|
175
|
+
&-left {
|
|
176
|
+
padding-right: 10px;
|
|
177
|
+
}
|
|
178
|
+
&-right {
|
|
179
|
+
padding: 0 10px;
|
|
180
|
+
}
|
|
181
|
+
&-empty {
|
|
182
|
+
padding-right: 0;
|
|
183
|
+
}
|
|
184
|
+
&-content {
|
|
185
|
+
flex: 1;
|
|
186
|
+
margin: auto;
|
|
187
|
+
width: auto;
|
|
188
|
+
white-space: nowrap;
|
|
189
|
+
overflow: hidden;
|
|
190
|
+
&-multi-content {
|
|
191
|
+
padding: 0;
|
|
192
|
+
line-height: 1.5;
|
|
193
|
+
white-space: normal;
|
|
194
|
+
}
|
|
195
|
+
&-animate {
|
|
196
|
+
padding-left: 100%;
|
|
197
|
+
display: inline-block;
|
|
198
|
+
animation: sh-notice-bar-animation linear 30s infinite both;
|
|
199
|
+
}
|
|
200
200
|
}
|
|
201
|
-
.sh-notice-
|
|
202
|
-
|
|
203
|
-
display: inline-block;
|
|
204
|
-
animation: sh-notice-bar-animation linear 30s infinite both;
|
|
201
|
+
.sh-notice-icon {
|
|
202
|
+
cursor: pointer;
|
|
205
203
|
}
|
|
206
204
|
}
|
|
207
205
|
@keyframes sh-notice-bar-animation {
|
|
@@ -394,39 +394,6 @@ export default function (props, context, proxy, isGrid) {
|
|
|
394
394
|
})
|
|
395
395
|
}
|
|
396
396
|
}
|
|
397
|
-
// 初始化表头配置默认值
|
|
398
|
-
const initColsDefaultValue = () => {
|
|
399
|
-
let colsDefaultValue = {}
|
|
400
|
-
let colsFormulaValue = {}
|
|
401
|
-
$vUtils.eachTree(props.columns, item => {
|
|
402
|
-
let columnProps = item.renderProps || item.editRender?.props || item.cellRender?.props || {}
|
|
403
|
-
if (!$vUtils.isNone(columnProps.defaultValue)) {
|
|
404
|
-
colsDefaultValue[item.field] = columnProps.defaultValue
|
|
405
|
-
}
|
|
406
|
-
if (!$vUtils.isNone(columnProps.formula)) {
|
|
407
|
-
colsFormulaValue[item.field] = columnProps.formula
|
|
408
|
-
}
|
|
409
|
-
})
|
|
410
|
-
tableRowDefaultData.value = colsDefaultValue
|
|
411
|
-
if (Array.isArray(props.dataSourse)) {
|
|
412
|
-
props.dataSourse.forEach(row => {
|
|
413
|
-
if (Object.keys(colsDefaultValue).length > 0) {
|
|
414
|
-
Object.keys(colsDefaultValue).forEach(defaultKey => {
|
|
415
|
-
if ($vUtils.isNone($vUtils.get(row, defaultKey))) {
|
|
416
|
-
$vUtils.set(row, defaultKey, colsDefaultValue[defaultKey])
|
|
417
|
-
}
|
|
418
|
-
})
|
|
419
|
-
}
|
|
420
|
-
if (Object.keys(colsFormulaValue).length > 0) {
|
|
421
|
-
Object.keys(colsFormulaValue).forEach(formulaKey => {
|
|
422
|
-
let formulaValue = $vUtils.calculate(colsFormulaValue[formulaKey], row)
|
|
423
|
-
$vUtils.set(row, formulaKey, formulaValue)
|
|
424
|
-
})
|
|
425
|
-
}
|
|
426
|
-
})
|
|
427
|
-
}
|
|
428
|
-
}
|
|
429
|
-
|
|
430
397
|
// 全局搜索输入框事件
|
|
431
398
|
const handleTableFilter = obj => {
|
|
432
399
|
let filterText = tableFilterText.value
|
|
@@ -563,7 +530,6 @@ export default function (props, context, proxy, isGrid) {
|
|
|
563
530
|
watch(
|
|
564
531
|
() => props.dataSourse,
|
|
565
532
|
value => {
|
|
566
|
-
initColsDefaultValue()
|
|
567
533
|
selectionRows.value = []
|
|
568
534
|
},
|
|
569
535
|
{
|
|
@@ -9,10 +9,7 @@
|
|
|
9
9
|
<div ref="navScrollRef" class="sh-tabs-nav-scroll" @DOMMouseScroll="handleScroll" @mousewheel="handleScroll">
|
|
10
10
|
<div ref="navRef" v-resize="handleResize" class="sh-tabs-nav-inner" :style="navStyle">
|
|
11
11
|
<template v-for="(tab, tabIndex) in tabList" :key="tabIndex">
|
|
12
|
-
<div
|
|
13
|
-
:class="{ 'sh-tab-item': true, 'sh-tab-item-disabled': tab.disabled, 'sh-tab-item-active': tab[labelKey] === activeKey }"
|
|
14
|
-
:style="getTabItemStyle(tab, tabIndex)"
|
|
15
|
-
@click="handleChange(tab)">
|
|
12
|
+
<div v-ripple v-bind="getTabItemBind(tab, tabIndex)" @click="handleChange(tab)">
|
|
16
13
|
<slot name="tabItem" v-bind="{ ...tab, isActive: tab[labelKey] === activeKey }">
|
|
17
14
|
<div v-if="tab.icon" class="sh-tab-icon"><sh-icon :type="tab.icon"></sh-icon></div>
|
|
18
15
|
<div class="sh-tab-label">{{ tab[labelField] }}</div>
|
|
@@ -161,14 +158,21 @@ export default defineComponent({
|
|
|
161
158
|
const getTabIsClosable = tab => {
|
|
162
159
|
return props.closable && !tab.disabled && !tab.unClosed
|
|
163
160
|
}
|
|
164
|
-
const
|
|
161
|
+
const getTabItemBind = (tab, tabIndex) => {
|
|
165
162
|
let itemStyle = {}
|
|
166
163
|
if (isHorizontal.value) {
|
|
167
164
|
itemStyle.marginTop = tabIndex ? `${props.gutter}px` : 0
|
|
168
165
|
} else {
|
|
169
166
|
itemStyle.marginLeft = tabIndex ? `${props.gutter}px` : 0
|
|
170
167
|
}
|
|
171
|
-
return
|
|
168
|
+
return {
|
|
169
|
+
style: itemStyle,
|
|
170
|
+
class: {
|
|
171
|
+
'sh-tab-item': true,
|
|
172
|
+
'sh-tab-item-disabled': tab.disabled,
|
|
173
|
+
'sh-tab-item-active': tab[props.labelKey] === activeKey.value
|
|
174
|
+
}
|
|
175
|
+
}
|
|
172
176
|
}
|
|
173
177
|
const handleResize = e => {
|
|
174
178
|
const navOffset = isHorizontal.value ? navRef.value.offsetHeight : navRef.value.offsetWidth
|
|
@@ -269,7 +273,7 @@ export default defineComponent({
|
|
|
269
273
|
handleChange,
|
|
270
274
|
handleClose,
|
|
271
275
|
getTabIsClosable,
|
|
272
|
-
|
|
276
|
+
getTabItemBind
|
|
273
277
|
}
|
|
274
278
|
}
|
|
275
279
|
})
|
package/types/alert.ts
CHANGED
|
@@ -1,30 +1,30 @@
|
|
|
1
|
-
import { ShType } from './component'
|
|
2
|
-
|
|
3
|
-
export const alertProps = {
|
|
4
|
-
type: {
|
|
5
|
-
type: String as () => ShType,
|
|
6
|
-
default: 'info'
|
|
7
|
-
},
|
|
8
|
-
title: {
|
|
9
|
-
type: String
|
|
10
|
-
},
|
|
11
|
-
content: {
|
|
12
|
-
type: String
|
|
13
|
-
},
|
|
14
|
-
closable: {
|
|
15
|
-
type: Boolean,
|
|
16
|
-
default: false
|
|
17
|
-
},
|
|
18
|
-
showIcon: {
|
|
19
|
-
type: Boolean,
|
|
20
|
-
default: false
|
|
21
|
-
},
|
|
22
|
-
fade: {
|
|
23
|
-
type: Boolean,
|
|
24
|
-
default: true
|
|
25
|
-
},
|
|
26
|
-
block: {
|
|
27
|
-
type: Boolean,
|
|
28
|
-
default: false
|
|
29
|
-
}
|
|
30
|
-
}
|
|
1
|
+
import { ShType } from './component'
|
|
2
|
+
|
|
3
|
+
export const alertProps = {
|
|
4
|
+
type: {
|
|
5
|
+
type: String as () => ShType,
|
|
6
|
+
default: 'info'
|
|
7
|
+
},
|
|
8
|
+
title: {
|
|
9
|
+
type: String
|
|
10
|
+
},
|
|
11
|
+
content: {
|
|
12
|
+
type: String
|
|
13
|
+
},
|
|
14
|
+
closable: {
|
|
15
|
+
type: Boolean,
|
|
16
|
+
default: false
|
|
17
|
+
},
|
|
18
|
+
showIcon: {
|
|
19
|
+
type: Boolean,
|
|
20
|
+
default: false
|
|
21
|
+
},
|
|
22
|
+
fade: {
|
|
23
|
+
type: Boolean,
|
|
24
|
+
default: true
|
|
25
|
+
},
|
|
26
|
+
block: {
|
|
27
|
+
type: Boolean,
|
|
28
|
+
default: false
|
|
29
|
+
}
|
|
30
|
+
}
|
package/types/component.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export type ShType = 'info' | 'success' | 'warning' | 'error'
|
|
1
|
+
export type ShType = 'info' | 'success' | 'warning' | 'error'
|