cb-biz-ui 1.2.8 → 1.3.0

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.
@@ -1,10 +1,14 @@
1
1
  <template>
2
- <view class="delivery-address" @click="handleClick">
2
+ <view
3
+ class="delivery-address"
4
+ @click="handleClick"
5
+ hover-class="hover-class-opacity"
6
+ >
3
7
  <view class="header">
4
8
  <text class="text">{{ title }}</text>
5
9
  <slot name="tools"></slot>
6
10
  </view>
7
- <view class="content">
11
+ <view class="content" v-if="data.addressId">
8
12
  <view class="user">
9
13
  <view class="user-info">
10
14
  <text>{{ data.receiverName }}</text>
@@ -19,6 +23,10 @@
19
23
  <ui-icon name="arrowright" :size="23" color="#B3BCCD"></ui-icon>
20
24
  </view>
21
25
  </view>
26
+ <view class="error-content" v-else>
27
+ <view class="tip">暂无收获地址</view>
28
+ <view @click="handleAdd" class="btn">新增地址</view>
29
+ </view>
22
30
  </view>
23
31
  </template>
24
32
  <script setup lang="ts">
@@ -37,11 +45,15 @@ const props = withDefaults(defineProps<IProps>(), {
37
45
  });
38
46
  const emit = defineEmits<{
39
47
  (e: 'handleClick', data: storeDeliveryType): void;
48
+ (e: 'handleAdd', data: storeDeliveryType): void;
40
49
  }>();
41
50
 
42
51
  const handleClick = () => {
43
52
  emit('handleClick', props.data);
44
53
  };
54
+ const handleAdd = () => {
55
+ emit('handleAdd', props.data);
56
+ };
45
57
  </script>
46
58
  <style scoped lang="scss">
47
59
  @import '../../libs/css/delivery-address.scss';
@@ -22,13 +22,14 @@
22
22
  <view class="text value">用户范围:{{ userRuleInfoStr }}</view>
23
23
  </view>
24
24
  </view>
25
- <view class="tip-box">
25
+ <view class="tip-box" >
26
26
  <text class="tip">满{{ data.thresholdStr }}可用</text>
27
27
  <view
28
28
  class="button"
29
29
  :class="{ disabled: data.isReceived === 0 ? false : true }"
30
30
  @click="receive"
31
31
  v-if="!use"
32
+ hover-class="hover-class-opacity"
32
33
  >{{ data.isReceived === 0 ? '立即领取' : '已领取' }}</view
33
34
  >
34
35
  <view class="radio" v-else>
@@ -8,7 +8,11 @@
8
8
  </view>
9
9
  <view class="top">
10
10
  <text class="name">{{ name }}</text>
11
- <view class="change" @click="typeChange">
11
+ <view
12
+ class="change"
13
+ hover-class="hover-class-opacity"
14
+ @click="typeChange"
15
+ >
12
16
  <view class="icon">
13
17
  <ui-icon name="exchange" color="#575B66" size="16"></ui-icon
14
18
  ></view>
@@ -23,6 +23,7 @@
23
23
  </view>
24
24
  <view
25
25
  class="button"
26
+ hover-class="hover-class-opacity"
26
27
  v-if="!use"
27
28
  :class="{ disabled: data.isReceived === 0 ? false : true }"
28
29
  @click="receive"
@@ -38,6 +38,7 @@
38
38
  </view>
39
39
  <view
40
40
  class="item goods-price discount-coupon active-class"
41
+ hover-class="hover-class-opacity"
41
42
  @click="selectCoupon"
42
43
  >
43
44
  <view class="label">
@@ -8,7 +8,11 @@
8
8
  <view class="order-remark">
9
9
  <view class="order-remark_header">
10
10
  <text>订单备注</text>
