@extends("admin.layouts.app")
@section("css-links")

    <link rel="stylesheet" type="text/css" href="{{mix("css/dataTables.bootstrap4.min.css")}}"/>
    <link rel="stylesheet" type="text/css" href="{{mix("css/select.bootstrap4.min.css")}}"/>
    <style>
        .properties-box .property-box h4{
            padding: 15px 0;
            background: #f6f6f6;
            margin-bottom: 10px;
            font-size: 16px;
            border: 1px solid #f2f2f2;

        }
        .properties-box .property-box.radius-left h4 {border-radius: 25px 0 0 25px;}
        .properties-box .property-box.radius-right h4 {border-radius: 0 25px 25px 0;}
        .properties-box .description-box {
            padding: 15px ;
            background: #f6f6f6;
            margin-bottom: 10px;
            font-size: 16px;
            border: 1px solid #f2f2f2;
        }

    </style>
@endsection
@section("page-header")
    <div class="section-header">
        <h1>Properties</h1>
        <div class="section-header-breadcrumb">
            <div class="breadcrumb-item active"><a href="#">Admin</a></div>
            <div class="breadcrumb-item">Posts</div>
            <div class="breadcrumb-item">{{$post->id}}</div>
            <div>Details</div>
        </div>
    </div>
@endsection

@section("content")
    @include("admin.includes.page-message")

    <div class="section-body">
        <h2 class="section-title">Post Details</h2>
        <p class="section-lead">
            View All Post Details
        </p>

        <div class="row">
            <div class="col-lg-12">
                <div class="card properties-box card-primary" style="margin-bottom: 0">
                    <div class="card-header text-center" style="display: block;min-height: 0; line-height: 0; padding: 15px 0;"><h4 style="margin:0;padding: 0;font-size: 17px">{{$post->title}}</h4></div>
                    <div class="card-body">
                        @foreach($properties as $property)
                            @php $property->property_name = json_decode($property->property_name); @endphp
                        <div class="row">
                            <div class="col-lg-6 text-center property-box radius-left">
                                <h4>{{ $property->property_name->en . " ( " . $property->property_name->ar . ") " }}</h4>
                            </div>
                            <div class="col-lg-6 text-center property-box radius-right">
                                <h4>
                                    @if(isJson($property->value))
                                        @php $property->value = json_decode($property->value); @endphp
                                        {{ $property->value->en . " ( " . $property->value->ar . ") " }}
                                    @else
                                        {{$property->value}}
                                    @endif
                                </h4>
                            </div>
                        </div>
                        @endforeach
                        <div class="row">
                            <div class="col-lg-12 description-box radius-full-25 @if(isArabic($post->description)) text-right @endif">
                                <p>{{$post->description}}</p>
                            </div>
                        </div>

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




    </div>
@endsection

@section("js-scripts")
    <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
    <script src="{{mix("js/jquery.dataTables.min.js")}}"></script>
    <script src="{{mix("js/dataTables.bootstrap4.min.js")}}"></script>
    <script src="{{mix("js/select.bootstrap4.min.js")}}"></script>

    <script src="{{asset("assets/js/page/modules-datatables.js")}}"></script>
    <script>
        $("#table-categories").dataTable({
            "columnDefs": [
                { "sortable": false, "targets": [5,8] }
            ]
        });
    </script>

@endsection