@extends('layouts.userlayout')

@section('content')

<form action="{{ url('/submitaction') }}" method="post" enctype="multipart/form-data">
	@csrf
	<input type="hidden" name="issueid" value="{{ $issue->id }}">
	<div class="container-fluid my-5 pt-5 pb-5 ">
		<div class="row pb-3 bg-color topper">
			
				<div class="col-12 pb-5" >
					<div class="container s-inner m-top" >
						<div class="row" >
							@if (session('success'))
			    <div class="alert alert-success alert-dismissible fade show" role="alert">
			        {{ session('success') }}
			        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
			    </div>
			@endif

			@if (session('error'))
			    <div class="alert alert-danger alert-dismissible fade show" role="alert">
			        {{ session('error') }}
			        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
			    </div>
			@endif


			 @if ($errors->any())
			     @foreach ($errors->all() as $error)
			         <div class="alert alert-danger" role="alert">{{$error}}</div>
			     @endforeach
			 @endif
							<div class="mt-4 mb-1 heading-report">
								<h2>Close Request</h2>
								
							</div>
							<div class="col-12 text-center my-2">
							    	<input style="display: none;" class="demo3" type="file" id="file"  name="closedimage[]" multiple="true" onchange="updateSelectedImageCount(this)">
                        			<label for="file"><img src="{{ url('/image/no_image.svg') }}" class="no_img">
                        		    <h5 class="captures mt-3">Capture Image</h5></label>
                        		    <div id="selectedImageCount"></div>
							</div>
							<script type="text/javascript">
								function updateSelectedImageCount(input) {
    var count = input.files ? input.files.length : 0;
    document.getElementById('selectedImageCount').innerText = count + ' image(s) selected';
}
							</script>
							
							@if($issue->status == 'closed request' || Auth::user()->role ==0 || Auth::user()->role == 4)
							<div class="col-12 my-2">
								<h5 style="padding-left:10px;">Please Select Hierarchy of Control Measures</h5>
								<select name="sm_closed_remarks1" id="firstSelect" class="form-control"  onchange="updateSecondSelect()" required>
								    <option value disabled selected>Select Hierarchy of Control Measures</option>
										<option value="PSM Elements">PSM Elements</option>
									<option value="Permit To Work System">Permit To Work System</option>
									<option value="Personal Safety Life Saving Rules">Personal Safety Life Saving Rules</option>
									<option value="Road & Traffic Safety Management">Road & Traffic Safety Management</option>
									<option value="Distribution Safety Management">Distribution Safety Management</option>
									<option value="PSM- Safe Operating Fundamentals">PSM- Safe Operating Fundamentals</option>
									<option value="Workplace Safety Management">Workplace Safety Management</option>
									<option value="Other">Other</option>
								</select>
							</div>
							<div class="col-12 my-2">	
								
								<select name="sm_closed_remarks2" id="secondSelect" class="form-control" required>
					                <!-- Options will be dynamically added here based on the selection in the first select box -->
					            </select>
							</div>
							<div class="col-12 my-2">
							    <select name="sm_closed_remarks" class="form-control form-select" >
                                    <option value="Elimination">Elimination</option>
                                    <option value="Substitution">Substitution</option>
                                    <option value="Engineering Solution">Engineering Solution</option>
                                    <option value="Administrative/Procedural Solution">Administrative/Procedural Solution</option>
                                    <option value="PPE">PPE</option>
                                </select>
							</div>
							@endif
							<div class="col-12 px-3 py-3">
							  <h6>Action *</h6>
							  <textarea class="form-control" id="exampleFormControlTextarea1" name="actiondes" rows="2" placeholder="Action" required>{{ $issue->action }}</textarea>
							</div>
							<div class="col-12 my-2">
								<h6>Close Remarks *</h6>
							    <textarea class="form-control" id="exampleFormControlTextarea1" rows="2" name="closed_remarks" placeholder="Remarks" required>{{ $issue->closed_remarks }}</textarea>
							</div>
							<div class="col-12 my-3 text-center pb-3">
								<button type="submit" id="submitbutton" class="btn buton-o w-100">Send Close Request</button>
							</div>
					    </div>
							
						
					</div>
				</div>
		</div>
	</div>
