hy-app 0.5.10 → 0.5.11

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 (286) hide show
  1. package/components/hy-action-sheet/hy-action-sheet.vue +200 -200
  2. package/components/hy-action-sheet/props.ts +71 -71
  3. package/components/hy-action-sheet/typing.d.ts +64 -64
  4. package/components/hy-address-picker/hy-address-picker.vue +1 -1
  5. package/components/hy-address-picker/props.ts +100 -100
  6. package/components/hy-address-picker/typing.d.ts +16 -16
  7. package/components/hy-avatar/hy-avatar.vue +163 -163
  8. package/components/hy-avatar/props.ts +78 -78
  9. package/components/hy-avatar/typing.d.ts +4 -4
  10. package/components/hy-back-top/hy-back-top.vue +90 -90
  11. package/components/hy-back-top/props.ts +60 -60
  12. package/components/hy-back-top/typing.d.ts +4 -4
  13. package/components/hy-badge/hy-badge.vue +97 -97
  14. package/components/hy-badge/props.ts +82 -82
  15. package/components/hy-badge/typing.d.ts +9 -9
  16. package/components/hy-button/hy-button.vue +275 -275
  17. package/components/hy-button/props.ts +135 -135
  18. package/components/hy-button/typing.d.ts +30 -30
  19. package/components/hy-calendar/header.vue +60 -60
  20. package/components/hy-calendar/hy-calendar.vue +362 -362
  21. package/components/hy-calendar/month.vue +537 -537
  22. package/components/hy-calendar/props.ts +159 -159
  23. package/components/hy-calendar/typing.d.ts +6 -6
  24. package/components/hy-card/hy-card.vue +161 -161
  25. package/components/hy-card/props.ts +122 -122
  26. package/components/hy-card/typing.d.ts +12 -12
  27. package/components/hy-cell/hy-cell.vue +33 -33
  28. package/components/hy-cell/props.ts +54 -54
  29. package/components/hy-cell/typing.d.ts +4 -4
  30. package/components/hy-cell-item/hy-cell-item.vue +161 -161
  31. package/components/hy-cell-item/props.ts +66 -66
  32. package/components/hy-cell-item/typing.d.ts +7 -7
  33. package/components/hy-check-button/hy-check-button.vue +96 -96
  34. package/components/hy-check-button/props.ts +74 -74
  35. package/components/hy-check-button/typing.d.ts +44 -44
  36. package/components/hy-checkbox/hy-checkbox.vue +227 -227
  37. package/components/hy-checkbox/props.ts +96 -96
  38. package/components/hy-checkbox/typing.d.ts +8 -8
  39. package/components/hy-checkbox-group/hy-checkbox-group.vue +45 -45
  40. package/components/hy-checkbox-group/props.ts +80 -80
  41. package/components/hy-checkbox-group/typing.d.ts +6 -6
  42. package/components/hy-checkbox-item/hy-checkbox-item.vue +199 -199
  43. package/components/hy-checkbox-item/props.ts +24 -24
  44. package/components/hy-checkbox-item/typing.d.ts +7 -7
  45. package/components/hy-code-input/hy-code-input.vue +231 -231
  46. package/components/hy-code-input/props.ts +88 -88
  47. package/components/hy-code-input/typing.d.ts +8 -8
  48. package/components/hy-config-provider/hy-config-provider.vue +53 -53
  49. package/components/hy-config-provider/props.ts +28 -28
  50. package/components/hy-count-down/hy-count-down.vue +170 -170
  51. package/components/hy-count-down/index.ts +52 -52
  52. package/components/hy-count-down/props.ts +32 -32
  53. package/components/hy-count-down/typing.d.ts +14 -14
  54. package/components/hy-count-to/hy-count-to.vue +218 -218
  55. package/components/hy-count-to/props.ts +62 -62
  56. package/components/hy-count-to/typing.d.ts +4 -4
  57. package/components/hy-coupon/hy-coupon.vue +172 -172
  58. package/components/hy-coupon/index.scss +171 -171
  59. package/components/hy-coupon/props.ts +103 -103
  60. package/components/hy-coupon/typing.d.ts +14 -14
  61. package/components/hy-datetime-picker/hy-datetime-picker.vue +521 -521
  62. package/components/hy-datetime-picker/props.ts +142 -142
  63. package/components/hy-datetime-picker/typing.d.ts +20 -20
  64. package/components/hy-divider/hy-divider.vue +132 -132
  65. package/components/hy-divider/props.ts +80 -80
  66. package/components/hy-dropdown/hy-dropdown.vue +60 -60
  67. package/components/hy-dropdown/props.ts +40 -40
  68. package/components/hy-dropdown-item/hy-dropdown-item.vue +206 -206
  69. package/components/hy-dropdown-item/props.ts +21 -21
  70. package/components/hy-dropdown-item/typing.d.ts +17 -17
  71. package/components/hy-empty/hy-empty.vue +116 -116
  72. package/components/hy-empty/icon.ts +72 -72
  73. package/components/hy-empty/props.ts +60 -60
  74. package/components/hy-empty/typing.d.ts +38 -38
  75. package/components/hy-flex/hy-flex.vue +53 -53
  76. package/components/hy-flex/index.scss +8 -8
  77. package/components/hy-flex/props.ts +58 -58
  78. package/components/hy-flex/typing.d.ts +21 -21
  79. package/components/hy-float-button/hy-float-button.vue +378 -378
  80. package/components/hy-float-button/props.ts +111 -111
  81. package/components/hy-float-button/typing.d.ts +35 -35
  82. package/components/hy-folding-panel/hy-folding-panel.vue +109 -109
  83. package/components/hy-folding-panel/props.ts +42 -42
  84. package/components/hy-folding-panel/typing.d.ts +19 -19
  85. package/components/hy-folding-panel-item/hy-folding-panel-item.vue +183 -183
  86. package/components/hy-folding-panel-item/props.ts +81 -81
  87. package/components/hy-folding-panel-item/typing.d.ts +37 -37
  88. package/components/hy-form/hy-form.vue +220 -220
  89. package/components/hy-form/props.ts +37 -37
  90. package/components/hy-form/typing.d.ts +41 -41
  91. package/components/hy-form-group/hy-form-group.vue +333 -333
  92. package/components/hy-form-group/props.ts +105 -105
  93. package/components/hy-form-item/hy-form-item.vue +176 -176
  94. package/components/hy-form-item/index.scss +0 -1
  95. package/components/hy-form-item/props.ts +25 -25
  96. package/components/hy-form-item/typing.d.ts +30 -30
  97. package/components/hy-grid/hy-grid.vue +109 -109
  98. package/components/hy-grid/props.ts +60 -60
  99. package/components/hy-grid/typing.d.ts +35 -35
  100. package/components/hy-icon/hy-icon.vue +112 -112
  101. package/components/hy-icon/index.scss +0 -3
  102. package/components/hy-icon/props.ts +79 -79
  103. package/components/hy-icon/typing.d.ts +9 -9
  104. package/components/hy-image/hy-image.vue +192 -192
  105. package/components/hy-image/props.ts +107 -107
  106. package/components/hy-image/typing.d.ts +10 -10
  107. package/components/hy-input/hy-input.vue +333 -333
  108. package/components/hy-input/props.ts +186 -186
  109. package/components/hy-input/typing.d.ts +31 -31
  110. package/components/hy-line/hy-line.vue +55 -55
  111. package/components/hy-line/props.ts +43 -43
  112. package/components/hy-line-progress/hy-line-progress.vue +102 -102
  113. package/components/hy-line-progress/props.ts +33 -33
  114. package/components/hy-list/hy-list.vue +226 -226
  115. package/components/hy-list/props.ts +69 -69
  116. package/components/hy-list/typing.d.ts +6 -6
  117. package/components/hy-loading/hy-loading.vue +107 -107
  118. package/components/hy-loading/props.ts +65 -65
  119. package/components/hy-menu/hy-menu.vue +159 -159
  120. package/components/hy-menu/props.ts +44 -44
  121. package/components/hy-menu/typing.d.ts +34 -34
  122. package/components/hy-modal/hy-modal.vue +173 -173
  123. package/components/hy-modal/props.ts +90 -90
  124. package/components/hy-modal/typing.d.ts +11 -11
  125. package/components/hy-navbar/hy-navbar.vue +144 -144
  126. package/components/hy-navbar/props.ts +78 -78
  127. package/components/hy-navbar/typing.d.ts +6 -6
  128. package/components/hy-notice-bar/hy-column-notice.vue +94 -94
  129. package/components/hy-notice-bar/hy-notice-bar.vue +96 -96
  130. package/components/hy-notice-bar/hy-row-notice.vue +121 -121
  131. package/components/hy-notice-bar/props.ts +85 -85
  132. package/components/hy-notice-bar/typing.d.ts +8 -8
  133. package/components/hy-notify/hy-notify.vue +174 -174
  134. package/components/hy-notify/props.ts +51 -51
  135. package/components/hy-number-step/hy-number-step.vue +367 -367
  136. package/components/hy-number-step/props.ts +112 -112
  137. package/components/hy-number-step/typing.d.ts +16 -16
  138. package/components/hy-overlay/hy-overlay.vue +60 -60
  139. package/components/hy-overlay/props.ts +33 -33
  140. package/components/hy-overlay/typing.d.ts +4 -4
  141. package/components/hy-pagination/hy-pagination.vue +135 -135
  142. package/components/hy-pagination/props.ts +55 -55
  143. package/components/hy-pagination/typing.d.ts +10 -10
  144. package/components/hy-picker/hy-picker.vue +7 -5
  145. package/components/hy-picker/props.ts +7 -2
  146. package/components/hy-picker/typing.d.ts +9 -5
  147. package/components/hy-popover/hy-popover.vue +251 -251
  148. package/components/hy-popover/props.ts +51 -51
  149. package/components/hy-popover/typing.d.ts +39 -39
  150. package/components/hy-popup/hy-popup.vue +197 -197
  151. package/components/hy-popup/props.ts +85 -85
  152. package/components/hy-popup/typing.d.ts +10 -10
  153. package/components/hy-price/hy-price.vue +79 -79
  154. package/components/hy-price/props.ts +54 -54
  155. package/components/hy-price/typing.d.ts +4 -4
  156. package/components/hy-qrcode/hy-qrcode.vue +216 -216
  157. package/components/hy-qrcode/props.ts +70 -70
  158. package/components/hy-qrcode/qrcode.js +1304 -1304
  159. package/components/hy-qrcode/typing.d.ts +8 -8
  160. package/components/hy-radio/hy-radio.vue +226 -226
  161. package/components/hy-radio/props.ts +1 -1
  162. package/components/hy-radio/typing.d.ts +8 -8
  163. package/components/hy-rate/hy-rate.vue +239 -239
  164. package/components/hy-rate/props.ts +77 -77
  165. package/components/hy-rate/typing.d.ts +6 -6
  166. package/components/hy-read-more/hy-read-more.vue +130 -130
  167. package/components/hy-read-more/props.ts +45 -45
  168. package/components/hy-read-more/typing.d.ts +6 -6
  169. package/components/hy-rolling-num/hy-rolling-num.vue +188 -188
  170. package/components/hy-rolling-num/props.ts +68 -68
  171. package/components/hy-scroll-list/hy-scroll-list.vue +123 -123
  172. package/components/hy-scroll-list/props.ts +22 -22
  173. package/components/hy-scroll-list/typing.d.ts +6 -6
  174. package/components/hy-search/hy-search.vue +221 -221
  175. package/components/hy-search/props.ts +131 -131
  176. package/components/hy-search/typing.d.ts +22 -22
  177. package/components/hy-signature/hy-signature.vue +640 -640
  178. package/components/hy-signature/props.ts +118 -118
  179. package/components/hy-signature/typing.d.ts +93 -93
  180. package/components/hy-slider/hy-slider.vue +444 -444
  181. package/components/hy-slider/props.ts +77 -77
  182. package/components/hy-slider/typing.d.ts +10 -10
  183. package/components/hy-status-bar/hy-status-bar.vue +41 -41
  184. package/components/hy-status-bar/props.ts +8 -8
  185. package/components/hy-status-bar/typing.d.ts +12 -12
  186. package/components/hy-steps/hy-steps.vue +267 -267
  187. package/components/hy-steps/props.ts +49 -49
  188. package/components/hy-steps/typing.d.ts +21 -21
  189. package/components/hy-sticky/hy-sticky.vue +226 -226
  190. package/components/hy-sticky/props.ts +24 -24
  191. package/components/hy-sticky/typing.d.ts +4 -4
  192. package/components/hy-submit-bar/hy-submit-bar.vue +189 -189
  193. package/components/hy-submit-bar/props.ts +91 -91
  194. package/components/hy-submit-bar/typing.d.ts +24 -24
  195. package/components/hy-subsection/hy-subsection.vue +207 -207
  196. package/components/hy-subsection/props.ts +52 -52
  197. package/components/hy-subsection/typing.d.ts +13 -13
  198. package/components/hy-swipe-action/hy-swipe-action.vue +323 -323
  199. package/components/hy-swipe-action/index.ts +25 -25
  200. package/components/hy-swipe-action/props.ts +47 -47
  201. package/components/hy-swipe-action/typing.d.ts +25 -25
  202. package/components/hy-swiper/hy-swiper-indicator.vue +75 -75
  203. package/components/hy-swiper/hy-swiper.vue +224 -224
  204. package/components/hy-swiper/props.ts +128 -128
  205. package/components/hy-swiper/typing.d.ts +26 -26
  206. package/components/hy-switch/hy-switch.vue +173 -173
  207. package/components/hy-switch/props.ts +61 -61
  208. package/components/hy-switch/typing.d.ts +8 -8
  209. package/components/hy-tabbar/hy-tabbar.vue +136 -136
  210. package/components/hy-tabbar/props.ts +59 -59
  211. package/components/hy-tabbar/typing.d.ts +21 -21
  212. package/components/hy-tabbar-group/hy-tabbar-group.vue +87 -87
  213. package/components/hy-tabbar-group/props.ts +78 -78
  214. package/components/hy-tabbar-group/typing.d.ts +16 -16
  215. package/components/hy-tabbar-item/hy-tabbar-item.vue +103 -103
  216. package/components/hy-tabbar-item/typing.d.ts +10 -10
  217. package/components/hy-table/hy-table.vue +358 -358
  218. package/components/hy-table/props.ts +47 -47
  219. package/components/hy-table/typing.d.ts +34 -34
  220. package/components/hy-tabs/hy-tabs.vue +335 -335
  221. package/components/hy-tabs/props.ts +77 -77
  222. package/components/hy-tabs/typing.d.ts +33 -33
  223. package/components/hy-tag/hy-tag.vue +174 -174
  224. package/components/hy-tag/props.ts +89 -89
  225. package/components/hy-tag/typing.d.ts +13 -13
  226. package/components/hy-text/hy-text.vue +237 -237
  227. package/components/hy-text/props.ts +115 -115
  228. package/components/hy-text/typing.d.ts +6 -6
  229. package/components/hy-textarea/hy-textarea.vue +197 -197
  230. package/components/hy-textarea/props.ts +116 -116
  231. package/components/hy-textarea/typing.d.ts +22 -22
  232. package/components/hy-toast/hy-toast.vue +190 -190
  233. package/components/hy-toast/typing.d.ts +38 -38
  234. package/components/hy-tooltip/hy-tooltip.vue +277 -277
  235. package/components/hy-tooltip/props.ts +78 -78
  236. package/components/hy-tooltip/typing.d.ts +4 -4
  237. package/components/hy-transition/hy-transition.vue +157 -157
  238. package/components/hy-transition/props.ts +32 -32
  239. package/components/hy-transition/typing.d.ts +16 -16
  240. package/components/hy-upload/hy-upload.vue +385 -385
  241. package/components/hy-upload/props.ts +132 -132
  242. package/components/hy-upload/typing.d.ts +65 -65
  243. package/components/hy-warn/hy-warn.vue +115 -115
  244. package/components/hy-warn/props.ts +49 -49
  245. package/components/hy-warn/typing.d.ts +6 -6
  246. package/components/hy-waterfall/hy-waterfall.vue +191 -191
  247. package/components/hy-waterfall/props.ts +21 -21
  248. package/components/hy-watermark/hy-watermark.vue +978 -978
  249. package/components/hy-watermark/props.ts +104 -104
  250. package/components/index.ts +183 -183
  251. package/global.d.ts +91 -91
  252. package/index.ts +1 -1
  253. package/libs/api/http.ts +140 -140
  254. package/libs/api/index.ts +1 -1
  255. package/libs/common/index.ts +2 -2
  256. package/libs/common/queue.ts +28 -28
  257. package/libs/composables/index.ts +6 -6
  258. package/libs/composables/usePopover.ts +241 -241
  259. package/libs/composables/useQueue.ts +53 -53
  260. package/libs/composables/useShakeService.ts +64 -64
  261. package/libs/composables/useShare.ts +42 -42
  262. package/libs/composables/useToast.ts +45 -45
  263. package/libs/composables/useTouch.ts +51 -51
  264. package/libs/config/color.ts +7 -7
  265. package/libs/config/icon.ts +430 -430
  266. package/libs/config/index.ts +2 -2
  267. package/libs/css/iconfont.css +443 -443
  268. package/libs/global/index.ts +6 -6
  269. package/libs/global/register-properties.ts +37 -37
  270. package/libs/index.ts +7 -7
  271. package/libs/typing/index.ts +4 -4
  272. package/libs/typing/modules/common.d.ts +139 -139
  273. package/libs/typing/modules/enum.ts +67 -67
  274. package/libs/typing/modules/form.ts +5 -1
  275. package/libs/typing/modules/http.ts +17 -17
  276. package/libs/typing/modules/icon.d.ts +366 -366
  277. package/libs/typing/modules/rect.ts +10 -10
  278. package/libs/utils/base64.ts +119 -119
  279. package/libs/utils/calendar.js +1021 -1021
  280. package/libs/utils/colorGradient.ts +112 -112
  281. package/libs/utils/index.ts +5 -5
  282. package/libs/utils/inside.ts +350 -350
  283. package/libs/utils/inspect.ts +171 -171
  284. package/libs/utils/utils.ts +521 -521
  285. package/package.json +18 -18
  286. package/web-types.json +1 -1
