252 lines
		
	
	
		
			9.4 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
			
		
		
	
	
			252 lines
		
	
	
		
			9.4 KiB
		
	
	
	
		
			PHP
		
	
	
	
	
	
| <?php /*a:2:{s:57:"E:\Demo\PHP\yunzer\app\admin\view\article\articlelist.php";i:1747323773;s:51:"E:\Demo\PHP\yunzer\app\admin\view\public\header.php";i:1746890051;}*/ ?>
 | |
| <!DOCTYPE html>
 | |
| <html>
 | |
| 	<head>
 | |
| 		<title><?php echo htmlentities((string) $config['admin_name']); ?></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.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
 | |
| 		<link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css" media="all"/>
 | |
| 		<link rel="stylesheet" type="text/css" href="/static/css/moban.css" media="all"/>
 | |
| 		<link rel="stylesheet" type="text/css" href="/static/css/wangeditor.css" media="all"/>
 | |
| 		<style type="text/css">
 | |
| 			.header span{background:#009688;margin-left:30px;padding:10px;color:#ffffff;}
 | |
| 			.header div{border-bottom:solid 2px #009688;margin-top: 8px;}
 | |
| 			.header button{float:right;margin-top:-5px;}
 | |
| 			.pagination {
 | |
| 				display: inline-block;
 | |
| 				padding-left: 0;
 | |
| 				margin: 20px 0;
 | |
| 				border-radius: 4px;
 | |
| 			}
 | |
| 			.pagination > li {
 | |
| 				display: inline;
 | |
| 			}
 | |
| 			.pagination > li > a,
 | |
| 			.pagination > li > span {
 | |
| 				position: relative;
 | |
| 				float: left;
 | |
| 				padding: 6px 12px;
 | |
| 				margin-left: -1px;
 | |
| 				line-height: 1.42857143;
 | |
| 				color: #337ab7;
 | |
| 				text-decoration: none;
 | |
| 				background-color: #fff;
 | |
| 				border: 1px solid #ddd;
 | |
| 			}
 | |
| 			.pagination > li:first-child > a,
 | |
| 			.pagination > li:first-child > span {
 | |
| 				margin-left: 0;
 | |
| 				border-top-left-radius: 4px;
 | |
| 				border-bottom-left-radius: 4px;
 | |
| 			}
 | |
| 			.pagination > li:last-child > a,
 | |
| 			.pagination > li:last-child > span {
 | |
| 				border-top-right-radius: 4px;
 | |
| 				border-bottom-right-radius: 4px;
 | |
| 			}
 | |
| 			.pagination > li > a:hover,
 | |
| 			.pagination > li > span:hover,
 | |
| 			.pagination > li > a:focus,
 | |
| 			.pagination > li > span:focus {
 | |
| 				z-index: 2;
 | |
| 				color: #23527c;
 | |
| 				background-color: #eee;
 | |
| 				border-color: #ddd;
 | |
| 			}
 | |
| 			.pagination > .active > a,
 | |
| 			.pagination > .active > span,
 | |
| 			.pagination > .active > a:hover,
 | |
| 			.pagination > .active > span:hover,
 | |
| 			.pagination > .active > a:focus,
 | |
| 			.pagination > .active > span:focus {
 | |
| 				z-index: 3;
 | |
| 				color: #fff;
 | |
| 				cursor: default;
 | |
| 				background-color: #337ab7;
 | |
| 				border-color: #337ab7;
 | |
| 			}
 | |
| 			.pagination > .disabled > span,
 | |
| 			.pagination > .disabled > span:hover,
 | |
| 			.pagination > .disabled > span:focus,
 | |
| 			.pagination > .disabled > a,
 | |
| 			.pagination > .disabled > a:hover,
 | |
| 			.pagination > .disabled > a:focus {
 | |
| 				color: #777;
 | |
| 				cursor: not-allowed;
 | |
| 				background-color: #fff;
 | |
| 				border-color: #ddd;
 | |
| 			}
 | |
| 			.close-img { background: url(/static/images/close_img.png); background-size: 20px 20px; width:20px; height: 20px; position: absolute; right: 5px; top: 5px; z-index: 2;}
 | |
| 		</style>
 | |
| 		<script type="text/javascript" src="/static/layui/layui.js"></script>
 | |
| 		<script type="text/javascript">
 | |
| 			layui.use(['layer','form','table','laydate','element','upload'],function(){
 | |
| 				layer = layui.layer;		// layui 弹框
 | |
| 				form = layui.form;			// layui form表单
 | |
| 				table = layui.table;		// layui 表格
 | |
| 				laydate = layui.laydate;	// layui 时间框
 | |
| 				element = layui.element;	// layui element
 | |
| 				upload = layui.upload;		// layui 上传
 | |
| 				$ = layui.jquery;			// layui jquery
 | |
| 			})
 | |
| 		</script>
 | |
| 	</head>
 | |
| 	<body style="padding:10px; box-sizing: border-box;">
 | |
| <div class="config-container">
 | |
|     <div class="config-header" style="display:flex;justify-content: space-between;">
 | |
|         <div style="display: flex; align-items: center;">
 | |
|             <span>文章列表</span>
 | |
|             <div class="shaixuan">
 | |
|                 <label>筛选:</label>
 | |
|                 <div class="layui-form">
 | |
|                     <div class="layui-input-inline">
 | |
|                         <select id="categoryFilter" lay-filter="categoryFilter" lay-verify="">
 | |
|                             <option value="">全部分类</option>
 | |
|                             <?php if(is_array($categories) || $categories instanceof \think\Collection || $categories instanceof \think\Paginator): $i = 0; $__LIST__ = $categories;if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$category): $mod = ($i % 2 );++$i;?>
 | |
|                             <optgroup label="<?php echo htmlentities((string) $category['name']); ?>">
 | |
|                                 <?php if(is_array($category['children']) || $category['children'] instanceof \think\Collection || $category['children'] instanceof \think\Paginator): $i = 0; $__LIST__ = $category['children'];if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$subCategory): $mod = ($i % 2 );++$i;?>
 | |
