Community Learn Tools Library Leisure
search
English
Home > List of blog posts > 后台八 文章分类
Blogger Information
Blog 41
fans 0
comment 0
visits 25309
Special Recommendation
More>
Related recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
后台八 文章分类
自由之上
Original
682 people have browsed it

一、文章分类 数据库

1、创建 文章分类数据表并填充数据

  1. #【新建】文章分类表
  2. DROP TABLE IF EXISTS `article_cate`;
  3. CREATE TABLE `article_cate` (
  4.   `id` int(10) NOT NULL AUTO_INCREMENT,
  5.   `pid` int(10) NOT NULL DEFAULT '0',
  6.   `title` varchar(255) NOT NULL DEFAULT '' COMMENT '分类名称',
  7.   PRIMARY KEY (`id`)
  8. ) ENGINE=MyISAM AUTO_INCREMENT=9 DEFAULT CHARSET=utf8;
  10. #【插入】 文章分类表
  11. INSERT INTO `article_cate` VALUES ('1', '0', '视频');
  12. INSERT INTO `article_cate` VALUES ('2', '1', '热点');
  13. INSERT INTO `article_cate` VALUES ('3', '0', '社会');
  14. INSERT INTO `article_cate` VALUES ('4', '2', '娱乐');
  15. INSERT INTO `article_cate` VALUES ('5', '0', '军事');

" class="reference-link">

二、文章分类 模块

1、创建 文章分类列表 视图模板

2、编辑 文章分类列表 视图模板


resources/views/admins/article/cates.blade.php

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title>文章分类列表</title>
  5.     <link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css">
  6.     <script type="text/javascript" src="/static/layui/layui.js"></script>
  7. </head>
  8. <body style="padding: 10px;">
  9. <div style="text-align: right;">
  10.     <button class="layui-btn layui-btn-sm" onclick="add()"><i class="layui-icon layui-icon-addition"></i>添加</button>
  11. </div>
  12. <table class="layui-table">
  13.     <thead>
  14.     <tr>
  15.         <th>ID</th>
  16.         <th>分类名称</th>
  17.         <th>操作</th>
  18.     </tr>
  19.     </thead>
  20.     <tbody>
  21.     @foreach($lists as $item)
  22.         <tr>
  23.             <td>{{$item['id']}}</td>
  24.             <td>{{$item['title']}}</td>
  25.             <td>
  26.                 <button class="layui-btn layui-btn-xs" onclick="edit({{$item['id']}})">修改</button>
  27.             </td>
  28.         </tr>
  29.     @endforeach
  30.     </tbody>
  31. </table>
  32. </body>
  33. </html>
  34. <script type="text/javascript">
  35.     layui.use(['layer'], function () {
  36.         $ = layui.jquery;
  37.         layer = layui.layer;
  38.     });
  40.     // 添加文章分类
  41.     function add() {
  42.         layer.open({
  43.             type: 2,
  44.             title: '添加文章分类',
  45.             shade: 0.3,
  46.             area: ['450px', '200px;'],
  47.             content: '/admins/article/add_cates'
  48.         });
  49.     }
  51.     // 修改文章分类
  52.     function edit(cid) {
  53.         layer.open({
  54.             type: 2,
  55.             title: '修改文章分类',
  56.             shade: 0.3,
  57.             area: ['450px', '200px'],
  58.             content: '/admins/article/edit_cates?cid=' + cid
  59.         });
  60.     }
  61. </script>

3、创建 文章分类 控制器

4、编辑 文章分类 控制器

app/Http/Controllers/admins/Article.php

  1. <?php
  3. namespace App\Http\Controllers\admins;
  5. use App\Http\Controllers\Controller;
  7. /**
  8.  * 文章管理 控制器
  9.  * @package App\Http\Controllers\admins
  10.  */
  11. class Article extends Controller {
  13. }

5、文章分类列表 控制器处理

app/Http/Controllers/admins/Article.php

  1.     // 分类列表
  2.     public function cates() {
  3.         $data['lists'] = DB::table('article_cate')->lists();
  4.         return view('/admins/article/cates', $data);
  5.     }

6、文章分类列表 路由注册

routes/web.php

  1. use App\Http\Controllers\admins\Article;
  3. //显示文章分类列表
  4. Route::get('/admins/article/cates',[Article::class, 'cates']);

7、查看效果

三、文章分类添加与保存 模块

1、创建 文章分类添加与保存 视图模板

2、编辑 文章分类添加与保存 视图模板


