import m from "mithril" import _isEmpty from "lodash.isempty" import _map from "lodash.map" import Siswa from "../models/Siswa" import AccessLog from "../models/AccessLog" var component = { oninit: () => { document.title = 'Surat Keterangan Hasil Belajar K13 Siswa - SMK Bhakti Anindya'; Siswa.current = {}; AccessLog.fetch('sk-k13-hasil-belajar'); }, namaMapel: { 'agama': 'Pendidikan Agama dan Budi Pekerti', 'pkn': 'Pendidikan Pancasila Kewarganegaraan', 'indo': 'Bahasa Indonesia', 'penjas': 'Pendidikan Jasmani, Olahraga dan Kesehatan', 'senbud': 'Seni Budaya', 'mtk': 'Matematika', 'inggris': 'Bahasa Inggris dan Bahasa Asing Lainnya', 'ipa': 'Ilmu Pengetahuan Alam', 'sejarah': 'Sejarah Indonesia', 'fisika': 'Fisika', 'kimia': 'Kimia', 'simdig': 'Simulasi dan Komunikasi Digital', 'dpk': 'Dasar Program Keahlian', 'kk': 'Kompetensi Keahlian', 'mandarin': 'Bahasa Mandarin', 'eb': 'Ekonomi Bisnis', 'au': 'Administrasi Umum', }, rataRata: [], namaMuatan: { 'munas': 'Muatan Nasional', 'muwil': 'Muatan Wilayah', 'mujur': 'Muatan Peminatan Jurusan', }, // 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 = []; return [ m('.header', [ m('span.italic.text-xs', [ 'Saat ini sudah ', m('strong', [ AccessLog.current.accessed, ' / ', AccessLog.current.total, ]), ' siswa yang telah mencetak surat keterangan hasil belajar.' ]), m('h1.title', 'Surat Keterangan Hasil Belajar Siswa SMK Bhakti Anindya'), m('span', 'Silahkan masukkan NISN dan Tanggal Lahir kamu di bawah ini.'), ]), m('form.form', { onsubmit: e => { e.preventDefault(); Siswa.cariData({ nisn: e.target.elements.nisn.value, tanggalLahir: e.target.elements.tanggalLahir.value, src: 'sk-k13-hasil-belajar', with: ['k13HasilBelajar', 'accessLog'], }); } }, m('.form-grid', [ m('.form-group', [ m('label.form-label[for=input-nisn]', 'NISN'), m('input.form-input.input-text#input-nisn[name=nisn][type=text][autocomplete=off][required]'), m('p.input-helper', [ 'Nomor Induk Siswa Nasional. ', !_isEmpty(Siswa.error) ? Siswa.error.errors.siswa != undefined ? m('span.error', Siswa.error.errors.siswa[0] + ' ') : Siswa.error.errors.nisn != undefined ? m('span.error', Siswa.error.errors.nisn[0] + ' ') : '' : '', ]), ]), m('.form-group', [ m('label.form-label[for=input-tanggalLahir]', 'Tanggal Lahir'), m('input.form-input.input-text#input-tanggalLahir[name=tanggalLahir][type=text][autocomplete=off][required]'), m('p.input-helper', [ 'Tanggal lahir dengan format YYYYMMDD. Contoh: untuk tanggal 29 Mei 2000 ditulis 20000529. ', !_isEmpty(Siswa.error) && Siswa.error.errors.tanggalLahir != undefined ? m('span.error', Siswa.error.errors.tanggalLahir[0] + ' ') : '', ]), ]), m('button.form-submit#input-submit[type=submit]', 'Lihat'), ])), _isEmpty(Siswa.current) ? null : m('.letter', [ m('span.mobile-info', 'Untuk mencetak surat ini, harap gunakan browser di desktop PC.'), // !_isEmpty(Siswa.current.access_log) ? null // : 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-k13-hasil-belajar'}).then(() => { AccessLog.fetch('sk-k13-hasil-belajar'); window.print(); }) .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); } }); // } }, style: { marginTop: '4rem' } }, [ m.trust('⎙'), ' Print', ]), m('span', {style:{margin:'0 1rem',fontSize:'.8rem',color:'#718096',fontStyle:'italic'}}, 'Pastikan memilih kertas ukuran F4 atau US Legal agar isi SKL tidak terpotong.'), !_isEmpty(AccessLog.error) ? m('span.error.ml-2', AccessLog.error.errors.create[0]) : null, m('.letter__header', { style: { marginTop: '3rem' } }, [ m('img[src=img/letter-head.jpg]'), ]), m('', { style: { borderTop: '1px solid', height: '8px', borderBottom: '3px solid', width: '100%', margin: '10px 0', // height: '1px', // width: '100%', // backgroundColor: '#000', // marginTop: '.5rem', }}), // m('', { // style: { // height: '3px', // width: '100%', // }}), // m('', { // style: { // height: '3px', // width: '100%', // backgroundColor: '#000', // marginBottom: '1rem', // }}), m('.letter__body', [ m('strong.letter__body-header', [ m('p', m('span.border-b.border-black', 'SURAT KETERANGAN LULUS')), m('p.font-normal.mt-1', 'Nomor: 061/SMK-BA/V/2019'), ]), m('br'), m('table', [ m('tr', m('td[colspan=6]', 'Kepala SMK Bhakti Anindya selaku Ketua Penyelenggara Ujian Sekolah Tahun Pelajaran 2019/2020 berdasarkan:')), m('tr', [ m('td'), m('td[colspan=5]', '1. Ketuntasan dari seluruh program pembelajaran pada Kurikulum 2013.'), ]), m('tr', [ m('td'), m('td[colspan=5]', '2. Kriteria Kelulusan dari satuan pendidikan sesuai dengan peraturan dan perundang-undangan.'), ]), m('tr', [ m('td'), m('td[colspan=5]', '3. Rapat Pleno Dewan Pendidik tentang keluulsan pada tanggal 30 April 2020.'), ]), m('tr', m('td', m.trust(' '))), m('tr', m('td[colspan=6]', 'Menerangkan bahwa:')), // m('tr', // m('td', // m.trust(' '))), m('tr', [ m('td'), m('td', 'Nama Peserta'), m('td', ':'), m('td[colspan=3]', Siswa.current.nama), ]), m('tr', [ m('td'), m('td', 'Tempat / Tanggal Lahir'), m('td', ':'), m('td', Siswa.current.tempat_lahir + ' , ' + Siswa.current.tanggal_lahir), ]), m('tr', [ m('td'), m('td', 'NIS / NISN'), m('td', ':'), m('td', Siswa.current.nis + ' / ' + Siswa.current.nisn), ]), m('tr', [ m('td'), m('td', 'Nomor Peserta'), m('td', ':'), m('td[colspan=3]', Siswa.current.nopes), ]), m('tr', [ m('td'), m('td', 'Kelas'), m('td', ':'), m('td[colspan=3]', Siswa.current.kelas), ]), // m('tr', [ // m('td'), // m('td', 'Bidang Studi Keahlian'), // m('td', ':'), // m('td[colspan=3]', Siswa.current.bsk), // ]), // m('tr', [ // m('td'), // m('td', 'Program Studi Keahlian'), // m('td', ':'), // m('td[colspan=3]', Siswa.current.psk), // ]), m('tr', [ m('td'), m('td', 'Kompetensi Keahlian'), m('td', ':'), m('td[colspan=3]', Siswa.current.kk), ]), m('tr', [ m('td'), m('td', 'Dinyatakan'), m('td', ':'), m('td[colspan=3]', m('strong.special', 'LULUS')), ]), // m('tr', // m('td', // m.trust(' '))), // m('tr', // m('td[colspan=6]', 'Adalah benar siswa SMK Bhakti Anindya, Kota Tangerang dan pada tanggal 13 Mei 2019 telah dinyatakan lulus')), m('tr', m('td[colspan=6]', 'Dengan Nilai sebagai berikut:')), m('tr', m('td', m.trust(' '))), m('tr', m('td[colspan=6]', m('table.nilai', [ m('tr', [ m('th', { style: { width: '5%' } }, 'No.'), m('th[colspan=2]', 'Mata Pelajaran'), m('th.long.md:w-1/5', 'Nilai Ujian Sekolah'), m('th.short.md:w-1/5', 'US'), ]), _map(Siswa.current.k13_hasil_belajar.meta.nilai, (mapel, muatan) => { return [ m('tr', [ m('th', muatan == 'munas' ? 'A.' : muatan == 'muwil' ? 'B.' : muatan == 'mujur' ? 'C.' : null), m('th.text-left[colspan=3]', component.namaMuatan[muatan]) ]), m('tbody.counter', _map(mapel, (nilai, nama) => { if (nama == 'mulok') { return [ m('tr', [ m('td.text-right'), m('th.text-left[colspan=2]', 'Mulok'), m('td.text-center') ]), _map(nilai, (nl, mp) => { if (nl != 0) component.rataRata.push(nl); return nilai == 0 ? null : m('tr', [ m('td.text-right.no-num'), m('td[colspan=2]', component.namaMapel[mp]), m('td.text-center', nl.toFixed(2)) ]); }) ]; } else { if (nilai != 0) component.rataRata.push(nilai); return nilai == 0 ? null : m('tr', [ m('td.text-right'), m('td[colspan=2]', component.namaMapel[nama]), m('td.text-center', nilai.toFixed(2)) ]); } })) ]; }), // m('tr', [ // m('th', 'A.'), // m('th[colspan=5].text-left', 'Normatif'), // ]), // m('tbody.counter', // _map(Siswa.current.hasil_belajar.meta.normatif, (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 : m('tr', [ // m('td.text-right'), // m('td[colspan=2]', component.namaMapel[mapel]), // m('td.text-center', nilai.raport !== 0 ? nilai.raport.toFixed(2) : null), // m('td.text-center', nilai.usbn !== 0 ? nilai.usbn.toFixed(2) : null), // m('td.text-center', nilai.unbk !== 0 ? nilai.unbk.toFixed(2) : null), // ]); // })), // m('tr', [ // m('th', 'B.'), // m('th[colspan=5].text-left', 'Adaptif'), // ]), // m('tbody.counter', // _map(Siswa.current.hasil_belajar.meta.adaptif, (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 : m('tr', [ // m('td.text-right'), // m('td[colspan=2]', component.namaMapel[mapel]), // m('td.text-center', nilai.raport !== 0 ? nilai.raport.toFixed(2) : null), // m('td.text-center', nilai.usbn !== 0 ? nilai.usbn.toFixed(2) : null), // m('td.text-center', nilai.unbk !== 0 ? nilai.unbk.toFixed(2) : null), // ]); // }), // m('tr', [ // m('th', 'C.'), // m('th[colspan=5].text-left', 'Produktif'), // ])), // m('tbody.counter', // _map(Siswa.current.hasil_belajar.meta.produktif, (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 : m('tr', [ // m('td.text-right'), // m('td[colspan=2]', component.namaMapel[mapel]), // m('td.text-center', nilai.raport !== 0 ? nilai.raport.toFixed(2) : null), // m('td.text-center', nilai.usbn !== 0 ? nilai.usbn.toFixed(2) : null), // m('td.text-center', nilai.unbk !== 0 ? nilai.unbk.toFixed(2) : null), // ]); // })), // m('tr', [ // m('th', 'D.'), // m('th[colspan=5].text-left', 'Mulok'), // ]), // m('tbody.counter', // _map(Siswa.current.hasil_belajar.meta.mulok, (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 : m('tr', [ // m('td.text-right'), // m('td[colspan=2]', component.namaMapel[mapel]), // m('td.text-center', nilai.raport !== 0 ? nilai.raport.toFixed(2) : null), // m('td.text-center', nilai.usbn !== 0 ? nilai.usbn.toFixed(2) : null), // m('td.text-center', nilai.unbk !== 0 ? nilai.unbk.toFixed(2) : null), // ]); // })), m('tr', [ m('th[colspan=3]', 'Rata-rata'), m('td.text-center', (component.rataRata.reduce((total, num) => total + num) / component.rataRata.length).toFixed(2)), // m('td.text-center', (component.rataRata.usbn.reduce((total, num) => total + num) / component.rataRata.usbn.length).toFixed(2)), // m('td.text-center', (component.rataRata.unbk.reduce((total, num) => total + num) / component.rataRata.unbk.length).toFixed(2)), ]), ]))), // m('tr', // m('td', // m.trust(' '))), // m('tr', // m('td[colspan=6]', 'Demikian Surat Keterangan ini dibuat untuk siswa yang bersangkutan melanjutkan ke jenjang yang lebih tinggi.')), ]), m('table.signature', [ m('tr', m('td', 'Tangerang, 02 Mei 2020')), m('tr', m('td', 'Kepala Sekolah,')), m('tr', m('td', m('.letter__sign', { style: { height: '5rem' } }, m('img[src=img/letter-sign-stamp.png]', {style: { maxHeight: '100%' }})))), m('tr', m('td', 'Ferdy, S.E., M.M.')), ]), ]), ]), ]; }, }; export default component;