ADD file via upload

master
pqu3f57g4 2 years ago
parent b7254b0c2d
commit b2097c6169

@ -0,0 +1,469 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v-bind="http://www.w3.org/1999/xhtml"
xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="content-type" content="no-cache, must-revalidate" />
<meta http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT"/>
<title>笔记信息</title>
<link href="../css/bootstrap.min.css" rel="stylesheet"/>
<link href="../css/font-awesome.css" rel="stylesheet"/>
<link href="../css/basic.css" rel="stylesheet"/>
<link href="../css/custom.css" rel="stylesheet"/>
<link href="../css/my.css" rel="stylesheet"/>
<link href="../css/quill.snow.css" rel="stylesheet">
<link href="../css/element/index.css" rel="stylesheet"/>
<style>
[v-cloak] {
display: none;
}
.ql-snow .ql-editor img {
width: 400px;
}
</style>
</head>
<body>
<div id="wrapper" v-cloak>
<nav class="navbar navbar-default navbar-cls-top " role="navigation" style="margin-bottom: 0">
<div class="navbar-header">
<a class="navbar-brand" href="index.html">后端管理系统</a>
</div>
<div class="header-right">
<a href="javascript:void(0)" class="btn btn-info" @click="logout" title="退出登录">
<i class="fa fa-sign-out fa-2x"></i>
</a>
</div>
<div class="header-right">
<a href="javascript:void(0)" class="btn btn-info" title="跳转到个人信息" @click="personalPage">
<i class="fa fa-user fa-2x"></i>
</a>
</div>
<div class="header-right" style="padding-top: 25px">欢迎你,{{ user.name }}</div>
<div class="header-left">
<a href="/front/index.html" class="btn btn-info" title="跳转到首页">
<i class="fa fa-dot-circle-o fa-2x"></i>
</a>
</div>
</nav>
<!-- /. NAV TOP -->
<nav class="navbar-default navbar-side" role="navigation">
<div class="sidebar-collapse">
<ul class="nav" id="main-menu">
<li>
<a href="index.html"><i class="fa fa-dashboard "></i>系统首页</a>
</li>
<li>
<a href="#"><i class="fa fa-yelp "></i>信息展示 <span class="fa arrow"></span></a>
<ul class="nav nav-second-level collapse in">
<li v-if="authority.indexOf(1) != -1">
<a href="adminInfo.html"><i class="fa fa-table"></i>管理员信息</a>
</li>
<li v-if="authority.indexOf(2) != -1">
<a href="userInfo.html"><i class="fa fa-table"></i>用户信息</a>
</li>
<li v-if="authority.indexOf(3) != -1">
<a href="classifyInfo.html"><i class="fa fa-table"></i>菜谱大类信息</a>
</li>
<li v-if="authority.indexOf(4) != -1">
<a href="subClassifyInfo.html"><i class="fa fa-table"></i>菜谱小类信息</a>
</li>
<li v-if="authority.indexOf(5) != -1">
<a href="foodsMenuInfo.html"><i class="fa fa-table"></i>菜谱信息</a>
</li>
<li v-if="authority.indexOf(6) != -1">
<a href="foodsMaterialInfo.html"><i class="fa fa-table"></i>食材信息</a>
</li>
<li v-if="authority.indexOf(7) != -1">
<a href="collectInfo.html"><i class="fa fa-table"></i>收藏信息</a>
</li>
<li v-if="authority.indexOf(8) != -1">
<a href="praiseInfo.html"><i class="fa fa-table"></i>笔记点赞信息</a>
</li>
<li v-if="authority.indexOf(9) != -1">
<a href="notesInfo.html" class="active-menu"><i class="fa fa-table"></i>笔记信息</a>
</li>
<li v-if="authority.indexOf(10) != -1">
<a href="newsInfo.html"><i class="fa fa-table"></i>饮食资讯信息</a>
</li>
<li v-if="authority.indexOf(1000001) != -1">
<a href="advertiserInfo.html"><i class="fa fa-table"></i>公告信息</a>
</li>
<li v-if="authority.indexOf(1000002) != -1">
<a href="messageInfo.html"><i class="fa fa-table"></i>趣味答题信息</a>
</li>
<li>
<a href="javascript:void(0)" @click="personalPage"><i class="fa fa-user"></i>个人信息</a>
</li>
</ul>
</li>
<li>
<a href="notesInfoComment.html"><i class="fa fa-file"></i>笔记信息评论</a>
</li>
<li>
<a href="updatePassword.html"><i class="fa fa-unlock-alt"></i>修改密码</a>
</li>
<li>
<a href="javascript:void(0)" @click="logout"><i class="fa fa-power-off"></i>退出登录</a>
</li>
</ul>
</div>
</nav>
<div id="page-wrapper">
<div id="page-inner">
<div class="row">
<div class="col-md-12">
<h1 class="page-subhead-line">这里是笔记信息信息,管理员可以对公告信息进行修改。</h1>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
笔记信息
</div>
<div class="panel-body">
<div class="table-responsive">
<div class="nx-table-header">
<button class="btn btn-sm btn-primary" @click="add()">新增</button>
<input type="text" placeholder="请输入搜索内容" v-model="name" @keyup.enter="loadTable(1)">
<i class="glyphicon glyphicon-search"></i>
</div>
<table class="table table-striped table-bordered table-hover">
<thead>
<tr>
<th>ID</th>
<th>名称</th>
<th>上传时间</th>
<th>姓名</th>
<th>审核状态</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr v-for="(obj,index) in tableData" :key="obj.id">
<td>{{obj.id}}</td>
<td>{{obj.name}}</td>
<td>{{obj.time}}</td>
<td>{{obj.userName}}</td>
<td>{{obj.statusDesc}}</td>
<td>
<button class="btn btn-success btn-xs" @click="edit(obj)">编辑</button>
<button class="btn btn-danger btn-xs" @click="del(obj.id)">删除</button>
<button class="btn btn-primary btn-xs" @click="check(obj.id, 1)" v-if="user.level===1">通过</button>
<button class="btn btn-warning btn-xs" @click="check(obj.id, 2)" v-if="user.level===1">驳回</button>
</td>
</tr>
</tbody>
</table>
<nav aria-label="Page navigation example">
<ul class="pagination">
<li class="page-item" v-bind:class="{ disabled: preActive }">
<a class="page-link" href="javascript:void(0)"
v-on:click="loadTable(pageInfo.pageNum - 1)">上一页</a>
</li>
<li class="page-item">
<a class="page-link" href="javascript:void(0)" v-if="pageInfo.pageNum > 1" v-on:click="loadTable(pageInfo.pageNum - 1)">{{pageInfo.pageNum - 1}}</a>
</li>
<li class="page-item disabled">
<a class="page-link" aria-disabled="true" href="javascript:void(0)">{{pageInfo.pageNum}}</a>
</li>
<li class="page-item">
<a class="page-link" href="javascript:void(0)" v-if="pageInfo.hasNextPage" v-on:click="loadTable(pageInfo.pageNum + 1)">{{pageInfo.pageNum + 1}}</a>
</li>
<li class="page-item" v-bind:class="{ disabled: nextActive }">
<a class="page-link" href="javascript:void(0)" v-on:click="loadTable(pageInfo.hasNextPage? (pageInfo.pageNum + 1) : pageInfo.pageNum)">下一页</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" id="closeBtn" aria-label="Close"><span
aria-hidden="true">&times;</span></button>
请填写信息
</div>
<div class="modal-body">
<input type="text" id="modal-id" style="display: none">
<div class="form-group" style="margin-bottom: 40px;display: flex;align-items: center;">
<label class="col-sm-3 control-label">名称</label>
<div class="col-sm-7">
<input type="text" class="form-control" v-model="entity.name" placeholder="请输入名称" id="name">
</div>
</div>
<div class="form-group" style="margin-bottom: 40px;display: flex;align-items: center;">
<label class="col-sm-3 control-label">上传时间</label>
<div class="col-sm-7">
<input type="datetime-local" id="time" />
</div>
</div>
<div class="form-group" style="margin-bottom: 40px;display: flex;align-items: center;">
<label class="col-sm-3 control-label">上传用户</label>
<div class="col-sm-7">
<select class="form-control" id="userInfo">
<option value="" name="">请选择</option>
</select>
</div>
</div>
<div id="editor" style="min-height: 300px"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" id="cancelBtn">取消</button>
<button type="button" id="saveBtn" class="btn btn-primary">保存</button>
</div>
</div>
</div>
</div>
<script src="../js/jquery-1.10.2.js"></script>
<script src="../js/bootstrap.min.js"></script>
<script src="../js/jquery.metisMenu.js"></script>
<script src="../js/custom.js"></script>
<script src="../js/my.js"></script>
<script src="../js/vue2.6.11/vue.min.js"></script>
<script src="../js/vue2.6.11/axios.js"></script>
<script src="../js/quill.js"></script>
<script src="../js/element/index.js"></script>
<!--文件上传js-->
<script>
function msg(type, msg) {
Vue.prototype.$message({
type: type, // success成功、warning警告, error(错误)
message: msg,
duration: 2000,
offset: 100,
center: true,
})
}
let quill = new Quill('#editor', {
theme: 'snow',
modules: {
toolbar: {
container: [
[{'header': [1, 2, 3, 4, 5, 6, false]}], // 标题字体
[{'font': []}], // 字体
['bold', 'italic', 'underline', 'strike'], // 切换按钮
[{'align': []}], // 对齐方式
['blockquote', 'code-block'], // 文本块/代码块
[{'header': 1}, {'header': 2}], // 用户自定义按钮值
[{'list': 'ordered'}, {'list': 'bullet'}], // 有序/无序列表
[{'indent': '-1'}, {'indent': '+1'}], // 减少缩进/缩进
[{'color': []}, {'background': []}], // 主题默认下拉,使用主题提供的值
['clean'], // 清除格式
['image', 'link', 'video'] // 图片 / 链接 / 视频
]
}
}
});
let wrapper = new Vue({
el: '#wrapper',
data: {
user: {},
name: '',
entity: {},
authority: [],
permission: [],
tableData: [],
pageInfo: {},
preActive: true,
nextActive: true,
modalData: {}
},
created: function () {
this.user = JSON.parse(localStorage.getItem('user'));
this.loadTable(1);
axios.get("/permission/9").then(res => {
if (res.data.code === '0') {
this.permission = res.data.data;
} else {
msg('error', res.data.msg);
}
});
axios.get("/authority").then(res => {
if (res.data.code === '0') {
this.authority = res.data.data;
} else {
msg('error', res.data.msg);
}
});
this.entity.userId = 0;
axios.get("/userInfo").then(res => {
if (res.data.code === '0') {
let list = res.data.data;
list.forEach(item => {
$('#userInfo').append('<option value="'+item.id+'" name="'+item.name+'">'+item.name+'</option>');
})
} else {
msg('error', res.data.msg);
}
});
},
methods: {
loadTable(pageNum) {
let name = this.name === '' ? "all" : this.name;
let url = "/notesInfo/page/" + name + "?pageNum=" + pageNum;
if(this.user.level !== 1) {
url += "&userId=" + this.user.id;
}
axios.get(url).then(res => {
if (res.data.code === '0') {
this.tableData = res.data.data.list;
for (const item of this.tableData) {
if(item.status === 0) {
item.statusDesc = '未审核';
} else if (item.status === 1) {
item.statusDesc = '通过';
} else {
item.statusDesc = '驳回';
}
}
this.pageInfo = res.data.data;
this.preActive = !(this.pageInfo.hasPreviousPage);
this.nextActive = !(this.pageInfo.hasNextPage);
} else {
msg('error', res.data.msg);
}
});
},
add() {
if (this.permission.indexOf(1) === -1) {
msg('warning', '你没有权限操作');
return;
}
$('#modal-id').val('');
$('#name').val();
$('#time').val();
$('#userInfo').val();
this.entity = {};
quill.root.innerHTML = '';
$('#myModal').modal('show');
},
edit(data) {
if (this.permission.indexOf(3) === -1) {
msg('warning', '你没有权限操作');
return;
}
$('#modal-id').val(data.id);
$('#name').val(data.name);
$('#time').val(data.time);
$('#userInfo').val(data.userId);
quill.root.innerHTML = data.content;
$('#myModal').modal('show');
},
del(id) {
if (this.permission.indexOf(2) === -1) {
msg('warning', '你没有权限操作');
return;
}
this.$confirm('确认删除?', '系统提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
cancelButtonClass: 'btn-custom-cancel',
type: 'warning'
}).then(function(){
axios.delete('/notesInfo/' + id).then(res => {
if (res.data.code === '0') {
msg('success', '删除成功');
wrapper.loadTable(1);
} else {
msg('error', res.data.msg);
}
});
}).catch(function() {
console.log("取消成功!");
});
},
check(id, status) {
const data = {id: id, status: status};
axios.put('/notesInfo', data).then(res => {
if (res.data.code === '0') {
msg('success', '审核成功');
wrapper.loadTable(1);
} else {
msg('error', res.data.msg);
}
});
},
logout() {
logout();
}
}
});
$('#saveBtn').click(function () {
let entity = wrapper.$data.entity;
entity.content = quill.root.innerHTML;
entity.name = $('#name').val();
entity.time = $('#time').val();
entity.userId = $('#userInfo').val();
if (!$('#modal-id').val()) {
axios.post(
"/notesInfo", entity
).then(res => {
if (res.data.code === '0') {
msg('success', '添加成功');
wrapper.loadTable(1);
} else {
msg('error', res.data.msg);
}
})
} else {
entity.id = $('#modal-id').val();
axios.put(
"/notesInfo", entity
).then(res => {
if (res.data.code === '0') {
msg('success', '更新成功');
wrapper.loadTable(1);
} else {
msg('error', res.data.msg);
}
})
}
$('iframe.ql-video').attr('src', ''); // 清空视频iframe的src属性可关闭视频
$('#myModal').modal('hide');
});
$('#cancelBtn').click(function () {
$('#myModal').modal('hide');
$('iframe.ql-video').attr('src', '') // 清空视频iframe的src属性可关闭视频
});
$('#closeBtn').click(function () {
$('#myModal').modal('hide');
$('iframe.ql-video').attr('src', '') // 清空视频iframe的src属性可关闭视频
})
</script>
</body>
</html>
Loading…
Cancel
Save