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

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

博主信息

博文 42

粉丝 2

访问量 64626

专题推荐

更多>

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

一、广告分类管理

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

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

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

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="/static/plugins/layui/css/layui.css">
    <script type="text/javascript" src="/static/plugins/layui/layui.js"></script>
    <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;}
    </style>
</head>
<body style="padding: 10px;">
<div class="header">
    <span>广告分类列表</span>
    <button class="layui-btn layui-btn-sm" onclick="add()">添加</button>
    <div></div>
</div>
<table class="layui-table">
    <thead>
    <tr>
        <th>ID</th>
        <th>分类名</th>
        <th>分类位置</th>
        <th>广告列表</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
    <!-- 循环出所有广告分类       -->
    {volist name="list" id="vo"}
    <tr>
        <td>{$vo.cat_id}</td>
        <td>{$vo.cat_name}</td>
        <td>{$vo.cat_position}</td>
        <td>
            <button class="layui-btn layui-btn-xs" onclick="url({$vo.cat_id})">此分类——广告列表</button>
        </td>
        <td>
            <button class="layui-btn layui-btn-xs" onclick="add({$vo.cat_id})">编辑</button>
            <button class="layui-btn layui-btn-danger layui-btn-xs" onclick="del({$vo.cat_id})">删除</button>
        </td>
    </tr>
    {/volist}
    </tbody>
</table>
<script type="text/javascript">
            layui.use(['layer'],function(){
            layer = layui.layer;
            $ = layui.jquery;
        });
    // 添加编辑
    function add(id) {
        layer.open({
            type: 2,
            title: id>0 ? '编辑广告分类' : '添加广告分类',
            shade: 0.3,
            area: ['480px', '420px'],
            content: '/index.php/admins/Adver/cat_add?id='+id
        });
    }
    //分类下的广告列表
    function url(id) {
        window.location.href = "/index.php/admins/Adver/lists?id="+id;
    }
    // 删除
    function del(id) {
        layer.confirm('确定要删除吗？', {
            icon: 3,
            btn: ['确定', '取消']
        }, function () {
            $.post('/index.php/admins/Adver/delete', {'id':id}, function (res) {
                if (res.code > 0) {
                    layer.alert(res.msg, {icon:2});
                } else {
                    layer.msg(res.msg);
                    setTimeout(function () {
                        window.location.reload();
                    }, 1000)
                }
            }, 'json');
        });
    }
</script>
</body>
</html>

//广告分类添加 编辑
    public function cat_add() {
        //接收get来的id
        $id = (int)input('get.id');
        //获取id值对应的广告分类数据
        //（这里不判断id的值 因为id有值就可以对应得到该条信息 如果没有就没有了 可以在保存操作再判断）
        $data = $this->db->table('shop_adver_cat')->where(array('cat_id'=>$id))->item();
        $this->assign('data', $data);
        return $this->fetch();
    }

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

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="/static/plugins/layui/css/layui.css">
    <script type="text/javascript" src="/static/plugins/layui/layui.js"></script>
</head>
<body style="padding: 10px;">
<form class="layui-form">
    <!-- hidden 是把input框隐藏，它的作用是把一些隐藏信息传值到接口中 -->
    <input type="hidden" name="cat_id" value="{$data.cat_id}">
    <div class="layui-form-item">
        <label class="layui-form-label">分类名</label>
        <div class="layui-input-inline">
            <!-- value 是默认值 -->
            <!-- 当添加时，传值是0，默认值是空 -->
            <!-- readonly 是input里的一个参数，可以禁用input框，只有在修改用户时，才使用 -->
            <input type="text" class="layui-input" name="cat_name" value="{$data.cat_name}">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">分类位置</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input" name="cat_position" value="{$data.cat_position}">
        </div>
    </div>
</form>
<div class="layui-form-item">
    <div class="layui-input-block">
        <button class="layui-btn" onclick="save()">保存</button>
    </div>
</div>
<script type="text/javascript">
    layui.use(['layer','form'],function(){
        form = layui.form;
        layer = layui.layer;
        $ = layui.jquery;
    });
    // 保存管理员
    function save(){
        // 用js 获取cat_id、用户名、密码、角色、真实姓名
        var cat_name = $.trim($('input[name="cat_name"]').val());
        var cat_position = $.trim($('input[name="cat_position"]').val());
        if(cat_name==''){
            layer.alert('请输入广告分类名',{icon:2});
            return;
        }
        if(cat_position==''){
            layer.alert('请输入广告分类位置',{icon:2});
            return;
        }
        // 请求保存接口，把数据传值到接口中。
        $.post('/index.php/admins/Adver/cat_save',$('form').serialize(),function(res){
            if(res.code>0){
                layer.alert(res.msg,{icon:2});
            }else{
                layer.msg(res.msg);
                setTimeout(function(){parent.window.location.reload();},1000);
            }
        },'json');
    }
