myjtp/pages/apply/choose.vue

<template>
	<view class="">
		<view class="alertBox">
			<image class="titleImg" src="@/static/img/alertbg2.png" mode="widthFix"></image>
			<image :src="img" class="logo"></image>
			<view class="hed"></view>
			<view class="lxTtem flex" @click="type = 1">
				<view class="leftTitle flex">
					<image class="leftImgTip" src="@/static/img/bp2.png" mode="heightFix"></image>
					<text>个人会员</text>
				</view>
				<view class="rightTip flex"><view v-if="type == 1" class="xzTip"></view></view>
			</view>
			<view class="lxTtem flex" @click="type = 2">
				<view class="leftTitle flex">
					<image class="leftImgTip" src="@/static/img/bp1.png" mode="heightFix"></image>
					<text>企业会员</text>
				</view>
				<view class="rightTip flex"><view v-if="type == 2" class="xzTip"></view></view>
			</view>
			<view class="pushtyle" @click="submit">确认</view>
		</view>
		<view class="content" id="content"></view>
	</view>
</template>

<script>
import { shareLoad } from '../../utils/wxAuthorized.js'
import { getIndex } from '../../api/apply.js'
import { getUserInfo } from '../../api/login.js'
import {
		mapState,
	} from 'vuex';
export default {
	data() {
		return {
			type: 1,
			img: require('@/static/img/logo.png'),
		}
	},
	computed: {
		...mapState(['baseURL'])
	},
	mounted() {
		this.getContent()
	},
	onShow() {
		
	},
	onLoad() {
		this.share()
	},
	methods: {
		getContent() {
			getIndex().then(res => {
				const content = document.getElementById("content");
				console.log(res.data)
				content.innerHTML = res.data.content
			})
		},
		submit() {
			uni.navigateTo({
				url: '/pages/apply/information?type=' + this.type
			})
		},
		// 分享
		share() {
			const pages = getCurrentPages()
			const path = pages[pages.length - 1].route
			const baseURL = this.baseURL;
			const data = {
				link: window.location.href, // 分享链接
				imgUrl: `${baseURL}/index/static/img/logo.f387ae76.png`,
				desc: '母婴健康专委会会员申请表',
				title: '母婴健康专委会会员申请表',
				fail:function (e) {
					console.log(e);
				}
			}
			shareLoad(data)
		}
	}
}
</script>

<style lang="scss" scoped>
	page {
		height: 100%;
	}
.alertBox {
	background-color: #fff;
	width: 80%;
	margin: auto auto;
	border-radius: 30rpx;
	padding-bottom: 40rpx;
	position: relative;
	top: 100rpx;
	.titleImg {
		width: 100%;
		z-index: 99;
		position: absolute;
		top: 0;
	}
	.logo {
		width: 130rpx;
		height: 130rpx;
		position: absolute;
		top: 100rpx;
		left: calc(50% - 60rpx);
	}
	.hed {
		height: 230rpx;
	}
	.title {
		text-align: center;
		font-size: 36rpx;
		font-weight: bold;
		color: #333333;
		margin-top: -80rpx;
	}
	.titleTip {
		text-align: center;
		font-size: 24rpx;
		font-weight: bold;
		color: #808080;
	}
	.lxTtem {
		margin: 0 40rpx;
		padding: 30rpx 0;
		border-bottom: 1px solid #ebebeb;
		.leftTitle {
			justify-content: start;
			width: 43rpx;
			flex-grow: 1;
			color: #333333;
			font-size: 28rpx;
			.leftImgTip {
				flex-shrink: 0;
				// width: 30rpx;
				height: 30rpx;
				margin-right: 20rpx;
			}
		}
		.rightTip {
			border: 1px solid #006eeb;
			opacity: 0.5;
			border-radius: 50%;
			width: 32rpx;
			height: 32rpx;
			justify-content: center;
			.xzTip {
				width: 20rpx;
				height: 20rpx;
				border-radius: 99rpx;
				background-color: #006eeb;
			}
		}
	}
	.pushtyle {
		background-color: #3b66f5;
		border-radius: 10rpx;
		color: #ffffff;
		font-size: 28rpx;
		font-weight: bold;
		text-align: center;
		padding: 20rpx 0;
		margin: 0 40rpx;
		margin-top: 40rpx;
	}
}
.content {
	// background-color: ;
	position: relative;
	top: 150rpx;
	padding: 0 10%;
	font-size: 28rpx;
	color: #303133;
	line-height: 45rpx;
}
</style>