11
- <view class="close" @click="hiddenPopup">
11
+ <view
12
+ class="close"
13
+ @click="hiddenPopup"
14
+ hover-class="hover-class-opacity"
15
+ >
12
16
  <ui-icon name="shut" color="rgb(150,150,150)" size="20"></ui-icon
13
17
  ></view>
14
18
  </view>
@@ -31,6 +35,7 @@
31
35
  <view class="tag-box">
32
36
  <view
33
37
  class="tag-item"
38
+ hover-class="hover-class-opacity"
34
39
  @click="select(item)"
35
40
  v-for="(item, index) in recommendTags"
36
41
  :key="index"
@@ -21,6 +21,7 @@
21
21
  </view>
22
22
  <view
23
23
  class="button"
24
+ hover-class="hover-class-opacity"
24
25
  v-if="!use"
25
26
  :class="{ disabled: data.isReceived === 0 ? false : true }"
26
27
  @click="receive"
@@ -4,9 +4,7 @@
4
4
  border-radius: 4rpx;
5
5
  overflow: hidden;
6
6
  line-height: 1;
7
- &:active{
8
- opacity: .8;
9
- }
7
+
10
8
  .header {
11
9
  display: flex;
12
10
  align-items: center;
@@ -17,6 +15,7 @@
17
15
  border-bottom: 1rpx solid #eaeaea;
18
16
  padding: 25rpx 36rpx;
19
17
  }
18
+
20
19
  .content {
21
20
  display: flex;
22
21
  align-items: center;
@@ -25,22 +24,56 @@
25
24
  padding-right: 23rpx;
26
25
  color: #333;
27
26
  font-size: 28rpx;
27
+
28
28
  .user {
29
29
  flex: 1;
30
+
30
31
  .user-info {
31
32
  display: flex;
32
33
  align-items: center;
33
34
  justify-content: space-between;
34
35
  margin-bottom: 25rpx;
35
36
  }
37
+
36
38
  .address {
37
39
  .text {
38
40
  line-height: 1.3;
39
41
  }
40
42
  }
41
43
  }
44
+
42
45
  .icon-box {
43
46
  margin-left: 5rpx;
44
47
  }
45
48
  }
49
+
50
+ .error-content {
51
+ line-height: 1;
52
+ padding: 20rpx 0;
53
+
54
+ .tip {
55
+ color: #b3b3b3;
56
+ font-size: 30rpx;
57
+ text-align: center;
58
+ }
59
+
60
+ .btn {
61
+ display: flex;
62
+ justify-content: center;
63
+ align-items: center;
64
+ width: 200rpx;
65
+ padding: 14rpx 0;
66
+ text-align: center;
67
+ color: #fff;
68
+ background-color: #ff524f;
69
+ font-size: 26rpx;
70
+ border-radius: 32rpx;
71
+ margin: 0 auto;
72
+ margin-top: 25rpx;
73
+ }
74
+ }
46
75
  }
76
+
77
+ .hover-class-opacity {
78
+ opacity: .8;
79
+ }
@@ -217,10 +217,10 @@
217
217
  rgb(255, 196, 178) 100%);
218
218
  box-shadow: 0px 2rpx 5rpx rgb(255, 46, 53);
219
219
 
220
- &:active {
221
- opacity: 0.8;
222
- // box-shadow: 0px 0px 0px rgb(255, 46, 53);
223
- }
220
+ }
221
+
222
+ .hover-class-opacity {
223
+ opacity: .8;
224
224
  }
225
225
 
226
226
  .disabled {
@@ -234,4 +234,4 @@
234
234
  color: #fff5db;
235
235
  }
236
236
  }
237
- }
237
+ }
@@ -33,14 +33,14 @@
33
33
  align-items: center;
34
34
  color: #999999;
35
35
  font-size: 26rpx;
36
- &:active {
37
- opacity: 0.8;
38
- }
39
- .icon {
36
+ .icon {
40
37
  margin-right: 10rpx;
41
38
  transform: rotate(90deg);
42
39
  }
43
40
  }
