86 lines
2.3 KiB
Vue
86 lines
2.3 KiB
Vue
<template>
|
|
<scroll-list
|
|
class="h-full"
|
|
:loadMoreStatus="loadMoreStatus"
|
|
@refresh="refreshList"
|
|
@loadMore="listLoadMore"
|
|
:scroll-top="scrollTop"
|
|
>
|
|
<view v-if="isRefreshing" class="py-2 px-4" v-for="index in 4" :key="index">
|
|
<view class="flex">
|
|
<wd-skeleton :row-col="[{ size: '100px', type: 'rect' }]" animation="gradient" />
|
|
<wd-skeleton
|
|
:custom-style="{ width: '100%', marginLeft: '12px' }"
|
|
:row-col="[{ width: '100%' }, { width: '100%' }]"
|
|
animation="gradient"
|
|
/>
|
|
</view>
|
|
<view class="flex -mt-50px">
|
|
<wd-skeleton :row-col="[{ size: '100px', type: 'rect' }]" animation="gradient" />
|
|
<wd-skeleton
|
|
:custom-style="{ width: '100%', marginLeft: '12px' }"
|
|
:row-col="[{ width: '100%' }, { width: '50%' }]"
|
|
animation="gradient"
|
|
/>
|
|
</view>
|
|
</view>
|
|
<user-card
|
|
v-else-if="listData.length"
|
|
v-for="user in listData"
|
|
:key="user.id"
|
|
:data="user"
|
|
@click="detail(user)"
|
|
/>
|
|
<wd-status-tip v-else image="content" tip="暂无内容" />
|
|
</scroll-list>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { computed, onMounted, reactive, ref, watch } from 'vue';
|
|
// @ts-ignore
|
|
import sheep from '@/sheep';
|
|
import ScrollList from '@/sheep/components/scroll-list/scroll-list.vue';
|
|
import UserCard from '@/sheep/components/user-card/user-card.vue';
|
|
import useScroll from '@/sheep/hooks/use-scroll';
|
|
import RecentApi from '@/sheep/api/member/recent';
|
|
|
|
const props = defineProps<{
|
|
scene: string;
|
|
}>();
|
|
|
|
const scrollTop = ref(1);
|
|
const userCity = computed(() => sheep.$store('user').userCity);
|
|
const params = reactive({
|
|
scene: props.scene,
|
|
province: '',
|
|
city: userCity.value.t,
|
|
memberId: '',
|
|
});
|
|
const { isRefreshing, listData, loadMoreStatus, refreshList, listLoadMore } = useScroll(
|
|
RecentApi.quickPage,
|
|
params,
|
|
);
|
|
|
|
onMounted(() => {
|
|
refreshList();
|
|
});
|
|
|
|
watch(
|
|
() => userCity.value,
|
|
async (city) => {
|
|
params.city = city.t;
|
|
await refreshList();
|
|
scrollTop.value = 0;
|
|
},
|
|
);
|
|
|
|
const detail = (user: any) => {
|
|
uni.navigateTo({
|
|
url: `/pages/home/detail?memberId=${user.memberId}`,
|
|
success: function (res) {
|
|
res.eventChannel.emit('viewRecordType', 'USER');
|
|
},
|
|
});
|
|
};
|
|
</script>
|