@@ -1,44 +1,44 @@
1
- import type { MenusType, ModelValueVo } from './typing'
2
- import type { CSSProperties, PropType } from 'vue'
3
- import type { HyIconProps } from '../hy-icon/typing'
4
- import type { HyBadgeProps } from '../hy-badge/typing'
5
-
6
- const menuProps = {
7
- /** 当前值 */
8
- modelValue: [String, Number] as PropType<ModelValueVo>,
9
- /** 菜单数据集 */
10
- list: {
11
- type: Array as PropType<Array<MenusType>>,
12
- default: []
13
- },
14
- /** 对应的键 */
15
- id: {
16
- type: String,
17
- default: 'id'
18
- },
19
- name: {
20
- type: String,
21
- default: 'id'
22
- },
23
- /** 侧边菜单栏宽度 */
24
- width: {
25
- type: [String, Number],
26
- default: 120
27
- },
28
- /** 选中颜色 */
29
- color: String,
30
- /** 图标属性值 */
31
- icon: {
32
- type: Object as PropType<HyIconProps>,
33
- default: {}
34
- },
35
- /** 徽标属性值 */
36
- badge: {
37
- type: Object as PropType<HyBadgeProps>,
38
- default: {}
39
- },
40
- /** 定义需要用到的外部样式 */
41
- customStyle: Object as PropType<CSSProperties>
42
- }
43
-
44
- export default menuProps
1
+ import type { MenusType, ModelValueVo } from './typing'
2
+ import type { CSSProperties, PropType } from 'vue'
3
+ import type { HyIconProps } from '../hy-icon/typing'
4
+ import type { HyBadgeProps } from '../hy-badge/typing'
5
+
6
+ const menuProps = {
7
+ /** 当前值 */
8
+ modelValue: [String, Number] as PropType<ModelValueVo>,
9
+ /** 菜单数据集 */
10
+ list: {
11
+ type: Array as PropType<Array<MenusType>>,
12
+ default: []
13
+ },
14
+ /** 对应的键 */
15
+ id: {
16
+ type: String,
17
+ default: 'id'
18
+ },
19
+ name: {
20
+ type: String,
21
+ default: 'id'
22
+ },
23
+ /** 侧边菜单栏宽度 */
24
+ width: {
25
+ type: [String, Number],
26
+ default: 120
27
+ },
28
+ /** 选中颜色 */
29
+ color: String,
30
+ /** 图标属性值 */
31
+ icon: {
32
+ type: Object as PropType<HyIconProps>,
33
+ default: {}
34
+ },
35
+ /** 徽标属性值 */
36
+ badge: {
37
+ type: Object as PropType<HyBadgeProps>,
38
+ default: {}
39
+ },
40
+ /** 定义需要用到的外部样式 */
41
+ customStyle: Object as PropType<CSSProperties>
42
+ }
43
+
44
+ export default menuProps
@@ -1,34 +1,34 @@
1
- export type ModelValueVo = string | number
2
- export interface MenusType {
3
- /**
4
- * 唯一id
5
- * */
6
- id: string | number
7
- /**
8
- * 标题
9
- * */
10
- title: string
11
- /**
12
- * 是否禁用
13
- * */
14
- disabled?: boolean
15
- /**
16
- * icon
17
- * */
18
- icon?: string
19
- /**
20
- * 徽标值
21
- * */
22
- badge?: number
23
- /**
24
- * 键值
25
- * */
26
- [key: string]: string | number
27
- }
28
-
29
- export interface IMenuEmits {
30
- /** 选中触发 */
31
- (e: 'change', temp: MenusType): void
32
- /** 选中触发 */
33
- (e: 'update:modelValue', id: MenusType['id']): void
34
- }
1
+ export type ModelValueVo = string | number
2
+ export interface MenusType {
3
+ /**
4
+ * 唯一id
5
+ * */
6
+ id: string | number
7
+ /**
8
+ * 标题
9
+ * */
10
+ title: string
11
+ /**
12
+ * 是否禁用
13
+ * */
14
+ disabled?: boolean
15
+ /**
16
+ * icon
17
+ * */
18
+ icon?: string
19
+ /**
20
+ * 徽标值
21
+ * */
22
+ badge?: number
23
+ /**
24
+ * 键值
25
+ * */
26
+ [key: string]: string | number
27
+ }
28
+
29
+ export interface IMenuEmits {
30
+ /** 选中触发 */
31
+ (e: 'change', temp: MenusType): void
32
+ /** 选中触发 */
33
+ (e: 'update:modelValue', id: MenusType['id']): void
34
+ }
@@ -1,173 +1,173 @@
1
- <template>
2
- <HyPopup
3
- mode="center"
4
- :zoom="zoom"
5
- :show="modelValue"
6
- :round="round"
7
- :customStyle="{
8
- overflow: 'hidden',
9
- marginTop: `-${addUnit(negativeTop)}`
10
- }"
11
- :closeOnClickOverlay="closeOnClickOverlay"
12
- :safeAreaInsetBottom="false"
13
- :duration="400"
14
- @click="clickHandler"
15
- >
16
- <view
17
- class="hy-modal"
18
- :style="{
19
- width: addUnit(width)
20
- }"
21
- >
22
- <view class="hy-modal__title" v-if="title">{{ title }}</view>
23
- <view
24
- class="hy-modal__content"
25
- :style="{
26
- paddingTop: `${title ? 12 : 25}px`
27
- }"
28
- >
29
- <slot v-if="$slots.default"></slot>
30
- <text v-else class="hy-modal__content--text">
31
- {{ content }}
32
- </text>
33
- </view>
34
- <view class="hy-modal__button--group__confirm-button" v-if="$slots.confirmButton">
35
- <slot name="confirmButton"></slot>
36
- </view>
37
- <template v-else>
38
- <view
39
- :class="[
40
- 'hy-modal__button--group',
41
- showCancelButton &&
42
- showConfirmButton &&
43
- (!buttonReverse
44
- ? 'hy-modal__button--exact'
45
- : 'hy-modal__button--exact--reverse')
46
- ]"
47
- :style="{
48
- flexDirection: buttonReverse ? 'row-reverse' : 'row'
49
- }"
50
- >
51
- <view
52
- class="hy-modal__button--group__wrapper first hy-modal__button--group__wrapper--cancel"
53
- :hover-stay-time="150"
54
- hover-class="hy-modal__button--group__wrapper--hover"
55
- v-if="showCancelButton"
56
- @tap.stop="cancelHandler"
57
- >
58
- <text
59
- class="hy-modal__button--group__wrapper--text hy-modal__button--group__wrapper--cancel__text"
60
- :style="{
61
- color: cancelColor
62
- }"
63
- >
64
- {{ cancelText }}
65
- </text>
66
- </view>
67
- <view
68
- class="hy-modal__button--group__wrapper last hy-modal__button--group__wrapper--confirm"
69
- :hover-stay-time="150"
70
- hover-class="hy-modal__button--group__wrapper--hover"
71
- v-if="showConfirmButton"
72
- @tap="confirmHandler"
73
- >
74
- <hy-loading v-if="load" mode="circle"></hy-loading>
75
- <text
76
- v-else
77
- class="hy-modal__button--group__wrapper--text hy-modal__button--group__wrapper--confirm__text"
78
- :style="{
79
- color: confirmColor
80
- }"
81
- >
82
- {{ confirmText }}
83
- </text>
84
- </view>
85
- </view>
86
- </template>
87
- </view>
88
- </HyPopup>
89
- </template>
90
-
91
- <script lang="ts">
92
- export default {
93
- name: 'hy-modal',
94
- options: {
95
- addGlobalClass: true,
96
- virtualHost: true,
97
- styleIsolation: 'shared'
98
- }
99
- }
100
- </script>
101
-
102
- <script setup lang="ts">
103
- import { ref, watch } from 'vue'
104
- import type { IModalEmits } from './typing'
105
- import { addUnit, sleep } from '../../libs'
106
- import modalProps from './props'
107
- // 组件
108
- import HyPopup from '../hy-popup/hy-popup.vue'
109
- import HyLoading from '../hy-loading/hy-loading.vue'
110
-
111
- /**
112
- * 弹出模态框,常用于消息提示、消息确认、在当前页面内完成特定的交互操作。
113
- * @displayName hy-modal
114
- */
115
- defineOptions({})
116
-
117
- const props = defineProps(modalProps)
118
- const emit = defineEmits<IModalEmits>()
119
- const load = ref(props.loading)
120
-
121
- watch(
122
- () => props.loading,
123
- (newVal) => {
124
- load.value = props.loading
125
- }
126
- )
127
-
128
- watch(
129
- () => props.modelValue,
130
- (newVal) => {
131
- if (!newVal) load.value = false
132
- }
133
- )
134
-
135
- /**
136
- * @description 点击确定按钮
137
- * */
138
- const confirmHandler = async () => {
139
- if (load.value) return
140
- // 如果配置了异步关闭,将按钮值为loading状态
141
- emit('confirm')
142
-
143
- await sleep()
144
- if (!props.loading && props.autoClose) {
145
- emit('update:modelValue', false)
146
- }
147
- }
148
-
149
- /**
150
- * @description 点击取消按钮
151
- * */
152
- const cancelHandler = () => {
153
- emit('update:modelValue', false)
154
- emit('cancel')
155
- }
156
-
157
- /**
158
- * @description 点击遮罩
159
- * */
160
- const clickHandler = () => {
161
- if (props.closeOnClickOverlay) {
162
- emit('update:modelValue', false)
163
- emit('close')
164
- }
165
- }
166
- </script>
167
-
168
- <style lang="scss" scoped>
169
- @import './index.scss';
170
- .modal__content__text {
171
- text-align: v-bind(contentTextAlign);
172
- }
173
- </style>
1
+ <template>
2
+ <HyPopup
3
+ mode="center"
4
+ :zoom="zoom"
5
+ :show="modelValue"
6
+ :round="round"
7
+ :customStyle="{
8
+ overflow: 'hidden',
9
+ marginTop: `-${addUnit(negativeTop)}`
10
+ }"
11
+ :closeOnClickOverlay="closeOnClickOverlay"
12
+ :safeAreaInsetBottom="false"
13
+ :duration="400"
14
+ @click="clickHandler"
15
+ >
16
+ <view
17
+ class="hy-modal"
18
+ :style="{
19
+ width: addUnit(width)
20
+ }"
21
+ >
22
+ <view class="hy-modal__title" v-if="title">{{ title }}</view>
23
+ <view
24
+ class="hy-modal__content"
25
+ :style="{
26
+ paddingTop: `${title ? 12 : 25}px`
27
+ }"
28
+ >
29
+ <slot v-if="$slots.default"></slot>
30
+ <text v-else class="hy-modal__content--text">
31
+ {{ content }}
32
+ </text>
33
+ </view>
34
+ <view class="hy-modal__button--group__confirm-button" v-if="$slots.confirmButton">
35
+ <slot name="confirmButton"></slot>
36
+ </view>
37
+ <template v-else>
38
+ <view
39
+ :class="[
40
+ 'hy-modal__button--group',
41
+ showCancelButton &&
42
+ showConfirmButton &&
43
+ (!buttonReverse
44
+ ? 'hy-modal__button--exact'
45
+ : 'hy-modal__button--exact--reverse')
46
+ ]"
47
+ :style="{
48
+ flexDirection: buttonReverse ? 'row-reverse' : 'row'
49
+ }"
50
+ >
51
+ <view
52
+ class="hy-modal__button--group__wrapper first hy-modal__button--group__wrapper--cancel"
53
+ :hover-stay-time="150"
54
+ hover-class="hy-modal__button--group__wrapper--hover"
55
+ v-if="showCancelButton"
56
+ @tap.stop="cancelHandler"
57
+ >
58
+ <text
59
+ class="hy-modal__button--group__wrapper--text hy-modal__button--group__wrapper--cancel__text"
60
+ :style="{
61
+ color: cancelColor
62
+ }"
63
+ >
64
+ {{ cancelText }}
65
+ </text>
66
+ </view>
67
+ <view
68
+ class="hy-modal__button--group__wrapper last hy-modal__button--group__wrapper--confirm"
69
+ :hover-stay-time="150"
70
+ hover-class="hy-modal__button--group__wrapper--hover"
71
+ v-if="showConfirmButton"
72
+ @tap="confirmHandler"
73
+ >
74
+ <hy-loading v-if="load" mode="circle"></hy-loading>
75
+ <text
76
+ v-else
77
+ class="hy-modal__button--group__wrapper--text hy-modal__button--group__wrapper--confirm__text"
78
+ :style="{
79
+ color: confirmColor
80
+ }"
81
+ >
82
+ {{ confirmText }}
83
+ </text>
84
+ </view>
85
+ </view>
86
+ </template>
87
+ </view>
88
+ </HyPopup>
89
+ </template>
90
+
91
+ <script lang="ts">
92
+ export default {
93
+ name: 'hy-modal',
94
+ options: {
95
+ addGlobalClass: true,
96
+ virtualHost: true,
97
+ styleIsolation: 'shared'
98
+ }
99
+ }
100
+ </script>
101
+
102
+ <script setup lang="ts">
103
+ import { ref, watch } from 'vue'
104
+ import type { IModalEmits } from './typing'
105
+ import { addUnit, sleep } from '../../libs'
106
+ import modalProps from './props'
107
+ // 组件
108
+ import HyPopup from '../hy-popup/hy-popup.vue'
109
+ import HyLoading from '../hy-loading/hy-loading.vue'
110
+
111
+ /**
112
+ * 弹出模态框,常用于消息提示、消息确认、在当前页面内完成特定的交互操作。
113
+ * @displayName hy-modal
114
+ */
115
+ defineOptions({})
116
+
117
+ const props = defineProps(modalProps)
118
+ const emit = defineEmits<IModalEmits>()
119
+ const load = ref(props.loading)
120
+
121
+ watch(
122
+ () => props.loading,
123
+ (newVal) => {
124
+ load.value = props.loading
125
+ }
126
+ )
127
+
128
+ watch(
129
+ () => props.modelValue,
130
+ (newVal) => {
131
+ if (!newVal) load.value = false
132
+ }
133
+ )
134
+
135
+ /**
136
+ * @description 点击确定按钮
137
+ * */
138
+ const confirmHandler = async () => {
139
+ if (load.value) return
140
+ // 如果配置了异步关闭,将按钮值为loading状态
141
+ emit('confirm')
142
+
143
+ await sleep()
144
+ if (!props.loading && props.autoClose) {
145
+ emit('update:modelValue', false)
146
+ }
147
+ }
148
+
149
+ /**
150
+ * @description 点击取消按钮
151
+ * */
152
+ const cancelHandler = () => {
153
+ emit('update:modelValue', false)
154
+ emit('cancel')
155
+ }
156
+
157
+ /**
158
+ * @description 点击遮罩
159
+ * */
160
+ const clickHandler = () => {
161
+ if (props.closeOnClickOverlay) {
162
+ emit('update:modelValue', false)
163
+ emit('close')
164
+ }
165
+ }
166
+ </script>
167
+
168
+ <style lang="scss" scoped>
169
+ @import './index.scss';
170
+ .modal__content__text {
171
+ text-align: v-bind(contentTextAlign);
172
+ }
173
+ </style>