我的页面样式和数据保护调整

pages/me/index.vue

@@ -7,7 +7,7 @@
 					radius="160rpx"></u-image>
 				<view class="idAndAccount">
 					<view class="id">ID:{{userInfo.uid}}</view>
-					<view class="account">{{ i18n.account }}:{{userInfo.email}}</view>
+					<view class="account">{{ i18n.account }}:{{userInfo.email || ''}}</view>
 				</view>
 			</view>
 			<!-- 三个按钮 -->
@@ -32,17 +32,17 @@
 			<view class="balanceRow">
 				<!-- 可用余额 -->
 				<view class="item">
-					<view class="number">{{userInfoBalance.balance}}</view>
+					<view class="number">{{userInfoBalance.balance || 0 }}</view>
 					<view class="title">{{ i18n.Balance }}</view>
 				</view>
 				<!-- 质押余额 -->
 				<view class="item">
-					<view class="number">{{userInfoBalance.pledge}}</view>
+					<view class="number">{{userInfoBalance.pledge || 0 }}</view>
 					<view class="title">{{ i18n.Pledge }}</view>
 				</view>
 				<!-- 合约余额 -->
 				<view class="item">
-					<view class="number">{{userInfoBalance.contract}}</view>
+					<view class="number">{{userInfoBalance.contract || 0 }}</view>
 					<view class="title">{{ i18n.Contarct }}</view>
 				</view>
 			</view>
@@ -217,10 +217,11 @@
 
 				.idAndAccount {
 					margin-left: 40rpx;
+                    flex: 1;
 
 					.id {
 						height: 56rpx;
-						width: 378rpx;
+						// width: 400rpx;
 						font-weight: 600;
 						font-size: 40rpx;
 						margin: 16rpx 0;
@@ -228,15 +229,25 @@
 
 					.account {
 						position: relative;
-						height: 56rpx;
+						// height: 56rpx;
-						line-height: 56rpx;
+						line-height: 46rpx;
-						width: 378rpx;
+						width: 390rpx;
+                        overflow: hidden;
 						background: rgba(255, 188, 31, 0.1);
 						border-radius: 16rpx;
 						font-size: 24rpx;
 						color: #FFBC1F;
 						text-align: left;
-						padding-left: 20rpx;
+                        padding: 4rpx 10rpx 8rpx 40rpx;
+
+                        // 超出字符省略成...
+                        overflow: hidden;
+                        text-overflow: ellipsis;
+                        display: -webkit-box; //兼容
+                        word-wrap: break-word;
+                        white-space: normal !important;
+                        -webkit-line-clamp: 2; //显示行数
+                        -webkit-box-orient: vertical;
 
 						&::before {
 							display: block;
@@ -248,7 +259,7 @@
 							width: 32rpx;
 							height: 32rpx;
 							top: 12rpx;
-							left: 20rpx;
+							left: 10rpx;
 						}
 					}
 				}