后盾网lavarel视频项目---lavarel多表关联一对多操作实例

一、总结

一句话总结:

1、一对多中多那个部分的数据前端通过json弄到服务器
2、所有通过一操作多的时候,都要用上模型中定义的那个方法:$lesson->videos()->create($video);

1、页面直接通过一对多中的一找到多的数量?

控制器中:$data=Lesson::get();
视图中:{{$d->videos()->count()}}
控制器中
public function index()
{
$data=Lesson::get();
//dd($data->toArray());
return view('admin.lesson.index',compact('data'));
} 视图中
<tr>
<td>{{$d['id']}}.</td>
<td>{{$d['title']}}</td>
<td>{{$d->videos()->count()}}</td>

2、一对多模型中多对应部分数据通过json传到服务器?

1、转成数组:$videos=json_decode($request['videos'],true);
2、所有通过一操作多的时候,都要用上模型中定义的那个方法:$lesson->videos()->create($video);
  //videos数据过来的时候是json数据,true表示转成数组而非对象
$videos=json_decode($request['videos'],true);
foreach ($videos as $video){
$lesson->videos()->create($video);
}

二、lavarel多表关联一对多操作实例

1、模型

app/Model/Lesson.php

 <?php

 namespace App\Model;

 use Illuminate\Database\Eloquent\Model;

 class Lesson extends Model
{
/**
* 与视频表模型的一对多关联
* @return \Illuminate\Database\Eloquent\Relations\HasMany
*/
public function videos(){
return $this->hasMany(Video::class);
}
}

app/Model/Video.php

 <?php

 namespace App\Model;

 use Illuminate\Database\Eloquent\Model;

 class Video extends Model
{
protected $guarded=[];
}

2、控制器

app/Http/Controllers/Admin/LessonController.php

 <?php

 namespace App\Http\Controllers\Admin;

 use App\Model\Lesson;
