客户欠款页面接口对接

ghs/src/api/member/index.js

@@ -1,36 +1,45 @@
-import https from '@/plugins/luch-request_0.0.7/request'
+import https from "@/plugins/luch-request_0.0.7/request";
 
 /** *
  * 客户列表 b
  */
 export const getList = data => {
-	return https.get('/custom/list', data)
-}
+	return https.get("/custom/list", data);
+};
 
 /** *
  * 商家端客户详情，包括资产、订单和备注 b
  */
 export const getUserDet = data => {
-	return https.get('/custom/detail', data)
-}
+	return https.get("/custom/detail", data);
+};
 
 /** *
  * 获取客户详情，包括资产 b
  */
 export const getDet = data => {
-	return https.get('/user/detail', data)
-}
+	return https.get("/user/detail", data);
+};
 
 /** *
  * 添加客户 b
  */
 export const add = data => {
-	return https.post('/custom/add', data)
-}
+	return https.post("/custom/add", data);
+};
 // 延期付
 export const debt = data => {
-	return https.get('/custom/debt', data)
-}
+	return https.get("/custom/debt", data);
+};
+
+/**
+ * 客户欠款列表查询
+ * @param {*} name
+ */
+export const getDebtListApi = name => {
+	return https.get("/custom/debt-list", { name });
+};
+
 /** *
  * 给客户充值 b
  */

ghs/src/pagesArrears/list.vue

@@ -1,41 +1,39 @@
 <template>
 	<view class="order-page">
 		<view class="input-wrap">
-			<AppSearchModule placeholder="输入客户" @search="searchFn" />
+			<AppSearchModule v-model="name" placeholder="输入客户" @search="searchFn" />
 		</view>
 		<scroll-view scroll-y class="shop-list">
-			<view class="shop-item" v-for="(item, index) in orderList" :key="index">
-				<view class="item-header">
-					<image
-						class="logo"
-						src="https://img.huaml.com/uploads/12358/202005/29/de74c55596d304b85e79154958e8bf57_small.jpeg"
-						alt="商品图"
-					/>
-					<text class="name">国兰花尚-文灶店 </text>
-				</view>
-				<view class="item-main">
-					<view class="phone">15280215347 </view>
-					<view 
-						@click="pageTo({
-							url: '/pagesOrder/detail',
-							query: {
-								id: 0
-							}
-						})"
-						class="price"
-						>¥580.50 <text class="iconfont iconxiangyou"></text>
+			<block v-if="!$util.isEmpty(list.data)">
+				<view class="shop-item" v-for="(item, index) in list.data" :key="index">
+					<view class="item-header">
+						<image
+							class="logo"
+							src="https://img.huaml.com/uploads/12358/202005/29/de74c55596d304b85e79154958e8bf57_small.jpeg"
+							alt="商品图"
+						/>
+						<text class="name">{{ item.name }} </text>
+					</view>
+					<view class="item-main">
+						<view class="phone">{{ item.mobile }} </view>
+						<view @click="gotoDetailsEvent(item)" class="price"
+							>¥{{ item.debtAmount }} <text class="iconfont iconxiangyou"></text>
+						</view>
 					</view>
 				</view>
-			</view>
+			</block>
+			<block v-else>
+				<AppWrapperEmpty title="暂无数据" :is-empty="$util.isEmpty(list.data)" />
+			</block>
 		</scroll-view>
 		<view class="bar-view">
 			<view class="price-view">
-				共44笔，合计
+				共{{ customNum }}笔，合计
 				<text class="unit">
 					-¥
 				</text>
 				<text class="price">
-					7867531.95
+					{{ debtAmount }}
 				</text>
 			</view>
 		</view>
@@ -44,80 +42,71 @@
 <script>
 import AppSearchModule from "@/components/module/app-search";
 import AppWrapperEmpty from "@/components/app-wrapper-empty";
+import { getDebtListApi } from "@/api/member/index";
+import { list } from "@/mixins";
 
 export default {
 	components: { AppSearchModule, AppWrapperEmpty },
+	mixins: [list],
+
 	data() {
 		return {
-			tabs: [
-				{
-					name: "全部",
-					key: "25",
-					value: "25"
-				},
-				{
-					name: "待确认",
-					key: "01",
-					value: "25"
-				},
-				{
-					name: "待配送",
-					key: "02",
-					value: "25"
-				},
-				{
-					name: "配送中",
-					key: "03",
-					value: "25"
-				},
-				{
-					name: "已完成",
-					key: "03",
-					value: "25"
-				},
-				{
-					name: "未完成",
-					key: "03",
-					value: "25"
-				},
-				{
-					name: "未完成",
-					key: "03",
-					value: "25"
-				},
-				{
-					name: "未完成",
-					key: "03",
-					value: "25"
-				}
-			],
-			orderList: [
-				{
-					orderNo: "PD20201217212800156",
-					name: "小许",
-					dateTime: "2020-7-10 21:50",
-					count: "101",
-					status: "01",
-					statusName: "已出库"
-				},
-				{
-					orderNo: "PD20201217212800156",
-					name: "小许",
-					dateTime: "2020-7-10 21:50",
-					count: "101",
-					status: "02",
-					statusName: "待出库"
-				},
-				{
-					orderNo: "PD20201217212800156",
-					name: "小许",
-					dateTime: "2020-7-10 21:50",
-					count: "101",
-					status: "03",
-					statusName: "已取消"
-				}
-			]
+			name: "",
+			customNum: "",
+			debtAmount: ""
 		};
+	},
+	onShow() {
+		if (!this.listLoading) {
+			this.searchFn();
+		}
+	},
+	onPullDownRefresh() {
+		this.resetList();
+		this._list().then(res => {
+			uni.stopPullDownRefresh();
+		});
+	},
+	methods: {
+		async init() {
+			this._list();
+		},
+		_list() {
+			this.listLoading = true;
+			return getDebtListApi(this.name)
+				.then(res => {
+					const {
+						data: { customNum, debtAmount }
+					} = res;
+					this.customNum = customNum;
+					this.debtAmount = debtAmount;
+
+					this.completes(res);
+					this.listLoading = false;
+				})
+				.catch(err => {
+					this.listLoading = false;
+				});
+		},
+		gotoDetailsEvent(item) {
+			// uni.navigateTo({
+			// 	url: `/pagesArrears/details?id=${item.id}`,
+			// 	success: result => {},
+			// 	fail: () => {},
+			// 	complete: () => {}
+			// });
+
+			this.pageTo({
+				url: "/pagesArrears/details",
+				query: {
+					id: item.id
+				}
+			});
+		},
+		searchFn() {
+			this.resetList();
+			this.init();
+		}
 	}
 };
 </script>