</script>
</body>
</html>

//广告分类保存
    public function cat_save() {
        $id = (int)input('post.cat_id');
        $data['cat_name'] = trim(input('post.cat_name'));
        $data['cat_position'] = trim(input('post.cat_position'));
        //通过id值判断操作（0是添加  非0就是编辑）
        if ($id) {
            $res = $this->db->table('shop_adver_cat')->where(array('cat_id'=>$id))->update($data);
        } else {
            $res = $this->db->table('shop_adver_cat')->insert($data);
        }
        if ($res) {
            exit(json_encode(array('code'=>0, 'msg'=>'保存成功')));
        } else {
            exit(json_encode(array('code'=>1, 'msg'=>'保存失败')));
        }
    }

最后实现广告删除操作

//广告分类删除
    public function delete() {
        //16 接收传过来的id
        $id = (int)input('post.id');
        //16 执行删除操作
        $res = $this->db->table('shop_adver_cat')->where(array('cat_id'=>$id))->delete();
        if (!$res) {
            exit(json_encode(array('code'=>1, 'msg'=>'删除失败')));
        }
        exit(json_encode(array('code'=>0, 'msg'=>'删除成功')));
    }

二、广告管理

广告管理和广告分类管理功能上基本一致。他是在广告分类单项记录上链接该分类下的广告，通过在shop_adver表上的cat_id查找相应的记录，然后新建前端展示出来，然后可以新增、编辑、删除，（注意要将分类id一直传递到新增、修改页面，便于将广告单项数据保存完整。），然后将数据转给后台新增、修改广告的方法，该方法处理好数据后，再交给前端list_add.php渲染，保存，在将数据传给后段保存方法进行插入或者修改操作，最后返回操作结果。最后还有删除操作。

//广告列表
    public function lists() {
        $id = (int)input('get.id');
        //查询出广告列表下符合cat_id的所有记录
        $list = $this->db->table('shop_adver')->where(array('cat_id'=>$id))->lists();
        //将cat_id 和查询出来的数据发给前端  cat_id是为了添加广告是放在相应的广告分类下
        $this->assign('id', $id);
        $this->assign('list', $list);
        return $this->fetch();
    }

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="/static/plugins/layui/css/layui.css">
    <script type="text/javascript" src="/static/plugins/layui/layui.js"></script>
    <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;}
    </style>
</head>
<body style="padding: 10px;">
<div class="header">
    <span style="background-color:#999;"><a href="/index.php/admins/Adver/cat_list" style="color:#fff;">广告分类列表</a></span>
    <span>广告列表</span>
    <button class="layui-btn layui-btn-sm" onclick="add()">添加</button>
    <div></div>
</div>
<table class="layui-table">
    <thead>
    <tr>
        <th>ID</th>
        <th>广告标题</th>
        <th>状态</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
    <!-- 循环出所有广告       -->
    {volist name="list" id="vo"}
    <tr>
        <td>{$vo.id}</td>
        <td><a href="{$vo.cat_url}" target="_blank">{$vo.cat_title}</a></td>
        <td>{if condition="$vo.status == 1"}<span style="color: green;">开启</span>{else/}<span style="color: red;">关闭</span>{/if}</td>
        <td>
            <button class="layui-btn layui-btn-xs" onclick="add({$vo.id})">编辑</button>
            <button class="layui-btn layui-btn-danger layui-btn-xs" onclick="del({$vo.id})">删除</button>
        </td>
    </tr>
    {/volist}
    </tbody>
</table>
<script type="text/javascript">
    //把cat_id接收
    var cat_id = '{$id}';
    layui.use(['layer'],function(){
        layer = layui.layer;
        $ = layui.jquery;
    });
    // 添加编辑
    function add(id) {
        layer.open({
            type: 2,
            title: id>0 ? '编辑广告' : '添加广告',
            shade: 0.3,
            area: ['480px', '420px'],
            content: '/index.php/admins/Adver/lists_add?id='+id+'&cat_id='+cat_id
        });
    }
    // 删除
    function del(id) {
        layer.confirm('确定要删除吗？', {
            icon: 3,
            btn: ['确定', '取消']
        }, function () {
            $.post('/index.php/admins/Adver/adv_delete', {'id':id}, function (res) {
                if (res.code > 0) {
                    layer.alert(res.msg, {icon:2});
                } else {
                    layer.msg(res.msg);
                    setTimeout(function () {
                        window.location.reload();
                    }, 1000)
                }
            }, 'json');
        });
    }
