Get best of the week

Buat todo untuk perintah jarak jauh di Laravel

Salute, Khabrovsk. Artikel berikut ini ditulis oleh salah satu pembaca reguler kami dan jelas tidak mengklaim sebagai materi hardcore, tetapi mungkin berfungsi sebagai tutorial untuk pemula. Kami menantikan pendapat Anda tentang artikel di komentar, dan untuk pengetahuan lebih lanjut, kami mengundang Anda ke kursus Kerangka Kerja Laravel kami .



Halo semuanya! Hari ini, dalam waktu yang sangat "terpencil" untuk semua orang, saya ingin melihat pembuatan todo sederhana di mana Anda dapat membuat tugas Anda sendiri. Kedengarannya seperti apa yang tertulis dalam dokumentasi Laravel resmi, dan bagaimana itu - saya menggunakan todo mereka sebagai basis, mengubahnya sedikit, dan sebagian besar cerita saya akan tentang cara membuat peran administrator dan membuat klon konyol lainnya Trello sepertinya sangat tidak konsisten .

Buat yayasan




Seperti yang saya katakan, kami akan mengambil panduan berikutnya sebagai dasar . Ini sangat sederhana dan lebih berfokus pada bekerja dengan migrasi dan perutean daripada pada pengontrol dan model pemrograman. Sayangnya, itu tidak diperbarui dari versi 5.1, dan jika Anda baru memulai program di Laravel pada versi 7 terakhir (itu baru segar pada tanggal 3 Maret), Anda tidak perlu menulis rute ke app/Http/routes.php, tetapi untuk routes/web.php(ini sudah berubah sejak versi 6 ), dan secara umum, seluruh perbedaan berakhir di sini. Pada akhirnya, Anda harus mendapatkan sesuatu seperti ini:



Saya juga mengubah kerangka tata letak dari bootstrap ke bulma. Pertama, saya menyukainya lebih baik, tetapi kedua, saya sudah memiliki basis kode dari templat pendaftaran blade (meskipun, di sisi lain, membangun halaman pendaftaran dan otorisasi sangat sederhana, saya akan menunjukkan caranya).

Versi proyek ini dapat diunduh di sini di cabang utama (dan di cabang baru Anda dapat mengunduh aplikasi yang sudah selesai). Anda dapat mengaktifkannya menggunakan perintah berikut, asalkan Anda sudah menginstal komposer dan laravel:

composer install
//   .env,    .env example,     
php artisan key:generate //  
php artisan serve //

Kami membuat otorisasi dan registrasi

Otorisasi out of the box telah berubah dari versi 6. Sekarang untuk pembuatan cepat, Anda perlu menginstal paket yang dapat dengan cepat menghasilkan pengontrol dan templat blade:

composer install laravel/ui
php artisan ui vue --auth

Beberapa file baru akan muncul di proyek Anda: subfolder auth akan muncul

di folder sumber daya , di mana akan ada file templat blade yang didedikasikan untuk otorisasi, kata sandi. Awalnya, templat blade dibuat dalam bootstrap , namun, saya mengubahnya sedikit menjadi bulma untuk menjaga kerangka css umum dalam proyek. Namun, agar nyaman menggunakan situs web, kita memerlukan bilah navigasi. Dalam sumber daya, saya membuat folder include , di mana saya menempatkan file tambahan - header dan nav . Agar tidak mengambil banyak ruang, saya akan mengatakan bahwa di header saya hanya memiliki kepala dengan koneksi bulma, dan di sana adalah sebagai berikut:nav.blade.php

<nav class="navbar has-background-black-ter" role="navigation" aria-label="main navigation">
  <div class="navbar-brand">
    <a class="navbar-item has-text-white is-size-4" href="/">
      TODO
    </a>
    <a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
      <span aria-hidden="true"></span>
      <span aria-hidden="true"></span>
      <span aria-hidden="true"></span>
    </a>
  </div>
  <div class="navbar-menu">
    <div class="navbar-start">
      @if (Auth::check())
      <button type="button" class="button is-primary">
        <!--   ,  ->   -->
        {{{ Auth::user()->name}}}
      </button>
      @else
      <!--    -->
      <a class="navbar-item has-text-danger" href="{{route('register')}}"></a>
      <a class="navbar-item has-text-danger" href="{{route('login')}}"></a>
      @endif
      @if (Auth::check())
      <!--  ,       -->
      <!--      -->

      <a class="navbar-item has-text-danger" href="{{url('/logout') }}" onclick="event.preventDefault();
                  document.getElementById('logout-form').submit();">
         </a>
      <form id="logout-form" action="{{ url('/logout') }}" method="POST" style="display: none;">
        {{ csrf_field() }}
      </form>

      @endif
      </ul>
    </div>

    <div class="navbar-end">
      <!-- navbar items -->
    </div>
  </div>
