@extends('manage.layouts.app')
@section('content')

<div class="mb-5">
    <div class="ui breadcrumb">
        <a class="section">Dashboard</a>
        <div class="divider"> / </div>
        <a href="/cms/pages" class="section">Pages</a>
        <div class="divider"> / </div>
        <div class="active section">{{$page->id}}</div>
    </div>
</div>

<div class="relative">
    <form class="ui form" action="{{route('pages.update', $page->id)}}" method="post" enctype="multipart/form-data">
        @csrf
        {{method_field('PUT')}}
        <h3 class="ui header">{{$page->title}}</h3>
        <div class="ui divider"></div>

        <div class="field">
            <label>COPY URL</label>
            <div class="flex items-center space-x-4">
                <span class="bg-gray-100 py-1 px-3 rounded text-lg">{{ 'page/' . $page->slug }}</span>
                <a href="{{ url('/page',$page->slug) }}" target="_blank" class="rounded-full inline-block transition border border-gray-500 bg-gray-500 hover:bg-transparent px-3 text-gray-100">Visit Page <i class="linkify icon"></i> </a>
            </div>
        </div>

        <div class="field mb-5">
            <label>Title *</label>
            <input type="text" name="title" required value="{{$page->title}}" placeholder="Title / Name">
        </div>

        <div class="field mb-5">
            <label>Status</label>
            <div class="flex items-center mt-2" style="display: flex; gap: 20px;">
                <div class="flex items-center">
                    <input type="radio" name="status" value="1" id="status_active" @if ($page->status == 1) checked @endif style="width: 18px; height: 18px;">
                    <label for="status_active" style="margin-left: 8px; cursor: pointer;">Active</label>
                </div>
                <div class="flex items-center">
                    <input type="radio" name="status" value="0" id="status_inactive" @if ($page->status == 0) checked @endif style="width: 18px; height: 18px;">
                    <label for="status_inactive" style="margin-left: 8px; cursor: pointer;">Inactive</label>
                </div>
            </div>
        </div>

        <div class="field mb-5 flex items-center space-x-2">
            <label>Don't show title</label>
            <input type="checkbox" @if ($page->is_title == 1) checked @endif name="is_title" class="w-4 h-4">
        </div>

        <div class="field mb-5">
            <label>Change URL *</label>
            <input type="text" name="slug" required value="{{$page->slug}}" placeholder="change url">
        </div>

        <div class="field">
            <label>Change cover</label>

            <div class="ui large image mb-4">
                <img src="{{$cover}}">
            </div>

            <input type="file" name="cover">
        </div>

        <div class="field">
            <label>Content</label>
            <textarea rows="10" name="body" placeholder="Detail">{{$page->body}}</textarea>
        </div>

        <div class="field mb-5 flex items-center space-x-2">
            <label>Full Width Layout</label>
            <input type="checkbox" @if ($page->layout_type == 'full_width') checked @endif name="layout_type" class="w-4 h-4">
        </div>

        <div class="field">
            <label>Select field* </label>
            <select class="mt-2 capitalize" name="form_id">
                <option value="0">None</option>
                @foreach ($forms as $form)
                @if ($page->form && $page->form->id == $form->id)
                <option selected value="{{$page->form->id}}"> {{$page->form->title}} </option>
                @else
                <option value="{{$form->id}}"> {{$form->title}} </option>
                @endif
                @endforeach
            </select>
         </div>

         <div class="field">
                <label>Meta Title</label>
                <input type="text" name="meta_title" value="{{$page->meta_title}}" />
            </div>

            <div class="field">
                <label>Meta Description</label>
                <input type="text" name="meta_description" value="{{$page->meta_description}}" />

            </div>

        <button type="submit" class="ui button" tabindex="0">Update</button>
    </form>
    <div class="absolute right-0 bottom-0">
        <delete-record :id="{{$page->id}}" model="pages"></delete-record>
    </div>
</div>

@endsection