@extends('layouts.master', 	[
								'plugins'			=> ['datatables' => true]
							])

@section('content')

	
	@component('components.card_main', [
											'title' 		=> 	'Suppliers APQP Documents',
											'description'	=>	"Here you can download APQP's suppliers documents."
										])

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

		@slot('after_body')
            @component('components.datatable')
                @slot('thead')
                    <tr>
						@if($user->ppap_role['role'] == Role::PPAP_ADMIN || $user->ppap_role['role'] == Role::PPAP_USER)
							<th>&nbsp;</th>
						@endif
						<th style="width: 220px">@lang('master.name')</th>
						<th style="width: 90px">File Path</th>
						@if($user->ppap_role['role'] == Role::PPAP_ADMIN || $user->ppap_role['role'] == Role::PPAP_USER)
							<th style="width: 80px">@lang('master.status')</th>
						@endif
						<th style="width: 250px">@lang('master.plant')</th>	
						@if($user->ppap_role['role'] == Role::PPAP_ADMIN || $user->ppap_role['role'] == Role::PPAP_USER)
                        	<th style="width: 250px">Creator</th>
						@endif
                    </tr>
                @endslot
                @slot('tfoot')
                    <tr>
						@if($user->ppap_role['role'] == Role::PPAP_ADMIN || $user->ppap_role['role'] == Role::PPAP_USER)
			            	<td class="not-searchable">&nbsp;</td>			            
						@endif
                        <td>@lang('master.name')</td>
						<td>File Path</td>
						@if($user->ppap_role['role'] == Role::PPAP_ADMIN || $user->ppap_role['role'] == Role::PPAP_USER)
                        	<td>@lang('master.status')</td>
						@endif
						<td>@lang('master.plant')</td>	
						@if($user->ppap_role['role'] == Role::PPAP_ADMIN || $user->ppap_role['role'] == Role::PPAP_USER)
                        	<td>Creator</td>
						@endif
                    </tr>
                @endslot
            @endcomponent
		@endslot

	@endcomponent

    <!-- --------- Upload Document modal----------- -->
	<div id="add_document_modal" class="modal fade" tabindex="-1" data-backdrop="static">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<h4 class="modal-title">Upload Document</h4>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>
				
				<form id="add_document_form" enctype="multipart/form-data">
					<div class="modal-body">
						<div class="form-group row">
							<label class="col-form-label col-sm-3 mt-2">Select File<span class='text-danger'>*</span></label>
							<div class="col-sm-9">
								<input type="hidden" name="id" value="">

								<div class="">
									@component('components.file_input',[
									'id'=>'import_file', 
									'name'=>'import_file', 
									'accept' => 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel, application/pdf'
									])@endcomponent
								</div>
								<span class="text-muted">Accepted file type: PDF, Excel. Max file size 5MB</span>								
							</div>
						</div>
						<div id="feedback_upload_document"></div>
					</div>
					<div class="modal-footer">
						<button data-style="zoom-in" type="submit" class="btn bg-primary btn-ladda btn-ladda-spinner">Upload Document<i class="icon-paperplane ml-1"></i> </button>
					</div>						
				</form>
			</div>
		</div>
	</div>
	<!-- --------- / Upload Document modal----------- -->
@endsection

@section('app-scripts')
    <script type="text/javascript">
        const DOCUMENTS = {!! $templateDocuments->toJSON() !!};
        const STORE_URL = '{{route('pp_project.store')}}';
		const ADMIN_ROLE = {!! Role::PPAP_ADMIN !!};
		const USER_ROLE = {!! Role::PPAP_USER !!};
        const USER = Katcon.authUser;
	</script>
	<script src="{{mix('js/ppap/project/template_documents.js')}}"></script>
@endsection