样式

.env.dev.js

@@ -16,7 +16,7 @@ const UNI_APP = {
 	openId:"zkxtest",//zkx
 	
 	openId:"oK9Wr54VbEh3xvWYmD_zT5NbH4AY",//zkx
-	openId:"oK9Wr59rru-i3bm7dtTtxnkR-i4s",//杨所
+	//openId:"oK9Wr59rru-i3bm7dtTtxnkR-i4s",//杨所
 	//openId:"oK9Wr56vX9nP_B56_Pyigg5n5Ce8",//
 	//openId:"oK9Wr5_2USr1yP4MRew9KbJA0-ng",//老板
 	//openId:"oK9Wr5-ViXQMUP2cjiW3bGIABj1Q",

pages.json

@@ -847,6 +847,14 @@
         		"navigationBarTitleText" : "",
         		"enablePullDownRefresh" : false
         	}
+        },
+        {
+        	"path" : "pages/user/finance/refundInfo",
+        	"style" : 
+        	{
+        		"navigationBarTitleText" : "",
+        		"enablePullDownRefresh" : false
+        	}
         }
     ],
 	"globalStyle": {

pages/user/finance/balance.vue

@@ -2,39 +2,61 @@
 	<view>
 		<ujp-navbar title="我的余额">
 			<view class="slot-wrap">
-				<span class="navBtn oldTextjp2" oldstyle="font-size: 16px;" @click="toRefundList">退余额</span>
+				<span class="navBtn oldTextjp222" oldstyle="font-size: 16px;" @click="toRefundList">退余额</span>
 			</view>
 		</ujp-navbar>
+		
+		<u-modal v-model="show" :confirm-text="confirmText" confirm-color="#00B962">
+			<view class="slot-content">
+				<rich-text :nodes="content"></rich-text>
+			</view>
+		</u-modal>
+		<u-modal v-model="show2" :confirm-text="confirmText" confirm-color="#00B962">
+			<view class="slot-content">
+				<rich-text :nodes="content2"></rich-text>
+			</view>
+		</u-modal>
 		<view class="balance">
 			<view class="balanceHead">
 				<view class="balanceCard">
 					<view class="balanceCard-head">
-						<font>总金额</font><u-icon name="question-line" custom-prefix="custom-icon" color="#fff" size="32" @click="show=true"></u-icon>
-					</view>
-					<view>
-						<u-modal v-model="show" :confirm-text="confirmText" confirm-color="#00B962">
-							<view class="slot-content">
-								<rich-text :nodes="content"></rich-text>
+						<view class="balanceCard-head-item">
+							<view>
+								总金额(元)<u-icon name="question-line" custom-prefix="custom-icon" color="#fff" size="36" @click="show=true"></u-icon>
+							</view>
+							<view class="h2" v-if="personAccount.availableAmount != null">{{personAccount.availableAmount.toFixed(2)}}</view>
+						</view>
+						<view  class="balanceCard-head-item"  v-if="0" >
+							<view>
+								充电金(元)<u-icon name="question-line" custom-prefix="custom-icon" color="#fff" size="36" @click="show2=true"></u-icon>
 							</view>
-						</u-modal>
+							
+							<view class="h2" v-if="personAccount.availableAmount != null">{{personAccount.availableAmount.toFixed(2)}}</view>
+							
+						</view>
 					</view>
-					<view class="balanceCard-main oldTextjp2" oldstyle="font-size: 16px;">
+				
+				<!-- 	<view class="balanceCard-main oldTextjp222" oldstyle="font-size: 16px;">
 						<h2 v-if="personAccount.availableAmount != null">{{personAccount.availableAmount.toFixed(2)}}元</h2>
 						<view class="balanceCard-btn" @click="rechargeNow">立即充值</view>
+					</view> -->
+					<view class="balanceCard-foot oldTextjp222" oldstyle="font-size: 16px;">
+						<view class="balanceCard-item" v-if="personAccount.availableAmount != null">可用余额{{personAccount.availableAmount.toFixed(2)}}</view>
+						<view class="balanceCard-item" v-if="personAccount.frozenTotal != null">冻结金额{{personAccount.frozenTotal.toFixed(2)}}</view>
 					</view>
-					<view class="balanceCard-foot oldTextjp2" oldstyle="font-size: 16px;">
-						<view class="balanceCard-item" v-if="personAccount.availableAmount != null">可用余额{{personAccount.availableAmount.toFixed(2)}}元</view>
-						<view class="balanceCard-item" v-if="personAccount.frozenTotal != null">冻结金额{{personAccount.frozenTotal.toFixed(2)}}元</view>
-					</view>
+					
+				</view>
+				<view class="new-balanceCard-foot" @click="rechargeNow">
+					立即充值
 				</view>
 			</view>
 			<view class="balanceMain">
 				<view class="balanceMain-title">
 					<view class="title">
 						<u-icon name="todo-fill" custom-prefix="custom-icon" color="#6BC6A7" size="40"></u-icon>
-						<span class="oldTextjp" oldstyle="font-size: 20px;">充值明细</span>
+						<span class="oldTextjp222" oldstyle="font-size: 20px;">充值明细</span>
 					</view>
-					<view class="more oldTextjp2" oldstyle="font-size: 16px;" @click="seeAll">
+					<view class="more oldTextjp222" oldstyle="font-size: 16px;" @click="seeAll">
 						<span>查看全部</span>
 						<u-icon name="arrow-right-s-line" custom-prefix="custom-icon" color="#B3B3B3" size="32"></u-icon>
 					</view>
@@ -42,16 +64,16 @@
 				<view class="balanceMain-list" v-if="accountList.length > 0">
 					<view class="balanceMain-item" v-for="(item,index) in accountList" :key="item.id" @click="gotoUrl('pages/user/finance/rechargeDet?id=' + item.id)">
 						<view class="title">
-							<font class="oldTextjp2" oldstyle="font-size: 18px;">{{item.payNameStr}}</font>
-							<p  class="oldTextjp2" oldstyle="font-size: 14px;">{{item.createTime}}</p>
+							<font class="oldTextjp222" oldstyle="font-size: 18px;">{{item.payNameStr}}</font>
+							<p  class="oldTextjp222" oldstyle="font-size: 14px;">{{item.createTime}}</p>
 						</view>
-						<h4 class="oldTextjp2" oldstyle="font-size: 24px;">{{item.amount.toFixed(2)}}元</h4>
+						<h4 class="oldTextjp222" oldstyle="font-size: 24px;">{{item.amount.toFixed(2)}}元</h4>
 					</view>
 				</view>
 			</view>
 			<view class="carNone" v-if="accountList.length == 0">
 				<img src="static/img/暂无数据-缺省页.png" alt="">
-				<p class="oldTextjp2" oldstyle="font-size: 18px;">本月暂无充值记录</p>
+				<p class="oldTextjp222" oldstyle="font-size: 18px;">本月暂无充值记录</p>
 			</view>
 		</view>	
 	</view>
@@ -67,8 +89,10 @@
 				dateMonth: '',
 				userId: '',
 				show: false,
+				show2: false,
 				confirmText: '知道了',
 				content: `总金额=可用余额+冻结金额。使用预付费充电时，在充电过程中会冻结部分金额，充电完成后将剩余金额返还至余额账户，每笔预充金额的冻结时间不超过96小时。`,
+				content2:"充电金：只可用于平台内所有自营站充电使用，不能提现",
 				personAccount: {},
 				accountList: [],
 				elderStatus: false,
@@ -92,7 +116,7 @@
 				monthN = "0" + monthN;
 			}
 			this.dateMonth = year + '-' + monthN + '-01';
