@extends('layouts.master')

@section('content')

	
	@component('components.card_main', [
											'title' 		=> 	__('shipment.config_platform_title'),
											'description'	=>	__('shipment.config_platform_sub_title')
										])

        @slot('body')
            <div class="d-flex justify-content-end">
                <div>		
                </div>
            </div>
        @endslot

		@slot('after_body')
            @component('components.datatable',['vertical_borders'=>true])
                @slot('thead')
                    <tr>
                        <th style="width: 200px">@lang('master.facility')</th>	
                        <th style="width: 200px">@lang('master.plant')</th>	
                        <th style="width: 200px">@lang('audit.type')</th>	
						<th style="width: 200px">@lang('master.name')</th>
						<th style="width: 700px" colspan="2">@lang('shipment.calendar')</th>
                    </tr>
                @endslot
                @slot( 'tbody' )
                    @foreach($platforms->sortBy('id') as $key => $platform)
                        <tr data-platform="{{ $platform->toJson() }}">
                            <td class="text-left" >{{$platform->sub_plant->name}}</td>
                            <td class="text-left" >{{$platform->plant->name}}</td>
                            <td class="text-left" >{{$platform->types}}</td>
                            <td class="text-left" >{{$platform->name}}</td>
                            <td class="text-center">
                                @component('components.datatable',['vertical_borders'=>true])
                                    @slot('thead')
                                        <tr>
                                            <th>@lang('shipment.day')</th>
                                            <th>@lang('shipment.start_time')</th>
                                            <th>@lang('shipment.end_time')</th>
                                        </tr>		
                                    @endslot
                                    @slot( 'tbody' )
                                        @foreach (json_decode($platform->calendar) as $calendar)
                                        <tr>
                                            <td >{{ucfirst($calendar->name)}}</td>
                                            <td>{{$calendar->config->start}}</td>
                                            <td>{{$calendar->config->end}}</td>
                                        </tr>
                                        @endforeach
                                    @endslot
                                @endcomponent
                            </td>
                            <td style="min-width: 40px;">
                                @component('components.button', 
                                    ['type'=>'edit','btn_icon' => true, 'extra_class'=>'edit_platform_calendar'])
                                @endcomponent								
                            </td>
                        </tr>
                    @endforeach
                @endslot
                @slot('tfoot')
                    <tr>
                        <th style="width: 200px">@lang('master.facility')</th>	
                        <th style="width: 200px">@lang('master.plant')</th>	
                        <th style="width: 200px">@lang('audit.type')</th>	
						<th style="width: 200px">@lang('master.name')</th>
						<th style="width: 700px" colspan="2">@lang('shipment.calendar')</th>
                    </tr>
                @endslot
            @endcomponent
		@endslot
	@endcomponent

    <div id="update_platform_schedule" class="modal fade" tabindex="-1" data-backdrop="static">
        <div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<h4 class="modal-title">@lang('shipment.edit_platform_schedule')</h4>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <div class="modal-body">
                    <div class="table-responsive border-0">
                        <table id="customForm_datatable" class="table table-hover main-datatable datatable-header-basic text-center">
                            <thead>
                                <tr>
                                    <th>@lang('shipment.day')</th>
                                    <th>@lang('shipment.start_time')</th>
                                    <th>@lang('shipment.end_time')</th>
                                </tr>		        
                            </thead>
                            <tbody>
                                @foreach(\App\Shipments\Platform::DAYS_OF_WEEK as $key => $day)
                                <tr id="{{strtolower($day)}}">
                                    <td id="day_{{strtolower($day)}}">{{$day}}</td>
                                    <td >
                                        <input type="time" id="start_date_{{strtolower($day)}}" class="form-control" autofocus>
                                    </td>
                                    <td >
                                        <input type="time" id="end_date_{{strtolower($day)}}" class="form-control" autofocus>
                                    </td> 
                                </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="modal-footer">
                    <button id="platform_calendar_save" type="submit" class="btn bg-primary btn-ladda btn-ladda-spinner">OK</button>
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                </div>		
            </div>    
        </div>
    </div>
@endsection

@section('app-scripts')
    <script type="text/javascript">
        const USER = Katcon.authUser;
        const DAYS =  {!! json_encode(\App\Shipments\Platform::DAYS_OF_WEEK) !!};
	</script>
	<script src="{{mix('js/shipments/config_platform.js')}}"></script>
@endsection