nodejs安装我现在就负责把管理员模块前端完善好，你告诉我我怎么做，以下是我现有的管理员模块代码addminadd.html:
<!DOCTYPE html>
<html>
<head>
<meta charset
="utf-8">
<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">
<meta name
="apple-mobile-web-app-status-bar-style" content
="black">
<meta name
="apple-mobile-web-app-capable" content
="yes">
<meta name
="format-detection" content
="telephone
=no">
<script type
="text/javascript"
src="lib/loading/okLoading.js"></script>
<link rel
="stylesheet" href
="css/main.css" media
="all">
</head>
<style>
.imgs{display: none;}
.picture{display: none;}
</style>
<body>
<div class
="x-body">
<form class
="layui-form" id
="adminadd">
<input type
="hidden" name
="id" value
="">
<div class
="layui-form-item">
<label for
="username" class
="layui-form-label">
<span class
="x-red">*</span>登录名
</label>
<div class
="layui-input-inline">
<input type
="text" id
="name" name
="name" required
="" lay-verify
="required"
autocomplete
="off" class
="layui-input" value
="">
</div>
<div class
="layui-form-mid layui-word-aux">
<span class
="x-red">*</span>将会成为您唯一的登入名
</div>
</div>
<div class
="layui-form-item">
<label for
="phone" class
="layui-form-label">
<span class
="x-red">*</span>手机
</label>
<div class
="layui-input-inline">
<input type
="text" id
="phone" name
="phone" required
="" lay-verify
="phone"
autocomplete
="off" class
="layui-input" value
="">
</div>
<div class
="layui-form-mid layui-word-aux">
<span class
="x-red">*</span>将会成为您唯一的登入名
</div>
</div>
<div class
="layui-form-item">
<label for
="role" class
="layui-form-label">
<span class
="x-red">*</span>用户组
</label>
<div class
="layui-input-inline">
<select name
="group_id">
<option value
="">请选择角色</option>
<option value
="
1" >超级管理员</option>
</select>
</div>
</div>
<div class
="layui-form-item">
<label for
="link" class
="layui-form-label">
<span class
="x-red">*</span>缩略图
</label>
<div class
="layui-input-inline">
<div class
="site-demo-upbar">
<div class
=" layui-upload-button" style
="border:#FFFFFF ;">
<button type
="button" class
="layui-btn" id
="test
1">
<i class
="layui-icon"></i>上传图片
</button>
<input class
="layui-upload" type
="file" accept
="undefined" id
="previewImg" name
="img" onchange
="upload
(this,
)">
</div>
</div>
</div>
<a href
="javascript:;" style
="" class
="layui-btn " id
="cancel"><i class
="layui-icon">ဂ</i>撤销上传</a>
</div>
<div class
="layui-form-item imgs" id
="imgshow">
<label class
="layui-form-label">缩略图展示
</label>
<img
src="" id
="pimages" name
="pimages" style
="width: 400px;height: 200px;"/>
<input id
="avatar" name
="image" required
="" type
="hidden" value
="">
</div>
<div class
="layui-form-item">
<label for
="L_pass" class
="layui-form-label">
<span class
="x-red">*</span>密码
</label>
<div class
="layui-input-inline">
<input type
="password" id
="L_pass" name
="password" required
="" lay-verify
="pass"
autocomplete
="off" class
="layui-input" value
="">
</div>
<div class
="layui-form-mid layui-word-aux">
6到
16个字符
</div>
</div>
<div class
="layui-form-item">
<label for
="L_repass" class
="layui-form-label">
<span class
="x-red">*</span>确认密码
</label>
<div class
="layui-input-inline">
<input type
="password" id
="L_repass" name
="repass" required
="" lay-verify
="repass"
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
="radio" name
="status" value
="
1" title
="启用" checked
="checked">
<div class
="layui-unselect layui-form-radio layui-form-radioed"><i class
="layui-anim layui-icon layui-anim-scaleSpring"></i>
<div>启用</div>
</div>
<input type
="radio" name
="status" value
="0" title
="禁用" checked
="checked">
<div class
="layui-unselect layui-form-radio"><i class
="layui-anim layui-icon"></i>
<div>禁用</div>
</div>
</div>
</div>
<div class
="layui-form-item">
<label for
="L_repass" class
="layui-form-label">
</label>
<button class
="layui-btn" lay-filter
="add" lay-submit
="">
增加
</button>
</div>
</form>
</div>
<script
src="lib/layui/layui.js" charset
="utf-8">
</script>
<script
src="js/x-layui.js" charset
="utf-8">
</script>
<script>
layui.use
(['form','layer'], function
(){
$
= layui.jquery;
var form
= layui.form
()
,layer
= layui.layer;
okLoading.close
($
);
//自定义验证规则
/*form.verify
({
nikename: function
(value
){
if
(value.length <
5){
return '昵称至少得
5个字符啊';
}
}
,pass: [/
(.+
){6,
12}$/, '密码必须6到
12位']
,repass: function
(value
){
if
($
('#L_pass'
).val
()!
=$
('#L_repass'
).val
()){
return '两次密码不一致';
}
}
}
);*/
//监听提交
form.on
('submit
(add
)', function
(data
){
var admindate
=$
("#adminadd"
).serialize
();
//var data
= data.field;
$.ajax
({
type:'post',
url:"xxx",
data:admindate,
datatype:"json",
success:function
(data
) {
if
(data.status
==1){
layer.msg
(data.info,{icon:
1,time:
1000}
);
setTimeout
(function
(){
window.parent.location.reload
();
var index
= parent.layer.getFrameIndex
(window.name
);
parent.layer.close
(index
);
},
1000
);
return false;
}else{
layer.msg
(data.info,{icon:
5,time:2000}
);return false;
}
}
}
)
return false;
}
);
}
);
</script>
<script>
//轮播图上传
function upload
(obj,id
)
{
var formData
= new FormData
();
formData.append
('img', $
('#previewImg'
)[0].files[0]
);
formData.append
('id', id
);//将id追加再id中
layer.msg
('图片上传中', {icon:
16}
);
$.ajax
({
type:"post",
processData: false,
contentType: false,
url:"xxx",
data:formData,
success:function
(data
){
if
(data.status
== 1){
//console.log
(data.image_name
);
layer.closeAll
('loading'
);
//layer.msg
(data.info,{icon:
1,time:
1000}
);
$
("#pimages"
).attr
('
src',data.image_name
);
$
("#avatar"
).val
(data.image_name
);
$
(".imgs"
).show
();
return false;
}else{
layer.msg
(data.info,{icon:2,time:
1000}
);
}
}
}
);
}
</script>
</body>
</html> 和adminlist.html:
<!DOCTYPE html>
<html>
<head>
<meta charset
="utf-8">
<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">
<meta name
="apple-mobile-web-app-status-bar-style" content
="black">
<meta name
="apple-mobile-web-app-capable" content
="yes">
<meta name
="format-detection" content
="telephone
=no">
<script type
="text/javascript"
src="lib/loading/okLoading.js"></script>
<link rel
="stylesheet" href
="css/main.css" media
="all">
<link rel
="stylesheet" href
="css/bootstrap.css">
</head>
<body>
<div class
="x-nav">
<span class
="layui-breadcrumb">
<a><cite>首页</cite></a>
<a><cite>管理员管理</cite></a>
<a><cite>管理员列表</cite></a>
</span>
<a class
="layui-btn layui-btn-small" style
="line-height:
1.6em;margin-top:3px;float:right" href
="javascript:location.replace
(location.href
);" title
="刷新"><i class
="layui-icon" style
="line-height:30px">ဂ</i></a>
</div>
<div class
="x-body">
<form class
="layui-form x-center" action
="" style
="width:80%">
<div class
="layui-form-pane" style
="margin-top:
15px;">
<div class
="layui-form-item">
<label class
="layui-form-label">日期范围</label>
<div class
="layui-input-inline">
<input class
="layui-input" placeholder
="开始日" id
="LAY_demorange_s">
</div>
<div class
="layui-input-inline">
<input class
="layui-input" placeholder
="截止日" id
="LAY_demorange_e">
</div>
<div class
="layui-input-inline">
<input type
="text" name
="username" placeholder
="请输入登录名" autocomplete
="off" class
="layui-input">
</div>
<div class
="layui-input-inline" style
="width:80px">
<button class
="layui-btn" lay-submit
="" lay-filter
="sreach"><i class
="layui-icon"></i></button>
</div>
</div>
</div>
</form>
<xblock>
<button class
="layui-btn layui-btn-danger" onclick
="delAll
()"><i class
="layui-icon"></i>批量删除</button>
<button class
="layui-btn" onclick
="admin_add
('添加用户','adminadd.html','600','
500'
)"><i class
="layui-icon"></i>添加</button>
<span class
="x-right" style
="line-height:40px">共有数据：88 条</span>
</xblock>
<table class
="layui-table">
<thead>
<tr>
<th>
<input type
="checkbox" name
="" value
="">
</th>
<th>
ID
</th>
<th>
登录名
</th>
<th>
手机
</th>
<th>
邮箱
</th>
<th>
角色
</th>
<th>
加入时间
</th>
<th>
状态
</th>
<th>
操作
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<input type
="checkbox" value
="
1" name
="">
</td>
<td>
1 </td>
<td>
admin </td>
<td >
1111111111 </td>
<td >
1111111@qq.com
</td>
<td >
</td>
<td>
1970-0
1-0
1 08:00:00 </td>
<td class
="td-status"> <span class
="layui-btn layui-btn-normal " onclick
="admin_stop
(this,'
1',0
)"> 启用 </span>
</td>
<td class
="td-manage">
<!--<a style
="text-decoration:none" onclick
="admin_stop
(this,'
1'
)" href
="javascript:;" title
="停用">
<i class
="layui-icon"></i>
</a>-->
<a title
="编辑" href
="javascript:;" onclick
="admin_edit
('编辑','adminadd.html','
1','','
510'
)"
class
="ml-
5" style
="text-decoration:none">
<i class
="layui-icon"></i>
</a>
<a title
="删除" href
="javascript:;" onclick
="admin_del
(this,'
1'
)"
style
="text-decoration:none">
<i class
="layui-icon"></i>
</a>
</td>
</tr>
<tr>
<td>
<input type
="checkbox" value
="
1" name
="">
</td>
<td>
2 </td>
<td>
admin
1 </td>
<td >
1111111111 </td>
<td >
111111111@qq.com
</td>
<td >
超级管理员 </td>
<td>
1970-0
1-0
1 08:00:00 </td>
<td class
="td-status"> <span class
="layui-btn layui-btn-normal " onclick
="admin_stop
(this,'2',0
)"> 启用 </span>
</td>
<td class
="td-manage">
<!--<a style
="text-decoration:none" onclick
="admin_stop
(this,'2'
)" href
="javascript:;" title
="停用">
<i class
="layui-icon"></i>
</a>-->
<a title
="编辑" href
="javascript:;" onclick
="admin_edit
('编辑','adminadd.html','2','','
510'
)"
class
="ml-
5" style
="text-decoration:none">
<i class
="layui-icon"></i>
</a>
<a title
="删除" href
="javascript:;" onclick
="admin_del
(this,'
1'
)"
style
="text-decoration:none">
<i class
="layui-icon"></i>
</a>
</td>
</tr>
<tr>
<td>
<input type
="checkbox" value
="
1" name
="">
</td>
<td>
3 </td>
<td>
admin2 </td>
<td >
11111111 </td>
<td >
11111111@qq.com
</td>
<td >
超级管理员 </td>
<td>
1970-0
1-0
1 08:00:00 </td>
<td class
="td-status"> <span class
="layui-btn layui-btn-normal " onclick
="admin_stop
(this,'3',0
)"> 启用 </span>
</td>
<td class
="td-manage">
<!--<a style
="text-decoration:none" onclick
="admin_stop
(this,'3'
)" href
="javascript:;" title
="停用">
<i class
="layui-icon"></i>
</a>-->
<a title
="编辑" href
="javascript:;" onclick
="admin_edit
('编辑','adminadd.html','3','','
510'
)"
class
="ml-
5" style
="text-decoration:none">
<i class
="layui-icon"></i>
</a>
<a title
="删除" href
="javascript:;" onclick
="admin_del
(this,'
1'
)"
style
="text-decoration:none">
<i class
="layui-icon"></i>
</a>
</td>
</tr>
<tr>
<td>
<input type
="checkbox" value
="
1" name
="">
</td>
<td>
4 </td>
<td>
admin </td>
<td >
1111111111 </td>
<td >
111111111@qq.com
</td>
<td >
</td>
<td>
20
19-07-20
17:03:28 </td>
<td class
="td-status"> <span class
="layui-btn layui-btn-normal " onclick
="admin_stop
(this,'4',0
)"> 启用 </span>
</td>
<td class
="td-manage">
<!--<a style
="text-decoration:none" onclick
="admin_stop
(this,'4'
)" href
="javascript:;" title
="停用">
<i class
="layui-icon"></i>
</a>-->
<a title
="编辑" href
="javascript:;" onclick
="admin_edit
('编辑','adminadd.html','4','','
510'
)"
class
="ml-
5" style
="text-decoration:none">
<i class
="layui-icon"></i>
</a>
<a title
="删除" href
="javascript:;" onclick
="admin_del
(this,'
1'
)"
style
="text-decoration:none">
<i class
="layui-icon"></i>
</a>
</td>
</tr>
<tr>
<td>
<input type
="checkbox" value
="
1" name
="">
</td>
<td>
5 </td>
<td>
admin </td>
<td >
11111111 </td>
<td >
111111111@qq.com
</td>
<td >
</td>
<td>
20
19-07-20
17:03:4
1 </td>
<td class
="td-status"> <span class
="layui-btn layui-btn-normal " onclick
="admin_stop
(this,'
5',0
)"> 启用 </span>
</td>
<td class
="td-manage">
<!--<a style
="text-decoration:none" onclick
="admin_stop
(this,'
5'
)" href
="javascript:;" title
="停用">
<i class
="layui-icon"></i>
</a>-->
<a title
="编辑" href
="javascript:;" onclick
="admin_edit
('编辑','adminadd.html','
5','','
510'
)"
class
="ml-
5" style
="text-decoration:none">
<i class
="layui-icon"></i>
</a>
<a title
="删除" href
="javascript:;" onclick
="admin_del
(this,'
1'
)"
style
="text-decoration:none">
<i class
="layui-icon"></i>
</a>
</td>
</tr>
</tbody>
</table>
<div id
="page"></div>
</div>
<script
src="lib/layui/layui.js" charset
="utf-8"></script>
<script
src="js/x-layui.js" charset
="utf-8"></script>
<script>
layui.use
(['laydate','element','laypage','layer'], function
(){
$
= layui.jquery
;//jquery
laydate
= layui.laydate
;//日期插件
lement
= layui.element
();//面包导航
laypage
= layui.laypage
;//分页
layer
= layui.layer
;//弹出层
okLoading.close
($
);
//以上模块根据需要引入
/*laypage
({
cont: 'page'
,pages:
100
,first:
1
,last:
100
,prev: '
<'
,next: '
>'
}
); */
var start
= {
min: laydate.now
()
,max: '2099-06-
16 23:
59:
59'
,istoday: false
,choose: function
(datas
){
end.min
= datas; //开始日选好后，重置结束日的最小日期
end.start
= datas //将结束日的初始值设定为开始日
}
};
var end
= {
min: laydate.now
()
,max: '2099-06-
16 23:
59:
59'
,istoday: false
,choose: function
(datas
){
start.max
= datas; //结束日选好后，重置开始日的最大日期
}
};
document.getElementById
('LAY_demorange_s'
).onclick
= function
(){
start.elem
= this;
laydate
(start
);
}
document.getElementById
('LAY_demorange_e'
).onclick
= function
(){
end.elem
= this
laydate
(end
);
}
}
);
//批量删除提交
function delAll
() {
layer.confirm
('确认要删除吗？',function
(index
){
//捉到所有被选中的，发异步进行删除
layer.msg
('删除成功', {icon:
1}
);
}
);
}
/*添加*/
function admin_add
(title,url,w,h
){
x_admin_show
(title,url,w,h
);
}
/*停用*/
function admin_stop
(obj,id,e
){
layer.confirm
(e
==1?'你确定要启用吗？':'你确定要禁用吗？',{icon: 3, title:'提示'},function
(index
){
$.ajax
({
type:"post",
url:"xxx",
data:{id:id,status:e},
dataType:"json",
success:function
(data
)
{
if
(data.status
==1){
//发异步把用户状态进行更改
$
(obj
).attr
("class","layui-btn layui-btn-danger "
);
$
(obj
).text
("隐藏"
);
$
(obj
).remove
();
layer.msg
(data.info,{icon: 6,time:
1000}
);
setTimeout
(function
(){
window.location.reload
();
},
1000
);return false;
}else{
//发异步把用户状态进行更改
$
(obj
).attr
("class","layui-btn layui-btn-normal "
);
$
(obj
).text
("显示"
);
$
(obj
).remove
();
layer.msg
(data.info,{icon:
5,time:
1000}
);return false;
}
}
}
);
}
);
}
/*启用*/
function admin_start
(obj,id
){
layer.confirm
('确认要启用吗？',function
(index
){
//发异步把用户状态进行更改
$
(obj
).parents
("tr"
).find
(".td-manage"
).prepend
('<a style
="text-decoration:none" onClick
="admin_stop
(this,id
)" href
="javascript:;" title
="停用"><i class
="layui-icon"></i></a>'
);
$
(obj
).parents
("tr"
).find
(".td-status"
).html
('<span class
="layui-btn layui-btn-normal layui-btn-mini">已启用</span>'
);
$
(obj
).remove
();
layer.msg
('已启用!',{icon: 6,time:
1000}
);
}
);
}
//编辑
function admin_edit
(title,url,id,w,h
) {
url
= url+"?id
="+id;
x_admin_show
(title,url,w,h
);
}
/*删除*/
function admin_del
(obj,id
){
layer.confirm
('确认要删除吗？',function
(index
){
//发异步删除数据
$
(obj
).parents
("tr"
).remove
();
layer.msg
('已删除!',{icon:
1,time:
1000}
);
}
);
}
</script>
</body>
</html>，这是我的admin.js:// js/admin.js
const AdminManager
= {
// 获取所有管理员
getAll: function
() {
return JSON.parse
(localStorage.getItem
('admins'
)) || [];
},
// 保存所有管理员
saveAll: function
(admins
) {
localStorage.setItem
('admins', JSON.stringify
(admins
));
},
// 获取单个管理员
getById: function
(id
) {
return this.getAll
().find
(item
=> item.id
== id
);
},
// 添加或更新管理员
save: function
(admin
) {
let admins
= this.getAll
();
if
(admin.id
) {
// 更新
const index
= admins.findIndex
(a
=> a.id
== admin.id
);
if
(index !
== -
1) {
admins[index]
= admin;
}
} else {
// 新增
admin.id
= this.generateId
();
admin.create_time
= new Date
().toLocaleString
();
admins.push
(admin
);
}
this.saveAll
(admins
);
return admin;
},
// 删除管理员
delete: function
(id
) {
let admins
= this.getAll
().filter
(a
=> a.id !
= id
);
this.saveAll
(admins
);
},
// 生成ID
generateId: function
() {
const admins
= this.getAll
();
return admins.length > 0 ? Math.max
(...admins.map
(a
=> a.id
)) +
1 :
1;
}
}为什么运行出来添加删除键点了没反应，能帮帮我吗
本文深入探讨了敏感代码注入漏洞的危害及防范措施，详细解释了如何通过输入验证、使用参数化查询、限制用户权限等方式保护网站安全。重点强调了在实际应用中实施这些策略的重要性，为开发者提供了一套全面的防御方案。
扫一扫
597
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
