Laravel 11 角色和权限4--文章模块

新建模型文件

php artisan make:model Article -m

编写迁移文件

Database/Migrations/2024_12_13_075513_create_articles_table.php

public function up(): void
{
    Schema::create('articles', function (Blueprint $table) {
        $table->id();
        $table->string('title');
        $table->text('text')->nullable();
        $table->string('author');
        $table->timestamps();
    });
}

执行迁移文件

php artisan migrate

创建文章控制器

php artisan make:controller ArticleController -r

App/Http/Controllers/ArticleController.php

<?php

namespace App\Http\Controllers;

use App\Models\Article;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Validator;

class ArticleController extends Controller
{
    /**
     * 文章首页
     */
    public function index()
    {
        $articles = Article::latest()->paginate(25);
        return view('articles.list', compact('articles'));
    }

    /**
     * 新增文章页面
     */
    public function create()
    {
        return view('articles.create');
    }

    /**
     * 执行文章新增
     */
    public function store(Request $request)
    {
        $validator = Validator::make($request->all(), [
            'title' => 'required|min:20',
            'author' => 'required|min:3',
        ]);

        if ($validator->passes()) {
            $article = new Article();
            $article->title = $request->title;
            $article->text = $request->text;
            $article->author = $request->author;
            $article->save();

            return redirect()->route('articles.index')->with('success', '文章添加成功~~');
        } else {
            return redirect()->route('articles.create')->withErrors($validator)->withInput();
        }
    }

    /**
     * 文章编辑页面
     */
    public function edit(string $id)
    {
        $article = Article::findOrFail($id);
        return view('articles.edit', compact('article'));
    }

    /**
     * 执行文章编辑
     */
    public function update(Request $request, string $id)
    {
        $article = Article::findOrFail($id);

        $validator = Validator::make($request->all(), [
            'title' => 'required|min:20',
            'author' => 'required|min:3',
        ]);

        if ($validator->passes()) {
            $article->title = $request->title;
            $article->text = $request->text;
            $article->author = $request->author;
            $article->save();

            return redirect()->route('articles.index')->with('success', '文章编辑成功~~');
        } else {
            return redirect()->route('articles.edit')->withErrors($validator)->withInput();
        }
    }

    /**
     * 删除
     */
    public function destroy(Request $request)
    {
        $article = Article::find($request->id);

        if ($article == null) {
            session()->flash('error', '未找到权限~');
            return response()->json([
                'status' => false
            ]);
        }

        $article->delete();
        session()->flash('success', '文章删除成功~');
        return response()->json([
            'status' => true
        ]);

    }
}

文章首页

resources/views/articles/list.blade.php

<x-app-layout>
    <x-slot name="header">
        <div class="flex justify-between">
            <h2 class="font-semibold text-xl text-gray-800 leading-tight">
                {{ __('文章列表') }}
            </h2>
            <a href="{{ route('articles.create') }}"
               class="bg-slate-700 text-sm rounded-md text-white px-3 py-2">新增</a>
        </div>
    </x-slot>

    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
            {{-- 表单成功验证 --}}
            <x-message></x-message>

            <table class="w-full">
                <thead class="bg-gray-50">
                <tr class="border-b">
                    <th class="px-6 py-3 text-left" width="60">#</th>
                    <th class="px-6 py-3 text-left">标题</th>
                    <th class="px-6 py-3 text-left">作者</th>
                    <th class="px-6 py-3 text-left" width="180">创建时间</th>
                    <th class="px-6 py-3 text-center" width="180">操作</th>
                </tr>
                </thead>
                <tbody class="bg-white">

                @if($articles->isNotEmpty())
                    @foreach($articles as $article)
                        <tr class="border-b">
                            <td class="px-6 py-3 text-left">{{$article->id}}</td>
                            <td class="px-6 py-3 text-left">{{$article->title}}</td>
                            <td class="px-6 py-3 text-left">{{$article->author}}</td>
                            <td class="px-6 py-3 text-left">{{$article->created_at}}</td>
                            <td class="px-6 py-3 text-center">
                                <a href="{{ route('articles.edit',$article->id) }}"
                                   class="bg-slate-700 text-sm rounded-md text-white px-3 py-2 hover:bg-slate-600">编辑</a>
                                <a href="javascript:void(0);" onclick="deletePermission({{$article->id}})"
                                   class="bg-red-600 text-sm rounded-md text-white px-3 py-2 hover:bg-red-500">删除</a>
                            </td>
                        </tr>
                    @endforeach
                @endif

                </tbody>
            </table>
            <div class="my-3">
                {{--分页--}}
                {{$articles->links()}}
            </div>
        </div>
    </div>

    <x-slot name="script">
        <script type="text/javascript">
            {{--AJAX文章删除--}}
            function deletePermission(id) {
                if (confirm("您确定要删除么~~")) {
                    $.ajax({
                        url: '{{ route('articles.destroy') }}',
                        type: 'delete',
                        data: {id: id},
                        dataType: 'json',
                        headers: {
                            'x-csrf-token': '{{ csrf_token() }}'
                        },
                        success: function (response) {
                            window.location.href = '{{ route('articles.index') }}';
                        }
                    });
                }
            }
        </script>
    </x-slot>
