Merge branch 'master' of http://47.92.161.104:10080/zkx/jp-housekeep-hall

# Conflicts:
#	pages/mine/mine.vue
合并

pages/mine/mine.vue

@@ -2,10 +2,10 @@
 	<view>
 		<view class="background">
 			<!-- 个人信息   @click="gotoUrl('/pages/mine/personInfos')" -->
-			
-			<view class="person-infos"  >
+
+			<view class="person-infos">
 				<view class="photo">
-				
+
 					<image class="img" src="@/assets/img/默认头像.png" mode=""></image>
 				</view>
 				<view class="else">
@@ -15,23 +15,104 @@
 					<view class="company">
 						{{personInfo.fullName}}
 					</view>
-					
+
+				</view>
+				<view class="change">
+					切换
+				</view>
+			</view>
+			<!-- 账户余额 -->
+			<view class="content">
+				<view class="balance">
+					<view class="title">
+						<view class="icon">
+							<image class="img" src="@/assets/img/wallet@3x.png" mode=""></image>
+						</view>
+						<view class="text">
+							账户余额
+							<text class="state">已欠费</text>
+						</view>
+					</view>
+
+					<view class="balance-number">
+						<view class="number">
+							-100.00
+						</view>
+						<view class="recharge">
+							充值
+						</view>
+					</view>
+				</view>
+				<!-- 期限 -->
+				<view class="deadline">
+					<view class="deadline-item" >
+						<view class="item-icon">
+							<image class="img" src="@/assets/img/deadline1.png" mode=""></image>
+						</view>
+						<view class="date-box">
+							<view class="classify">
+								房租 <text class="state">已到期</text>
+							</view>
+							<view class="date">
+								已缴费至 <text class="state">2024.03.14</text>
+							</view>
+						</view>
+					</view>
+                     <view class="deadline-item" >
+                     	<view class="item-icon">
+                     		<image class="img" src="@/assets/img/deadline2.png" mode=""></image>
+                     	</view>
+                     	<view class="date-box">
+                     		<view class="classify">
+                     			水费
+                     		</view>
+                     		<view class="date">
+                     			已缴费至 <text>2024.03.14</text>
+                     		</view>
+                     	</view>
+                     </view>
+					 <view class="deadline-item" >
+					 	<view class="item-icon">
+					 		<image class="img" src="@/assets/img/deadline3.png" mode=""></image>
+					 	</view>
+					 	<view class="date-box">
+					 		<view class="classify">
+					 			物业费 
+					 		</view>
+					 		<view class="date">
+					 			已缴费至 <text >2024.03.14</text>
+					 		</view>
+					 	</view>
+					 </view>
+					 <view class="deadline-item" >
+					 	<view class="item-icon">
+					 		<image class="img" src="@/assets/img/deadline4.png" mode=""></image>
+					 	</view>
+					 	<view class="date-box">
+					 		<view class="classify">
+					 			保洁费 
+					 		</view>
+					 		<view class="date">
+					 			已缴费至 <text >2024.03.14</text>
+					 		</view>
+					 	</view>
+					 </view>
 				</view>
 			</view>
 			<!-- 地址 -->
-			<view class="address-box" >
+			<!-- <view class="address-box" >
 				<view class="address">
 					<view class="address-title">
 						{{personInfo.name}}
 					</view>
 					<view class="address-value" v-if="false" >
-					<!--  -->
+					
 						 <u-icon name="map" v-if="personInfo.remark"></u-icon>{{personInfo.remark}}
-						<!-- {{companyInfo.typeN}} -->
+						{{companyInfo.typeN}}
 					</view>
-				</view>
-				<!-- 切换 -->
-				<u-picker  v-model="changeUserShow" mode="selector" :range="userList" 
+				</view> -->
+			<!-- 切换 -->
+			<!-- 	<u-picker  v-model="changeUserShow" mode="selector" :range="userList" 
 				 :default-selector="[defaultIndex]" range-key="tenantName" @confirm="selector1confirm" ></u-picker>
 				
 				<view class="change" @click="changeUserShowBtn" v-if="userList&&userList.length>1">
@@ -40,102 +121,103 @@
 				<view class="image" >
 					<image class="img" src="@/assets/img/mineBackground.svg" mode=""></image>
 				</view>
