huazhiyu/pages/qianggou/qianggou.vue

<template>
<view class="qianggou">
	<view class="banner">
		<u-swiper :circular="true" :list="swiperList" :autoplay="true"></u-swiper>
		
	</view>
	<view class="notice">
		<u-notice-bar :text="text1" :direction="'column'" @click="jump" :mode="'link'" bgColor="transparent" color="#4D9A5E"></u-notice-bar>
	</view>
	<view class="qgList">
		<view v-if="showList">
			<view class="qgItem" v-for="(item,index) in list" :key="index" @click="goProductList(item)">
				<image :src="baseUrl+item.image" class="bgPic" mode="aspectFill"></image>
				<view class="qgInfo">
					<view class="conpany">
						<view class="line"></view>
						<view class="text">
							{{item.title}}
						</view>
						<view class="line"></view>
					</view>
					<view class="time">
						开放时间：{{item.status!='normal'?'待开放':item.start+'-'+item.end}}
					</view>
				</view>
				
			</view>
			<view class="gobottom">
				--我也是有底线的--
			</view>
		</view>
		<view v-if="!showList">
			<view class="istruction">
				请使用绑定银行姓名签名
			</view>
			<view class="xieyi" @click="show=true">
				阅读用户协议并签名
			</view>
		</view>
		
	</view>
	<u-toast ref="uToast"></u-toast>
	<u-popup :show="show" mode="bottom"  @close="close" round="10" >
		<view style="padding:24rpx;max-height:calc(60vh);overflow: auto;">
			<u-parse :content="content" style="margin-top:45px;"></u-parse>
		</view>
		<view class="sign" @click="goSign">
			签名
		</view>
	</u-popup>
	<!-- tabbar -->
	<TabBar :tabBarShow="1"></TabBar>
</view>
</template>

<script>
import {getWarehouseList,getUserInfo,privacyPolicy} from '@/common/api.js'
import TabBar from '../../components/TabBar/TabBar.vue';
export default{
	components:{
		TabBar,
		
	},
	data(){
		return{
			swiperList:[
				'/static/image/banner1.png',
				'/static/image/banner2.png',
				'/static/image/banner3.png'
			],
			text1:[
				'用户隐私协议','用户注册协议','委托托管协议','用户须知','C2C个人支付风险提示'
			],
			list:[],
			showList:true,
			show:false,
			content:'',
			userInfo: {},
		}
	},
	methods:{
		close() {
			this.show = false
		},
		getText(){
			privacyPolicy({id:3}).then(res=>{
				this.content = res.data.content
			})
		},
		//获取用户信息
		getUserInfoHandle(){
			getUserInfo().then(res=>{
				this.userInfo = res.data;
				if(!res.data.sign_image||res.data.sign_status==0){
					this.showList = false
				}else{
					this.showList = true;
					this.getWarehouseList()
				}
			
			})
		},
		goSign(){
				uni.navigateTo({
					url:"/pages/home/sign"
				})
		},
		jump(val){
			console.log("7777",val)
			let id=null;
			switch (val){
				case 0:
					id=2;
					break;
				case 1:
					id=1;
					break;
				case 2:
					id=4;
					break;
				case 3:
					id=3;
					break;
				case 4:
					id=5;
					break;
			}
			uni.navigateTo({
				url:`/pages/my/richText?id=${id}`
			})
		},
		getWarehouseList(){
			getWarehouseList().then(res=>{
				console.log(res,)
				this.list = res.data;
			})
		},
		goProductList(item){
			if(item.status=="normal"){
				if(item.is_allow_access==0){
					this.$refs.uToast.show({
						message:'未到抢购时间'
					})
				}else{
					if(this.userInfo.sign_status !== 1){
						this.$refs.uToast.show({
							message:'请先完成签约'
						})
						return false
					}
					uni.navigateTo({
						url:'/pages/qianggou/productList?id='+item.id
					})
				}
			}else{
				this.$refs.uToast.show({
					message:item.title+'等待开放'
				})
				return;
			}
		}
	},
	onShow(){
		
		this.getUserInfoHandle()
		this.show = false
	},
	onLoad() {
		this.getText()
	},
	onReady() {
		uni.hideTabBar();
		// #ifdef MP
		uni.setNavigationBarTitle({
			title: '首页',
		})
		uni.setNavigationBarColor({
			frontColor: '#ffffff',
			backgroundColor: 'rgb(221, 190, 127)',
		})
		// #endif
	},
}
</script>

<style lang="scss" scoped>
.qianggou{
	padding:24rpx;
	.banner{
		height: 260rpx;
		margin-bottom: 10rpx;
		// margin: -200rpx auto 20rpx;
		border-radius: 10rpx;
		overflow: hidden;
		.u-swiper{
			background-color: #fff !important;
		}
	}
	.qgList{
		.qgItem{
			height:286rpx;
			width: 100%;
			position: relative;
			overflow: hidden;
			margin-bottom:20rpx;
			.bgPic{
				width:100%;
			}
			.qgInfo{
				position: absolute;
				top: 0;
				right: 0;
				bottom: 0;
				left: 0;
				height: 100%;
				width: 100%;
				text-align: center;
				background: rgba(0,0,0,.6);
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				z-index:99;
				.conpany{
					display: flex;
					align-items: center;
					color: rgb(193, 193, 193);;
					.line{
						height:4rpx;
						width:100rpx;
						background-color: rgb(193, 193, 193);;
					}
					.text{
						font-size: 30rpx;
						color: rgb(193, 193, 193);
						margin:0 10rpx;
					}
				}
				.time{
					font-size: 38rpx;
					color: #fff;
					margin-top: 26px;
				}
			}
			
		}
	}
}
.gobottom{
	color: rgba(165, 165, 165, 0.5);
	font-size: 30rpx;
	margin-top:20rpx;
	text-align: center;
}
.istruction{
	text-align: center;
	color:#9f751f;
	margin-top:80rpx;
}
.xieyi{
	border:1px solid $base;
	color:$base;
	border-radius: 10rpx;
	width:40%;
	text-align: center;
	margin:30rpx auto;
	padding:10rpx 0;
}
.sign{
	border:1px solid $base;
	color:$base;
	border-radius: 10rpx;
	width:40%;
	text-align: center;
	margin:30rpx auto;
	padding:10rpx 0;
}
</style>