use Illuminate\Http\Request;
use App\Http\Controllers\Controller; class LessonController extends CommonController
{
/**
* Display a listing of the resource.
*
* @return \Illuminate\Http\Response
*/
public function index()
{
$data=Lesson::get();
//dd($data->toArray());
return view('admin.lesson.index',compact('data'));
} /**
* Show the form for creating a new resource.
*
* @return \Illuminate\Http\Response
*/
public function create()
{
// $d=Lesson::find(1)->videos()->get();
// dd($d->toArray());
return view('admin.lesson.create');
} /**
* Store a newly created resource in storage.
*
* @param \Illuminate\Http\Request $request
* @return \Illuminate\Http\Response
*/
public function store(Request $request,Lesson $lesson)
{
//dd($request->toArray());
$lesson['title']=$request['title'];
$lesson['introduce']=$request['introduce'];
$lesson['preview']=$request['preview'];
$lesson['is_commend']=$request['is_commend'];
$lesson['is_hot']=$request['is_hot'];
$lesson['click']=$request['click'];
$lesson->save(); //videos数据过来的时候是json数据,true表示转成数组而非对象
$videos=json_decode($request['videos'],true);
foreach ($videos as $video){
$lesson->videos()->create($video);
}
return redirect('/admin/lesson'); } /**
* Display the specified resource.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function show($id)
{
//
} /**
* Show the form for editing the specified resource.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function edit($id)
{
//
} /**
* Update the specified resource in storage.
*
* @param \Illuminate\Http\Request $request
* @param int $id
* @return \Illuminate\Http\Response
*/
public function update(Request $request, $id)
{
//
} /**
* Remove the specified resource from storage.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function destroy($id)
{
//
}
}

44-50行:增加课程数据

53-56行:增加视频数据

第55行:所有通过一操作多的时候,都要用上模型中定义的那个方法:$lesson->videos()->create($video);

3、视图

resources/views/admin/lesson/create.blade.php

后盾网lavarel视频项目---lavarel多表关联一对多操作实例-LMLPHP

后盾网lavarel视频项目---lavarel多表关联一对多操作实例-LMLPHP

 @extends('admin.layout.master')
@section('title','新增课程')
@section('content')
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
Dashboard
<small>Control panel</small>
</h1>
<ol class="breadcrumb">
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
<li class="active">Dashboard</li>
</ol>
</section> <!-- Main content -->
<section class="content">
<div style="padding-bottom:15px;">
<div class="btn-group" role="group" aria-label="...">
<a href="/admin/lesson" type="button" class="btn btn-default">课程列表</a>
<a href="/admin/lesson/create" type="button" class="btn btn-warning">新增课程</a>
</div>
</div> <div class="box box-info">
<div class="box-header with-border">
<h3 class="box-title">Horizontal Form</h3>
</div>
<!-- /.box-header -->
<!-- form start -->
<form class="form-horizontal" action="/admin/lesson" method="post">
{{csrf_field()}}
<div class="box-body">
<div class="form-group">
<label for="title" class="col-sm-2 control-label">课程标题</label> <div class="col-sm-10">
<input type="text" name="title" class="form-control" id="title" required placeholder="标题">
</div>
</div>
<div class="form-group">
<label for="introduce" class="col-sm-2 control-label">介绍</label>
<div class="col-sm-10">
<textarea name="introduce" class="form-control" id="introduce" rows="5" required></textarea>
</div>
</div>
<div class="form-group">
<label for="preview" class="col-sm-2 control-label">预览图</label>
<div class="col-sm-10">
<div class="input-group">
<input type="text" class="form-control" name="preview" readonly=""
value="images/nopic.jpg" required>
<div class="input-group-btn">
<button onclick="upImage(this)" class="btn btn-default"
type="button">选择图片
</button>
</div>
</div>
<div class="input-group" style="margin-top:5px;">
<img src="{{asset('images/nopic.jpg')}}"
class="img-responsive img-thumbnail" width="150">
<em class="close" style="position:absolute; top: 0px; right: -14px;"
title="删除这张图片" onclick="removeImg(this)">×</em>
</div>
</div>
<script>
//上传图片
function upImage(obj) {
require(['util'], function (util) {
options = {
multiple: false,//是否允许多图上传
};
util.image(function (images) { //上传成功的图片,数组类型
$("[name='preview']").val(images[0]);
$(".img-thumbnail").attr('src', images[0]);
}, options)
});
} //移除图片
function removeImg(obj) {
$(obj).prev('img').attr('src', 'resource/images/nopic.jpg');
$(obj).parent().prev().find('input').val('');
}
</script>
</div>
<div class="form-group">
<label for="is_commend" class="col-sm-2 control-label">推荐</label>
<div class="col-sm-10">
<label class="radio-inline">
<input type="radio" name="is_commend" id="is_commend1" value="1"> 是
</label>
<label class="radio-inline">
<input type="radio" name="is_commend" id="is_commend0" value="0" checked> 否
</label>
</div>
</div>
<div class="form-group">
<label for="is_hot" class="col-sm-2 control-label">热门</label>
<div class="col-sm-10">
<label class="radio-inline">
<input type="radio" name="is_hot" id="is_hot1" value="1"> 是
</label>
<label class="radio-inline">
<input type="radio" name="is_hot" id="is_hot0" value="0" checked> 否
</label>
</div>
</div>
<div class="form-group">
<label for="click" class="col-sm-2 control-label">点击数</label> <div class="col-sm-10">
<input type="number" name="click" class="form-control" id="click" placeholder="点击数" value="0">
</div>
</div> {{--视频管理--}}
<div class="panel panel-info" id="app">
<div class="panel-heading">视频管理</div>
<div class="panel-body">
{{--子元素--}}
<div class="panel panel-default" v-for="(v,k) in videos">
<div class="panel-body">
<div class="form-group">
<label for="v_title" class="col-sm-2 control-label">视频标题</label> <div class="col-sm-10">
<input type="text" name="v_title" class="form-control" v-model="v.title">
</div>
</div>
<div class="form-group">
<label for="v_path" class="col-sm-2 control-label">视频地址</label>
<div class="col-sm-10">
<input type="text" name="v_path" class="form-control" v-model="v.path">
</div>
</div>
</div>
<div class="panel-footer">
<button class="btn btn-success btn-sm" @click.prevent="del(k)">删除视频</button>
</div>
</div>
{{--END-子元素--}}
<div class="form-group">
<textarea name="videos" cols="30" rows="10">@{{videos}}</textarea>
</div>
</div>
<div class="panel-footer">
<button class="btn btn-primary btn-sm" @click.prevent="add">添加视频</button>
</div> </div> </div>
<!-- /.box-body --> <div class="box-footer">
<button type="submit" class="btn btn-info">保存数据</button>
</div>
<!-- /.box-footer -->
</form>
</div> <script>
require(['vue'],function (Vue) {
new Vue({
el:'#app',
data:{
videos:[{title:'',path:''}]
},
methods:{
add:function () {
this.videos.push({title:'',path:''});
},
del:function (k) {
this.videos.splice(k,1);
}
}
});
});
</script> </section>
<!-- /.content -->
@endsection

第144行:一对多中多的那部分的数据是通过json到服务器的,然后添加到数据库

resources/views/admin/lesson/index.blade.php

后盾网lavarel视频项目---lavarel多表关联一对多操作实例-LMLPHP

 @extends('admin.layout.master')
@section('title','课程页面')
@section('content')
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
Dashboard
<small>Control panel</small>
</h1>
<ol class="breadcrumb">
<li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
<li class="active">Dashboard</li>
</ol>
</section> <!-- Main content -->
<section class="content">
<div style="padding-bottom:15px;">
<div class="btn-group" role="group" aria-label="...">
<a href="/admin/lesson" type="button" class="btn btn-warning">课程列表</a>
<a href="/admin/lesson/create" type="button" class="btn btn-default">新增课程</a>
</div>
</div> <div class="box box-primary">
<div class="box-header with-border">
<h3 class="box-title">Bordered Table</h3>
</div>
<!-- /.box-header -->
<div class="box-body">
<div class="table-responsive" style="overflow: visible;min-height: 200px;">
<table class="table table-hover">
<tbody>
<tr class="info">
<th style="width: 10px">#</th>
<th>课程</th>
<th>视频数量</th>
<th>操作</th>
</tr>
@foreach($data as $d)
<tr>
<td>{{$d['id']}}.</td>
<td>{{$d['title']}}</td>
<td>{{$d->videos()->count()}}</td>
<td>
<div class="btn-group">
<button type="button" class="btn btn-info">操作</button>
<button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
<span class="sr-only">Toggle Dropdown</span>
</button>
<ul class="dropdown-menu" role="menu" style="">
<li><a href="/admin/lesson/{{$d['id']}}/edit">编辑</a></li>
<li><a href="javascript:;" onclick="del({{$d['id']}})">删除</a></li>
</ul>
</div>
</td>
</tr>
@endforeach </tbody>
</table>
</div> </div>
<!-- /.box-body -->
<div class="box-footer clearfix">
<ul class="pagination pagination-sm no-margin pull-right">
<li><a href="#">«</a></li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">»</a></li>
</ul>
</div>
</div> </section>
<!-- /.content -->
<script>
function del(id){
// require(['util'],function () {
// util.confirm('确定删除么?',function () {
//
// });
// });
if(confirm('确定删除么')){
$.ajax({
url:'/admin/lesson/'+id,
method:'DELETE',
success:function (response) {
location.reload();
}
});
}
}
</script>
@endsection

第44行:直接 {{$d->videos()->count()}}就可以得到课程视频数,毕竟$data获取的只是Lesson模型的数据:$data=Lesson::get();

 
05-11 15:15