From 2667d6931e0f85f3dda26238330d9c45385025cf Mon Sep 17 00:00:00 2001
From: wzp <2880584989@qq.com>
Date: 星期一, 21 二月 2022 17:51:57 +0800
Subject: [PATCH] 最新版本

---
 assetMgtH5/pages/assets/borrow.vue |  277 ++++++++++++++++++++++++++++++++++++-------------------
 1 files changed, 180 insertions(+), 97 deletions(-)

diff --git a/assetMgtH5/pages/assets/borrow.vue b/assetMgtH5/pages/assets/borrow.vue
index 21667bf..b1e190c 100644
--- a/assetMgtH5/pages/assets/borrow.vue
+++ b/assetMgtH5/pages/assets/borrow.vue
@@ -1,32 +1,37 @@
-<!-- 璧勪骇鍊熺敤 -->
 <template>
+	<!-- mescroll-body鏈川鏄師鐢焢age鐨勬粴鍔�,鏃犳硶鍍弇escroll-uni閭f牱鐢╢lex甯冨眬宓屽湪鏌愪釜view涓娇鐢ㄥ眬閮ㄥ尯鍩熸粴鍔�, 浣嗘槸鍙互閫氳繃fixed瀹氫綅鍏朵粬鍏冪礌鏉ュ疄鐜�"灞�閮ㄥ尯鍩熸粴鍔�"-->
 	<view>
-		<view class="">
-			<cu-custom bgColor="bg-gradual-blue" :isBack="true">
-				<block slot="backText">杩斿洖</block>
-				<block slot="content">璧勪骇鍊熺敤</block>
-			</cu-custom>
+		<!-- 椤堕儴 fixed瀹氫綅 -->
+		<view class="top-warp"> 
+			<view class="">
+				<cu-custom bgColor="bg-gradual-blue" :isBack="true">
+					<block slot="backText">杩斿洖</block>
+					<block slot="content">璧勪骇鍊熺敤</block>
+				</cu-custom>
+			</view>
+			
 		</view>
-		<view class="">
-			<view class="cu-bar bg-white solid-bottom ">
-				<view class="action">
-					<text class="cuIcon-title text-orange"></text> 鍙�熺敤璧勪骇鍒楄〃
-				</view>
+		<view class="search-box">
+			<view class="item">
+				<u-search placeholder="璇疯緭鍏ュ叧閿瓧鎼滅储" v-model="keyword" :clearabled="true" :show-action="false"
+					@search="onSearch">
+				</u-search>
 			</view>
-
-			<view class="" v-if="listFlag">
-				<u-empty mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png">
-				</u-empty>
-			</view>
-
-			<view class="cu-list menu-avatar">
+		</view>
+		
+		
+		
+		<!-- mescroll-body璺熼殢page婊氬姩, 涓嶅彲fixed瀹氫綅, 鍙缃� top, bottom, topbar, bottombar, safearea鐨勫亸绉婚噺-->
+		<mescroll-body ref="mescrollRef" top="176" bottom="300" @init="mescrollInit" @down="downCallback" @up="upCallback">
+			<view class="cu-list menu-avatar ">
 				<view class="cu-item" v-for="(item,index) in assetsList" :key="index">
-					<view class="cu-avatar radius lg bg-white" style="background-image:url(../../static/device.png)">
+					<view class="cu-avatar radius lg bg-white"
+						style="background-image:url(../../static/device.png)">
 					</view>
 					<view class="content">
 						<view>
 							<view class="text-cut text-bold text-xl">{{item.name}}</view>
-							<view class="cu-tag radius bg-orange sm">鍙�熺敤锛歿{item.quantity}}</view>
+							<view class="cu-tag radius bg-orange sm">鍙鐢細{{item.quantity}}</view>
 							<view class="numbox">
 								<u-number-box v-model="valueList[index]" :min="0" :max="item.quantity"
 									:showMinus="valueList[index] > 0">
@@ -45,29 +50,25 @@
 							<view class="text-cut">瑙勬牸锛歿{item.model?item.model:'鏃�'}} 缂栫爜锛歿{item.serialNumber}}</view>
 						</view>
 					</view>
-					<!-- <view class="action"> -->
-					<!-- <view class="text-grey text-xs">22:20</view> -->
-					<!-- <view class="cu-tag round bg-red sm">鍒犻櫎</view> -->
-					<!-- </view> -->
 				</view>
-
 			</view>
-
-
-			<!-- 鐢宠鐞嗙敱 -->
+		</mescroll-body>
+		
+		<!-- 搴曢儴 fixed瀹氫綅 -->
+		<view class="bottom-warp">
 			<view class="margin-top">
 				<view class="margin-left border-title">
 					鐢宠鐞嗙敱
 				</view>
 				<view class="flex justify-center align-center" style="margin-top: 10rpx;">
 					<view class="" style="width: 95%; ">
