search

博客列表 >CMS后台管理系统商城篇（一） 项目管理功能 2019年4月9日

CMS后台管理系统商城篇（一） 项目管理功能 2019年4月9日

小明的博客
小明的博客原创
2020年02月19日 13:55:141022浏览

利用之前开发好的cms后台管理系统，实现商城项目的管理。今天来做项目管理。把之前的数据库导入，一级菜单为项目管理，商品管理、后台管理、用户管理，今天完成项目管理下的广告管理。广告管理主要有两张表，分别是广告分类表和广告表。功能上难度不大，同之前的管理员管理这些是一样的。

一、广告分类管理

广告分类列表，通过Adver类的cat_list方法在shop_adver_cat查询出所有的记录传给前端。

  1. //广告分类列表
  2.     public function cat_list() {
  3.         //查询广告分类表(shop_adver_cat)的所有数据
  4.         $list = $this->db->table('shop_adver_cat')->lists();
  5.         $this->assign('list', $list);
  6.         return $this->fetch();
  7.     }

建立前端adver/cat_list.php，把后端给的数据渲染出来，提供了添加、编辑、删除功能，通过js方法将数据再发送给后段相应的方法处理，后段相应的方法将处理后的数据再发送给前端cat_add.php

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title></title>
  5.     <link rel="stylesheet" type="text/css" href="/static/plugins/layui/css/layui.css">
  6.     <script type="text/javascript" src="/static/plugins/layui/layui.js"></script>
  7.     <style type="text/css">
  8.         .header span{background: #009688;margin-left: 30px;padding: 10px;color:#ffffff;}
  9.     .header div{border-bottom: solid 2px #009688;margin-top: 8px;}
  10.     .header button{float: right;margin-top: -5px;}
  11.     </style>
  12. </head>
  13. <body style="padding: 10px;">
  14. <div class="header">
  15.     <span>广告分类列表</span>
  16.     <button class="layui-btn layui-btn-sm" onclick="add()">添加</button>
  17.     <div></div>
  18. </div>
  20. <table class="layui-table">
  21.     <thead>
  22.     <tr>
  23.         <th>ID</th>
  24.         <th>分类名</th>
  25.         <th>分类位置</th>
  26.         <th>广告列表</th>
  27.         <th>操作</th>
  28.     </tr>
  29.     </thead>
  30.     <tbody>
  31.     <!-- 循环出所有广告分类       -->
  32.     {volist name="list" id="vo"}
  33.     <tr>
  34.         <td>{$vo.cat_id}</td>
  35.         <td>{$vo.cat_name}</td>
  36.         <td>{$vo.cat_position}</td>
  37.         <td>
  38.             <button class="layui-btn layui-btn-xs" onclick="url({$vo.cat_id})">此分类——广告列表</button>
  39.         </td>
  40.         <td>
  41.             <button class="layui-btn layui-btn-xs" onclick="add({$vo.cat_id})">编辑</button>
  42.             <button class="layui-btn layui-btn-danger layui-btn-xs" onclick="del({$vo.cat_id})">删除</button>
  43.         </td>
  44.     </tr>
  45.     {/volist}
  46.     </tbody>
  47. </table>
  49. <script type="text/javascript">
  50.             layui.use(['layer'],function(){
  51.             layer = layui.layer;
  52.             $ = layui.jquery;
  53.         });
  55.     // 添加编辑
  56.     function add(id) {
  57.         layer.open({
  58.             type: 2,
  59.             title: id>0 ? '编辑广告分类' : '添加广告分类',
  60.             shade: 0.3,
  61.             area: ['480px', '420px'],
  62.             content: '/index.php/admins/Adver/cat_add?id='+id
  63.         });
  64.     }
  65.     //分类下的广告列表
  66.     function url(id) {
  67.         window.location.href = "/index.php/admins/Adver/lists?id="+id;
  68.     }
  70.     // 删除
  71.     function del(id) {
  72.         layer.confirm('确定要删除吗？', {
  73.             icon: 3,
  74.             btn: ['确定', '取消']
  75.         }, function () {
  76.             $.post('/index.php/admins/Adver/delete', {'id':id}, function (res) {
  77.                 if (res.code > 0) {
  78.                     layer.alert(res.msg, {icon:2});
  79.                 } else {
  80.                     layer.msg(res.msg);
  81.                     setTimeout(function () {
  82.                         window.location.reload();
  83.                     }, 1000)
  84.                 }
  85.             }, 'json');
  86.         });
  87.     }
  88. </script>
  89. </body>
  90. </html>
  1. //广告分类添加 编辑
  2.     public function cat_add() {
  3.         //接收get来的id
  4.         $id = (int)input('get.id');
  5.         //获取id值对应的广告分类数据
  6.         //（这里不判断id的值 因为id有值就可以对应得到该条信息 如果没有就没有了 可以在保存操作再判断）
  7.         $data = $this->db->table('shop_adver_cat')->where(array('cat_id'=>$id))->item();
  8.         $this->assign('data', $data);
  9.         return $this->fetch();
  10.     }

弹出页面，有js保存方法，将所有数据传给后台的保存方法处理，进行相应的添加和修改操作。

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title></title>
  5.     <link rel="stylesheet" type="text/css" href="/static/plugins/layui/css/layui.css">
  6.     <script type="text/javascript" src="/static/plugins/layui/layui.js"></script>
  7. </head>
  8. <body style="padding: 10px;">
  9. <form class="layui-form">
  10.     <!-- hidden 是把input框隐藏，它的作用是把一些隐藏信息传值到接口中 -->
  11.     <input type="hidden" name="cat_id" value="{$data.cat_id}">
  12.     <div class="layui-form-item">
  13.         <label class="layui-form-label">分类名</label>
  14.         <div class="layui-input-inline">
  15.             <!-- value 是默认值 -->
  16.             <!-- 当添加时，传值是0，默认值是空 -->
  17.             <!-- readonly 是input里的一个参数，可以禁用input框，只有在修改用户时，才使用 -->
  18.             <input type="text" class="layui-input" name="cat_name" value="{$data.cat_name}">
  19.         </div>
  20.     </div>
  22.     <div class="layui-form-item">
  23.         <label class="layui-form-label">分类位置</label>
  24.         <div class="layui-input-inline">
  25.             <input type="text" class="layui-input" name="cat_position" value="{$data.cat_position}">
  26.         </div>
  27.     </div>
  28. </form>
  29. <div class="layui-form-item">
  30.     <div class="layui-input-block">
  31.         <button class="layui-btn" onclick="save()">保存</button>
  32.     </div>
  33. </div>
  35. <script type="text/javascript">
  36.     layui.use(['layer','form'],function(){
  37.         form = layui.form;
  38.         layer = layui.layer;
  39.         $ = layui.jquery;
  40.     });
  42.     // 保存管理员
  43.     function save(){
  44.         // 用js 获取cat_id、用户名、密码、角色、真实姓名
  45.         var cat_name = $.trim($('input[name="cat_name"]').val());
  46.         var cat_position = $.trim($('input[name="cat_position"]').val());
  47.         if(cat_name==''){
  48.             layer.alert('请输入广告分类名',{icon:2});
  49.             return;
  50.         }
  51.         if(cat_position==''){
  52.             layer.alert('请输入广告分类位置',{icon:2});
  53.             return;
  54.         }
  55.         // 请求保存接口，把数据传值到接口中。
  56.         $.post('/index.php/admins/Adver/cat_save',$('form').serialize(),function(res){
  57.             if(res.code>0){
  58.                 layer.alert(res.msg,{icon:2});
  59.             }else{
  60.                 layer.msg(res.msg);
  61.                 setTimeout(function(){parent.window.location.reload();},1000);
  62.             }
  63.         },'json');
  64.     }
  66. </script>
  67. </body>
  68. </html>
  1. //广告分类保存
  2.     public function cat_save() {
  3.         $id = (int)input('post.cat_id');
  4.         $data['cat_name'] = trim(input('post.cat_name'));
  5.         $data['cat_position'] = trim(input('post.cat_position'));
  6.         //通过id值判断操作（0是添加  非0就是编辑）
  7.         if ($id) {
  8.             $res = $this->db->table('shop_adver_cat')->where(array('cat_id'=>$id))->update($data);
  9.         } else {
  10.             $res = $this->db->table('shop_adver_cat')->insert($data);
  11.         }
  12.         if ($res) {
  13.             exit(json_encode(array('code'=>0, 'msg'=>'保存成功')));
  14.         } else {
  15.             exit(json_encode(array('code'=>1, 'msg'=>'保存失败')));
  16.         }
  17.     }

最后实现广告删除操作

  1. //广告分类删除
  2.     public function delete() {
  3.         //16 接收传过来的id
  4.         $id = (int)input('post.id');
  5.         //16 执行删除操作
  6.         $res = $this->db->table('shop_adver_cat')->where(array('cat_id'=>$id))->delete();
  7.         if (!$res) {
  8.             exit(json_encode(array('code'=>1, 'msg'=>'删除失败')));
  9.         }
  10.         exit(json_encode(array('code'=>0, 'msg'=>'删除成功')));
  11.     }
二、广告管理
广告管理和广告分类管理功能上基本一致。他是在广告分类单项记录上链接该分类下的广告，通过在shop_adver表上的cat_id查找相应的记录，然后新建前端展示出来，然后可以新增、编辑、删除，（注意要将分类id一直传递到新增、修改页面，便于将广告单项数据保存完整。），然后将数据转给后台新增、修改广告的方法，该方法处理好数据后，再交给前端list_add.php渲染，保存，在将数据传给后段保存方法进行插入或者修改操作，最后返回操作结果。最后还有删除操作。
  1. //广告列表
  2.     public function lists() {
  3.         $id = (int)input('get.id');
  4.         //查询出广告列表下符合cat_id的所有记录
  5.         $list = $this->db->table('shop_adver')->where(array('cat_id'=>$id))->lists();
  6.         //将cat_id 和查询出来的数据发给前端  cat_id是为了添加广告是放在相应的广告分类下
  7.         $this->assign('id', $id);
  8.         $this->assign('list', $list);
  9.         return $this->fetch();
  10.     }
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title></title>
  5.     <link rel="stylesheet" type="text/css" href="/static/plugins/layui/css/layui.css">
  6.     <script type="text/javascript" src="/static/plugins/layui/layui.js"></script>
  7.     <style type="text/css">
  8.         .header span{background: #009688;margin-left: 30px;padding: 10px;color:#ffffff;}
  9.         .header div{border-bottom: solid 2px #009688;margin-top: 8px;}
  10.         .header button{float: right;margin-top: -5px;}
  11.     </style>
  12. </head>
  13. <body style="padding: 10px;">
  14. <div class="header">
  15.     <span style="background-color:#999;"><a href="/index.php/admins/Adver/cat_list" style="color:#fff;">广告分类列表</a></span>
  16.     <span>广告列表</span>
  17.     <button class="layui-btn layui-btn-sm" onclick="add()">添加</button>
  18.     <div></div>
  19. </div>
  21. <table class="layui-table">
  22.     <thead>
  23.     <tr>
  24.         <th>ID</th>
  25.         <th>广告标题</th>
  26.         <th>状态</th>
  27.         <th>操作</th>
  28.     </tr>
  29.     </thead>
  30.     <tbody>
  31.     <!-- 循环出所有广告       -->
  32.     {volist name="list" id="vo"}
  33.     <tr>
  34.         <td>{$vo.id}</td>
  35.         <td><a href="{$vo.cat_url}" target="_blank">{$vo.cat_title}</a></td>
  36.         <td>{if condition="$vo.status == 1"}<span style="color: green;">开启</span>{else/}<span style="color: red;">关闭</span>{/if}</td>
  37.         <td>
  38.             <button class="layui-btn layui-btn-xs" onclick="add({$vo.id})">编辑</button>
  39.             <button class="layui-btn layui-btn-danger layui-btn-xs" onclick="del({$vo.id})">删除</button>
  40.         </td>
  41.     </tr>
  42.     {/volist}
  43.     </tbody>
  44. </table>
  46. <script type="text/javascript">
  47.     //把cat_id接收
  48.     var cat_id = '{$id}';
  49.     layui.use(['layer'],function(){
  50.         layer = layui.layer;
  51.         $ = layui.jquery;
  52.     });
  54.     // 添加编辑
  55.     function add(id) {
  56.         layer.open({
  57.             type: 2,
  58.             title: id>0 ? '编辑广告' : '添加广告',
  59.             shade: 0.3,
  60.             area: ['480px', '420px'],
  61.             content: '/index.php/admins/Adver/lists_add?id='+id+'&cat_id='+cat_id
  62.         });
  63.     }
  66.     // 删除
  67.     function del(id) {
  68.         layer.confirm('确定要删除吗？', {
  69.             icon: 3,
  70.             btn: ['确定', '取消']
  71.         }, function () {
  72.             $.post('/index.php/admins/Adver/adv_delete', {'id':id}, function (res) {
  73.                 if (res.code > 0) {
  74.                     layer.alert(res.msg, {icon:2});
  75.                 } else {
  76.                     layer.msg(res.msg);
  77.                     setTimeout(function () {
  78.                         window.location.reload();
  79.                     }, 1000)
  80.                 }
  81.             }, 'json');
  82.         });
  83.     }
  84. </script>
  85. </body>
  86. </html>
  1. //编辑 添加广告
  2.     public function lists_add() {
  3.         //接收cat_id 和 id
  4.         $cat_id = (int)input('get.cat_id');
  5.         $id = (int)input('get.id');
  6.         //查询id  对应的记录
  7.         $list = $this->db->table('shop_adver')->where(array('id'=>$id))->item();
  8.         $this->assign('cat_id', $cat_id);
  9.         $this->assign('list', $list);
  10.         return $this->fetch();
  11.     }
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title></title>
  5.     <link rel="stylesheet" type="text/css" href="/static/plugins/layui/css/layui.css">
  6.     <script type="text/javascript" src="/static/plugins/layui/layui.js"></script>
  7. </head>
  8. <body style="padding: 10px;">
  9. <form class="layui-form">
  10.     <!-- hidden 是把input框隐藏，它的作用是把一些隐藏信息传值到接口中 -->
  11.     <input type="hidden" name="cat_id" value="{$cat_id}">
  12.     <input type="hidden" name="id" value="{$list.id}">
  13.     <div class="layui-form-item">
  14.         <label class="layui-form-label">标题</label>
  15.         <div class="layui-input-inline">
  16.             <!-- value 是默认值 -->
  17.             <!-- 当添加时，传值是0，默认值是空 -->
  18.             <!-- readonly 是input里的一个参数，可以禁用input框，只有在修改用户时，才使用 -->
  19.             <input type="text" class="layui-input" name="cat_title" value="{$list.cat_title}">
  20.         </div>
  21.     </div>
  23.     <div class="layui-form-item">
  24.         <label class="layui-form-label">跳转地址</label>
  25.         <div class="layui-input-inline">
  26.             <input type="text" class="layui-input" name="cat_url" value="{$list.cat_url}">
  27.         </div>
  28.     </div>
  29.     <div class="layui-form-item">
  30.         <label class="layui-form-label">排序</label>
  31.         <div class="layui-input-inline">
  32.             <input type="text" class="layui-input" name="sort" value="{$list.sort}">
  33.         </div>
  34.     </div>
  35.     <div class="layui-form-item">
  36.         <label class="layui-form-label">状态</label>
  37.         <div class="layui-input-inline">
  38.             <input type="checkbox" name="status" lay-skin="primary" title="开启" value="1" checked="checked">
  39.         </div>
  40.     </div>
  41. </form>
  42. <div class="layui-form-item">
  43.     <div class="layui-input-block">
  44.         <button class="layui-btn" onclick="save()">保存</button>
  45.     </div>
  46. </div>
  48. <script type="text/javascript">
  49.     layui.use(['layer','form'],function(){
  50.         form = layui.form;
  51.         layer = layui.layer;
  52.         $ = layui.jquery;
  53.     });
  55.     // 保存管理员
  56.     function save(){
  57.         // 用js 获取cat_id、用户名、密码、角色、真实姓名
  58.         var cat_title = $.trim($('input[name="cat_title"]').val());
  60.         if(cat_title==''){
  61.             layer.alert('请输入广告标题',{icon:2});
  62.             return;
  63.         }
  65.         // 请求保存接口，把数据传值到接口中。
  66.         $.post('/index.php/admins/Adver/lists_save',$('form').serialize(),function(res){
  67.             if(res.code>0){
  68.                 layer.alert(res.msg,{icon:2});
  69.             }else{
  70.                 layer.msg(res.msg);
  71.                 setTimeout(function(){parent.window.location.reload();},1000);
  72.             }
  73.         },'json');
  74.     }
  76. </script>
  77. </body>
  78. </html>
  1. //保存广告
  2.     public function lists_save() {
  3.         //将post来的所有信息保存下来
  4.         $id = (int)input('post.id');
  5.         $data['cat_id'] = (int)input('post.cat_id');
  6.         $data['cat_title'] = trim(input('post.cat_title'));
  7.         $data['cat_url'] = trim(input('post.cat_url'));
  8.         $data['sort'] = trim(input('post.sort'));
  9.         $data['status'] = trim(input('post.status'));
  10.         if ($id) {
  11.             $res = $this->db->table('shop_adver')->where(array('id'=>$id))->update($data);
  12.         } else {
  13.             $res = $this->db->table('shop_adver')->insert($data);
  14.         }
  15.         if ($res) {
  16.             exit(json_encode(array('code'=>0, 'msg'=>'保存成功')));
  17.         } else {
  18.             exit(json_encode(array('code'=>1, 'msg'=>'保存失败')));
  19.         }
  20.     }
  21.     //删除广告
  22.     public function adv_delete() {
  23.         //16 接收传过来的id
  24.         $id = (int)input('post.id');
  25.         //16 执行删除操作
  26.         $res = $this->db->table('shop_adver')->where(array('id'=>$id))->delete();
  27.         if (!$res) {
  28.             exit(json_encode(array('code'=>1, 'msg'=>'删除失败')));
  29.         }
  30.         exit(json_encode(array('code'=>0, 'msg'=>'删除成功')));
  31.     }
上一条：利用WP REST API接口实现缩略图下一条：学习环境及常用软件的安装调试-PHP培训九期线上班
声明：本文内容转载自脚本之家，由网友自发贡献，版权归原作者所有，如您发现涉嫌抄袭侵权，请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言，请遵守新闻评论服务协议

相关文章

查看更多