客户输入文字跳动修复

pages.json

@@ -1,5 +1,29 @@
 {
 	"pages": [
+		{
+            "path" : "pages/clients/clients",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "客户列表",
+                "enablePullDownRefresh": true
+            }
+        },
+        {
+            "path" : "pages/orders/orders",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "订单列表",
+                "enablePullDownRefresh": false
+            }
+        },
+        {
+            "path" : "pages/qrcode/qrcode",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "邀请加入",
+                "enablePullDownRefresh": false
+            }
+        },
         {
             "path" : "pages/send/send",
             "style" :                                                                                    
@@ -31,14 +55,6 @@
                 "navigationBarTitleText": "添加成员",
                 "enablePullDownRefresh": false
             }
-        },
-		{
-            "path" : "pages/clients/clients",
-            "style" :                                                                                    
-            {
-                "navigationBarTitleText": "客户列表",
-                "enablePullDownRefresh": true
-            }
         },
 		{
 			"path": "pages/index/index",
@@ -46,14 +62,6 @@
 				"navigationBarTitleText": "首页"
 			}
 		},
-        {
-            "path" : "pages/orders/orders",
-            "style" :                                                                                    
-            {
-                "navigationBarTitleText": "订单列表",
-                "enablePullDownRefresh": false
-            }
-        },
         {
             "path" : "pages/orderDetail/orderDetail",
             "style" :                                                                                    

pages/clientDetail/clientDetail.vue

@@ -1,9 +1,8 @@
 <template>
-	<view class="page">
+	<view :class="{page: isDetail}">
 		<uni-card v-if="customerId" :is-shadow="false" :border="false" is-full>
 			<view class="info">
 				<view class="name">{{ form.customerName }}</view>
-				<view class="text">客户编号：2124232</view>
 				<view class="text">客户类型：{{ customerType }}</view>
 				<view class="text">产品到期时间：{{ form.expireDate || '' }}</view>
 			</view>
@@ -33,22 +32,22 @@
 						</uni-data-picker>
 					</uni-forms-item>
 					<uni-forms-item label="联系人姓名" name="name" required>
-						<uni-easyinput v-model="form.name" placeholder="请输入联系人姓名" :disabled="isDetail" />
+						<uni-easyinput ref="nameInput" placeholder="请输入联系人姓名" :disabled="isDetail" />
 					</uni-forms-item>
 					<uni-forms-item label="手机" name="phone">
-						<uni-easyinput v-model="form.phone" placeholder="请输入手机" :disabled="isDetail" />
+						<uni-easyinput ref="phoneInput" placeholder="请输入手机" :disabled="isDetail" />
 					</uni-forms-item>
 					<uni-forms-item label="账号" name="account" required>
-						<uni-easyinput v-model="form.account" placeholder="请以院校首字母+admin的格式来设置" :disabled="isDetail" />
+						<uni-easyinput ref="accountInput" placeholder="请以院校首字母+admin的格式来设置" :disabled="isDetail" />
 					</uni-forms-item>
 					<uni-forms-item label="职务" name="position">
-						<uni-easyinput v-model="form.position" placeholder="请输入职务" :disabled="isDetail" />
+						<uni-easyinput ref="positionInput" placeholder="请输入职务" :disabled="isDetail" />
 					</uni-forms-item>
 					<uni-forms-item label="邮箱" name="email">
-						<uni-easyinput v-model="form.email" placeholder="请输入邮箱" :disabled="isDetail" />
+						<uni-easyinput ref="emailInput" placeholder="请输入邮箱" :disabled="isDetail" />
 					</uni-forms-item>
 					<uni-forms-item label="产品到期时间">
-						<uni-datetime-picker type="datetime" return-type="timestamp" v-model="form.expireDate" disabled />
+						<uni-easyinput v-model="form.expireDate" disabled />
 					</uni-forms-item>
 					<uni-forms-item label="客户类型">
 						<uni-easyinput v-model="customerType" disabled />
@@ -181,6 +180,11 @@
 				}).then(({ result }) => {
 					const { customer } = result
 					this.form = customer
+					this.$refs.nameInput.val = customer.name
+					this.$refs.phoneInput.val = customer.phone
+					this.$refs.accountInput.val = customer.account
+					this.$refs.positionInput.val = customer.position
+					this.$refs.emailInput.val = customer.email
 					this.customerType = this.customerTypeList.find(e => e.value === customer.customerType).name
 				}).catch(e => {})
 			},
@@ -237,24 +241,33 @@
 			},
 			// 提交
 			submit(ref) {
-				this.$refs.form.validate().then(res => {
+				const refs = this.$refs
-					if (this.nameRepeat) return this.$util.errMsg('客户已存在！')
+				const { form } = this
-					if (this.customerId) {
+				form.name = refs.nameInput.val
-						updateCustomer(this.form).then(res => {
+				form.account = refs.accountInput.val
-							this.$util.sucMsg('编辑成功')
+				form.position = refs.positionInput.val
-							setTimeout(() => {
+				form.phone = refs.phoneInput.val
-								this.$util.to('../clients/clients')
+				form.email = refs.emailInput.val
-							}, 1500)
+				this.$nextTick(() => {
-						}).catch(res => {})
+					this.$refs.form.validate().then(res => {
-					} else {
+						if (this.nameRepeat) return this.$util.errMsg('客户已存在！')
-						addCustomer(this.form).then(res => {
+						if (this.customerId) {
-							this.$util.sucMsg('添加成功')
+							updateCustomer(form).then(res => {
-							setTimeout(() => {
+								this.$util.sucMsg('编辑成功')
-								uni.navigateBack()
+								setTimeout(() => {
-							}, 1500)
+									this.$util.to('../clients/clients')
-						}).catch(res => {})
+								}, 1500)
-					}
+							}).catch(res => {})
-				}).catch(err => {})
+						} else {
+							addCustomer(form).then(res => {
+								this.$util.sucMsg('添加成功')
+								setTimeout(() => {
+									uni.navigateBack()
+								}, 1500)
+							}).catch(res => {})
+						}
+					}).catch(err => {})
+				})
 			},
 		}
 	}
