王明 / Recruitment

<template>
	<view @click="isMore = false">
		<view class="goods-head" :style="'background:rgba(255,255,255,' + PageScrollTop / 100 + ')'">
			<!-- 返回 -->
			<view class="back" @click="onBack">
				<view class="back-one" :class="{ action: PageScrollTop > 120 }">
					<image src="../../static/left.png"></image>
				</view>
			</view>
			<view class="head-title">{{data.name}}</view>
			<!-- tab切换 -->
		</view>
		<!-- banner，标题 -->
		<view class="banner-title">
			<!-- banner -->
			<view class="banner">
				<swiper class="screen-swiper round-dot" indicator-dots="true" circular="true" autoplay="true"
					interval="5000" duration="500">
					<swiper-item v-for="(item, index) in data.background" :key="index">
						<image :src="BASE_URL+item.url" mode="aspectFill"></image>
					</swiper-item>
				</swiper>
			</view>
		</view>
		<!-- 评价 -->
		<view class="evaluate-data" ref="evaluate">
			<view class="title-more">
				<view class="title">
					<text>简介</text>
				</view>
			</view>
			<view class="evaluate-list">
				<view class="content">
					<view class="character">
						<text>{{data.synopsis}}</text>
					</view>
				</view>
			</view>
			<view class="evaluate-list-line"></view>
			<view class="title-more">
				<view class="title">
					<text>前景</text>
				</view>
			</view>
			<view class="evaluate-list">
				<view class="content">
					<view class="character">
						<text>{{data.prospect}}</text>
					</view>
				</view>
			</view>
			<view class="evaluate-list-line"></view>
			<view class="title-more">
				<view class="title">
					<text>就业方向</text>
				</view>
			</view>
			<view class="evaluate-list">
				<view class="content">
					<view class="character" v-html="data.direction">
					</view>
				</view>
			</view>
		</view>
		<!-- 商品介绍 -->
		<view class="products-introduction" ref="products">
			<view class="content">
				<img v-for="item in data.image" :src="BASE_URL+item.url" />
			</view>
		</view>
		<view class="evaluate-data" ref="evaluate">
			<view class="title-more">
				<view class="title">
					<text>备注说明</text>
				</view>
			</view>
			<view class="evaluate-list">
				<view class="content">
					<view class="character">
						<text>{{data.remark}}</text>
					</view>
				</view>
			</view>
		</view>
		<view class="my-phone">
			<view>客服电话：654564</view>
			<view>彭州市人社局监督电话：541516</view>
			<view>备案号：6556121212</view>
		</view>
		<!-- 底部 -->
		<view class="page-footer">
			<view class="footer-fn">
				<view class="list">
					<text>培训费用：</text>
					<text class="list-red">￥{{data.trainCost}}</text>
				</view>
				<view class="list">
					<text>报名费用：</text>
					<text class="list-red">￥{{data.applyCost}}</text>
				</view>
			</view>
			<view class="footer-buy">
				<view class="buy-at" @click="ApplyT">
					<text>立即报名</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
		import BASE_URL from '@/common/config.js'
	export default {
		components: {
		},
		data() {
			return {
				BASE_URL,
				TabShow: 0,
				isMore: false,
				AttentionShow: 0,
				PageScrollTop: 0,
				type: 0,
				id:0,
				data:{}
			};
		},
		onLoad(params) {
			this.id = params.id;
			console.log(params);
			this.GettbtraininfoById();
		},
		onPageScroll(e) {
			this.PageScrollTop = e.scrollTop;
		},
		methods: {
			ApplyT(){
				this.API.ApplyT(this.id).then(res=>{
					if(res.code==200){
						uni.showToast({
							title: '报名成功，请等待联系！',
							icon: 'none'
						});
					}
				});
			},
			GettbtraininfoById() {
				this.API.GettbtraininfoById(this.id).then(res => {
					if (res.code == 200) {
						this.data = res.data;
						this.data.image = JSON.parse(res.data.image);
						this.data.background = JSON.parse(res.data.background);
						console.log(this.data);
					}
				})
			},
			/**
			 * 返回
			 */
			onBack() {
				uni.navigateBack();
			},
			/**
			 * tab
			 */
			onTab(type) {
				this.TabShow = type;
				switch (type) {
					case 0:
						uni.pageScrollTo({
							scrollTop: 0,
							duration: 300
						});
						break;
					case 1:
						uni.createSelectorQuery().select(".evaluate-data").boundingClientRect((data) => { //data - 各种参数
							uni.pageScrollTo({
								scrollTop: this.PageScrollTop + data.top - 50,
								duration: 300
							});
						}).exec()
						break;
					case 2:
						uni.createSelectorQuery().select(".products-introduction").boundingClientRect((
						data) => { //data - 各种参数
							uni.pageScrollTo({
								scrollTop: this.PageScrollTop + data.top - 50,
								duration: 300
							});
						}).exec()
						break;
				}
			},
			/**
			 * 去购物车
			 */
			onToCart() {
				uni.switchTab({
					url: '/pages/cart/cart'
				})
			},
			/**
			 * 降价通知点击
			 */
			onDepreciate() {
				uni.showToast({
					title: '降价通知提醒成功',
					icon: 'success'
				})
			},
			/**
			 * 关注点击
			 */
			onAttention() {
				if (this.AttentionShow === 0) {
					this.AttentionShow = 1;
					uni.showToast({
						title: '关注成功',
						icon: 'none'
					})
				} else {
					this.AttentionShow = 0;
					uni.showToast({
						title: '取消成功',
						icon: 'none'
					})
				}

			},
			/**
			 * 评价点击
			 */
			onEvaluate() {
				uni.navigateTo({
					url: '/pages/GoodsEvaluateList/GoodsEvaluateList'
				})
			}
		}
	};
</script>

<style scoped lang="scss">
	@import 'GoodsDetails.scss';
</style>