partnerApp/pages/institutional/partnerDetail.vue

<template>
	<view class="" >
		<public-module></public-module>
		 <view class="headers " :style="headerStyle">
			<view class="dis a-c j-start " style="padding: 0 15px;">
				<u-icon name="arrow-left"  size="40" @tap="back"></u-icon>
				<text style="margin: auto;">{{chineseNumbers[parentData.level-1]}}级合伙人</text>
			</view>
		</view>
		
        <view class="body"   style="background: #F8FAFE;margin-top: 85px;">
			<view class="partner-head">
				<seach  @queryData="queryData" :directLsit='parentData' />
			</view>
			<card ref="card" :cardData='directLsit' ></card>
			<!-- <block v-for="(item,index) in directLsit" :key="index">
				<view class="card" >
					<view style="padding: 10px 15px 0 10px">
					<view class="dis j-s card-title">
						<view>
							<text>{{chineseNumbers[index-1]}}级合伙人</text>
							<image v-if="index==1" style="display: inline-block; width: 45px;height:18px;vertical-align: sub;" src="/static/icon/级别 (5).png" mode=""></image></text>
							<image v-if="index==2"  style="display: inline-block; width: 45px;height:18px;vertical-align: sub;" src="/static/icon/级别.png" mode=""></image></text>
							<image v-if="index==3"  style="display: inline-block; width: 45px;height:18px;vertical-align: sub;" src="/static/icon/级别 (1).png" mode=""></image></text>
							<image v-if="index==4"  style="display: inline-block; width: 45px;height:18px;vertical-align: sub;" src="/static/icon/级别 (2).png" mode=""></image></text>
						</view>
					</view>
					<view class="card-con dis j-c a-c">
						<view >
							<text>{{item.teamManNum}}</text>
							<text>总人数</text>
						</view>
						<view>
							<text>{{item.sumPremium}}</text>
							<text>总保费</text>
						</view>
						<view style="border-right:none">
							<text>{{item.extractFee}}</text>
							<text>总佣金</text>
						</view>
					</view>
					</view>
					<view class="card-footer dis">
						<text style="border-right: 1px solid #EEEEEE;">
							<image  src="/static/icon/hehuoren.png" mode=""></image>
							合伙人（{{item.partnerNumber}}）</text>
							<text>
						<image  src="/static/icon/gongzuoshi.png" mode=""></image>
						工作室（{{item.workNumber}}）</text>
					</view>
				</view>
				
			</block> -->
			<!-- <u-loadmore style="margin-top: 5px;" v-if="directLsit.length!=0" :status="status" />
			<o-empty v-if="directLsit.length==0" /> -->
		
    </view>
		
	</view>
</template>
<script>
	import seach from '../components/seach.vue';
	import card from '../components/card.vue'
	export default{
		components:{card,seach},
		data(){
			return{
				chineseNumbers:[ '一', '二', '三', '四', '五', '六', '七', '八', '九'],
				headerStyle: {
					backgroundColor: 'transparent',
					backgroundImage: 'url("/static/背景 (1).png")',
					backgroundSize: 'cover',
					backgroundPosition: '',
					boxShadow: ''
					// 其他样式属性...
				},
				teamTabIndex: 0,
				directLsit: [],
                source:0,
				totalPages:0,
                totalSize:0,
				status: 'loadmore',
				pageRequest: { //查询的默认条件
					pageNum: 1,
					pageSize: 20,
                    userName:''
				},
				inputAlign: 'left',
                parentData:{}
			}
		},
		async onLoad(e) {
			this.parentData = JSON.parse(decodeURIComponent(e.key));
			this.queryData()
		},
		methods:{
			
			back() {
				uni.navigateBack({
					delta: 1, // 返回的页面数，如果是1表示返回上一页
					success: function() {}
				});
				
			},
			onReachBottom() {
				if (this.pageRequest.pageNum >= this.totalPages) return;
				this.status = 'loading';
				this.pageRequest.pageNum = ++this.pageRequest.pageNum;
				setTimeout(async () => {
					let res = await this.$http.post('/sysPartner/querySysPartnerAPPPage', {
						...this.pageRequest,
                        source:this.source
				});
					if (res.code == '200') {
					this.totalSize = res.data.totalSize;
						this.directLsit = [...this.directLsit, ...res.data.content];
					}
					if (this.pageRequest.pageNum >= this.totalPages) this.status = 'nomore';
					else this.status = 'loading';
				}, 1000)
			},
			onSelected(e) { //选择
				this.showDatePicker = false;
				if (e) {
					this.dateRange = e.value;
					this.queryData();
				}
			},
			async queryData(data) {
					let params = {
				        beginTime:data&& data.beginTime || '',
				        endTime:data&& data.endTime  || '',
						industrySector:data&& data.industrySector  ||'',
						type:1,
						partnerIds:this.parentData.partnerIds,
						level: this.parentData.partnerType ||this.parentData.level+1 ,
						// ...this.pageRequest
					}
				let res = await this.$http.post('/APPPartner/queryPartnerInfo', params);
				if (res.code == '200' && res.data) {
					this.directLsit=res.data.partnerInfoVoList
					this.parentData.level=res.data.partnerInfoVoList[0].level
					this.parentData= {...this.parentData,...res.data}
					this.totalPages = res.data.totalPages;
					this.totalSize = res.data.totalSize;
					if (this.pageRequest.pageNum >= res.data.totalPages) this.status = 'nomore';
					else this.status = 'loadmore';
                    
				}
			},
			onShowDatePicker() { //显示
				this.showDatePicker = true;
			},
		}
		
	}