-			</view>
-		</view>
-		<!-- 功能 -->
-		<view class="function-group">
-			<view class="function-item" v-if="false"   @click="gotoUrl('/pages/mine/tenantInformation')"  >
-				<view class="icon">
-					<image class="img" src="@/assets/img/riLine-contacts-book-line.svg" mode=""></image>
-				</view>
-				<view class="name">
-					用户信息
-				</view>
-				<view class="arrow">
-					<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
-				</view>
-			</view>
-			<view class="function-item" v-if="false">
-				<view class="icon">
-					<image class="img" src="@/assets/img/riLine-pie-chart-line.svg" mode=""></image>
-				</view>
-				<view class="name">
-					用电监控
-				</view>
-				<view class="arrow">
-					<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
-				</view>
-			</view>
-			
-			<view class="function-item" v-if="false">
-				<view class="icon">
-					<image class="img" src="@/assets/img/riLine-book-2-line.svg" mode=""></image>
-				</view>
-				<view class="name">
-					用电常识
-				</view>
-				<view class="arrow">
-					<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
-				</view>
-			</view>
-			
-			<view class="function-item"   @click="gotoUrl('/pages/invoiceManagement/invoiceManagement')"  >
-				<view class="icon">
-					<image class="img" src="@/assets/img/iconPark-order2.svg" mode=""></image>
-				</view>
-				<view class="name">
-					发票管理
+			</view> -->
+
+			<!-- 功能 -->
+			<view class="function-group">
+				<view class="function-item" v-if="false" @click="gotoUrl('/pages/mine/tenantInformation')">
+					<view class="icon">
+						<image class="img" src="@/assets/img/riLine-contacts-book-line.svg" mode=""></image>
+					</view>
+					<view class="name">
+						用户信息
+					</view>
+					<view class="arrow">
+						<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
+					</view>
 				</view>
-				<view class="arrow">
-					<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
+				<view class="function-item" v-if="false">
+					<view class="icon">
+						<image class="img" src="@/assets/img/riLine-pie-chart-line.svg" mode=""></image>
+					</view>
+					<view class="name">
+						用电监控
+					</view>
+					<view class="arrow">
+						<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
+					</view>
 				</view>
-			</view>
-			
-			<view class="function-item"   @click="gotoUrl('/pages/mine/contactService')" >
-				<view class="icon">
-					<image class="img" src="@/assets/img/riLine-customer-service-2-line.svg" mode=""></image>
+
+				<view class="function-item" v-if="false">
+					<view class="icon">
+						<image class="img" src="@/assets/img/riLine-book-2-line.svg" mode=""></image>
+					</view>
+					<view class="name">
+						用电常识
+					</view>
+					<view class="arrow">
+						<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
+					</view>
 				</view>
-				<view class="name">
-					客服热线
+
+				<view class="function-item" @click="gotoUrl('/pages/invoiceManagement/invoiceManagement')">
+					<view class="icon">
+						<image class="img" src="@/assets/img/iconPark-order2.svg" mode=""></image>
+					</view>
+					<view class="name">
+						发票管理
+					</view>
+					<view class="arrow">
+						<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
+					</view>
 				</view>
-				<view class="arrow">
-					<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
+
+				<view class="function-item" @click="gotoUrl('/pages/mine/contactService')">
+					<view class="icon">
+						<image class="img" src="@/assets/img/riLine-customer-service-2-line.svg" mode=""></image>
+					</view>
+					<view class="name">
+						客服热线
+					</view>
+					<view class="arrow">
+						<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
+					</view>
 				</view>
+
 			</view>
-			
-		</view>
-		
-		<view class="function-group" v-if="false">
-			<view class="function-item">
-				<view class="icon">
-					<image class="img" src="@/assets/img/riLine-user-settings-line.svg" mode=""></image>
-				</view>
-				<view class="name">
-					个人信息
-				</view>
-				<view class="arrow">
-					<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
+
+			<view class="function-group" v-if="false">
+				<view class="function-item">
+					<view class="icon">
+						<image class="img" src="@/assets/img/riLine-user-settings-line.svg" mode=""></image>
+					</view>
+					<view class="name">
+						个人信息
+					</view>
+					<view class="arrow">
+						<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
+					</view>
 				</view>
+
 			</view>
