123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238 |
- {{template "header.tmpl" .}}
- <style type="text/css">
- #filterform{
- margin: 10px 0px;
- }
- #filterform .form-group{
- margin-right: 20px;
- }
- </style>
- </head>
- <body>
- {{template "navbar.tmpl" .}}
- <div class="container-fluid">
- <h4 class="text-center">账号管理 <small>[<a href="#" id="add_btn"><i class="glyphicon glyphicon-plus"></i> 点击这里添加</a>]</small></h4>
- <hr />
- <table class="table table-bordered" style="margin-bottom:0px;">
- <thead>
- <tr>
- <th>ID</th>
- <th>账号</th>
- <th>姓名</th>
- <th>最后登录</th>
- <th>是否管理员</th>
- <th>状态</th>
- <th>操作</th>
- </tr>
- </thead>
- <tbody id="list"></tbody>
- </table>
- </div>
- <script type="text/javascript">
- var $SESS = {{.Sess}};
- function randomPassword(length) {
- var chars = ['a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z','A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z','0','1','2','3','4','5','6','7','8','9','`','-','=','~','!','@','#','$','%','^','*','(',')','_','+','[',']',';',',','.','{','}',':','<','>','?'];
- var pwd = '';
- for (var i=0; i<length; i++) {
- var k = Math.floor(Math.random() * chars.length);
- pwd += chars[k];
- }
- return pwd;
- }
- $(function(){
- //加载列表
- function account_list() {
- var list = $('#list');
- list.empty();
- $.post('/syscfg/account_list', {}, function(resp){
- if (resp && resp.errno == 0 && resp.data) {
- var html = '';
- for (var i=0; i<resp.data.length; i++) {
- var item = resp.data[i];
- html += '<tr>';
- html += '<td>' + item.Id + '</td>';
- html += '<td>' + item.Account + '</td>';
- html += '<td>' + item.Name + '</td>';
- html += '<td>' + (item.LastLogin == '' ? '<i class="text-muted">无</i>' : item.LastLogin) + '</td>';
- html += '<td class="' + (item.IsSuper ? 'text-danger' : '') + '">' + (item.IsSuper ? '是' : '否') + '</td>';
- html += '<td class="' + (item.Disabled ? 'danger' : '') + '">' + (item.Disabled ? '禁用' : '正常') + '</td>';
- html += '<td>';
- html += ' <button class="btn btn-xs btn-primary" type="button" data-value="' + item.Id + '">编辑</button> ';
- html += ' <button class="btn btn-xs btn-warning" type="button" data-value="' + item.Id + '">重置密码</button> ';
- html += ' <button class="btn btn-xs btn-danger" type="button" data-value="' + item.Id + '">删除</button>';
- html += '</td>';
- html += '</tr>';
- }
- list.html(html);
- //修改
- $('.btn-primary', list).click(function(){
- var id = $(this).attr('data-value');
- $.get('/syscfg/account_get', {'id': id}, function(resp){
- if (resp && resp.errno == 0) {
- account_set(resp.data);
- }
- }, 'json');
- return false;
- });
- //重置密码
- $('.btn-warning', list).click(function(){
- var id = $(this).attr('data-value');
- var html = `<form>
- <div class="form-group">
- <label>请输入新密码</label>
- <input type="text" name="Password" class="form-control" maxlength="20" />
- </div>
- </form>`;
- $.alert({
- 'title': '修改密码',
- 'content': html,
- 'size': 'modal-sm',
- 'callback': function(dlg) {
- var form = $('form', dlg).get(0);
- if (form.Password.value.length < 6) {
- $.alert({'content': '密码长度不能小于6!'});
- return false;
- } else {
- $.post('/syscfg/account_reset_pwd', {
- 'id': id,
- 'password': form.Password.value
- }, function(resp){
- if (resp && resp.errno == 0) {
- $.alert({'content': '操作成功!'});
- } else {
- $.alert({'content': resp.error ? resp.error : '操作失败!'});
- }
- }, 'json');
- }
- }
- });
- return false;
- });
- //删除
- $('.btn-danger', list).click(function(){
- var id = $(this).attr('data-value');
- $.alert({
- 'content': '确定要删除该记录吗?',
- 'btncancel': true,
- 'callback': function() {
- $.post('/syscfg/account_del', {'id': id}, function(resp){
- if (resp && resp.errno == 0) {
- account_list();
- } else {
- $.alert({'content': resp.error ? resp.error : '操作失败!'});
- }
- }, 'json');
- }
- });
- });
- }
- }, 'json');
- return false;
- }
- //添加或修改记录
- function account_set(record){
- record = $.extend({
- 'Id': 0,
- 'Account': '',
- 'Name': '',
- 'Password': randomPassword(8),
- 'IsSuper': false,
- 'Disabled': false
- }, record);
- var html = `<form class="form-horizontal">
- <div class="form-group id-group" style="display:none;">
- <label class="col-md-4 control-label">ID</label>
- <div class="col-md-8">
- <input type="text" class="form-control" name="Id" maxlength="20" value="${record.Id}" readonly="readonly" style="width:100px;" />
- </div>
- </div>
- <div class="form-group">
- <label class="col-md-4 control-label">账号</label>
- <div class="col-md-8">
- <input type="text" class="form-control" name="Account" maxlength="20" value="${record.Account}" placeholder="不能为空" style="width:200px;" />
- </div>
- </div>
- <div class="form-group">
- <label class="col-md-4 control-label">姓名</label>
- <div class="col-md-8">
- <input type="text" class="form-control" name="Name" maxlength="20" value="${record.Name}" placeholder="不能为空" style="width:200px;" />
- </div>
- </div>
- <div class="form-group pwd-group" style="display:none;">
- <label class="col-md-4 control-label">初始密码</label>
- <div class="col-md-8">
- <input type="text" class="form-control" name="Password" maxlength="20" value="${record.Password}" placeholder="不能为空" style="width:200px;" />
- </div>
- </div>
- <div class="form-group">
- <label class="col-md-4 control-label">是否是管理员</label>
- <div class="col-md-8">
- <select class="form-control" name="IsSuper" style="width:100px;">
- <option value="0">否</option>
- <option value="1">是</option>
- </select>
- </div>
- </div>
- <div class="form-group">
- <label class="col-md-4 control-label">状态</label>
- <div class="col-md-8">
- <select class="form-control" name="Disabled" style="width:100px;">
- <option value="0">正常</option>
- <option value="1">禁用</option>
- </select>
- </div>
- </div>
- </form>`;
- $.alert({
- 'title': record.Id == 0 ? '添加账号' : '编辑账号',
- 'content': html,
- 'init': function(dlg) {
- var form = $('form', dlg).get(0);
- form.IsSuper.value = record.IsSuper ? '1' : '0';
- form.Disabled.value = record.Disabled ? '1' : '0';
- if (record.Id == 0) {
- $('.id-group', form).hide();
- $('.pwd-group', form).show();
- } else {
- $('.id-group', form).show();
- $('.pwd-group', form).hide();
- }
- },
- 'callback': function(dlg){
- var form = $('form', dlg).get(0);
- if (form.Account.value.length < 2) {
- $.alert({'content': '请填写至少2位字符的账号!'});
- } else if (/\W/.test(form.Account.value) || !/^[A-Za-z]/.test(form.Account.value)) {
- $.alert({'content': '账号只能使用字母数字和下划线的组合,并且必须使用字母开头!'});
- } else if (form.Name.value == '') {
- $.alert({'content': '请填写姓名!'});
- } else if (record.Id == 0 && form.Password.value.length < 6) {
- $.alert({'content': '请填写至少6位字符的初始密码!'});
- } else {
- $.post('/syscfg/account_set', $(form).serialize(), function(resp){
- if (resp && resp.errno == 0) {
- account_list();
- } else {
- $.alert({'content': resp.error ? resp.error : '操作失败!'});
- }
- }, 'json');
- return true;
- }
- return false;
- },
- 'btncancel': true
- });
- return false;
- }
- account_list(); //加载页面
- $('#add_btn').click(account_set); //添加按钮
- });
- </script>
- </body>
- </html>
|