@extends('crudbooster::admin_template')

@push("bottom")
        <!-- Dependencies -->
    <link rel="stylesheet" href="{{ asset('/vendor/libs/datatables/datatables.css') }}">
    <style>
        .panel-heading{
            padding: 8px 15px;
        }
    </style>
    <link rel="stylesheet" href="{{ asset('/css/application.css') }}">
    <script src="{{ asset('/vendor/libs/datatables/datatables.js') }}"></script>
    <script src="{{ asset('/js/tables_datatables.js') }}"></script>

    <script type="text/javascript">
        $(document).ready( function () {
            $('#translation_table').DataTable();
        } );
    </script>
@endpush


@section('content')
<!-- Your html goes here -->
<div class='panel panel-default'>
    <div class='panel-heading eap-box'>
        <div class="dark-color">
            <h4 style="display: inline-block;"><b><i class="fa fa-language">&nbsp;</i> Update Translation</b></h4>
            {{-- <div class="pull-right" style="top: 5px; position: relative">
                <p class="btn btn-info fa fa-language">
                    <b>Languages</b>
                    <select name="language_id" onchange="alert(this.val)" id="" class="text-black">
                        @forelse ($all_language as $lang)
                            <option value="{{$lang->id}}">
                                <i class="fa fa-language">{{$lang->name}}</i>
                            </option>
                        @empty
                            <option >No language Found</option>
                        @endforelse
                    </select>
                </p>
            </div> --}}
        </div>
    </div>

    <div class='panel-body'>
        <div class="card-datatable table-responsive">
            <form action="{{ route('translation.update') }}" method="post" id="form" enctype="multipart/form-data">
                @csrf
                <div class="card mb-12">
                    <div class="card-body demo-vertical-spacing-sm">
                        <fieldset>
                            <div class="form-group">
                                <label class="form-label">Disabled Message Code</label>
                                <input type="hidden" class="form-control" name="message_code" value="{{$code}}">
                                <input type="text" disabled class="form-control disabled" placeholder="Disabled input" value="{{$code}}">
                            </div>
                            <div class="form-group">
                                <label class="form-label">Message</label>
                                <textarea name="message_text" class="form-control form-control-inverted" rows="3">{{$text}}</textarea>
                            </div>

                            <div class="form-group">
                                <label class="form-label"><i class="fa fa-language">&nbsp;</i> Language</label>
                                <select name="language_id" onchange="alert(this.val)" id="" class="col-md-4 text-black">
                                    @forelse ($all_language as $language)
                                        <option value="{{$language->short_code}}" {{$language->short_code == $selected_lang ? 'selected' : '' }}>
                                            <i class="fa fa-language">{{$language->name}}</i>
                                        </option>
                                    @empty
                                        <option >No language Found</option>
                                    @endforelse
                                </select>
                            </div></br>

                            <button type="submit" class="btn btn-primary text-right">Submit</button>
                        </fieldset>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection