Delivery-merchant/pages/Review.vue

<template>
	<view>
		<!-- <titlenav>提交成功</titlenav> -->
		<view class="review">
			<image class="img" :src="img"></image>
			<image v-if="status === 'fail'" class="img" :src="img2"></image>
			<view class="content">
				<view class="text1">{{ title }}</view>
				<view v-if="status === 'fail'" class="text1">{{ title2 }}</view>
				<view class="text2">{{ desc }}</view>
				<view v-if="status === 'fail'" class="text2">{{ desc2 }}</view>
				<template v-if="status === 'CREATED'">
					<u-button type="primary" block @click="navigateBack()">返回</u-button>
				</template>
				<template v-if="status === 'fail'">
					<u-button type="primary" block>再次申请</u-button>
					<view class="jump">返回</view>
				</template>
				<view class="service">
					客服电话 025-86868686
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import { mapState } from 'vuex';
import Titlenav from '../components/Titlenav.vue';
export default {
	components: { Titlenav },
	data() {
		return {
			status: 'CREATED'
		};
	},
	computed: {
		...mapState(['systemInfo']),
		img() {
			const imgs = [
				'https://ticket-exchange.oss-cn-hangzhou.aliyuncs.com/image/2021-09-26-16-06-21zVxTacze.png',
				'https://ticket-exchange.oss-cn-hangzhou.aliyuncs.com/image/2021-09-26-16-06-37vPVQLmbQ.png'
			];
			return imgs[this.status === 'CREATED' ? 0 : 1];
		},
		img2() {
			const imgs = [
				'https://ticket-exchange.oss-cn-hangzhou.aliyuncs.com/image/2021-09-26-16-18-59TpOakNXi.png'
			];
			return imgs
		},
		title() {
			const list = ['提交成功', '申请已通过'];
			return list[this.status === 'CREATED' ? 0 : 1];
		},
		title2() {
			const list = '提现申请未通过'
			return list
		},
		desc() {
			const list = ['您已成功申请提现服务，待审核成功后钱款将在72小时内提现到您的账户，请注意查收', '您已申请的提现服务已通过审核，钱款将在72小时内提现到您的账户，请注意查收'];
			return list[this.status === 'CREATED' ? 0 : 1];
		},
		desc2() {
			const list = '您已申请的提现服务未通过审核，请检账号或姓名是否输入正确'
			return list
		}
	},
	methods: {
		// loginMethods() {
		// }
		// back() {
		//     wx.redirectTo({
		//         url: '/pages/store/apply'
		//     });
		// }
	}
};
</script>

<style lang="scss" scoped>
	/deep/ .u-btn{
		font-size: 16px;
		margin: 0 10px;
		height: 48px;
		background: #214BBE;
		border-radius: 4px;
	}
.review {
	display: flex;
	flex-direction: column;
	padding: 50px 32px 100px;
	.img {
		width: 103px;
		height: 78px;
		margin: 0 auto;
	}
	.content {
		display: flex;
		flex-direction: column;
		text-align: center;

		.text1 {
			font-size: 20px;
			color: #000000;
			font-weight: bold;
			margin-top: 30px;
		}

		.text2 {
			font-size: 14px;
			color: #939599;
			line-height: 24px;
			padding: 16px 0 60px;
		}
		.jump{
			height: 48px;
			background: #F2F4F5;
			font-size: 16px;
			font-weight: bold;
			color: #000000;
			line-height: 48px;
			text-align: center;
			border-radius: 4px;
			margin: 20px 10px 0;
		}
		.service{
			font-size: 13px;
			font-weight: 400;
			color: #AAACAD;
			line-height: 18px;
			margin-top: 196px;
		}
	}
}
</style>