</nav>

Kami mulai membuat arsitektur kami


Sudah waktunya untuk membahas struktur proyek kami. Maka pembaca akan dapat mengubah aplikasi ke kebutuhan mereka, tetapi sekarang, katakanlah, saya ingin aplikasi memiliki satu administrator (katakanlah, seorang manajer proyek) yang dapat mengatur dan menghapus tugas, dan semacam tim yang dapat melihat perintah-perintah ini. Tentu saja, akan sangat menyenangkan jika seseorang dapat mengambil tugas dan menunjukkan bahwa dialah yang melakukan itu, tetapi lebih pada nanti.

Oke, itu berarti kita akan memiliki dua kelompok pengguna dan setuju bahwa hanya pengguna yang diberi akses yang dapat melihat papan tugas kami, dan beberapa administrator super dapat menambahkan tugas. Mari kita mulai.

Untuk sedikit penyederhanaan, saya memutuskan untuk membagi aplikasi menjadi dua halaman: satu di mana kita hanya akan memiliki tugas tanpa kemampuan untuk mengedit, dan yang kedua, yang hanya akan tersedia untuk admin super. Saya memutuskan untuk memberi nama halaman yang tersedia untuk tim welcome.blade.php:

@include('includes.header')

<body>
    @include('includes.nav')
    <div class="columns is-centered">
        <div class="column is-half">
            <div class="panel">
                <div class="panel-heading">
                     
                </div>

                <div class="panel-body">
                    @foreach ($tasks as $task)
                    <a class="panel-block">
                        <button class="button is-rounded">
                            <span>{{ $task->name }}</span>
                        </button>
                        @endforeach
                </div>
            </div>
        </div>
    </div>
<body>
</html>

Halaman ini hanya mencantumkan tugas. Untuk menampilkannya, saya akan menambahkan jalur baru di web.php:

Route::get('/', function () {
    return view('welcome', [
        'tasks' => Task::orderBy('created_at', 'asc')->get(),
    ]);
});

Templat di mana kami memiliki daftar yang sama, tetapi dengan kemampuan untuk mengedit dan menambahkan, disebut task.blade.php. Itu terlalu besar, jadi saya akan meletakkannya di bawah spoiler:

task.blade.php
@extends('layouts.app')

@section('content')
<div class="columns is-centered">
    <div class="column is-half">
        <div class="panel">
            <div class="panel-heading">
                 
            </div>
            <div class="panel-block">
                @include('common.errors')
                <!--     -->
                <form action="{{ url('task')}}" method="POST">
                    {{ csrf_field() }}

                    <div class="field">
                        <label for="task-name" class="label is-medium"></label>
                        <input type=" text" name="name" id="task-name" class="input is-medium"
                            value="{{ old('task') }}">
                    </div>

                    <div class="field">
                        <button type="submit" class="button is-success">
                            <span class="icon">
                                <i class="fa fa-btn fa-plus">
                            </span></i>
                            <span> </span>
                        </button>
                    </div>
                </form>
            </div>
        </div>

        <!-- Current Tasks -->
        @if (count($tasks) > 0)
        <div class="panel">
            <div class="panel-heading">
                 
            </div>

            <div class="panel-body">
                {{-- <table class="table table-striped task-table">
                    <thead>
                        <th></th>
                        <th> </th>
                    </thead>
                    <tbody> --}}
                @foreach ($tasks as $task)
                <a class="panel-block">
                    <button class="button is-rounded">
                    <span>{{ $task->name }}</span>
                </button>
                    <form action="{{ url('task/'.$task->id) }}" method="POST">
                        {{ csrf_field() }}
                        {{ method_field('DELETE') }}
                        <button type="submit" class="button is-danger">
                            <span class="icon is-small"> <i class="fa fa-btn fa-trash"></i></span>
                            <span>  </span>
                        </button>
                    </form>
                </a>
                @endforeach
            </div>
        </div>
        @endif
    </div>
