Blog Details

img-159

Professional Laravel Development & API Integration

this is description

@extends('client.layouts.master')

@section('title', isset($blog->id) ? 'Edit Blog' : 'Create Blog')


@section('content')

<div class="app-content content">

  <div class="content-overlay"></div>

  <div class="header-navbar-shadow"></div>

  <div class="content-wrapper container-xxl p-0">

    <div class="content-header row">

      <div class="content-header-left col-md-9 col-12 mb-2">

        <div class="row breadcrumbs-top">

          <div class="col-12">

            <h2 class="content-header-title float-start mb-0">{{ isset($blog->id) ? 'Edit Blog' : 'Create Blog' }}</h2>

            <div class="breadcrumb-wrapper">

              <ol class="breadcrumb">

                <li class="breadcrumb-item"><a href="{{ route('client.dashboard.index') }}">Home</a></li>

                <li class="breadcrumb-item"><a href="{{ route('client.blog.index') }}">Blogs</a></li>

                <li class="breadcrumb-item active">{{ isset($blog->id) ? 'Edit' : 'Create' }}</li>

              </ol>

            </div>

          </div>

        </div>

      </div>

    </div>

    <div class="content-body">

      <div class="card">

        <div class="card-body">

          <form action="{{ isset($blog->id) ? route('client.blog.update', $blog->id) : route('client.blog.store') }}" method="POST" enctype="multipart/form-data">

            @csrf

            @if(isset($blog->id))

              @method('PUT')

            @endif

             

            <div class="mb-3">

              <label for="title" class="form-label">Title</label>

              <input type="text" class="form-control" id="title" name="title" value="{{ old('title', $blog->title ?? '') }}" required>

            </div>


            <div class="mb-3">

              <label for="description" class="form-label">Description</label>

              <textarea class="form-control" id="description" name="description" rows="3" required>{{ old('description', $blog->short_description ?? '') }}</textarea>

            </div>


            <div class="mb-3">

              <label for="blog_image" class="form-label">Blog Image</label>

              @if(isset($blog->image_path) && $blog->image_path)

                <div class="mb-2">

                  <img src="{{ showPublicImages($blog->image_path) }}" alt="Blog Image" class="img-fluid" width="150" height="150">

                </div>

              @endif

              <input type="file" class="form-control" id="blog_image" name="blog_image" accept="image/*">

            </div>


            <div class="mb-3">

              <label for="thumbnail_image" class="form-label">Thumbnail Image</label>

              @if(isset($blog->thumbnail_image_path) && $blog->thumbnail_image_path)

                <div class="mb-2">

                  <img src="{{ showPublicImages($blog->thumbnail_image_path) }}" alt="Thumbnail Image" class="img-fluid" width="150" height="150">

                </div>

              @endif

              <input type="file" class="form-control" id="thumbnail_image" name="thumbnail_image" accept="image/*">

            </div>


            <div class="mb-3">

              <label for="content" class="form-label">More Details</label>

              <div id="editor">{!! old('content', $blog->editor_content ?? '') !!}</div>

              <input type="hidden" name="content" id="content">

            </div>


            <button type="submit" class="btn btn-primary">{{ isset($blog->id) ? 'Update' : 'Create' }}</button>

            <a href="{{ route('client.blog.index') }}" class="btn btn-secondary">Cancel</a>

          </form>

        </div>

      </div>

    </div>

  </div>

</div>


<!-- Include Quill JS -->

<link href="https://cdn.quilljs.com/1.3.6/quill.snow.css" rel="stylesheet">

<script src="https://cdn.quilljs.com/1.3.6/quill.min.js"></script>


<script>

  var quill = new Quill('#editor', {

    theme: 'snow',

    placeholder: 'Write your blog details here...',

    modules: {

      toolbar: [

        [{ header: [1, 2, false] }],

        ['bold', 'italic', 'underline'],

        [{ list: 'ordered' }, { list: 'bullet' }],

        ['link', 'image']

      ]

    }

  });


  document.querySelector('form').onsubmit = function () {

    document.querySelector('#content').value = quill.root.innerHTML;

  };

</script>


@endsection


26