-						<u--textarea v-model="reason" placeholder="璇疯緭鍏ュ唴瀹�" placeholderStyle="font-size: 15rpx;">
+						<u--textarea height="50" v-model="reason" placeholder="璇疯緭鍏ュ唴瀹�" placeholderStyle="font-size: 15rpx;">
 						</u--textarea>
 					</view>
-
+			
 				</view>
 			</view>
-
+			
 			<view class="padding-left padding-top  border-title " style="padding-bottom: 10rpx;">
 				<view class="action">
 					鐢宠浜轰俊鎭�
@@ -78,113 +79,128 @@
 					<view class="">
 						鐢宠浜�: {{applicant}}
 					</view>
-					<view class="" style="margin-top: 5rpx;">
-						鑱屽姟: {{jobTitle}}
-					</view>
-					<view class="" style="margin-top: 5rpx;">
-						鐢宠鍗曚綅: {{applicationUnit}}
-					</view>
+
 					<view class="" style="margin-top: 5rpx;">
 						鐢宠鏃堕棿: {{applicationTime}}
 					</view>
 				</view>
 			</view>
-
+			
+			<view class="margin-top" style="margin-bottom: 30rpx;">
+				<u-button style="width: 40%;" type="primary" text="鎻愪氦鐢宠" @click="submit" :disabled="isDisabled"></u-button>
+			</view>
+			
+			<u-toast ref="uToast"></u-toast>
 		</view>
-
-
-		<view class="margin-top">
-			<u-button style="width: 40%;" type="primary" text="鎻愪氦鐢宠" @click="submit" :disabled="isDisabled"></u-button>
-		</view>
-
-		<u-toast ref="uToast"></u-toast>
 	</view>
 </template>
 
+
 <script>
