diff --git a/src/components/loading/index.tsx b/src/components/loading/index.tsx
index 257d041..ef296bf 100644
--- a/src/components/loading/index.tsx
+++ b/src/components/loading/index.tsx
@@ -9,7 +9,6 @@ const Loading = ({ width = 60, color = '#6190e8' }: { width?: number; color?: st
if (color) { obj = { ...obj, borderColor: `${color} transparent transparent` } }
return obj
}, [width, color])
- console.log('loading:::')
return (
= (props) => {
@@ -33,6 +35,7 @@ const NormalButton: FC = (props) => {
customStyles = {},
customClassName = '',
customTextClassName = '',
+ loading = false,
} = props
const getClassName = () => {
const classObject = {
@@ -55,7 +58,9 @@ const NormalButton: FC = (props) => {
return (
- {children}
+
+ {loading && }
+ {children}
)
}
diff --git a/src/pages/inviteCode/index.tsx b/src/pages/inviteCode/index.tsx
index f110a70..7527ed4 100644
--- a/src/pages/inviteCode/index.tsx
+++ b/src/pages/inviteCode/index.tsx
@@ -1,6 +1,7 @@
import { Canvas, Image, Text, View } from '@tarojs/components'
import Taro, { useReady } from '@tarojs/taro'
import { useCallback, useRef, useState } from 'react'
+import { imageAudit } from '@tarojs/taro-h5'
import style from './index.module.scss'
import inviteCodePng from './inviteCode.png'
import QRcode from './inviteCodePopup.png'
@@ -37,6 +38,7 @@ const InviteCode = () => {
columns: inviteColumns,
dataSource: { list: [], total: 0 },
})
+ const [loading, setLoading] = useState(false)
// 获取邀请码
const getInviteCode = async() => {
const res = await fetchData()
@@ -59,10 +61,13 @@ const InviteCode = () => {
}
// 生成二维码
const genQRcode = async() => {
- const res = await genCode({ content: inviteInfo.invitation_code })
+ const res = await genCode({ content: `InviteCode:${inviteInfo.invitation_code}` })
if (res.success) {
return res.data.qrcode_base64
}
+ else {
+ setLoading(false)
+ }
}
const [, setForceUpdate] = useState({})
@@ -97,6 +102,9 @@ const InviteCode = () => {
console.log('tempFilePath', res.tempFilePath)
setTargetImageUrl(res.tempFilePath)
},
+ complete: () => {
+ setLoading(false)
+ },
})
}
const getImageInfo = (filePath) => {
@@ -109,17 +117,20 @@ const InviteCode = () => {
}
// 初始化 canvas
const initCanvas = async() => {
- Taro.nextTick(() => {
- const query = Taro.createSelectorQuery()
- query.select('#canvas').node(({ node: canvas }: { node: Taro.Canvas }) => {
- console.log('canvas==>', canvas)
- const context = canvas.getContext('2d')
- console.log('ctx', context)
- canvasNode.current = canvas
- ctx.current = context
- console.log('canvas', canvas)
- setForceUpdate({})
- }).exec()
+ return new Promise((resolve, reject) => {
+ Taro.nextTick(() => {
+ const query = Taro.createSelectorQuery()
+ query.select('#canvas').node(({ node: canvas }: { node: Taro.Canvas }) => {
+ console.log('canvas==>', canvas)
+ const context = canvas.getContext('2d')
+ console.log('ctx', context)
+ canvasNode.current = canvas
+ ctx.current = context
+ console.log('canvas', canvas)
+ setForceUpdate({})
+ resolve(true)
+ }).exec()
+ })
})
}
const startPaint = async(ctx, canvas, image) => {
@@ -160,18 +171,20 @@ const InviteCode = () => {
}
catch (err) {
console.error('合成二维邀请码失败')
+ setLoading(false)
+ throw new Error('合成二维邀请码失败')
}
saveCanvasToImage(canvas)
}
// 绘制最终的海报,图片使用两倍大小,canvas大小是图片的二分之一 就能让canvas生成出来的图片清晰了
const drawPictorial = async() => {
- return new Promise((resolve, reject) => {
+ // eslint-disable-next-line no-async-promise-executor
+ return new Promise(async(resolve, reject) => {
+ setLoading(true)
if (!ctx.current) {
// 重新初始化canvas
- initCanvas()
- reject(new Error('ctx error'))
- return false
+ await initCanvas()
}
const canvas = canvasNode.current
Taro.getImageInfo({
@@ -179,11 +192,19 @@ const InviteCode = () => {
success: (res) => {
canvas.width = res.width / 2
canvas.height = res.height / 2
- getImageObject(canvas, `${res.path}`).then((image) => {
- // 开始绘制
- startPaint(ctx.current, canvasNode.current, image)
- resolve(true)
+ getImageObject(canvas, `${res.path}`).then(async(image) => {
+ try {
+ // 开始绘制
+ await startPaint(ctx.current, canvasNode.current, image)
+ resolve(true)
+ }
+ catch (err) {
+ console.log(err)
+ setLoading(false)
+ reject(new Error('绘制失败'))
+ }
}).catch((error) => {
+ setLoading(false)
throw new Error(error)
})
},
@@ -195,8 +216,15 @@ const InviteCode = () => {
}
const handleQRcodeShare = async() => {
- await drawPictorial()
- setShowPopup(true)
+ try {
+ const flag = await drawPictorial()
+ if (flag) {
+ setShowPopup(true)
+ }
+ }
+ catch (err) {
+ throw new Error('弹出二维码失败')
+ }
}
// 复制二维码
const handleCopyInviteCode = () => {
@@ -253,7 +281,7 @@ const InviteCode = () => {
-
+
二维码分享