</div>
@endsection


Dan templat ini, seperti tutorial asli, diperluas ke app/layouts.blade.php:

@include('includes.header')

<body>
    @include('includes.nav')

    @yield('content')

</body>

</html>

Baik! Kami memutuskan tampilan, sekarang kami dapat melanjutkan ke perutean dan membuat milik kami middlewares.

Pertama, mari kita masuk ke model Pengguna dan menambahkan tipe pengguna baru:

const ADMIN_TYPE = 'admin';
const TEAM_TYPE = 'team';
#       :

public function isAdmin(){        
    return $this->type === self::ADMIN_TYPE;
    //        
}

Selanjutnya, buka migrasi terakhir dari tabel pengguna (database / folder migrasi) dan tambahkan kolom dengan tipe data baru kami:

$table->string('type')->default('team');
//  ,

Selanjutnya, lihat app/Http/Controllers/Auth/RegisterController.phpdan edit fungsi create sedikit (itu juga terlihat sedikit berbeda di versi 5):

protected function create(array $data)
    {
        return User::create([
            'name' => $data['name'],
            'email' => $data['email'],
            'password' => Hash::make($data['password']),
            'type' => User::TEAM_TYPE,  
        ]);
    }

Oke, kalau begitu kita perlu membuat middleware kita untuk admin. Cara termudah untuk melakukan ini adalah dengan perintah berikut:

php artisan make:middleware IsAdmin

Saya harap Anda berhasil. Di folder HTTP/middlewareAnda seharusnya muncul isAdmin.php, di mana fungsi pegangan perlu diedit sebagai berikut:

public function handle($request, Closure $next)
    {
        if(auth()->user()->isAdmin()) {
            return $next($request);
        //   , .   -   
    }
        return redirect('/');
    }

Berikutnya, kita harus mendaftar kami middleware dalam app/HTTP/Kernelrangka untuk menggunakannya:

protected $routeMiddleware = [
    #  ,      
        is_admin' => \App\Http\Middleware\IsAdmin::class,
];

Kami mengubah jalur dasbor menjadi web.php, yang seharusnya hanya dapat melihat admin super:

Route::get('/dash', function () {
    return view('tasks', [
        'tasks' => Task::orderBy('created_at', 'asc')->get(),
    ]); 
})
->middleware('is_admin')    
->name('admin');

#       

Auth::routes();
Route::post('/logout', 'Auth\LoginController@logout')->name('logout');

Tetap membuat pengontrol khusus untuk administrator kami:

php artisan make:controller AdminController

Editing:

public function __construct()
    {
        $this->middleware('auth');
    }
    public function admin()
    {
        return view('admin');
    }

Agar pendaftaran semua diperoleh dengan tepat, jangan lupa untuk memperbaiki pengalihan RouteServiceProvider.phpke app/HTTP/Providerskarena awalnya dirancang untuk pola rumah:

public const HOME = '/';

Sekarang administrator hanya dapat muncul dengan bantuan asisten kami di terminal tinker:

php artisan tinker
use App\User;
User::where('email', 'admin@mail.com')->update(['type' => 'admin']);
//

Itu saja. Jika Anda ingin mencoba aplikasi yang sudah selesai, saya akan mengulangi tautannya. Tentu saja, aplikasi kami tidak dapat digunakan dalam produksi sekarang, karena semua orang yang telah terdaftar pada sumber daya dapat melihat tugas Anda. Tetapi bagaimana Anda akan membatasi akses?

Mungkin Anda memiliki email perusahaan, dan kemudian Anda dapat membatasi akses ke tim menggunakan pelanggan tetap dalam validasi email. Atau Anda dapat menambahkan cek untuk keanggotaan dalam tim dengan cara yang sama seperti admin, setelah melakukan manipulasi serupa. Secara tradisional, saya akan memberikan beberapa tautan yang bermanfaat bagi mereka yang baru akan mulai menguasai Laravel:

→ Artikel yang sedikit lebih detail daripada di dokumentasi tentang migrasi ke Laravel
→ Artikel bagus tentang Menengah tentang peran di Laravel
→ Laravel 7


« » Forge/Envoyer.

More articles:


All Articles