resources/views/admins/article/add_cates.blade.php

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.    <title>添加分类</title>
  5.    <link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css">
  6.    <script type="text/javascript" src="/static/layui/layui.js"></script>
  7. </head>
  8. <body style="padding: 10px;">
  9.    <div class="layui-form">
  10.       @csrf
  11.       <div class="layui-form-item">
  12.          <label class="layui-form-label">分类名称</label>
  13.          <div class="layui-input-block">
  14.             <input type="text" class="layui-input" name="title">
  15.          </div>
  16.       </div>
  17.       <div class="layui-input-block">
  18.          <button class="layui-btn" onclick="save()">保存</button>
  19.       </div>
  20.    </div>
  21. </body>
  22. </html>
  23. <script type="text/javascript">
  24.    layui.use(['layer'],function(){
  25.       layer = layui.layer;
  26.       $ = layui.jquery;
  27.    });
  29.    function save(){
  30.       var title = $('input[name="title"]').val();
  31.       var _token = $('input[name="_token"]').val();
  32.       if(title==''){
  33.          return layer.alert('请输入分类名称',{icon:2});
  34.       }
  35.       $.post('/admins/article/save_cates',{title:title,_token:_token},function(res){
  36.          if(res.code>0){
  37.             return layer.alert(res.msg,{icon:2});
  38.          }
  39.          layer.msg(res.msg);
  40.          setTimeout(function(){parent.window.location.reload();},1000);
  41.       },'json');
  42.    }
  43. </script>

3、文章分类添加与保存 控制器处理

app/Http/Controllers/admins/Article.php

  1. // 添加分类
  2.     public function add_cates() {
  3.         return view('/admins/article/add_cates');
  4.     }
  6.     // 保存分类
  7.     public function save_cates(Request $req) {
  8.         $title = trim($req->title);
  9.         // 查看一下有没有重复的分类
  10.         $item = DB::table('article_cate')->where('title', $title)->item();
  11.         if ($item) {
  12.             return json_encode(array('code' => 1, 'msg' => '该分类已存在'));
  13.         }
  14.         DB::table('article_cate')->insert(['title' => $title]);
  15.         return json_encode(array('code' => 0, 'msg' => '保存成功'));
  16.     }

4、文章分类添加与保存 路由注册

  1.     //添加文章分类 弹窗
  2.     Route::get('/admins/article/add_cates',[Article::class, 'add_cates']);
  3.     //保存文章分类 处理
  4.     Route::post('/admins/article/save_cates',[Article::class, 'save_cates']);

5、查看效果

四、文章分类编辑与保存编辑 模块

1、创建 文章分类编辑与保存编辑 视图模板

2、编辑 文章分类编辑与保存编辑 视图模板


resources/views/admins/article/edit_cates.blade.php

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title>修改分类</title>
  5.     <link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css">
  6.     <script type="text/javascript" src="/static/layui/layui.js"></script>
  7. </head>
  8. <body style="padding: 10px;">
  9. <div class="layui-form">
  10.     @csrf
  11.     <input type="hidden" name="cid" value="{{$item['id']}}">
  12.     <div class="layui-form-item">
  13.         <label class="layui-form-label">分类名称</label>
  14.         <div class="layui-input-block">
  15.             <input type="text" class="layui-input" name="title" value="{{$item['title']}}">
  16.         </div>
  17.     </div>
  18.     <div class="layui-input-block">
  19.         <button class="layui-btn" onclick="save()">保存</button>
  20.     </div>
  21. </div>
  22. </body>
  23. </html>
  24. <script type="text/javascript">
  25.     layui.use(['layer'],function(){
  26.         layer = layui.layer;
  27.         $ = layui.jquery;
  28.     });
  30.     function save(){
  31.         var cid = $('input[name="cid"]').val();
  32.         var title = $('input[name="title"]').val();
  33.         var _token = $('input[name="_token"]').val();
  34.         if(title==''){
  35.             return layer.alert('请输入分类名称',{icon:2});
  36.         }
  37.         $.post('/admins/article/save_edit_cates',{cid:cid,title:title,_token:_token},function(res){
  38.             if(res.code>0){
  39.                 return layer.alert(res.msg,{icon:2});
  40.             }
  41.             layer.msg(res.msg);
  42.             setTimeout(function(){parent.window.location.reload();},1000);
  43.         },'json');
  44.     }
  45. </script>

3、文章分类编辑与保存编辑 控制器处理

  1. // 修改分类
  2.     public function edit_cates(Request $req) {
  3.         $cid = (int)$req->cid;
  4.         $data['item'] = DB::table('article_cate')->where('id', $cid)->item();
  5.         return view('/admins/article/edit_cates', $data);
  6.     }
  8.     // 保存修改分类
  9.     public function save_edit_cates(Request $req) {
  10.         $cid = (int)$req->cid;
  11.         $title = trim($req->title);
  12.         DB::table('article_cate')->where('id', $cid)->update(['title' => $title]);
  13.         return json_encode(array('code' => 0, 'msg' => '保存成功'));
  14.     }

4、文章分类编辑与保存编辑 注册路由

routes/web.php

  1. //编辑文章分类 弹窗
  2.     Route::get('/admins/article/edit_cates',[Article::class, 'edit_cates']);
  3.     //保存编辑文章分类 处理
  4.     Route::post('/admins/article/save_edit_cates',[Article::class, 'save_edit_cates']);

5、查看效果

Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post