menduner-uniapp/pagesB/inviteRecord/index.vue

<template>
	<layout-page>
		<scroll-view class="scrollBox" scroll-y="true" @scrolltolower="loadingMore" style="height: calc(100vh - 102rpx);">
			<view v-if="total" class="MiSans-Medium color-primary shareCode" @tap="toShare">我的分享码</view>
			<view v-if="total" class="totalShow MiSans-Medium">恭喜你，已经成功邀请{{ total }}个新用户啦！</view>
      <view v-if="items.length" class="listBox">
        <!-- <m-list :items="items"></m-list> -->
				<uni-table ref="table" :loading="loading" border stripe emptyText="暂无更多数据" style="width: 100%;">
					<uni-tr>
						<uni-th width="100" align="center" class="MiSans-Normal">用户名</uni-th>
						<uni-th align="center" class="MiSans-Normal">性别</uni-th>
						<uni-th align="center" class="MiSans-Normal">邀请时间</uni-th>
					</uni-tr>
					<uni-tr v-for="(item, index) in items" :key="index">
						<uni-td align="center" class="MiSans-Normal">{{ item.person?.name || item.user.phone }}</uni-td>
						<uni-td align="center" class="MiSans-Normal">{{ item.person?.sexName }}</uni-td>
						<uni-td align="center" class="MiSans-Normal">{{ item.user.createTime }}</uni-td>
					</uni-tr>
				</uni-table>
        <uni-load-more :status="more" />
      </view>
      <view v-else class="nodata-img-parent flex-column">
        <image
          src="https://minio.citupro.com/dev/static/nodata.png"
          mode="widthFix"
          style="width: 100vw"
        ></image>
				<view class="shareText">
					<span>您还没有邀请新用户，</span>
					<span class="color-primary" @tap="toShare">马上邀请</span>
				</view>
      </view>
    </scroll-view>
  </layout-page>
</template>

<script setup>
import { ref, watch } from 'vue'
import layoutPage from '@/layout'
import { dealDictObjData } from '@/utils/position'
import { timesTampChange } from '@/utils/date'

// import MList from './list'
// import { getDict } from '@/hooks/useDictionaries.js'
import { getInviteRecord } from '@/api/position.js'
// import { onLoad } from '@dcloudio/uni-app'

import { userStore } from '@/store/user'
const useUserStore = userStore()

watch(() => useUserStore.refreshToken, (newVal, oldVal) => {
  if (useUserStore.refreshToken) {
		// 监听登录状态
		console.log('重新登录了')
	}
})

// 获取参数
const pageInfo = ref({
	pageNo: 1,
	pageSize: 100
})
const total = ref(0)
const items = ref([])
const loading = ref(false)
const more = ref('more')

async function init () {
	try {
		loading.value = true
		const res = await getInviteRecord({
			...pageInfo.value,
		})
		const data = res?.data?.list || []
		if (!data.length) {
			pageInfo.value.pageNo--
			return
		}
		const dealData = data.map(e => {
			e.person = dealDictObjData({}, e.person)
			if (e.user?.createTime) e.user.createTime = timesTampChange(e.user.createTime)
			return e
		})
		items.value.push(...dealData)
		total.value = items.value.length
		more.value = items.value.length === total.value ? 'noMore' : 'more'
	} catch (error) {
		pageInfo.value.pageNo--
	} finally {
		loading.value = false
	}
}
init()

function loadingMore () {
	if (total.value === items.value.length) {
		return
	}
	if (loading.value) {
		return
	}
	more.value = 'loading'
  pageInfo.value.pageNo++
	init()
}

const toShare = () => {
	uni.navigateTo({ url: '/pagesB/sharePoster/index' })
}
</script>
<style scoped lang="scss">
.listBox {
	padding: 30rpx;
}
.totalShow {
	margin: 30rpx 0 0 30rpx;
	color: #666;
}
.nodata-img-parent {
	flex-direction: column;
}
.shareText {
	margin-bottom: 150rpx;
}
.shareCode {
	text-align: right;
	margin: 30rpx;
	text-decoration: underline;
}
</style>