import { Image, Swiper, SwiperItem, Text, View } from '@tarojs/components'
import Taro, { useReady } from '@tarojs/taro'
import { useEffect, useRef, useState } from 'react'
import styles from './index.module.scss'
import { formatImgUrl } from '@/common/fotmat'
import { goLink } from '@/common/common'
import CloseBtn from '@/components/closeBtn'
import { getCDNSource } from '@/common/constant'
import LayoutBlock from '@/components/layoutBlock'
import type { TablePropsType } from '@/components/table'
import Table from '@/components/table'
import { GetInviteCodeList } from '@/api/user'
// 需要传进来的表头数据示例
const inviteColumns = [
  {
    key: 'invitee',
    title: '被邀请人',
    dataIndex: 'invitee',
    width: '50%',
  },
  {
    key: 'InviteTime',
    title: '邀请时间',
    dataIndex: 'InviteTime',
    width: '50%',
  },
]
const defaultSize = 24
const InviteCord = () => {
  const size = useRef(defaultSize)
  const [currentTable, setCurrentTable] = useState<TablePropsType>({
    columns: inviteColumns,
    dataSource: { list: [], total: 0 },
  })
  const { fetchData: getInvitationListAPI } = GetInviteCodeList()
  const getInvitationList = async() => {
    const res = await getInvitationListAPI({ size: size.current })
    if (res.success) {
      console.log('getInviteCode', res)
      setCurrentTable((prev: any) => ({
        ...prev,
        dataSource: {
          list: res.data.list.map((item, index: number) => ({
            key: index,
            index: index + 1,
            invitee: item.invitee_name || '--',
            InviteTime: item.schedule,
          })),
          total: res.data.list.length,
        },
      }))
    }
  }
  const handleLoadMore = () => {
    size.current += defaultSize
  }
  useReady(() => {
    getInvitationList()
  })
  return (
    <View className={styles.main}>
      <View className={styles.content}>
        <View className={styles.background}>
          <View className={styles.left}>
            <View className={styles.title}>邀请记录</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>
  )
}

export default InviteCord