</script>

<style lang="scss" scoped>
	
	.headers {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 999999;
		padding-top: 40px;
		    height: 85px;
		text {
			font-size: 18px;
			font-weight: bold;
		}
	}
	.partner-head{
		background: #FFFFFF;
		color: #333333;
		font-size: 14px;
		i{
			margin-left: 2px;
			display:inline-block;
			width: 0;
			height: 0;
			border: 4px solid;
			border-color: #666666;
			border-bottom: 4px solid transparent; 
			border-right: 4px solid transparent;
			border-left: 4px solid transparent;
		}
		.search-data{
			color: #666666;
			.active{
				color: #FFFFFF;
				background: linear-gradient( 132deg, #2DD9FF 0%, #2D6DFF 100%);
			}
			text{
				// width: 25px;
				// height: 25px;
				// text-align: center;
				padding: 5px 8px;
				border: 1px solid #EEEEEE;
			}
		}
	}
	.sum-insurance{
		padding: 10px 0;
		view{
			text-align: center;
			width: 33.33%;
			border-right: 1px solid #EEEEEE;
				text{
					display: block;
				}
				text:first-child{
					font-weight: 600;
					font-size: 18px;
					color: #333333;
				}
				text:last-child{
					font-size: 10px;
					color: #999999;
				}
			}
	}
	.card{
		background: #FFFFFF;
		border-radius: 5px 5px 5px 5px;
		margin: 10px;
		background-image: url("/static/card.png");
		background-size: 100% 100%;
		border-top: 1px solid;
		border-image: linear-gradient(270deg, rgba(45, 217, 255, 0), rgba(45, 217, 255, 1), rgba(45, 217, 255, 0)) 1 1;
		
		.card-title{
			text:first-child{
				font-weight: 600;
				font-size: 16px;
				color: #333333;
			}
			text:last-child{
				font-size: 12px;
				color: #666666;
			}
		}
		.card-con{
			padding: 10px 0;
			view{
				text-align: center;
				width: 33.33%;
				border-right: 1px solid #EEEEEE;
					text{
						display: block;
					}
					text:first-child{
						font-weight: 600;
						font-size: 18px;
						color: #333333;
						line-height: 18px;
					}
					text:last-child{
						font-size: 10px;
						color: #999999;
					}
				}
		}
		.card-footer{
			border-top: 1px solid #EEEEEE;
			line-height: 42px;
			image{
				display: inline-block; 
				width: 17px;
				height:17px;
				vertical-align: middle;
				margin-right: 8px;
			}
			text{
				width: 49%;
				text-align: center;
				line-height: 40px;
				font-size: 16px;
				color: #333333;
			}
		}
	}
</style>