@extends('admin.layout.master')
@push('css')
    <style>


        .sharepointBox {
            float: left;
            width: 400px;
            margin-left: 40px;
        }

        .sharepointBox h2 {
            display: inline-block;
            background-color: rgb(0, 63, 98);
            padding: 2px 6px;
            height: 17px;
            color: #ffffff;
            font-size: 10px;
            font-weight: bold;
            line-height: 14px;
            border-radius: 5px 5px 0 0;
            text-transform: uppercase;
            margin-left: 10px;
        }

        .sharepointContent {

            background-position: -0px -230px;
            background-repeat: no-repeat;
            height: 200px;
            border: 1px solid rgb(0, 63, 98);
            border-radius: 6px;
            position: relative;
            box-shadow: 0px 10px 10px -6px rgba(0,0,0,0.8);
        }

        .sharePointText {
            line-height: 16px;
            background: rgb(0, 63, 98); /* IE "fix" */
            background: rgba(0, 63, 98, 0.8);
            position: absolute;
            padding: 10px;
        }

        .horizontal {
            bottom: 0px;
            width: 100%;
            min-height: 70px;
            border-bottom-left-radius: 5px;
            border-bottom-right-radius: 5px;
        }

        .vertical {
            right: 0px;
            width: 120px;
            height: 100%;
            border-top-right-radius: 5px;
            border-bottom-right-radius: 5px;
        }
    </style>
    @endpush
@section('content')
    <main id="app-main" class="app-main">

        <div class="wrap">
            <section class="app-content">
                <h3>@lang('admin.'.$title)</h3>
            </section><!-- #dash-content -->
        </div><!-- .wrap -->



        <div class="col-md-12">
            <div class="widget">
                <header class="widget-header">
                    <h4 class="widget-title">اضافه استوي</h4>
                </header><!-- .widget-header -->
                <hr class="widget-separator">
                <div class="widget-body">
                    <div class="table-responsive">
                        <div id="default-datatable_wrapper" class="dataTables_wrapper form-inline dt-bootstrap">

                            <div class="row">
                                <div class="col-md-12">

                                        <button style="float: left" class="btn btn-info btn-sm" data-toggle="modal" data-target=".bd-example-modal-lg"> <i class="fa fa-plus"></i>اضافه استوي</button>

                                    <div>
                                        <div class="col-md-12">


                                                        @foreach( $stories as $story)
                                                            <div class="col-md-3 col-sm-6" style="float:right">
                                                                <div class="widget">
                                                                    <header class="widget-header">
                                                                        <h4 class="widget-title">{{ $story->type }}</h4>
                                                                    </header><hr class="widget-separator">
                                                                    <div class="widget-body text-center">
                                                                        <div class="big-icon m-b-md watermark">
                                                                            <img src="{{ $story->image_path }}">
                                                                        </div><h4 class="m-b-md">تاريخ الانتهاء : {{$story->end_stories != null ?   $story->end_stories->diffForHumans() : '' }}</h4>
                                                                        <p>اسم المتجر : {{ $story->user->name }}</p>
                                                                        <a href="#" class="btn btn-warning btn-sm"><i class="fa fa-edit"></i> </a>
                                                                        <form action="{{route('stories.destroy', $story->id)}}"  method="post" style="display: inline-block">
                                                                                    @csrf
                                                                            @method('delete')
                                                                            <button type="submit" class="btn btn-danger btn-sm delete"><i class="fa fa-trash"></i></button>
                                                                        </form>

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

                                                        @endforeach


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




    </main>

@include('admin.tagers.stories.modal')
    @endsection
    @push('js')
            <script>
                    $('body').on('submit','#addform',function (e) {
                e.preventDefault();
                // alert('asdasd');
                $.ajax({
                    url: '{{ route('stories.store') }}',
                    method: "post",
                    data: new FormData(this),
                    dataType: 'json',

                    cache       : false,
                    contentType : false,
                    processData : false,

                    success: function (response) {

                        if(response.status == 'failed'){
                            $.each(response.error, function( index, value ) {
                                for (var i=0 ; i<=value.length ; i++){
                                    $('#error').show();
                                    $('#error').append(value[i]);
                                }
                            });
                        }else{
                            $('#error').hide();
                            if(response.status == 'success'){
                                new Noty({
                                    type: 'success',
                                    layout: 'topRight',
                                    text: "@lang('admin.successfuly_added')",
                                    timeout: 2000,
                                    killer: true
                                }).show();
                            }
                            // table.ajax.reload();
                            $("#addform")[0].reset();
                                                    window.location.reload();

                        }
                    },

                });
            });
            </script>
    @endpush