Updated ERP with new modules and features
This commit is contained in:
Kwesi Banson
274
public/assets/js/mno-show.js
Normal file
274
public/assets/js/mno-show.js
Normal file
@@ -0,0 +1,274 @@
|
||||
$(document).ready(function() {
|
||||
|
||||
// ==========================================
|
||||
// 1. CONNECTION DETAILS LOGIC
|
||||
// ==========================================
|
||||
$('#connectionModeSelect').on('change', function() {
|
||||
if ($(this).val() === 'VPN Tunnel') {$('#vpnFormContainer').slideDown();
|
||||
} else {
|
||||
$('#vpnFormContainer').slideUp();
|
||||
$('#vpnFileInput').val('');
|
||||
}
|
||||
});
|
||||
|
||||
$('#addConnectionForm').on('submit', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
let $form =$(this);
|
||||
let $submitBtn =$('#btnSubmitConnection');
|
||||
let originalText = $submitBtn.html();
|
||||
let $alertBox =$('#connectionModalAlert');
|
||||
let formData = new FormData(this);
|
||||
|
||||
$submitBtn.html('<span class="spinner-border spinner-border-sm me-2"></span>Saving...').prop('disabled', true);
|
||||
$alertBox.html('');
|
||||
$form.find('.is-invalid').removeClass('is-invalid');$form.find('.invalid-feedback').remove();
|
||||
|
||||
$.ajax({
|
||||
url: $form.attr('action'),
|
||||
type: 'POST',
|
||||
data: formData,
|
||||
processData: false,
|
||||
contentType: false,
|
||||
success: function(response) {
|
||||
if (response.success) {
|
||||
$('#addConnectionModal').modal('hide');
|
||||
Swal.fire({
|
||||
icon: 'success',
|
||||
title: 'Success!',
|
||||
text: response.message,
|
||||
confirmButtonColor: '#5c4df0'
|
||||
}).then(() => location.reload());
|
||||
}
|
||||
},
|
||||
error: function(xhr) {
|
||||
if (xhr.status === 422) {
|
||||
let errors = xhr.responseJSON.errors;
|
||||
$alertBox.html(`
|
||||
<div class="alert alert-danger d-flex align-items-center py-2 px-3 small" role="alert">
|
||||
<i class="bi bi-exclamation-triangle-fill me-2"></i>
|
||||
<div>Please check the highlighted fields below.</div>
|
||||
</div>
|
||||
`);
|
||||
$.each(errors, function(key, value) {
|
||||
let $input =$form.find('[name="' + key + '"]');
|
||||
if ($input.length) {
|
||||
$input.addClass('is-invalid');$input.parent().append('<div class="invalid-feedback d-block fw-medium small">' + value[0] + '</div>');
|
||||
}
|
||||
});
|
||||
} else {
|
||||
$alertBox.html(`
|
||||
<div class="alert alert-danger d-flex align-items-center py-2 px-3 small" role="alert">
|
||||
<i class="bi bi-x-circle-fill me-2"></i>
|
||||
<div>An error occurred. Please try again.</div>
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
},
|
||||
complete: function() {
|
||||
$submitBtn.html(originalText).prop('disabled', false);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$('#addConnectionModal').on('hidden.bs.modal', function () {
|
||||
$('#addConnectionForm')[0].reset();
|
||||
$('#vpnFormContainer').hide();
|
||||
$('#connectionModalAlert').html('');
|
||||
$('#addConnectionForm').find('.is-invalid').removeClass('is-invalid');
|
||||
$('#addConnectionForm').find('.invalid-feedback').remove();
|
||||
});
|
||||
|
||||
// ==========================================
|
||||
// 2. MULTIPLE DOCUMENT UPLOAD LOGIC
|
||||
// ==========================================
|
||||
$('#addDocRowBtn').on('click', function() {
|
||||
let newRow = `
|
||||
<div class="row g-2 mb-3 document-row">
|
||||
<div class="col-md-5">
|
||||
<input type="text" name="document_names[]" class="form-control" placeholder="e.g. Rate Card" required>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<input type="file" name="documents[]" class="form-control" required>
|
||||
</div>
|
||||
<div class="col-md-1">
|
||||
<button type="button" class="btn btn-outline-danger w-100 remove-doc-row">
|
||||
<i class="bi bi-trash"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
$('#documentRowsContainer').append(newRow);
|
||||
updateRemoveButtons();
|
||||
});
|
||||
|
||||
$(document).on('click', '.remove-doc-row', function() {$(this).closest('.document-row').remove();
|
||||
updateRemoveButtons();
|
||||
});
|
||||
|
||||
function updateRemoveButtons() {
|
||||
if ($('.document-row').length > 1) {$('.remove-doc-row').prop('disabled', false);
|
||||
} else {
|
||||
$('.remove-doc-row').prop('disabled', true);
|
||||
}
|
||||
}
|
||||
|
||||
$('#addDocumentForm').on('submit', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
let $form =$(this);
|
||||
let $submitBtn =$('#btnSubmitDocuments');
|
||||
let originalText = $submitBtn.html();
|
||||
let $alertBox =$('#documentModalAlert');
|
||||
let formData = new FormData(this);
|
||||
|
||||
$submitBtn.html('<span class="spinner-border spinner-border-sm me-2"></span>Uploading...').prop('disabled', true);
|
||||
$alertBox.html('');$form.find('.is-invalid').removeClass('is-invalid');
|
||||
|
||||
$.ajax({
|
||||
url: $form.attr('action'),
|
||||
type: 'POST',
|
||||
data: formData,
|
||||
processData: false,
|
||||
contentType: false,
|
||||
success: function(response) {
|
||||
if (response.success) {
|
||||
$('#addDocumentModal').modal('hide');
|
||||
Swal.fire({
|
||||
icon: 'success',
|
||||
title: 'Uploaded!',
|
||||
text: response.message,
|
||||
confirmButtonColor: '#5c4df0'
|
||||
}).then(() => location.reload());
|
||||
}
|
||||
},
|
||||
error: function(xhr) {
|
||||
$alertBox.html(`
|
||||
<div class="alert alert-danger d-flex align-items-center py-2 px-3 small" role="alert">
|
||||
<i class="bi bi-exclamation-triangle-fill me-2"></i>
|
||||
<div>Validation failed. Ensure all files are valid formats and under 10MB.</div>
|
||||
</div>
|
||||
`);
|
||||
},
|
||||
complete: function() {
|
||||
$submitBtn.html(originalText).prop('disabled', false);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
$('#addDocumentModal').on('hidden.bs.modal', function () {
|
||||
$('#addDocumentForm')[0].reset();
|
||||
$('#documentModalAlert').html('');
|
||||
$('.document-row:not(:first)').remove();
|
||||
updateRemoveButtons();
|
||||
});
|
||||
|
||||
// ==========================================
|
||||
// 3. EDIT MNO PARTNER LOGIC
|
||||
// ==========================================
|
||||
$('.btn-edit-operator').on('click', function() {
|
||||
// Fetch data via the existing getJson endpoint
|
||||
$.ajax({
|
||||
url: `${baseUrl}/mnos/json/${operatorId}`, // Adjust URL if your route is named differently
|
||||
type: 'GET',
|
||||
success: function(data) {
|
||||
$('#edit_mno_id').val(data.id);
|
||||
$('#edit_name').val(data.name);
|
||||
$('#edit_country').val(data.country);
|
||||
$('#edit_connection_status').val(data.connection_status);
|
||||
$('#edit_connection_type').val(data.connection_type);
|
||||
|
||||
$('#edit_mno_account_manager').val(data.mno_account_manager);
|
||||
$('#edit_technical_support_person').val(data.technical_support_person);
|
||||
$('#edit_contact_person').val(data.contact_person);
|
||||
$('#edit_contact_person_phone').val(data.contact_person_phone);
|
||||
$('#edit_contact_person_email').val(data.contact_person_email);
|
||||
$('#edit_support_skype').val(data.support_skype);
|
||||
|
||||
$('#edit_buying_rate').val(data.buying_rate);
|
||||
$('#edit_rate_type').val(data.rate_type);
|
||||
$('#edit_payment_terms').val(data.payment_terms);
|
||||
|
||||
// Reset tabs to Basic Info
|
||||
$('#editOperatorModal .nav-link').removeClass('active');
|
||||
$('#editOperatorModal .tab-pane').removeClass('show active');
|
||||
$('#editOperatorModal .nav-link').first().addClass('active');
|
||||
$('#edit-tab-basic').addClass('show active');
|
||||
|
||||
$('#edit_contract_type').val(data.contract_type);
|
||||
$('#edit_contract_validity').val(data.contract_validity);
|
||||
|
||||
// Handle Boolean for Auto Renew
|
||||
let isAutoRenew = data.contract_auto_renew === false || data.contract_auto_renew === 0 ? '0' : '1';
|
||||
$('#edit_contract_auto_renew').val(isAutoRenew).trigger('change');
|
||||
|
||||
// Format date to YYYY-MM-DD for the HTML date input if it exists
|
||||
if (data.next_renewal_date) {
|
||||
let formattedDate = data.next_renewal_date.split('T')[0];
|
||||
$('#edit_next_renewal_date').val(formattedDate);
|
||||
} else {
|
||||
$('#edit_next_renewal_date').val('');
|
||||
}
|
||||
|
||||
// Reset tabs to Basic Info
|
||||
$('#editOperatorModal .nav-link').removeClass('active');
|
||||
$('#editOperatorModal .tab-pane').removeClass('show active');
|
||||
$('#editOperatorModal .nav-link').first().addClass('active');
|
||||
$('#edit-tab-basic').addClass('show active');
|
||||
|
||||
$('#editOperatorModal').modal('show');
|
||||
}
|
||||
});
|
||||
});
|
||||
// Toggle the Renewal Date field based on Auto Renew selection
|
||||
$('#edit_contract_auto_renew').on('change', function() {
|
||||
if ($(this).val() === '0') {$('#renewal_date_container').slideDown();
|
||||
$('#edit_next_renewal_date').prop('required', true);
|
||||
} else {
|
||||
$('#renewal_date_container').slideUp();
|
||||
$('#edit_next_renewal_date').prop('required', false).val('');
|
||||
}
|
||||
});
|
||||
$('#editOperatorForm').on('submit', function(e) {
|
||||
e.preventDefault();
|
||||
let $form =$(this);
|
||||
let $btn =$('#btnUpdateOperator');
|
||||
let originalText = $btn.html();
|
||||
|
||||
$btn.html('<span class="spinner-border spinner-border-sm me-2"></span>Updating...').prop('disabled', true);
|
||||
$form.find('.is-invalid').removeClass('is-invalid');$form.find('.invalid-feedback').remove();
|
||||
|
||||
$.ajax({
|
||||
url: `${baseUrl}/mnos/${operatorId}`, // PUT endpoint
|
||||
type: 'POST', // Laravel uses POST + @method('PUT') for forms
|
||||
data: $form.serialize(),
|
||||
success: function(response) {
|
||||
$('#editOperatorModal').modal('hide');
|
||||
Swal.fire({
|
||||
icon: 'success',
|
||||
title: 'Updated!',
|
||||
text: response.message,
|
||||
timer: 1500,
|
||||
showConfirmButton: false
|
||||
}).then(() => location.reload());
|
||||
},
|
||||
error: function(xhr) {
|
||||
if (xhr.status === 422) {
|
||||
$.each(xhr.responseJSON.errors, function(key, value) {
|
||||
let $input =$form.find('[name="' + key + '"]');
|
||||
$input.addClass('is-invalid');$input.parent().append('<div class="invalid-feedback d-block fw-medium">' + value[0] + '</div>');
|
||||
});
|
||||
|
||||
// Auto-switch to the tab with the error
|
||||
let $firstError =$form.find('.is-invalid').first();
|
||||
if ($firstError.length) {
|
||||
let tabId = $firstError.closest('.tab-pane').attr('id');$form.find('[data-bs-target="#' + tabId + '"]').tab('show');
|
||||
}
|
||||
}
|
||||
},
|
||||
complete: function() {
|
||||
$btn.html(originalText).prop('disabled', false);
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
183
public/assets/js/vpn-index.js
Normal file
183
public/assets/js/vpn-index.js
Normal file
@@ -0,0 +1,183 @@
|
||||
$(document).ready(function() {
|
||||
|
||||
// 1. Add VPN Config
|
||||
$('#addVpnForm').on('submit', function(e) {
|
||||
e.preventDefault();
|
||||
let $form = $(this);
|
||||
let $btn = $('#btnSaveVpn');
|
||||
let originalText = $btn.html();
|
||||
|
||||
$btn.html('<span class="spinner-border spinner-border-sm me-2"></span>Saving...').prop('disabled', true);
|
||||
$form.find('.is-invalid').removeClass('is-invalid');
|
||||
|
||||
$.ajax({
|
||||
url: `${base_url}/vpns`,
|
||||
type: 'POST',
|
||||
data: $form.serialize(),
|
||||
success: function(response) {
|
||||
$('#addVpnModal').modal('hide');
|
||||
Swal.fire({
|
||||
icon: 'success',
|
||||
title: 'Added!',
|
||||
text: response.message,
|
||||
timer: 1500,
|
||||
showConfirmButton: false
|
||||
}).then(() => location.reload());
|
||||
},
|
||||
error: function(xhr) {
|
||||
if (xhr.status === 422) {
|
||||
$.each(xhr.responseJSON.errors, function(key, value) {
|
||||
let $input = $form.find('[name="' + key + '"]');
|
||||
$input.addClass('is-invalid');
|
||||
$input.parent().append('<div class="invalid-feedback d-block fw-medium">' + value[0] + '</div>');
|
||||
});
|
||||
|
||||
let $firstError = $form.find('.is-invalid').first();
|
||||
if ($firstError.length) {
|
||||
let tabId = $firstError.closest('.tab-pane').attr('id');
|
||||
$form.find('[data-bs-target="#' + tabId + '"]').tab('show');
|
||||
}
|
||||
} else {
|
||||
Swal.fire('Error', 'An unexpected error occurred.', 'error');
|
||||
}
|
||||
},
|
||||
complete: function() {
|
||||
$btn.html(originalText).prop('disabled', false);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 2. Fetch Data for Edit Modal
|
||||
$(document).on('click', '.btn-edit-vpn', function(e) {
|
||||
e.preventDefault();
|
||||
let vpnId = $(this).data('id');
|
||||
|
||||
$.ajax({
|
||||
url: `${base_url}/vpns/${vpnId}`,
|
||||
type: 'GET',
|
||||
success: function(vpn) {
|
||||
// Basic Info Tab
|
||||
$('#edit_vpn_id').val(vpn.id);
|
||||
$('#edit_partner_name').val(vpn.partner_name);
|
||||
$('#edit_status').val(vpn.status);
|
||||
$('#edit_local_device').val(vpn.local_device);
|
||||
$('#edit_peer_device').val(vpn.peer_device);
|
||||
$('#edit_local_ip').val(vpn.local_ip);
|
||||
$('#edit_peer_ip').val(vpn.peer_ip);
|
||||
$('#edit_encryption_domain_local').val(vpn.encryption_domain_local);
|
||||
$('#edit_encryption_domain_remote').val(vpn.encryption_domain_remote);
|
||||
|
||||
// Phase 1 Tab
|
||||
$('#edit_ike_version').val(vpn.ike_version);
|
||||
$('#edit_phase1_encryption').val(vpn.phase1_encryption);
|
||||
$('#edit_phase1_hash').val(vpn.phase1_hash);
|
||||
$('#edit_phase1_dh_group').val(vpn.phase1_dh_group);
|
||||
$('#edit_phase1_lifetime').val(vpn.phase1_lifetime);
|
||||
|
||||
// Phase 2 Tab
|
||||
$('#edit_phase2_encryption').val(vpn.phase2_encryption);
|
||||
$('#edit_phase2_hash').val(vpn.phase2_hash);
|
||||
$('#edit_phase2_dh_group').val(vpn.phase2_dh_group);
|
||||
$('#edit_phase2_lifetime').val(vpn.phase2_lifetime);
|
||||
|
||||
// Handle Checkbox for PFS
|
||||
if (vpn.pfs_enabled == 1 || vpn.pfs_enabled === true) {
|
||||
$('#edit_pfs_enabled').prop('checked', true);
|
||||
} else {
|
||||
$('#edit_pfs_enabled').prop('checked', false);
|
||||
}
|
||||
|
||||
// Reset tabs so it opens to the first tab by default
|
||||
$('#editVpnModal .nav-link').removeClass('active');
|
||||
$('#editVpnModal .tab-pane').removeClass('show active');
|
||||
$('#editVpnModal .nav-link').first().addClass('active');
|
||||
$('#edit-tab-basic').addClass('show active');
|
||||
|
||||
$('#editVpnModal').modal('show');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 3. Update VPN Config
|
||||
$('#editVpnForm').on('submit', function(e) {
|
||||
e.preventDefault();
|
||||
let $form = $(this);
|
||||
let vpnId = $('#edit_vpn_id').val();
|
||||
let $btn = $('#btnUpdateVpn');
|
||||
let originalText = $btn.html();
|
||||
|
||||
$btn.html('<span class="spinner-border spinner-border-sm me-2"></span>Updating...').prop('disabled', true);
|
||||
$form.find('.is-invalid').removeClass('is-invalid');
|
||||
$form.find('.invalid-feedback').remove();
|
||||
|
||||
$.ajax({
|
||||
url: `${base_url}/vpns/${vpnId}`,
|
||||
type: 'POST',
|
||||
data: $form.serialize(),
|
||||
success: function(response) {
|
||||
$('#editVpnModal').modal('hide');
|
||||
Swal.fire({
|
||||
icon: 'success',
|
||||
title: 'Updated!',
|
||||
text: response.message,
|
||||
timer: 1500,
|
||||
showConfirmButton: false
|
||||
}).then(() => location.reload());
|
||||
},
|
||||
error: function(xhr) {
|
||||
if (xhr.status === 422) {
|
||||
$.each(xhr.responseJSON.errors, function(key, value) {
|
||||
let $input = $form.find('[name="' + key + '"]');
|
||||
$input.addClass('is-invalid');
|
||||
$input.parent().append('<div class="invalid-feedback d-block fw-medium">' + value[0] + '</div>');
|
||||
});
|
||||
|
||||
|
||||
let $firstError = $form.find('.is-invalid').first();
|
||||
if ($firstError.length) {
|
||||
let tabId = $firstError.closest('.tab-pane').attr('id');
|
||||
$form.find('[data-bs-target="#' + tabId + '"]').tab('show');
|
||||
}
|
||||
} else {
|
||||
Swal.fire('Error', 'An unexpected error occurred.', 'error');
|
||||
}
|
||||
},
|
||||
complete: function() {
|
||||
$btn.html(originalText).prop('disabled', false);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 4. Export VPN Configuration (Trigger Modal)
|
||||
$(document).on('click', '.btn-export-vpn', function(e) {
|
||||
e.preventDefault();
|
||||
let vpnId = $(this).data('id');
|
||||
let $btn = $(this);
|
||||
let originalHtml = $btn.html();
|
||||
|
||||
$btn.html('<span class="spinner-border spinner-border-sm"></span>').prop('disabled', true);
|
||||
|
||||
$.ajax({
|
||||
url: `${base_url}/vpns/${vpnId}/template`,
|
||||
type: 'GET',
|
||||
success: function(response) {
|
||||
$('#export_partner_name').val(response.partner_name);
|
||||
$('#export_config_content').val(response.template);
|
||||
$('#exportVpnModal').modal('show');
|
||||
},
|
||||
error: function() {
|
||||
Swal.fire('Error', 'Failed to generate configuration template.', 'error');
|
||||
},
|
||||
complete: function() {
|
||||
$btn.html(originalHtml).prop('disabled', false);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Clean up modals on close
|
||||
$('#addVpnModal, #editVpnModal, #exportVpnModal').on('hidden.bs.modal', function () {
|
||||
$(this).find('form')[0].reset();
|
||||
$(this).find('.is-invalid').removeClass('is-invalid');
|
||||
$(this).find('.invalid-feedback').remove();
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user