@uxda/appkit 4.3.40 → 4.3.42

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 (139) hide show
  1. package/.cursor/skills/appkit-build-update-component-rules/SKILL.md +54 -54
  2. package/.cursor/skills/appkit-sync-component-rules/SKILL.md +60 -60
  3. package/.eslintrc.mjs +7 -7
  4. package/Appkit/347/273/204/344/273/266/344/275/277/347/224/250/350/247/204/345/210/231.md +2002 -2002
  5. package/PROJECT_DOCS.md +150 -142
  6. package/README.md +194 -194
  7. package/babel.config.js +12 -12
  8. package/dist/appkit.css +3 -3
  9. package/dist/index.js +4 -4
  10. package/package.json +82 -82
  11. package/project.config.json +15 -15
  12. package/project.tt.json +13 -13
  13. package/rollup.config.mjs +81 -81
  14. package/src/Appkit.ts +72 -72
  15. package/src/balance/api/endpoints.ts +134 -134
  16. package/src/balance/api/index.ts +118 -118
  17. package/src/balance/components/AccountView.vue +850 -850
  18. package/src/balance/components/BalanceCard.vue +210 -210
  19. package/src/balance/components/BalanceReminder.vue +84 -84
  20. package/src/balance/components/ConsumptionFilter.vue +218 -218
  21. package/src/balance/components/ConsumptionRules.vue +68 -68
  22. package/src/balance/components/DateFilter.vue +259 -259
  23. package/src/balance/components/DateRange.vue +111 -111
  24. package/src/balance/components/ListFilter.vue +62 -62
  25. package/src/balance/components/ListFilterPicker.vue +191 -191
  26. package/src/balance/components/PromoterCard.vue +308 -308
  27. package/src/balance/components/SecondBalance.vue +77 -77
  28. package/src/balance/components/Tip.vue +45 -45
  29. package/src/balance/components/index.ts +8 -8
  30. package/src/balance/types.ts +99 -99
  31. package/src/components/bt-cropper/index.vue +730 -730
  32. package/src/components/bt-cropper/utils/calcCropper.js +42 -42
  33. package/src/components/bt-cropper/utils/calcImagePosition.js +23 -23
  34. package/src/components/bt-cropper/utils/calcImageSize.js +37 -37
  35. package/src/components/bt-cropper/utils/calcPointDistance.js +12 -12
  36. package/src/components/bt-cropper/utils/calcRightAndBottom.js +7 -7
  37. package/src/components/bt-cropper/utils/ratio.js +3 -3
  38. package/src/components/bt-cropper/utils/tools.js +25 -25
  39. package/src/components/dd-area/index.vue +225 -225
  40. package/src/components/dd-icon/doc.md +21 -21
  41. package/src/components/dd-icon/index.vue +23 -23
  42. package/src/components/dd-notice-bar/index.vue +78 -78
  43. package/src/components/dd-search/doc.md +34 -34
  44. package/src/components/dd-search/index.vue +168 -168
  45. package/src/components/dd-selector/index.vue +124 -124
  46. package/src/components/dd-skeleton/doc.md +19 -19
  47. package/src/components/dd-skeleton/index.vue +36 -36
  48. package/src/global.ts +6 -6
  49. package/src/index.ts +101 -101
  50. package/src/main.scss +1 -1
  51. package/src/notice/api/endpoints.ts +54 -54
  52. package/src/notice/api/index.ts +121 -121
  53. package/src/notice/components/NoticeBanner.vue +247 -247
  54. package/src/notice/components/NoticeEntry.vue +99 -99
  55. package/src/notice/components/NoticeList.vue +311 -311
  56. package/src/notice/components/NoticeList2.vue +401 -401
  57. package/src/notice/components/NoticePopup.vue +163 -163
  58. package/src/notice/components/index.ts +6 -6
  59. package/src/notice/components/useCommonList.ts +87 -87
  60. package/src/notice/components/useNotice.ts +35 -35
  61. package/src/notice/index.ts +1 -1
  62. package/src/notice/types.ts +25 -25
  63. package/src/payment/api/config.ts +7 -7
  64. package/src/payment/api/endpoints.ts +112 -112
  65. package/src/payment/api/index.ts +108 -108
  66. package/src/payment/components/AmountPicker.vue +56 -56
  67. package/src/payment/components/RechargeResult.vue +68 -68
  68. package/src/payment/components/RechargeView.vue +420 -420
  69. package/src/payment/components/RightsPicker.vue +105 -105
  70. package/src/payment/components/TradeView.vue +627 -627
  71. package/src/payment/components/UserAgreement.vue +234 -234
  72. package/src/payment/components/index.ts +22 -22
  73. package/src/payment/components/recharge-amount.spec.ts +54 -54
  74. package/src/payment/components/recharge-amount.ts +67 -67
  75. package/src/payment/index.ts +5 -5
  76. package/src/payment/services/index.ts +16 -16
  77. package/src/payment/services/invoke-recharge.ts +25 -25
  78. package/src/payment/services/request-payment.ts +136 -136
  79. package/src/payment/types.ts +34 -34
  80. package/src/register/components/SelfRegistration.vue +233 -233
  81. package/src/register/components/index.ts +2 -2
  82. package/src/scenarios/components/SharePoster.vue +364 -364
  83. package/src/scenarios/components/index.ts +2 -2
  84. package/src/scenarios/components/poster-paste.vue +93 -93
  85. package/src/scenarios/components/share-poster.md +273 -273
  86. package/src/shared/components/AppDrawer.vue +53 -53
  87. package/src/shared/components/AppVerify.vue +137 -137
  88. package/src/shared/components/DeviceVersion.vue +78 -78
  89. package/src/shared/components/EmptyView.vue +33 -33
  90. package/src/shared/components/OcrBank.vue +202 -202
  91. package/src/shared/components/OcrBusinessLicense.vue +120 -120
  92. package/src/shared/components/OcrIcon.vue +267 -267
  93. package/src/shared/components/OcrInvoice.vue +323 -323
  94. package/src/shared/components/OfficeDocx.vue +33 -33
  95. package/src/shared/components/OfficePdf.vue +35 -35
  96. package/src/shared/components/PageHeader.vue +84 -84
  97. package/src/shared/components/index.ts +12 -12
  98. package/src/shared/composables/index.ts +10 -10
  99. package/src/shared/composables/useAmount.ts +46 -46
  100. package/src/shared/composables/useCompress.ts +64 -64
  101. package/src/shared/composables/useCountdown.ts +46 -46
  102. package/src/shared/composables/useCrypto.ts +76 -76
  103. package/src/shared/composables/useDeviceEnv.ts +61 -61
  104. package/src/shared/composables/useDragBox.ts +97 -97
  105. package/src/shared/composables/useEncode.ts +43 -43
  106. package/src/shared/composables/useLogger.ts +149 -149
  107. package/src/shared/composables/useSafeArea.ts +46 -46
  108. package/src/shared/composables/useTabbar.ts +24 -24
  109. package/src/shared/composables/useUpload.ts +106 -106
  110. package/src/shared/composables/useValidator.ts +32 -32
  111. package/src/shared/composables/useWxAuth.ts +49 -49
  112. package/src/shared/http/Http.ts +149 -149
  113. package/src/shared/http/index.ts +1 -1
  114. package/src/shared/http/types.ts +163 -163
  115. package/src/shared/index.ts +9 -9
  116. package/src/shared/tracking/directives/index.ts +40 -40
  117. package/src/shared/tracking/examples/page-tracking-template.vue +27 -27
  118. package/src/shared/weixin/index.ts +9 -9
  119. package/src/shared/weixin/jssdk.ts +104 -104
  120. package/src/shared/weixin/payment.ts +38 -38
  121. package/src/styles/vars.scss +3 -3
  122. package/src/user/api/endpoints.ts +17 -17
  123. package/src/user/api/index.ts +123 -123
  124. package/src/user/components/LoginSetting.vue +114 -114
  125. package/src/user/components/UserAuth.vue +218 -218
  126. package/src/user/components/UserBinding.vue +277 -277
  127. package/src/user/components/UserBindingSuccess.vue +80 -80
  128. package/src/user/components/UserEntry.vue +139 -139
  129. package/src/user/components/UserFeedback.vue +428 -428
  130. package/src/user/components/UserFeedbackEntry.vue +175 -175
  131. package/src/user/components/UserHeadCrop.vue +65 -65
  132. package/src/user/components/UserInfo.vue +711 -711
  133. package/src/user/components/UserResourceEmpty.vue +75 -75
  134. package/src/user/components/index.ts +23 -23
  135. package/src/user/index.ts +1 -1
  136. package/src/utils/utils.ts +33 -33
  137. package/tsconfig.json +30 -30
  138. package/types/global.d.ts +23 -23
  139. package/types/vue.d.ts +10 -10
