324 lines
11 KiB
HTML
324 lines
11 KiB
HTML
<!doctype html>
|
|
<!--
|
|
* Tabler - Premium and Open Source dashboard template with responsive and high quality UI.
|
|
* @version 1.0.0-beta20
|
|
* @link https://tabler.io
|
|
* Copyright 2018-2023 The Tabler Authors
|
|
* Copyright 2018-2023 codecalm.net Paweł Kuna
|
|
* Licensed under MIT (https://github.com/tabler/tabler/blob/master/LICENSE)
|
|
-->
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
|
<title>设置-安全设置</title>
|
|
|
|
</head>
|
|
|
|
<body class="d-flex flex-column">
|
|
<div class="page">
|
|
<!-- Navbar -->
|
|
{{if .is_login}}
|
|
{{template "header-logined.html" .}}
|
|
{{else}}
|
|
{{template "header-no-login.html"}}
|
|
{{end}}
|
|
|
|
<header class="navbar-expand-md">
|
|
|
|
</header>
|
|
|
|
<div class="page-wrapper">
|
|
<!-- Page header -->
|
|
<div class="page-header d-print-none">
|
|
<div class="container-xl">
|
|
<div class="row g-2 align-items-center">
|
|
<div class="col">
|
|
<h2 class="page-title">
|
|
设置
|
|
</h2>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Page body -->
|
|
<div class="page-body">
|
|
<div class="container-xl">
|
|
<div class="card">
|
|
<div class="row g-0">
|
|
<div class="col-12 col-md-3 border-end">
|
|
<div class="card-body">
|
|
<h4 class="subheader">账号设置</h4>
|
|
<div class="list-group list-group-transparent">
|
|
<a href="/setting-my"
|
|
class="list-group-item list-group-item-action d-flex align-items-center ">信息设置</a>
|
|
<a href="#" class="list-group-item list-group-item-action d-flex align-items-center active">安全设置</a>
|
|
</div>
|
|
<h4 class="subheader mt-4">外部设置</h4>
|
|
<div class="list-group list-group-transparent">
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-md-9 d-flex flex-column">
|
|
<div class="card-body">
|
|
|
|
<h2 class="mb-4">安全设置</h2>
|
|
|
|
|
|
<h3 class="card-title mt-4">安全邮箱</h3>
|
|
<p class="card-subtitle">用于找回账号密码，该联系方式不会公开显示给其他人。</p>
|
|
<div>
|
|
<div class="row g-2">
|
|
<div class="col-auto">
|
|
<input id="mail" type="email" class="form-control w-auto " value="{{.user.Email}}"
|
|
maxlength="64">
|
|
<div id="email_input_err" class="invalid-feedback">不能为空</div>
|
|
<div class="valid-feedback">修改成功</div>
|
|
</div>
|
|
<div class="col-auto"><a href="#" class="btn" onclick="change_email()">
|
|
修改邮箱
|
|
</a></div>
|
|
</div>
|
|
</div>
|
|
<h3 class="card-title mt-4">登录密码</h3>
|
|
<p class="card-subtitle">修改密码后需要重新登录</p>
|
|
<div class="col-auto">
|
|
<input id="pass_old" type="password" class="form-control w-auto mt-1" placeholder="旧密码"
|
|
autocomplete="off">
|
|
<div id="pass_old_err" class="invalid-feedback">不能为空</div>
|
|
</div>
|
|
|
|
<div class="col-auto">
|
|
<input id="pass_new" type="password" class="form-control w-auto mt-1" placeholder="新密码"
|
|
autocomplete="off">
|
|
<div class="invalid-feedback">不能为空</div>
|
|
</div>
|
|
|
|
<div class="col-auto">
|
|
<input id="pass_cmf" type="password" class="form-control w-auto mt-1 mb-1" placeholder="确认密码"
|
|
autocomplete="off">
|
|
<div id="pass_cmf_err" class="invalid-feedback">不能为空</div>
|
|
</div>
|
|
|
|
<a id="show_pass" class="link-secondary " title="显示密码"
|
|
data-bs-toggle="tooltip"><!-- Download SVG icon from http://tabler-icons.io/i/eye -->
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
|
|
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
|
|
class="icon icon-tabler icons-tabler-outline icon-tabler-eye">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
|
|
<path d="M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0" />
|
|
<path d="M21 12c-2.4 4 -5.4 6 -9 6c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6" />
|
|
</svg>
|
|
</a>
|
|
<a id="show_pass_no" class="link-secondary d-none" title="隐藏密码"
|
|
data-bs-toggle="tooltip"><!-- Download SVG icon from http://tabler-icons.io/i/eye -->
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
|
|
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
|
|
class="icon icon-tabler icons-tabler-outline icon-tabler-eye-off">
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
|
|
<path d="M10.585 10.587a2 2 0 0 0 2.829 2.828" />
|
|
<path
|
|
d="M16.681 16.673a8.717 8.717 0 0 1 -4.681 1.327c-3.6 0 -6.6 -2 -9 -6c1.272 -2.12 2.712 -3.678 4.32 -4.674m2.86 -1.146a9.055 9.055 0 0 1 1.82 -.18c3.6 0 6.6 2 9 6c-.666 1.11 -1.379 2.067 -2.138 2.87" />
|
|
<path d="M3 3l18 18" />
|
|
</svg>
|
|
</a>
|
|
|
|
<div>
|
|
<a href="#" class="btn" onclick="change_pass()">
|
|
修改密码
|
|
</a>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
{{template "footer.html"}}
|
|
</div>
|
|
|
|
</body>
|
|
|
|
</html>
|
|
|
|
|
|
<script>
|
|
|
|
const dom_mail = document.getElementById("mail")
|
|
const dom_pass_old = document.getElementById("pass_old")
|
|
const dom_pass_new = document.getElementById("pass_new")
|
|
const dom_pass_cmf = document.getElementById("pass_cmf")
|
|
var show_password_dom = document.getElementById('show_pass');
|
|
var show_password_no_dom = document.getElementById('show_pass_no');
|
|
|
|
show_password_dom.addEventListener('click', function () {
|
|
|
|
dom_pass_old.type = "text";
|
|
dom_pass_new.type = "text";
|
|
dom_pass_cmf.type = "text";
|
|
show_password_dom.classList.add("d-none")
|
|
show_password_no_dom.classList.remove("d-none");
|
|
|
|
})
|
|
show_password_no_dom.addEventListener('click', function () {
|
|
|
|
dom_pass_old.type = "password";
|
|
dom_pass_new.type = "password";
|
|
dom_pass_cmf.type = "password";
|
|
show_password_no_dom.classList.add("d-none")
|
|
show_password_dom.classList.remove("d-none");
|
|
|
|
})
|
|
|
|
dom_mail.addEventListener('input', function () {
|
|
if (dom_mail.value != "") {
|
|
dom_mail.classList.remove("is-invalid");
|
|
dom_mail.classList.remove("is-valid");
|
|
}
|
|
})
|
|
|
|
dom_pass_old.addEventListener('input', function () {
|
|
if (dom_pass_old.value != "") {
|
|
dom_pass_old.classList.remove("is-invalid");
|
|
}
|
|
})
|
|
|
|
dom_pass_new.addEventListener('input', function () {
|
|
if (dom_pass_new.value != "") {
|
|
dom_pass_new.classList.remove("is-invalid");
|
|
}
|
|
})
|
|
|
|
dom_pass_cmf.addEventListener('input', function () {
|
|
if (dom_pass_cmf.value != "") {
|
|
dom_pass_cmf.classList.remove("is-invalid");
|
|
}
|
|
})
|
|
|
|
function change_email() {
|
|
if (dom_mail.value != "") {
|
|
if (isValidEmail(dom_mail.value)) {
|
|
|
|
post_json("/user/change_email", {
|
|
new_email: dom_mail.value
|
|
}, (c) => {
|
|
if (c.statusCode == 200) {
|
|
|
|
if (c.data.err_code == 0) {
|
|
banner_alert('success', "Email更新成功", 1000, () => {
|
|
|
|
})
|
|
|
|
} else {
|
|
banner_alert('warning', "错误：" + c.data.err_msg, 1000)
|
|
}
|
|
|
|
|
|
|
|
} else {
|
|
banner_alert('danger', "网络连接错误：" + c.error, 10000)
|
|
}
|
|
})
|
|
} else {
|
|
dom_mail.classList.add("is-invalid");
|
|
dom_mail.placeholder = "不是邮箱";
|
|
document.getElementById("email_input_err").innerHTML = "不是邮箱";
|
|
}
|
|
} else {
|
|
dom_mail.classList.add("is-invalid");
|
|
}
|
|
}
|
|
|
|
function change_pass() {
|
|
var valid = true
|
|
|
|
if (dom_pass_old.value == "") {
|
|
valid = false
|
|
dom_pass_old.classList.add("is-invalid")
|
|
}
|
|
if (dom_pass_new.value == "") {
|
|
valid = false
|
|
dom_pass_new.classList.add("is-invalid")
|
|
}
|
|
if (dom_pass_cmf.value == "") {
|
|
valid = false
|
|
dom_pass_cmf.classList.add("is-invalid")
|
|
} else {
|
|
if (dom_pass_cmf.value != dom_pass_new.value) {
|
|
valid = false
|
|
dom_pass_cmf.classList.add("is-invalid")
|
|
document.getElementById("pass_cmf_err").innerHTML = "密码不一致";
|
|
}
|
|
}
|
|
|
|
if (valid) {
|
|
|
|
post_json("/user/change_pass", {
|
|
pass_old: dom_pass_old.value,
|
|
pass_new: dom_pass_new.value,
|
|
}, (c) => {
|
|
if (c.statusCode == 200) {
|
|
|
|
if (c.data.err_code == 0) {
|
|
banner_alert('success', "密码更新成功", 1000, () => {
|
|
location.href = '/sign-in'
|
|
})
|
|
|
|
} else if (c.data.err_code == 3) {
|
|
dom_pass_old.classList.add("is-invalid")
|
|
document.getElementById("pass_old_err").innerHTML = "密码不正确";
|
|
} else {
|
|
banner_alert('warning', "错误：" + c.data.err_msg, 1000)
|
|
}
|
|
|
|
|
|
|
|
} else {
|
|
banner_alert('danger', "网络连接错误：" + c.error, 10000)
|
|
}
|
|
})
|
|
|
|
// const url = '/api/v1/user/change_pass';
|
|
// const sumt_data = {
|
|
// pass_old: dom_pass_old.value,
|
|
// pass_new: dom_pass_new.value,
|
|
// };
|
|
// try {
|
|
// const response = axios.post(url, sumt_data, {
|
|
// headers: {
|
|
// 'Content-Type': 'application/json'
|
|
// }
|
|
// }).then(response => {
|
|
// if (response.data.err_code == 0) {
|
|
// location.href = '/sign-in'
|
|
// } else if (response.data.err_code == 3) {
|
|
// dom_pass_old.classList.add("is-invalid")
|
|
// document.getElementById("pass_old_err").innerHTML = "密码不正确";
|
|
// } else {
|
|
// console.log(response.data)
|
|
// }
|
|
|
|
// });
|
|
// } catch (error) {
|
|
// if (error.response) {
|
|
// // 服务器返回了错误状态码（如 4xx, 5xx）
|
|
// console.error('服务器错误:', error.response.data);
|
|
// } else {
|
|
// console.error('请求未完成:', error.message);
|
|
// }
|
|
// }
|
|
}
|
|
|
|
|
|
|
|
}
|
|
</script> |