jp-xqjy/pages/user/logout.vue

<template>
	<view>
		<u-navbar back-text="注销账号"></u-navbar>
			<view class="logout-head">
				<u-image width="100" height="100" src="/static/img/logout.png"></u-image>
				<p>注销荆州工会鹊桥帐号</p>
			</view>
			
			<view class="logout-main">
				<p>我们很遗憾您做出注销帐号的决定，在提交申请前请您仔细阅读以下内容:</p>
				<p>1.您应确保您有权决定该账户的注销事宜,不侵犯任何第三方的合法权益,如因此引发任何投诉争议,由您自行承担。</p>
				<p>2.帐号注销后您无法再使用本社区的各项服务,您的个人信息及求助记录也将被清空。</p>
				<p>3.如您已被国家机关调查或正处于诉讼、仲裁程序中,请注意，注销您的帐号并不代表此帐号注销前的帐号行为和相关责任得到豁免或减轻。</p>
			</view>
			
			<view class="logout-btn">
				<u-button :custom-style="customStyle1"><span>继续注销</span></u-button>
				<u-button type="error" :custom-style="customStyle2">我再想想</u-button>
			</view>	
		</view>
 	</view>
</template>

<script>
	export default {
		data() {
			return {
				navbarBg: {
					background: 'none'
				},
				customStyle1:{
					background: '#EFEFEF',
					color:'#eee',
					flex:'0.45',
				},
				customStyle2: {
					background: '#FF5E5E',
					flex:'0.45',
				}, 
			}

			methods: {
				
			}

		}
	}
</script>

<style lang="scss" scoped>
	.logout-head{
		height: 120px;
		background-color: #FF5E5E;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		p{
			color:#fff;
			margin-top: 5px;
			font-size: 16px;
		}
	}
	.logout-main{
		padding: 12px 24px;
		line-height: 24px;
		p{
			margin-bottom: 10px;
		}
	}
	.logout-btn{
		padding: 15px;
		display: flex;
		justify-content: space-between;
		span{
			color:#888;
		}
	}
</style>