hwq 4 سال پیش
والد
کامیت
3d0f5da41e
7فایلهای تغییر یافته به همراه727 افزوده شده و 2 حذف شده
  1. 21 0
      pages.json
  2. 258 0
      pages/assets/myPing.vue
  3. 131 0
      pages/assets/teamDetails.vue
  4. 315 0
      pages/user/extension.vue
  5. 2 2
      pages/user/user.vue
  6. BIN
      static/img/fanhui.png
  7. BIN
      static/img/share-bg.png

+ 21 - 0
pages.json

@@ -101,12 +101,33 @@
 				"navigationBarTitleText": "收货地址"
 			}
 		},
+		{
+			"path": "pages/assets/myPing",
+			"style": {
+				"navigationBarTitleText": "我的拼购"
+			}
+		},
+		{
+			"path": "pages/assets/teamDetails",
+			"style": {
+				"navigationBarTitleText": "我的组队详情"
+			}
+		},
 		{
 			"path": "pages/set/addressManage",
 			"style": {
 				"navigationBarTitleText": ""
 			}
 		},
+		{
+			"path": "pages/user/extension",
+			"style": {
+				"navigationBarTitleText": "我的推广",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
 		{
 			"path": "pages/set/phone",
 			"style": {

+ 258 - 0
pages/assets/myPing.vue

@@ -0,0 +1,258 @@
+<template>
+	<view class="center">
+		<view class="bg"></view>
+		<view class="zong flex">
+			<view class="info">
+				<view class="info-num">{{happy || '0.00' }}</view>
+				<view class="info-font">福气值</view>
+			</view>
+			<view class="info">
+				<view class="info-num">{{luck || '0.00' }}</view>
+				<view class="info-font">幸运值</view>
+			</view>
+			<view class="info">
+				<view class="info-num">{{honor || '0.00' }}</view>
+				<view class="info-font">荣誉值</view>
+			</view>
+		</view>
+		<view class="money flex">
+			<view class="money-box">
+				<view class="money-num">{{usdt || '0.00' }}</view>
+				<view class="money-font">昨日USDT分红池</view>
+			</view>
+			<view class="money-box" >
+				<view class="money-num" style="text-align: right;">{{fil || '0.00' }}</view>
+				<view class="money-font">昨日FIL分红池</view>
+			</view>
+		</view>
+		<view class="join">
+			<view class="xian"></view>
+			<view class="join-font">参与记录</view>
+		</view>
+		<scroll-view scroll-y="true" @scrolltolower="loadData">
+			<view v-for="(item,index) in list" :key="index" class="box" @click="nav(item)">
+				<view class="title">
+					<view class="log"><image src="" mode=""></image></view>
+					<view class="name">{{item.name}}</view>
+					<view class="lun">{{item.lun}}</view>
+					<view class="more">详情</view>
+				</view>
+				<view class="main">
+					<view class="main-info">
+						<view class="main-left">参与份数</view>
+						<view class="main-right">{{item.fen}}人份</view>
+					</view>
+					<view class="main-info">
+						<view class="main-left">参与金额</view>
+						<view class="main-right">{{item.money}}USDT</view>
+					</view>
+					<view class="main-info">
+						<view class="main-left">参与时间</view>
+						<view class="main-right">{{item.time}}</view>
+					</view>
+				</view>
+			</view>
+		</scroll-view>
+	</view>
+</template>
+
+<script>
+export default {
+	data() {
+		return {
+			happy: '0.00',
+			luck: '0.00',
+			honor: '0.00',
+			usdt: '0.00',
+			fil: '0.00',
+			list: [
+				{
+					name: 'FilsCoin矿机拼购',
+					lun: '36轮',
+					fen: 1,
+					money: 100,
+					time: '2021-07-23 14:00:20'
+				},
+				{
+					name: 'FilsCoin矿机拼购',
+					lun: '36轮',
+					fen: 1,
+					money: 100,
+					time: '2021-07-23 14:00:20'
+				},
+				{
+					name: 'FilsCoin矿机拼购',
+					lun: '36轮',
+					fen: 1,
+					money: 100,
+					time: '2021-07-23 14:00:20'
+				},
+			],
+			loadtype: '',
+			page: 1,
+			limit: 10,
+		}
+	},
+	methods:{
+		nav(e) {
+			uni.navigateTo({
+				url: '/pages/assets/teamDetails'
+			})
+		},
+	}
+}
+</script>
+
+<style lang="scss">
+.center,page {
+	height: 100%;
+	background: #F7FBFE;
+}
+.bg {
+	width: 750rpx;
+	height: 248rpx;
+	background: #000000;
+	border-bottom-left-radius: 150rpx;
+	border-bottom-right-radius: 150rpx;
+}
+.zong {
+	width: 690rpx;
+	height: 181rpx;
+	background: #FFFFFF;
+	box-shadow: 0px 0px 17rpx 0px rgba(0, 0, 0, 0.05);
+	border-radius: 20rpx;
+	margin: -150rpx auto 0;
+	justify-content: space-between;
+	padding: 0rpx 36rpx;
+	.info {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		.info-num {
+			font-size: 50rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #0F253A;
+		}
+		.info-font {
+			font-size: 28rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #6D7C88;
+		}
+	}
+}
+.money {
+	width: 690rpx;
+	height: 143rpx;
+	background: #FFFFFF;
+	box-shadow: 0px 0px 17rpx 0px rgba(0, 0, 0, 0.05);
+	border-radius: 20rpx;
+	margin: 10rpx auto 0;
+	justify-content: space-between;
+	padding: 0rpx 36rpx;
+	.money-box {
+		display: flex;
+		flex-direction: column;
+		.money-num {
+			font-size: 40rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #0F253A;
+		}
+		.money-font {
+			font-size: 24rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #6D7C88;
+		}
+	}
+}
+.join {
+	margin-top: 44rpx;
+	padding-left: 30rpx;
+	display: flex;
+	justify-content: flex-start;
+	align-items: center;
+	.xian {
+		width: 6rpx;
+		height: 30rpx;
+		background: #0F253A;
+		border-radius: 4rpx;
+	}
+	.join-font {
+		padding-left: 16rpx;
+		font-size: 30rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #0F253A;
+	}
+}
+.box:first-child {
+	margin-top: 34rpx;
+}
+.box {
+	margin: 20rpx auto 0;
+	width: 690rpx;
+	background: #FFFFFF;
+	box-shadow: 0px 0px 17rpx 0px rgba(0, 0, 0, 0.05);
+	border-radius: 20rpx;
+	padding: 26rpx 36rpx 30rpx 30rpx;
+	position: relative;
+	.title {
+		display: flex;
+		justify-content: flex-start;
+		align-items: center;
+		.log {
+			width: 48rpx;
+			height: 46rpx;
+			background: #00BCD4;
+			image{
+				width: 100%;
+				height: 100%;
+			}
+		}
+		.name {
+			padding-left: 12rpx;
+			font-size: 34rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #0F253A;
+		}
+		.lun {
+			padding-left: 10rpx;
+			font-size: 26rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #6D7C88;
+		}
+		.more {
+			padding-left: 158rpx;
+			font-size: 28rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #44969D;
+		}
+	}
+	.main {
+		margin-top: 26rpx;
+		.main-info{
+			padding-top: 16rpx;
+			display: flex;
+			justify-content: space-between;
+			.main-left {
+				font-size: 26rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #6D7C88;
+			}
+			.main-right {
+				font-size: 26rpx;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #0F253A;
+			}
+		}
+	}
+}
+</style>

+ 131 - 0
pages/assets/teamDetails.vue

@@ -0,0 +1,131 @@
+<template>
+	<view class="center">
+		<view class="box">
+			<view class="title">
+				<view class="log"><image src="" mode=""></image></view>
+				<view class="name">FilsCoin矿机拼购</view>
+				<view class="lun">36轮</view>
+				<view class="more">已开奖</view>
+			</view>
+			<view class="main">
+				<view class="main-info rule">每轮限购1组,每组限购1份</view>
+				<view class="main-info time">
+					开奖时间:
+					<text>2021-07-21 08:00:00</text>
+				</view>
+				<view class="main-info new">该轮预约1份,拼中1份,退回0份</view>
+			</view>
+		</view>
+		<view class="box">
+			<view class="allTitle">
+				<view class="title-left">第1组 预约份数/总份数:11/11</view>
+				<view class="title-right">未中奖</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+export default {
+	data() {
+		return {
+			data: ''
+		};
+	}
+};
+</script>
+
+<style lang="scss">
+.center,
+page {
+	height: 100%;
+	background: #f7fbfe;
+}
+.box {
+	margin: 30rpx auto 0;
+	width: 690rpx;
+	background: #ffffff;
+	box-shadow: 0px 0px 17rpx 0px rgba(0, 0, 0, 0.05);
+	border-radius: 20rpx;
+	padding: 26rpx 36rpx 30rpx 30rpx;
+	.title {
+		display: flex;
+		justify-content: flex-start;
+		align-items: center;
+		.log {
+			width: 48rpx;
+			height: 46rpx;
+			background: #00bcd4;
+			image {
+				width: 100%;
+				height: 100%;
+			}
+		}
+		.name {
+			padding-left: 12rpx;
+			font-size: 34rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #0f253a;
+		}
+		.lun {
+			padding-left: 10rpx;
+			font-size: 26rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #6d7c88;
+		}
+		.more {
+			padding-left: 140rpx;
+			font-size: 28rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #44969d;
+		}
+	}
+	.main {
+		margin-top: 26rpx;
+		.main-info {
+			padding-top: 16rpx;
+		}
+		.rule {
+			font-size: 26rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #0f253a;
+		}
+		.time {
+			font-size: 26rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #6d7c88;
+			text {
+				color: #0f253a;
+			}
+		}
+		.new {
+			font-size: 24rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #ff4c4c;
+		}
+	}
+}
+.allTitle {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	.title-left {
+		font-size: 34rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #0F253A;
+	}
+	.title-right {
+		font-size: 26rpx;
+		font-family: PingFang SC;
+		font-weight: 500;
+		color: #6D7C88;
+	}
+}
+</style>

+ 315 - 0
pages/user/extension.vue

@@ -0,0 +1,315 @@
+<template>
+	<view class="content">
+		<view class="content-money">
+			<view class="money-box">
+				<view class="goback-box" @click="toBack">
+					<image class="goback" src="../../static/img/fanhui.png" mode=""></image>
+				</view>
+				<view class="header">我的推广</view>
+				<image class="tuiguang_bg" src="../../static/img/share-bg.png"></image>
+				<!--  <view class="money_img"><image :src="list.avatar || img"></image></view> -->
+				<view class="money-frame">
+					<!-- <view class="money_name">我的推广</view> -->
+					<view class="money_num">
+						{{ all || '0' }}
+						<text class="money_ren">人</text>
+					</view>
+				</view>
+			</view>
+		</view>
+		<scroll-view class="list-scroll-content" scroll-y @scrolltolower="loadData">
+			<!-- 空白页 -->
+			<empty v-if="orderList.length === 0"></empty>
+
+			<!-- 订单列表 -->
+			<view v-for="(item, index) in orderList" :key="index" class="order-item flex">
+				<view class="title-box flex_item">
+					<view class="title-avatar"><image :src="item.avatar"></image></view>
+					<view class="list_tpl">
+						<view class="title">
+							<text>{{ item.nickname }}</text>
+						</view>
+						<view class="time">
+							<text>{{ item.time }}</text>
+						</view>
+					</view>
+				</view>
+			</view>
+			<uni-load-more :status="loadingType"></uni-load-more>
+		</scroll-view>
+	</view>
+</template>
+<script>
+import { mapState, mapMutations } from 'vuex';
+import uniLoadMore from '@/uview-ui/components/u-loading-page/u-loading-page.vue';
+import empty from '@/uview-ui/components/u-empty/u-empty.vue';
+export default {
+	components: {
+		empty,
+		uniLoadMore
+	},
+	onReady() {
+		// 初始化获取页面宽度
+		uni.createSelectorQuery()
+			.select('.content')
+			.fields(
+				{
+					size: true
+				},
+				data => {
+					// console.log(data);
+					// console.log(Math.floor((data.width / 750) * 300));
+					// 保存头部高度
+					this.maxheight = data.height - Math.floor((data.width / 750) * 470) - 44;
+					// console.log(this.maxheight);
+				}
+			)
+			.exec();
+	},
+	data() {
+		return {
+			// 头部图高度
+			maxheight: '',
+			orderList: [
+				{
+					nickname:'lan',
+					time:'2021-9-9'
+				}
+			],
+			all: '',
+			loadingType:'',
+			page: 1,
+			limit: 10,
+		};
+	},
+	onLoad(options) {},
+	onShow() {
+		
+	},
+	methods: {
+		// 页面跳转
+		navto(e) {
+			uni.navigateTo({
+				url: e
+			});
+		},
+		// 点击返回 我的页面
+		toBack() {
+			uni.switchTab({
+				url: '/pages/user/user'
+			});
+		}
+	}
+};
+</script>
+
+<style lang="scss">
+page {
+	background: #ffffff;
+	height: 100%;
+}
+.content-money {
+	padding-bottom: 30rpx;
+	background: $page-color-base;
+	.buttom-box {
+		position: relative;
+		background-color: #ffffff;
+		text-align: center;
+		margin: 0 30rpx;
+		padding: 30rpx 0;
+		border-radius: $border-radius-sm;
+		margin-top: -80rpx;
+		.buttom {
+			font-size: $font-lg;
+			flex-grow: 1;
+			.money {
+				font-weight: bold;
+				font-size: 32rpx;
+				color: #ff0000;
+			}
+		}
+		.text {
+			color: #666666;
+		}
+		.interval {
+			width: 2rpx;
+			height: 60rpx;
+			background-color: #eeeeee;
+		}
+		.icon {
+			height: 50rpx;
+			width: 48rpx;
+			margin: 0 auto;
+			.icon-img {
+				width: 100%;
+				height: 100%;
+			}
+		}
+	}
+}
+.money-box {
+	// background: $base-color;
+	height: 424rpx;
+	color: #ffffff;
+	text-align: center;
+	font-size: 35rpx;
+	position: relative;
+	// padding-top: 60rpx;
+	.header {
+		position: absolute;
+		left: 0;
+		top: 0;
+		width: 100%;
+		height: 80rpx;
+		font-size: 32rpx;
+		font-weight: 700;
+		z-index: 99;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+	}
+	.goback-box {
+		position: absolute;
+		left: 18rpx;
+		top: 0;
+		height: 80rpx;
+		display: flex;
+		align-items: center;
+	}
+	.goback {
+		z-index: 100;
+		width: 34rpx;
+		height: 34rpx;
+	}
+	.tuiguang_bg {
+		width: 100%;
+		height: 424rpx;
+		position: relative;
+	}
+	.money_img {
+		width: 100%;
+		height: 120rpx;
+		text-align: center;
+		padding-top: 50rpx;
+		padding-bottom: 135rpx;
+		image {
+			width: 120rpx;
+			height: 120rpx;
+			border: 4rpx solid #fd5f6f;
+			border-radius: 50%;
+		}
+	}
+	.money-frame {
+		position: absolute;
+		top: 0;
+		width: 100%;
+		padding-top: 120rpx;
+		// left: 30rpx;
+		// height: 460rpx;
+		// display: flex;
+		// align-items: flex-start;
+		// flex-direction: column;
+		// justify-content: center;
+	}
+	.money_name {
+		width: 100%;
+		text-align: center;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #ffffff;
+	}
+	.money_num {
+		font-size: 72rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #ffffff;
+		.money_ren {
+			font-size: 36rpx;
+		}
+	}
+}
+
+.navbar {
+	display: flex;
+	height: 40px;
+	padding: 0 5px;
+	background: #fff;
+	box-shadow: 0 1px 5px rgba(0, 0, 0, 0.06);
+	position: relative;
+	z-index: 10;
+	.nav-item {
+		flex: 1;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		height: 100%;
+		font-size: 15px;
+		color: $font-color-dark;
+		position: relative;
+		&.current {
+			color: #ff0000;
+			&:after {
+				content: '';
+				position: absolute;
+				left: 50%;
+				bottom: 0;
+				transform: translateX(-50%);
+				width: 44px;
+				height: 0;
+				border-bottom: 2px solid #ff0000;
+			}
+		}
+	}
+}
+// 列表
+
+
+	.order-item {
+		padding: 20rpx 30rpx;
+		line-height: 1.5;
+		.title-box {
+			width: 100%;
+			.title-avatar {
+				width: 100rpx;
+				height: 100rpx;
+				margin-right: 25rpx;
+				background: #03A9F4;
+				border-radius: 100%;
+				image {
+					width: 100%;
+					height: 100%;
+					border-radius: 100%;
+				}
+			}
+			.list_tpl {
+				width: 85%;
+				.title {
+					font-size: $font-lg;
+					color: $font-color-base;
+					overflow: hidden; //超出的文本隐藏
+					text-overflow: ellipsis; //溢出用省略号显示
+					white-space: nowrap;
+				}
+				.time {
+					font-size: $font-base;
+					color: $font-color-light;
+				}
+			}
+		}
+		.money {
+			color: #db1935;
+			font-size: $font-lg;
+		}
+	}
+
+.list-scroll-content {
+	height: 100%;
+}
+.content {
+	height: 100%;
+	.empty-content {
+		background-color: #ffffff;
+	}
+}
+</style>

+ 2 - 2
pages/user/user.vue

@@ -10,12 +10,12 @@
 		<view class="main">
 			<view class="title">我的工具</view>
 			<view class="tt">
-				<view class="tt-box">
+				<view class="tt-box" @click="nav('/pages/assets/myPing')">
 					<image src="../../static/img/pinggou.png" class="tt-icon1" mode=""></image>
 					<view class="tt-txt">我的拼购</view>
 					<image src="../../static/img/jiantou.png" class="next-icon" mode=""></image>
 				</view>
-				<view class="tt-box">
+				<view class="tt-box" @click="nav('/pages/user/extension')">
 					<image src="../../static/img/myTeam.png" class="tt-icon2" mode=""></image>
 					<view class="tt-txt">我的团队</view>
 					<image src="../../static/img/jiantou.png" class="next-icon" mode=""></image>

BIN
static/img/fanhui.png


BIN
static/img/share-bg.png