博客列表 >后台八 文章分类

后台八 文章分类

自由之上
自由之上原创
2021年03月17日 09:19:58689浏览

一、文章分类 数据库

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;
  9. #【插入】 文章分类表
  10. INSERT INTO `article_cate` VALUES ('1', '0', '视频');
  11. INSERT INTO `article_cate` VALUES ('2', '1', '热点');
  12. INSERT INTO `article_cate` VALUES ('3', '0', '社会');
  13. INSERT INTO `article_cate` VALUES ('4', '2', '娱乐');
  14. 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. });
  39. // 添加文章分类
  40. function add() {
  41. layer.open({
  42. type: 2,
  43. title: '添加文章分类',
  44. shade: 0.3,
  45. area: ['450px', '200px;'],
  46. content: '/admins/article/add_cates'
  47. });
  48. }
  49. // 修改文章分类
  50. function edit(cid) {
  51. layer.open({
  52. type: 2,
  53. title: '修改文章分类',
  54. shade: 0.3,
  55. area: ['450px', '200px'],
  56. content: '/admins/article/edit_cates?cid=' + cid
  57. });
  58. }
  59. </script>

3、创建 文章分类 控制器

4、编辑 文章分类 控制器

app/Http/Controllers/admins/Article.php

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

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;
  2. //显示文章分类列表
  3. 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. });
  28. function save(){
  29. var title = $('input[name="title"]').val();
  30. var _token = $('input[name="_token"]').val();
  31. if(title==''){
  32. return layer.alert('请输入分类名称',{icon:2});
  33. }
  34. $.post('/admins/article/save_cates',{title:title,_token:_token},function(res){
  35. if(res.code>0){
  36. return layer.alert(res.msg,{icon:2});
  37. }
  38. layer.msg(res.msg);
  39. setTimeout(function(){parent.window.location.reload();},1000);
  40. },'json');
  41. }
  42. </script>

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

app/Http/Controllers/admins/Article.php

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

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. });
  29. function save(){
  30. var cid = $('input[name="cid"]').val();
  31. var title = $('input[name="title"]').val();
  32. var _token = $('input[name="_token"]').val();
  33. if(title==''){
  34. return layer.alert('请输入分类名称',{icon:2});
  35. }
  36. $.post('/admins/article/save_edit_cates',{cid:cid,title:title,_token:_token},function(res){
  37. if(res.code>0){
  38. return layer.alert(res.msg,{icon:2});
  39. }
  40. layer.msg(res.msg);
  41. setTimeout(function(){parent.window.location.reload();},1000);
  42. },'json');
  43. }
  44. </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. }
  7. // 保存修改分类
  8. public function save_edit_cates(Request $req) {
  9. $cid = (int)$req->cid;
  10. $title = trim($req->title);
  11. DB::table('article_cate')->where('id', $cid)->update(['title' => $title]);
  12. return json_encode(array('code' => 0, 'msg' => '保存成功'));
  13. }

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、查看效果

上一条:PHP 函数学习笔记下一条:es软件安装
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议