修改页面样式

RuoYi-Vue-v3.8.7/ruoyi-admin/package-lock.json

@@ -0,0 +1,6 @@
+{
+  "name": "ruoyi-admin",
+  "lockfileVersion": 2,
+  "requires": true,
+  "packages": {}
+}

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

@@ -306,8 +306,8 @@
 				$('#go-back').css({ 'display': 'block' })
 			}
 			mui.ajax({
-				url: window.location.origin+'/system/dept/getAsset',
-				// url: 'http://58.144.199.81:9081/system/dept/getAsset',
+				// url: window.location.origin+'/system/dept/getAsset',
+				url: 'http://58.144.199.81:9081/system/dept/getAsset',
 				type: 'get',
 				data: {
 					id: params.get('id'),

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

@@ -76,16 +76,220 @@
 		</a>
 		<h1 id="title" class="mui-title">库房</h1>
 	</header>
+	<style>
+		.title {
+			display: flex;
+			margin: 10px;
+			height: 50px;
+			background: #FFFFFF;
+			border-radius: 10px;
+			align-items: center;
+			justify-content: space-between;
+			padding: 0 10px;
+		}
+
+		.title>.left {
+			display: flex;
+			align-items: center;
+		}
+
+		.title>.left img {
+			width: 32px;
+			height: 34px;
+			margin-top: 6px;
+		}
+
+		.title .name {
+			font-weight: bold;
+			font-size: 24px;
+			color: #1484FE;
+		}
+
+		.arrow {
+			width: 16px;
+			height: 9px;
+		}
+
+		.content-zchz {
+			display: flex;
+			flex-wrap: wrap;
+			justify-content: space-between;
+			padding: 0 10px;
+		}
+
+		.content-zchz .list {
+			width: 32%;
+			border-radius: 10px;
+			color: #999999;
+			font-size: 16px;
+			background: #FFFFFF;
+			height: 84px;
+			display: flex;
+			flex-direction: column;
+			justify-content: space-around;
+			padding-left: 10px;
+			margin-bottom: 10px;
+		}
+
+		.content-zchz .list>.top {
+			display: flex;
+		}
+
+		.content-zchz .list>.top img {
+			width: 30px;
+			height: 22px;
+		}
+
+		.content-zchz .list>.bottom {
+			display: flex;
+			align-items: flex-end;
+		}
+
+		.content-zchz .list>.bottom .number {
+			color: #333;
+			font-size: 24px;
+			padding-bottom: 2px;
+			margin-right: 10px;
+		}
+
+		.typeSelect {
+			display: flex;
+			align-items: center;
+			width: 150px;
+			height: 40px;
+			background-color: #fff;
+			border-radius: 10px 0px 0px 10px;
+		}
+
+		#mySelect {
+			width: auto;
+			height: 30px;
+			padding: 0 10px;
+			margin-bottom: 0;
+			font-size: 16px;
+			width: 100px;
+		}
+
+		select {
+			appearance: none;
+			-moz-appearance: none;
+			-webkit-appearance: none;
+			border: none;
+			outline: none;
+		}
+
+		option {
+			border: none;
+		}
+
+		#searchInput {
+			width: calc(100% - 80px);
+			height: 40px;
+			background: #FFFFFF;
+			border: none;
+			margin-bottom: 0;
+		}
+
+		#conSs .line {
+			width: 1px;
+			background-color: #999;
+			height: 30px;
+		}
+	</style>
 	<div class="mui-content">