@@ -1,149 +1,149 @@
1
- /**
2
- * 记录阿里日志
3
- * 生产: https://sls.console.aliyun.com/lognext/project/ddyk-prod/logsearch/ddjf-internet-web
4
- */
5
- import qs from 'qs'
6
- import { useAppKitOptions } from '../../Appkit'
7
- import Taro, { getSystemInfoSync, request } from '@tarojs/taro'
8
-
9
- interface LogType {
10
- projectName?: string
11
- logStore?: string
12
- topic?: string
13
- APIVersion?: string
14
- baseUrl?: string
15
- alislsURL?: string
16
- systemInfo?: string
17
- enable?: boolean
18
- enableDebug?: boolean
19
- }
20
-
21
- const defaultLogOptions: LogType = {
22
- projectName: 'ddyk-dev',
23
- logStore: 'ddjf-internet-web',
24
- topic: 'appkit',
25
- enable: true,
26
- enableDebug: false,
27
- }
28
-
29
- // 使用时间戳生成唯一标识
30
- export function generateUniqueId(pre?: string) {
31
- return `${pre ? pre + '-' : ''}${Date.now().toString(16)}-${Math.random().toString(36).substr(2)}`
32
- }
33
-
34
- export function useLogger(options?: LogType) {
35
- const appkitOptions = useAppKitOptions()
36
- const url = appkitOptions.baseUrl()
37
-
38
- if (Taro.getEnv() === 'WEB') {
39
- if (location.origin.includes('ytech.ddjf.com')) {
40
- defaultLogOptions.projectName = 'ddyk-prod'
41
- }
42
- } else {
43
- if (url.includes('ytech.ddjf.com')) {
44
- defaultLogOptions.projectName = 'ddyk-prod'
45
- }
46
- }
47
-
48
- if (options) {
49
- options = Object.assign(defaultLogOptions, options)
50
- } else {
51
- options = defaultLogOptions
52
- }
53
-
54
- const projectName = options.projectName
55
- const logStore = options.logStore
56
- const topic = options.topic || ''
57
- const APIVersion = '0.6.0'
58
- const baseUrl = `https://${projectName}.cn-shenzhen.log.aliyuncs.com/logstores/${logStore}/track?APIVersion=${APIVersion}`
59
- const alislsURL = topic ? `${baseUrl}&__topic__=${topic}` : baseUrl
60
- const enable = options.enable === undefined ? true : options.enable
61
- const enableDebug = options.enableDebug === undefined ? false : options.enableDebug
62
-
63
- const { miniProgram } =
64
- Taro.getEnv() === 'WEAPP' ? Taro.getAccountInfoSync() : { miniProgram: { version: '' } }
65
- const systemInfo =
66
- JSON.stringify({
67
- ...getSystemInfoSync(),
68
- appVersion: miniProgram?.version,
69
- }) || '未知'
70
-
71
- function send(params: Record<string, any>) {
72
- if (!enable) return
73
-
74
- params.systemInfo = systemInfo
75
- const token = appkitOptions.tempToken() || appkitOptions.token()
76
- if (token) {
77
- params.userInfo = token
78
- }
79
- if (params.msg && !params.send) {
80
- params.send = params.msg
81
- }
82
- if (params.send) {
83
- params.send = params.send.slice(0, 1024)
84
- }
85
- if (params.receive) {
86
- params.receive = params.receive.slice(0, 1024)
87
- }
88
- if (params.duration) {
89
- params.duration = params.duration
90
- }
91
-
92
- // 记录页面栈信息
93
- const pages = Taro.getCurrentPages()
94
- const currentPage = pages?.[pages.length - 1]
95
- const lastPage = pages?.[pages.length - 2]
96
- const taroParams = currentPage.$taroParams
97
- if (taroParams) {
98
- delete taroParams.stamp
99
- delete taroParams.$taroTimestamp
100
- }
101
- const laseTaroParams = lastPage?.$taroParams
102
- if (laseTaroParams) {
103
- delete laseTaroParams.stamp
104
- delete laseTaroParams.$taroTimestamp
105
- }
106
- params.pages = JSON.stringify({
107
- current: `${currentPage?.route}?${qs.stringify(taroParams)}`,
108
- last: lastPage
109
- ? `${lastPage?.route}?${qs.stringify(laseTaroParams)}`
110
- : '',
111
- }).slice(0, 1024)
112
-
113
- if (enableDebug) {
114
- console.log(params)
115
- }
116
-
117
- const tmpStr = Object.keys(params)
118
- .map((key) => `${key}=${encodeURIComponent(params[key])}`)
119
- .join('&')
120
- const url = `${alislsURL}&${tmpStr}`
121
- request({ url })
122
- }
123
-
124
- function info(params: any) {
125
- if (!enable) return
126
- send({
127
- send: params.send ?? '',
128
- receive: params.receive ?? '',
129
- duration: params.duration ?? '',
130
- traceId: params.traceId as string,
131
- level: 'info',
132
- })
133
- }
134
-
135
- function error(params: any) {
136
- if (!enable) return
137
- send({
138
- send: params.send ?? '',
139
- receive: params.receive ?? '',
140
- traceId: params.traceId as string,
141
- level: 'error',
142
- })
143
- }
144
-
145
- return {
146
- info,
147
- error,
148
- }
149
- }
1
+ /**
2
+ * 记录阿里日志
3
+ * 生产: https://sls.console.aliyun.com/lognext/project/ddyk-prod/logsearch/ddjf-internet-web
4
+ */
5
+ import qs from 'qs'
6
+ import { useAppKitOptions } from '../../Appkit'
7
+ import Taro, { getSystemInfoSync, request } from '@tarojs/taro'
8
+
9
+ interface LogType {
10
+ projectName?: string
11
+ logStore?: string
12
+ topic?: string
13
+ APIVersion?: string
14
+ baseUrl?: string
15
+ alislsURL?: string
16
+ systemInfo?: string
17
+ enable?: boolean
18
+ enableDebug?: boolean
19
+ }
20
+
21
+ const defaultLogOptions: LogType = {
22
+ projectName: 'ddyk-dev',
23
+ logStore: 'ddjf-internet-web',
24
+ topic: 'appkit',
25
+ enable: true,
26
+ enableDebug: false,
27
+ }
28
+
29
+ // 使用时间戳生成唯一标识
30
+ export function generateUniqueId(pre?: string) {
31
+ return `${pre ? pre + '-' : ''}${Date.now().toString(16)}-${Math.random().toString(36).substr(2)}`
32
+ }
33
+
34
+ export function useLogger(options?: LogType) {
35
+ const appkitOptions = useAppKitOptions()
36
+ const url = appkitOptions.baseUrl()
37
+
38
+ if (Taro.getEnv() === 'WEB') {
39
+ if (location.origin.includes('ytech.ddjf.com')) {
40
+ defaultLogOptions.projectName = 'ddyk-prod'
41
+ }
42
+ } else {
43
+ if (url.includes('ytech.ddjf.com')) {
44
+ defaultLogOptions.projectName = 'ddyk-prod'
45
+ }
46
+ }
47
+
48
+ if (options) {
49
+ options = Object.assign(defaultLogOptions, options)
50
+ } else {
51
+ options = defaultLogOptions
52
+ }
53
+
54
+ const projectName = options.projectName
55
+ const logStore = options.logStore
56
+ const topic = options.topic || ''
57
+ const APIVersion = '0.6.0'
58
+ const baseUrl = `https://${projectName}.cn-shenzhen.log.aliyuncs.com/logstores/${logStore}/track?APIVersion=${APIVersion}`
59
+ const alislsURL = topic ? `${baseUrl}&__topic__=${topic}` : baseUrl
60
+ const enable = options.enable === undefined ? true : options.enable
61
+ const enableDebug = options.enableDebug === undefined ? false : options.enableDebug
62
+
63
+ const { miniProgram } =
64
+ Taro.getEnv() === 'WEAPP' ? Taro.getAccountInfoSync() : { miniProgram: { version: '' } }
65
+ const systemInfo =
66
+ JSON.stringify({
67
+ ...getSystemInfoSync(),
68
+ appVersion: miniProgram?.version,
69
+ }) || '未知'
70
+
71
+ function send(params: Record<string, any>) {
72
+ if (!enable) return
73
+
74
+ params.systemInfo = systemInfo
75
+ const token = appkitOptions.tempToken() || appkitOptions.token()
76
+ if (token) {
77
+ params.userInfo = token
78
+ }
79
+ if (params.msg && !params.send) {
80
+ params.send = params.msg
81
+ }
82
+ if (params.send) {
83
+ params.send = params.send.slice(0, 1024)
84
+ }
85
+ if (params.receive) {
86
+ params.receive = params.receive.slice(0, 1024)
87
+ }
88
+ if (params.duration) {
89
+ params.duration = params.duration
90
+ }
91
+
92
+ // 记录页面栈信息
93
+ const pages = Taro.getCurrentPages()
94
+ const currentPage = pages?.[pages.length - 1]
95
+ const lastPage = pages?.[pages.length - 2]
96
+ const taroParams = currentPage.$taroParams
97
+ if (taroParams) {
98
+ delete taroParams.stamp
99
+ delete taroParams.$taroTimestamp
100
+ }
101
+ const laseTaroParams = lastPage?.$taroParams
102
+ if (laseTaroParams) {
103
+ delete laseTaroParams.stamp
104
+ delete laseTaroParams.$taroTimestamp
105
+ }
106
+ params.pages = JSON.stringify({
107
+ current: `${currentPage?.route}?${qs.stringify(taroParams)}`,
108
+ last: lastPage
109
+ ? `${lastPage?.route}?${qs.stringify(laseTaroParams)}`
110
+ : '',
111
+ }).slice(0, 1024)
112
+
113
+ if (enableDebug) {
114
+ console.log(params)
115
+ }
116
+
117
+ const tmpStr = Object.keys(params)
118
+ .map((key) => `${key}=${encodeURIComponent(params[key])}`)
119
+ .join('&')
120
+ const url = `${alislsURL}&${tmpStr}`
121
+ request({ url })
122
+ }
123
+
124
+ function info(params: any) {
125
+ if (!enable) return
126
+ send({
127
+ send: params.send ?? '',
128
+ receive: params.receive ?? '',
129
+ duration: params.duration ?? '',
130
+ traceId: params.traceId as string,
131
+ level: 'info',
132
+ })
133
+ }
134
+
135
+ function error(params: any) {
136
+ if (!enable) return
137
+ send({
138
+ send: params.send ?? '',
139
+ receive: params.receive ?? '',
140
+ traceId: params.traceId as string,
141
+ level: 'error',
142
+ })
143
+ }
144
+
145
+ return {
146
+ info,
147
+ error,
148
+ }
149
+ }
@@ -1,46 +1,46 @@
1
- import Taro, { getSystemInfoSync, getMenuButtonBoundingClientRect } from '@tarojs/taro'
2
- /**
3
- * 屏幕安全区域
4
- */
5
- export type SafeArea = {
6
- /**
7
- * 状态条高度
8
- */
9
- status: number
10
- /**
11
- * 导航条区域(胶囊)
12
- */
13
- nav: number
14
- /**
15
- * 屏幕底部范围
16
- */
17
- bottom: number
18
- menuRect: any
19
- }
20
-
21
- /**
22
- * 获取屏幕安全区域
23
- * 从系统 API 获取
24
- * @returns
25
- */
26
- export function useSafeArea(): SafeArea {
27
- const systemInfo = getSystemInfoSync(),
28
- capsule = Taro.getEnv() === 'WEAPP' ? getMenuButtonBoundingClientRect() : { top: 0, height: 0 }
29
- /**
30
- * 状态条高度
31
- */
32
- const status = systemInfo.statusBarHeight || 0,
33
- /**
34
- * 据说是胶囊上下间距
35
- */
36
- gap = capsule.top - status,
37
- nav = capsule.height + gap * 2,
38
- safeAreaBottom = (systemInfo.safeArea || {}).bottom || 0,
39
- bottom = systemInfo.screenHeight - safeAreaBottom
40
- return {
41
- status,
42
- nav,
43
- bottom,
44
- menuRect: capsule,
45
- }
46
- }
1
+ import Taro, { getSystemInfoSync, getMenuButtonBoundingClientRect } from '@tarojs/taro'
2
+ /**
3
+ * 屏幕安全区域
4
+ */
5
+ export type SafeArea = {
6
+ /**
7
+ * 状态条高度
8
+ */
9
+ status: number
10
+ /**
11
+ * 导航条区域(胶囊)
12
+ */
13
+ nav: number
14
+ /**
15
+ * 屏幕底部范围
16
+ */
17
+ bottom: number
18
+ menuRect: any
19
+ }
20
+
21
+ /**
22
+ * 获取屏幕安全区域
23
+ * 从系统 API 获取
24
+ * @returns
25
+ */
26
+ export function useSafeArea(): SafeArea {
27
+ const systemInfo = getSystemInfoSync(),
28
+ capsule = Taro.getEnv() === 'WEAPP' ? getMenuButtonBoundingClientRect() : { top: 0, height: 0 }
29
+ /**
30
+ * 状态条高度
31
+ */
32
+ const status = systemInfo.statusBarHeight || 0,
33
+ /**
34
+ * 据说是胶囊上下间距
35
+ */
36
+ gap = capsule.top - status,
37
+ nav = capsule.height + gap * 2,
38
+ safeAreaBottom = (systemInfo.safeArea || {}).bottom || 0,
39
+ bottom = systemInfo.screenHeight - safeAreaBottom
40
+ return {
41
+ status,
42
+ nav,
43
+ bottom,
44
+ menuRect: capsule,
45
+ }
46
+ }
@@ -1,24 +1,24 @@
1
- import { ref } from 'vue'
2
-
3
- const tab = ref<string>(''),
4
- changeCallback = ref<(value: string) => void>(
5
- (value: string) => {
6
- console.log('ORIGINAL changeCallback===', value)
7
- }
8
- )
9
-
10
- const setTab = (value: string) => {
11
- tab.value = value
12
- changeCallback.value(value)
13
- }
14
-
15
- const onTabChange = (callback: (value: string) => void) => {
16
- changeCallback.value = callback
17
- }
18
-
19
- export function useTabbar () {
20
- return {
21
- onTabChange,
22
- setTab
23
- }
24
- }
1
+ import { ref } from 'vue'
2
+
3
+ const tab = ref<string>(''),
4
+ changeCallback = ref<(value: string) => void>(
5
+ (value: string) => {
6
+ console.log('ORIGINAL changeCallback===', value)
7
+ }
8
+ )
9
+
10
+ const setTab = (value: string) => {
11
+ tab.value = value
12
+ changeCallback.value(value)
13
+ }
14
+
15
+ const onTabChange = (callback: (value: string) => void) => {
16
+ changeCallback.value = callback
17
+ }
18
+
19
+ export function useTabbar () {
20
+ return {
21
+ onTabChange,
22
+ setTab
23
+ }
24
+ }
@@ -1,106 +1,106 @@
1
- import Taro from "@tarojs/taro";
2
-
3
- /**
4
- * 使用 canvas 压缩图片(Web 端)
5
- */
6
- export const compressImageWithCanvas = (
7
- src: string,
8
- quality: number
9
- ): Promise<string> => {
10
- return new Promise((resolve, reject) => {
11
- const img = new Image();
12
- img.crossOrigin = "anonymous";
13
-
14
- img.onload = () => {
15
- try {
16
- const canvas = document.createElement("canvas");
17
- const ctx = canvas.getContext("2d");
18
-
19
- if (!ctx) {
20
- reject(new Error("无法获取 canvas 上下文"));
21
- return;
22
- }
23
-
24
- // 设置画布尺寸(可以根据需要限制最大尺寸)
25
- const maxWidth = 850;
26
- const maxHeight = 850;
27
- let width = img.width;
28
- let height = img.height;
29
-
30
- // 计算压缩后的尺寸
31
- if (width > maxWidth || height > maxHeight) {
32
- const ratio = Math.min(maxWidth / width, maxHeight / height);
33
- width = width * ratio;
34
- height = height * ratio;
35
- }
36
-
37
- canvas.width = width;
38
- canvas.height = height;
39
-
40
- // 绘制图片到 canvas
41
- ctx.drawImage(img, 0, 0, width, height);
42
-
43
- // 转换为 blob
44
- canvas.toBlob(
45
- (blob) => {
46
- if (!blob) {
47
- reject(new Error("图片压缩失败"));
48
- return;
49
- }
50
- // 创建 blob URL
51
- const compressedUrl = URL.createObjectURL(blob);
52
- resolve(compressedUrl);
53
- },
54
- "image/jpeg",
55
- quality / 100
56
- );
57
- } catch (error) {
58
- reject(error);
59
- }
60
- };
61
-
62
- img.onerror = () => {
63
- reject(new Error("图片加载失败"));
64
- };
65
-
66
- img.src = src;
67
- });
68
- };
69
-
70
- // 压缩图片
71
- export async function compressImage(src: string, quality = 80) {
72
- if (Taro.getEnv() === "WEB") {
73
- try {
74
- const compressedUrl = await compressImageWithCanvas(src, quality);
75
- // 返回格式与小程序端一致,包含 tempFilePath 属性
76
- return { tempFilePath: compressedUrl };
77
- } catch (error) {
78
- console.error("图片压缩失败:", error);
79
- // 压缩失败时返回原图
80
- return { tempFilePath: src };
81
- }
82
- } else {
83
- return new Promise((resolve, reject) => {
84
- Taro.compressImage({
85
- src: src,
86
- quality: quality,
87
- success: (res) => {
88
- resolve(res);
89
- },
90
- fail: (res) => {
91
- reject(res);
92
- },
93
- });
94
- });
95
- }
96
- }
97
-
98
- // 获取压缩质量
99
- export function getCompressQuality(size: number) {
100
- let quality = 100;
101
- const curSize = size / (1024 * 1024);
102
- if (curSize > 6) {
103
- quality = quality - ((curSize - 6) / curSize) * 100;
104
- }
105
- return quality;
106
- }
1
+ import Taro from "@tarojs/taro";
2
+
3
+ /**
4
+ * 使用 canvas 压缩图片(Web 端)
5
+ */
6
+ export const compressImageWithCanvas = (
7
+ src: string,
8
+ quality: number
9
+ ): Promise<string> => {
10
+ return new Promise((resolve, reject) => {
11
+ const img = new Image();
12
+ img.crossOrigin = "anonymous";
13
+
14
+ img.onload = () => {
15
+ try {
16
+ const canvas = document.createElement("canvas");
17
+ const ctx = canvas.getContext("2d");
18
+
19
+ if (!ctx) {
20
+ reject(new Error("无法获取 canvas 上下文"));
21
+ return;
22
+ }
23
+
24
+ // 设置画布尺寸(可以根据需要限制最大尺寸)
25
+ const maxWidth = 850;
26
+ const maxHeight = 850;
27
+ let width = img.width;
28
+ let height = img.height;
29
+
30
+ // 计算压缩后的尺寸
31
+ if (width > maxWidth || height > maxHeight) {
32
+ const ratio = Math.min(maxWidth / width, maxHeight / height);
33
+ width = width * ratio;
34
+ height = height * ratio;
35
+ }
36
+
37
+ canvas.width = width;
38
+ canvas.height = height;
39
+
40
+ // 绘制图片到 canvas
41
+ ctx.drawImage(img, 0, 0, width, height);
42
+
43
+ // 转换为 blob
44
+ canvas.toBlob(
45
+ (blob) => {
46
+ if (!blob) {
47
+ reject(new Error("图片压缩失败"));
48
+ return;
49
+ }
50
+ // 创建 blob URL
51
+ const compressedUrl = URL.createObjectURL(blob);
52
+ resolve(compressedUrl);
53
+ },
54
+ "image/jpeg",
55
+ quality / 100
56
+ );
57
+ } catch (error) {
58
+ reject(error);
59
+ }
60
+ };
61
+
62
+ img.onerror = () => {
63
+ reject(new Error("图片加载失败"));
64
+ };
65
+
66
+ img.src = src;
67
+ });
68
+ };
69
+
70
+ // 压缩图片
71
+ export async function compressImage(src: string, quality = 80) {
72
+ if (Taro.getEnv() === "WEB") {
73
+ try {
74
+ const compressedUrl = await compressImageWithCanvas(src, quality);
75
+ // 返回格式与小程序端一致,包含 tempFilePath 属性
76
+ return { tempFilePath: compressedUrl };
77
+ } catch (error) {
78
+ console.error("图片压缩失败:", error);
79
+ // 压缩失败时返回原图
80
+ return { tempFilePath: src };
81
+ }
82
+ } else {
83
+ return new Promise((resolve, reject) => {
84
+ Taro.compressImage({
85
+ src: src,
86
+ quality: quality,
87
+ success: (res) => {
88
+ resolve(res);
89
+ },
90
+ fail: (res) => {
91
+ reject(res);
92
+ },
93
+ });
94
+ });
95
+ }
96
+ }
97
+
98
+ // 获取压缩质量
99
+ export function getCompressQuality(size: number) {
100
+ let quality = 100;
101
+ const curSize = size / (1024 * 1024);
102
+ if (curSize > 6) {
103
+ quality = quality - ((curSize - 6) / curSize) * 100;
104
+ }
105
+ return quality;
106
+ }