bb_sign/app/Views/template_form.php
2024-06-28 15:27:36 +05:30

468 lines
17 KiB
PHP

<!-- ============================================================== -->
<!-- Start Page Content here -->
<!-- ============================================================== -->
<style>
.append-text-button {
font-size: 13px;
color: black;
background-color: transparent;
border-radius: 4px;
text-align: center;
cursor: pointer;
transition: background-color 0.3s ease, color 0.3s ease;
}
.append-text-button:hover {
font-weight: bold;
color: black;
}
</style>
<div class="content-page">
<!-- Start Content-->
<div class="container-fluid">
<!-- start page title -->
<div class="row">
<div class="col-lg-2"></div>
<div class="col-8">
<div class="page-title-box page-title-box-alt">
<h4 class="page-title"> <?php if(isset($templateData)){ echo 'Edit'; }else{ echo 'Create'; } ?> Template</h4>
<div class="page-title-right">
<button type="reset" onclick="window.history.back()" class="btn btn-secondary waves-effect" style="color: #fff;background-color: #6c757d;border-color: #6c757d;">
Back
</button>
<ol class="breadcrumb m-0">
</ol>
</div>
</div>
</div>
<div class="col-lg-2"></div>
</div>
<!-- end page title -->
<div class="row">
<div class="col-lg-2"></div>
<div class="col-lg-8">
<div class="card">
<div class="card-body">
<form id="template-form">
<div class="form-row">
<div class="form-group col-md-6">
<label for="vs_category">Service Group<span class="text-danger">*</span></label>
<select class="select2-dropdown form-control" id="service_group_id" required>
<option value="">Select Service Group </option>
<?php if(isset($AllServiceGroupData)){ foreach ($AllServiceGroupData as $key => $value) { ?>
<option data-id='<?php echo $value['business_id']; ?>' value="<?php echo $value['service_group_id']; ?>" <?php if(isset($serviceGroupData)){ echo ($value['service_group_id'] == $serviceGroupData->service_group_id) ? 'selected' : ''; } ?> ><?php echo $value['group_name']; ?></option>
<?php } } ?>
</select>
</div>
<div class="form-group col-md-6">
<label for="vs_category">Service<span class="text-danger">*</span></label>
<select class="select2-dropdown form-control" id="service_id" required>
<option value="">Select Service </option>
<?php if(isset($AllServiceData)){ foreach ($AllServiceData as $key => $value) { ?>
<option value="<?php echo $value['service_id']; ?>" <?php if(isset($serviceData)){ echo ($value['service_id'] == $serviceData->service_id) ? 'selected' : ''; } ?> ><?php echo $value['service_name']; ?></option>
<?php } } ?>
</select>
</div>
<div class="form-group col-md-6">
<label for="vs_category">Template Header and Footer<span class="text-danger">*</span></label>
<select class="select2-dropdown form-control" id="template_header_business" required>
<option value="">Select Business </option>
<?php if(isset($AllBusinessData)){ foreach ($AllBusinessData as $key => $value) { ?>
<option value="<?php echo $value['business_id']; ?>" <?php if(isset($BusinessData)){ echo ($value['business_id'] == $BusinessData->business_id) ? 'selected' : ''; } ?> ><?php echo $value['business_name']; ?></option>
<?php } } ?>
</select>
</div>
<div class="form-group col-md-6">
<label for="messageto-input">Template Name<span class="text-danger">*</span> </label>
<input type="text" class="form-control" id="template_name" value="<?= isset($templateData) ? $templateData->template_name : '' ?>" >
<input type="hidden" id="template_id" value='<?= isset($templateData) ? $templateData->template_id : 'null' ?>'>
</div>
</div>
<div class="form-group">
<label for="subject-input">Body Content</label>
<!-- basic summernote-->
<div id="summernote-basic"></div>
</div>
</form>
<div class="modal-footer">
<button type="button" class="btn btn-light" onClick="history.back()" data-dismiss="modal" style="color: #fff;background-color: #6c757d;border-color: #6c757d;">Close</button>
<button type="button" id="savedata" class="btn btn-primary">Save </button>
</div>
</div>
</div> <!-- end card -->
</div>
<div class="col-lg-2"></div>
<!-- end col -->
</div>
</div> <!-- container -->
</div> <!-- content -->
<!-- Modal Structure -->
<div class="modal fade" id="customModal" tabindex="-1" role="dialog" aria-labelledby="customModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="customModalLabel">Place Holder Variables</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="container">
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">Client Name</div>
<div class="col-sm-8 append-text-button">%name%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">PAN No</div>
<div class="col-sm-8 append-text-button">%pan_no%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">GST</div>
<div class="col-sm-8 append-text-button">%gst_no%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">Mobile No</div>
<div class="col-sm-8 append-text-button">%mobile_no%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">Email</div>
<div class="col-sm-8 append-text-button">%email%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">Address</div>
<div class="col-sm-8 append-text-button">%address%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">Country</div>
<div class="col-sm-8 append-text-button">%country%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">State</div>
<div class="col-sm-8 append-text-button">%state%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">City</div>
<div class="col-sm-8 append-text-button">%city%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">PIN</div>
<div class="col-sm-8 append-text-button">%pin_code%</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="YearsCustomModal" tabindex="-1" role="dialog" aria-labelledby="YearsCustomModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="YearsCustomModalLabel">Place Holder Variables</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="container">
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">Current Date</div>
<div class="col-sm-8 append-text-button">%CD%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">Calandar Year</div>
<div class="col-sm-8 append-text-button">%CY%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">Financial Year</div>
<div class="col-sm-8 append-text-button">%FY%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">Assessment Year</div>
<div class="col-sm-8 append-text-button">%AY%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">Q1 Year</div>
<div class="col-sm-8 append-text-button">%Q1%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">Q2 Year</div>
<div class="col-sm-8 append-text-button">%Q2%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">Q3 Year</div>
<div class="col-sm-8 append-text-button">%Q3%</div>
</div>
<div class="row mb-3">
<div class="col-sm-4 font-weight-bold">Q4 Year</div>
<div class="col-sm-8 append-text-button">%Q4%</div>
</div>
</div>
</div>
</div>
</div>
</div>
<input type="hidden" id="body_html" value='<?= isset($templateData) ? $templateData->body_html : '' ?>'>
<!-- ============================================================== -->
<!-- End Page content -->
<!-- ============================================================== -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"> </script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.1.0/js/select2.min.js"> </script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/blueimp-md5/2.19.0/js/md5.min.js"></script>
<script>
$(document).ready(function() {
$('.select2-dropdown').select2();
$("#service_group_id").on("change", function()
{
var value = $(this).val();
var selectedOption = $(this).find('option:selected');
var business_id = selectedOption.data('id');
console.log("Business ID:", business_id);
$.ajax({
url: '<?= base_url("get_service_data") ?>?service_group_id=' + value,
type: 'GET',
dataType: 'json',
success: function(response) {
$('#service_id').empty();
$('#template_header_business').empty();
var foundBusiness = false;
<?php if(isset($AllBusinessData)) {
foreach ($AllBusinessData as $key => $value) { ?>
for (var i = 0; i < business_id.length; i++) {
if ('<?php echo $value['business_id']; ?>' == business_id[i]) {
foundBusiness = true;
$('#template_header_business').append($('<option>', {
value: '<?php echo $value['business_id']; ?>',
text: '<?php echo addslashes($value['business_name']); ?>'
}));
// Break out of loop once found
break;
}
}
<?php }} ?>
if (response.count > 0) {
$('#service_id option:not(:first)').remove();
$.each(response.data, function(index, item) {
$('#service_id').append($('<option>', {
value: item.service_id,
text: item.service_name
}));
});
} else {
toastr.warning('Service data not found.', 'Warning');
}
},
error: function(xhr, status, error) {
// Handle error
console.error(xhr.responseText);
toastr.error('Failed to fetch data.', 'Error');
}
});
});
});
$("#savedata").on("click", function()
{
var service_group_id = $('#service_group_id').val();
var service_id = $('#service_id').val();
var template_name = $('#template_name').val();
var template_header_business = $('#template_header_business').val();
// Check if required fields are filled
if (!service_group_id) {
toastr.warning('Service Group is required', 'Warning');
return;
}
if (!service_id) {
toastr.warning('Service is required', 'Warning');
return;
}
if (!template_header_business) {
toastr.warning('Template Header and Footer is required', 'Warning');
return;
}
if (!template_name) {
toastr.warning('Template Name is required', 'Warning');
return;
}
var body_html = $('#summernote-basic').summernote('code');
formData ={
service_group_id : $('#service_group_id').val(),
service_id : $('#service_id').val(),
template_id : $('#template_id').val(),
template_header_business : $('#template_header_business').val(),
template_name : $('#template_name').val(),
body_html : body_html,
};
console.log(formData);
$.ajax({
url: '<?= base_url()."template_create"; ?>',
type: 'POST',
data: formData,
json: true,
success: function(response) {
console.log(response.success);
if(response.success){
toastr.success('Data saved successfully ', 'Success');
window.location.href = '<?= base_url()."template_list"; ?>';
// window.location.href = '<?= base_url()."service_view?service_id="; ?>'+md5(response.service_id);
}else{
toastr.warning('Something went wrong', 'Warning');
}
},
error: function(xhr, status, error) {
// Handle errors here
console.error(xhr.responseText);
}
});
});
$(document).ready(function() {
var lastCursorRange;
$('#summernote-basic').summernote({
height: 750,
toolbar: [
// [groupName, [list of button]]
['style', ['style']],
['font', ['bold', 'italic', 'underline', 'clear' ]],
['fontname', ['fontname']],
['fontsize', ['fontsize']],
['color', ['color']],
['para', ['ul', 'ol', 'paragraph' , 'height']],
['table', ['table']],
['insert', [ 'picture']],
['view', ['fullscreen', 'codeview', 'help']],
['mybutton', ['customButton','Years']] // Custom button group
],
buttons: {
customButton: function() {
var ui = $.summernote.ui;
// create button
var button = ui.button({
contents: 'Client Details',
tooltip: 'Client Details Place Holders',
click: function() {
saveCursorPosition();
$('#customModal').modal('show');
}
});
return button.render();
},
Years: function() {
var ui = $.summernote.ui;
// create button
var button = ui.button({
contents: 'Date & Year',
tooltip: 'Date & Year Place Holders',
click: function() {
saveCursorPosition();
$('#YearsCustomModal').modal('show');
}
});
return button.render();
}
}
});
setTimeout(() =>
{
$('#summernote-basic').summernote('code', $('#body_html').val());
}, 500);
// Save the cursor position
function saveCursorPosition() {
var selection = window.getSelection();
if (selection.rangeCount > 0) {
lastCursorRange = selection.getRangeAt(0);
console.log('Cursor Range Saved:', lastCursorRange);
}
}
// Handle text insertion from modals
$(document).on('click', '.append-text-button', function() {
var textToInsert = $(this).text();
$('#customModal').modal('hide');
$('#YearsCustomModal').modal('hide');
$('#summernote-basic').summernote('focus');
if (lastCursorRange) {
var selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(lastCursorRange);
document.execCommand('insertText', false, textToInsert);
console.log('Inserted text:', textToInsert);
} else {
$('#summernote-basic').summernote('editor.insertText', textToInsert);
}
});
});
</script>