Files
kami_boss/views/index.html
2024-10-13 22:18:47 +08:00

697 lines
30 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>管理后台</title>
<link rel="stylesheet" type="text/css" href="../static/lib/bootstrap/css/bootstrap.min.css"/>
<script src="../static/js/jquery.min.js"></script>
<script src="../static/lib/bootstrap/js/bootstrap.min.js"></script>
<script src="../static/js/filter.js"></script>
<style type="text/css" media="screen">
body {
overflow-y: hidden;
overflow-x: hidden;
}
.middle {
position: absolute;
top: 50px;
left: 0;
bottom: 30px;
width: 100%;
}
.middle .sider-left {
float: left;
bottom: 30px;
width: 14%;
height: 100%;
border: 2px solid #e7e7e7;
overflow: auto;
box-sizing: border-box;
}
.middle .sider-left .sider-bar {
height: auto;
width: 100%;
}
.middle .sider-left li {
list-style: none;
}
.middle .sider-right {
float: right;
bottom: 30px;
height: 100%;
width: 86%;
border: 2px solid #e7e7e7;
overflow: auto;
box-sizing: border-box;
}
.middle .sider-right .main {
height: auto;
width: 100%;
}
.middle .sider-left .divider {
border-top: 1px solid #e7e7e7;
}
.middle .sider-left .first-menu {
position: relative;
display: flex;
justify-items: center;
align-items: center;
text-decoration: none;
width: 100%;
font-size: 14px;
letter-spacing: 1px;
color: #777777;
line-height: 40px;
padding-left: 2px;
border-top: 1px solid #e7e7e7;
border-bottom: 1px solid #e7e7e7;
}
.middle .sider-left .first-menu-main {
position: relative;
display: inline-block;
text-decoration: none;
width: 100%;
font-size: 16px;
letter-spacing: 1px;
color: #777777;
line-height: 40px;
padding-left: 2px;
border-top: 1px solid #e7e7e7;
border-bottom: 1px solid #e7e7e7;
}
.middle .sider-left .first-menu .first-title {
margin-left: 10px;
margin-right: 24px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.middle .sider-left .last-glyphicon {
position: absolute;
right: 2px;
top: 50%;
transform: translateY(-50%);
}
.middle .sider-left .second-menu a {
display: block;
width: 100%;
text-align: center;
text-decoration: none;
letter-spacing: 1px;
line-height: 30px;
font-size: 13px;
color: #777777;
}
.middle .sider-left .second-menu a:last-child {
margin-bottom: 30px;
}
.footer {
width: 100%;
border: 2px solid #e7e7e7;
line-height: 30px;
text-align: center;
box-sizing: border-box;
}
</style>
</head>
<body>
<!-- 更改密码的模态框 -->
<div class="modal fade" id="logoutModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
data-keyboard="false">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title" id="myModalLabel">用户密码更改</h4>
</div>
<div class="modal-body">
<p class="color-red text-center">温馨提示新密码字为8~16个字符字母和数字组成。</p>
<div class="row margin-top-20">
<div class="col-xs-3">
<span>旧密码:</span>
</div>
<div class="col-xs-5">
<input class="old-passwrod" type="password" name=""> <span class="color-red">*</span>
</div>
<div class="col-xs-4 color-red old-error">
</div>
</div>
<div class="row margin-top-20">
<div class="col-xs-3">
<span>新密码:</span>
</div>
<div class="col-xs-5">
<input class="new-password" type="password" name=""> <span class="color-red">*</span>
</div>
<div class="col-xs-4 color-red new-error">
</div>
</div>
<div class="row margin-top-20">
<div class="col-xs-3">
<span>再次输入新密码:</span>
</div>
<div class="col-xs-5">
<input class="twice-password" type="password" name=""> <span class="color-red">*</span>
</div>
<div class="col-xs-4 color-red twice-error">
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default password-cancal cancal-save" data-dismiss="modal">取消
</button>
<button type="button" class="btn btn-primary password-save">保存</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="totpModal" tabindex="-1" role="dialog" aria-labelledby="myTotpLabel"
data-keyboard="false">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title" id="totpLabel">TOTP二次验证</h4>
</div>
<div class="modal-body">
<div class="totp-regeneration">
<div class="row">
当前标识:<span id="totp-key"></span>
</div>
<div class="row">
<button class="btn btn-warning totp-regeneration-btn" data-toggle="tooltip"
title="重新生成将导致此前的二次验证不可用,请谨慎生成">重新生成
</button>
</div>
</div>
<div class="row margin-top-20 totp-body">
<div id="totp-img">
<img src="" alt="" srcset="">
<input value="" id="totp-secret" hidden>
</div>
<label>请输入二次验证:
<input id="totp-value" type="text" name="">
</label>
</div>
<div class="col-xs-4 color-red totp-new-error">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default totp-cancal cancal-save" data-dismiss="modal">取消
</button>
<button type="button" class="btn btn-primary totp-save">保存</button>
</div>
</div>
</div>
</div>
<!-- 导航栏 -->
<div class="self-nav">
</div>
<nav class="navbar navbar-inverse navbar-fixed-top" id="navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">{{.title}}</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
aria-expanded="false">
<span class="glyphicon glyphicon-user"></span>你好!管理员 <span class="caret"></span></a>
<ul class="dropdown-menu">
<li>
<a href="#" style="text-align: center;" data-toggle="modal" data-target="#logoutModal">
<i class="glyphicon glyphicon-cog change-password"></i> 更改密码</a>
</li>
<li>
<a href="#" style="text-align: center;" data-toggle="modal" data-target="#totpModal"> <i
class="glyphicon glyphicon-cog totp"></i>二次验证</a>
</li>
<li role="separator" class="divider"></li>
<li>
<a href="#" style="text-align: center;" class="logout"> <i
class="glyphicon glyphicon-off"></i> 退出登录</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
<!-- 左侧导航栏 -->
<div class="middle">
<div class="sider-left">
<div class="sider-bar">
<div>
<a href="#" class="first-menu" onclick='loadMainContent("/main.html")'>
<span class="glyphicon glyphicon-home"></span>
<span class="first-title">控制面板</span>
</a>
</div>
<!-- <div>-->
<!-- <a href="#" class="first-menu">-->
<!-- <span class="glyphicon glyphicon-wrench"></span>-->
<!-- <span class="first-title">权限控制</span>-->
<!-- <span class="glyphicon glyphicon-plus last-glyphicon"></span>-->
<!-- </a>-->
<!-- <div class="second-menu">-->
<!-- {{/*<a href="#" onclick='loadMainContent("/first_menu.html");'><span>添加一级菜单</span></a>-->
<!-- <a href="#" onclick='loadMainContent("/second_menu.html")'><span>添加二级菜单</span></a>-->
<!-- <a href="#" onclick='loadMainContent("/power.html")'><span>添加权限</span></a>*/}}-->
<!-- <a href="#" onclick='loadMainContent("/role.html")'><span>角色管理</span></a>-->
<!-- <a href="#" onclick='loadMainContent("/operator.html")'><span>操作员管理</span></a>-->
<!-- </div>-->
<!-- </div>-->
<div>
<a href="#" class="first-menu">
<span class="glyphicon glyphicon-road"></span>
<span class="first-title">通道管理</span>
<span class="glyphicon glyphicon-plus last-glyphicon"></span>
</a>
<div class="second-menu">
<a href="#" onclick='loadMainContent("/road.html")'><span>支付通道</span></a>
<a href="#" onclick='loadMainContent("/road_pool.html")'><span>轮询池</span></a>
</div>
</div>
<div>
<a href="#" class="first-menu">
<span class="glyphicon glyphicon-user"></span>
<span class="first-title">商户管理</span>
<span class="glyphicon glyphicon-plus last-glyphicon"></span>
</a>
<div class="second-menu">
<a href="#" onclick='loadMainContent("/merchant.html")'><span>商户配置</span></a>
<a href="#" onclick='loadMainContent("/merchant_v2.html")'><span>商户配置(V2)</span></a>
<a href="#" onclick='loadMainContent("/customerUserManagement.html")'>供销客户管理</a>
<a href="#" onclick='loadMainContent("/card-user-management.html")'>卡片配置管理</a>
</div>
</div>
<div>
<a href="#" class="first-menu">
<span class="glyphicon glyphicon-user"></span>
<span class="first-title">Apple充值管理</span>
<span class="glyphicon glyphicon-plus last-glyphicon"></span>
</a>
<div class="second-menu">
<a href="#"
onclick='loadMainContent("/recharge-apple-card-account.html")'><span>苹果账户管理</span></a>
<a href="#"
onclick='loadMainContent("/recharge-apple-card-order.html")'><span>充值订单管理</span></a>
</div>
</div>
<div>
<a href="#" class="first-menu">
<span class="glyphicon glyphicon-user"></span>
<span class="first-title">天猫充值管理</span>
<span class="glyphicon glyphicon-plus last-glyphicon"></span>
</a>
<div class="second-menu">
<a href="#" onclick='loadMainContent("/recharge-t-mall-game-workplace.html")'>
<span>总览</span>
</a>
<a href="#" onclick='loadMainContent("/recharge-t-mall-game-account.html")'>
<span>账号管理</span>
</a>
<a href="#" onclick='loadMainContent("/recharge-t-mall-game-order.html")'>
<span>订单管理</span>
</a>
<a href="#" onclick='loadMainContent("/recharge-t-mall-game-shop-order.html")'>
<span>天猫订单管理</span>
</a>
</div>
</div>
<!-- <div>-->
<!-- <a href="#" class="first-menu">-->
<!-- <span class="glyphicon glyphicon-console"></span>-->
<!-- <span class="first-title">代理管理</span>-->
<!-- <span class="glyphicon glyphicon-plus last-glyphicon"></span>-->
<!-- </a>-->
<!-- <div class="second-menu">-->
<!-- <a href="#" onclick='loadMainContent("/create_agent.html")'>创建代理</a>-->
<!-- <a href="#" onclick='loadMainContent("/agent_to_merchant.html")'><span>代理商户映射列表</span></a>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div>-->
<!-- <a href="#" class="first-menu">-->
<!-- <span class="glyphicon glyphicon-folder-open"></span>-->
<!-- <span class="first-title">资金管理</span>-->
<!-- <span class="glyphicon glyphicon-plus last-glyphicon"></span>-->
<!-- </a>-->
<!-- <div class="second-menu">-->
<!-- <a href="#" onclick='loadMainContent("/account.html")'><span>账户钱包</span></a>-->
<!-- <a href="#" onclick='loadMainContent("/account_history.html")'><span>资金流水</span></a>-->
<!-- </div>-->
<!-- </div>-->
{{range.roadList}}
<div>
<a href="#" class="first-menu">
<span class="glyphicon glyphicon-book"></span>
<span class="first-title" data-toggle="tooltip" title="{{.RoadName}}">订单管理({{.RoadName}})</span>
<span class="glyphicon glyphicon-plus last-glyphicon"></span>
</a>
<div class="second-menu">
<a href="#" data-toggle="tooltip"
onclick='loadMainContent("/order_info.html?roadUid={{.RoadUid}}")'><span>实时订单</span></a>
<a href="#" data-toggle="tooltip"
onclick='loadMainContent("/order_profit.html?roadUid={{.RoadUid}}")'><span>订单收益</span></a>
<a href="#" data-toggle="tooltip"
onclick='loadMainContent("/order-summary-info.html?roadUid={{.RoadUid}}")'><span>订单汇总</span></a>
</div>
</div>
{{end}}
<!-- <div>-->
<!-- <a href="#" class="first-menu">-->
<!-- <span class="glyphicon glyphicon-book"></span>-->
<!-- <span class="first-title">订单管理</span>-->
<!-- <span class="glyphicon glyphicon-plus last-glyphicon"></span>-->
<!-- </a>-->
<!-- <div class="second-menu">-->
<!-- <a href="#"-->
<!-- onclick='loadMainContent("/order_info.html?roadUid=")'><span>实时订单</span></a>-->
<!-- <a href="#"-->
<!-- onclick='loadMainContent("/order_profit.html?roadUid=")'><span>订单收益</span></a>-->
<!-- <a href="#"-->
<!-- onclick='loadMainContent("/order-summary-info.html?roadUid=")'><span>订单汇总</span></a>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div>-->
<!-- <a href="#" class="first-menu">-->
<!-- <span class="glyphicon glyphicon-piggy-bank"></span>-->
<!-- <span class="first-title">代付管理</span>-->
<!-- <span class="glyphicon glyphicon-plus last-glyphicon"></span>-->
<!-- </a>-->
<!-- <div class="second-menu">-->
<!-- <a href="#" onclick='loadMainContent("/merchant_payfor.html")'><span>商户下发</span></a>-->
<!-- <a href="#" onclick='loadMainContent("/self_payfor.html")'><span>任意打款</span></a>-->
<!-- <a href="#" onclick='loadMainContent("/payfor_record.html")'><span>代付列表</span></a>-->
<!-- <a href="#" onclick='loadMainContent("/bank_card.html")'><span>银行卡管理</span></a>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div>-->
<!-- <a href="#" class="first-menu">-->
<!-- <span class="glyphicon glyphicon-yen"></span>-->
<!-- <span class="first-title">分润管理</span>-->
<!-- <span class="glyphicon glyphicon-plus last-glyphicon"></span>-->
<!-- </a>-->
<!-- <div class="second-menu">-->
<!-- <a href="#" onclick='loadMainContent("/platform_profit.html")'><span>平台利润</span></a>-->
<!-- <a href="#" onclick='loadMainContent("/agent_profit.html")'><span>代理利润</span></a>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div>-->
<!-- <a href="#" class="first-menu">-->
<!-- <span class="glyphicon glyphicon-edit"></span>-->
<!-- <span class="first-title">自助服务</span>-->
<!-- <span class="glyphicon glyphicon-plus last-glyphicon"></span>-->
<!-- </a>-->
<!-- <div class="second-menu">-->
<!-- <a href="#" onclick="loadMainContent('/self_notify.html')"><span>批量给下游回调</span></a>-->
<!-- &lt;!&ndash; <a href="#" onclick="loadMainContent('/self_plus_sub.html')"><span>自定义加减款</span></a>&ndash;&gt;-->
<!-- </div>-->
<!-- </div>-->
<!-- <div>-->
<!-- <a href="#" class="first-menu">-->
<!-- <span class="glyphicon glyphicon-edit"></span>-->
<!-- <span class="first-title">支付测试</span>-->
<!-- <span class="glyphicon glyphicon-plus last-glyphicon"></span>-->
<!-- </a>-->
<!-- <div class="second-menu">-->
<!-- <a href="{{.extraAddr}}/testpay" target="_blank"><span>打开测试链接</span></a>-->
<!-- </div>-->
<!-- </div>-->
</div>
</div>
<div class="sider-right">
<input type="text" hidden="hidden" id="main-bank-order-id" value="">
<div class="main">
</div>
</div>
<div class="footer">版权所有</div>
</div>
</body>
<script>
$(function () {
$(".second-menu").hide();
});
function loadMainContent(url) {
$(".main").load(url);
}
function passwordCheck(str) {
let msg = "";
if (str.length < 8) {
msg = "密码长度不能小于8";
} else if (str.length > 16) {
msg = "密码长度不能大于16";
} else {
if (/([a-zA-Z]+[0-9]+|[0-9]+[a-zA-Z])/.exec(str)) {
return msg;
} else {
msg = "新密码中必须包含数字和字母!";
}
}
return msg;
}
function clearError() {
$(".old-error").text("").append("");
$(".new-error").text("").append("");
$(".twice-error").text("").append("");
}
function setError(key, value) {
$(key).text("").append(value);
return;
}
$(".password-cancal").click(function (event) {
$("input[type='password']").val("");
clearError();
})
$(".password-save").click(function (event) {
//清除之前的错误提示文字
clearError();
let oldPassword = $(".old-passwrod").val();
let newPassword = $(".new-password").val();
let twicePassword = $(".twice-password").val();
let msg = "";
if (oldPassword.length <= 0) {
setError(".old-error", "旧密码不能为空!");
return;
}
if (newPassword.length <= 0) {
setError(".new-error", "新密码不能为空!");
return;
}
if (twicePassword.length <= 0) {
setError(".twice-error", "请再次输入新密码!");
return;
}
if (!(newPassword == twicePassword)) {
setError(".twice-error", "新密码两次输入不一致!");
return;
}
if (oldPassword == newPassword) {
setError(".new-error", "新密码不能和旧密码一样!");
return;
}
msg = passwordCheck(newPassword);
if (msg.length > 0) {
setError(".new-error", msg);
return;
}
$.ajax({
url: "/update/password",
data: {
oldPassword: oldPassword,
newPassword: newPassword,
twicePassword: twicePassword
},
success: function (res) {
if (res.Code == 200) {
//将模态框关闭
$("input[type='password']").val("");
$(".cancal-save").trigger('click');
setTimeout("", 1500);//等待1.5秒
alert("密码修改成功!");
window.parent.location = "/login.html";
} else if (res.Code == 404) {
//用户登录已经过期,需要重新登录
window.parent.location = "/login.html";
} else {
//用户密码更新失败
setError(res.Key, res.Msg);
}
},
error: function () {
alert("系统异常,请稍后再试!");
}
});
});
$(".logout").click(() => {
$.ajax({
url: "/logout",
success: function (res) {
if (res.Code === 200) {
window.parent.location = "/login.html";
} else {
alert("系统异常,退出失败!");
}
},
error: function (e) {
alert("系统异常!");
},
});
});
$(".first-menu").click(function (event) {
//判断右边图标箭头是向右,还是向下;如果当前的图片是向下,那么变为向右;有所的兄弟图标全部变为向右。
if ($(this).children(".last-glyphicon").hasClass("glyphicon-plus")) {
$(this).children(".last-glyphicon").removeClass('glyphicon-plus');
$(this).children(".last-glyphicon").addClass("glyphicon-minus");
} else {
$(this).children(".last-glyphicon").removeClass("glyphicon-minus");
$(this).children(".last-glyphicon").addClass("glyphicon-plus");
}
//添加面包屑
$(".breadcrumb").html("");
firstTitle = $(this).children(".first-title").text();
//背景色变为灰色
$(this).css('background-color', 'skyblue');
$(this).parents().siblings().children(".first-menu").css("background-color", 'white');
$(this).parents().children(".second-menu").children("a").children('span').css('border-bottom', 'none');
// $(this).parents().children(".second-menu").css("background-color", "#dff0d8");
$(this).parents().siblings().children(".second-menu").css('background-color', 'none');
//展示当前的二级菜单
$(this).parents().children(".second-menu").toggle();
//隐藏其余的二级菜单
$(this).parents().siblings().children(".second-menu").hide();
//将其余一级菜单的箭头改为向右
$(this).parents().siblings().children(".first-menu").children(".last-glyphicon").removeClass("glyphicon-minus").addClass("glyphicon-plus");
});
//选择二级菜单时,会出现下划线
$(".second-menu a span").click(function (event) {
$(this).css("border-bottom", "1px dashed #333333");
$(this).parents().siblings().children('span').css("border-bottom", "none");
//添加二级面包屑
$(".breadcrumb").html("");
let secondTile = $(this).text();
});
$("#totpModal").on('show.bs.modal', function () {
$.ajax({
url: "/user/genTotp",
method: "post",
success: (res) => {
if (res.Code === 0) {
$("#totp-img img").attr("src", res.Data.qrImage);
$("#totp-secret").attr("value", res.Data.secret);
$("#totp-key").text(res.Data.key);
} else {
alert(res.Msg)
}
},
})
});
$(".totp-regeneration-btn").click(() => {
$.ajax({
url: "/user/genTotp",
data: {
newTotp: 1,
},
method: "post",
success: (res) => {
if (res.Code === 0) {
$("#totp-img img").attr("src", res.Data.qrImage);
$("#totp-secret").attr("value", res.Data.secret);
$("#totp-key").text(res.Data.key);
} else {
alert(res.Msg)
}
},
})
})
$(".totp-save").click(function (event) {
const secret = $("#totp-secret").val();
const code = $("#totp-value").val();
const key = $("#totp-key").text();
console.log(secret, code, key)
if (secret === "" || code === "" || key === "") {
setError(".totp-new-error", "信息填写不完整,需要重新填写");
return;
}
$.ajax({
url: "/user/saveTotp",
method: "post",
data: {
code,
secret,
key,
},
success: (res) => {
if (res.Code === 0) {
$("#totp-value").val("");
$(".cancal-save").trigger('click');
alert("保存成功!")
} else {
setError(".totp-new-error", res.Msg);
}
},
error: (err) => {
setError(".totp-new-error", err);
}
})
})
</script>
<style>
.totp-regeneration {
float: right;
margin-right: 20px;
text-align: right;
}
.totp-body {
margin: 20px;
}
</style>
</html>