Rapport-Laravel/resources/views/form/rapport-pulmocare/1782369496-6603002f-f5ab-43...

549 lines
25 KiB
PHP

<!DOCTYPE html>
<html lang="en">
<head>
@include('layouts.shared/title-meta', ['title' => "Form"])
@include('layouts.shared/head-css', ["mode" => $mode ?? '', "demo" => $demo ?? ''])
<link href="{{asset('assets/libs/sweetalert2/sweetalert2.min.css')}}" rel="stylesheet" type="text/css" />
</head>
<div id="pageloader">
<img src="http://cdnjs.cloudflare.com/ajax/libs/semantic-ui/0.16.1/images/loader-large.gif" alt="processing..." />
</div>
<body class="loading">
<div class="account-pages">
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8 col-lg-6 col-xl-5 p-0">
<div class="card bg-pattern">
<div class="card-body p-3 row">
@if(Session::has('error'))<div class="alert alert-danger">{{Session::get('error')}}</div>
<br>@endif
@if(session('success'))<div class=" alert alert-success">{{ session('success') }}
</div>
<br>@endif
<div class="d-flex justify-content-between align-items-center">
<h4 class="page-title mb-0">{{$form->title}}</h4>
@if(!isset($form->is_approval) || $form->is_approval != 'yes')
@if($form->link_type == 'form')
<a href="/form/history" class="text-nowrap ms-2">View History</a>
@else
<a href="{{url()->previous()}}" class="text-nowrap ms-2">Back</a>
@endif
@endif
</div>
@if($form->title == 'User Mapping')
<div class="user-mapping-help mt-2 mb-3">
<i class="mdi mdi-information-outline me-1"></i>
<span>
To understand how to raise new user mapping request, please
<a href="https://did94hhhcgq1d.cloudfront.net/rapport/videos/pulmocare-form-usage.mp4"
target="_blank"
rel="noopener noreferrer">click here</a>.
</span>
</div>
@endif
@if(isset($form->user_info))
<div class="col-12">
<h6>Submitted By: {{$form->user_info->name}}</h6>
</div>
@endif
<form method="POST" action="/form/submit" id="report-form" enctype="multipart/form-data">
<input type="hidden" name="form_id" value="{{$form_id}}">
@csrf
@if($id)
<input type="hidden" name="id" value="{{$id}}">
@endif
@if(isset($form->manager_can_submit) && $form->manager_can_submit == true)
<div class="col-md-12 mb-2">
<label for="field-user_id" class="form-label"> Select User / Territory <span class="text-danger">*</span> </label>
<select class="form-control" id="field-user_id" name="user_id" required>
<option value=""> -- Select -- </option>
@foreach($form->users as $option)
<option value="{{$option->value}}" hierarchy="{{$option->hierarchy_id}}" {{isset($question->value) && $question->value == $option->value ? 'selected':''}}>{{$option->display}}</option>
@endforeach
</select>
<input type="hidden" id="field-hierarchy_id" name="hierarchy_id" value="">
</div>
@endif
@foreach($questions as $question)
<div class="col-md-12 mb-2">
<label for="field-{{$question->code}}" class="form-label">{{$question->question}} {!!$question->required == 'yes' ? '<span class="text-danger">*</span>':''!!} </label>
@if($question->code == 'mobile_number')
<h6>10-digit mobile number (starting with 6, 7, 8, or 9)</h6>
@endif
@switch($question->type)
@case('hidden')
<input type="{{$question->type}}" id="field-{{$question->code}}" name="{{$question->code}}" value="{{isset($question->value)?$question->value:''}}">
@break
@case('text')
@case('email')
@case('tel')
@case('date')
<input type="{{$question->type}}" id="field-{{$question->code}}" name="{{$question->code}}" class="form-control" {{$question->required == 'yes'?'required':'' }} value="{{isset($question->value)?$question->value:''}}">
@break
@case('number')
<input type="{{$question->type}}" min="0" max="9999999999" step="1" id="field-{{$question->code}}" name="{{$question->code}}" class="form-control" {{$question->required == 'yes'?'required':'' }} value="{{isset($question->value)?$question->value:0}}">
@break
@case('textarea')
<textarea id="field-{{$question->code}}" name="{{$question->code}}" class="form-control" {{$question->required == 'yes'?'required':'' }}>{{isset($question->value)?$question->value:''}}</textarea>
@break
@case('dropdown')
<select class="form-control" id="field-{{$question->code}}" name="{{$question->code}}" {{$question->required == 'yes'?'required':'' }}>
<option value=""> -- Select -- </option>
@foreach($question->options as $option)
<option value="{{$option->value}}" {{isset($question->value) && $question->value == $option->value ? 'selected':''}}>{{$option->display}}</option>
@endforeach
</select>
@break
@case('radio')
@foreach($question->options as $option)
<div class="form-check mb-2 form-check-success">
<input class="form-check-input" type="radio" name="{{$question->code}}" id="field-{{$question->code}}_{{$option->value}}" value="{{$option->value}}">
<label class="form-check-label" for="field-{{$question->code}}_{{$option->value}}">{{$option->display}}</label>
</div>
@endforeach
@break
@case('radiometrix')
@php
// Decode the first option's value to use as heading labels
$headings =
count($question->options) > 0
? json_decode($question->options[0]->value)
: [];
@endphp
{{-- Matrix Wrapper with Horizontal Scroll on Small Screens --}}
<div class="table-responsive">
<div class="d-table w-100">
{{-- Table Headers --}}
<div class="d-table-row font-weight-bold">
<div class="d-table-cell p-2" style="width: 150px;"></div>
{{-- Placeholder for row labels --}}
@foreach ($headings as $head)
<div class="d-table-cell text-center p-2">{{ $head }}
</div>
@endforeach
</div>
{{-- Table Rows --}}
@foreach ($question->options as $option)
@php $nn = json_decode($option->value); @endphp
<div class="d-table-row align-middle">
<div class="d-table-cell font-weight-bold p-2"
style="width: 150px;">
{{ $option->display }}
</div>
@foreach ($nn as $value)
<div class="d-table-cell text-center p-2">
<input type="radio"
id="field-{{ $option->display }}-{{ $value }}"
name="{{ $question->code }}[{{$option->display}}]" value="{{$value}}" class="form-check-input"
{{ isset($question->display) && $option->display != $option->display ? 'checked' : '' }}>
</div>
@endforeach
</div>
@endforeach
</div>
</div>
@break
@case('checkbox')
@foreach($question->options as $option)
<div class="form-check mb-2 form-check-primary ms-2">
<input class="form-check-input" type="checkbox" id="field-{{$question->code}}-{{$option->value}}" name="{{$question->code}}[]" value="{{$option->value}}" {{isset($question->value) && $question->value != '' && in_array($option->value, $question->value) ? 'checked':''}}>
<label class="form-check-label" for="field-{{$question->code}}-{{$option->value}}">{{$option->display}}</label>
</div>
@endforeach
@break
@case('file')
@if(!isset($form->is_approval) || (isset($form->is_approval) && $form->is_approval != 'yes' ) )
<input type="file" id="field-{{$question->code}}" name="{{$question->code}}" class="form-control" value="" {{$question->required == 'yes'?'required':'' }}>
@elseif(isset($question->value))
<img src="{{$question->value}}" class="img-fluid">
@endif
@break
@case('multitextbox')
<div class="row">
@foreach($question->options as $option)
<div class="col-6">{{$option->display}}</div>
<div class="col-6 mb-1">
<input type="number" id="field-{{$option->value}}" name="{{$option->value}}" class="form-control" required value="{{isset($option->val)?$option->val:0}}">
</div>
@endforeach
</div>
@break
@endswitch
</div>
@endforeach
@if(!isset($form->is_approval) || (isset($form->is_approval) && $form->is_approval != 'yes' ) )
<div class="text-center d-grid mt-3">
<button class="btn btn-primary" type="submit" id="submit-btn"> Submit </button>
</div>
@endif
</form>
</div> <!-- end card-body -->
</div>
<!-- end card -->
<!-- end row -->
</div> <!-- end col -->
</div>
<!-- end row -->
</div>
<!-- end container -->
</div>
<!-- end page -->
<style type="text/css">
#pageloader {
background: rgba( 255, 255, 255, 0.8 );
display: none;
height: 100%;
position: fixed;
width: 100%;
z-index: 9999;
}
#pageloader img {
left: 50%;
margin-left: -32px;
margin-top: -32px;
position: absolute;
top: 50%;
}
.form-label {
font-weight:bold;
font-size:16px;
}
.user-mapping-help {
display: flex;
align-items: flex-start;
gap: 4px;
font-size: 13px;
line-height: 1.5;
color: #667085;
}
.user-mapping-help i {
flex-shrink: 0;
margin-top: 2px;
}
.user-mapping-help span {
min-width: 0;
}
.user-mapping-help a {
color: #1683d8;
font-weight: 600;
text-decoration: none;
white-space: nowrap;
}
.user-mapping-help a:hover {
text-decoration: underline;
}
</style>
@include('layouts.shared/footer-script')
<script src="{{asset('assets/libs/sweetalert2/sweetalert2.min.js')}}"></script>
<script type="text/javascript">
jQuery(document).ready(function($){
$(document).ready(function () {
const states = [
"Andhra Pradesh",
"Arunachal Pradesh",
"Assam",
"Bihar",
"Chhattisgarh",
"Goa",
"Gujarat",
"Haryana",
"Himachal Pradesh",
"Jharkhand",
"Karnataka",
"Kerala",
"Madhya Pradesh",
"Maharashtra",
"Manipur",
"Meghalaya",
"Mizoram",
"Nagaland",
"Odisha",
"Punjab",
"Rajasthan",
"Sikkim",
"Tamil Nadu",
"Telangana",
"Tripura",
"Uttar Pradesh",
"Uttarakhand",
"West Bengal",
"Andaman and Nicobar Islands",
"Chandigarh",
"Dadra and Nagar Haveli and Daman and Diu",
"Delhi",
"Jammu and Kashmir",
"Ladakh",
"Lakshadweep",
"Puducherry"
];
let $stateDropdown = $("#field-state");
$.each(states, function (index, state) {
$stateDropdown.append(
$("<option>", {
value: state,
text: state
})
);
});
});
function validateDuplicateEmpCode(currentField) {
let empCode = $('#field-employee_code_01').val().trim();
let l1Code = $('#field-l1_managers_emp_code').val().trim();
let l2Code = $('#field-l2_managers_emp_code').val().trim();
let currentValue = $(currentField).val().trim();
if (currentValue === '') return;
let duplicate = false;
if (currentField.id === 'field-employee_code_01') {
duplicate = (currentValue === l1Code || currentValue === l2Code);
} else if (currentField.id === 'field-l1_managers_emp_code') {
duplicate = (currentValue === empCode || currentValue === l2Code);
} else if (currentField.id === 'field-l2_managers_emp_code') {
duplicate = (currentValue === empCode || currentValue === l1Code);
}
if (duplicate) {
$(currentField).val('');
Swal.fire({
icon: 'error',
title: 'Duplicate Employee Code',
text: 'Employee Code, L1 Manager Employee Code, and L2 Manager Employee Code must all be different.'
}).then(() => {
$(currentField).focus();
});
}
}
$('#field-employee_code_01, #field-l1_managers_emp_code, #field-l2_managers_emp_code')
.on('blur', function () {
validateDuplicateEmpCode(this);
});
$('#field-employee_code_01, #field-emp_code_previous_employee, #field-l1_managers_emp_code, #field-l2_managers_emp_code').on('input', function () {
this.value = this.value.replace(/[^0-9]/g, '');
});
$('#field-employee_name_last_name, #field-employee_name_first_name, #field-state, #field-hq, #field-l1_managers_name, #field-l2_managers_name').on('input', function () {
this.value = this.value.replace(/[^a-zA-Z\s]/g, '');
});
$('#field-email_01').on('blur', function () {
let $this = $(this);
let email = $this.val().trim().toLowerCase();
let designation = $('#field-designation_01').val();
if (email === '') return;
// General email format validation
let emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if (!emailPattern.test(email)) {
$this.val('');
Swal.fire({
icon: 'error',
title: 'Invalid Email',
text: 'Please enter a valid email address.'
}).then(() => {
$this.focus();
});
return;
}
// For non-Physical Educators, only @alkem.com is allowed
if (
designation !== 'Physical Educator' &&
designation !== 'Physical Educator Part Time' &&
!email.endsWith('@alkem.com')
) {
$this.val('');
Swal.fire({
icon: 'error',
title: 'Invalid Email',
text: 'Please enter a valid Alkem email address (e.g., username@alkem.com). Personal email IDs are not allowed.'
}).then(() => {
$this.focus();
});
return;
}
});
$('#field-mobile_number').on('input', function () {
this.value = this.value.replace(/\D/g, '').slice(0, 10);
// First digit must be 6,7,8,9
if (this.value.length > 0 && !/^[6-9]/.test(this.value)) {
this.value = '';
}
});
$('#field-upload_doctor_list').on('change', function () {
let file = this.files[0];
if (file) {
let allowedExtensions = /(\.xls|\.xlsx)$/i;
if (!allowedExtensions.exec(file.name)) {
Swal.fire({
icon: 'error',
title: 'Invalid File',
text: 'Only Excel files (.xls, .xlsx) are allowed.'
});
$(this).val('');
return false;
}
}
});
$('#field-emp_code_previous_employee').closest('.col-md-12').hide();
$('#field-upload_doctor_list').closest('.col-md-12').hide();
$('#field-expansion_position_replacement').on('change', function () {
let selectedValue = $(this).val();
if (selectedValue === 'Replacement') {
$('#field-emp_code_previous_employee')
.closest('.col-md-12').show();
$('#field-emp_code_previous_employee').prop('required', true);
$('#field-upload_doctor_list')
.closest('.col-md-12').hide();
$('#field-upload_doctor_list').prop('required', false).val('');
} else if (selectedValue === 'Expansion') {
$('#field-upload_doctor_list')
.closest('.col-md-12').show();
$('#field-upload_doctor_list').prop('required', true);
$('#field-emp_code_previous_employee')
.closest('.col-md-12').hide();
$('#field-emp_code_previous_employee').prop('required', false).val('');
}
});
$('#field-expansion_position_replacement').trigger('change');
$('#field-user_id').change(function(){
let hierarchy = $('option:selected', this).attr('hierarchy');
$('#field-hierarchy_id').val(hierarchy)
event.preventDefault();
$.ajax({
type: "GET",
url: '/form/getdoctorlist?partition={{$form->partition}}&hierarchy='+hierarchy,
processData: false,
contentType: false,
success: function( data ) {
$("#pageloader").fadeOut();
$('#field-contact_id').html('')
$('#field-contact_id').append($("<option></option>").attr("value",'').text('-- Select --'));
for(let itm of data) {
$('#field-contact_id').append($("<option></option>").attr("value",itm.value).text(itm.display));
}
},
});
console.log(hierarchy)
})
$('#report-form').on('submit', function(event){
event.preventDefault();
let mobile = $('#field-mobile_number').val().trim();
if (!/^[6-9]\d{9}$/.test(mobile)) {
Swal.fire({
icon: 'error',
title: 'Invalid Mobile Number',
text: 'Please enter a valid 10-digit mobile number starting with 6, 7, 8, or 9.'
}).then(() => {
$('#field-mobile_number').focus();
});
return false;
}
$("#pageloader").fadeIn();
$.ajax({
type: "POST",
url: '/form/ajaxsubmit',
data: new FormData($('#report-form')[0]),
processData: false,
contentType: false,
success: function( data ) {
$("#pageloader").fadeOut();
if(data.status == 'success') {
Swal.fire({
title: 'Great!',
text: 'Your data is successfully submitted!',
icon: 'success'
})
$('#report-form').trigger("reset");
} else {
Swal.fire({
icon: 'error',
title: data.hasOwnProperty('message') ? 'You are not mapped to any position code' : 'Data not submitted',
text: data.hasOwnProperty('message') ? 'for resolution please email Position code, L1 Manager and L2 Manager details to support1@stratawiz.com':'Something went wrong, please try again after some time!'
})
}
},
});
});
let today = new Date();
let dd = String(today.getDate()).padStart(2, '0');
let mm = String(today.getMonth() + 1).padStart(2, '0');
let yyyy = today.getFullYear();
let currentDate = yyyy + '-' + mm + '-' + dd;
$('#field-record_date')
.val(currentDate) // Auto-fill today's date
.attr('max', currentDate)
.prop('readonly', true); // Prevent manual editing
});
</script>
</body>
</html>