Laravel 11 书评网3--书籍首页模块

56 阅读1分钟

创建控制器

php artisan make:controller HomeController

路由

// 首页
Route::get('/', [\App\Http\Controllers\HomeController::class, 'index'])
    ->name('home');

App/Http/Controllers/HomeController

<?php

namespace App\Http\Controllers;

use App\Models\Book;
use Illuminate\Http\Request;

class HomeController extends Controller
{
    // 首页
    public function index(Request $request)
    {
        $books = Book::orderBy('created_at', 'DESC');

        // 搜索标题
        if (!empty($request->keyword)) {
            $books->where('title', 'like', '%' . $request->keyword . '%');
        };

        $books = $books->where('status', 1)->paginate(8);

        return view('home', compact('books'));
    }
}

resources/views/home.blade.php

@extends('layouts.app')

@section('title', '首页')

@section('content')

    <div class="container mt-3 pb-5">
        <div class="row justify-content-center d-flex mt-5">
            <div class="col-md-12">
                <div class="d-flex justify-content-between">
                    <h2 class="mb-3">书籍</h2>
                    <div class="mt-2">
                        <a href="{{ route('home') }}" class="text-dark">清除</a>
                    </div>
                </div>
                <div class="card shadow-lg border-0">

                    <form action="" method="get">
                        <div class="card-body">
                            <div class="row">
                                <div class="col-lg-11 col-md-11">
                                    <input type="text" class="form-control form-control-lg" name="keyword"
                                           value="{{ Request::get('keyword') }}" placeholder="请您输入搜索标题">
                                </div>
                                <div class="col-lg-1 col-md-1">
                                    <button class="btn btn-primary btn-lg w-100"><i
                                            class="fa-solid fa-magnifying-glass"></i></button>
                                </div>
                            </div>
                        </div>
                    </form>

                </div>
                <div class="row mt-4">
                    {{--将空字符进行判断,有空字符也会判断为不空--}}
                    @if($books->isNotEmpty())
                        @foreach($books as $book)
                            <div class="col-md-4 col-lg-3 mb-4">
                                <div class="card border-0 shadow-lg">
                                    <a href="{{ route("book.detail",$book->id) }}">
                                        @if($book->image != '')
                                            <img src="{{ asset('uploads/books/thumb/' .$book->image)}}" alt=""
                                                 class="card-img-top">
                                        @else
                                            <img src="https://placehold.co/990x1400?text=No Image" alt=""
                                                 class="card-img-top">
                                        @endif
                                    </a>
                                    <div class="card-body">
                                        <h3 class="h4 heading"><a href="#">{{ $book->title }}</a></h3>
                                        <p>{{ $book->author }}</p>
                                        <div class="star-rating d-inline-flex ml-2" title="">
                                            <span class="rating-text theme-font theme-yellow">5.0</span>
                                            <div class="star-rating d-inline-flex mx-2" title="">
                                                <div class="back-stars ">
                                                    <i class="fa fa-star " aria-hidden="true"></i>
                                                    <i class="fa fa-star" aria-hidden="true"></i>
                                                    <i class="fa fa-star" aria-hidden="true"></i>
                                                    <i class="fa fa-star" aria-hidden="true"></i>
                                                    <i class="fa fa-star" aria-hidden="true"></i>

                                                    <div class="front-stars" style="width: 100%">
                                                        <i class="fa fa-star" aria-hidden="true"></i>
                                                        <i class="fa fa-star" aria-hidden="true"></i>
                                                        <i class="fa fa-star" aria-hidden="true"></i>
                                                        <i class="fa fa-star" aria-hidden="true"></i>
                                                        <i class="fa fa-star" aria-hidden="true"></i>
                                                    </div>
                                                </div>
                                            </div>
                                            <span class="theme-font text-muted">(2 Reviews)</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endforeach
                    @endif

                    {{--分页--}}
                    {{$books->links()}}

                </div>
            </div>
        </div>
    </div>

@endsection