41
+ .hover-class-opacity {
42
+ opacity: .8;
43
+ }
44
44
  }
45
45
  .form {
46
46
  .item {
@@ -108,10 +108,11 @@
108
108
  box-shadow: 0px 2rpx 9rpx rgba(0, 147, 255, 0.3);
109
109
  border-radius: 26.75rpx;
110
110
 
111
- &:active {
112
- opacity: 0.8;
113
- }
111
+
114
112
  }
113
+ .hover-class-opacity {
114
+ opacity: .8;
115
+ }
115
116
 
116
117
  .use {
117
118
  position: absolute;
@@ -38,10 +38,11 @@
38
38
  }
39
39
  }
40
40
  .active-class {
41
- &:active {
42
- opacity: 0.8;
43
- }
41
+
44
42
  }
43
+ .hover-class-opacity {
44
+ opacity: .8;
45
+ }
45
46
  .delivery {
46
47
  margin-bottom: 20rpx;
47
48
  .value {
@@ -1,5 +1,6 @@
1
1
  .order-remark {
2
2
  padding-top: 30rpx;
3
+
3
4
  .order-remark_header {
4
5
  padding: 0 30rpx;
5
6
  display: flex;
@@ -11,30 +12,37 @@
11
12
  margin-bottom: 30rpx;
12
13
  text-align: center;
13
14
  position: relative;
15
+
14
16
  .close {
15
17
  position: absolute;
16
18
  right: 40rpx;
17
- &:active{
18
- opacity: .8;
19
- }
19
+ }
20
+
21
+ .hover-class-opacity {
22
+ opacity: .8;
20
23
  }
21
24
  }
25
+
22
26
  .content {
23
27
  padding: 0 30rpx;
24
28
  }
29
+
25
30
  .tag-content {
26
31
  margin-top: 20rpx;
27
32
  padding: 0 30rpx;
33
+
28
34
  .tip {
29
35
  font-size: 26rpx;
30
36
  color: #6d7278;
31
37
  font-weight: 600;
32
38
  margin-bottom: 20rpx;
33
39
  }
40
+
34
41
  .tag-box {
35
42
  display: flex;
36
43
  align-items: center;
37
44
  flex-wrap: wrap;
45
+
38
46
  .tag-item {
39
47
  margin-left: 10rpx;
40
48
  margin-bottom: 10rpx;
@@ -47,13 +55,15 @@
47
55
  cursor: pointer;
48
56
  display: inline-block;
49
57
  max-width: 100%;
50
- &:active {
51
- background: rgb(242, 20, 12);
52
- color: #fff;
53
- }
58
+
59
+ }
60
+
61
+ .hover-class-opacity {
62
+ opacity: .8;
54
63
  }
55
64
  }
56
65
  }
66
+
57
67
  .submit {
58
68
  width: 100%;
59
69
  margin-top: 30rpx;
@@ -65,4 +75,4 @@
65
75
  align-items: center;
66
76
  justify-content: center;
67
77
  }
68
- }
78
+ }
@@ -129,11 +129,10 @@
129
129
  rgb(255, 255, 255) 5.848%,
130
130
  rgb(195, 233, 255) 94.497%);
131
131
  box-shadow: 0px 2px 8px rgb(0, 107, 239);
132
+ }
132
133
 
133
- &:active {
134
- opacity: 0.8;
135
- // box-shadow: 0px 0px 0px rgb(255, 46, 53);
136
- }
134
+ .hover-class-opacity {
135
+ opacity: .8;
137
136
  }
138
137
 
139
138
  .disabled {
@@ -148,4 +147,4 @@
148
147
  color: #fff5db;
149
148
  }
150
149
  }
151
- }
150
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "cb-biz-ui",
3
- "version": "1.2.8",
3
+ "version": "1.3.0",
4
4
  "description": "cb-biz-ui",
5
5
  "main": "index.js",
6
6
  "keywords": [