sk-hasil-belajar can only be printed once, prevented to be printed multiple times, error texts will be removed on retry

public/js/app.js

@@ -4806,6 +4806,10 @@ var component = {
     usbn: [],
     unbk: []
   },
+  // This prop is to prevent double dialog when printing,
+  // caused by the print button's confirm()
+  // and the beforeprint's alert()
+  confirmPrint: 0,
   view: function view() {
     component.rataRata = {
       raport: [],
@@ -4825,6 +4829,7 @@ var component = {
     }, Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('.form-grid', [Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('.form-group', [Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('label.form-label[for=input-nisn]', 'NISN'), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('input.form-input.input-text#input-nisn[name=nisn][type=text][autocomplete=off][required]'), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('p.input-helper', ['Nomor Induk Siswa Nasional. ', !lodash_isempty__WEBPACK_IMPORTED_MODULE_1___default()(_models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].error) ? _models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].error.errors.siswa != undefined ? Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('span.error', _models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].error.errors.siswa[0] + ' ') : _models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].error.errors.nisn != undefined ? Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('span.error', _models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].error.errors.nisn[0] + ' ') : '' : ''])]), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('.form-group', [Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('label.form-label[for=input-tanggalLahir]', 'Tanggal Lahir'), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('input.form-input.input-text#input-tanggalLahir[name=tanggalLahir][type=text][autocomplete=off][required]'), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('p.input-helper', ['Tanggal lahir dengan format YYYYMMDD. Contoh: untuk tanggal 29 Mei 2000 ditulis 20000529. ', !lodash_isempty__WEBPACK_IMPORTED_MODULE_1___default()(_models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].error) && _models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].error.errors.tanggalLahir != undefined ? Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('span.error', _models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].error.errors.tanggalLahir[0] + ' ') : ''])]), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('button.form-submit#input-submit[type=submit]', 'Lihat')])), lodash_isempty__WEBPACK_IMPORTED_MODULE_1___default()(_models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].current) ? null : Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('.letter', [Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('span.mobile-info', 'Untuk mencetak surat ini, harap gunakan browser di desktop PC.'), !lodash_isempty__WEBPACK_IMPORTED_MODULE_1___default()(_models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].current.access_log) ? null : Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('button.print-button', {
       onclick: function onclick() {
         if (confirm('Surat Keterangan ini hanya dapat dicetak satu kali. Lanjutkan?')) {
+          component.confirmPrint = 1;
           _models_AccessLog__WEBPACK_IMPORTED_MODULE_4__["default"].create({
             siswaId: _models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].current.id,
             src: 'sk-hasil-belajar'
@@ -4873,17 +4878,17 @@ var component = {
       if (nilai.usbn != 0) component.rataRata.usbn.push(nilai.usbn);
       if (nilai.unbk != 0) component.rataRata.unbk.push(nilai.unbk);
       return nilai.raport == 0 && nilai.usbn == 0 && nilai.unbk == 0 ? null : Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tr', [Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td.text-right'), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td[colspan=2]', component.namaMapel[mapel]), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td.text-center', nilai.raport !== 0 ? nilai.raport.toFixed(2) : null), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td.text-center', nilai.usbn !== 0 ? nilai.usbn.toFixed(2) : null), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td.text-center', nilai.unbk !== 0 ? nilai.unbk.toFixed(2) : null)]);
-    })), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tr', [Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('th', 'A.'), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('th[colspan=5].text-left', 'Adaptif')]), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tbody.counter', lodash_map__WEBPACK_IMPORTED_MODULE_2___default()(_models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].current.hasil_belajar.meta.adaptif, function (nilai, mapel) {
+    })), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tr', [Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('th', 'B.'), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('th[colspan=5].text-left', 'Adaptif')]), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tbody.counter', lodash_map__WEBPACK_IMPORTED_MODULE_2___default()(_models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].current.hasil_belajar.meta.adaptif, function (nilai, mapel) {
       if (nilai.raport != 0) component.rataRata.raport.push(nilai.raport);
       if (nilai.usbn != 0) component.rataRata.usbn.push(nilai.usbn);
       if (nilai.unbk != 0) component.rataRata.unbk.push(nilai.unbk);
       return nilai.raport == 0 && nilai.usbn == 0 && nilai.unbk == 0 ? null : Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tr', [Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td.text-right'), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td[colspan=2]', component.namaMapel[mapel]), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td.text-center', nilai.raport !== 0 ? nilai.raport.toFixed(2) : null), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td.text-center', nilai.usbn !== 0 ? nilai.usbn.toFixed(2) : null), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td.text-center', nilai.unbk !== 0 ? nilai.unbk.toFixed(2) : null)]);
