276 lines
13 KiB
HTML
276 lines
13 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
|
<title>NAS</title>
|
|
<link rel="stylesheet" href="/layui/css/layui.css">
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<div class="layui-layout layui-layout-admin">
|
|
<div id="header"></div>
|
|
<div class="layui-body" style="top: 100px;overflow:auto; ">
|
|
|
|
<!-- <div id="side"></div> -->
|
|
<blockquote class="layui-elem-quote"><span id="ip">密码管理器</span></blockquote>
|
|
<button type="button" id="addType" class="layui-btn layui-btn-normal">新增分类</button>
|
|
<div class="layui-tab" lay-filter="type" lay-allowclose="true">
|
|
<ul class="layui-tab-title">
|
|
|
|
</ul>
|
|
<div class="layui-tab-content">
|
|
|
|
</div>
|
|
</div>
|
|
<iframe src="../../randompassword/index.html" style="width: 100%; height: 120%; " frameborder="0"
|
|
scrolling="no"></iframe>
|
|
<div id="footer"></div>
|
|
</div>
|
|
|
|
<script src="/layui/layui.js"></script>
|
|
<script src="/js/jquery-3.2.1.js"></script>
|
|
<script type="text/html" id="topTools">
|
|
<a class="layui-btn layui-btn-xs" lay-event="addAddress">新增账号</a>
|
|
</script>
|
|
<script type="text/html" id="listTools">
|
|
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
|
|
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
|
|
</script>
|
|
|
|
<script>
|
|
$('#header').load("/html/header.html");
|
|
$('#footer').load("/html/footer.html");
|
|
|
|
|
|
let tabid = -1;
|
|
layui.use(['layer', 'form', 'element', 'table'], function () {
|
|
let layer = layui.layer
|
|
, form = layui.form
|
|
, table = layui.table
|
|
, element = layui.element;
|
|
$.get("/tools/password/type/get/list.do", function (data) {
|
|
let json = JSON.parse(data);
|
|
if (json.code === 0) {
|
|
for (let index = 0; index < json.data.length; index++) {
|
|
const ret = json.data[index];
|
|
element.tabAdd('type', {
|
|
title: ret.title
|
|
, content: '<table id="passwordlist' + ret.id + '" lay-filter="listTools"></table>'
|
|
, id: ret.id
|
|
})
|
|
}
|
|
element.tabChange('type', '1');
|
|
}
|
|
});
|
|
form.render()
|
|
element.on('tab(type)', function (data) {
|
|
|
|
tabid = $(this).attr('lay-id')
|
|
table.render({
|
|
elem: "#passwordlist" + tabid
|
|
, url: '/tools/password/get/list.do?type=' + tabid
|
|
, toolbar: '#topTools'
|
|
, page: true
|
|
, cols: [[
|
|
{ field: "id", title: "id", width: 80, sort: true, fixed: 'left' }
|
|
, { field: 'title', title: '标题', width: 200 }
|
|
, { field: 'username', title: '账号', width: 200 }
|
|
, { field: 'password', title: '密码', width: 200 }
|
|
, { field: 'url', title: '网址', width: 400, templet: '<div><a href="{{d.url}}" target="_blank">{{d.url}}</a></div>' }
|
|
, { field: 'info', title: '备注', width: 200 }
|
|
, { field: "right", width: 200, toolbar: '#listTools' }
|
|
]]
|
|
,done:function (res,curr,count) {
|
|
form.render();
|
|
}
|
|
});
|
|
})
|
|
element.on('tabDelete(type)', function (data) {
|
|
let name = $(data.elem.prevObject.prevObject[0]).text().replace("ဆ", "")
|
|
let id = $(data.elem.prevObject.prevObject[0]).attr('lay-id')
|
|
layer.open({
|
|
title: "警告"
|
|
, content: "确认删除 " + name
|
|
, btn: ['确认', '取消']
|
|
, yes: function (index) {
|
|
$.post('/tools/password/type/set/remove.do', { id: id }, function (data) {
|
|
let json = JSON.parse(data);
|
|
layer.msg(json.msg);
|
|
})
|
|
layer.close(index)
|
|
}
|
|
, btn2: function (index) {
|
|
layer.close(index)
|
|
}
|
|
})
|
|
|
|
});
|
|
table.on('rowDouble(listTools)', function (data) {
|
|
$.get('/tools/password/get/password.do?id=' + data.data.id, function (udata) {
|
|
let json = JSON.parse(udata);
|
|
data.data.password = json.data;
|
|
data.update(data.data)
|
|
})
|
|
})
|
|
table.on('tool(listTools)', function (obj) {
|
|
if (obj.event === 'edit') {
|
|
$.get('/tools/password/get/password.do?id=' + obj.data.id, function (udata) {
|
|
let json = JSON.parse(udata);
|
|
layer.open({
|
|
title: "添加账号",
|
|
type: 1,
|
|
content: $('#adduser'),
|
|
btn: ['提交', '关闭'],
|
|
yes: function (index) {
|
|
$.post('/tools/password/set/update.do', {
|
|
title: $('#title').val()
|
|
, username: $('#username').val(), password: $('#password').val()
|
|
, url: $('#url').val(), info: $('#info').val()
|
|
, type: tabid
|
|
, id: obj.data.id
|
|
}, function (data) {
|
|
let json = JSON.parse(data);
|
|
layer.msg(json.msg)
|
|
table.reload('passwordlist' + obj.data.id)
|
|
$('#title').val('')
|
|
$('#username').val('')
|
|
$('#password').val('')
|
|
$('#url').val('')
|
|
$('#info').val('')
|
|
layer.close(index)
|
|
})
|
|
|
|
|
|
},
|
|
btn2: function (index) {
|
|
layer.msg(tabid)
|
|
layer.close(index)
|
|
},
|
|
success: function (layero, index) {
|
|
$('#title').val(obj.data.title)
|
|
$('#username').val(obj.data.username)
|
|
$('#password').val(json.data)
|
|
$('#url').val(obj.data.url)
|
|
$('#info').val(obj.data.info)
|
|
}
|
|
|
|
})
|
|
})
|
|
} else if (obj.event === 'del') {
|
|
layer.open({
|
|
title: "警告!"
|
|
, content: "删除操作无法回滚,是否确认删除:" + obj.data.title
|
|
, btn: ['确认', '取消']
|
|
, yes: function (index) {
|
|
$.post('/tools/password/set/remove.do', { id: obj.data.id }, function (data) {
|
|
let json = JSON.parse(data);
|
|
layer.msg(json.msg)
|
|
})
|
|
},
|
|
btn2: function (index) {
|
|
layer.close(index);
|
|
}
|
|
})
|
|
}
|
|
})
|
|
table.on('toolbar(listTools)', function (obj) {
|
|
if (obj.event === 'addAddress') {
|
|
layer.open({
|
|
title: "添加账号",
|
|
type: 1,
|
|
content: $('#adduser'),
|
|
btn: ['提交', '关闭'],
|
|
yes: function (index) {
|
|
$.post('/tools/password/set/add.do', {
|
|
title: $('#title').val()
|
|
, username: $('#username').val(), password: $('#password').val()
|
|
, url: $('#url').val(), info: $('#info').val()
|
|
, type: tabid
|
|
}, function (data) {
|
|
let json = JSON.parse(data);
|
|
layer.msg(json.msg)
|
|
table.reload('passwordlist' + tabid)
|
|
$('#title').val('')
|
|
$('#username').val('')
|
|
$('#password').val('')
|
|
$('#url').val('')
|
|
$('#info').val('')
|
|
layer.close(index)
|
|
})
|
|
|
|
|
|
},
|
|
btn2: function (index) {
|
|
layer.msg(tabid)
|
|
layer.close(index)
|
|
}
|
|
|
|
})
|
|
}
|
|
})
|
|
$('#addType').click(function () {
|
|
layer.prompt({
|
|
title: '新增分类'
|
|
}, function (value, index, elem) {
|
|
$.post('/tools/password/type/set/add.do', { type: value }, function (data) {
|
|
window.location.reload()
|
|
})
|
|
layer.close(index)
|
|
})
|
|
})
|
|
});
|
|
|
|
|
|
</script>
|
|
|
|
<div style="display: none; margin: 20px;" id="adduser">
|
|
<form class="layui-form" action="">
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">标题</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" id="title" required lay-verify="required" placeholder="请输入标题"
|
|
autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">账号</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" id="username" required lay-verify="required" placeholder="请输入账号"
|
|
autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">密码</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" id="password" required lay-verify="required" placeholder="请输入密码"
|
|
autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">网址</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" id="url" required lay-verify="required" placeholder="请输入网址URL"
|
|
autocomplete="off" class="layui-input">
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">备注信息</label>
|
|
<div class="layui-input-block">
|
|
<textarea type="text" id="info" name="" required lay-verify="required" class="layui-textarea"
|
|
placeholder="请输入备注信息"></textarea>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
<style>
|
|
#icon {
|
|
float: right;
|
|
}
|
|
</style>
|
|
|
|
</html> |