131 lines
4.3 KiB
TypeScript

import { Canvas, Image, Text, View } from '@tarojs/components'
import Taro, { usePullDownRefresh, useReady } from '@tarojs/taro'
import { useRef, useState } from 'react'
import styles from './index.module.scss'
import useLogin from '@/use/useLogin'
import { GenBarCodeOrQrCode, GetInvitationInfo, GetInvitationInfoApi, GetInviteCodeList, GetInviteeRecord } from '@/api/user'
import LayoutBlock from '@/components/layoutBlock'
import { getCDNSource } from '@/common/constant'
import NormalButton from '@/components/normalButton'
import type { TablePropsType } from '@/components/table'
import Table from '@/components/table'
import type { InviteCodePopupRef } from '@/components/inviteCodePopup'
import InviteCodePopup from '@/components/inviteCodePopup'
import { GetInvitationRecordList } from '@/api/share'
import { formatDateTime } from '@/common/fotmat'
// 获取业务员信息
interface Param { inviter_id: number; inviter_name: string; phone: string }
// 需要传进来的表头数据示例
const inviteColumns = [
{
key: 'invitee',
title: '被邀请人',
dataIndex: 'invitee',
width: '35%',
},
{
key: 'invitationWay',
title: '邀请方式',
dataIndex: 'invitationWay',
width: '30%',
},
{
key: 'inviteTime',
title: '邀请时间',
dataIndex: 'inviteTime',
width: '35%',
},
]
const defaultSize = 24
const BindSalesman = () => {
useLogin()
const size = useRef(defaultSize)
// 获取被邀请记录
const { fetchData: getInviteeRecordAPI } = GetInvitationRecordList()
const getInviteeRecord = async() => {
const res = await getInviteeRecordAPI()
if (res.success) {
setCurrentTable((prev: any) => ({
...prev,
dataSource: {
list: res.data.list.map((item, index: number) => ({
key: index,
invitationWay: item.invitation_way_name || '--',
invitee: item.passive_invited_user_name || '--',
inviteTime: formatDateTime(item.invitation_time, 'YYYY-MM-DD') || '--',
})),
total: res.data.list.length,
},
}))
Taro.stopPullDownRefresh()
}
}
useReady(() => {
getInviteeRecord()
})
usePullDownRefresh(async() => {
getInviteeRecord()
})
const inviteCodePopupRef = useRef<InviteCodePopupRef>(null)
const handleQRcodeShare = async() => {
inviteCodePopupRef.current?.startDrawPoster()
}
const [currentTable, setCurrentTable] = useState<TablePropsType>({
columns: inviteColumns,
dataSource: { list: [], total: 0 },
})
const handleLoadMore = () => {
size.current += defaultSize
}
return (
<View className={styles.main}>
<View className={styles.content}>
<View className={styles.background}>
<View className={styles.left}>
<View className={styles.title}>
<Text className={styles.title_text}>A</Text>
<Text className={styles.title_plus}>+</Text>
</View>
<View className={styles.description}></View>
</View>
<View className={styles.right}>
<View className={styles.iconContainer}>
<Image className={styles.icon} src={getCDNSource('/user/inviteCode.png')} mode="widthFix" />
</View>
</View>
</View>
<View className={styles.inviteCodeContent}>
<LayoutBlock circle customStyle={{ paddingTop: '10px', paddingBottom: '10px' }}>
<View className={styles.inviteListTitle}>
<View className={styles.titleIconLeft}></View>
<Text className={styles.listTitle}></Text>
<View className={styles.titleIconRight}></View>
</View>
<View className={styles.inviteList}>
<Table columns={currentTable.columns} emptyText="暂无邀请信息" safeAreaInsetBottom={false} dataSource={currentTable.dataSource} onLoadMore={handleLoadMore}></Table>
</View>
</LayoutBlock>
</View>
</View>
<View className={styles.bottomBar}>
<NormalButton type="primary" round customTextClassName={styles.bottomBar__text} customStyles={{ width: '100%' }} onClick={handleQRcodeShare}>
</NormalButton>
</View>
<InviteCodePopup ref={inviteCodePopupRef}></InviteCodePopup>
</View>
)
}
export default BindSalesman