stellar-ui-plus 1.20.22 → 1.20.23

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.
Files changed (6) hide show
  1. package/components/ste-function-list/ste-function-list.vue +16 -23
  2. package/components/ste-goods-info/ste-goods-info.easycom.json +3 -3
  3. package/components/ste-goods-info/ste-goods-info.vue +34 -23
  4. package/components/ste-order-card/README.md +134 -8
  5. package/components/ste-order-card/ste-order-card.easycom.json +61 -11
  6. package/package.json +1 -1
package/components/ste-function-list/ste-function-list.vue CHANGED
@@ -12,23 +12,23 @@ const rootStyle = computed(() => {
12
12
  });
13
13
 
14
14
  const emits = defineEmits<{
15
- (e: 'click-header', type: 'title' | 'subhead' | 'more'): void;
16
- (e: 'click-item', type: 'image' | 'title' | 'subhead' | 'status' | 'button', item: FunctionListItem): void;
15
+ (e: 'click-header', type: 'empty' | 'title' | 'subhead' | 'more'): void;
16
+ (e: 'click-item', type: 'empty' | 'image' | 'title' | 'subhead' | 'status' | 'button', item: FunctionListItem): void;
17
17
  (e: 'click-empty', type: 'image' | 'text' | 'button'): void;
18
18
  }>();
19
19
 
20
- const onClickHeader = (type: 'title' | 'subhead' | 'more') => emits('click-header', type);
20
+ const onClickHeader = (type: 'empty' | 'title' | 'subhead' | 'more') => emits('click-header', type);
21
21
 
22
- const onClickItem = (type: 'image' | 'title' | 'subhead' | 'status' | 'button', item: FunctionListItem) => emits('click-item', type, item);
22
+ const onClickItem = (type: 'empty' | 'image' | 'title' | 'subhead' | 'status' | 'button', item: FunctionListItem) => emits('click-item', type, item);
23
23
 
24
24
  const onClickEmpty = (type: 'image' | 'text' | 'button') => emits('click-empty', type);
25
25
  </script>
26
26
  <template>
27
27
  <view class="ste-function-list-root" :style="[rootStyle]">
28
- <view class="ste-function-list-header">
28
+ <view class="ste-function-list-header" @click="onClickHeader('empty')">
29
29
  <view class="ste-function-list-header-l">
30
- <view class="ste-function-list-title" @click="onClickHeader('title')">{{ title }}</view>
31
- <view class="ste-function-list-subhead" @click="onClickHeader('subhead')">
30
+ <view class="ste-function-list-title" @click.stop="onClickHeader('title')">{{ title }}</view>
31
+ <view class="ste-function-list-subhead" @click.stop="onClickHeader('subhead')">
32
32
  <slot name="subhead">
33
33
  {{ subhead }}
34
34
  </slot>
