@extends('admin.layout.master_layout')

@section('title', 'مركز التحميل')

@section('page-content')
<div class="m-grid__item m-grid__item--fluid m-grid m-grid--ver-desktop m-grid--desktop m-page__container m-body">
    <div class="m-grid__item m-grid__item--fluid m-wrapper">

        <div class="m-subheader">
            <div class="d-flex align-items-center" style="justify-content: space-between;">
                <ul class="m-subheader__breadcrumbs m-nav m-nav--inline">
                    <li class="m-nav__item m-nav__item--home">
                        <a href="#" class="m-nav__link m-nav__link--icon">
                            <i class="m-nav__link-icon la la-home"></i>
                        </a>
                    </li>
                    <li class="m-nav__item">
                        <a href="{{ route('admin.dashboard.view') }}" class="m-nav__link">
                            <span class="m-nav__link-text">الرئيسية</span>
                        </a>
                    </li>
                    <li class="m-nav__separator">-</li>
                    <li class="m-nav__item">
                        <a href="/admin/uploads" class="m-nav__link">
                            <span class="m-nav__link-text">مركز التحميل</span>
                        </a>
                    </li>
                </ul>
            </div>
        </div>

        <div class="m-content">

            <div class="filter row mb-4 mt-2">
                <div class="col-md-3">
                    <input type="text" name="title" class="form-control title_search" placeholder="البحث بالعنوان">
                </div>
                <div class="col-md-3">
                    <select class="form-control type_filter">
                        <option value="">النوع</option>
                        <option value="1">صورة</option>
                        <option value="2">ملف</option>
                    </select>
                </div>
                <div class="col-md-3">
                    
                    <select class="form-control category_filter category_upload">
                        <option value="">القسم</option>
                        @foreach($data['categories'] as $category)
                            <option value="{{ $category->id }}">{{ $category->name }}</option>
                        @endforeach
                    </select>
                    
                </div>
                <div class="col-md-1">
                     <div class="text-left" >
                        <button type="button" class="btn btn-danger px-2 py-2 btn-sm btnAddNewConstant" data-name="تصنيف الملفات" data-type="category_upload" data-class="category_upload">
                            <i class="fa fa-plus px-0" style="font-size: 12px;"></i>
                        </button>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-xl-12">
                    <div class="render-table">
                        @include('admin.uploads.table-data')
                    </div>
                </div>
            </div>

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


@include('admin.system_constants.sub.add')
@stop

@section('js')
<script>

    /* ==================================================================
       الفلاتر
    ================================================================== */
    function getFilters() {
        var params = {};

        var title = $('.title_search').val();
        if (title) params.title = title;

        var type = $('.type_filter').val();
        if (type !== '') params.type = type;

        var category = $('.category_filter').val();
        if (category !== '') params.category = category;

        return $.param(params);
    }

    /* ==================================================================
       جلب البيانات
    ================================================================== */
    function getData(url) {
        if (!url) {
            var origin   = $(location).attr("origin");
            var pathname = $(location).attr("pathname");
            var page     = $('.pagination .active span').text() || 1;
            url = origin + pathname + '?page=' + page;
        }

        var filters = getFilters();
        if (filters) {
            url += (url.indexOf('?') !== -1 ? '&' : '?') + filters;
        }

        $.ajax({ url: url }).done(function (data) {
            $(".render-table").empty().html(data);
        });
    }

    function refreshTable() {
        var origin   = $(location).attr("origin");
        var pathname = $(location).attr("pathname");
        var page     = $('.pagination .active span').text() || 1;
        var url      = origin + pathname + '?page=' + page;
        getData(url);
        window.history.pushState("", "", url);
    }

    /* ==================================================================
       Pagination AJAX
    ================================================================== */
    $(document).on('click', '.mytable .pagination a', function (event) {
        event.preventDefault();
        $('li').removeClass('active');
        $(this).parent('li').addClass('active');
        var url = $(this).attr('href');
        getData(url);
        window.history.pushState("", "", url);
    });

    /* ==================================================================
       تفعيل الفلاتر
    ================================================================== */
    $(document).on('change', '.type_filter, .category_filter', function () {
        getData();
    });

    $('.title_search').keypress(function (e) {
        if (e.which == 13) {
            getData();
            return false;
        }
    });

    /* ==================================================================
       نسخ الرابط
    ================================================================== */
    $(document).on('click', '.copyLinkFile', function () {
        var $this = $(this);
        var copyText = $(this).data('link');
        var textField = document.createElement('textarea');
        textField.innerText = copyText;
        document.body.appendChild(textField);
        textField.select();
        textField.focus();
        document.execCommand('copy');
        textField.remove();
        $this.removeClass('btn-info').addClass('btn-success');
    });

    /* ==================================================================
       الحذف
    ================================================================== */
    $(document).on('click', '.delete_upload', function () {
        var id = $(this).data('id');
        Swal.fire({
            title: '',
            text: 'هل تريد حذف هذا العنصر ؟',
            type: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'حسنا',
            cancelButtonText: 'الغاء'
        }).then((result) => {
            if (result.value) {
                $.ajaxSetup({ headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') } });
                $.ajax({
                    url: "/admin/uploads/deleteUpload",
                    type: "post",
                    dataType: "JSON",
                    data: { id: id },
                    success: function (data) {
                        if (data['status'] == true) {
                            Swal.fire('تم الحذف بنجاح', '', 'success');
                            refreshTable();
                        } else {
                            swal({ title: "", text: data["data"], type: "error", confirmButtonText: "حسنا" });
                        }
                    }
                });
            }
        });
    });
/* ==================================================================
   تعديل التصنيف
================================================================== */
$(document).on('click', '.edit_upload_category', function () {
    var id = $(this).data('id');
    var currentCategory = $(this).data('category');
    var itemTitle = $(this).data('title');

    $.get('/admin/uploads/getSelectCategory', function (res) {
        if (res.status != true) {
            swal({ title: "", text: "حدث خطأ أثناء جلب الأقسام", type: "error", confirmButtonText: "حسنا" });
            return;
        }

        Swal.fire({
            title: 'تعديل التصنيف',
            html:
                '<div class="mb-3" style="font-size:14px;color:#666;">' +
                    'الملف: <strong style="color:#333;">' + $('<div>').text(itemTitle).html() + '</strong>' +
                '</div>' +
                '<select id="swal_category" class="form-control">' + res.data + '</select>',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'حفظ',
            cancelButtonText: 'الغاء',
            onOpen: function () {
                $('#swal_category').val(currentCategory);
            },
            preConfirm: function () {
                var val = $('#swal_category').val();
                if (!val) {
                    Swal.showValidationMessage('القسم مطلوب');
                    return false;
                }
                return val;
            }
        }).then((result) => {
            if (result.value) {
                $.ajaxSetup({ headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') } });
                $.ajax({
                    url: "/admin/uploads/updateUploadCategory",
                    type: "post",
                    dataType: "JSON",
                    data: { id: id, category: result.value },
                    success: function (data) {
                        if (data['status'] == true) {
                            Swal.fire('تمت العملية بنجاح', '', 'success');
                            refreshTable();
                        } else {
                            swal({ title: "", text: data["data"], type: "error", confirmButtonText: "حسنا" });
                        }
                    }
                });
            }
        });
    });
});
</script>
@stop