From 3bff34c3aa7ad412042272ea6a37b7d5b49b8d9b Mon Sep 17 00:00:00 2001 From: zxl <763096477@qq.com> Date: 星期四, 26 六月 2025 09:09:51 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/dev' into dev --- pages/customerManager/customerManager.vue | 188 +++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 182 insertions(+), 6 deletions(-) diff --git a/pages/customerManager/customerManager.vue b/pages/customerManager/customerManager.vue index 8183fd0..693cb5a 100644 --- a/pages/customerManager/customerManager.vue +++ b/pages/customerManager/customerManager.vue @@ -1,22 +1,198 @@ <template> - <view> - + <view class="container"> + <view class="header"> + <text class="title">瀹㈡埛鍒楄〃</text> + </view> + <!-- 鎼滅储妗� --> + <view class="search-box"> + <u-search v-model="query.username" placeholder="鎼滅储瀹㈡埛" :showAction="false" @change="searchMember"></u-search> + </view> + + <!-- 鍐呭鍖哄煙 --> + <scroll-view scroll-y class="member-list" @scrolltolower="loadMore" :lower-threshold="100"> + <view> + <view class="member-item" v-for="(member, index) in memberList" :key="member.id" + v-if="memberList.length > 0"> + + <view class="member-info"> + <text class="mobile">{{ member.mobile }}</text> + <text class="region">{{ member.region }}</text> + </view> + <!-- 鎿嶄綔鎸夐挳鍖哄煙 --> + <view class="action-buttons"> + <u-button type="primary" size="mini" @click.stop="navigateToDetail(member.id)" + class="edit-btn">淇敼</u-button> + <u-button type="error" size="mini" @click.stop="joinBlack(member.id)" + class="delete-btn"></u-button> + </view> + + </view> + </view> + + <!-- 鏀硅繘鐨勫姞杞芥洿澶氭彁绀� --> + <view> + <u-loadmore class="load-more" v-if="memberList.length > 0" + :status="loading ? 'loading' : noMore ? 'nomore' : 'loadmore'" :load-text="{ + loadmore: '涓婃媺鍔犺浇鏇村', + loading: '姝e湪鍔犺浇', + nomore: '娌℃湁鏇村浜�' + }" /> + </view> + <view style="height:150rpx"> + + </view> + </scroll-view> + + + </view> </template> <script> + import { + getPage, + } from "@/api/customerManager.js" + import '@/components/uview-components/uview-ui'; export default { data() { return { - + loading: false, + noMore: false, + + query: { + username: '', + pageNumber: 1, + pageSize: 15, + }, + memberList: [], + total:0, } }, + onLoad(){ + this.getPage() + }, methods: { - + // 鎼滅储鐢ㄦ埛 + searchMember() { + this.query.pageNumber = 1 + this.noMore = false + this.clerkList = [] + this.getPage() + }, + joinBlack(memberId){ + + }, + async getPage(){ + uni.showLoading({ + title: '鍔犺浇涓�' + }); + getPage(this.query).then(res =>{ + uni.hideLoading(); + if (res.statusCode === 200) { + const newData = res.data.data; + // 鏇存柊鎬绘暟鎹噺 + this.total = res.data.total || 0; + // 杩藉姞鎴栨浛鎹㈡暟鎹� + this.memberList = this.query.pageNumber === 1 ? + newData : + [...this.memberList, ...newData]; + + // 鍒ゆ柇鏄惁杩樻湁鏇村鏁版嵁 + this.noMore = newData.length < this.query.pageSize || + this.memberList.length >= this.total; + + } + }) + }, + // 鍔犺浇鏇村 + loadMore() { + if (!this.noMore) { + this.query.pageNumber++ + this.getPage() + } + }, + } } </script> -<style> +<style lang="scss" scoped> + .action-buttons { + display: flex; + margin-left: 20rpx; + } + .container { + padding: 20rpx; + height: 100vh; + display: flex; + flex-direction: column; + background-color: #f5f5f5; + } -</style> + .header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 20rpx 0; + margin-bottom: 20rpx; + + .title { + font-size: 36rpx; + font-weight: bold; + color: #333; + } + + + } + + .search-box { + margin-bottom: 20rpx; + } + + .member-list { + flex: 1; + overflow: hidden; + } + + .member-item { + display: flex; + align-items: center; + padding: 20rpx; + margin-bottom: 20rpx; + background-color: #fff; + border-radius: 12rpx; + box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05); + + .avatar { + width: 80rpx; + height: 80rpx; + border-radius: 50%; + margin-right: 20rpx; + } + + .member-info { + flex: 1; + display: flex; + flex-direction: column; + + .mobile { + font-size: 32rpx; + color: #333; + margin-bottom: 8rpx; + } + + .region { + font-size: 24rpx; + color: #999; + } + } + } + + .load-more { + padding: 20rpx 0; + text-align: center; + color: #999; + font-size: 26rpx; + background-color: #f7f8fa; + } +</style> \ No newline at end of file -- Gitblit v1.8.0