-			
-		</view>
-		
-		<view class="function-group" >
-			<view class="function-item" @click="gotoUrl('/pages/mine/setting')">
-				<view class="icon">
-					<image class="img" src="@/assets/img/riLine-settings-2-line.svg" mode=""></image>
-				</view>
-				<view class="name">
-					设置
-				</view>
-				<view class="arrow">
-					<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
+
+			<view class="function-group">
+				<view class="function-item" @click="gotoUrl('/pages/mine/setting')">
+					<view class="icon">
+						<image class="img" src="@/assets/img/riLine-settings-2-line.svg" mode=""></image>
+					</view>
+					<view class="name">
+						设置
+					</view>
+					<view class="arrow">
+						<u-icon name="arrow-right" color="#b2b2b2"></u-icon>
+					</view>
 				</view>
+
 			</view>
-			
 		</view>
-		
 		<Tabbar :current="2"  ref="tabbarMain"  :prefetchNum="prefetchNum" ></Tabbar>
+
 	</view>
 </template>
 
@@ -143,9 +225,9 @@
 	import * as API from '@/apis/pagejs/index.js'
 	import * as API_user from '@/apis/pagejs/user.js'
 	import * as API_deduction from '@/apis/pagejs/deduction.js'
-	
+
 	import * as API_message from '@/apis/pagejs/message.js'
