zy-wcs-master.git

			@@ -1,172 +1,282 @@
			<!DOCTYPE html>
			<html lang="en">
			<html lang="zh-CN">
			<head>
			<meta charset="UTF-8">
			<title></title>
			<title>设置我的资料</title>
			<meta name="renderer" content="webkit">
			<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
			<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
			<link rel="stylesheet" href="../static/layui/css/layui.css" media="all">
			<script type="text/javascript" src="../static/js/common.js?v=20260309_i18n_fix1"></script>
			<link rel="stylesheet" href="../static/vue/element/element.css">
			<link rel="stylesheet" href="../static/css/cool.css">
			<style>
			:root {
			--card-bg: rgba(255, 255, 255, 0.96);
			--card-border: rgba(216, 226, 238, 0.96);
			--text-main: #243447;
			}

			[v-cloak] {
			display: none;
			}

			html,
			body {
			background-color: #fff;
			margin: 0;
			min-height: 100%;
			color: var(--text-main);
			font-family: "Avenir Next", "PingFang SC", "Microsoft YaHei", sans-serif;
			background: #f5f7fb;
			}
			#container {
			padding: 15px;
			margin-top: 15px

			.page-shell {
			padding: 14px 16px;
			box-sizing: border-box;
			}
			.layui-card-body {
			padding: 20px 15px 5px 15px;

			.card-shell {
			max-width: 860px;
			margin: 0 auto;
			border-radius: 16px;
			border: 1px solid var(--card-border);
			background: var(--card-bg);
			box-shadow: 0 8px 20px rgba(44, 67, 96, 0.05);
			overflow: hidden;
			}
			.layui-form-item {
			margin-bottom: 18px;

			.card-head {
			padding: 16px 20px 12px;
			border-bottom: 1px solid rgba(222, 230, 239, 0.92);
			background: #f8fbff;
			}
			.layui-form-label {
			color: #999!important;;
			width: 60px;

			.card-title {
			font-size: 16px;
			font-weight: 700;
			color: var(--text-main);
			}
			.layui-input-block {
			margin-left: 90px;

			.card-body {
			padding: 18px 20px 16px;
			}
			#update-password {
			padding: 0 20px 0 15px;

			.form-shell {
			max-width: 740px;
			margin: 0 auto;
			}
			.layui-btn .layui-icon {
			margin-right: 0;

			.profile-form .el-form-item {
			margin-bottom: 14px;
			}

			.profile-form .el-form-item__label {
			font-weight: 600;
			color: #5c6f82;
			}

			.profile-form .el-input__inner,
			.profile-form .el-button {
			height: 34px;
			line-height: 34px;
			}

			.profile-form .el-button {
			display: inline-flex;
			align-items: center;
			justify-content: center;
			padding: 0 16px;
			vertical-align: middle;
			}

			.profile-form .el-button [class^="el-icon-"],
			.profile-form .el-button [class*=" el-icon-"] {
			line-height: 1;
			margin-right: 6px;
			}

			.password-row {
			display: flex;
			align-items: center;
			gap: 10px;
			}

			.password-mask {
			width: 100%;
			}

			.password-row .el-button {
			min-width: 118px;
			flex: 0 0 118px;
			}

			.footer-bar {
			display: flex;
			justify-content: flex-end;
			padding-top: 4px;
			}

			.footer-bar .el-button {
			min-width: 118px;
			}

			.password-dialog .el-dialog {
			border-radius: 18px;
			overflow: hidden;
			}

			.password-dialog .el-dialog__header {
			padding: 18px 20px 12px;
			border-bottom: 1px solid rgba(222, 230, 239, 0.92);
			background: #f8fbff;
			}

			.password-dialog .el-dialog__title {
			font-weight: 700;
			color: var(--text-main);
			}

			.password-dialog .el-dialog__body {
			padding: 18px 20px 12px;
			}

			.password-form .el-form-item {
			margin-bottom: 16px;
			}

			.password-form .el-form-item__label {
			font-weight: 600;
			color: #5c6f82;
			white-space: nowrap;
			}

			.password-form .el-input__inner,
			.password-form .el-button {
			height: 34px;
			line-height: 34px;
			}

			.password-form .el-button {
			display: inline-flex;
			align-items: center;
			justify-content: center;
			min-width: 120px;
			padding: 0 18px;
			}

			.password-footer {
			display: flex;
			justify-content: center;
			gap: 12px;
			padding-top: 4px;
			}

			@media (max-width: 768px) {
			.page-shell {
			padding: 10px;
			}

			.password-row {
			flex-direction: column;
			align-items: stretch;
			}

			.form-shell {
			max-width: none;
			}
			}
			</style>
			</head>
			<body id="body">
			<div id="container">
			<fieldset class="layui-elem-field">
			<legend>设置我的资料</legend>
			<div class="layui-card-body">
			<div id="person-detail" class="layui-form">
			<div class="layui-form-item" style="display: none">
			<label class="layui-form-label">编号</label>
			<div class="layui-input-inline">
			<input id="id" class="layui-input" type="text" placeholder="请输入" autocomplete="off">
			<body>
			<div id="app" class="page-shell" v-cloak>
			<section class="card-shell">
			<div class="card-head">
			<div class="card-title">设置我的资料</div>
			</div>
			<div class="card-body">
			<div class="form-shell">
			<input id="id" type="hidden" v-model="form.id">
			<input id="password" type="hidden" v-model="form.password">
			<el-form
			ref="profileForm"
			class="profile-form"
			:model="form"
			:rules="rules"
			label-width="78px"
			size="small"
			@submit.native.prevent>
			<el-row :gutter="16">
			<el-col :xs="24" :sm="12">
			<el-form-item label="角色">
			<el-input id="roleName" v-model="form.roleName" disabled></el-input>
			</el-form-item>
			</el-col>
			<el-col :xs="24" :sm="12">
			<el-form-item label="注册时间">
			<el-input v-model="form.createTime$" disabled></el-input>
			</el-form-item>
			</el-col>
			<el-col :xs="24" :sm="12">
			<el-form-item label="名称" prop="username">
			<el-input id="username" v-model.trim="form.username" maxlength="50" clearable placeholder="请输入"></el-input>
			</el-form-item>
			</el-col>
			<el-col :xs="24" :sm="12">
			<el-form-item label="账号" prop="mobile">
			<el-input id="mobile" v-model.trim="form.mobile" maxlength="50" clearable placeholder="请输入"></el-input>
			</el-form-item>
			</el-col>
			<el-col :xs="24">
			<el-form-item label="密码">
			<div class="password-row">
			<el-input class="password-mask" value="已设置密码" disabled></el-input>
			<el-button type="primary" plain icon="el-icon-lock" @click="openPasswordDialog">修改密码</el-button>
			</div>
			</el-form-item>
			</el-col>
			</el-row>
			<div class="footer-bar">
			<el-button type="primary" :loading="saving" @click="handleSave">确认修改</el-button>
			</div>
			</div>
			<div class="layui-form-item">
			<label class="layui-form-label">角色</label>
			<div class="layui-input-inline">
			<input id="roleName" class="layui-input" type="text" placeholder="请输入" autocomplete="off" disabled="disabled">
			</div>
			<div class="layui-form-mid layui-word-aux">当前角色不可更改为其它角色</div>
			</div>
			<div class="layui-form-item">
			<label class="layui-form-label">名称</label>
			<div class="layui-input-inline">
			<input id="username" class="layui-input" type="text" placeholder="请输入" autocomplete="off">
			</div>
			</div>
			<div class="layui-form-item">
			<label class="layui-form-label">账号</label>
			<div class="layui-input-inline">
			<input id="mobile" class="layui-input" type="text" placeholder="请输入" autocomplete="off">
			</div>
			<div class="layui-form-mid layui-word-aux">重要！一般用于后台登入</div>
			</div>
			<div class="layui-form-item">
			<label class="layui-form-label">密码</label>
			<div class="layui-input-inline">
			<input id="password" class="layui-input" type="text" placeholder="请输入" autocomplete="off" style="display: none">
			<button id="update-password" class="layui-btn layui-btn-primary">
			<i class="layui-icon"></i>
			修改密码
			</button>
			</div>
			</div>
			<div class="layui-form-item">
			<label class="layui-form-label">注册时间</label>
			<div class="layui-input-inline">
			<input id="createTime$" class="layui-input" type="text" placeholder="请输入" autocomplete="off" disabled="disabled">
			</div>
			<div class="layui-form-mid layui-word-aux">不可修改</div>
			</div>
			<div class="layui-form-item">
			<div class="layui-input-block">
			<button type="button" class="layui-btn layui-btn-normal" lay-submit lay-filter="save">确认修改</button>
			</div>
			</div>
			</el-form>
			</div>
			</div>
			</fieldset>
			</section>

			<el-dialog
			class="password-dialog"
			title="修改密码"
			:visible.sync="passwordDialogVisible"
			width="420px"
			:close-on-click-modal="false"
			append-to-body>
			<el-form
			ref="passwordForm"
			class="password-form"
			:model="passwordForm"
			:rules="passwordRules"
			label-width="112px"
			size="small"
			@submit.native.prevent>
			<el-form-item label="当前密码" prop="oldPassword">
			<el-input v-model="passwordForm.oldPassword" type="password" show-password autocomplete="off"></el-input>
			</el-form-item>
			<el-form-item label="新密码" prop="password">
			<el-input v-model="passwordForm.password" type="password" show-password autocomplete="off"></el-input>
			</el-form-item>
			<el-form-item label="确认新密码" prop="rePassword">
			<el-input v-model="passwordForm.rePassword" type="password" show-password autocomplete="off"></el-input>
			</el-form-item>
			<div class="password-footer">
			<el-button @click="closePasswordDialog">关闭</el-button>
			<el-button type="primary" :loading="passwordSaving" @click="handlePasswordSave">保存</el-button>
			</div>
			</el-form>
			</el-dialog>
			</div>
			</body>
			<script type="text/javascript" src="../static/js/jquery/jquery-3.3.1.min.js"></script>
			<script src="../static/layui/layui.js"></script>
			<script>
			layui.use(['form'], function(){
			var form = layui.form,
			layer = layui.layer,
			$ = layui.jquery;

			// 初始化表单数据
			$.ajax({
			url: baseUrl+"/user/detail/auth",
			headers: {'token': localStorage.getItem('token')},
			method: 'POST',
			success: function (res) {
			if (res.code === 200){
			var user = res.data;
			for (var val in user) {
			$('#person-detail').find(":input[id='" + val + "']").val(user[val]);
			}
			} else if (res.code === 403){
			top.location.href = baseUrl+"/";
			} else {
			layer.msg(res.msg);
			}
			}
			});

			// 修改密码
			$(document).on('click','#update-password', function () {
			layer.open({
			type: 2,
			title: '修改密码',
			maxmin: true,
			area: ['350px', '310px'],
			shadeClose: false,
			content: 'password.html',
			success: function(layero, index){
			layer.iframeAuto(index);
			}
			})
			});


			// 保存修改
			form.on('submit(save)', function (data) {
			var user = {
			id: $('#id').val(),
			username: $('#username').val(),
			mobile: $("#mobile").val(),
			};
			layer.confirm('确定修改资料吗？', function(){
			$.ajax({
			url: baseUrl+"/user/update/auth",
			headers: {'token': localStorage.getItem('token')},
			data: user,
			method: 'POST',
			success: function (res) {
			if (res.code === 200){
			layer.msg(res.msg);
			localStorage.setItem("username", user.username);
			parent.$('#person-username').text(localStorage.getItem('username'));
			} else if (res.code === 403){
			top.location.href = baseUrl+"/";
			} else {
			layer.msg(res.msg);
			}
			}
			});
			});
			return false;
			});
			});
			</script>
			</html>
			<script type="text/javascript" src="../static/js/tools/md5.js"></script>
			<script type="text/javascript" src="../static/js/common.js?v=20260309_i18n_fix1"></script>
			<script type="text/javascript" src="../static/vue/js/vue.min.js"></script>
			<script type="text/javascript" src="../static/vue/element/element.js"></script>
			<script type="text/javascript" src="../static/js/detail/detail.js?v=20260310_detail_vue3"></script>
			</html>