@extends('layouts.master')


@section('styles')
	<link href="{{asset('plugins/webix/webix-pro/webix.min.css')}}" rel="stylesheet" type="text/css">
	<link href="{{asset('plugins/webix/filemanager/filemanager.min.css')}}" rel="stylesheet" type="text/css">
@endsection

@section('header-title')
	<span class="font-weight-semibold">File Manager</span>
@endsection

@section('header-elements')
	{{-- <a href="#" class="btn btn-labeled btn-labeled-right bg-primary">Button <b><i class="icon-menu7"></i></b></a> --}}
@endsection

@section('content')

	<div id="filemanager" class="card-main ml-1 mr-1 ml-md-3 mr-md-4">
	
	</div>


    <!-- --------- Add Document modal----------- -->
    {{-- Removed tabindex because select2 can't work properly --}}
	{{-- <div id="add_document_modal" class="modal fade" tabindex="-1" data-backdrop="static"> --}}
	<div id="add_document_modal" class="modal fade"  data-backdrop="static">
		<div class="modal-dialog modal-lg">
			<div class="modal-content">
				<div class="modal-header">
					<h4 class="modal-title">Add New Document</h4>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">

					<form id="add_document_form" enctype="multipart/form-data">

						<fieldset >

							<legend class="text-uppercase font-size-sm font-weight-bold">Document Information</legend>

							<div class="form-group row">
								<label class="col-form-label col-lg-2">Name<span class='text-danger'>*</span> </label>
								<div class="col-lg-10">
									<input required type="text" name="name" maxlength="100" placeholder="Document Name" class="form-control">
								</div>
							</div>

							<div class="form-group row">
								<label class="col-form-label col-lg-2">Code<span class='text-danger'>*</span> </label>
								<div class="col-lg-10">
									<input required type="text" name="code" placeholder="Code" maxlength="20" class="form-control">
								</div>
							</div>


							<div class="form-group row">
								<label class="col-form-label col-lg-2">Start Version<span class='text-danger'>*</span> </label>
								<div class="col-lg-10">
									<input value="1" type="number" name="version" placeholder="1 (for initial version)"  class="form-control" min="1">
								</div>
							</div>


							<div class="form-group row">
	                        	<label class="col-form-label col-lg-2">Owner Title<span class='text-danger'>*</span></label>
	                        	<div class="col-lg-10">
		                            <select id="select_title_add_document" required name="title_id" class="form-control select-search" data-fouc>
		                                <option value="">Select one</option>
		                            </select>
	                            </div>
	                        </div>


							<div class="form-group row">
	                        	<label class="col-form-label col-lg-2">Department<span class='text-danger'>*</span></label>
	                        	<div class="col-lg-10">
		                            <select id="select_department_add_document" required name="department_id" class="form-control select-search" data-fouc>
		                                <option value="">Select one</option>
		                            </select>
	                            </div>
	                        </div>



							<div class="form-group row">
	                        	<label class="col-form-label col-lg-2">Type<span class='text-danger'>*</span></label>
	                        	<div class="col-lg-10">
		                            <select id="select_type_add_document" required name="doc_type" class="form-control select" data-fouc>
		                                <option value="">Select one</option>
		                                <option value="1">Processes</option>
		                                <option value="2">Procedures</option>
		                                <option value="3">Work Instructions</option>
		                                <option value="4">Records</option>
		                                <option value="5">Visual Aids</option>
		                                <option value="6">Manuals</option>
		                            </select>
	                            </div>
	                        </div>

							<div class="form-group row">
	                        	<label class="col-form-label col-lg-2">Departments to Notify</label>
	                        	<div class="col-lg-10">
		                            <select id="select_notifications_add_document" multiple="multiple" name="notifications[]" class="form-control select" data-fouc>                        	
		                            </select>
	                            </div>
	                        </div>

							<div class="form-group">
								<div class="form-check form-check-inline">
									<label class="form-check-label">
										<input type="checkbox" name="legend" class="form-check-input-styled-primary mr-2" data-fouc>
										Add 'Uncontrolled Document' text legend (Only for word files).
									</label>								
								</div>
							</div>

						</fieldset>

						<fieldset>
							
							<legend class="text-uppercase font-size-sm font-weight-bold">Revision File</legend>

							<div class="form-group row">
								<label class="col-form-label col-lg-2">Select File<span class='text-danger'>*</span></label>
								<div class="col-lg-10">
									<input id="file_add_document" type="file" name="file" class="form-control-uniform-custom" accept=".xlsx,.docx,.pptx,.txt,.pdf" required>
									<span class="form-text text-muted">Accepted formats: pdf, docx, pptx, xlsx. Max file size 20MB</span>
								</div>
							</div>

							<div class="form-group row">
	                        	<label class="col-form-label col-lg-2">Approvers<span class='text-danger'>*</span></label>
	                        	<div class="col-lg-10">
		                            <select id="select_approvers_add_document" multiple="multiple" name="approvers[]" class="form-control select" data-fouc required>                           	
		                            </select>
	                            </div>
	                        </div>

						</fieldset>

						<div id="feedback_add_document"></div>

						<div class="modal-footer">
							{{-- <button type="button" class="btn btn-link" data-dismiss="modal">Close <i class="icon-cross3 ml-1"></i></button> --}}
							<button id="button_submit_add_document" data-style="zoom-in" type="submit" class="btn bg-primary btn-ladda btn-ladda-spinner">Create Document<i class="icon-paperplane ml-1"></i> </button>
						</div>						

					</form>
				

				</div>

			</div>
		</div>
	</div>
	<!-- /primary modal -->
    <!-- --------- / Add Document modal----------- -->

    <!-- --------- Edit Document modal----------- -->
	<div id="edit_document_modal" class="modal fade"  data-backdrop="static">
		<div class="modal-dialog modal-lg">
			<div class="modal-content">
				<div class="modal-header">
					<h4 class="modal-title">Edit Document</h4>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">

					<form id="edit_document_form">

						<input type="hidden" name="id" value="-1" >
						
						<fieldset >

							<legend class="text-uppercase font-size-sm font-weight-bold">Document Information</legend>
							
							<div class="form-group row">
								<label class="col-form-label col-lg-2">Name<span class='text-danger'>*</span> </label>
								<div class="col-lg-10">
									<input required type="text" name="value" maxlength="100" placeholder="Document Name" class="form-control">
								</div>
							</div>

							<div class="form-group row">
								<label class="col-form-label col-lg-2">Code<span class='text-danger'>*</span> </label>
								<div class="col-lg-10">
									<input required type="text" name="code" placeholder="Code" maxlength="20" class="form-control">
								</div>
							</div>

							<div class="form-group row">
	                        	<label class="col-form-label col-lg-2">Owner Title<span class='text-danger'>*</span></label>
	                        	<div class="col-lg-10">
		                            <select id="select_title_edit_document" required name="title_id" class="form-control select-search" data-fouc>
		                            </select>
	                            </div>
	                        </div>


							<div class="form-group row">
	                        	<label class="col-form-label col-lg-2">Department<span class='text-danger'>*</span></label>
	                        	<div class="col-lg-10">
		                            <select id="select_department_edit_document" required name="department_id" class="form-control select-search" data-fouc>
		                            </select>
	                            </div>
	                        </div>



							<div class="form-group row">
	                        	<label class="col-form-label col-lg-2">Type<span class='text-danger'>*</span></label>
	                        	<div class="col-lg-10">
		                            <select id="select_type_edit_document" required name="doc_type" class="form-control select" data-fouc>
		                                <option value="1">Processes</option>
		                                <option value="2">Procedures</option>
		                                <option value="3">Work Instructions</option>
		                                <option value="4">Records</option>
		                                <option value="5">Visual Aids</option>
		                                <option value="6">Manuals</option>
		                            </select>
	                            </div>
	                        </div>

							<div class="form-group row">
	                        	<label class="col-form-label col-lg-2">Departments to Notify</label>
	                        	<div class="col-lg-10">
		                            <select id="select_notifications_edit_document" multiple="multiple" name="notifications[]" class="form-control select" data-fouc>                        	
		                            </select>
	                            </div>
	                        </div>

							<div class="form-group">
								<div class="form-check form-check-inline">
									<label class="form-check-label">
										<input type="checkbox" name="legend" class="form-check-input-styled-primary mr-2" data-fouc>
										Add 'Uncontrolled Document' legend.
									</label>								
								</div>
							</div>
	                        		                        
						</fieldset>

						<div id="feedback_edit_document"></div>

						<div class="d-flex justify-content-between align-items-center">
							<div class="form-check form-check-inline">
								<label class="form-check-label">
									<input type="checkbox" name="active" class="form-check-input-styled-primary" data-fouc>
									Active
								</label>								
							</div>
							<button id="button_submit_edit_document" data-style="zoom-in" type="submit" class="btn bg-primary btn-ladda btn-ladda-spinner">Save Document<i class="icon-floppy-disk ml-1"></i> </button>
						</div>

					</form>
				

				</div>

			</div>
		</div>
	</div>
    <!-- --------- / Edit Document modal----------- -->

    <!-- --------- Create Revision modal----------- -->
	<div id="create_revision_modal" class="modal fade"  data-backdrop="static">
		<div class="modal-dialog modal-lg">
			<div class="modal-content">
				<div class="modal-header">
					<h4 class="modal-title">Create Revision</h4>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<div class="modal-body">

					<form id="create_revision_form" enctype="multipart/form-data">

						<input type="hidden" name="id" value="-1" >

						<fieldset>
							
							<legend class="text-uppercase font-size-sm font-weight-bold">Revision File</legend>

							<div class="form-group row">
								<div class="col-form-label col-lg-2">Name</div>
								<div class="col-form-label col-lg-10">
									<div id="create_revision_document_name"></div>
								</div>
							</div>

							<div class="form-group row">
								<label class="col-form-label col-lg-2">Select File<span class='text-danger'>*</span></label>
								<div class="col-lg-10">
									<input id="file_add_revision" type="file" name="file" class="form-control-uniform-custom" required accept=".xlsx,.docx,.pptx,.txt,.pdf">
									<span class="form-text text-muted">Accepted formats: pdf, docx, pptx, xlsx. Max file size 20MB</span>									
								</div>
							</div>

							<div class="form-group row">
	                        	<label class="col-form-label col-lg-2">Approvers<span class='text-danger'>*</span></label>
	                        	<div class="col-lg-10">
		                            <select  multiple="multiple" name="approvers[]" class="form-control select" data-fouc required>                           	
		                            </select>
	                            </div>
	                        </div>

						</fieldset>

						<div id="feedback_create_revision"></div>

						<div class="modal-footer">
							<button id="button_submit_create_revision" data-style="zoom-in" type="submit" class="btn bg-primary btn-ladda btn-ladda-spinner">Create Revision<i class="icon-paperplane ml-1"></i> </button>
						</div>						

					</form>
				

				</div>

			</div>
		</div>
	</div>
	<!-- /primary modal -->
    <!-- --------- / Create Revision modal----------- -->


@endsection

@section('plugin-scripts')

	<script src="{{asset('plugins/webix/webix-pro/webix.min.js')}}"></script>
	<script src="{{asset('plugins/webix/filemanager/filemanager.min.js')}}"></script>

@endsection

@section('app-scripts')

	<script>
		@if ($user->roles->has(Role::DOCS_ADMIN))
		const USER_IS_ADMIN = true;
		@else
		const USER_IS_ADMIN = false;
		@endif
	</script>
		
	<script src="{{mix('js/documents/filemanager.js')}}"></script>

@endsection