@@ -36,7 +36,7 @@ const onClickEmpty = (type: 'image' | 'text' | 'button') => emits('click-empty',
36
36
  </view>
37
37
  <view class="ste-function-list-header-r">
38
38
  <slot name="header-right">
39
- <view class="ste-function-list-more" @click="onClickHeader('more')">
39
+ <view class="ste-function-list-more" @click.stop="onClickHeader('more')">
40
40
  更多
41
41
  <ste-icon code="&#xe674;" color="#353535"></ste-icon>
42
42
  </view>
@@ -45,24 +45,17 @@ const onClickEmpty = (type: 'image' | 'text' | 'button') => emits('click-empty',
45
45
  </view>
46
46
  <view class="ste-function-list-content" v-if="data?.length">
47
47
  <scroll-view scroll-x class="content-list" :class="{ multiple: data?.length > 1 }">
48
- <view class="content-list-item" v-for="(item, index) in data" :key="index">
49
- <view class="content-list-item-image" @click="onClickItem('image', item)">
48
+ <view class="content-list-item" v-for="(item, index) in data" :key="index" @click="onClickItem('empty', item)">
49
+ <view class="content-list-item-image" @click.stop="onClickItem('image', item)">
50
50
  <ste-image :src="item.image" mode="aspectFill"></ste-image>
51
51
  </view>
52
52
  <view class="content-list-item-info">
53
- <view class="content-list-item-info-title" @click="onClickItem('title', item)">{{ item.title }}</view>
54
- <view class="content-list-item-info-subhead" v-if="item.subhead" @click="onClickItem('subhead', item)">{{ item.subhead }}</view>
53
+ <view class="content-list-item-info-title" @click.stop="onClickItem('title', item)">{{ item.title }}</view>
54
+ <view class="content-list-item-info-subhead" v-if="item.subhead" @click.stop="onClickItem('subhead', item)">{{ item.subhead }}</view>
55
55
  <view class="content-list-item-info-footer">
56
- <view class="content-list-item-info-status" @click="onClickItem('status', item)">{{ item.statusText }}</view>
57
- <view class="content-list-item-info-button" v-if="item.buttonText || buttonText || item.buttonIcon || buttonIcon">
58
- <ste-button
59
- :mode="100"
60
- :rootStyle="{ height: '56rpx' }"
61
- type="primary"
62
- @click="onClickItem('button', item)"
63
- :background="item.buttonBg || buttonBg"
64
- :color="item.buttonColor || buttonColor"
65
- >
56
+ <view class="content-list-item-info-status" @click.stop="onClickItem('status', item)">{{ item.statusText }}</view>
57
+ <view class="content-list-item-info-button" v-if="item.buttonText || buttonText || item.buttonIcon || buttonIcon" @click.stop="onClickItem('button', item)">
58
+ <ste-button :mode="100" :rootStyle="{ height: '56rpx' }" type="primary" :background="item.buttonBg || buttonBg" :color="item.buttonColor || buttonColor">
66
59
  <ste-icon :code="item.buttonIcon || buttonIcon" :color="item.buttonColor || buttonColor" />
67
60
  {{ item.buttonText || buttonText }}
68
61
  </ste-button>
@@ -73,7 +66,7 @@ const onClickEmpty = (type: 'image' | 'text' | 'button') => emits('click-empty',
73
66
  </scroll-view>
74
67
  </view>
75
68
  <view class="ste-function-list-empty" v-else>
76
- <ste-image :src="emptyImage" width="96" height="96" @clicl="onClickEmpty('image')" />
69
+ <ste-image :src="emptyImage" width="96" height="96" @click="onClickEmpty('image')" />
77
70
  <view class="empty-message" @click="onClickEmpty('text')">{{ emptyText }}</view>
78
71
  <ste-button :mode="100" :rootStyle="{ height: '56rpx' }" type="primary" :background="buttonBg" :color="buttonColor" @click="onClickEmpty('button')">
79
72
  {{ emptyButtonText }}
package/components/ste-goods-info/ste-goods-info.easycom.json CHANGED
@@ -189,11 +189,11 @@
189
189
  {
190
190
  "name": "[event]click",
191
191
  "description": "点击确定按钮时触发",
192
- "type": "(type: 'image' | 'title' | 'code' | 'price' | 'originalPrice' | 'stepper') => void",
192
+ "type": "(type:'empty' | 'image' | 'title' | 'code' | 'price' | 'originalPrice' | 'stepper') => void",
193
193
  "params": [
194
194
  {
195
195
  "name": "type",
196
- "description": "点击位置:'image' | 'title' | 'code' | 'price' | 'originalPrice' | 'stepper'"
196
+ "description": "点击位置: `empty` , `image` , `title` , `code` , `price` , `originalPrice` , `stepper`"
197
197
  }
198
198
  ]
199
199
  },
@@ -250,7 +250,7 @@
250
250
  "params": [
251
251
  {
252
252
  "name": "type",
253
- "description": "点击的区域：'method' | 'back' | 'item' | 'right'"
253
+ "description": "点击的区域：`method`, `back`, `item`, `right`"
254
254
  },
255
255
  {
256
256
  "name": "item",
package/components/ste-goods-info/ste-goods-info.vue CHANGED
@@ -16,7 +16,7 @@ const emits = defineEmits<{
16
16
  (e: 'update:number', number?: number): void;
17
17
  (e: 'update:checked', checked?: boolean): void;
18
18
  (e: 'change', change: { number?: number; checked?: boolean; applyForNumber?: number }, data: GoodsInfoType): void;
19
- (e: 'click', type: 'image' | 'title' | 'code' | 'price' | 'originalPrice' | 'stepper'): void;
19
+ (e: 'click', type: 'empty' | 'image' | 'title' | 'code' | 'price' | 'originalPrice' | 'stepper'): void;
20
20
  (e: 'plus', value: number | string, suspend: () => void, next: () => void, stop: () => void): void;
21
21
  (e: 'minus', value: number | string, suspend: () => void, next: () => void, stop: () => void): void;
22
22
  (e: 'click-suggest', type: 'method' | 'back' | 'item' | 'right', item?: { label: string; value: string | number }): void;
@@ -83,7 +83,7 @@ const checkboxChange = () => {
83
83
  emits('change', { checked: _checked.value }, props.data);
84
84
  };
85
85
 
86
- const onClick = (type: 'image' | 'title' | 'code' | 'price' | 'originalPrice' | 'stepper') => {
86
+ const onClick = (type: 'empty' | 'image' | 'title' | 'code' | 'price' | 'originalPrice' | 'stepper') => {
87
87
  emits('click', type);
88
88
  };
89
89
 
@@ -168,14 +168,14 @@ const viewClass = computed(() => {
168
168
  <view @click="clickChecked" class="ste-goods-info-checkbox left" v-if="checkbox === 'left'">
169
169
  <setCheckbox :disabled="checkboxDisabled" iconSize="30" :model-value="_checked" />
170
170
  </view>
171
- <view class="ste-goods-info-view" :class="viewClass">
172
- <view class="ste-goods-info-image">
173
- <setImage :radius="imageRadius" :src="data.image" :width="imageSize" :height="imageSize" @click="onClick('image')" />
171
+ <view class="ste-goods-info-view" :class="viewClass" @click="onClick('empty')">
172
+ <view class="ste-goods-info-image" @click.stop="onClick('image')">
173
+ <setImage :radius="imageRadius" :src="data.image" :width="imageSize" :height="imageSize" />
174
174
  </view>
175
175
  <view class="ste-goods-info-content">
176
176
  <view class="content-header">
177
177
  <view class="ste-goods-info-header">
178
- <view class="ste-goods-info-title" :style="[titleStyle]" @click="onClick('title')">
178
+ <view class="ste-goods-info-title" :style="[titleStyle]" @click.stop="onClick('title')">
179
179
  <view class="ste-goods-info-tag-box" v-if="data.tag">
180
180
  <view class="ste-goods-info-tag" :style="{ background: _tagBg }">{{ data.tag }}</view>
181
181
  </view>
@@ -185,7 +185,7 @@ const viewClass = computed(() => {
185
185
  <setCheckbox :disabled="checkboxDisabled" iconSize="30" :model-value="_checked" />
186
186
  </view>
187
187
  </view>
188
- <view class="ste-goods-info-codes" @click="onClick('code')">
188
+ <view class="ste-goods-info-codes" @click.stop="onClick('code')">
189
189
  {{ data.code }}
190
190
  <span style="color: #e6e8ea">|</span>
191
191
  {{ data.barCode }}
@@ -196,21 +196,26 @@ const viewClass = computed(() => {
196
196
  </view>
197
197
  <view class="content-footer">
198
198
  <view class="ste-goods-info-price" v-if="showPriceRow">
199
- <view class="ste-goods-info-price-left" v-if="!hidePrice">
200
- <setPrice :value="data.price" :digits="2" bold :styleType="3" :line-price-color="priceColor" :fontSize="priceSize" @click="onClick('price')" />
201
- <setPrice
202
- v-if="data.originalPrice"
203
- :digits="2"
204
- :value="data.originalPrice"
205
- isSuggestPrice
206
- line-price-color="#666666"
207
- marginLeft="16"
208
- fontSize="20"
209
- @click="onClick('originalPrice')"
210
- :showUnit="false"
211
- />
199
+ <view class="ste-goods-info-price-left">
200
+ <block v-if="!hidePrice">
201
+ <view @click.stop="onClick('price')">
202
+ <setPrice :value="data.price" :digits="2" bold :styleType="3" :line-price-color="priceColor" :fontSize="priceSize" />
203
+ </view>
204
+ <view @click.stop="onClick('originalPrice')">
205
+ <setPrice
206
+ v-if="data.originalPrice"
207
+ :digits="2"
208
+ :value="data.originalPrice"
209
+ isSuggestPrice
210
+ line-price-color="#666666"
211
+ marginLeft="16"
212
+ fontSize="20"
213
+ :showUnit="false"
214
+ />
215
+ </view>
216
+ </block>
212
217
  </view>
213
- <view class="ste-goods-info-price-right" @click="onClick('stepper')">
218
+ <view class="ste-goods-info-price-right" @click.stop="onClick('stepper')">
214
219
  <slot name="stepper">
215
220
  <view v-if="stepper" :class="{ readonly: readonlyStepper }" @click.stop="true">
216
221
  <steStepper
@@ -347,10 +352,16 @@ const viewClass = computed(() => {
347
352
 
348
353
  .ste-goods-info-price {
349
354
  width: 100%;
350
- height: 34rpx;
355
+ line-height: 34rpx;
351
356
  display: flex;
352
357
  justify-content: space-between;
353
- align-items: anchor-center;
358
+ align-items: center;
359
+ .ste-goods-info-price-left {
360
+ display: flex;
361
+ flex-direction: row;
362
+ align-items: flex-end;
363
+ }
364
+
354
365
  .ste-goods-info-price-right .readonly {
355
366
  pointer-events: none;
356
367
  }
package/components/ste-order-card/README.md CHANGED
@@ -4,25 +4,151 @@
4
4
 
5
5
  ---$
6
6
 
7
- ### 基础用法
7
+ ### 基础用法(一条数据)
8
8
 
9
9
  - 属性`title`用于设置组件标题
10
- - 属性`subhead`用于设置组件副标题
10
+ - 属性`image`用于设置标题图片
11
11
  - 属性`data`用于设置组件数据
12
- - 属性`buttonText`用于设置数据项按钮文字缺省值
13
- - 属性`buttonIcon`用于设置数据项按钮图标缺省值
12
+ - 属性`statusText`用于设置状态文本内容
13
+ - 属性`tagText`用于设置标签文本内容
14
+ - 属性`helperText`用于设置标签辅助信息文本内容
15
+ - 属性`mainBtnText`用于设置主要按钮文本内容
16
+ - 属性`subBtnText`用于设置次要按钮文本内容
14
17
 
15
18
  ```html
16
19
  <script setup lang="ts">
17
- import type { FunctionListItem } from 'stellar-ui-plus/components/ste-function-list/props';
18
20
  import { ref } from 'vue';
19
21
 
20
- const data = ref<FunctionListItem[]>([
21
- { title: '早餐 梅姨家常菜', subhead: '红烧牛肉面、海盐芝士燕麦奶、黑胡椒香煎鸡蛋', statusText: '当前不可取消', image: 'https://image.whzb.com/chain/StellarUI/bg1.jpg' },
22
+ const data = ref([
23
+ {
24
+ image: 'https://image.whzb.com/chain/StellarUI/bg1.jpg',
25
+ title: '梅姨家常菜馆',
26
+ subTitle: '商品描述',
27
+ },
22
28
  ]);
23
29
  </script>
24
30
  <template>
25
- <ste-function-list title="今日餐食" subhead="食刻准备 到点开吃" :data="data" buttonText="核销" buttonIcon="&#xe693;" />
31
+ <ste-order-card
32
+ title="梅姨家常菜馆"
33
+ image="https://image.whzb.com/chain/StellarUI/bg1.jpg"
34
+ :data="data"
35
+ statusText="待核销"
36
+ tagText="标签"
37
+ helperText="辅助信息：XXXX-XX-XX"
38
+ mainBtnText="主要功能"
39
+ subBtnText="次要功能"
40
+ />
41
+ </template>
42
+ ```
43
+
44
+ ### 显示详情(一条数据)
45
+
46
+ - 属性`show-detail`用于设置商品信息下是否显示详情字样(多条数据无效)
47
+
48
+ ```html
49
+ <script setup lang="ts">
50
+ import { ref } from 'vue';
51
+
52
+ const data = ref([
53
+ {
54
+ image: 'https://image.whzb.com/chain/StellarUI/bg1.jpg',
55
+ title: '梅姨家常菜馆',
56
+ subTitle: '商品描述',
57
+ },
58
+ ]);
59
+ </script>
60
+ <template>
61
+ <ste-order-card
62
+ title="梅姨家常菜馆"
63
+ image="https://image.whzb.com/chain/StellarUI/bg1.jpg"
64
+ :data="data"
65
+ statusText="待核销"
66
+ tagText="标签"
67
+ helperText="辅助信息：XXXX-XX-XX"
68
+ mainBtnText="主要功能"
69
+ subBtnText="次要功能"
70
+ show-detail
71
+ />
72
+ </template>
73
+ ```
74
+
75
+ ### 基础用法(多条数据)
76
+
77
+ ```html
78
+ <script setup lang="ts">
79
+ import { ref } from 'vue';
80
+
81
+ const data = ref([
82
+ {
83
+ image: 'https://image.whzb.com/chain/StellarUI/bg1.jpg',
84
+ title: '梅姨家常菜馆',
85
+ subTitle: '商品描述',
86
+ },
87
+ {
88
+ image: 'https://image.whzb.com/chain/StellarUI/bg1.jpg',
89
+ title: '梅姨家常菜馆',
90
+ subTitle: '商品描述',
91
+ },
92
+ {
93
+ image: 'https://image.whzb.com/chain/StellarUI/bg1.jpg',
94
+ title: '梅姨家常菜馆',
95
+ subTitle: '商品描述',
96
+ },
97
+ ]);
98
+ </script>
99
+ <template>
100
+ <ste-order-card
101
+ title="梅姨家常菜馆"
102
+ image="https://image.whzb.com/chain/StellarUI/bg1.jpg"
103
+ :data="data"
104
+ statusText="待核销"
105
+ tagText="标签"
106
+ helperText="辅助信息：XXXX-XX-XX"
107
+ mainBtnText="主要功能"
108
+ subBtnText="次要功能"
109
+ show-detail
110
+ />
111
+ </template>
112
+ ```
113
+
114
+ ### 显示更多
115
+
116
+ - 属性`show-more`设置下方按钮左侧是否显示更多字样
117
+
118
+ ```html
119
+ <script setup lang="ts">
120
+ import { ref } from 'vue';
121
+
122
+ const data = ref([
123
+ {
124
+ image: 'https://image.whzb.com/chain/StellarUI/bg1.jpg',
125
+ title: '梅姨家常菜馆',
126
+ subTitle: '商品描述',
127
+ },
128
+ {
129
+ image: 'https://image.whzb.com/chain/StellarUI/bg1.jpg',
130
+ title: '梅姨家常菜馆',
131
+ subTitle: '商品描述',
132
+ },
133
+ {
134
+ image: 'https://image.whzb.com/chain/StellarUI/bg1.jpg',
135
+ title: '梅姨家常菜馆',
136
+ subTitle: '商品描述',
137
+ },
138
+ ]);
139
+ </script>
140
+ <template>
141
+ <ste-order-card
142
+ title="梅姨家常菜馆"
143
+ image="https://image.whzb.com/chain/StellarUI/bg1.jpg"
144
+ :data="data"
145
+ statusText="待核销"
146
+ tagText="标签"
147
+ helperText="辅助信息：XXXX-XX-XX"
148
+ mainBtnText="主要功能"
149
+ subBtnText="次要功能"
150
+ show-more
151
+ />
26
152
  </template>
27
153
  ```
28
154
 
package/components/ste-order-card/ste-order-card.easycom.json CHANGED
@@ -47,31 +47,81 @@
47
47
  "default": "[]"
48
48
  },
49
49
  {
50
- "name": "background",
51
- "description": "组件背景色",
52
- "type": "string",
53
- "default": "#fff"
50
+ "name": "count",
51
+ "description": "总数",
52
+ "type": "number",
53
+ "default": "0"
54
54
  },
55
55
  {
56
- "name": "background",
57
- "description": "组件背景色",
56
+ "name": "price",
57
+ "description": "订单金额（分）",
58
+ "type": "number",
59
+ "default": "0"
60
+ },
61
+ {
62
+ "name": "mainBtnText",
63
+ "description": "主要功能按钮文本",
64
+ "type": "string"
65
+ },
66
+ {
67
+ "name": "mainBtnBg",
68
+ "description": "主要功能按钮背景",
58
69
  "type": "string",
59
- "default": "#fff"
70
+ "default": "#EC3E1A"
60
71
  },
61
72
  {
62
- "name": "background",
63
- "description": "组件背景色",
73
+ "name": "mainBtnTextColor",
74
+ "description": "主要功能按钮文本颜色",
64
75
  "type": "string",
65
76
  "default": "#fff"
66
77
  },
78
+ {
79
+ "name": "subBtnText",
80
+ "description": "次功能按钮文本",
81
+ "type": "string"
82
+ },
83
+ {
84
+ "name": "showDetail",
85
+ "description": "是否显示详情(单条数据时生效)",
86
+ "type": "boolean",
87
+ "default": "false"
88
+ },
89
+ {
90
+ "name": "showMore",
91
+ "description": "是否显示更多",
92
+ "type": "boolean",
93
+ "default": "false"
94
+ },
67
95
  {
68
96
  "name": "[event]click-header",
97
+ "description": "点击头部触发",
98
+ "type": "(type: 'empty' | 'title' | 'image' | 'status' | 'tag' | 'helper') => void",
99
+ "params": [
100
+ {
101
+ "name": "type",
102
+ "description": "点击的区域类型（可选值：`empty`,`image`, `title`, `status`, `tag`, `helper`）"
103
+ }
104
+ ]
105
+ },
106
+ {
107
+ "name": "[event]click-item",
108
+ "description": "点击商品项触发",
109
+ "type": "(type: 'empty' | 'image' | 'title' | 'sub-title' | 'details') => void",
110
+ "params": [
111
+ {
112
+ "name": "type",
113
+ "description": "点击的区域类型（可选值：`empty`,`image`, `title`, `sub-title`, `details`）"
114
+ }
115
+ ]
116
+ },
117
+ {
118
+ "name": "[event]click-button",
69
119
  "description": "点击列表头部触发",
70
- "type": "(type: 'title' | 'subhead' | 'more') => void",
120
+ "type": "(type: 'primary' | 'secondary' | 'more') => void",
71
121
  "params": [
72
122
  {
73
123
  "name": "type",
74
- "description": "点击的区域类型（可选值：`title`, `subhead`,`more`）"
124
+ "description": "点击的区域类型（可选值：`primary`,`secondary`, `more`）"
75
125
  }
76
126
  ]
77
127
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "stellar-ui-plus",
3
- "version": "1.20.22",
3
+ "version": "1.20.23",
4
4
  "description": "",
5
5
  "author": "",
6
6
  "license": "MIT",