@tuya-miniapp/smart-ui 2.9.3-beta-0 → 2.9.3-beta.popover1

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.
@@ -26,6 +26,7 @@
26
26
  options="{{ item.values }}"
27
27
  disabled="{{ item.disabled || false }}"
28
28
  unit="{{ item.unit || unit }}"
29
+ unit-gap="{{ item.unitGap }}"
29
30
  changeAnimation="{{ changeAnimation }}"
30
31
  default-index="{{ item.defaultIndex || defaultIndex }}"
31
32
  active-index="{{ (item.activeIndex === null || item.activeIndex === undefined) ? activeIndex : item.activeIndex }}"
@@ -57,6 +57,10 @@ SmartComponent({
57
57
  type: String,
58
58
  value: '',
59
59
  },
60
+ unitGap: {
61
+ type: null,
62
+ value: undefined,
63
+ },
60
64
  animationTime: {
61
65
  type: Number,
62
66
  value: 300,
@@ -53,7 +53,7 @@
53
53
  <view wx:if="{{unit}}" class="smart-picker-column__unit" style="height: {{ itemHeight }}px">
54
54
  <view class="smart-picker-column__max-text" style="{{fontStyle}}">
55
55
  {{ maxText }}
56
- <view class="smart-picker-column__unit_text" >{{unit}}</view>
56
+ <view class="smart-picker-column__unit_text" style="{{computed.unitGapStyle(unitGap)}}">{{unit}}</view>
57
57
  </view>
58
58
  </view>
59
59
 
@@ -3,6 +3,15 @@ var style = require('../wxs/style.wxs');
3
3
  var addUnit = require('../wxs/add-unit.wxs');
4
4
  var wxUtils = require('../wxs/utils.wxs');
5
5
 
6
+ function unitGapStyle(unitGap) {
7
+ if (unitGap === undefined || unitGap === null) {
8
+ return '';
9
+ }
10
+ return style({
11
+ 'margin-left': addUnit(unitGap)
12
+ });
13
+ }
14
+
6
15
  function setStyle(ownerInstance, style, selector) {
7
16
  var dom = wxUtils.queryComponent(ownerInstance, selector);
8
17
  if (!dom) {
@@ -628,4 +637,5 @@ module.exports = {
628
637
  touchMove: touchMove,
629
638
  touchEnd: touchEnd,
630
639
  tapItem: tapItem,
640
+ unitGapStyle: unitGapStyle,
631
641
  };
@@ -23,18 +23,22 @@ SmartComponent({
23
23
  value: 'right',
24
24
  },
25
25
  show: {
26
- type: Boolean,
26
+ type: null,
27
27
  observer(value) {
28
+ // 动态设置受控模式:如果 show 有值(不是 undefined 或 null),则为受控模式
29
+ // 如果 show 为 undefined 或 null,则为非受控模式
30
+ const isControlled = value !== undefined && value !== null;
31
+ this.setData({ isControlled });
28
32
  if (this.data.cancel_timer) {
29
33
  clearTimeout(this.data.cancel_timer);
30
34
  this.data.cancel_timer = null;
31
35
  }
32
36
  if (value !== this.data.currentShow) {
33
37
  if (value) {
34
- this.onOpen();
38
+ this.onOpen(false);
35
39
  }
36
40
  else {
37
- this.onClose();
41
+ this.onClose(false);
38
42
  }
39
43
  }
40
44
  },
@@ -57,7 +61,7 @@ SmartComponent({
57
61
  value: 3000,
58
62
  },
59
63
  },
60
- data: { currentShow: false, showStyle: '', cancel_timer: null },
64
+ data: { currentShow: false, showStyle: '', cancel_timer: null, isControlled: false },
61
65
  mounted() { },
62
66
  created() { },
63
67
  methods: {
@@ -169,10 +173,22 @@ SmartComponent({
169
173
  this.setData(params);
170
174
  },
171
175
  onClick() {
176
+ // 如果是受控模式,点击时触发事件让外部处理
177
+ if (this.data.isControlled) {
178
+ // 受控模式下,如果 show 为 false,触发事件让外部决定是否打开
179
+ // 如果 show 为 true,可能不需要处理(或者可以关闭?)
180
+ this.$emit('show-change', !this.data.show);
181
+ return;
182
+ }
183
+ // 非受控模式下,如果 show 明确为 false,则不打开
184
+ // show 为 undefined 时表示未传值,允许打开
185
+ if (this.data.show === false) {
186
+ return;
187
+ }
172
188
  this.onOpen();
173
189
  },
174
190
  noop() { },
175
- onOpen() {
191
+ onOpen(trigger = true) {
176
192
  this.getButtonPosition();
177
193
  this.setData({
178
194
  currentShow: true,
@@ -182,14 +198,14 @@ SmartComponent({
182
198
  showStyle: 'opacity: 1;',
183
199
  });
184
200
  }, 100);
185
- this.$emit('show-change', true);
201
+ trigger && this.$emit('show-change', true);
186
202
  if (this.data.duration) {
187
203
  this.data.cancel_timer = setTimeout(() => {
188
- this.onClose();
204
+ this.onClose(trigger);
189
205
  }, this.data.duration);
190
206
  }
191
207
  },
192
- onClose() {
208
+ onClose(trigger = true) {
193
209
  if (this.data.cancel_timer) {
194
210
  clearTimeout(this.data.cancel_timer);
195
211
  this.data.cancel_timer = null;
@@ -201,6 +217,9 @@ SmartComponent({
201
217
  this.setData({
202
218
  currentShow: false,
203
219
  });
220
+ if (!trigger) {
221
+ return;
222
+ }
204
223
  this.$emit('show-change', false);
205
224
  this.$emit('close', false);
206
225
  }, 300);
@@ -26,6 +26,7 @@
26
26
  options="{{ item.values }}"
27
27
  disabled="{{ item.disabled || false }}"
28
28
  unit="{{ item.unit || unit }}"
29
+ unit-gap="{{ item.unitGap }}"
29
30
  changeAnimation="{{ changeAnimation }}"
30
31
  default-index="{{ item.defaultIndex || defaultIndex }}"
31
32
  active-index="{{ (item.activeIndex === null || item.activeIndex === undefined) ? activeIndex : item.activeIndex }}"
@@ -62,6 +62,10 @@ var getId = function () {
62
62
  type: String,
63
63
  value: '',
64
64
  },
65
+ unitGap: {
66
+ type: null,
67
+ value: undefined,
68
+ },
65
69
  animationTime: {
66
70
  type: Number,
67
71
  value: 300,
@@ -53,7 +53,7 @@
53
53
  <view wx:if="{{unit}}" class="smart-picker-column__unit" style="height: {{ itemHeight }}px">
54
54
  <view class="smart-picker-column__max-text" style="{{fontStyle}}">
55
55
  {{ maxText }}
56
- <view class="smart-picker-column__unit_text" >{{unit}}</view>
56
+ <view class="smart-picker-column__unit_text" style="{{computed.unitGapStyle(unitGap)}}">{{unit}}</view>
57
57
  </view>
58
58
  </view>
59
59
 
@@ -3,6 +3,15 @@ var style = require('../wxs/style.wxs');
3
3
  var addUnit = require('../wxs/add-unit.wxs');
4
4
  var wxUtils = require('../wxs/utils.wxs');
5
5
 
6
+ function unitGapStyle(unitGap) {
7
+ if (unitGap === undefined || unitGap === null) {
8
+ return '';
9
+ }
10
+ return style({
11
+ 'margin-left': addUnit(unitGap)
12
+ });
13
+ }
14
+
6
15
  function setStyle(ownerInstance, style, selector) {
7
16
  var dom = wxUtils.queryComponent(ownerInstance, selector);
8
17
  if (!dom) {
@@ -628,4 +637,5 @@ module.exports = {
628
637
  touchMove: touchMove,
629
638
  touchEnd: touchEnd,
630
639
  tapItem: tapItem,
640
+ unitGapStyle: unitGapStyle,
631
641
  };
@@ -36,18 +36,22 @@ function createSvgIcon(svg) {
36
36
  value: 'right',
37
37
  },
38
38
  show: {
39
- type: Boolean,
39
+ type: null,
40
40
  observer: function (value) {
41
+ // 动态设置受控模式:如果 show 有值(不是 undefined 或 null),则为受控模式
42
+ // 如果 show 为 undefined 或 null,则为非受控模式
43
+ var isControlled = value !== undefined && value !== null;
44
+ this.setData({ isControlled: isControlled });
41
45
  if (this.data.cancel_timer) {
42
46
  clearTimeout(this.data.cancel_timer);
43
47
  this.data.cancel_timer = null;
44
48
  }
45
49
  if (value !== this.data.currentShow) {
46
50
  if (value) {
47
- this.onOpen();
51
+ this.onOpen(false);
48
52
  }
49
53
  else {
50
- this.onClose();
54
+ this.onClose(false);
51
55
  }
52
56
  }
53
57
  },
@@ -70,7 +74,7 @@ function createSvgIcon(svg) {
70
74
  value: 3000,
71
75
  },
72
76
  },
73
- data: { currentShow: false, showStyle: '', cancel_timer: null },
77
+ data: { currentShow: false, showStyle: '', cancel_timer: null, isControlled: false },
74
78
  mounted: function () { },
75
79
  created: function () { },
76
80
  methods: {
@@ -182,11 +186,24 @@ function createSvgIcon(svg) {
182
186
  this.setData(params);
183
187
  },
184
188
  onClick: function () {
189
+ // 如果是受控模式,点击时触发事件让外部处理
190
+ if (this.data.isControlled) {
191
+ // 受控模式下,如果 show 为 false,触发事件让外部决定是否打开
192
+ // 如果 show 为 true,可能不需要处理(或者可以关闭?)
193
+ this.$emit('show-change', !this.data.show);
194
+ return;
195
+ }
196
+ // 非受控模式下,如果 show 明确为 false,则不打开
197
+ // show 为 undefined 时表示未传值,允许打开
198
+ if (this.data.show === false) {
199
+ return;
200
+ }
185
201
  this.onOpen();
186
202
  },
187
203
  noop: function () { },
188
- onOpen: function () {
204
+ onOpen: function (trigger) {
189
205
  var _this = this;
206
+ if (trigger === void 0) { trigger = true; }
190
207
  this.getButtonPosition();
191
208
  this.setData({
192
209
  currentShow: true,
@@ -196,15 +213,16 @@ function createSvgIcon(svg) {
196
213
  showStyle: 'opacity: 1;',
197
214
  });
198
215
  }, 100);
199
- this.$emit('show-change', true);
216
+ trigger && this.$emit('show-change', true);
200
217
  if (this.data.duration) {
201
218
  this.data.cancel_timer = setTimeout(function () {
202
- _this.onClose();
219
+ _this.onClose(trigger);
203
220
  }, this.data.duration);
204
221
  }
205
222
  },
206
- onClose: function () {
223
+ onClose: function (trigger) {
207
224
  var _this = this;
225
+ if (trigger === void 0) { trigger = true; }
208
226
  if (this.data.cancel_timer) {
209
227
  clearTimeout(this.data.cancel_timer);
210
228
  this.data.cancel_timer = null;
@@ -216,6 +234,9 @@ function createSvgIcon(svg) {
216
234
  _this.setData({
217
235
  currentShow: false,
218
236
  });
237
+ if (!trigger) {
238
+ return;
239
+ }
219
240
  _this.$emit('show-change', false);
220
241
  _this.$emit('close', false);
221
242
  }, 300);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tuya-miniapp/smart-ui",
3
- "version": "2.9.3-beta-0",
3
+ "version": "2.9.3-beta.popover1",
4
4
  "author": "MiniApp Team",
5
5
  "license": "MIT",
6
6
  "miniprogram": "lib",