所有户渲染

components/NavigationGeneral/index.vue

@@ -3,7 +3,13 @@
 		<u-navbar back-text="返回" :title="title" :is-back="isBack" :is-fixed="true" :background="background"
 			title-color="#fff" back-icon-color="#fff" :back-text-style="{
 				color:'#fff'
-			}"></u-navbar>
+			}">
+			<template v-slot:right>
+				<slot name="right"></slot>
+			</template>
+
+
+		</u-navbar>
 		<slot></slot>
 	</view>
 </template>

pages/building/building.vue

@@ -1,20 +1,42 @@
 <template>
 	<navigation-general :title="title">
-		<view class="building-list" >
-			
-			
+		<template v-slot:right>
+			<view class="nav-right">
+				<view class="right-item">共{{totalHouse}}户</view>
+				<view class="right-item">未排查{{weiPaimo}}户</view>
+			</view>
+		</template>
+		<view class="building-list">
+
+
 			<view class="house-c">
-					<view class="c-item" v-for="(item,index) in buildingInfo.floor" :key="index">{{buildingInfo.floor - index}}</view>
+				<view class="c-item" v-for="(item,index) in buildingInfo.floor" :key="index">
+					{{buildingInfo.floor - index}}层
+				</view>
+				<view class="c-item">单元</view>
 			</view>
-			<scroll-view class="house-list" scroll-x="true"  scroll-left="120">
-					<view class="list-scroll-x" :style="handlerWidth">
-						<view class="color-rows" v-for="(item,index) in groupedRooms" :key="index">
-							<color-item :showBuildingName="true" :showColorName="false" :item="house" v-for="house in item" :key="house.id"></color-item>
+			<scroll-view class="house-list" scroll-x="true" scroll-left="120">
+				<view class="list-scroll-x" :style="handlerWidth">
+					<view class="color-rows" v-for="(item,index) in groupedRooms" :key="index">
+						<color-item :showBuildingName="true" :showColorName="false" :item="house" v-for="house in item"
+							:key="house.id"></color-item>
+					</view>
+					<view class="color-rows">
+						<view class="unitItem" v-for="unitItem in buildingInfo.unit" :key="unitItem">
+							{{unitItem}} 单元
 						</view>
 					</view>
+				</view>
 			</scroll-view>
 
 		</view>
+		<u-mask :show="show">
+			<view class="loading-css">
+				<u-loading mode="flower" size="50"></u-loading>
+				<view class="loading-text">加载中</view>
+			</view>
+
+		</u-mask>
 	</navigation-general>
 </template>
 
@@ -31,6 +53,7 @@
 	export default {
 		data() {
 			return {
+				show: true,
 				boxTop: 0,
 				queryParams: {
 					buildingId: undefined
@@ -39,24 +62,26 @@
 				buildingInfo: {},
 				newHouseList: [],
 				totalHouse: 0,
+				weiPaimo: 0
 			};
 		},
 		computed: {
-			handlerWidth(){
-				
-				 return{
-					 width:  (this.buildingInfo.house+1) * 122 + 'rpx'
-				 }
+			handlerWidth() {
+
+				return {
+					width: (this.buildingInfo.house + 1) * 122 + 'rpx'
+				}
 			},
 			groupedRooms() {
 				if (this.newHouseList.length == 0) return
-
+				this.weiPaimo = 0
 				// 初始化每层楼的数组
 				let floors = Array.from({
 					length: this.buildingInfo.floor
 				}, () => [])
 				// 遍历房间数据
 				this.newHouseList.forEach((room) => {
+					if (room.daycount > 0) this.weiPaimo = this.weiPaimo + 1
 					// 提取房间号前几位作为楼层号
 					let floor = (parseInt(room.name) / 100) | 0
 					// 将房间加入对应楼层数组
@@ -69,7 +94,7 @@
 				floors.forEach((floorRooms) => {
 					floorRooms.sort((a, b) => parseInt(a.name) - parseInt(b.name))
 				})
-				uni.hideLoading()
+				this.show = false
 				return floors.reverse()
 			},
 		},
@@ -90,10 +115,7 @@
 			},
 			//获取所有的户
 			async getAllHouse() {
-				uni.showLoading({
-					title: '加载中',
-					mask:true,
-				})
+				this.show = true
 				let res = await getNumNew({
 					buildingId: this.queryParams.buildingId
 				})
@@ -104,50 +126,101 @@
 	}
 </script>
 <style lang="scss">
-page{
-	background: #113666;
-}
+	page {
+		background: #113666;
+	}
 </style>
 <style lang="scss" scoped>
+	.nav-right {
+		margin-right: 14rpx;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+
+		.right-item {
+			box-sizing: border-box;
+			padding: 0 6rpx;
+			font-size: 22rpx;
+			background: #fff;
+			color: red;
+		}
+
+		.right-item:last-child {
+			margin-top: 4rpx;
+			background-color: red;
+			color: #fff;
+		}
+	}
 
 	.building-list {
 		width: 100%;
 		display: flex;
 		align-items: center;
+
 		// 楼层数样式/
-		.house-c{
-			
-			.c-item{
+		.house-c {
+			background: linear-gradient(to bottom,
+					rgba(149, 18, 58, 0.4) 10%,
+					#95123a 70%,
+					rgba(149, 18, 58, 0.4) 90%);
+
+			.c-item {
 				width: 120rpx;
 				text-align: center;
 				line-height: 60rpx;
 				height: 60rpx;
 				font-size: 28rpx;
 				color: #fff;
-				background-color: rgb(64, 158, 255);
-				border-bottom: 1px solid rgba(255,255,255,0.1);
+				// background-color: rgb(64, 158, 255);
+				border-bottom: 1px solid rgba(255, 255, 255, 0.1);
 			}
 		}
+
 		//所有户
-		.house-list{
+		.house-list {
 			background: #113666;
 			height: 100%;
-			.list-scroll-x{
+
+			.list-scroll-x {
 				height: 100%;
 				color: #fff;
-				.color-rows{
+
+				.color-rows {
 					width: 100%;
 					display: flex;
 					height: 60rpx;
 					align-items: center;
-					.color-item{
+
+					.color-item {
 						width: 100rpx;
 						margin-left: 20rpx;
 					}
-					
+
+					.unitItem {
+						font-size: 28rpx;
+						flex: 1;
+						height: 100%;
+						line-height: 60rpx;
+						text-align: center;
+					}
 				}
 			}
 		}
-		
+
+	}
+
+	/deep/ .loading-css {
+		height: 100%;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+
+		.loading-text {
+			color: #fff;
+			font-size: 28rpx;
+			margin-top: 10rpx;
+		}
+
 	}
 </style>

pages/login.vue

@@ -53,7 +53,7 @@
 				globalConfig: getApp().globalData.config,
 				loginForm: {
 					username: "景瑞网格1",
-					password: "Tc123@456",
+					password: "Tc123@456***",
 					code: "",
 					uuid: ''
 				}