</script>
</body>
</html>

//编辑 添加广告
    public function lists_add() {
        //接收cat_id 和 id
        $cat_id = (int)input('get.cat_id');
        $id = (int)input('get.id');
        //查询id  对应的记录
        $list = $this->db->table('shop_adver')->where(array('id'=>$id))->item();
        $this->assign('cat_id', $cat_id);
        $this->assign('list', $list);
        return $this->fetch();
    }

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="/static/plugins/layui/css/layui.css">
    <script type="text/javascript" src="/static/plugins/layui/layui.js"></script>
</head>
<body style="padding: 10px;">
<form class="layui-form">
    <!-- hidden 是把input框隐藏，它的作用是把一些隐藏信息传值到接口中 -->
    <input type="hidden" name="cat_id" value="{$cat_id}">
    <input type="hidden" name="id" value="{$list.id}">
    <div class="layui-form-item">
        <label class="layui-form-label">标题</label>
        <div class="layui-input-inline">
            <!-- value 是默认值 -->
            <!-- 当添加时，传值是0，默认值是空 -->
            <!-- readonly 是input里的一个参数，可以禁用input框，只有在修改用户时，才使用 -->
            <input type="text" class="layui-input" name="cat_title" value="{$list.cat_title}">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">跳转地址</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input" name="cat_url" value="{$list.cat_url}">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">排序</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input" name="sort" value="{$list.sort}">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">状态</label>
        <div class="layui-input-inline">
            <input type="checkbox" name="status" lay-skin="primary" title="开启" value="1" checked="checked">
        </div>
    </div>
</form>
<div class="layui-form-item">
    <div class="layui-input-block">
        <button class="layui-btn" onclick="save()">保存</button>
    </div>
</div>
<script type="text/javascript">
    layui.use(['layer','form'],function(){
        form = layui.form;
        layer = layui.layer;
        $ = layui.jquery;
    });
    // 保存管理员
    function save(){
        // 用js 获取cat_id、用户名、密码、角色、真实姓名
        var cat_title = $.trim($('input[name="cat_title"]').val());
        if(cat_title==''){
            layer.alert('请输入广告标题',{icon:2});
            return;
        }
        // 请求保存接口，把数据传值到接口中。
        $.post('/index.php/admins/Adver/lists_save',$('form').serialize(),function(res){
            if(res.code>0){
                layer.alert(res.msg,{icon:2});
            }else{
                layer.msg(res.msg);
                setTimeout(function(){parent.window.location.reload();},1000);
            }
        },'json');
    }
</script>
</body>
</html>

//保存广告
    public function lists_save() {
        //将post来的所有信息保存下来
        $id = (int)input('post.id');
        $data['cat_id'] = (int)input('post.cat_id');
        $data['cat_title'] = trim(input('post.cat_title'));
        $data['cat_url'] = trim(input('post.cat_url'));
        $data['sort'] = trim(input('post.sort'));
        $data['status'] = trim(input('post.status'));
        if ($id) {
            $res = $this->db->table('shop_adver')->where(array('id'=>$id))->update($data);
        } else {
            $res = $this->db->table('shop_adver')->insert($data);
        }
        if ($res) {
            exit(json_encode(array('code'=>0, 'msg'=>'保存成功')));
        } else {
            exit(json_encode(array('code'=>1, 'msg'=>'保存失败')));
        }
    }
    //删除广告
    public function adv_delete() {
        //16 接收传过来的id
        $id = (int)input('post.id');
        //16 执行删除操作
        $res = $this->db->table('shop_adver')->where(array('id'=>$id))->delete();
        if (!$res) {
            exit(json_encode(array('code'=>1, 'msg'=>'删除失败')));
        }
        exit(json_encode(array('code'=>0, 'msg'=>'删除成功')));
    }

批改状态：未批改

老师批语：

本博文版权归博主所有，转载请注明地址！如有侵权、违法，请联系admin@php.cn举报处理！

全部评论文明上网理性发言，请遵守新闻评论服务协议

0条评论

作者最新博文

html文档结构、css选择器和盒模型初探（html文档结构说明，常用的标签，常用的css选择器及优先级，盒模型内外边距边框线）2019年1月14日22时45分

2019-01-15 17:40:32