@@ -266,6 +279,7 @@
 }
 .info {
 	.name {
+		margin-bottom: 5px;
 		font-size: 16px;
 		color: #333;
 	}

pages/clients/clients.vue

@@ -4,8 +4,6 @@
 			<li v-for="(tab, i) in tabs" :class="{active: curTab === tab.id}" @click="tabChange(tab)">{{ tab.name }}</li>
 		</ul>
 
-		
-
 		<uni-card :is-shadow="false" :border="false" padding="0" is-full>
 			<view class="filter">
 				<uni-search-bar class="search" radius="5" placeholder="请输入客户名称" v-model="keyword" clearButton="auto" cancelButton="none" @confirm="search" />
@@ -74,7 +72,6 @@
 					}
 				],
 				reachBottom: 0, // 是否是上拉加载。0->否,1->是,-1->加载完所有数据
-				isFilter: 0, // 是否是在筛选。0->否,1->是
 				status: 'more', // 上拉加载状态 more|loading|noMore
 				searchTimer: null,
 				customerType: '',
@@ -91,7 +88,6 @@
 			keyword (newName, oldName) {
 				clearTimeout(this.searchTimer)
 				this.searchTimer = setTimeout(() => {
-					this.isFilter = 1
 					this.initList()
 				}, 500)
 			}
@@ -111,8 +107,8 @@
 				this.getList()
 			}
 		},
-		onLoad() {
+		onShow() {
-			this.getList()
+			this.initList()
 		},
 		methods: {
 			getList() {
@@ -125,16 +121,16 @@
 					size: this.pageSize
 				}).then(({ message }) => {
 					// 未加载完所有数据，并且不是筛选，则拼接list，否则直接赋值
-					this.list = (this.reachBottom >= 0 && !this.isFilter) ? [...this.list, ...message.list] : message.list
+					this.list = this.reachBottom > 0 ? [...this.list, ...message.list] : message.list
 					this.page++ // 每次获取了数据后page+1
 					const noMore = this.list.length === message.totalCount // 是否加载完所有数据
 					this.status = noMore ? 'noMore' : 'more' // 加载完了则设置为noMore
 					this.reachBottom = noMore ? -1 : 0 // 加载完了则设置为-1
-					this.isFilter = 0 // 获取数据后筛选状态重置为0
 				}).catch(e => {})
 			},
 			initList() {
 				this.page = 1
+				this.reachBottom = 0
 				this.getList()
 			},
 			// 筛选确定回调

pages/orders/orders.vue

@@ -4,12 +4,14 @@
 			<li v-for="(tab, i) in tabs" :class="{active: curTab === tab.id}" @click="tabChange(tab)">{{ tab.name }}</li>
 		</ul>
 		
-		<sl-filter :independence="true" :menuList="menuList" @result="result"></sl-filter>
-		
 		<uni-card :is-shadow="false" :border="false" padding="0" is-full>
 			<uni-search-bar class="search" radius="5" placeholder="请输入姓名、订单号" clearButton="auto" cancelButton="none" @confirm="search" />
 		</uni-card>
 		
+		<view class="filter">
+			<sl-filter :independence="true" :menuList="menuList" @result="result"></sl-filter>
+		</view>
+		
 		<uni-card :is-shadow="false" :border="false" is-full>
 			<ul class="list">
 				<li @click="toDetail({})">
@@ -166,16 +168,9 @@
 	}
 </script>
 
-<style lang="scss">
+<style scoped lang="scss">
-.top {
+.filter {
-	display: flex;
-	align-items: center;
-	padding: 5px 15px 5px 5px;
 	margin-bottom: 10px;
-	background-color: #fff;
-	.search {
-		flex: 1;
-	}
 }
 .list {
 	.num {

pages/qrcode/qrcode.vue

@@ -0,0 +1,76 @@
+<template>
+	<view class="page">
+		<view class="wrap">
+			<view class="info">
+				<image class="avatar" src="../../static/avatar.jpg" mode=""></image>
+				<view class="text">
+					<view class="invite">
+						<text class="name">Jane</text> 邀请你加入
+					</view>
+					<view class="com">宁德时代股份有限公司</view>
+				</view>
+			</view>
+			<image class="qrcode" src="https://pic.baike.soso.com/p/20130307/20130307133645-1010261466.jpg" mode=""></image>
+			<view class="tips">扫一扫，加入我们吧</view>
+			<view class="warn">邀请二维码失效日期：2022年2月2日</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+.wrap {
+	padding: 20px 40px;
+	margin: 60px 40px 0;
+	text-align: center;
+	background-color: #fff;
+	.info {
+		display: flex;
+		align-items: center;
+		text-align: left;
+	}
+	.avatar {
+		width: 40px;
+		height: 40px;
+		margin-right: 10px;
+		border-radius: 50%;
+	}
+	.invite {
+		margin-bottom: 5px;
+		font-size: 15px;
+	}
+	.name {
+		font-size: 13px;
+		color: $uni-primary;
+	}
+	.com {
+		font-size: 13px;
+	}
+	.qrcode {
+		width: 280px;
+		height: 280px;
+		margin-top: 20px;
+	}
+	.tips {
+		margin: 10px 0 10px;
+		font-size: 12px;
+		color: #333;
+	}
+	.warn {
+		font-size: 12px;
+		color: #f00;
+	}
+}
+</style>