Jelajahi Sumber

上传x_coin界面

lalalashen 1 bulan lalu
induk
melakukan
e0f32e070b
9 mengubah file dengan 267 tambahan dan 57 penghapusan
  1. 12 1
      locale/zh-Hans.json
  2. 2 2
      manifest.json
  3. 6 1
      pages/my/M_coin.scss
  4. 6 1
      pages/my/M_purchase.scss
  5. 152 37
      pages/my/X_coin.scss
  6. 87 13
      pages/my/X_coin.vue
  7. 2 2
      pages/w3/friendsList.vue
  8. TEMPAT SAMPAH
      static/me/icon_store.png
  9. TEMPAT SAMPAH
      static/me/icon_wallet.png

+ 12 - 1
locale/zh-Hans.json

@@ -28,5 +28,16 @@
 	"txt.可用余额":"可用余额",
 	"txt.升级后享平台最大权益":"升级后享平台最大权益",
 	"txt.我的特权":"我的特权",
-	"txt.去开通":"去开通"
+	"txt.去开通":"去开通",
+	"txt.钱包":"钱包",
+	"txt.兑换商城":"兑换商城",
+	
+	"txt.签到领取":"签到领取",
+	"txt.奖励100X/次":"奖励100X/次",
+	"txt.动态发布奖励":"动态发布奖励",
+	"txt.奖励100X/次每日最多统计3条":"奖励100X/次每日最多统计3条",
+	
+	"txt.暂无数据":"暂无数据",
+	"txt.免费获取":"免费获取",
+	"txt.X币":"X币"
 }

+ 2 - 2
manifest.json

@@ -2,8 +2,8 @@
     "name" : "遇见玛特",
     "appid" : "__UNI__A59181F",
     "description" : "",
