93 lines
1.8 KiB
Vue
93 lines
1.8 KiB
Vue
<template>
|
|
<view>
|
|
<view v-if="data.length > 0">
|
|
<view
|
|
class="card-list"
|
|
v-for="(item, index) in (data as any[])"
|
|
:key="index"
|
|
>
|
|
<view class="left">
|
|
<image :src="item.avatarUrl" />
|
|
<view class="text">
|
|
<view>{{ item.nickName }}</view>
|
|
<view>{{ item.phone }}</view>
|
|
</view>
|
|
</view>
|
|
<view class="right"></view>
|
|
</view>
|
|
<nut-pagination
|
|
v-model="page.PageNum"
|
|
:total-items="page.ItemCount"
|
|
:items-per-page="page.PageSize"
|
|
@change="pageChange"
|
|
/>
|
|
</view>
|
|
<view v-else>
|
|
<nut-empty description="暂无明细"></nut-empty>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref } from "vue";
|
|
import { useLoad, showToast } from "@tarojs/taro";
|
|
import { getTGUserList } from "../../../../api/user";
|
|
|
|
useLoad(() => {
|
|
getData();
|
|
});
|
|
|
|
const data = ref([]);
|
|
|
|
const page = ref({ PageNum: 1, PageSize: 10, ItemCount: 0 });
|
|
|
|
const pageChange = (e: number) => {
|
|
page.value.PageNum = e;
|
|
getData();
|
|
};
|
|
|
|
const getData = async () => {
|
|
try {
|
|
const res = await getTGUserList({
|
|
PageNum: page.value.PageNum,
|
|
PageSize: page.value.PageSize,
|
|
});
|
|
data.value = res.data.data || [];
|
|
page.value.ItemCount = res.data.count;
|
|
} catch (error) {
|
|
showToast({ title: error.msg, icon: "none" });
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.nut-pagination {
|
|
position: absolute;
|
|
margin-top: 10px;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
}
|
|
|
|
.card-list {
|
|
width: 700px;
|
|
background-color: #fff;
|
|
margin: 10px auto;
|
|
border-radius: 10px;
|
|
padding: 20px;
|
|
|
|
.left {
|
|
display: flex;
|
|
align-items: center;
|
|
image {
|
|
width: 100px;
|
|
height: 100px;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.text {
|
|
margin-left: 20px;
|
|
}
|
|
}
|
|
}
|
|
</style>
|