-    }), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tr', [Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('th', 'A.'), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('th[colspan=5].text-left', 'Produktif')])), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tbody.counter', lodash_map__WEBPACK_IMPORTED_MODULE_2___default()(_models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].current.hasil_belajar.meta.produktif, function (nilai, mapel) {
+    }), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tr', [Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('th', 'C.'), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('th[colspan=5].text-left', 'Produktif')])), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tbody.counter', lodash_map__WEBPACK_IMPORTED_MODULE_2___default()(_models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].current.hasil_belajar.meta.produktif, function (nilai, mapel) {
       if (nilai.raport != 0) component.rataRata.raport.push(nilai.raport);
       if (nilai.usbn != 0) component.rataRata.usbn.push(nilai.usbn);
       if (nilai.unbk != 0) component.rataRata.unbk.push(nilai.unbk);
       return nilai.raport == 0 && nilai.usbn == 0 && nilai.unbk == 0 ? null : Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tr', [Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td.text-right'), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td[colspan=2]', component.namaMapel[mapel]), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td.text-center', nilai.raport !== 0 ? nilai.raport.toFixed(2) : null), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td.text-center', nilai.usbn !== 0 ? nilai.usbn.toFixed(2) : null), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td.text-center', nilai.unbk !== 0 ? nilai.unbk.toFixed(2) : null)]);
-    })), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tr', [Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('th', 'A.'), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('th[colspan=5].text-left', 'Mulok')]), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tbody.counter', lodash_map__WEBPACK_IMPORTED_MODULE_2___default()(_models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].current.hasil_belajar.meta.mulok, function (nilai, mapel) {
+    })), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tr', [Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('th', 'D.'), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('th[colspan=5].text-left', 'Mulok')]), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tbody.counter', lodash_map__WEBPACK_IMPORTED_MODULE_2___default()(_models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].current.hasil_belajar.meta.mulok, function (nilai, mapel) {
       if (nilai.raport != 0) component.rataRata.raport.push(nilai.raport);
       if (nilai.usbn != 0) component.rataRata.usbn.push(nilai.usbn);
       if (nilai.unbk != 0) component.rataRata.unbk.push(nilai.unbk);
@@ -4900,7 +4905,49 @@ var component = {
       }
     }))), Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('tr', Object(mithril__WEBPACK_IMPORTED_MODULE_0__["default"])('td', 'Drs. Engkos Kosasih, M.M.'))])])])];
   }
-};
+}; // Below is to handle Ctrl+P or MouseR->Print
+
+window.addEventListener("beforeprint", function () {
+  // If the print button did not exists, show nothing when printing
+  if (document.body.querySelector('button.print-button') === null) document.body.style.display = 'none';else {
+    if (!component.confirmPrint) {
+      alert('Surat Keterangan ini hanya dapat dicetak satu kali. Lanjutkan?');
+      component.confirmPrint = 1;
+      _models_AccessLog__WEBPACK_IMPORTED_MODULE_4__["default"].create({
+        siswaId: _models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].current.id,
+        src: 'sk-hasil-belajar'
+      }).then(function () {
+        _models_AccessLog__WEBPACK_IMPORTED_MODULE_4__["default"].fetch('sk-hasil-belajar');
+      })["catch"](function (e) {
+        if (e.code === 0) {
+          _models_AccessLog__WEBPACK_IMPORTED_MODULE_4__["default"].error = {
+            message: e.message,
+            errors: {
+              create: ['Terjadi kesalahan saat menghubungkan ke server.']
+            }
+          };
+        } else {
+          _models_AccessLog__WEBPACK_IMPORTED_MODULE_4__["default"].error = JSON.parse(e.message);
+        }
+      });
+    }
+  }
+});
+window.addEventListener("afterprint", function () {
+  // Give back the whole document.body
+  if (document.body.querySelector('button.print-button') === null) document.body.style.display = 'block'; // Hide the print button
+
+  if (document.body.querySelector('button.print-button') !== null) document.body.querySelector('button.print-button').style.display = 'none'; // To redraw the content to prevent printing
+
+  var nisn = document.body.querySelector('input[name=nisn]').value,
+      tanggalLahir = document.body.querySelector('input[name=tanggalLahir]').value;
+  _models_Siswa__WEBPACK_IMPORTED_MODULE_3__["default"].cariData({
+    nisn: nisn,
+    tanggalLahir: tanggalLahir,
+    src: 'sk-hasil-belajar',
+    "with": ['hasilBelajar', 'accessLog']
+  });
+});
 /* harmony default export */ __webpack_exports__["default"] = (component);
 
 /***/ }),