-    "versionName" : "1.0.0",
-    "versionCode" : 100,
+    "versionName" : "1.0.1",
+    "versionCode" : 101,
     "transformPx" : false,
     /* 5+App特有相关 hfhz-mrro-iqmv-igdl storygarden2024@outlook.com*/
     "app-plus" : {

+ 6 - 1
pages/my/M_coin.scss

@@ -3,7 +3,12 @@ page {
 	background-color: #161616;
 }
 .page {
-	background-color: #161616;
+	background-color: #161616;
+	width: 100%;
+	height: 100vh;
+	background: url('../../static/w3/bg.png');
+	background-size: 750rpx 1624rpx;
+	background-repeat: repeat-y;
 }
 .topbg {
 }

+ 6 - 1
pages/my/M_purchase.scss

@@ -3,7 +3,12 @@ page {
 	background-color: #161616;
 }
 .page {
-	background-color: #161616;
+	background-color: #161616;
+	width: 100%;
+	height: 100vh;
+	background: url('../../static/w3/bg.png');
+	background-size: 750rpx 1624rpx;
+	background-repeat: repeat-y;
 }
 .topbg {
 }

+ 152 - 37
pages/my/X_coin.scss

@@ -2,8 +2,13 @@
 page {
 	background-color: #161616;
 }
-.page {
-	background-color: #161616;
+.page {
+	background-color: #161616;
+	width: 100%;
+	height: 100vh;
+	background: url('../../static/w3/bg.png');
+	background-size: 750rpx 1624rpx;
+	background-repeat: repeat-y;
 }
 .topbg {
 }
@@ -23,7 +28,7 @@ page {
 }
 .myinfo {
 	display:flex;flex-direction: column;justify-content: flex-start;
-	margin:30rpx 30rpx 60rpx;
+	margin:30rpx 30rpx 50rpx 30rpx;
 	width: 690rpx;
 	height: 232rpx;
 	background: #333333;
@@ -93,46 +98,156 @@ page {
 			}
 		}
 
-	}
-	.numlist2 {
-		.item {
+	}
+	
+}
+
+.itemlist{
+	
+	display: flex;flex-direction: row;justify-content: space-between;align-items: center;
+	height: 48rpx;
+	padding-left: 30rpx;
+	padding-right: 30rpx;
+	// background: #28292D;
+	// border-radius: 24rpx 24rpx 24rpx 24rpx;
+	.item{
+		display: flex;flex-direction: row;justify-content: space-between;align-items: center;
+		padding: 30rpx;
+		width: 334rpx;
+		height: 96rpx;
+		background: #28292D;
+		border-radius: 28rpx 28rpx 28rpx 28rpx;
+		.left {
+			display: flex;justify-content: flex-start;flex-direction: row;
+		}
+		.arrow {
+			width:36rpx;
+		}
+	}
+
+}
+
+.friendList{
+		display: flex;flex-direction: column;justify-content: flex-start;align-items: flex-start;
+		// height :780rpx;
+		width: 690rpx;
+		// margin-top: 34rpx;
+		padding-left: 30rpx;
+		.title{
 			display: flex;flex-direction: row;justify-content: space-between;align-items: center;
-			height: 148rpx;
-			background: #28292D;
-			border-radius: 24rpx 24rpx 24rpx 24rpx;
-			margin-top: 24rpx;
-			
+			position: relative;
+			width:690rpx;
+			height: 90rpx;
+			
+			// background: #28292D;
+			// background-size: 690rpx 90rpx;
+			margin: 34;
+			margin-top: 34rpx;
 			.left {
-				display: flex;justify-content: center;padding:50rpx;
-				.num {
-					text-align: left;display: flex;flex-direction: column;justify-content: flex-start;align-items: flex-start;
-					font-size: 40rpx;
-					color: #FFFFFF;
+				display: flex;flex-direction: row;justify-content: flex-start;align-items: center;
+				padding-left:28rpx;
+			}
 
-					
-					.data {
-						font-size: 28rpx;color: #999999;margin-top: 12rpx;font-weight: normal;
-					}
+		}
+		.numlist2 {
+			display: flex;flex-direction: column;justify-content: space;align-items: flex-start;
+			width:690rpx;
+			// height: 560rpx;
+			background: #28292D;
+			// background-size: 690rpx 560rpx;
+			border-radius: 28rpx 28rpx 28rpx 28rpx;
+			// background: #ffffff;
 			
+			.empty{
+				display: flex;flex-direction: column;justify-content: normal;align-items: center;
+				width:690rpx;
+				height: 560rpx;
+				.bg {
+					margin-top: 100rpx;
+					width:276rpx;
+					height: 276rpx;
+					background: url('../../static/w3/empty.png');
+					// background: #ffffff;
+					background-size: 276rpx 276rpx;
 				}
 			}
-			.right{
-				height: 40%;
-				display: flex;flex-direction: row;justify-content: flex-start;align-items: flex-start;
-				.num1{
-					padding-right:50rpx;
-					text-align: center;display: flex;flex-direction: column;justify-content: center;align-items: center;
-					font-weight: bold;
-					font-size: 36rpx;
-					color: #FE2D56;
-				}
-				.num2{
-					color: #FFFFFF;
+			
+			.item {
+				display: flex;flex-direction: column;justify-content: space-between;align-items: center;
+				height: 138rpx;
+				width:690rpx;
+				background: rgba(22,22,22,0);
+				border-radius: 0rpx 0rpx 0rpx 0rpx;
+				
+
+				.info{
+					display: flex;flex-direction: row;justify-content: space-between;align-items: center;
+					height: 135rpx;
+					width:690rpx;
+					.left {
+						display: flex;flex-direction: row;justify-content: space-between;align-items: center;
+						.icon{
+							display: flex;flex-direction: column;justify-content: center;align-items: center;
+							width: 80rpx;
+							height: 80rpx;
+							border-radius: 40rpx 40rpx 40rpx 40rpx;
+							border: 2rpx solid #707070;
+							margin-left: 30rpx;							
+							.img{
+								
+								// margin-left: 40rpx;
+								// height: 80rpx;
+								width: 40rpx;
+							}							
+						}
+
+						.nameList{
+							display: flex;justify-content: center;
+							margin-left: 20rpx;
+							.num {
+								text-align: left;
+								display: flex;flex-direction: column;justify-content: flex-start;
+								.name{
+									font-size: 28rpx;
+									color: #FFFFFF;	
+									display: flex;flex-direction: row;justify-content: flex-start;
+									.icon{
+										margin-left: 5rpx;
+										height: 40rpx;
+									}
+								}
+								.data {
+									font-size: 24rpx;color: #999999;margin-top: 12rpx;font-weight: normal;
+								}												
+							}							
+						}
+					}
+					.right{
+						height: 40%;
+						// display: flex;flex-direction: column;justify-content: flex-start;align-items: flex-start;
+						display: flex;flex-direction: column;justify-content: center;
+						// text-align: right;
+						width: 152rpx;
+						height: 72rpx;
+						border-radius: 24rpx 24rpx 24rpx 24rpx;
+						border: 2rpx solid #707070;
+						margin-right: 30rpx;
+						.txt{
+							text-align: center;display: flex;flex-direction: column;justify-content: center;align-items: center;
+							// text-align: right;
+							font-size: 28rpx;
+							color: #FFFFFF;	
+							// margin-right: 0rpx;
+						}
+					}
 				}
-			}
-		}
-	}
-}
-.blankHeight {
+			}
+		}
+	}
+	
+
+
+.blankHeight {
+
 	height:100rpx;
 }

+ 87 - 13
pages/my/X_coin.vue

@@ -20,7 +20,7 @@
 
 					</view>
 				</view>
-				<text style="padding-top: 25srpx;padding-left: 50rpx;color: #999999; font-size: 24rpx;">{{$t('txt.升级后享平台最大权益')}}</text>
+				<text style="padding-top: 18rpx;padding-left: 50rpx;color: #999999; font-size: 24rpx;">{{$t('txt.升级后享平台最大权益')}}</text>
 				<view class="numlist">
 					<view class="left">
 						<image style="height:40rpx"src="../../static/me/icon_equity.png" mode="heightFix" />
@@ -37,16 +37,7 @@
 
 
 
-<!-- 				<view class="mingxiList">
-					<view class="left">
-						<text style="font-size: 28rpx;color: #999999;">{{$t('txt.明细类型')}}</text>
-						<image class="icon" src="../../static/me/arrow_down_gray.png" mode="heightFix" />
-					</view>
-					<view class="right">
-						<text style="font-size: 28rpx;color: #999999;">{{$t('txt.开始时间-结束时间')}}</text>
-						<image class="icon" src="../../static/me/arrow_down_gray.png" mode="heightFix" />
-					</view>
-				</view> -->
+
 
 <!-- 				<view class="numlist2">
 					<view class="item" v-for="(item, index) in historyInfo" :key="index">
@@ -67,8 +58,72 @@
 					</view>
 				</view> -->
 
-			</view>
 
+			</view>
+			<view class="itemlist">
+				<view class="item">
+					<view class="left">
+						<image style="height:36rpx" class="arrow" src="../../static/me/icon_wallet.png" mode="widthFix" />
+						<text style="margin-left: 20rpx; font-size: 28rpx;color: #FFFFFF;">{{$t('txt.钱包')}}</text>
+					</view>
+					<image class="arrow" src="../../static/me/arrow_right_gray.png" mode="widthFix" />
+				</view>
+				<view class="item">
+					<view class="left">
+						<image style="height:36rpx" class="arrow" src="../../static/me/icon_store.png" mode="widthFix" />
+						<text style="margin-left: 20rpx; font-size: 28rpx;color: #FFFFFF;">{{$t('txt.兑换商城')}}</text>
+						<!-- <image class="icon" src="../../static/me/arrow_down_gray.png" mode="heightFix" /> -->
+					</view>
+					<image class="arrow" src="../../static/me/arrow_right_gray.png" mode="widthFix" />
+				</view>
+			</view>
+			
+			<view class="friendList">
+				<view class="title">
+					<view class="left">
+						<text style="font-size: 28rpx;color: #FFFFFF;">{{$t('txt.免费获取')}}</text>
+						<text style="font-size: 28rpx;color: #C7A58A;">{{$t('txt.X币')}}</text>
+					</view>
+				</view>
+			
+				<view class="numlist2"
+					:style="{ backgroundSize: '100% ' + (task_list_len * 140) + 'rpx', backgroundPosition: 'bottom' }">
+					<view v-if="task_list_len<=0" class="empty">
+						<view class="bg"></view>
+						<text style="margin-top: 40rpx;font-size: 24rpx;color: #999999;">{{$t('txt.暂无数据')}}</text>
+					</view>
+					<view v-else class="item" v-for="(item, index) in task_list" :key="index">
+						<view class="info">
+							<view class="left">
+								<view class = "icon">
+									<image class="img" src="../../static/w3/w3_1.png" mode="widthFix" />
+								</view>
+								<view class="nameList">
+									<view class="num">
+										<view class="name">
+											<text>{{$t('txt.'+item.nickname)}}</text>
+											<image v-if="item.is_vip===2" class="icon"
+												src="../../static/w3/w3_black_vip.png" mode="heightFix" />
+											<image v-else-if="item.is_vip===1" class="icon"
+												src="../../static/w3/w3_vip.png" mode="heightFix" />
+										</view>
+										<view class="data">{{$t('txt.'+item.login_time)}}</view>
+									</view>
+								</view>
+							</view>
+							<view class="right">
+								<view class="txt">
+									<text>{{$t('txt.'+item.mobile)}}</text>
+								</view>
+							</view>
+						</view>
+						<view class="line">
+				
+						</view>
+					</view>
+				</view>
+			
+			</view>
 
 			<view class="blankHeight"></view>
 		</view>
@@ -108,7 +163,26 @@
 						value: -100,
 						data:"2023-1-12 11:00"
 					}