-	
+
 	import Tabbar from '@/components/Tabbar.vue'
 	export default {
 		components: {
@@ -153,6 +235,7 @@
 		},
 		data() {
 			return {
+
 				companyInfo:{},
 				regUser:{},
 				userList:[],
@@ -171,6 +254,7 @@
 			
 			this.userList=this.carhelp.getPersonInfoPlus().userList
 			//this.prefetch()
+
 			//this.personalCenter()
 			this.getContractList()
 		},
@@ -178,6 +262,7 @@
 			this.query()
 		},
 		methods: {
+
 			getContractList() {
 			
 				API_deduction.contractList({
@@ -192,8 +277,9 @@
 				})
 			},
 			prefetch(){
+
 				API_message.prefetch({
-					
+
 				}).then((response) => {
 					//this.prefetchNum=response.data
 					if (this.$refs.tabbarMain) {
@@ -201,104 +287,102 @@
 					}
 				}).catch(error => {
 					//uni.hideLoading();
-					
+
 				})
 			},
-			query(){
+			query() {
 				uni.showLoading({
 					title: "加载中",
 					mask: true,
 				})
-				
+
 				API_user.findByOpenId({
-					noerror:true,
+					noerror: true,
 					openId: this.carhelp.getOpenId(),
-					
+
 				}).then((response) => {
 					//this.loginset(response)
 					uni.hideLoading();
 					var token = response ? response.data.token : '';
-					
+
 					this.carhelp.setToken(token);
 					this.carhelp.setPersonInfo(response.data.tenantInfo);
 					this.carhelp.setPersonInfoPlus(response.data)
-					
-					this.companyInfo=response.data.companyInfo;
-					this.regUser=response.data.regUser;
-					
-					this.personInfo=response.data.tenantInfo;
+
+					this.companyInfo = response.data.companyInfo;
+					this.regUser = response.data.regUser;
+
+					this.personInfo = response.data.tenantInfo;
 					this.prefetch();
 					//this.homePage()
-				
+
 				}).catch(error => {
 					uni.hideLoading();
-					
+
 				})
 			},
-			changeUserShowBtn(){
-				this.defaultIndex=this.userList.findIndex(item=>{
-					return item.id==this.regUser.id
+			changeUserShowBtn() {
+				this.defaultIndex = this.userList.findIndex(item => {
+					return item.id == this.regUser.id
 				})
-			
-				this.changeUserShow=true
+
+				this.changeUserShow = true
 			},
-			selector1confirm(e){
-				var obj=this.userList[e[0]]
+			selector1confirm(e) {
+				var obj = this.userList[e[0]]
 				uni.showLoading({
 					title: "加载中",
 					mask: true,
 				})
-				
+
 				API_user.changeUser({
-					id:obj.id,
-					openId:this.carhelp.getOpenId()
+					id: obj.id,
+					openId: this.carhelp.getOpenId()
 				}).then((response) => {
 					this.query()
-					
-					
+
+
 					//this.companyInfo=response.data.companyInfo;
 				}).catch(error => {
 					uni.hideLoading();
-					
+
 				})
 			},
-			personalCenter(){
+			personalCenter() {
 				uni.showLoading({
 					title: "加载中",
 					mask: true,
 				})
-				
+
 				API_user.personalCenter({
-					
+
 				}).then((response) => {
-					
+
 					uni.hideLoading();
 					//this.companyInfo=response.data.companyInfo;
 				}).catch(error => {
 					uni.hideLoading();
-					
+
 				})
 			},
-			homePage(){
+			homePage() {
 				uni.showLoading({
 					title: "加载中",
 					mask: true,
 				})
-				
-			
-				
+
 				API.homePage({
-					
+
 				}).then((response) => {
 					uni.hideLoading();
-					this.companyInfo=response.data.companyInfo;
-					this.regUser=response.data.regUser;
-					
-					this.personInfo=response.data.tenantInfo;
-					
+					this.companyInfo = response.data.companyInfo;
+					this.regUser = response.data.regUser;
+
+					this.personInfo = response.data.tenantInfo;
+
 				}).catch(error => {
 					uni.hideLoading();
-					
+
 				})
 			}
 		}
@@ -306,74 +390,222 @@
 </script>
 
 <style lang="scss" scoped>
-	.background{
-		background: linear-gradient(180deg, rgba(194,219,255,1) 53%,rgba(180,211,255,0) 100%);
+	.background {
+		background: linear-gradient(180deg, rgba(194, 219, 255, 1) 53%, rgba(180, 211, 255, 0) 100%);
 		padding: 72rpx 32rpx;
+		height: 516rpx;
+
 		// 个人信息
-		.person-infos{
+		.person-infos {
 			display: flex;
 			align-items: center;
-			.photo{
+
+			.photo {
 				width: 112rpx;
 				height: 112rpx;
 				border-radius: 50px;
-				.img{
+
+				.img {
 					width: 100%;
 					height: 100%;
 				}
 			}
-			.else{
+
+			.else {
 				margin-left: 24rpx;
-				.name{
-					color: rgb(16,16,16);
+				width: 400rpx;
+
+				.name {
+					color: rgb(16, 16, 16);
 					font-size: 36rpx;
 					font-weight: bold;
 				}
-				.company{
-					color: rgba(16,16,16,1);
+
+				.company {
+					color: rgba(16, 16, 16, 1);
 				}
 			}
+
+			// 切换
+			.change {
+				border: 1px solid rgba(22, 119, 255, 1);
+				width: 128rpx;
+				height: 64rpx;
+				line-height: 64rpx;
+				border-radius: 50px;
+				margin-left: auto;
+				color: rgba(22, 119, 255, 1);
+				text-align: center;
+			}
+
+		}
+
+		// 账户余额
+		.content {
+			margin: 48rpx 0rpx;
 			
+			border-radius: 8px;
+			background: linear-gradient(180deg, rgba(220, 235, 255, 1) 0%, rgba(255, 255, 255, 1) 39%);
+			border: 1px solid rgba(255, 255, 255, 1);
+
+
+ .balance{
+	 padding: 32rpx 24rpx;
+ }
+			.title {
+				display: flex;
+
+				.icon {
+					width: 40rpx;
+					height: 40rpx;
+
+					.img {
+						width: 100%;
+						height: 100%;
+
+					}
+				}
+
+				.text {
+					margin-left: 16rpx;
+					color: rgba(51, 51, 51, 1);
+					font-size: 32rpx;
+					font-weight: bold;
+
+					.state {
+						margin-left: 16rpx;
+						color: rgba(238, 49, 56, 1);
+					}
+				}
+			}
+
+			.balance-number {
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				margin-top: 16rpx;
+				margin-left: 56rpx;
+
+				.number {
+					color: rgba(238, 49, 56, 1);
+					font-size: 56rpx;
+					font-weight: bold;
+
+				}
+
+				.recharge {
+					width: 144rpx;
+					height: 56rpx;
+					line-height: 56rpx;
+					border-radius: 50px;
+					background: linear-gradient(85.19deg, rgba(255, 61, 0, 1) 4.89%, rgba(255, 123, 0, 1) 95.37%);
+					color: rgba(255, 255, 255, 1);
+					text-align: center;
+				}
+			}
+
+			// 期限
+			.deadline {
+				
+				display: flex;
+				flex-wrap: wrap;
+                 border-top: 1px solid #F4F4F4;
+
+				 .deadline-item:first-of-type{
+					 border-right: 1px solid #F4F4F4;
+					 border-bottom: 1px solid #F4F4F4;
+				 }
+				 .deadline-item:last-of-type{
+					 border-top: 1px solid #F4F4F4;
+					 border-left: 1px solid #F4F4F4;
+				 }
+				.deadline-item {
+					width: 50%;
+					display: flex;
+                    padding: 24rpx ;
+					
+					
+					.item-icon {
+						width: 40rpx;
+						height: 40rpx;
+						margin-right: 16rpx;
+						.img {
+							width: 100%;
+							height: 100%;
+							vertical-align: middle;
+						}
+					}
+
+					.date-box {
+						.state {
+							
+							color: rgba(238, 49, 56, 1);
+						}
+						text{
+							margin-left: 8rpx;
+						}
+
+						.classify {
+							color: rgba(51, 51, 51, 1);
+							font-size: 32rpx;
+							font-weight: bold;
+							
+
+						}
+						.date{
+							color: rgba(51,51,51,1);
+							font-size: 24rpx;
+							margin-top: 4rpx;
+						}
+					}
+				}
+			}
 		}
+
+
+
 		// 地址
-		.address-box{
+		.address-box {
 			border-radius: 8px;
-			background: linear-gradient(90deg, rgba(49,110,207,1) 2%,rgba(20,73,159,1) 100%);
+			background: linear-gradient(90deg, rgba(49, 110, 207, 1) 2%, rgba(20, 73, 159, 1) 100%);
 			color: #fff;
-			padding:40rpx 32rpx;
+			padding: 40rpx 32rpx;
 			margin-top: 40rpx;
 			display: flex;
 			align-items: center;
 			position: relative;
-			.address{
-				.address-title{
+
+			.address {
+				.address-title {
 					font-size: 40rpx;
 				}
-				.address-value{
+
+				.address-value {
 					font-size: 24rpx;
 					margin-top: 8rpx;
 				}
 			}
-			
+
 			// 切换
-			.change{
-				border: 1px solid rgba(255,255,255,1);
+			.change {
+				border: 1px solid rgba(255, 255, 255, 1);
 				width: 128rpx;
 				height: 64rpx;
 				line-height: 64rpx;
 				border-radius: 50px;
-				color: rgba(255,255,255,1);
+				color: rgba(255, 255, 255, 1);
 				text-align: center;
 				margin-left: auto;
 				z-index: 99;
 			}
+
 			.image {
 				width: 174rpx;
 				height: 174rpx;
 				position: absolute;
 				right: 0;
 				top: 20rpx;
-			
+
 				.img {
 					width: 100%;
 					height: 100%;
@@ -383,33 +615,38 @@
 	}
 
 
-// 功能
-.function-group{
-	border-radius: 8px;
-	background-color: #fff;
-	margin: 0 32rpx 24rpx;
-	.function-item{
-		display: flex;
-		align-items: center;
-		padding: 26rpx 26rpx 26rpx 0;
-		margin-left: 26rpx;
-		border-bottom: 1px solid rgba(221,221,221,1);
-		.icon{
-			width: 40rpx;
-			height: 40rpx;
-			.img{
-				width: 100%;
-				height: 100%;
-			}
-		}
-		.name{
-			color: rgba(51,51,51,1);
-			font-size: 30rpx;
+	// 功能
+	.function-group {
+		border-radius: 8px;
+		background-color: #fff;
+		margin-bottom: 24rpx;
+
+		.function-item {
+			display: flex;
+			align-items: center;
+			padding: 26rpx 26rpx 26rpx 0;
 			margin-left: 26rpx;
-		}
-		.arrow{
-			margin-left: auto;
+			border-bottom: 1px solid rgba(221, 221, 221, 1);
+
+			.icon {
+				width: 40rpx;
+				height: 40rpx;
+
+				.img {
+					width: 100%;
+					height: 100%;
+				}
+			}
+
+			.name {
+				color: rgba(51, 51, 51, 1);
+				font-size: 30rpx;
+				margin-left: 26rpx;
+			}
+
+			.arrow {
+				margin-left: auto;
+			}
 		}
 	}
-}
-</style>
+</style>