|                                 <option value="<?php echo htmlentities((string) $subCategory['id']); ?>"><?php echo htmlentities((string) $subCategory['name']); ?></option>
 | |
|                                 <?php endforeach; endif; else: echo "" ;endif; ?>
 | |
|                             </optgroup>
 | |
|                             <?php endforeach; endif; else: echo "" ;endif; ?>
 | |
|                         </select>
 | |
|                     </div>
 | |
|                 </div>
 | |
|             </div>
 | |
|         </div>
 | |
|         <div>
 | |
|             <button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="add()">
 | |
|                 <i class="layui-icon layui-icon-add-1"></i>添加
 | |
|             </button>
 | |
|             <button type="button" class="layui-btn layui-btn-sm layui-btn-primary" onclick="refresh()">
 | |
|                 <i class="layui-icon layui-icon-refresh"></i>刷新
 | |
|             </button>
 | |
|         </div>
 | |
|     </div>
 | |
| 
 | |
|     <table id="articleTable" lay-filter="articleTable"></table>
 | |
| </div>
 | |
| 
 | |
| <script type="text/html" id="imageTemplate">
 | |
|     {{#  if(d.image){ }}
 | |
|     <img src="{{ d.image }}" style="max-width: 50px; max-height: 50px;">
 | |
|     {{#  } }}
 | |
| </script>
 | |
| 
 | |
| <script type="text/html" id="statusTemplate">
 | |
|     {{#  if(d.status === 0){ }}
 | |
|     <span style="color:red;">草稿</span>
 | |
|     {{#  } else if(d.status === 1){ }}
 | |
|     <span style="color:orange;">待审核</span>
 | |
|     {{#  } else if(d.status === 2){ }}
 | |
|     <span style="color:green;">已发布</span>
 | |
|     {{#  } else if(d.status === 3){ }}
 | |
|     <span style="color:gray;">隐藏</span>
 | |
|     {{#  } }}
 | |
| </script>
 | |
| 
 | |
| <script type="text/html" id="operationBar">
 | |
|     <button type="button" class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">
 | |
|         <i class="layui-icon layui-icon-edit"></i>编辑
 | |
|     </button>
 | |
|     <button type="button" class="layui-btn layui-btn-primary layui-btn-xs" lay-event="del">
 | |
|         <i class="layui-icon layui-icon-delete"></i>删除
 | |
|     </button>
 | |
| </script>
 | |
| 
 | |
| <script type="text/javascript">
 | |
|     layui.use(['layer', 'form', 'table'], function () {
 | |
|         var layer = layui.layer;
 | |
|         var $ = layui.jquery;
 | |
|         var form = layui.form;
 | |
|         var table = layui.table;
 | |
|         
 | |
|         // 初始化表格
 | |
|         table.render({
 | |
|             elem: '#articleTable',
 | |
|             url: '/admin/article/articlelist',
 | |
|             method: 'post',
 | |
|             cols: [[
 | |
|                 {field: 'id', title: 'ID', align:'center', width: 80},
 | |
|                 {field: 'title', title: '标题'},
 | |
|                 {field: 'cate', title: '分类', align:'center', width: 180},
 | |
|                 {field: 'image', title: '封面', templet: '#imageTemplate', align:'center', width: 180},
 | |
|                 {field: 'author', title: '作者', align:'center', width: 120},
 | |
|                 {field: 'status', title: '状态', templet: '#statusTemplate', align:'center', width: 80},
 | |
|                 {field: 'publishdate', title: '发布时间', align:'center', width: 180},
 | |
|                 {title: '操作', toolbar: '#operationBar', align:'center', width: 150}
 | |
|             ]],
 | |
|             page: true,
 | |
|             limit: 20,
 | |
|             limits: [10, 20, 30, 50],
 | |
|             //height: 'full-220'
 | |
|         });
 | |
|         
 | |
|         // 监听工具条事件
 | |
|         table.on('tool(articleTable)', function(obj){
 | |
|             var data = obj.data;
 | |
|             if(obj.event === 'edit'){
 | |
|                 edit(data.id);
 | |
|             } else if(obj.event === 'del'){
 | |
|                 del(data.id);
 | |
|             }
 | |
|         });
 | |
| 
 | |
|         // 监听分类筛选变化
 | |
|         form.on('select(categoryFilter)', function(data){
 | |
|             filterByCategory(data.value);
 | |
|         });
 | |
|     });
 | |
| 
 | |
|     function filterByCategory(categoryId) {
 | |
|         if (!categoryId) {
 | |
|             layui.table.reload('articleTable', {
 | |
|                 where: {},
 | |
|                 page: {
 | |
|                     curr: 1
 | |
|                 }
 | |
|             });
 | |
|             return;
 | |
|         }
 | |
| 
 | |
|         var categoryName = $('#categoryFilter option[value="' + categoryId + '"]').text();
 | |
|         layui.table.reload('articleTable', {
 | |
|             where: {
 | |
|                 category: categoryName
 | |
|             },
 | |
|             page: {
 | |
|                 curr: 1
 | |
|             }
 | |
|         });
 | |
|     }
 | |
| 
 | |
|     function add() {
 | |
|         window.location.href = '/admin/article/add';
 | |
|     }
 | |
| 
 | |
|     function edit(id) {
 | |
|         window.location.href = '/admin/article/edit?id=' + id;
 | |
|     }
 | |
| 
 | |
|     function del(id) {
 | |
|         layer.confirm('确定要删除该文章吗?', {
 | |
|             btn: ['确定', '取消']
 | |
|         }, function () {
 | |
|             $.post('/admin/article/delete', { id: id }, function (res) {
 | |
|                 if (res.code == 0) {
 | |
|                     layer.msg(res.msg, { icon: 1 });
 | |
|                     setTimeout(function () {
 | |
|                         layui.table.reload('articleTable');
 | |
|                     }, 1000);
 | |
|                 } else {
 | |
|                     layer.msg(res.msg, { icon: 2 });
 | |
|                 }
 | |
|             });
 | |
|         });
 | |
|     }
 | |
| 
 | |
|     function refresh() {
 | |
|         layui.table.reload('articleTable');
 | |
|     }
 | |
| </script>
 | 
