1. 程式人生 > 實用技巧 >分類模組——分類新增和列表

分類模組——分類新增和列表

1.在首頁側邊欄建立分類模組地址連結

     <a href="javascript:;"><cite>分類管理</cite></a>
     <a _href="{{ url('admin/cate') }}"><cite>分類列表</cite></a>
     <a _href="{{ url('admin/cate/create') }}"><cite>新增分類</cite></a>

2.建立分類資源路由

    //後臺分類模組相關路由
    Route::resource('cate', 'CateController');    

3.建立分類控制器

f:\xampp\php\php.exe artisan make:controller Admin/CateController --resource

3.建立分類模型

f:\xampp\php\php.exe artisan make:model Model\Cate

4.編寫分類模型屬性

class Cate extends Model
{
    //1.關聯的資料表
    public $table = 'category';

    //2.主鍵
    public $primaryKey = 'cate_id';

    //3.允許批量操作的欄位
    //不允許的為空,意思是都允許
    public $guarded = [];

    //4.是否維護crated_at和updated_at欄位
    public $timestamps = false;
}

5.編寫分類新增控制器方法

    public function create()
    {
        //獲取一級類
        $cate = Cate::where('cate_pid',0)->get();
        //返回分類新增頁面
        return view('admin.cate.add',compact('cate'));
    }

6.編寫分類新增模板

  • 表單項
    <span class="x-red">*</span>分類名稱
    <span class="x-red">*</span>分類標題
    <span class="x-red">*</span>排序

    <button class="layui-btn" lay-filter="add" lay-submit="">增加</button>
  • 表單name
    <input type="text" name="cate_name">
    <input type="text" name="cate_title">
    <input type="text" name="cate_order">
  • 迴圈一級分類資料,顯示一級分類資料
     <select name="cate_pid">
           <option value="0">==頂級分類==</option>
        @foreach($cate as $v)
           <option value="{{ $v->cate_id }}">{{$v->cate_name}}</option>
        @endforeach
      </select>
  • 編寫ajax,表單提交事件的add方法(用ajax來新增分類)
            form.on('submit(add)', function(data) {
                //發非同步,把資料提交給php
                $.ajax({
                    type: 'POST',
                    url: '/admin/cate',
                    dataType: 'json',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    //data.field為當前容器的全部表單欄位,名值對形式:{name: value}
                    data: data.field,
                    success: function(data) {
                        //彈層提示新增成功,並重新整理父頁面
                        //console.log(data);
                        if (data.status == 0) {
                            layer.alert(data.message,{icon:6},function(){
                                parent.location.reload(true);
                            });
                        }else{
                            layer.alert(data.message,{icon:5});
                        }
                    },
                    error: function() {
                        //錯誤資訊
                    }
                });
                return false;
            });

7.編寫執行分類新增控制器方法

    public function store(Request $request)
    {
        //1.接收新增的分類資料
        $input = $request->except('_token');
        //2.表單驗證

        //3.新增到資料庫中
        $res = Cate::create($input);
        //4.根據新增是否成功,給客戶端返回一個json格式的反饋
        if ($res) {
            $data = [
                'status'=>0,
                'message'=>'新增成功',
            ];
        }else {
            $data = [
                'status'=>1,
                'message'=>'新增失敗',
            ];
        }
        //json_encode($data);
        return $data;
    }

8.編寫分類列表控制器方法

    public function index()
    {
        //獲取分類資料
        $cates = Cate::get();
        //將分類資料返回給分類頁面
        return view('admin.cate.list',compact('cates'));
    }

9.建立分類列表模板

  • 表單項
      <tr>
          <th>ID</th>
          <th>分類名稱</th>
          <th>分類標題</th>
          <th>操作</th>
      </tr>
  • 迴圈展示表單資料
      @foreach($cates as $v)
      <tr>
          <td>{{ $v->cate_id }}</td>
          <td>{{ $v->cate_name }}</td>
          <td>{{ $v->cate_title }}</td>
          <td>
            <a title="編輯"></a>
            <a title="刪除"></a>
          </td>
      </tr>
      @endforeach

10.將分類資料格式化成樹形結構

  • 在分類模型中編寫格式化成樹形結構方法tree()
    //格式化分類資料的方法
    public function tree()
    {
        //獲取所有的分類資料
        $cates = $this->orderBy('cate_order','asc')->get();

        //呼叫編寫格式化方法getTree(),將格式化的分類資料返回給模型
        return $this->getTree($cates);
    }
  • 編寫格式化方法getTree()
    //格式化分類資料的方法
    public function getTree($category)
    {
        //排序
        //定義存放最終排完序的分類資料陣列$arr
        $arr = [];
        //1.迴圈所有分類資料先獲取一級類
        foreach ($category as $k => $v) {
            //一級類(如果迴圈的資料的cate_pid==0,則它是一級類)
            if ($v->cate_pid == 0) {
                //將一級類放入$arr陣列的值中
                $arr[] = $v;
                //2.獲取一級類下的二級類
                //繼續迴圈剩下的分類資料,
                foreach ($category as $m => $n) {
                    //如果一級分類的cate_id等於剩下迴圈出來的分類資料的cate_pid(父級分類id)
                    if ($v->cate_id == $n->cate_pid) {
                        //給二級類名稱前面新增縮排
                        $n->cate_name = '|——'.$n->cate_name;
                        //將二級類放入$arr陣列的值中
                        $arr[] = $n;
                    }
                } 
            }
        }
        //將獲得的排完序以後的陣列$arr返回給tree()方法
        return $arr;
    }

11.在控制器中,呼叫分類排序完的資料

    public function index()
    {
        //例項化排完序的模型類,呼叫它的tree方法
        $cates = (new Cate())->tree();
        //將分類資料返回給分類頁面
        return view('admin.cate.list',compact('cates'));
    }