platformFront/src/components/user/UserSetting.vue

<template>
	<div>
		<MiniTitle>
			<div slot="mini" class="miniTit">账号认证</div>
		</MiniTitle>
	<div class="userSetting">
		<h4>账号安全</h4>
		<div class="leftCon">
			<el-radio v-model="radio" label="1" class="radio">登录密码</el-radio>
			<p class="text">安全性高的密码可以使账号更安全。建议您定期更换密码，设置一个包含字母，符号或数字中至少两项且长度超过6位的密码</p>
		</div>
		<div class="rigCon">
			<el-radio v-model="radio2" label="1" class="radio2">已设置</el-radio><span class="changeTxt" @click="changeText()">修改</span>
		</div>
	</div>
	</div>
</template>

<script>
	import MiniTitle from '../common/MiniTile.vue'
	export default {
		name: 'user-information',
		components: {
			MiniTitle
		},
		data: function() {
			return {
				radio: '',
				radio2: ''
			}
		},
		methods: {
			changeText() {
				this.$router.push({
					path: '/forgetPassword'
				});
			}
		}
	}
</script>

<style lang="less">
	.miniTit {
		margin-left: 20px;
		font-weight: bold;
	}
	.userSetting {
		margin-left: 20px !important;
		margin-top: 20px !important;
		background: #fff;
		height: 150px;
		margin-right: 20px !important;

		h4 {
			font-size: 14px;
			padding-top: 20px;
			margin-left: 30px;
			padding-bottom: 20px;
		}

		.el-radio__label {
			font-size: 12px !important;
		}

		.el-radio {
			cursor: auto;
		}

		.el-radio__inner {
			cursor: auto;
		}
    .el-radio__input{
			cursor: auto;
		}
		.el-radio__inner:hover {
			border-color: #9b9b9b;
		}

		.el-radio__input.is-checked .el-radio__inner {
			border-color: #9b9b9b;
			background: #fff;
		}

		.el-radio__input.is-checked+.el-radio__label {
			color: #606266;
		}

		.leftCon {
			float: left;
			background: #fff;
			margin-left: 30px;

			.radio {
				margin-bottom: 15px;
			}

			.text {
				font-size: 12px;
				margin-left: 24px;
				color: #606266;
			}
		}

		.rigCon {
			float: right;
			margin-right: 30px;
			font-size: 12px;
			color: #606266;

			.radio2 {
				margin-right: 30px;
			}

			.changeTxt {
				cursor: pointer;

				&:hover {
					color: #409EFF;
				}
			}
		}
	}
</style>