monthlyIntroduce.vue

<template>
	<view class="main">
		<view class="top_bar">
			<text class="eosfont" @click="$backup">&#xe743;</text>
			包月说明
		</view>
		<view class="content_view">
			<view class="content_title">
				<text class="circle_num">1</text>包年计划是什么?
			</view>
			<view class="content_main">谛宝多多会根据医院的拿货周期与起订额给医院下发一个折扣。在包年期间，医院购买参与包年计划的商品可享受折扣。</view>
			<view class="content_title">
				<text class="circle_num">1</text>怎么参与包年计划?
			</view>
			<view class="content_main">点击下方 选择起订额，然后选择适合您的拿货周期和起订额，之后选择签署合同并缴纳押金即可。在合同有效期内，购买参与包年的产品，立享折扣。</view>
			<view class="content_title">
				<text class="circle_num">1</text>关于押金
			</view>
			<view class="content_main">在合同有效期内，包年产品消费总额(折扣价)达到起订额， 自合同结束日期5个工作日内，全额退还押金到您的账户余额，如果没有达到起订额，押金不予以退还。</view>
			<view class="content_title">
				<text class="circle_num">1</text>缴纳押金与不缴纳押金的区别
			</view>
			<view class="content_main">缴纳押金：合同有效期内购买参与包年计划的产品可立享对应的折扣；不缴纳押金：在合同有效期内购买参与包年计划的产品，根据包年产品消费总额(原价) 达到签定的起订额，自合同结束日期5个工作日内，按差价返现至账户余额，可提现。 (例如起订额对应折扣为7折，则返现消费总额的30%)，反之不予以返现。
有任何问题烦请点击页面上的消息按钮进行咨询</view>
			<view class="content_title" style="margin-bottom: 0;">有任何问题</view>
			<view class="content_title">烦请点击页面上的消息按钮进行咨询</view>
			<view class="join_btn" @click="joinMonthly">加入包年计划</view>
		</view>
	</view>
</template>

<script>
	import { login } from '@/common/util.js';
	export default {
		data() {
			return {
				login_flg: 0
			}
		},
		onLoad(options) {
			this.login_flg = options.login_flg - 0;
		},
		methods: {
			// 加入计划
			joinMonthly() {
				if(!this.login_flg) {
					login();
					return
				}
				this.$jump('/pages/monthlyJoin/monthlyJoin',2)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.main {
		background-color: #FFFCF6;
		.top_bar {
			height: 80rpx;
			line-height: 80rpx;
			text-align: center;
			background:linear-gradient(135deg,rgba(255,232,199,1) 0%,rgba(214,163,93,1) 100%);
			border-radius: 0 0 24rpx 24rpx;
			position: fixed;
			width: 100%;
			box-sizing: border-box;
			.eosfont {
				font-size: 56rpx;
				position: absolute;
				left: 20rpx;
				top: 2rpx;
			}
		}
		.content_view {
			padding: 130rpx 40rpx 134rpx;
			.content_title {
				margin-bottom: 20rpx;
				font-size: 32rpx;
				font-family:PingFangSC-Medium,PingFang SC;
				font-weight:500;
				height: 44rpx;
				line-height: 44rpx;
				display: flex;
				align-items: center;
				.circle_num {
					width: 28rpx;
					height: 28rpx;
					border-radius: 50%;
					background-color: #DCAD6C;
					color: #fff;
					line-height: 28rpx;
					text-align: center;
					font-size: 22rpx;
					display: inline-block;
					margin-right: 10rpx;
				}
			}
		}
		.content_main {
			font-size: 28rpx;
			color: #807B74;
			line-height: 40rpx;
			margin-bottom: 30rpx;
		}
		.join_btn {
			height: 88rpx;
			line-height: 88rpx;
			background:linear-gradient(314deg,rgba(238,190,114,1) 0%,rgba(255,224,176,1) 100%);
			box-shadow:0px 4rpx 40rpx 0px rgba(242,199,130,0.5);
			border-radius: 20rpx;
			text-align: center;
			font-size: 32rpx;
			position: fixed;
			left: 24rpx;
			bottom: 24rpx;
			width: 702rpx;
		}
	}
</style>