-			
+			//this.dateMonth = year + '-10-01';
 			this.getCarPersonAccount();
 			this.getAccountRecordData();
 				
@@ -152,6 +176,9 @@
 </script>
 
 <style lang="scss" scoped>
+	.oldTextClassF{
+		
+	}
 	.slot-content {
 		font-size: 28rpx;
 		color: $u-content-color;
@@ -164,6 +191,7 @@
 		flex: 1;
 	}
 	.navBtn{
+		font-size: 36rpx;
 		float: right;
 		margin-right: 15px;
 		color:#3fbd70;
@@ -183,16 +211,32 @@
 	}
 	.balanceHead{
 		background-color: #fff;
-		padding: 16px;
+		margin: 16px;
+		background-color: #00B962;
+		border-radius: 12px;
+		.new-balanceCard-foot{
+			font-size: 18px;
+			margin-top: 24rpx;
+			padding:4px;
+			color: rgba(84, 69, 47, 1);
+
+			border-radius:0 0 12px 12px;
+			text-align: center;
+			background: linear-gradient(88.81deg, rgba(224,207,180,1) 1.89%,rgba(207,167,106,1) 99.99%);
+		}
 		.balanceCard{
-			background-color: #00B962;
-			border-radius: 12px;
-			padding: 16px;
+			
+			padding: 16px 16px 0 16px;
 			.balanceCard-head{
-				font{
-					font-size: 18px;
-					color:#fff;
-					margin-right: 8px;
+				    display: flex;
+				    justify-content: flex-start;
+				font-size: 36rpx;
+				color:#fff;
+				.h2{
+					font-size:72rpx
+				}
+				.balanceCard-head-item{
+					width: 49%;
 				}
 			}
 			.balanceCard-main{
@@ -201,7 +245,7 @@
 				justify-content: space-between;
 				margin-top: 8px;
 				h2{
-					font-size: 40px;
+					font-size: 80rpx;
 					color:#fff;
 					font-weight: normal;
 				}
@@ -214,8 +258,9 @@
 			}
 			.balanceCard-foot{
 				display: flex;
-				margin-top: 16px;
+				margin-top: 8rpx;
 				.balanceCard-item{
+					font-size: 32rpx;
 					flex: 1;
 					color:#fff;
 				}
@@ -232,13 +277,17 @@
 			justify-content: space-between;
 			height: 48px;
 			border-bottom: 1px solid #f7f7f7;
-			padding: 0 16PX;
+			padding: 0 16px;
+		
 			.title{
+					font-weight: bold;
 				display: flex;
 				align-items: center;
+				
+
 				span{
 					margin-left: 8px;
-					font-size: 16px;
+					font-size: 36rpx;
 				}
 			}
 		}
@@ -247,8 +296,11 @@
 			align-items: center;
 			justify-content: space-between;
 			padding: 12px 16px;
+			font-size: 32rpx;
+			color: rgba(16, 16, 16, 1);
+
 			p{
-				font-size: 12px;
+				font-size: 32rpx;
 				color:#888;
 				margin-top: 3px;
 			}

pages/user/finance/refundInfo.vue

@@ -0,0 +1,158 @@
+<template>
+	<view>
+		<ujp-navbar title="收款人账户信息"></ujp-navbar>
+		<view class="withdraw">
+			<view class="withdraw-head ">
+				<b class="asterisk"><text>*</text>收款户名</b>
+				<u-input class="textarea" type="textarea" 
+				v-model="info.accountName"
+				placeholder="请填写收款户名" height="96" cursor-spacing="8" />
+		
+			</view>
+			<view class="withdraw-head ">
+				<b class="asterisk"><text>*</text>开户银行</b>
+				<u-input class="textarea" type="textarea"
+				v-model="info.bankName"
+				 placeholder="请填写收款银行全称" height="96" cursor-spacing="8" />
+		
+			</view>
+			<view class="withdraw-head border-n">
+				<b class="asterisk"><text>*</text>收款账号</b>
+				<u-input class="textarea" v-model="info.accountNo"
+				type="textarea" placeholder="请填写收款账号" height="96" cursor-spacing="8" />
+		
+			</view>
+			<view style="bottom:0;position:absolute;width: 100%;padding: 40rpx;" >
+				<u-button shape="circle"    style="background-color:#00b962;color:white">申请退款</u-button>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				info: {
+					accountName: '',
+					bankName: '',
+					accountNo: ""
+				},
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style  lang="scss" scoped >
+	.asterisk {
+		position: relative;
+	
+		text {
+			position: absolute;
+			top: 0px;
+			left: -14rpx;
+			color: #EE3138;
+		}
+	}
+.textarea {
+		background-color:#f2f2f2;
+		margin-top: 12px;
+		line-height: 20px;
+		border-radius: 4px;
+		color: rgba(136, 136, 136, 100);
+
+		.uni-textarea-placeholder {
+			padding: 0 16rpx;
+
+		}
+
+		/deep/.uni-textarea-textarea {
+			width: 90%;
+			padding: 0 16rpx;
+
+		}
+	}
+	.withdraw {
+		margin-bottom: 8px;
+		background-color: #fff;
+		padding: 0px 16px 0 16px;
+
+		.withdraw-head {
+			padding: 16px 0;
+			border-bottom: 1px solid #E5E7EA;
+
+			align-items: center;
+			position: relative;
+
+			.unit {
+				position: absolute;
+				top: 34rpx;
+				right: 0;
+
+			}
+
+			.whthdraw-price {
+				font-size: 18px;
+				color: #101010;
+				font-weight: 600;
+			}
+
+			b {
+				color: rgba(119, 119, 119, 100);
+				font-size: 16px;
+			}
+
+			span {
+				width: 60%;
+				float: right;
+				text-align: left;
+				font-size: 16px;
+				color: #333333;
+			}
+
+			@media screen and (max-width:320px) {
+				span {
+					width: 55%;
+				}
+			}
+
+		}
+
+		.withdraw-main {
+			border-top: 1px solid #f7f7f7;
+			border-bottom: 1px solid #f7f7f7;
+
+			margin: 16px 0;
+			padding: 16px 0;
+
+			.withdraw-input {
+				margin-top: 32px;
+				display: flex;
+				align-items: center;
+				font-size: 28px;
+
+				/deep/.uni-input-input {
+					font-size: 28rpx;
+				}
+			}
+		}
+
+		.withdraw-foot {
+			display: flex;
+			align-items: center;
+
+			p {
+				color: #999
+			}
+
+			span {
+				color: #2979FF;
+				margin-left: 16px;
+
+			}
+		}
+	}
+</style>

pages/user/finance/refundList.vue

@@ -3,11 +3,21 @@
 		<ujp-navbar title="退费记录"></ujp-navbar>
 		<view class="balance">
 			<view class="balanceHead">
-				<view class="payPrice">
-					<font>{{account.availableAmount!=null ? account.availableAmount.toFixed(2) : '0.00'}}</font><span>元</span>
+				<view>
+					<view class="payPrice">
+						<font>{{account.availableAmount!=null ? account.availableAmount.toFixed(2) : '0.00'}}</font><span>元</span>
+					</view>
+					<view class="tips">
+						<p>充值退款(元)</p><u-icon name="question-line" custom-prefix="custom-icon" color="#00B962" size="32" @click="showtip = true"></u-icon>
+					</view>
 				</view>
-				<view class="tips">
-					<p>可退费金额(元)</p><u-icon name="question-line" custom-prefix="custom-icon" color="#00B962" size="32" @click="showtip = true"></u-icon>
+				<view v-if="1">
+					<view class="payPrice">
+						<font>{{account.availableAmount!=null ? account.availableAmount.toFixed(2) : '0.00'}}</font><span>元</span>
+					</view>
+					<view class="tips">
+						<p>现金分红(元)</p><u-icon name="question-line" custom-prefix="custom-icon" color="#00B962" size="32" @click="showtip2 = true"></u-icon>
+					</view>
 				</view>
 			</view>
 			<view class="balanceMain">
@@ -45,6 +55,11 @@
 					<rich-text :nodes="content1"></rich-text>
 				</view>
 			</u-modal> 
+			<u-modal v-model="showtip2" :title="title" :show-confirm-button="true" confirm-text="知道了" confirm-color="#00B962">
+				<view class="slot-content">
+					<rich-text :nodes="content2"></rich-text>
+				</view>
+			</u-modal> 
 		</view>
 				
 		<view style="bottom:0;position:absolute;width: 100%;padding: 40rpx;" v-show="account.availableAmount>0">
@@ -60,11 +75,14 @@
 		data() {
 			return {
 				elderMode:false,
-				content1:`本平台仅支持金额全额退费,申请成功后退费金额将于5个工作日内退还至您的充值账户.在本平台,三个月内的支付宝充值,微信支付可申请退费.<br />退费成功后,您可以在退费记录查看退费信息和审核进度.`,
+				content2:`首次申请现金分红退费需填写收款人账户信息，申请成功后工作人员将在5~10个工作日内完成转账打款。`,
+				
+				content1:`本平台仅支持充值金额全额退费,申请成功后退费金额将于5个工作日内退还至您的充值账户.在本平台,三个月内的支付宝充值,微信支付可申请退费.<br />退费成功后,您可以在退费记录查看退费信息和审核进度.`,
 				title:'提示',
 				content:'是否确定提交退费申请？申请成功后退费金额将于5个工作日内退还至您的充值账户',
 				show:false,
 				showtip:false,
+				showtip2:false,
 				userId:'',
 				account:{},
 				items:[],
@@ -214,8 +232,10 @@
 		background-color: #fff;
 		padding: 48rpx 0;
 		display: flex;
-		flex-direction: column;
+		flex-direction: row;
 		align-items: center;
+		    justify-content: space-around;
+	
 		.payPrice{
 			display: flex;
 			align-items: flex-end;