基于laravel-admin datagrid的使用过程记录

本文详细介绍如何使用Laravel Admin框架实现后台管理系统的图片上传功能及增删改查操作,包括创建控制器、模型、路由,配置上传路径,以及在模型中添加回调函数等关键步骤。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

step1:登陆laravel-admin后台,使用laravel-admin内置的菜单管理添加菜单
在这里插入图片描述
step2:然后使用git命令行或者cmd命令行进入项目安装路径,创建后台测试控制器:
php artisan admin:make TestController–model=App\Models\Test
接着在app/Admin/routes.php文件下添加后台访问路由
在这里插入图片描述
step3:执行如下命令创建模型
php artisan make:model Models/Test
执行完上述两条命令,进入编辑器,你会发现laravel已经为您创建好了模型和控制器,在TestController中,laravel-admin已经为您已经写好了7个方法,分别是index create show form grid edit detail,这里面已经初始化好了代码,接下来需要的就是在grid 方法和form方法中进行代码填充;
step5:在创建好的模型Test中,指定与数据库映射好的数据表,添加好下两行代码
protected $table = “test”;//要连接的表名称
public $timestamps = false;//将
在这里插入图片描述
step6:通过laravel框架中的数据迁移,创建数据表,参考文档(https://laravel-china.org/docs/laravel/5.5/migrations/1329)
执行如下命令,生成迁移文,新的迁移文件会被放置在 database/migrations目录中
php artisan make:migration test_migrateion
step7:打开迁移文件,加入如下代码:

    public function up()
    {
       Schema::create('test', function (Blueprint $table) {
            $table->increments('id');
            $table->string('name');
            $table->string('phone');
            $table->string('headerimgurl');
            $table->string('address');
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *  回滚数据库
     * @return void
     */
    public function down()
    {
       Schema::drop('test');
    }

step8:使用 Artisan 命令 migrate 来运行所有未完成的迁移,创建数据表
php artisan migrate
执行完这条命令以后,查看数据库你会发现多了一张test表
在这里插入图片描述
step9:为test表添加测试数据,laravel框架提供了数据填充功能,具体可以参考文档
https://laravel-china.org/docs/laravel/5.5/seeding/1330
通过运行 Artisan 命令 make:seeder 来生成 Seeder。由框架生成的 seeders 都将被放置在 database/seeds 目录下:
php artisan make:seeder TestSeeder
step10:找到TestSeeder文件添加测试代码,如下:

use Illuminate\Database\Seeder;
use Illuminate\Support\Facades\DB;
class TestSeeder extends Seeder
{
			    public function run()
			    {
			       for($i=1;$i<1000;$i++){
						 $name="zq".mt_rand(1,1000);
						 $phone=$this->getPhone();	 $headerimgurl="http://thirdwx.qlogo.cn/mmopen/iaz98hHiaiaicAhesOVqd1PmZ14lOtnY9oGtPzkbibUibdE0y5CKPiaDw3WTfNMYqEIlJVWY43o1e0zcwicNhRogdb9aEBBwkwC3vXXh/132";
					     $insert=[];
					     $insert['phone']=$phone;
					     $insert['address']="贵州理工学院";
					     $insert['name']=$name;
					     $insert['headerimgurl']=$headerimgurl;
					     DB::table("test")->insert($insert);	
					}
			    }
	 function getPhone(){
			    	$phone='';
			         for ($i=0; $i < 11; $i++) { 
			         	 if($i==0){
			                $phone.=mt_rand(1,9);
			         	 }else{
			         	 	 $phone.=mt_rand(0,9);
			         	 }
			         }
			         return $phone;
			    }
			}

step11:在DatabaseSeeder文件中的run方法中,添加如下代码调用自己编写的测试类
在这里插入图片描述
step12:运行seeders
composer dump-autoload
php artisan db:seed --class=TestSeeder
运行完这两条命令后面,这个时候你会发现test表中已经添加了1000条数据
在这里插入图片描述
step13:这个时候数据已经填充好了,接着按照laravel-admin提供的手册(https://laravel-admin.org/docs/zh/model-grid)开撸:
在Test控制器的grid方法中添加如下代码,控制显示的列

 protected function grid()
    {
               $grid = new Grid(new Test);
                $grid->id('id')->sortable();
                //第二列
                $grid->column('headerimgurl',"头像")
                   ->display(function ($headerimgurl) {
                        // return "<span style='color:blue'>$headerimgurl</span>";
                       return "<img src='$headerimgurl' width='30px'/>";
                    });
                $grid->column('name',"名称");
                $grid->column('phone',"手机号码");
                $grid->column('address',"地址");
                $grid->column('created_at',"创建时间");
                $grid->column('updated_at',"更新时间");
                // $grid->created_at();
                // $grid->updated_at();
                $grid->filter(function ($filter) {
                        // 设置created_at字段的范围查询
                        $filter->between('created_at', 'Created Time')->datetime();
               });
        return $grid;
    }

step14:刷新页面
在这里插入图片描述

其实到这里对test表的简单的显示,删除已经完成,但是小编突然想试试它的上传图片方法,于是小编又郁闷了一会,才发现在form方法中添加显示的表单元素可以完成,于是撸起袖子就干:

protected function form()
    {
        $form = new Form(new Test);
         $form->text('name', '姓名')->rules('required|min:2')->placeholder("请输入姓名");
         $form->text('phone', '手机号码')->rules('required|max:11')->placeholder("请输入手机号码");
         $form->file('headerimgurl', '头像');
         $form->text('address', '地址')->placeholder("请输入手机地址");
         // $form->display('created_at', '创建时间');
         // $form->display('updated_at', '修改时间');
         return $form;
      }

step15:配置上传路径
在config/fileSystem.php

  'disks' => [
        'local' => [
            'driver' => 'local',
            'root' => storage_path('app'),
        ],

        'public' => [
            'driver' => 'local',
            'root' => storage_path('app/public'),
            'url' => env('APP_URL').'/storage',
            'visibility' => 'public',
        ],

        's3' => [
            'driver' => 's3',
            'key' => env('AWS_ACCESS_KEY_ID'),
            'secret' => env('AWS_SECRET_ACCESS_KEY'),
            'region' => env('AWS_DEFAULT_REGION'),
            'bucket' => env('AWS_BUCKET'),
        ],
        'admin' => [
        'driver'     => 'local',
        'root'       => public_path('upload'),
        'visibility' => 'public',
        'url' => env('APP_URL').'/public/upload/',
       ],
    ],

step16:配置域名和日志
打开config/app.php,修改添加

                 'log' => 'daily',
          	     'log_level' => env('APP_LOG_LEVEL', 'debug'),
          	    'log_max_files' => 30,
          	    'rooot_site'=>"http://127.0.0.3/"

step17:在模型Test添加如下代码:

     public static function boot()
        {
            parent::boot();
            //保存前回调
            static::saving(function ($model) {
                 Log::info($model);
                 if(empty($model->created_at)){
                     $model->created_at=date("Y-m-d H:i:s",time());
                 }
                 $headerimgurl=$model->headerimgurl;
                 $headerimgurl=str_replace("",config("admin.root_site")."upload/",$headerimgurl);
                  $model->headerimgurl=config("admin.root_site")."upload/".$headerimgurl;
                  Log::info("模型保存前回调。。。。");
            });
            //更新模型前回调
            static ::updating(function($model){
    
                    $model->updated_at=date("Y-m-d H:i:s",time());
    
                  Log::info("模型更新前回调......");
            });
            //保存模型后回调
            static ::saved(function($model){
                  Log::info("模型保存后回调.....");
            });
            //更新模型后回调
            static::updated(function($model){
                 Log::info("模型更新后回调....");
            });
            //创建模型前回调
            static::creating(function($model){
                Log::info("创建模型前回调....");
            });
            //创建模型后回调
            static::created(function($model){
                Log::info("创建模型后回调....");
            });
            //删除前回调
            static::deleting(function($model){
                 Log::info("模型删除前回调....");
            });
            //删除后回调
            static::deleting(function($model){
                Log::info("模型删除后回调....");
            });
        }

step18:打开页面刷新,你可以发现基于laravel-admin上传图片,增删改查已经完美实现
在这里插入图片描述
最后总结:
laravel-admin已经将插入数据的方法已经完美实现,小编想修改上传保存到数据库的图片路径,添加更新时间和创建时间却无从下手,查看官方手册在form方法中提供了三个回调函数
在这里插入图片描述
小编从$form->headerimgurl获取到的二进制文件,不是文件上传后的路径,最后小编接着Goodle,最后发现在模型Model的源码有一个boot方法引导初始化,提供了一系列回调方法
在这里插入图片描述
这才解决问题!!!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值