@extends('layouts.admin.app')

@section('content')
<style type="text/css">
    .date_col{
        display: none;
    }
</style>
<link  href="{{url('css/jquery.dataTables.min.css')}}" rel="stylesheet">
<div class="center-container">
    <div class="admin-box full-width">
        <div class="container">
            @if(session('flash_success'))
                <div class="alert alert-success" role="alert">
                <button type="button" class="close" data-dismiss="alert">×</button>
                    {{ session('flash_success') }}
                </div>
            @endif
          <div class="alert-custom alert-success" id="alert_msg" style="display: none">
            <button type="button" class="close" data-dismiss="alert">×</button></div>
            <div class="admin-title">
                <h2>Perioder</b>
                </h2>
                <div class="title-name-logo">
                    {{ trans('activity.vadso_municipality') }} <img src="{{ asset('images/vads-logo.png')}}">
                </div>
            </div>

    <div class="full-width">
        <div class="modal fade center-popup sm-popup" data-backdrop="static" data-keyboard="false" id="periodModal"  role="dialog"  aria-modal="true">
            <div class="modal-dialog modal-dialog-scrollable" style="max-width: 700px; max-height: 500px;" id="updateformadd">
                <form name="form"  method="post" id="form" class="form">
                    @csrf
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">{{ trans('activity.add_period') }}</h5>
                            <button type="button" class="close" data-dismiss="modal">&times;</button>
                    </div>
                    <div class="modal-body">
                        <div class="alert alert-danger" style="display:none"></div>
                        <div class="listView_sec" id="servicelistModalBody">

                            <div class="row">
                                <div class="col-md-12">
                                    <div class="form-group">
                                    <label for="title" class="control-label col-form-label">{{ trans('activity.periodname') }}</label>
                                        <div class="input-div">
                                            <input id="period_name" autocomplete="off" type="text" class="form-control" name="period_name" placeholder="{{ trans('activity.enter_period_name_placeholder') }}" value="{{ old('period_name') }}">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-12">
                                    <div class="form-group">
                                    <label for="title" class="control-label col-form-label">{{ trans('activity.start_date') }}</label>
                                        <div class="input-div">
                                            <input id="start_date" autocomplete="off" type="text" class="form-control" name="start_date" placeholder="{{ trans('activity.select_date_placeholder') }}" value="{{ old('start_date') }}">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-12">
                                    <div class="form-group">
                                    <label for="title" class="control-label col-form-label">{{ trans('activity.end_date') }}</label>
                                        <div class="input-div">
                                            <input id="end_date" autocomplete="off" type="text" class="form-control" name="end_date" placeholder="{{ trans('activity.select_date_placeholder') }}" value="{{ old('end_date') }}">
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <input type="hidden" name="period_id" class="period_id">
                        <button type="submit" class="primary-btn sub-btn" id="saveBtn"></button>
                    </div>
                </div>
            </form>
            <input type="hidden" id="messageshow" >
            </div>
        </div>
		{{-- <a href="{{ route('periodmaster.create') }}" class="btn btn-xs btn-primary float-right">Add</a> --}}
        <div class="full-width">
		<table class="table data-table tableDesign" id="periodTable">
            <a href="javascript:void(0);"  class="primary-btn sub-btn data-btn add_subunit_button">{{ trans('activity.add') }}</a></label>
			<thead>
				<tr>
					<th width="30%">{{ trans('activity.period_name') }}</th>
					<th width="30%">{{ trans('activity.from') }}</th>
                    <th width="30%">{{ trans('activity.to') }}</th>
					<th width="10%">{{ trans('activity.action') }}</th>
				</tr>
			</thead>
			<tbody></tbody>
		</table>
    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@include('layouts.admin.includes.deletePopup')
@endsection
@section('script')
<script src="{{ url('js/datatables.min.js')}}"></script>
<script src="{{ asset('js/jquery.validate.js') }}"></script>
<script src="{{ asset('js/norway.js') }}"></script>
<script src="{{ asset('js/datepicker-no.js') }}"></script>
<script src="{{ asset('js/additional-methods.js') }}"></script>
<script src="{{url('js/pages/periodmaster.js')}}"></script>
<script>
    var config = {
        Periodmaste_DATATABLE:  "{{ route('periodmaster.datatable') }}",
        createPeriod : "{{trans('activity.create_period')}}",
        store : '{{ route("periodmaster.store")}}',
        updatePeriod : "{{trans('activity.update_period')}}",
        updateUrl : "{{ route('periodmaster.update','') }}"+"/",
        confirm_popup: "{{trans('activity.period_confirm_popup')}}",
        period_deleted_successfully:"{{trans('activity.period_deleted_successfully')}}",
        period_added: "{{ trans('activity.period_added_successfully') }}",
        period_updated: "{{ trans('activity.period_updated_successfully') }}",
        remote_period: "{{ route('periodmaster.unique.periodname') }}",
        period_unique : "{{trans('activity.period_name_unique') }}",
    };
    $('#periodTable').on('click','.delete-action',function(){
        var title = "{{ trans('activity.confirmation') }}";
        var text = "{{trans('activity.period_confirm_popup')}}";
        var url = $(this).attr('data-url');
        $('#deleteModal').find('.modal-title').text(title);
        $('#deleteModal').find('.main_text').text(text);
        $('#deleteModal').find('#deleteForm').attr('action', url);
        $('#deleteModal').modal('show');
    });
</script>
@endsection