7-16

pages.json

@@ -246,6 +246,15 @@
 					"titleNView": false
 				}
 			}
+		},
+		{
+			"path": "pages/user/rake",
+			"style": {
+				"navigationBarTitleText": "矿机列表",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
 		}
 	],
 	"globalStyle": {

pages/user/myTeam.vue

@@ -45,7 +45,7 @@
 						<view class="title">等级</view>
 					</view>
 				</view>
-				<view class="cell-box flex" v-for="(ls,index) in list" :key='index'>
+				<view class="cell-box flex" v-for="(ls,index) in list" :key='index' @click="nav('/pages/user/rake')">
 					<view class="cell-tit flex_item">
 						<image :src="ls.avatar"></image>
 						<view class="tit-box">

pages/user/rake.vue

@@ -0,0 +1,275 @@
+<template>
+	<view class="rake">
+		<scroll-view scroll-y="true" id="item-wrapper" class="list-cell" :style="{ height: height }">
+			<!-- <empty v-if="list.length === 0"></empty> -->
+			<view class="item">
+				<view class="top">
+					<view class="info-title">
+						<image src="../../static/img/img11.png" mode=""></image>
+						<view class="">
+							六牛云有有有意义意义六牛云有有有意义
+						</view>
+					</view>
+					<view class="tags">
+						<view class="tag">540天矿机</view>
+						<view class="tag">540天矿机</view>
+						<view class="tag">540天矿机</view>
+						<view class="tag">540天矿机</view>
+						
+					</view>
+					<view class="base-info">
+						<view class="info-item">
+							<view class="tit">单价</view>
+							<view class="val">25.00FIL/T</view>
+						</view>
+						<view class="info-item">
+							<view class="tit">有效算力</view>
+							<view class="val">1T/台</view>
+						</view>
+						<view class="info-item">
+							<view class="tit">周期</view>
+							<view class="val">540天 + 180天</view>
+						</view>
+					</view>
+					<view class="end-time">
+						到期时间：2021年9月20日
+					</view>
+				</view>
+				
+				<view class="btn-wrapper">
+					<view class="btn">
+						服务费:10%<text @click="set(1)">设置</text>
+					</view>
+					<view class="btn">
+						佣金比例:10%<text @click="set(2)">设置</text>
+					</view>
+				</view>
+			</view>
+			
+		</scroll-view>
+		<uni-popup ref="popup" type="center">
+			<view class="wrapper">
+				<view class="title">
+					设置{{setType === 0? '服务费':'佣金比例'}}
+				</view>
+				<input type="text" v-model="setVal" :placeholder="placeTitle" class="inp"/>
+				<view class="btn-wrapper">
+					<view class="cansel" @click="close()">
+						取消
+					</view>
+					<view class="qr" @click="sub()">
+						确定
+					</view>
+				</view>
+			</view>
+		</uni-popup>
+	</view>
+</template>
+
+<script>
+	import empty from '../../components/empty.vue'
+	export default {
+		components: {
+			empty
+		},
+		data() {
+			return {
+				height: 0,
+				setType: 0,
+				setVal: null,
+				list: []
+			}
+		},
+		computed: {
+			placeTitle() {
+				return this.setType === 0 ? '设置比例为10%~10%': '设置比例为10%~10%'
+			}
+		},
+		onReady(res) {
+			var _this = this;
+			uni.getSystemInfo({
+				success: resu => {
+					const query = uni.createSelectorQuery();
+					query.select('.list-cell').boundingClientRect();
+					query.exec(function(res) {
+						console.log(res, 'ddddddddddddd');
+						_this.height = resu.windowHeight - res[0].top + 'px';
+						console.log('打印页面的剩余高度', _this.height);
+					});
+				},
+				fail: res => {}
+			});
+		},
+		methods: {
+			set(index) {
+				this.setType = index
+				this.$refs.popup.open()
+			},
+			close() {
+				this.$refs.popup.close()
+				this.setVal = null
+			},
+			sub() {
+				console.log()
+				this.$refs.popup.close()
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page {
+		
+		height: 100%;
+		// padding-top: 20rpx;
+	}
+	.rake {
+		// padding-top: 30rpx;
+	}
+	.item {
+		
+		margin: 20rpx auto;
+		width: 670rpx;
+		// height: 438rpx;
+		background: #F7F6FB;
+		border-radius: 10rpx;
+		box-shadow:0 0 20rpx rgba(0,0,0,0.2);
+		.top {
+			// height: 347rpx;
+			width: 100%;
+			padding: 40rpx 30rpx 0;
+			.info-title {
+				display: flex;
+				
+				image {
+					display: inline-block;
+					width: 38rpx;
+					height: 38rpx;
+					margin-left: 10rpx;
+					flex-shrink: 0;
+				}
+				view {
+					padding-left: 12rpx;
+					font-size: 30rpx;
+					font-family: PingFang SC;
+					font-weight: bold;
+					color: #333333;
+				}
+			}
+			.tags {
+				padding-top: 20rpx;
+				display: flex;
+				flex-wrap: wrap;
+				.tag {
+					display: inline-block;
+					padding: 0 20rpx;
+					text-align: center;
+					line-height: 43rpx;
+					background: #E3F6FA;
+					border-radius: 22rpx;
+					margin:10rpx 10rpx 0 ;
+					font-size: 24rpx;
+					font-family: PingFang SC;
+					font-weight: bold;
+					color: #0EC1A1;
+
+				}	
+			}
+			.base-info {
+				padding-top: 30rpx;
+				display: flex;
+				justify-content: space-between;
+				// text-align: center;
+				font-size: 24rpx;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #333333;
+				padding-bottom: 30rpx;
+			}
+			.end-time {
+				font-size: 30rpx;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #5771DF;
+				padding-bottom: 24rpx;
+			}
+		}
+		.btn-wrapper {
+			width: 670rpx;
+			height: 95rpx;
+			background: #FFFFFF;
+			border-radius: 0px 0px 10rpx 10rpx;
+			display: flex;
+			justify-content: space-around;
+			align-items: center;
+			.btn {
+				
+				text {
+					display: inline-block;
+					width: 108rpx;
+					height: 39rpx;
+					background: #5771DF;
+					border: 1rpx solid #5771DF;
+					box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.1);
+					border-radius: 20rpx;
+					text-align: center;
+					line-height: 35rpx;
+					margin-left: 11rpx;
+					font-size: 24rpx;
+					font-family: PingFang SC;
+					font-weight: 500;
+					color: #FFFFFF;
+				}
+			}
+		}
+	}
+	.list-cell {
+		width: 100%;
+		height: 100%;
+		background-color: #f8f8f8;
+	}
+	.wrapper {
+		width: 549rpx;
+		height: 344rpx;
+		background: #FFFFFF;
+		border-radius: 14rpx;
+		.title {
+			text-align: center;
+			padding-top: 40rpx;
+			font-size: 37rpx;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #333333;
+		}
+		.inp {
+			display: block;
+			margin: 60rpx auto;
+			width: 439rpx;
+			height: 68rpx;
+			background: #F6F6F6;
+			border-radius: 10rpx;
+			padding-left: 13rpx;
+		}
+		.btn-wrapper {
+			display: flex;
+			view {
+				width: 50%;
+				text-align: center;
+			}
+			.cansel {
+				
+				font-size: 37rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #333333;
+			}
+			.qr {
+				font-size: 37rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #5771DF;
+			}
+		}
+		
+	}
+</style>