-				}
+				},
+				task_list_len : 2,
+					task_list: [
+						{
+						nickname: "签到领取",
+						is_vip: 0,
+						is_idcheck: 0,
+						value: 100,
+						mobile: "去开通",
+						login_time: "奖励100X/次"
+					},
+					{
+						nickname: "签到领取",
+						is_vip: 0,
+						is_idcheck: 0,
+						value: 100,
+						mobile: "去开通",
+						login_time: "奖励100X/次"
+					}
+				]
 			}
 		},
 		onLoad() {

+ 2 - 2
pages/w3/friendsList.vue

@@ -14,8 +14,8 @@
 						</view>
 					</view>
 					<view class="numlist2"
-						:style="{ backgroundImage: 'url(../../static/w3/invite_bg.png)', backgroundSize: '100% ' + (friendsInfo.length * 140) + 'rpx', backgroundPosition: 'bottom' }">
-						<view v-if="friendsInfo.length<=0" class="empty">
+						:style="{ backgroundImage: 'url(../../static/w3/invite_bg.png)', backgroundSize: '100% ' + (num_zt * 140) + 'rpx', backgroundPosition: 'bottom' }">
+						<view v-if="num_zt<=0" class="empty">
 							<view class="bg"></view>
 							<text style="margin-top: 40rpx;font-size: 24rpx;color: #999999;">暂无数据</text>
 						</view>

TEMPAT SAMPAH
static/me/icon_store.png


TEMPAT SAMPAH
static/me/icon_wallet.png