From 6a20878b9b1e3460531b055d72d5d671f761abc3 Mon Sep 17 00:00:00 2001
From: peng <peng.com>
Date: 星期四, 16 十月 2025 15:36:20 +0800
Subject: [PATCH] 定制商品
---
pages/customerManager/customerManager.vue | 236 +++++++++++++++++++++++++++++++++++++++++++---------------
1 files changed, 174 insertions(+), 62 deletions(-)
diff --git a/pages/customerManager/customerManager.vue b/pages/customerManager/customerManager.vue
index f2e7aa5..693cb5a 100644
--- a/pages/customerManager/customerManager.vue
+++ b/pages/customerManager/customerManager.vue
@@ -1,86 +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 style="height: 100vh;" @scrolltolower="loadMore" class="user-list"
- :lower-threshold="100"
- >
- <view >
- <view class="user-item" v-for="(user, index) in userList" :key="user.id" >
-
- <view class="user-info">
- <text class="realName">{{ user.realName }}</text>
- <text class="mobile">{{ user.mobile }}</text>
+ <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 class="action-buttons">
- <u-button type="primary" size="mini" @click.stop="restPassword(user.memberId)" class="edit-btn">閲嶇疆瀵嗙爜</u-button>
- <u-button type="primary" size="mini" @click.stop="navigateToDetail(user.id)" class="edit-btn">淇敼</u-button>
- <u-button type="error" size="mini" @click.stop="deleteUser(user.id)"
- class="delete-btn">鍒犻櫎</u-button>
- </view>
-
- </view>
</view>
- <!-- 鏀硅繘鐨勫姞杞芥洿澶氭彁绀� -->
- <view >
- <u-loadmore class="load-more"
- v-if="mockData.length > 0"
- :status="loading ? 'loading' : noMore ? 'nomore' : 'loadmore'"
- :load-text="{
+ <!-- 鏀硅繘鐨勫姞杞芥洿澶氭彁绀� -->
+ <view>
+ <u-loadmore class="load-more" v-if="memberList.length > 0"
+ :status="loading ? 'loading' : noMore ? 'nomore' : 'loadmore'" :load-text="{
loadmore: '涓婃媺鍔犺浇鏇村',
loading: '姝ｅ湪鍔犺浇',
nomore: '娌℃湁鏇村浜�'
- }"
- />
- </view>
- <view style="height:150rpx">
-
- </view>
+ }" />
+ </view>
+ <view style="height:150rpx">
+
+ </view>
</scroll-view>
-
-
-
+
+
+
</view>
</template>
<script>
- import UIcon from '@/uview-components/uview-ui/components/u-icon/u-icon.vue';
- import UButton from '@/uview-components/uview-ui/components/u-button/u-button.vue';
- import UForm from '@/uview-components/uview-ui/components/u-form/u-form.vue';
- import UFormItem from '@/uview-components/uview-ui/components/u-form-item/u-form-item.vue';
- import UInput from '@/uview-components/uview-ui/components/u-input/u-input.vue';
- import USearch from '@/uview-components/uview-ui/components/u-search/u-search.vue';
- import UPopup from '@/uview-components/uview-ui/components/u-popup/u-popup.vue';
- import ULoading from '@/uview-components/uview-ui/components/u-loading/u-loading.vue'
+ import {
+ getPage,
+ } from "@/api/customerManager.js"
+ import '@/components/uview-components/uview-ui';
export default {
- components: {
- UIcon,
- UButton,
- UForm,
- UFormItem,
- UInput,
- USearch,
- UPopup,
- ULoading
- },
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>
-.load-more {
- padding: 20rpx 0;
- text-align: center;
- color: #999;
- font-size: 26rpx;
- background-color: #f7f8fa;
+<style lang="scss" scoped>
+ .action-buttons {
+ display: flex;
+ margin-left: 20rpx;
+ }
+ .container {
+ padding: 20rpx;
+ height: 100vh;
+ display: flex;
+ flex-direction: column;
+ background-color: #f5f5f5;
+ }
+
+ .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;
}
-</style>
+
+
+ }
+
+ .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