uview-plus 3.5.41 → 3.5.50

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/changelog.md CHANGED
@@ -1,3 +1,30 @@
1
+ ## 3.5.50(2025-09-18)
2
+ fix: 修复tabbar组件borderColor类型
3
+
4
+ ## 3.5.49(2025-09-18)
5
+ fix: 修复action-sheet列表中第一个item的hover style
6
+
7
+ ## 3.5.48(2025-09-17)
8
+ fix: 修复table2的fixedHeader参数生效
9
+
10
+ ## 3.5.47(2025-09-16)
11
+ fix: 修复modelValue类型
12
+
13
+ ## 3.5.46(2025-09-15)
14
+ feat: table2新增支持span-method合并单元格
15
+
16
+ ## 3.5.45(2025-09-13)
17
+ fix: 修复数据分配时未等待获取元素后再执行下一次循环导致数据插入错误,addTime属性未使用修改。
18
+
19
+ ## 3.5.44(2025-09-12)
20
+ fix: 单选快捷组件作为受控组件,当modelValue清除选择时,组件状态未被清除。
21
+
22
+ ## 3.5.43(2025-09-10)
23
+ fix: 增加subsection兼容性索引转为数字
24
+
25
+ ## 3.5.42(2025-09-09)
26
+ feat: index-list增加下边距高度
27
+
1
28
  ## 3.5.41(2025-09-08)
2
29
  fix: 修复cascader方法引用位置
3
30
 
@@ -65,6 +65,7 @@
65
65
  @tap.stop="selectHandler(index)"
66
66
  :hover-class="!item.disabled && !item.loading ? 'u-action-sheet--hover' : ''"
67
67
  :hover-stay-time="150"
68
+ :style="getItemHoverStyle(index)"
68
69
  >
69
70
  <template v-if="!item.loading">
70
71
  <text
@@ -199,6 +200,16 @@
199
200
  }
200
201
  }
201
202
  },
203
+ // 动态处理Hover时候第一个item的圆角
204
+ getItemHoverStyle(index) {
205
+ if (index === 0 && this.round && !this.title && !this.description) {
206
+ return {
207
+ borderTopLeftRadius: `${this.round}px`,
208
+ borderTopRightRadius: `${this.round}px`,
209
+ }
210
+ }
211
+ return {}
212
+ },
202
213
  }
203
214
  }
204
215
  </script>
@@ -68,7 +68,7 @@ export const props = defineMixin({
68
68
  },
69
69
  // 是否显示
70
70
  modelValue: {
71
- type: [String],
71
+ type: [Boolean],
72
72
  default: () => defProps.alert.value
73
73
  }
74
74
  }
@@ -15,6 +15,7 @@ export default {
15
15
  indexList: [],
16
16
  sticky: true,
17
17
  customNavHeight: 0,
18
- safeBottomFix: false
18
+ safeBottomFix: false,
19
+ itemMargin: '0rpx'
19
20
  }
20
21
  }
@@ -32,5 +32,10 @@ export const props = defineMixin({
32
32
  type: Boolean,
33
33
  default: () => defProps.indexList.safeBottomFix
34
34
  },
35
+ //自定义下边距
36
+ itemMargin: {
37
+ type: String,
38
+ default: () => defProps.indexList.itemMargin
39
+ },
35
40
  }
36
41
  })
@@ -411,12 +411,13 @@
411
411
  const anchors = this.anchors
412
412
  // 由于list组件无法获取cell的top值,这里通过header slot和各个item之间的height,模拟出类似非nvue下的位置信息
413
413
  let children = this.children.map((item, index) => {
414
+ const childHeight = item.height + getPx(this.itemMargin)
414
415
  const child = {
415
- height: item.height,
416
+ height: childHeight,
416
417
  top: top
417
418
  }
418
419
  // 进行累加,给下一个item提供计算依据
419
- top = top + item.height
420
+ top = top + childHeight
420
421
  // #ifdef APP-NVUE
421
422
  // 只有nvue下,需要将锚点的高度也累加,非nvue下锚点高度是包含在index-item中的。
422
423
  top = top + anchors[index].height
@@ -494,12 +495,13 @@
494
495
  const anchors = this.anchors
495
496
  // 由于list组件无法获取cell的top值,这里通过header slot和各个item之间的height,模拟出类似非nvue下的位置信息
496
497
  children = this.children.map((item, index) => {
498
+ const childHeight = item.height + getPx(this.itemMargin)
497
499
  const child = {
498
- height: item.height,
500
+ height: childHeight,
499
501
  top: top
500
502
  }
501
503
  // 进行累加,给下一个item提供计算依据
502
- top = top + item.height
504
+ top = top + childHeight
503
505
  // #ifdef APP-NVUE
504
506
  // 只有nvue下,需要将锚点的高度也累加,非nvue下锚点高度是包含在index-item中的。
505
507
  top = top + anchors[index].height
@@ -71,6 +71,8 @@ export default {
71
71
  this.defaultIndex = [index]
72
72
  }
73
73
  })
74
+ } else {
75
+ this.clear();
74
76
  }
75
77
  },