@@ -4983,6 +5030,7 @@ var model = {
   error: {},
   fetch: function fetch(src) {
     model.current = {};
+    model.error = {};
     return mithril__WEBPACK_IMPORTED_MODULE_0__["default"].request({
       method: 'get',
       url: '/api/access_log',
@@ -5003,6 +5051,7 @@ var model = {
     });
   },
   create: function create(data) {
+    model.error = {};
     return mithril__WEBPACK_IMPORTED_MODULE_0__["default"].request({
       method: 'post',
       url: '/api/access_log',
@@ -5010,24 +5059,6 @@ var model = {
     }).then(function (response) {
       model.current = response;
     });
-  },
-  search: function search(nisn) {
-    model.current = {};
-    mithril__WEBPACK_IMPORTED_MODULE_0__["default"].request({
-      method: 'get',
-      url: '/api/access_log/' + nisn
-    }).then(function (response) {
-      mode.current = response;
-    })["catch"](function (e) {
-      if (e.code === 0) {
-        model.error = {
-          message: e.message,
-          errors: {
-            accessLog: ['Terjadi kesalahan saat menghubungkan ke server.']
-          }
-        };
-      } else model.error = JSON.parse(e.message);
-    });
   }
 };
 /* harmony default export */ __webpack_exports__["default"] = (model);
@@ -5052,7 +5083,7 @@ var model = {
   error: {},
   cariData: function cariData(data) {
     model.current = {};
-    mithril__WEBPACK_IMPORTED_MODULE_0__["default"].request({
+    model.error = {}, mithril__WEBPACK_IMPORTED_MODULE_0__["default"].request({
       method: 'post',
       url: '/api/siswa',
       data: data

resources/js/components/SKHasilBelajar.js

@@ -34,6 +34,10 @@ var component = {
         usbn: [],
         unbk: [],
     },
+    // This prop is to prevent double dialog when printing,
+    // caused by the print button's confirm()
+    // and the beforeprint's alert()
+    confirmPrint: 0,
     view: () => {
         component.rataRata = {
             raport: [],
@@ -93,6 +97,7 @@ var component = {
                 : m('button.print-button', {
                     onclick: () => {
                         if (confirm('Surat Keterangan ini hanya dapat dicetak satu kali. Lanjutkan?')) {
+                            component.confirmPrint = 1;
                             AccessLog.create({siswaId: Siswa.current.id, src: 'sk-hasil-belajar'}).then(() => {
                                 AccessLog.fetch('sk-hasil-belajar');
                                 window.print();
@@ -265,7 +270,7 @@ var component = {
                                             ]);
                                         })),
                                     m('tr', [
-                                        m('th', 'A.'),
+                                        m('th', 'B.'),
                                         m('th[colspan=5].text-left', 'Adaptif'),
                                     ]),
                                     m('tbody.counter',
@@ -282,7 +287,7 @@ var component = {
                                             ]);
                                         }),
                                         m('tr', [
-                                            m('th', 'A.'),
+                                            m('th', 'C.'),
                                             m('th[colspan=5].text-left', 'Produktif'),
                                         ])),
                                     m('tbody.counter',
@@ -299,7 +304,7 @@ var component = {
                                             ]);
                                         })),
                                     m('tr', [
-                                        m('th', 'A.'),
+                                        m('th', 'D.'),
                                         m('th[colspan=5].text-left', 'Mulok'),
                                     ]),
                                     m('tbody.counter',
@@ -345,4 +350,53 @@ var component = {
     },
 };
 
+// Below is to handle Ctrl+P or MouseR->Print
+window.addEventListener("beforeprint", function () {
+    // If the print button did not exists, show nothing when printing
+    if (document.body.querySelector('button.print-button') === null)
+        document.body.style.display = 'none';
+    else {
+        if (!component.confirmPrint) {
+            alert('Surat Keterangan ini hanya dapat dicetak satu kali. Lanjutkan?');
+            component.confirmPrint = 1;
+            AccessLog.create({siswaId: Siswa.current.id, src: 'sk-hasil-belajar'}).then(() => {
+                AccessLog.fetch('sk-hasil-belajar');
+            })
+                .catch(e => {
+                    if (e.code === 0) {
+                        AccessLog.error = {
+                            message: e.message,
+                            errors: {
+                                create: ['Terjadi kesalahan saat menghubungkan ke server.'],
+                            },
+                        };
+                    }
+                    else {
+                        AccessLog.error = JSON.parse(e.message);
+                    }
+                });
+        }
+    }
+});
+
+window.addEventListener("afterprint", function () {
+    // Give back the whole document.body
+    if (document.body.querySelector('button.print-button') === null)
+        document.body.style.display = 'block';
+
+    // Hide the print button
+    if (document.body.querySelector('button.print-button') !== null)
+        document.body.querySelector('button.print-button').style.display = 'none';
+
+    // To redraw the content to prevent printing
+    let nisn = document.body.querySelector('input[name=nisn]').value,
+        tanggalLahir = document.body.querySelector('input[name=tanggalLahir]').value;
+    Siswa.cariData({
+        nisn,
+        tanggalLahir,
+        src: 'sk-hasil-belajar',
+        with: ['hasilBelajar', 'accessLog'],
+    });
+});
+
 export default component;

resources/js/models/AccessLog.js

@@ -5,6 +5,7 @@ var model = {
     error: {},
     fetch: src => {
         model.current = {};
+        model.error = {};
         return m.request({
             method: 'get',
             url: '/api/access_log',
@@ -27,6 +28,7 @@ var model = {
             });
     },
     create: data => {
+        model.error = {};
         return m.request({
             method: 'post',
             url: '/api/access_log',
@@ -36,28 +38,6 @@ var model = {
                 model.current = response;
             });
     },
-    search: nisn => {
-        model.current = {};
-        m.request({
-            method: 'get',
-            url: '/api/access_log/' + nisn,
-        })
-            .then(response => {
-                mode.current = response;
-            })
-            .catch(e => {
-                if (e.code === 0) {
-                    model.error = {
-                        message: e.message,
-                        errors: {
-                            accessLog: ['Terjadi kesalahan saat menghubungkan ke server.']
-                        },
-                    };
-                }
-                else
-                    model.error = JSON.parse(e.message);
-            });
-    },
 };
 
 export default model;

resources/js/models/HasilBelajar.js

@@ -1,24 +0,0 @@
-import m from "mithril"
-import AccessLog from "./AccessLog"
-
-var model = {
-    current: {},
-    error: {},
-    cariData: data => {
-        model.current = {};
-        m.request({
-            method: 'post',
-            url: '/api/hasil_belajar',
-            data,
-        })
-        .then(response => {
-            model.current = response;
-            AccessLog.fetch('sk-hasil-belajar');
-        })
-        .catch(e => {
-            model.error = JSON.parse(e.message);
-        });
-    },
-};
-
-export default model;

resources/js/models/Siswa.js

@@ -6,6 +6,7 @@ var model = {
     error: {},
     cariData: data => {
         model.current = {};
+        model.error = {},
         m.request({
             method: 'post',
             url: '/api/siswa',