@extends('admin.layout.master')

@section('admin')
    @php
        $totalImageCount=10;
    @endphp
    <div class="content-wrapper">
        <div class="content-header row">
            <div class="content-header-left col-md-6 col-12 mb-2">
                {{ Breadcrumbs::render('admin.contents.images',$content) }}
            </div>
            <div class="content-header-left col-md-6 col-12 mb-2">
                <a href="{{route('admin.contents.index')}}"
                   class="btn btn-sm btn-info float-right">
                    {{trans('admin/contents.btn_all')}}
                </a>
            </div>
        </div>
        <div class="content-body">
            <section id="page-layout">
                <div class="row">
                    <div class="col-md-12">
                        <div class="card">
                            <div class="card-header">
                                <h4 class="card-title"
                                    id="pageHeaderTitle">{!! trans('admin/contents.images.title',['title'=>$content->title]) !!}</h4>
                            </div>
                            <div class="card-content collapse show">
                                <div class="card-body pt-0">
                                    <div class="form-body">
                                        <div class="row">
                                            <div class="col-md-4">
                                                {{html()->label()->for("formLang")->html(trans("admin/contents.form.lang"))->style(['font-size'=>'12px']) }}
                                                :
                                                {{html()->span()->text($content->language!==null ? $content->language->title : $content->lang_code)->style(['font-size'=>'12px','font-weight'=>'bold'])}}
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-md-4">
                                                {{html()->label()->for("formTitle")->html(trans("admin/contents.form.title"))->style(['font-size'=>'12px']) }}
                                                :
                                                {{html()->span()->html($content->title)->id("formTitle")->style(['font-size'=>'12px','font-weight'=>'bold'])}}
                                            </div>
                                        </div>
                                    </div>

                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <section id="page-layout">
                <div class="row">
                    <div class="col-md-12">
                        <div class="card">
                            <div class="card-content collapse show">
                                <div class="card-body">
                                    <div class="card-info">
                                        <div class="alert alert-info">
                                            {!! trans("admin/contents.images.info.message",['mimes'=>config('app.admin.content_images.image_mimes'),'mb'=>config('app.admin.content_images.image_max_size_mb'),'total'=>$totalImageCount]) !!}
                                        </div>
                                    </div>
                                    {{ html()->form()->method('POST')->class("dropzone dropzone-area modulForm")->id("dpz-multiple-files")->autocomplete("off")->attribute('enctype','multipart/form-data')->open() }}

                                    {{html()->span()->text(trans("admin/contents.images.form.info"))->class("dz-message")}}
                                    {{ html()->form()->close() }}
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <section id="page-layout">
                <div class="row" id="sortable">
                    @foreach($contentImageList as $contentImage)
                        <div class="col-xl-2 col-md-3 col-sm-6" data-id="{{$contentImage["id"]}}">
                            <div class="card  content-row">
                                <div class="card-content">
                                    <div class="drag-drop">
                                        <a class="btn btn-info btn-sm  btn-handle " href="#move"><i
                                                style="font-size: 12px" class="fa fa-arrows"></i></a>
                                    </div>
                                    <a href="{{$contentImage["image_full"]}}" target="_blank">
                                        <img class="card-img-top img-fluid" src="{{$contentImage["image_full"]}}"
                                             alt="{{$contentImage["title"]}}">
                                    </a>
                                    <div class="card-body">

                                        @if($contentImage["default"])
                                            <a style="color: #efefef"  class="btn btn-sm btn-green">
                                                {{trans("admin/contents.images.list.default_text")}}
                                            </a>

                                        @else
                                            <a href="{{route('admin.contents.images.default',['content_id'=>$content->id,"content_image_id"=>$contentImage["id"]])}}" class="btn btn-sm btn-orange">
                                                {{trans("admin/contents.images.list.default_btn")}}
                                            </a>
                                        @endif

                                        <a href="{{route('admin.contents.images.delete',['content_id'=>$content->id,"content_image_id"=>$contentImage["id"]])}}"
                                           class="btn btn-danger btn-sm btnDelete pull-right">{{trans("admin/contents.images.list.btn_delete")}}</a>

                                    </div>
                                </div>
                            </div>
                        </div>
                    @endforeach

                </div>
            </section>
        </div>
    </div>
    <div id="loadingOverlay" class="loading-overlay">
        <div class="spinner-text">