76
78
  watch: {
@@ -82,6 +84,8 @@ export default {
82
84
  this.defaultIndex = [index]
83
85
  }
84
86
  })
87
+ } else {
88
+ this.clear();
85
89
  }
86
90
  }
87
91
  },
@@ -102,6 +106,10 @@ export default {
102
106
  close() {
103
107
  this.$emit('close')
104
108
  },
109
+ clear() {
110
+ this.current = '';
111
+ this.defaultIndex = [];
112
+ },
105
113
  confirm(e) {
106
114
  const {
107
115
  columnIndex,
@@ -101,7 +101,7 @@ export default {
101
101
  immediate: true,
102
102
  handler(n) {
103
103
  if (n !== this.innerCurrent) {
104
- this.innerCurrent = n
104
+ this.innerCurrent = Number(n)
105
105
  }
106
106
  // #ifdef APP-NVUE
107
107
  // 在安卓nvue上,如果通过translateX进行位移,到最后一个时,会导致右侧无法绘制圆角
@@ -20,7 +20,7 @@ export const props = defineMixin({
20
20
  },
21
21
  // 上方边框颜色
22
22
  borderColor: {
23
- type: Boolean,
23
+ type: String,
24
24
  default: () => defProps.tabbar.borderColor
25
25
  },
26
26
  // 元素层级z-index
@@ -2,9 +2,6 @@
2
2
  .u-table-row {
3
3
  display: flex;
4
4
  flex-direction: row;
5
- align-items: center;
6
- border-bottom: 1px solid #ebeef5;
7
- overflow: hidden;
8
5
  position: relative;
9
6
  }
10
7
 
@@ -26,12 +23,26 @@
26
23
  flex: 1;
27
24
  display: flex;
28
25
  flex-direction: row;
29
- padding: 10px 10px;
26
+ align-items: center;
27
+ padding: 10px 1px;
30
28
  font-size: 14px;
31
29
  white-space: nowrap;
32
30
  overflow: hidden;
33
31
  text-overflow: ellipsis;
34
32
  line-height: 1.1;
33
+ border-bottom: 1px solid #ebeef5;
34
+ &.u-text-left {
35
+ justify-content: flex-start;
36
+ text-align: left;
37
+ }
38
+ &.u-text-center {
39
+ justify-content: center;
40
+ text-align: center;
41
+ }
42
+ &.u-text-right {
43
+ justify-content: flex-end;
44
+ text-align: right;
45
+ }
35
46
  }
36
47
 
37
48
  .u-table-row-zebra {
@@ -48,16 +59,14 @@
48
59
  color: #999;
49
60
  }
50
61
 
51
- .u-text-left {
52
- text-align: left;
62
+ // 隐藏被合并的单元格
63
+ .u-table-cell-hidden {
64
+ opacity: 0;
53
65
  }
54
66
 
55
- .u-text-center {
56
- text-align: center;
57
- }
58
-
59
- .u-text-right {
60
- text-align: right;
67
+ // 合并单元格样式
68
+ .u-table-cell-merged {
69
+ z-index: 1;
61
70
  }
62
71
  </style>
63
72
  <template>
@@ -70,9 +79,10 @@
70
79
  class="u-table-cell"
71
80
  :class="[col.align ? 'u-text-' + col.align : '',
72
81
  cellClassName ? cellClassName(row, col) : '',
73
- getFixedClass(col)
82
+ getFixedClass(col),
83
+ getCellSpanClass(rowIndex, colIndex)
74
84
  ]"
75
- :style="cellStyleInner({row: row, column: col, rowIndex: rowIndex, columnIndex: colIndex, level: level})">
85
+ :style="[cellStyleInner({row: row, column: col, rowIndex: rowIndex, columnIndex: colIndex, level: level}), getCellSpanStyle(rowIndex, colIndex)]">
76
86
  <!-- 复选框列 -->
77
87
  <view v-if="col.type === 'selection'">
78
88
  <checkbox :checked="isSelected(row)"
@@ -122,6 +132,7 @@
122
132
  :selectedRows="selectedRows"
123
133
  :expandWidth="expandWidth"
124
134
  :computed-main-col="computedMainCol"
135
+ :span-method="spanMethod"
125
136
  @toggle-select="$emit('toggleSelect', $event)"
126
137
  @row-click="$emit('rowClick', $event)"
127
138
  @toggle-expand="$emit('toggleExpand', $event)"
@@ -232,12 +243,85 @@ export default {
232
243
  rowHeight: {
233
244
  type: String,
234
245
  required: true
246
+ },
247
+ // 添加spanMethod属性
248
+ spanMethod: {
249
+ type: Function,
250
+ default: null
235
251
  }
236
252
  },
237
253
  emits: ['rowClick', 'toggleExpand', 'toggleSelect'],
238
254
  methods: {
239
255
  isSelected(row) {
240
256
  return this.selectedRows.some(r => r[this.rowKey] === row[this.rowKey]);
257
+ },
258
+ // 获取单元格的合并信息
259
+ getCellSpan(rowIndex, columnIndex) {
260
+ if (typeof this.spanMethod !== 'function') {
261
+ return { rowspan: 1, colspan: 1 };
262
+ }
263
+
264
+ const row = this.row;
265
+ const column = this.columns[columnIndex];
266
+
267
+ const result = this.spanMethod({
268
+ row,
269
+ column,
270
+ rowIndex,
271
+ columnIndex
272
+ });
273
+
274
+ if (Array.isArray(result)) {
275
+ const [rowspan, colspan] = result;
276
+ return { rowspan: rowspan != null ? rowspan : 1, colspan: colspan != null ? colspan : 1 };
277
+ } else if (typeof result === 'object') {
278
+ return {
279
+ rowspan: rowspan != null ? rowspan : 1,
280
+ colspan: colspan != null ? colspan : 1
281
+ };
282
+ }
283
+
284
+ return { rowspan: 1, colspan: 1 };
285
+ },
286
+ // 获取单元格的样式类
287
+ getCellSpanClass(rowIndex, columnIndex) {
288
+ const span = this.getCellSpan(rowIndex, columnIndex);
289
+
290
+ // 如果rowspan为0或colspan为0,表示该单元格被合并,需要隐藏
291
+ if (span.rowspan === 0 || span.colspan === 0) {
292
+ return 'u-table-cell-hidden';
293
+ } else if (span.rowspan > 1 || span.colspan > 1) {
294
+ // 如果有合并,添加合并样式类
295
+ return 'u-table-cell-merged';
296
+ }
297
+
298
+ return '';
299
+ },
300
+ // 获取单元格的样式
301
+ getCellSpanStyle(rowIndex, columnIndex) {
302
+ const span = this.getCellSpan(rowIndex, columnIndex);
303
+ const style = {};
304
+
305
+ // 设置rowspan
306
+ if (span.rowspan > 1) {
307
+ // 正确计算合并后的高度
308
+ const currentHeight = parseInt(this.rowHeight);
309
+ if (!isNaN(currentHeight)) {
310
+ style.height = `${span.rowspan * currentHeight}px`;
311
+ }
312
+ }
313
+
314
+ // 设置colspan
315
+ if (span.colspan > 1) {
316
+ style.flex = span.colspan;
317
+ }
318
+
319
+ // 如果rowspan为0或colspan为0,表示该单元格被合并,需要隐藏
320
+ if (span.rowspan === 0 || span.colspan === 0) {
321
+ style.display = 'none';
322
+ }
323
+
324
+ return style;
241
325
  }
242
326
  }
243
327
  }
@@ -1,15 +1,18 @@
1
1
  <template>
2
2
  <view class="u-table2" :class="{ 'u-table-border': border }">
3
- <scroll-view scroll-x class="u-table2-content" :style="{ height: height ? height + 'px' : 'auto' }" @scroll="onScroll">
3
+ <scroll-view scroll-x scroll-y class="u-table2-content"
4
+ :style="{ height: height ? addUnit(height) : 'auto' }"
5
+ @scroll="onScroll">
4
6
  <!-- 表头 -->
5
- <view v-if="showHeader" class="u-table-header" :class="{ 'u-table-sticky': fixedHeader }" :style="{minWidth: scrollWidth}">
7
+ <view v-if="showHeader" class="u-table-header"
8
+ :class="{ 'u-table-sticky': fixedHeader }"
9
+ :style="{minWidth: scrollWidth}">
6
10
  <view class="u-table-row">
7
11
  <view v-for="(col, colIndex) in columns" :key="col.key" class="u-table-cell"
8
- :style="headerColStyle(col)"
9
- :class="[col.align ? 'u-text-' + col.align : '',
12
+ :class="[col.headerAlign ? 'u-text-' + col.headerAlign : (col.align ? 'u-text-' + col.align : '') ,
10
13
  headerCellClassName ? headerCellClassName(col) : '',
11
14
  getFixedClass(col)
12
- ]" @click="handleHeaderClick(col)">
15
+ ]" :style="headerColStyle(col)" @click="handleHeaderClick(col)">
13
16
  <slot name="header" :column="col" :columnIndex="colIndex" :level="1">
14
17
  </slot>
15
18
  <text v-if="!$slots['header']">{{ col.title }}</text>
@@ -54,6 +57,7 @@
54
57
  :selectedRows="selectedRows"
55
58
  :expandWidth="expandWidth"
56
59
  :computedMainCol="computedMainCol"
60
+ :span-method="spanMethod"
57
61
  @toggle-select="toggleSelect"
58
62
  @row-click="handleRowClick"
59
63
  @toggle-expand="toggleExpand"
@@ -128,6 +132,7 @@
128
132
  :selectedRows="selectedRows"
129
133
  :expandWidth="expandWidth"
130
134
  :computedMainCol="computedMainCol"
135
+ :span-method="spanMethod"
131
136
  @toggle-select="toggleSelect"
132
137
  @row-click="handleRowClick"
133
138
  @toggle-expand="toggleExpand"
@@ -298,8 +303,13 @@ export default {
298
303
  default: '25px'
299
304
  },
300
305
  rowHeight: {
301
- String,
302
- default: '40px'
306
+ type: String,
307
+ default: '36px'
308
+ },
309
+ // 添加spanMethod属性,用于合并单元格
310
+ spanMethod: {
311
+ type: Function,
312
+ default: null
303
313
  }
304
314
  },
305
315
  emits: [
@@ -653,8 +663,6 @@ export default {
653
663
  .u-table-row {
654
664
  display: flex;
655
665
  flex-direction: row;
656
- align-items: center;
657
- border-bottom: 1px solid #ebeef5;
658
666
  overflow: hidden;
659
667
  position: relative;
660
668
  // min-height: 40px;
@@ -678,12 +686,26 @@ export default {
678
686
  flex: 1;
679
687
  display: flex;
680
688
  flex-direction: row;
681
- padding: 10px 10px;
689
+ align-items: center;
690
+ padding: 10px 1px;
682
691
  font-size: 14px;
683
692
  white-space: nowrap;
684
693
  overflow: hidden;
685
694
  text-overflow: ellipsis;
686
695
  line-height: 1.1;
696
+ border-bottom: 1px solid #ebeef5;
697
+ &.u-text-left {
698
+ justify-content: flex-start;
699
+ text-align: left;
700
+ }
701
+ &.u-text-center {
702
+ justify-content: center;
703
+ text-align: center;
704
+ }
705
+ &.u-text-right {
706
+ justify-content: flex-end;
707
+ text-align: right;
708
+ }
687
709
  }
688
710
 
689
711
  .u-table-row-zebra {
@@ -699,18 +721,6 @@ export default {
699
721
  padding: 20px;
700
722
  color: #999;
701
723
  }
702
-
703
- .u-text-left {
704
- text-align: left;
705
- }
706
-
707
- .u-text-center {
708
- text-align: center;
709
- }
710
-
711
- .u-text-right {
712
- text-align: right;
713
- }
714
724
  }
715
725
 
716
726
  // 固定列浮动视图
@@ -155,7 +155,7 @@
155
155
  window.removeEventListener('resize', this.handleWindowResize);
156
156
  }
157
157
  // #endif
158
- }
158
+ },
159
159
  // #endif
160
160
  computed: {
161
161
  // 破坏flowList变量的引用,否则watch的结果新旧值是一样的
@@ -252,8 +252,8 @@
252
252
  this.columnList[minHeightIndex].push(item);
253
253
 
254
254
  // 获取实际渲染后的元素高度而不是估算
255
- await sleep(30)
256
- this.$nextTick(async () => {
255
+ await sleep(this.addTime)
256
+ await this.$nextTick(async () => {
257
257
  try {
258
258
  const rect = await this.$uGetRect(`#u-column-${minHeightIndex}`);
259
259
  // console.log(`#u-column-${minHeightIndex}`, rect.height)
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "id": "uview-plus",
3
3
  "name": "uview-plus",
4
4
  "displayName": "零云®uview-plus3.0重磅发布,全面的Vue3鸿蒙跨端移动组件库,组件丰富维护更新稳定。",
5
- "version": "3.5.41",
5
+ "version": "3.5.50",
6
6
  "description": "零云®uview-plus已兼容vue3支持多语言,120+全面的组件和便捷的工具会让您信手拈来。近期新增拖动排序、条码、图片裁剪、下拉刷新、虚拟列表、签名、Markdown等。",
7
7
  "keywords": [
8
8
  "uview",