-		<div style="display: flex;margin: 10px;">
-			<input type="text" placeholder="请输入关键字" id="searchInput"
-				style="width: calc(100% - 80px);height: 40px;background: #FFFFFF;border-radius: 10px 0px 0px 10px;border: none;margin-bottom: 0;">
+		<div class="title">
+			<div class="left">
+				<img src="images/icon-zc.png" alt="">
+				<div class="name">资产汇总</div>
+			</div>
+			<img class="arrow" src="images/arrow.png" id="arrowZchz"></img>
+		</div>
+		<div class="content-zchz" id="conZchz">
+			<div class="list">
+				<div class="top">
+					<img src="images/logo-fx.png" alt="">
+					<span>防汛抗旱</span>
+				</div>
+				<div class="bottom">
+					<div class="number">35423</div>
+					<div>件</div>
+				</div>
+			</div>
+			<div class="list">
+				<div class="top">
+					<img src="images/logo-sl.png" alt="">
+					<span>森林防灭火</span>
+				</div>
+				<div class="bottom">
+					<div class="number">198542</div>
+					<div>件</div>
+				</div>
+			</div>
+			<div class="list">
+				<div class="top">
+					<img src="images/logo-dz.png" alt="">
+					<span>地震地质灾害救援</span>
+				</div>
+				<div class="bottom">
+					<div class="number">35423</div>
+					<div>件</div>
+				</div>
+			</div>
+			<div class="list">
+				<div class="top">
+					<img src="images/logo-tx.png" alt="">
+					<span>通讯指挥</span>
+				</div>
+				<div class="bottom">
+					<div class="number">35423</div>
+					<div>件</div>
+				</div>
+			</div>
+			<div class="list">
+				<div class="top">
+					<img src="images/logo-jy.png" alt="">
+					<span>救援保障</span>
+				</div>
+				<div class="bottom">
+					<div class="number">35423</div>
+					<div>件</div>
+				</div>
+			</div>
+			<div class="list">
+				<div class="top">
+					<img src="images/logo-sc.png" alt="">
+					<span>生产安全事故救援</span>
+				</div>
+				<div class="bottom">
+					<div class="number">35423</div>
+					<div>件</div>
+				</div>
+			</div>
+		</div>
+		<div class="title">
+			<div class="left">
+				<img src="images/icon-ss.png" alt="">
+				<div class="name">搜索</div>
+			</div>
+			<img class="arrow" src="images/arrow.png" id="arrowSs"></img>
+		</div>
+		<div style="display: flex;margin: 10px;align-items: center;" id="conSs">
+			<div class="typeSelect">
+				<select id="mySelect">
+					<option value="option1">防汛抗旱</option>
+					<option value="option2">防汛抗旱防汛抗旱</option>
+					<option value="option3">防汛抗旱</option>
+				</select>
+				<img class="arrow" src="images/arrow.png" style="margin-right: 10px;"></img>
+				<div class="line"></div>
+			</div>
+			<input type="text" placeholder="请输入关键字" id="searchInput">
 			</input>
 			<div class="search" id="search">
 				<img src="images/search.png"></img><span>搜索</span>
 			</div>
 		</div>
-		<div id="pullrefresh" class="mui-content mui-scroll-wrapper" style="top: 100px;">
+		<div id="pullrefresh" class="mui-content mui-scroll-wrapper" style="top: calc(100vh - 412px)">
 			<div class="mui-card" id="mui-content">
 				<ul id="kfList" class="mui-table-view mui-table-view-striped mui-table-view-condensed">
 
@@ -101,8 +305,8 @@
 				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',
+					// url:  window.location.origin+'/system/dept/assetList',
+					url: 'http://58.144.199.81:9081' + '/system/dept/assetList',
 					type: 'get',
 					data: {
 						pageNum: pageNum,
@@ -178,11 +382,10 @@
 				if (params.get('type') == 1) {
 					$('#title').text('库房--' + params.get('name'))
 					//设置地址栏标题
-					$(document).attr("title",'库房--' + params.get('name'));
+					$(document).attr("title", '库房--' + params.get('name'));
 					$('#go-back').css({ 'display': 'block' })
 				}
 			})
-
 			var node = document.getElementById("search");
 			// 绑定点击事件
 			node.onclick = function () {
@@ -212,7 +415,7 @@
 						if (goodsTotal) {
 							mui('#pullrefresh').pullRefresh().endPullupToRefresh(false);
 							mui('#pullrefresh').pullRefresh().refresh(true);
-						}else{
+						} else {
 							mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
 							$(".mui-pull-caption.mui-pull-caption-nomore").text("暂无数据");
 						}
@@ -226,7 +429,7 @@
 					getDatalist(searchInput, function (goodsTotal) {
 						if (goodsTotal) {
 							mui('#pullrefresh').pullRefresh().endPullupToRefresh((++pageNum > (parseInt(goodsTotal / pageSize) + goodsTotal % pageSize)));
-						} else if(!goodsTotal&&(pageNum==1)){
+						} else if (!goodsTotal && (pageNum == 1)) {
 							mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
 							$(".mui-pull-caption.mui-pull-caption-nomore").text("暂无数据");
 						}
@@ -234,6 +437,30 @@
 				}, 1000)
 			}
 		</script>
