@extends('admin.base')

@section('title', 'Search')

@section('account_content')

    <link href="{{asset('css/bootstrap.min.css')}}" rel="stylesheet">
    <link href="{{asset('css/font-awesome.min.css')}}" rel="stylesheet">
    <link href="{{asset('css/animate.css')}}" rel="stylesheet">
    <link href="{{asset('css/style.css')}}" rel="stylesheet">
    <!--第三方插件css-->
    <!--dataTables表格css-->
    <link href="{{asset('css/plugins/dataTables/dataTables.bootstrap.css')}}" rel="stylesheet">

    <link href="{{asset('css/plugins/iCheck/custom.css')}}" rel="stylesheet">
    <link href="{{asset('css/plugins/summernote/summernote.css')}}" rel="stylesheet">
    <link href="{{asset('css/plugins/summernote/summernote-bs3.css')}}" rel="stylesheet">
    <!--下拉-->
    <link href="{{asset('css/plugins/chosen/chosen.css')}}" rel="stylesheet">
    <!--日期-->
    <link href="{{asset('css/plugins/datapicker/bootstrap-datepicker3.css')}}" rel="stylesheet">


    <div class="ui grid">
        <div class="thirteen wide column">
            <div class ="content">
                <div class="content_top">

                    {{--<div id="appliedFilters">--}}
                        {{--@foreach($allSearch as $key => $value)--}}
                            {{--<div class="ui circular large label">{{$value->searchTerm}}<i class="delete icon" onclick="deleteSearch('{{$value->id}}')"></i></div>--}}
                        {{--@endforeach--}}
                    {{--</div>--}}

                    <hr>
                    <div class="content_top_one">

                        <form  class="form-horizontal" method="post" action="{{ route('addSearchTerm') }}" enctype="multipart/form-data" id="searchForm">
                            {{ csrf_field() }}
                            <div class="form-group">
                                <label for="InputSearch1">*{{ __('Search Input') }}</label>
                                <input type="text" class="form-control" id="searchText" name="searchText" required>
                            </div>

                            <div class="form-group">
                                <label for="InputSearch2">*{{ __('Search Input (Chinese)') }}</label>
                                <input type="text" class="form-control" id="searchTextChinese" name="searchTextChinese" required>
                            </div>

                            <div class="form-check">
                                <input type="checkbox" class="form-check-input" id="hot" name="hot">
                                <label class="form-check-label" for="exampleCheck1">{{ __('Hot') }}</label>
                            </div>
                            <button type="submit" class="btn btn-primary" onclick="return submitForm()">{{__('Submit')}}</button>
                            <span id="validationField" style="color: red">{{__('Field mustnt be empty')}}</span>
                        </form>
                    </div>
                </div>
            </div>

            <hr>

            <div class ="content" style="margin-top: 35px;">
                <table class="table table-border table-bordered table-hover table-bg table-sort display" id="searchTable">
                    <thead>
                    <tr class="text-c loc">
                        <th width="120" name="tex" >{{ __('Search Term') }}</th>
                        <th width="130" name="tex" >{{ __('Search Term Chinese') }}</th>
                        <th width="120" name="tex" >{{ __('Hot') }}</th>
                        <th width="70" name="tex" >{{ __('Operation') }}</th>
                    </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    {{-- Start Confirm Modal --}}
    <div class="ui tiny modal" id="delete_discount_modal">
        <div class="header">
            {{ __('Confirm Delete') }}
        </div>
        <div class="actions">
            <div class="ui grey deny button" onclick="cancelDelete()">
                {{ __('Cancel') }}
            </div>
            <button type="submit" class="ui yellow submit button" id="confirmDelete"> {{ __('Confirm') }}</button>
        </div>
    </div>
    {{-- End Confirm Modal --}}

    <script src="{{asset('js/plugins/dataTables/jquery.dataTables.js')}}"></script>
    <script src="{{asset('js/plugins/dataTables/dataTables.bootstrap.js')}}"></script>
    <script>

        $( document ).ready(function() {
            $('#validationField').hide();

            @php
                foreach($allSearch as $key=>$value){
                    $value->operation = "<button class=\"ui mini button\" onclick=\"deleteSearch('$value->id') \">".__('Delete')."</button>";
                }
            @endphp

            var search = null;

            $('#searchTable').DataTable({
                "data": search,
                //"paging": false,

                @if(config('app.locale') == 'zh')
                    @include('common.dataTableLanguage')
                @endif

                "columns": [
                    { data: 'searchTerm' },
                    { data: 'searchTermChinese' },
                    { data: 'hot' },
                    { data: 'operation' }
                ]
            });
            @include('components.datatableScroll',  ['id'=>'#searchTable']) 
        });

        function submitForm() {
            if($('#searchText').val() == ""){
                $('#validationField').show();
                return false;
            }else if($('#searchTextChinese').val() == ""){
                $('#validationField').show();
                return false;
            }else{
                $('#validationField').hide();
            }
        }

        function deleteSearch(id){
            let url = 'backEndDeleteSearchTerm/' + id;
            if (confirm("{{__('Confirm Delete')}}")) {
                document.location.href=url
            } else {}
        }
    </script>
@endsection

@section('breadcrumbs')
    <a href="{{route('admin-landing')}}">Backend Management</a><i class="right angle icon divider"></i><span>Search</span>
@endsection