</x-app-layout>

新增页面

resources/views/articles/list.blade.php

<x-app-layout>
    <x-slot name="header">
        <div class="flex justify-between">
            <h2 class="font-semibold text-xl text-gray-800 leading-tight">
                文章 / 新增
            </h2>
            <a href="{{ route('articles.index') }}"
               class="bg-slate-700 text-sm rounded-md text-white px-5 py-3">权限列表</a>
        </div>
    </x-slot>

    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
                <div class="p-6 text-gray-900">

                    <form action="{{ route('articles.store') }}" method="post">
                        @csrf

                        <div>
                            <label for="" class="text-sm font-medium">标题</label>
                            <div class="my-3">
                                <input value="{{old('title')}}" name="title" placeholder="请输入标题" type="text"
                                       class="border-gray-300 shadow-sm w-1/2 rounded-lg">

                                @error('title')
                                <p class="text-red-400 font-medium">{{ $message }}</p>
                                @enderror

                            </div>

                            <label for="" class="text-sm font-medium">内容</label>
                            <div class="my-3">
                                <textarea name="text" placeholder="请输入内容" id="text" class="border-gray-300 shadow-sm w-1/2 rounded-lg"
                                          cols="30" rows="10">{{old('text')}}</textarea>
                            </div>

                            <label for="" class="text-sm font-medium">作者</label>
                            <div class="my-3">
                                <input value="{{old('author')}}" name="author" placeholder="请输入作者" type="text"
                                       class="border-gray-300 shadow-sm w-1/2 rounded-lg">

                                @error('author')
                                <p class="text-red-400 font-medium">{{ $message }}</p>
                                @enderror

                            </div>

                            <button class="bg-slate-700 text-sm rounded-md text-white px-5 py-3">新增</button>
                        </div>
                    </form>

                </div>
            </div>
        </div>
    </div>
</x-app-layout>

编辑页面

resources/views/articles/edit.blade.php

<x-app-layout>
    <x-slot name="header">
        <div class="flex justify-between">
            <h2 class="font-semibold text-xl text-gray-800 leading-tight">
                文章 / 编辑
            </h2>
            <a href="{{ route('articles.index') }}"
               class="bg-slate-700 text-sm rounded-md text-white px-5 py-3">权限列表</a>
        </div>
    </x-slot>

    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
                <div class="p-6 text-gray-900">

                    <form action="{{ route('articles.update',$article->id) }}" method="post">
                        @csrf

                        <div>
                            <label for="" class="text-sm font-medium">标题</label>
                            <div class="my-3">
                                <input value="{{old('title',$article->title)}}" name="title" placeholder="请输入标题" type="text"
                                       class="border-gray-300 shadow-sm w-1/2 rounded-lg">

                                @error('title')
                                <p class="text-red-400 font-medium">{{ $message }}</p>
                                @enderror

                            </div>

                            <label for="" class="text-sm font-medium">内容</label>
                            <div class="my-3">
                                <textarea name="text" placeholder="请输入内容" id="text" class="border-gray-300 shadow-sm w-1/2 rounded-lg"
                                          cols="30" rows="10">{{old('text',$article->text)}}</textarea>
                            </div>

                            <label for="" class="text-sm font-medium">作者</label>
                            <div class="my-3">
                                <input value="{{old('author',$article->author)}}" name="author" placeholder="请输入作者" type="text"
                                       class="border-gray-300 shadow-sm w-1/2 rounded-lg">

                                @error('author')
                                <p class="text-red-400 font-medium">{{ $message }}</p>
                                @enderror

                            </div>

                            <button class="bg-slate-700 text-sm rounded-md text-white px-5 py-3">更新</button>
                        </div>
                    </form>

                </div>
            </div>
        </div>
    </div>
</x-app-layout>