<template>
	<view class="container">
		<!-- 图标区域 -->
		<img class="img" :src="status === '1' ? '../../static/index/success.png' : '../../static/index/fail.png'" />
		<view class="msg">{{ msg }}</view>
		<!-- 按钮区域 -->
		<view class="btn" @click="handleClickBtn">{{ btnMsg }}</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			// 投诉是否成功
			status: null,
			// 投诉状态信息
			msg: '',
			// 按钮文字信息
			btnMsg: ''
		}
	},
	onLoad(options) {
		this.status = options.status
		if (this.status === '1') {
			uni.setNavigationBarTitle({
				title: '投诉成功'
			})
			this.msg = '投诉成功'
			this.btnMsg = '查看投诉进度'
		} else {
			uni.setNavigationBarTitle({
				title: '投诉失败'
			})
			this.msg = '投诉失败'
			this.btnMsg = '返回'
		}
	},
	methods: {
		handleClickBtn() {
			if (this.status === '1') {
				uni.navigateTo({
					url: '/pages/complaintProgress/complaintProgress'
				})
			} else {
				uni.navigateBack(1)
			}
		}
	}
}
</script>

<style lang="scss" scoped>
.container {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-height: 100vh;
	background-color: #fff;

	.img {
		margin-top: 80rpx;
		width: 134rpx;
		height: 134rpx;
	}

	.msg {
		margin-top: 40rpx;
		font-size: 32rpx;
		font-weight: bold;
	}

	.btn {
		margin-top: 87rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 330rpx;
		height: 84rpx;
		color: #fff;
		font-size: 28rpx;
		border-radius: 22rpx;
		background-color: #096562;
	}
}
</style>
