Refactor multiple JavaScript classes to use ES6 syntax, including Download, Pdf, Printer, PrinterPos, PoleDisplay, and Simulator. Update method names for consistency and improve error handling. Modify AJAX requests to enhance functionality and user experience.
This commit is contained in:
+121
-61
@@ -1,66 +1,126 @@
|
||||
/*******************************************************************
|
||||
|
||||
Module : /assets/js/pdf.js
|
||||
Desc. : JS - Cetak Laporan PDF
|
||||
Created By : Siau Pheng ([email protected]).
|
||||
Created Date : April 6th, 2015.
|
||||
Last Modified : October 18th, 2020.
|
||||
Module : /assets/js/pdf.js
|
||||
Desc. : JS - Cetak Laporan PDF
|
||||
Created By : Siau Pheng ([email protected]).
|
||||
Created Date : April 6th, 2015.
|
||||
Last Modified : November 2nd, 2026.
|
||||
|
||||
(c) 3FONIA Software; WWW.3FONIA.COM.
|
||||
(c) 3FONIA Software; WWW.3FONIA.COM.
|
||||
|
||||
*******************************************************************/
|
||||
*******************************************************************
|
||||
*
|
||||
* Class Pdf
|
||||
*
|
||||
* Preview dan download file pdf.
|
||||
*
|
||||
* @license MIT, https://www.3fonia.com
|
||||
* @copyright Copyright (c) 2008-2026, Siau Pheng <[email protected]>
|
||||
*
|
||||
* @param {object} options
|
||||
* @param {string} options.url - Endpoint PDF File URL
|
||||
* @param {number} [options.zoom=80] - Zoom percentage in PDF viewer
|
||||
* @param {string} [options.filename='report.pdf'] - Default file name for download is header is missing
|
||||
* @param {Array} [options.params] - Request payload
|
||||
*/
|
||||
|
||||
var Pdf = function(options){
|
||||
var vars = {
|
||||
'url': '',
|
||||
'zoom': 80,
|
||||
'param': []
|
||||
};
|
||||
this.construct = function(options){
|
||||
if (typeof options == 'object') {
|
||||
$.extend(vars, options);
|
||||
} else vars.url = options;
|
||||
};
|
||||
this.set_url = function (url){
|
||||
vars.url = url;
|
||||
};
|
||||
this.set_zoom = function (zoom){
|
||||
if (zoom) vars.zoom = zoom;
|
||||
},
|
||||
this.add_param = function (par_id, par_val){
|
||||
var _getvalue = (par_val) ? par_id + "=" + escape(par_val) : par_id;
|
||||
vars.param.push(_getvalue);
|
||||
},
|
||||
this.downloadPDF = function(){
|
||||
if (!vars.url) {
|
||||
console.warn(vars.param + ", cek url php!");
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: vars.url,
|
||||
data: FoniaJS.RequestParam(vars.param),
|
||||
success: (typeof vars.onSuccess === "function") ? vars.onSuccess : null,
|
||||
error: (typeof vars.onFailure === "function") ? vars.onFailure : null,
|
||||
}).always(FoniaJS.FormDecorated);
|
||||
return this;
|
||||
};
|
||||
this.showPDF = function(){
|
||||
var _proto = window.location.protocol + '//';
|
||||
var _src = _proto + FoniaJS.WEB_HOST + vars.url + '?' + $.param(FoniaJS.RequestParam(vars.param)) + '#zoom='+vars.zoom+',0,0&page=1';
|
||||
var _wtxt =
|
||||
'<div class="modal fade" id="winAPPPDF" tabindex="-1" role="dialog" data-bs-keyboard="false" data-bs-show="false" data-bs-backdrop="static" aria-labelledby="winAPPPDFLabel" aria-hidden="true">'+
|
||||
'<div class="modal-dialog modal-dialog-centered modal-fs" role="document">'+
|
||||
'<div class="modal-content">'+
|
||||
'<div class="modal-header"><h5 class="modal-title" id="winAPPPDFLabel">Preview PDF</h5><button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close"></button></div>'+
|
||||
'<div class="modal-body mb-0 p-0"><div class="ratio ratio-21x9"><object type="application/pdf" data="'+_src+'"><p>Tidak Mendukung Preview PDF</p></object></div></div>'+
|
||||
'</div></div></div>';
|
||||
if ($('#winAPPPDF')) $('#winAPPPDF').modal('dispose').remove();
|
||||
$(_wtxt).on('shown.bs.modal', function(e){
|
||||
FoniaJS.FormDecorated();
|
||||
}).on('hidden.bs.modal', function(e){
|
||||
$(this).remove();
|
||||
}).modal('show');
|
||||
};
|
||||
this.construct(options);
|
||||
};
|
||||
class Pdf {
|
||||
constructor(options = {}) {
|
||||
this.url = typeof options === 'string' ? options : options.url || '';
|
||||
this.zoom = options.zoom || 80;
|
||||
this.filename = options.filename || 'report.pdf';
|
||||
this.params = options.params || [];
|
||||
}
|
||||
|
||||
addParam(id, val) {
|
||||
this.params.push(val !== undefined ? `${id}=${encodeURIComponent(val)}` : id);
|
||||
return this;
|
||||
}
|
||||
|
||||
async downloadPdf() {
|
||||
if (!this.url) {
|
||||
console.warn('Url PDF dibutuhkan!');
|
||||
return;
|
||||
}
|
||||
await $.ajax({
|
||||
type: 'POST',
|
||||
url: this.url,
|
||||
data: FoniaJS.RequestParam(this.params),
|
||||
xhrFields: { responseType: 'blob' }
|
||||
})
|
||||
.done((blob, status, xhr) => {
|
||||
let filename = this.filename;
|
||||
const disposition = xhr.getResponseHeader('Content-Disposition');
|
||||
const match = disposition?.match(/filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/);
|
||||
if (match?.[1]) filename = match[1].replace(/['"]/g, '');
|
||||
const url = URL.createObjectURL(blob);
|
||||
const link = Object.assign(document.createElement('a'), {
|
||||
href: url,
|
||||
download: filename
|
||||
});
|
||||
link.click();
|
||||
URL.revokeObjectURL(url);
|
||||
})
|
||||
.fail((xhr, status, err) => console.error('Gagal proses download PDF karena : ', err));
|
||||
}
|
||||
|
||||
async showPdf() {
|
||||
if (!this.url) {
|
||||
console.warn('Url PDF dibutuhkan!');
|
||||
return;
|
||||
}
|
||||
await $.ajax({
|
||||
type: 'POST',
|
||||
url: this.url,
|
||||
data: FoniaJS.RequestParam(this.params),
|
||||
xhrFields: { responseType: 'blob' }
|
||||
})
|
||||
.done((blob, status, xhr) => {
|
||||
let filename = this.filename;
|
||||
const disposition = xhr.getResponseHeader('Content-Disposition');
|
||||
const match = disposition?.match(/filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/);
|
||||
if (match?.[1]) filename = match[1].replace(/['"]/g, '');
|
||||
|
||||
const objectUrl = URL.createObjectURL(blob);
|
||||
const pdfSrc = `${objectUrl}#zoom=${zoom}&page=1`;
|
||||
|
||||
const modalHtml = `
|
||||
<div class="modal fade" id="winAPPPDF" tabindex="-1" data-bs-backdrop="static" aria-labelledby="winAPPPDFLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered modal-xl" style="height: 90vh;">
|
||||
<div class="modal-content h-100">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="winAPPPDFLabel">${filename}</h5>
|
||||
<div class="ms-auto d-flex align-items-center gap-2">
|
||||
<a href="${objectUrl}" download="${filename}" class="btn btn-sm btn-outline-primary">
|
||||
<i class="bi bi-download"></i> Download
|
||||
</a>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-body p-0 h-100">
|
||||
<object data="${pdfSrc}" type="application/pdf" class="w-100 h-100">
|
||||
<iframe src="${pdfSrc}" class="w-100 h-100" style="border: none;">
|
||||
<p class="p-3">Ada kendala dalam Preview PDF di browser Anda.
|
||||
<a href="${objectUrl}" download="${filename}">Unduh ${filename}</a> instead.
|
||||
</p>
|
||||
</iframe>
|
||||
</object>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
$('#winAPPPDF').modal('dispose').remove();
|
||||
$(modalHtml)
|
||||
.appendTo('body')
|
||||
//.on('shown.bs.modal', () => FoniaJS.FormDecorated())
|
||||
.on('hidden.bs.modal', function () {
|
||||
URL.revokeObjectURL(objectUrl);
|
||||
$(this).remove();
|
||||
})
|
||||
.modal('show');
|
||||
})
|
||||
.fail((xhr, status, err) => console.error('Gagal proses preview PDF karena : ', err));
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user