web后端开发之php开发框架laravel5.5小项目(CRUD)

  • List item

1.创建Device模型

php artisan make:model Device

在这里插入图片描述

    //用户模型关联的表
    public $table="devices";
    //关联表的主键
    public $primaryKey="device_id";
    //禁用模型的时间戳
    public $timestamps =false;

2.创建Device资源控制器

 php artisan make:Controller  DeviceController r  DeviceController --resource

在这里插入图片描述

在web.php中加入

Route::resource('/device',"DeviceController");

3.devices表设计

在这里插入图片描述

4.设备列表资源控制器

//获取10条
$devices = Device::paginate(10);
return view('device.list')->with('devices',$devices);

5.设备列表页面

<div class="container">

<h2>设备管理</h2>
<input type="button" onclick="location.href='/user/create'" class="btn btn-success" value="添加设备" />

<table class="table table-striped">
 <thead>
<tr>
<th>用户id</th>
<th>设备id</th>
<th>设备名字</th>
<th>设备类型</th>
<th>设备位置</th>
<th>设备数据</th>
<th>操作</th>
</tr>
 </thead>
 <tbody>
 @foreach($devices as $v)
 <tr>
 <td>{
   
   {$v->user_id}}</td>
  <td>{
   
   {$v->device_id}}</td>
  <td>{
   
   {$v->device_name}}</td>
   <td>{
   
   {$v->device_type}}</td>
    <td>{
   
   {$v->device_location}}</td>
     <td>{
   
   {$v->device_data}}</td>
     <td>
     <input type="button" value="编辑" onclick="location.href='/device/{
     
     {$v->id}}/edit'"/>
     <input type="button" value="删除" onclick="deleteOne({
     
     {$v->id}})" />
     </td> 
 </tr> 
 @endforeach 
 </tbody> 
</table>

{
   
   {$devices->links()}}

</div>
<script type="text/javascript">
function deleteOne(id)
{
     
     
	$.post("user/"+id,{
     
     "id":id,"_token":"{
     
     {csrf_token()}}","_method":"DELETE"},
		function(data){
     
     
			alert(data);
			location.reload();
		},'text');
	}
</script>


运行截图

在这里插入图片描述

6.添加设备

只能在已存在的用户下添加设备,如果用户不存在,那么添加失败。

界面代码:

@extends('layouts.app')

@section('content')
<div class="container">

<h2>添加新设备</h2>
<br>
<form action="/device" method="post">
{
   
   {csrf_field()}}
 <div class="form-group">
    <label for="user_id">用户ID</label>
    <input type="text" class="form-control" name="user_id" id="user_id" placeholder="请输入用户ID.....">
  </div>
 
  <div class="form-group">
    <label for="device_id">设备ID</label>
    <input type="text" class="form-control" name="device_id" id="device_id" placeholder="请输入设备ID.....">
  </div>

 <div class="form-group">
    <label for="device_name">设备名称</label>
    <input type="text" class="form-control" name="device_name" id="device_name" placeholder="请输入用户名称....">
  </div>

  <div class="form-group">
    <label for="device_type">设备类型</label>  
    <select  class="form-control"  name="device_type" id="device_type">
        <option value="传感器">传感器</option>
        <option value="继电器">继电器</option>
        <option value="其他">其他</option>                         
    </select>
  </div>
  
  <div class="form-group">
    <label for="username">设备位置</label>
    <input type="text" class="form-control" name="device_location" id="device_location" placeholder="请输入设备位置">
  </div>

  <button type="submit" class="btn btn-default" >提交</button>
</form>

</div>



@endsection

资源控制器中create函数

public function create()
    {
    
    
        //
        return view('device.create');

    }

提交时调用store函数

 //新建一个设备和用户
        $device = new Device();
        $user = new User();
        if($request->user_id!=null&&$request->device_id!=null&&$request->device_name!=null
           &&$request->device_type!=null&&$request->device_location!=null){
    
    
           //查找user表中是否存在该用户,存在即可添加设备,不存在不运行添加
            $user = User::find($request->user_id);
            if($user!=null)
            {
    
    
                $device->user_id=$request->user_id;
                $device->device_id=$request->device_id;
                $device->device_name=$request->device_name;
                $device->device_type=$request->device_type;
                $device->device_location=$request->device_location;
                //将该设备信息保存
                 $device->save();
                 //重定向至“/user路由”
                 return redirect("/device");
            }
            else{
    
    
                //
                return "用户不存在!";
            }
            

           }
        else{
    
    
           
            return "请检查表单是否填写完整!" ;
        }



        
    }

在这里插入图片描述

7.删除设备

界面代码:

<input type="button" value="删除" onclick="deleteOne({
   
   {$v->device_id}})" />
<script type="text/javascript">
function deleteOne(id)
{
	$.post("device/"+id,{"id":id,"_token":"{
   
   {csrf_token()}}","_method":"DELETE"},
		function(data){
			alert(data);
			location.reload();
		},'text');
	}
</script>

在Device资源控制器的destory函数中

     public function destroy($id)
    {
    
    
        $device=Device::find($id);
        $device->delete();
        return "Done";
    }

界面

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-eWhIja0e-1607841855569)(C:\Users\jiangdada\AppData\Roaming\Typora\typora-user-images\image-20201212135603574.png)]

8.查看信息

点击设备id时,跳转的路由

<td><a href="/device/{
     
     {$v->device_id}}">{
   
   {$v->device_id}}</a></td>

资源控制器中show函数,返回查看详情视图,并携带参数

public function show($id)
{
        $device=Device::find($id);
        return view('device.show')->with('device',$device);
}

查看详情视图

@extends('layouts.app')
@section('content')
<div class="container">
<h2>设备详情</h2>
<p>用户备位置:{
    
    {
    
    $device->device_location}}</p>
</div>
@endsection

界面如下:
1

9.编辑设备

点击编辑设备,编辑设备的名称和位置。

 <input type="button" value="编辑" onclick="location.href='/device/{
     
     {$v->device_id}}/edit'"/>

资源控制器中edit函数跳转至编辑视图

    public function edit($id)
    {
    
    
        return view('device.edit')->with('id',$id);
    }

编辑界面视图

@extends('layouts.app')

@section('content')

<h2>编辑设备信息</h2>
<form action="/device/{
   
   {$id}}" method="post">
{
   
   {csrf_field()}}
{
   
   {method_field('PUT')}}
<div class="form-group">
    <label for="name">设备名称</label>
    <input type="text" class="form-control" id="device_name" name="device_name" placeholder="请输入设备名称">
  </div>
    <div class="form-group">
    <label for="location">设备位置</label>
    <input type="text" class="form-control" id="device_location" name="device_location" placeholder="请输入设备位置">
  </div>
  <input type="submit" value="提交"/>
</form>
@endsection

编辑界面

在这里插入图片描述

资源控制器中update函数

    public function update(Request $request, $id)
    {
    
    
        //
        $device = Device::find($id);
        $device->device_name=$request->device_name;
        $device->device_location=$request->device_location;
        $device->save();
        return redirect("/device");
    }

猜你喜欢

转载自blog.csdn.net/JIANGYINGH/article/details/111115665