Browse Source

添加下拉加载刷新

MS-FUUVYHVOEAYJ\Administrator 11 months ago
parent
commit
a53a53c6f9

+ 2 - 1
RuoYi-Vue-v3.8.7/ruoyi-admin/src/main/resources/static/page/goods/detail.html

@@ -273,7 +273,6 @@
 			var layer = layui.layer;
 			var node = document.getElementById('imgList');
 			var images = node.querySelectorAll('img');
-			console.log(images)
 			for (var i = 0; i < images.length; i++) {
 				// 获取图片元素
 				var img = document.getElementById(images[i].id);
@@ -308,6 +307,7 @@
 			}
 			mui.ajax({
 				url: window.location.origin+'/system/dept/getAsset',
+				// url:'http://58.144.199.81:9081/system/dept/getAsset',
 				type: 'get',
 				data: {
 					id: params.get('id'),
@@ -319,6 +319,7 @@
 						$('#kfName').text(result.savedepartment)
 						$('#kfAdmin').text(result.duty)
 						$('#goodsName').text(result.name)
+						$(document).attr("title",result.name);
 						$('#title').text(result.name)
 						$('#goodType').text(result.assettype)
 						$('#goodsType').text(result.size ? result.size : "无")

+ 131 - 100
RuoYi-Vue-v3.8.7/ruoyi-admin/src/main/resources/static/page/goods/goods.html

@@ -85,124 +85,155 @@
 				<img src="images/search.png"></img><span>搜索</span>
 			</div>
 		</div>
-        <div id="pullrefresh" class="mui-content mui-scroll-wrapper" style="top: 100px;">
-		<div class="mui-card">
-			<ul id="kfList" class="mui-table-view mui-table-view-striped mui-table-view-condensed">
+		<div id="pullrefresh" class="mui-content mui-scroll-wrapper" style="top: 100px;">
+			<div class="mui-card" id="mui-content">
+				<ul id="kfList" class="mui-table-view mui-table-view-striped mui-table-view-condensed">
 
-			</ul>
+				</ul>
+			</div>
 		</div>
-	</div>
-	<script src="js/jquery.min.js"></script>
-	<script src="js/mui.min.js"></script>
-	<script>
-        let pageNum = 1;
-        let pageSize = 5;
-		function getDatalist(typeName, callback) {
-			const params = new URLSearchParams(window.location.search);
-			mui.ajax({
-				// url: window.location.origin +'/wzglxtht/system/goods/getGoodsList?kufangId=' + params.get('id'),
-				url:  window.location.origin+'/system/dept/assetList',
-                // url: 'http://58.144.199.81:9081' + '/system/dept/assetList',
-				type: 'get',
-				data: {
-					pageNum: pageNum,
-					pageSize: pageSize,
-					assetName: typeName ? typeName : "",
-					departmentId: params.get('departmentId'),
-					companyId: params.get('id'),
-					dutyId: params.get('dutyId'),
-					codeId: 1
-				},
-				success: function (json) {
-                    if (pageNum == 1) {
-                        $('#kfList').empty();
-                    }
-                    if (callback) {
-                        callback(parseInt(json.total))
-                    }
-					if (json.rows && json.rows.length) {
-						let html = ''
-						for (let i = 0; i < json.rows.length; i++) {
-							html += `<li class="mui-table-view-cell" data-id="${json.rows[i].id}" >
+		<script src="js/jquery.min.js"></script>
+		<script src="js/mui.min.js"></script>
+		<script>
+			let pageNum = 1;
+			let pageSize = 5;
+			function getDatalist(typeName, callback) {
+				const params = new URLSearchParams(window.location.search);
+				mui.ajax({
+					// url: window.location.origin +'/wzglxtht/system/goods/getGoodsList?kufangId=' + params.get('id'),
+					url:  window.location.origin+'/system/dept/assetList',
+					// url: 'http://58.144.199.81:9081' + '/system/dept/assetList',
+					type: 'get',
+					data: {
+						pageNum: pageNum,
+						pageSize: pageSize,
+						assetName: typeName ? typeName : "",
+						departmentId: params.get('departmentId'),
+						companyId: params.get('id'),
+						dutyId: params.get('dutyId'),
+						codeId: 1
+					},
+					success: function (json) {
+						if (pageNum == 1) {
+							$('#kfList').empty();
+						}
+						if (callback) {
+							callback(parseInt(json.total))
+						}
+						if (json.rows && json.rows.length) {
+							let html = ''
+							for (let i = 0; i < json.rows.length; i++) {
+								html += `<li class="mui-table-view-cell" data-id="${json.rows[i].id}" >
 									<div class="mui-table">
 										<div class="mui-table-cell mui-col-xs-10">
 											<div class="mui-ellipsis">${json.rows[i].name}</div>
 											<div style="padding:10px;">
 											<div class="list" style="margin-top:0;"><div class="listTitle">入库时间:</div><div style="color: #333;">${json.rows[i].created.split('T00')[0] ? json.rows[i].created.split('T00')[0] : ""}</div></div>
 											<div class="list"><div class="listTitle">购入时间:</div><div style="color: #333;">${json.rows[i].buyed.split('T00')[0] ? json.rows[i].buyed.split('T00')[0] : ""}</div></div>
-											<div class="list"><div class="listTitle">装备数量:</div><div style="color: #333;">${json.rows[i].quantity ? json.rows[i].quantity: ""}</div></div>
+											<div class="list"><div class="listTitle">装备数量:</div><div style="color: #333;">${json.rows[i].quantity ? json.rows[i].quantity : ""}</div></div>
 											<div class="list"><div class="listTitle">报废数量:</div><div style="color: #333;">${json.rows[i].scrapNum ? json.rows[i].scrapNum : 0}</div></div>
 											<div class="list"><div class="listTitle">剩余数量:</div><div style="color: #333;">${json.rows[i].quantity ? json.rows[i].quantity : ""}</div></div>
 										</div>
 									</div>
 								</li>`
+							}
+							$('#kfList').append(html)
 						}
-						$('#kfList').append(html)
-					}else{
-						$('#kfList').empty().append("<p style='text-align: center;margin-top: 10px;'>暂无数据</p>")
+					}
+				})
+				mui("#kfList").on('tap', '.mui-table-view-cell', function () {
+					document.getElementById('searchInput').value = "";
+					pageNum = 1
+					setTimeout(function () {
+						getDatalist(null, function () {
+							mui('#pullrefresh').pullRefresh().endPullupToRefresh(false);
+							mui('#pullrefresh').pullRefresh().refresh(true);
+						})
+						mui('#pullrefresh').pullRefresh().scrollTo(0, 0, 100)
+					}, 1000)
+					const id = this.getAttribute('data-id')
+					mui.openWindow({
+						id: 'detail',
+						url: 'detail.html?type=1&id=' + id
+					});
+				})
+			}
+			mui.init({
+				statusBarBackground: '#f7f7f7',
+				pullRefresh: {
+					container: '#pullrefresh',
+					down: {
+						style: 'circle',
+						callback: pulldownRefresh
+					},
+					up: {
+						auto: true,
+						contentrefresh: '正在加载...',
+						callback: pullupRefresh
 					}
 				}
+			});
+			mui.ready(() => {
+				const params = new URLSearchParams(window.location.search);
+				if (params.get('type') == 1) {
+					$('#title').text('库房--' + params.get('name'))
+					//设置地址栏标题
+					$(document).attr("title",'库房--' + params.get('name'));
+					$('#go-back').css({ 'display': 'block' })
+				}
 			})
-			mui("#kfList").on('tap', '.mui-table-view-cell', function () {
-				document.getElementById('searchInput').value="";
-				getDatalist();
-				const id = this.getAttribute('data-id')
-				mui.openWindow({
-					id: 'detail',
-					url: 'detail.html?type=1&id='+id
-				});
-			})
-		}
-		mui.init({
-			statusBarBackground: '#f7f7f7',
-            pullRefresh: {
-                container: '#pullrefresh',
-                down: {
-                    style:'circle',
-                    callback: pulldownRefresh
-                },
-                up: {
-                    auto:true,
-                    contentrefresh: '正在加载...',
-                    callback: pullupRefresh
-                }
-        }
-		});
-		mui.ready(() => {
-			const params = new URLSearchParams(window.location.search);
-			if (params.get('type') == 1) {
-				$('#title').text('库房--' + params.get('name'))
-				$('#go-back').css({ 'display': 'block' })
-			}
-			// getDatalist();
-		})
 
-		var node = document.getElementById("search");
-		// 绑定点击事件
-		node.onclick = function () {
-			var searchInput = document.getElementById('searchInput').value;
-			getDatalist(searchInput);
-		};
-		function goindex(){
-			console.log(11)
-			window.location.href="total.html"
-		}
-        function pulldownRefresh() {
-            pageNum = 1
-            setTimeout(function() {
-                getDatalist(null, function() {
-                    mui('#pullrefresh').pullRefresh().endPulldownToRefresh();
-                })
-            }, 1000)
-        }
-        function pullupRefresh() {
-            setTimeout(function() {
-                getDatalist(null, function(goodsTotal) {
-                    mui('#pullrefresh').pullRefresh().endPullupToRefresh((++pageNum > (parseInt(goodsTotal/pageSize) + goodsTotal%pageSize)));
-                })
-            }, 1000)
-        }
-	</script>
+			var node = document.getElementById("search");
+			// 绑定点击事件
+			node.onclick = function () {
+				pageNum = 1
+				var searchInput = document.getElementById('searchInput').value;
+				setTimeout(function () {
+					getDatalist(searchInput, function (goodsTotal) {
+						mui('#pullrefresh').pullRefresh().endPullupToRefresh(goodsTotal < pageSize);
+						if (!(goodsTotal < pageSize)) {
+							mui('#pullrefresh').pullRefresh().refresh(true);
+						} else {
+							$(".mui-pull-bottom-pocket.mui-block").css("visibility", "visible");
+						}
+					})
+					mui('#pullrefresh').pullRefresh().scrollTo(0, 0, 100)
+				}, 1000)
+			};
+			function goindex() {
+				window.location.href = "total.html"
+			}
+			function pulldownRefresh() {
+				$(".mui-pull-caption.mui-pull-caption-nomore").text("");
+				document.getElementById('searchInput').value = "";
+				pageNum = 1
+				setTimeout(function () {
+					getDatalist(null, function (goodsTotal) {
+						if (goodsTotal) {
+							mui('#pullrefresh').pullRefresh().endPullupToRefresh(false);
+							mui('#pullrefresh').pullRefresh().refresh(true);
+						}else{
+							mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
+							$(".mui-pull-caption.mui-pull-caption-nomore").text("暂无数据");
+						}
+					})
+					mui('#pullrefresh').pullRefresh().scrollTo(0, 0, 100)
+				}, 1000)
+			}
+			function pullupRefresh() {
+				var searchInput = document.getElementById('searchInput').value;
+				setTimeout(function () {
+					getDatalist(searchInput, function (goodsTotal) {
+						if (goodsTotal) {
+							mui('#pullrefresh').pullRefresh().endPullupToRefresh((++pageNum > (parseInt(goodsTotal / pageSize) + goodsTotal % pageSize)));
+						} else if(!goodsTotal&&(pageNum==1)){
+							mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
+							$(".mui-pull-caption.mui-pull-caption-nomore").text("暂无数据");
+						}
+					})
+				}, 1000)
+			}
+		</script>
 </body>
 
 </html>

+ 1 - 1
RuoYi-Vue-v3.8.7/ruoyi-admin/src/main/resources/static/page/goods/total.html

@@ -93,6 +93,7 @@
 			mui.ajax({
 				// url: window.location.origin +'/wzglxtht/system/goods/getOpenKuFangList?userId=' + params.get('id'),
 				url:  window.location.origin+'/system/dept/getDepartments',
+				// url:  'http://58.144.199.81:9081/system/dept/getDepartments',
 				type: 'get',
 				data: {
 					departmentName: departmentName ? departmentName : "",
@@ -102,7 +103,6 @@
 					if (json.data && json.data.length) {
 						let html = ''
 						for (let i = 0; i < json.data.length; i++) {
-							console.log(json.data[i])
 							html += `<li class="mui-table-view-cell" data-id="${json.data[i].DepartMentDto.companyId}" data-departmentId="${json.data[i].DepartMentDto.departmentId}" data-name="${json.data[i].DepartMentDto.name}"
 							data-kgyIds="${json.data[i].kgyIds}">
 									<div class="mui-table">