+	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
+
+	
 	export default {
+		mixins: [MescrollMixin], // 浣跨敤mixin
 		data() {
 			return {
+				keyword: '',
 				value: 0,
 				reason: '',
+				total:0,
 				assetsList: [],
 				listFlag: false,
+				
 				valueList: [],
 				applicant: "", //鐢宠浜�
-				jobTitle: "", //鑱屽姟
-				applicationUnit: '', //鐢宠鍗曚綅
+				
 				applicationTime: '', //鐢宠鏃堕棿
 				templateId: '', //妯℃澘ID
-				isDisabled: false
+				isDisabled: false,
+				
+				
+				page: 1,
+				pageSize: 10,
+				status: 'loadmore',
+				user:null
 			}
 		},
+		onLoad() {
+			this.user =uni.getStorageSync('user');
+			this.applicant = this.user.userName;
+			this.applicationTime = this.$dayjs().format("YYYY-MM-DD HH:mm:ss")
+		},
 		onShow() {
-			console.log(this.$dayjs().format("YYYY-MM-DD"));
-			this.initUseListData();
 			this.initTemplateData();
 		},
 		methods: {
-			valChange(e) {
-				console.log('褰撳墠鍊间负: ' + e.value)
+			/*涓婃媺鍔犺浇鐨勫洖璋�: 鍏朵腑page.num:褰撳墠椤� 浠�1寮�濮�, page.size:姣忛〉鏁版嵁鏉℃暟,榛樿10 */
+			onSearch(e) {
+				console.log("鎼滅储锛�" + this.keyword)
+				this.page = 1;
+				let page ={};
+				page.num =1;
+				this.upCallback(page);
 			},
-			//鑾峰彇鍙鐢ㄨ澶�
-			initUseListData() {
+			
+			upCallback(page) {
+				
+				let pageNum = page.num; //椤电爜锛岄粯璁や粠1寮�濮�
+				let pageSize = 10; //椤甸暱锛岄粯璁ゆ瘡椤�10鏉�
+				
+				console.log(pageNum)
 				this.$http.get('/assets/approval/search', {
 						params: {
-							pageNum: "1",
-							pageSize: "3",
-							keyStr: '',
-							state: "2"
+							pageNum: pageNum,
+							pageSize: pageSize,
+							keyStr: this.keyword,
+							state: "1"
 						}
 					})
-
 					.then(res => {
-						// debugger;
 						if (res.data.code === 0) {
 							let data = res.data.rows;
-							this.assetsList = data;
-							// console.log(JSON.stringify(data.data))
-							// let tt = data.data;
-							console.log(data.length)
-						} else {
-							this.listFlag = true;
+							console.log(res.data.total)
+							if (page.num == 1) this.assetsList = []; //濡傛灉鏄涓�椤碉紝闇�鎵嬪姩缃┖鍒楄〃
+							this.assetsList = this.assetsList.concat(data); //杩藉姞鏂版暟鎹�
+							console.log(this.assetsList.length)
+							this.mescroll.endBySize(this.assetsList.length, res.data.total);
 						}
-
-
-					}).catch(err => {
-						this.listFlag = true;
-						console.log(err.data)
+						else{
+							this.mescroll.endBySize(0, 0);
+						}
+						
 					})
+					.catch(err => {
+						this.mescroll.endErr();
+						console.log('寮傚父', err);
+					});
 			},
 
-			//鑾峰彇棰嗙敤鐨勬ā鏉�
+			//鑾峰彇鍊熺敤鐨勬ā鏉�
 			initTemplateData() {
 				this.$http.get('/assets/approval/getTemplate')
 					.then(res => {
 						// debugger;
-
 						if (res.data.code === 0) {
 							let data = res.data.data;
-
-							console.log(data.length)
-
-							//鑾峰彇鍊熺敤鐨勬ā鏉縄D
+							//鑾峰彇棰嗙敤鐨勬ā鏉縄D
 							for (let i = 0; i < data.length; i++) {
 								if (data[i].type === 2) {
 									this.templateId = data[i].templateId;
 									break;
 								}
 							}
+							console.log('妯℃澘ID=' + this.templateId)
 						}
-
-
-
+			
+			
 					}).catch(err => {
-
+			
 						console.log(err.data)
 					})
 			},
-
+			
 			submit() {
 				this.isDisabled = true;
 				if (this.reason.length <= 0) {
@@ -199,15 +215,15 @@
 					this.isDisabled = false;
 					this.$refs.uToast.show({
 						type: 'error',
-						message: "璇烽�夋嫨涓�涓垨澶氫釜鍊熺敤璧勪骇锛�"
+						message: "璇烽�夋嫨涓�涓垨澶氫釜棰嗙敤璧勪骇锛�"
 					});
-
+			
 					return;
 				}
-
+			
 				this.submitApply();
 			},
-
+			
 			submitApply() {
 				let assets = [];
 				for (let i = 0; i < this.valueList.length; i++) {
@@ -221,19 +237,20 @@
 						})
 					}
 				}
-
-				console.log(assets);
+			
+				// console.log(assets);
 				let data = {
 					"assets": assets,
 					"templateId": this.templateId,
 					"reason": this.reason
 				}
-
+			
 				this.$http.post('/assets/approval/submit', data)
 					.then(res => {
-						debugger;
+						// debugger;
 						if (res.data.code === 0) {
-							console.log("鎴愬姛浜�")
+							console.log("鎴愬姛浜�");
+							this.reason="";
 							this.$refs.uToast.show({
 								type: 'success',
 								message: "鎻愪氦鎴愬姛"
@@ -245,7 +262,7 @@
 							});
 						}
 						this.isDisabled = false;
-
+			
 					}).catch(err => {
 						this.isDisabled = false;
 						console.log(err.data)
@@ -255,13 +272,79 @@
 	}
 </script>
 
+
 <style lang="scss">
+	/* 椤堕儴 fixed瀹氫綅*/
+	.top-warp{
+		z-index: 200;
+		position: fixed;
+		top: var(--window-top);
+		left: 0;
+		width: 100%;
+		height: 88rpx;
+		padding-top: 10rpx;
+		font-size: 28rpx;
+		text-align: center;
+		background-color: #CFE0DA;
+	}
+	
+	// 璁剧疆padding
+	.mescroll-body,
+	/deep/.mescroll-body{
+		padding-left: 0rpx;
+	}
+	
+	/* 搴曢儴 fixed瀹氫綅*/
+	.bottom-warp{
+		z-index: 200;
+		position: fixed;
+		left: 0;
+		bottom: 0;
+		width: 100%;
+		background-color: #FFFFFF;
+	}
+	
+	.itembox {
+		/* 鐖跺鍣ㄨ缃搴�, 骞惰秴鍑洪儴鍒嗕笉鏄剧ず */
+		width: 100%;
+		height: 100%;
+		overflow: scroll;
+	
+		.item {
+			/* 瀛愬鍣ㄦ瘮鐖跺鍣ㄧ殑瀹藉害澶� 17 px, 缁忔祴姝eソ鏄粴鍔ㄦ潯鐨勯粯璁ゅ搴� */
+			// width: 5517px;
+			// height: 100%;
+			// line-height: 30px;
+			text-align: center;
+			overflow-y: scroll;
+		}
+	
+	}
+	
+	.content-box {
+		position: relative;
+		// border: 1rpx red solid;
+		height: 50vh;
+	}
+	
+	.search-box {
+		background-color: #FFFFFF;
+		// margin-top: 88rpx;
+		z-index: 200;
+		top:88rpx;
+		width: 100%;
+		position: fixed;
+		padding: 10rpx 30rpx 0rpx 30rpx;
+		// border: 1rpx red solid;
+	}
+	
+	
 	.numbox {
 		margin-left: 20rpx;
 	}
-
+	
 	.minus {
-
+	
 		width: 15px;
 		height: 15px;
 		border-width: 1px;
@@ -274,11 +357,11 @@
 		justify-content: center;
 		align-items: center;
 	}
-
+	
 	.input {
 		padding: 0 5px;
 	}
-
+	
 	.plus {
 		width: 15px;
 		height: 15px;
@@ -290,4 +373,4 @@
 		justify-content: center;
 		align-items: center;
 	}
-</style>
+</style>
\ No newline at end of file

--
Gitblit v1.9.1