</form>

<script>

        function updateSecondSelect() {
            var firstSelect = document.getElementById("firstSelect");
            var secondSelect = document.getElementById("secondSelect");
            var selectedOption = firstSelect.options[firstSelect.selectedIndex].value;

            // Clear previous options
            secondSelect.innerHTML = '';

            if (selectedOption === "PSM Elements") {
                var psmOptions = [
                    "Process Safety Information",
                    "Process Hazard Analysis / (HAZOP/ What if etc.)",
                    "Standard Operating Procedure",
                    "Management of Change",
                    "Quality Assurance",
                    "Prestart Up Safety Review",
                    "Mechanical Integrity",
                    "Safe Work Practices",
                    "Training and Performance",
                    "Contractor Safety Management",
                    "Incident Investigation",
                    "Employee Participation",
                    "Emergency Planning and Response",
                    "Compliance Management Audit"
                ];

                // Add new options based on the selected hierarchy
                addOptionsToSelect(psmOptions);
            } else if (selectedOption === "Permit To Work System") {
                var ptwOptions = [
                    "Hot Work",
                    "Work At Height",
                    "Confined Space Entry/ Vessel Entry",
                    "Lock Out & Tag Out",
                    "Digging / Excavation",
                    "Electrical Isolation Permit",
                    "Line Breaking / Vessel Opening",
                    "Cold Work",
                    "Radiography",
                    "Working On Live Electrical System/Equipment",
                    "Temporary Electrical Connection",
                    "Isolation of Fire Protection System",
                    "Road Closure",
                    "Entry Permit Into Restricted Area / Premises",
		            "Scaffolding Erection / Dismantling",
                    "Other"
                ];

                // Add new options based on the selected hierarchy
                addOptionsToSelect(ptwOptions);
            } else if (selectedOption === "Personal Safety Life Saving Rules") {
                var lifeSavingRulesOptions = [
                    "Bypassing Safety Controls",
                    "Work Authorization",
                    "Energy Isolation",
                    "Confined Space",
                    "Working At Height",
                    "Hot Work",
                    "Safe Mechanical Lifting",
                    "Line Of Fire",
                    "Driving"
                ];

                // Add new options based on the selected hierarchy
                addOptionsToSelect(lifeSavingRulesOptions);
            } else if (selectedOption === "PSM- Safe Operating Fundamentals") {
            var safeOperatingFundamentalsOptions = [
                 "Respect Process Safety Hazards",
                "Apply Procedures (SOP/SMP/Safe Work Practices)",
                "Empty And De-Energize Before Line-Breaking",
                "Monitor An Open Drain Operations",
                "Manage Overrides of Safety Critical Systems Only With Authorization",
                "Walk The Line I.E. Verify Process Line-Up Condition",
                "Verify Leak Tightness/Connection Tightness After Maintenance Work/Before Returning To Service",
                "Verify The Condition Of Flexible Hoses",
                "Operate Within Safe Limits I.E. Stay Within Safe Operating Limits",
                "Control Utility Systems Connected To A Process",
                "Report And Take Interim Mitigating Measures For Impaired/Defective Safety Critical Equipment",
                "Report Process Safety Incidents",
                "Apply Double Isolation I.E. Maintain Safe Isolation",
                "Control Loading And Unloading Operations Of Hazardous Fluids",
                "Avoid Splash Loading",
                "Unplugging of Equipment",
                "Check atmosphere in fire box before igniting the burner"
            ];
            addOptionsToSelect(safeOperatingFundamentalsOptions);
        }
        
            else {
                var lifeSavingRulesOptions = [
                    "None"
                ];

                // Add new options based on the selected hierarchy
                addOptionsToSelect(lifeSavingRulesOptions);
            }
            // Add additional conditions for other options if needed
        }

        function addOptionsToSelect(options) {
            // Add new options based on the selected hierarchy
            for (var i = 0; i < options.length; i++) {
                var option = document.createElement("option");
                option.text = options[i];
                option.value = options[i];
                secondSelect.add(option);
            }
        }
    </script>


@endsection