🎈 perf(邀请码): 追加分页功能

This commit is contained in:
xuan 2022-12-12 12:05:32 +08:00
parent fbe6e9b449
commit a8f6eb6045
5 changed files with 139 additions and 186 deletions

View File

@ -13,6 +13,7 @@ export const GetInvitationList = () => {
return useRequest({
url: '/v2/mp/user/inviterList',
method: 'get',
pagination: true,
})
}
// 生成二维码

View File

@ -8,7 +8,7 @@ interface params {
show?: true | false
onClose?: () => void
}
const BindSalesManPopUp = ({ show, onClose }: params) => {
const BindSalesManDialog = ({ show, onClose }: params) => {
const onCustomer = async() => {
const res = await Taro.showModal({
title: '是否拨打服务热线',
@ -55,4 +55,4 @@ const BindSalesManPopUp = ({ show, onClose }: params) => {
)
}
export default BindSalesManPopUp
export default BindSalesManDialog

View File

@ -3,7 +3,7 @@ import Taro from '@tarojs/taro'
import classnames from 'classnames'
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
import Counter from '../counter'
import BindSalesmanPopup from '../bindSalesmanPopup'
import BindSalesmanPopup from '../bindSalesmanDialog'
import LabAndImgShow from '../LabAndImgShow'
import LabAndImg from '../LabAndImg'
import styles from './index.module.scss'

View File

@ -11,40 +11,7 @@ import NormalButton from '@/components/normalButton'
import { alert } from '@/common/common'
import { GenBarCodeOrQrCode, GetInvitationInfo, GetInvitationList } from '@/api'
import { getCDNSource } from '@/common/constant'
import Painter from '@/components/painter'
const SystemInfo = Taro.getSystemInfoSync()
let screenK = 5
/**
*
* @param {Boolean} minus
*/
const toPx = (num: string, minus = false) => {
let reg
if (minus) {
reg = /^-?[0-9]+([.]{1}[0-9]+){0,1}(rpx|px)$/g
}
else {
reg = /^[0-9]+([.]{1}[0-9]+){0,1}(rpx|px)$/g
}
const results = reg.exec(num)
console.log('results', results)
if (!num || !results) {
console.log(`The size: ${num} is illegal`)
return 0
}
const unit = results[2]
const value = parseFloat(num)
let res = 0
if (unit === 'rpx') {
res = Math.round(value * screenK)
}
else if (unit === 'px') {
res = value
}
return res
}
// 需要传进来的表头数据示例
const inviteColumns = [
{
@ -60,10 +27,10 @@ const inviteColumns = [
width: '50%',
},
]
const defaultSize = 24
// 邀请码
const InviteCode = () => {
screenK = SystemInfo.screenWidth / 750
const sizeRef = useRef(defaultSize)
const { fetchData: getInvitationListAPI } = GetInvitationList()
const { fetchData } = GetInvitationInfo()
const { fetchData: genCode } = GenBarCodeOrQrCode()
@ -74,7 +41,7 @@ const InviteCode = () => {
})
const [loading, setLoading] = useState(false)
const getInvitationList = async() => {
const res = await getInvitationListAPI()
const res = await getInvitationListAPI({ size: sizeRef.current })
if (res.success) {
console.log('getInviteCode', res)
setCurrentTable((prev: any) => ({
@ -134,7 +101,6 @@ const InviteCode = () => {
}
// canvas 生成 图片
const saveCanvasToImage = (canvas) => {
console.log('pixelRatio', SystemInfo.pixelRatio, canvas)
Taro.canvasToTempFilePath({
canvas,
fileType: 'png',
@ -186,7 +152,6 @@ const InviteCode = () => {
}
}
const [canvasStyle, setCanvasStyle] = useState<React.CSSProperties>({})
const painter = useRef<any>(null)
const startPaint = async(ctx: Taro.RenderingContext, canvas: Taro.Canvas, image: Taro.Image) => {
// 开始绘制
const { width, height } = canvas
@ -273,7 +238,7 @@ const InviteCode = () => {
}
// 加载更多
const handleLoadMore = () => {
sizeRef.current += defaultSize
}
const handleQRcodeShare = async() => {
try {
@ -303,19 +268,6 @@ const InviteCode = () => {
initCanvas()
}, 200)
})
const onImgErr = (e) => {
Taro.hideLoading()
console.error('onImgErr', e.error)
Taro.showToast({
title: '生成分享图失败,请刷新页面重试',
})
}
const onImgOK = (e) => {
console.log('onImgOK', e.path)
setTargetImageUrl(e.path)
setShowPopup(true)
Taro.hideLoading()
}
return <View className={style.main}>
<View className={style.content}>
<View className={style.background}>