+		<script>
+			$("#arrowZchz").on('click', function (e) {
+				if ($('#conZchz').is('.mui-hidden')) {
+					this.style.transform = 'rotate(360deg)';
+					document.getElementById("conZchz").classList.remove('mui-hidden');
+				} else {
+					this.style.transform = 'rotate(180deg)';
+					document.getElementById("conZchz").classList.add('mui-hidden');
+				}
+			})
+			$("#arrowSs").on('click', function (e) {
+				if ($('#conSs').is('.mui-hidden')) {
+					this.style.transform = 'rotate(360deg)';
+					document.getElementById("conSs").classList.remove('mui-hidden');
+				} else {
+					this.style.transform = 'rotate(180deg)';
+					document.getElementById("conSs").classList.add('mui-hidden');
+				}
+			})
+			$('#mySelect').on('change', function () {
+				var selectedValue = this.value; // 获取选中的值
+				console.log(selectedValue)
+			});
+		</script>
 </body>
 
 </html>

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

@@ -58,11 +58,13 @@
 		font-size: 16px;
 		color: #999999;
 		display: flex;
+		justify-content: space-between;
 	}
 
 	.listTitle {
-		width: 100px;
-		min-width: 100px;
+		width: auto;
+		/* min-width: 100px; */
+		color: #999;
 		text-align: right;
 	}
 
@@ -96,8 +98,8 @@
 		function getDatalist(departmentName) {
 			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',
+				// url:  window.location.origin+'/system/dept/getDepartments',
+				url: 'http://58.144.199.81:9081/system/dept/getDepartments',
 				type: 'get',
 				data: {
 					departmentName: departmentName ? departmentName : "",
@@ -113,19 +115,28 @@
 											<div class="mui-ellipsis" 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}"><img src="images/logo.png"></img>${json.data[i].DepartMentDto.name ? json.data[i].DepartMentDto.name : ""}</div>
 											<div style="padding:10px;">
-											<div class="list" id="list"><div class="listTitle">库房管理员：</div><div style="color: #333;">`
+											<div class="list" id="list">
+											<img src="images/kufanimg.png" style="width:140px;border-radius: 10px;"></img>
+											<div style="color:#333;display: flex;flex-direction: column;justify-content: flex-start;">`
 							var data = json.data[i].kgyNames;
 							for (var j = 0; j < data.length; j++) {
 								var tephone = json.data[i].phones[j];
-								html += `
-													<div style="display:flex;"><div>${data[j]}</div><div class='telclick' data-tel='${tephone}'>${tephone ? tephone : '-'}</div></div>
+								html += `<div style="display:flex;margin-bottom:15px;">
+									<div class="listTitle">管理员：</div>
+									<div>${data[j]}</div>
+									<div class='telclick' data-tel='${tephone}'>${tephone ? tephone : '-'}</div>
+									</div>
 													`
 							}
-							html +=
-								`</div></div>
-											<div class="list" style="margin-top:10px;"><div class="listTitle">库房位置：</div><div style="color: #333;">${json.data[i].DepartMentDto.location ? json.data[i].DepartMentDto.location : ""}</div>
-											</div>
-										</div>
+							html +=`<div style="display:flex;"><div class="listTitle">资产汇总：</div><div>234件</div></div>
+									</div></div></div>
+									<div class="list" style="display: flex;justify-content: space-between;padding:10px;"><div style="color: #333;">${json.data[i].DepartMentDto.location ? json.data[i].DepartMentDto.location : ""}</div>
+									<div style="display: flex;align-items: flex-end;">`
+							html+=`<img src="images/address.png" style="width: 22px;height: 18px;"></img>
+									<div style="color: #1484FE;text-shadow: 3px 4px 4px rgba(20,132,254,0.33);">地图</div>
+									</div>
+									</div>
+									</div>
 									</div>
 								</li>`
 						}