1

src/views/setting/logoffvue

@@ -0,0 +1,158 @@
+<template>
+	<div class="logoff">
+		<div class="logo flex align-center justify-center">
+			<el-icon :size="60" color="#00DD9A">
+				<WarningFilled />
+			</el-icon>
+		</div>
+		<div class="title">
+			注销亿职赞服务
+		</div>
+		<div class="titles">
+			亿职赞服务注销后，您将放弃以下权益且无法找回
+		</div>
+		<div class="xieyi">
+			<div class="xieyi-item">
+				·您将无法通过该账号登录、使用亿职赞平台
+			</div>
+			<div class="xieyi-item">
+				·您将无法访问账号的个人信息（包括账号、昵称、头像等）
+			</div>
+			<div class="xieyi-item">
+				·您账号的所有权益，将视为主动放弃
+			</div>
+		</div>
+		<div class="tongyi">
+			点击【确认注销】即代表您已同意<span @click="dialogAgreements = true">《用户注销协议》</span>
+		</div>
+		<div class="btn flex align-center justify-center">
+			<el-button style="width: 400px;" size="large" @click="logOff()" type="primary">确认注销</el-button>
+		</div>
+		<!-- 协议弹窗 -->
+		<agreement :title="title" v-if="dialogAgreements" :dialogAgreements="dialogAgreements" :typeid="typeid"
+			@closeAgree="closeAgree" />
+	</div>
+</template>
+
+<script>
+	import {
+		ElMessageBox,
+		ElMessage,
+	} from 'element-plus'
+	import agreement from '../../components/agreement/agreement.vue'
+	export default {
+		components: {
+			agreement
+		},
+		data() {
+			return {
+				screenHeight: 0,
+				dialogAgreements: false,
+				title: '用户注销协议',
+				typeid: '343',
+			}
+		},
+		mounted() {
+			this.screenHeight = window.innerHeight
+		},
+		methods: {
+			//注销账号
+			logOff() {
+				ElMessageBox.confirm(
+					'确认注销后，您将退出登录，并清除所有数据',
+					'提示', {
+						confirmButtonText: '确认注销',
+						cancelButtonText: '我在想想想',
+						type: 'warning',
+					}
+				).then(() => {
+					let data = {
+						state: 8,
+					}
+					this.$Request.post('/app/user/logout', data, {
+						type: 'json'
+					}).then(res => {
+						if (res.code == 0) {
+							ElMessage({
+								message: '提交成功',
+								type: 'success',
+								duration: 1500,
+								offset: this.screenHeight / 2
+							})
+							localStorage.removeItem('token');
+							localStorage.removeItem('userId');
+							localStorage.removeItem('userType')
+							// 调用重置状态的函数  
+							this.$store.dispatch('SET_DATA');
+							this.$router.push({
+								name: 'login'
+							})
+						} else {
+							ElMessage({
+								message: res.msg,
+								type: 'error',
+								duration: 1500,
+								offset: this.screenHeight / 2
+							})
+						}
+					})
+				}).catch(() => {})
+			},
+			closeAgree(data) {
+				this.dialogAgreements = data
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.logo {
+		width: 100%;
+	}
+
+	.title {
+		width: 100%;
+		text-align: center;
+		font-size: 28px;
+		font-weight: bold;
+		margin-top: 20px;
+	}
+
+	.titles {
+		width: 100%;
+		text-align: center;
+		margin-top: 10px;
+		color: #999999;
+	}
+
+	.xieyi {
+		width: fit-content;
+		padding: 10px 20px 20px 20px;
+		background-color: #f5f5f5;
+		margin: 0 auto;
+		margin-top: 20px;
+		border-radius: 10px;
+
+		.xieyi-item {
+			margin-top: 10px;
+		}
+	}
+
+	.tongyi {
+		width: 100%;
+		text-align: center;
+		color: #999999;
+		margin-top: 20px;
+		font-size: 13px;
+
+		span {
+			color: #00DD9A;
+			cursor: pointer;
+		}
+	}
+
+	.btn {
+		width: 100%;
+		margin-top: 20px;
+	}
+</style>