updated db import, views, and api
This commit is contained in:
Gregorio Chiko Putra
27
resources/js/app.js
vendored
27
resources/js/app.js
vendored
@@ -8,18 +8,17 @@ m.mount(document.body.querySelector('.container'), {
|
||||
AccessLog.fetch();
|
||||
},
|
||||
view: () => {
|
||||
console.log(_isEmpty(Siswa.current));
|
||||
return [
|
||||
m('span.italic.text-xs', [
|
||||
'Saat ini sudah ',
|
||||
m('strong', [
|
||||
AccessLog.current.accessed,
|
||||
' / ',
|
||||
AccessLog.current.total,
|
||||
]),
|
||||
' siswa yang telah melihat pengumuman kelulusan.'
|
||||
]),
|
||||
m('.header', [
|
||||
m('span.italic.text-xs', [
|
||||
'Saat ini sudah ',
|
||||
m('strong', [
|
||||
AccessLog.current.accessed,
|
||||
' / ',
|
||||
AccessLog.current.total,
|
||||
]),
|
||||
' siswa yang telah melihat pengumuman kelulusan.'
|
||||
]),
|
||||
m('h1.title', 'Pengumuman Kelulusan SMK Bhakti Anindya'),
|
||||
m('span', 'Silahkan masukkan Nama Lengkap dan NISN kamu di bawah ini.'),
|
||||
]),
|
||||
@@ -36,16 +35,20 @@ m.mount(document.body.querySelector('.container'), {
|
||||
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.'),
|
||||
m('p.input-helper', !_isEmpty(Siswa.error) && Siswa.error.errors.siswa != undefined ? m('span.error', Siswa.error.errors.siswa + ' ') : 'Nomor Induk Siswa Nasional.'),
|
||||
]),
|
||||
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'),
|
||||
m('p.input-helper', [
|
||||
!_isEmpty(Siswa.error) && Siswa.error.errors.tanggalLahir != undefined ? m('span.error', Siswa.error.errors.tanggalLahir[0] + ' ') : '',
|
||||
'Tanggal lahir dengan format YYYYMMDD. Contoh: untuk tanggal 29 Mei 2000 ditulis 20000529',
|
||||
]),
|
||||
]),
|
||||
m('button.form-submit[type=submit]', 'Lihat'),
|
||||
])),
|
||||
m(!_isEmpty(Siswa.current) ? '.letter' : '.letter.hidden', [
|
||||
m('span.mobile-info', 'Untuk mencetak surat ini, harap gunakan browser di desktop PC.'),
|
||||
m('button.print-button', {
|
||||
onclick: () => {
|
||||
window.print();
|
||||
|
||||
6
resources/js/models/Siswa.js
vendored
6
resources/js/models/Siswa.js
vendored
@@ -3,7 +3,9 @@ import AccessLog from "./AccessLog"
|
||||
|
||||
var model = {
|
||||
current: {},
|
||||
error: {},
|
||||
cariData: data => {
|
||||
model.current = {};
|
||||
m.request({
|
||||
method: 'post',
|
||||
url: '/api/siswa',
|
||||
@@ -12,7 +14,9 @@ var model = {
|
||||
.then(response => {
|
||||
model.current = response;
|
||||
AccessLog.fetch();
|
||||
console.log(model.current);
|
||||
})
|
||||
.catch(e => {
|
||||
model.error = JSON.parse(e.message);
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
146
resources/sass/main.scss
vendored
146
resources/sass/main.scss
vendored
@@ -13,6 +13,10 @@ html, body {
|
||||
font-size: calc(.75rem + 1vmin);
|
||||
}
|
||||
|
||||
span.error {
|
||||
@apply text-red-600;
|
||||
}
|
||||
|
||||
.header {
|
||||
h1 {
|
||||
@apply text-3xl font-bold mb-6 mt-4;
|
||||
@@ -23,15 +27,73 @@ html, body {
|
||||
@apply bg-white mx-auto h-full p-12;
|
||||
}
|
||||
|
||||
@screen md {
|
||||
.header {
|
||||
h1 {
|
||||
@apply text-5xl;
|
||||
.letter {
|
||||
@apply mx-auto p-1 text-black w-full;
|
||||
font-size: calc(.5rem + 1vmin);
|
||||
|
||||
.mobile-info {
|
||||
@apply italic text-gray-600;
|
||||
display: initial;
|
||||
}
|
||||
|
||||
.print-button {
|
||||
@apply text-xs text-white bg-indigo-400 px-2 py-1 rounded hidden;
|
||||
|
||||
&:hover {
|
||||
@apply bg-indigo-500;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
@apply outline-none bg-indigo-600
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
@apply w-3/4 mt-8;
|
||||
p {
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
.letter__header {
|
||||
@apply text-center mt-4;
|
||||
|
||||
img {
|
||||
@apply w-full;
|
||||
}
|
||||
}
|
||||
|
||||
.letter__body-header {
|
||||
@apply text-center;
|
||||
}
|
||||
|
||||
ol {
|
||||
@apply list-decimal list-inside;
|
||||
}
|
||||
|
||||
table {
|
||||
@apply w-full;
|
||||
|
||||
td {
|
||||
@apply align-top pr-2;
|
||||
}
|
||||
|
||||
.strong {
|
||||
@apply font-bold;
|
||||
}
|
||||
|
||||
.special {
|
||||
@apply font-bold tracking-widest text-lg italic;
|
||||
}
|
||||
}
|
||||
|
||||
table.signature {
|
||||
@apply w-auto ml-auto mt-4;
|
||||
|
||||
.letter__sign {
|
||||
width: 80%;
|
||||
height: 4rem;
|
||||
background-image: url('/img/letter-sign.jpg');
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -75,66 +137,24 @@ html, body {
|
||||
}
|
||||
}
|
||||
|
||||
.print-button {
|
||||
@apply text-xs text-white bg-indigo-400 px-2 py-1 rounded;
|
||||
|
||||
&:hover {
|
||||
@apply bg-indigo-500;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
@apply outline-none bg-indigo-600
|
||||
}
|
||||
}
|
||||
|
||||
.letter {
|
||||
@apply mx-auto p-1 text-black w-full;
|
||||
font-size: calc(.5rem + 1vmin);
|
||||
|
||||
p {
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
.letter__header {
|
||||
@apply text-center mt-4;
|
||||
|
||||
img {
|
||||
@apply w-full;
|
||||
@screen md {
|
||||
.header {
|
||||
h1 {
|
||||
@apply text-5xl;
|
||||
}
|
||||
}
|
||||
|
||||
.letter__body-header {
|
||||
@apply text-center;
|
||||
.container {
|
||||
@apply w-3/4 mt-8;
|
||||
}
|
||||
|
||||
ol {
|
||||
@apply list-decimal list-inside;
|
||||
}
|
||||
|
||||
table {
|
||||
@apply w-full;
|
||||
|
||||
td {
|
||||
@apply align-top pr-2;
|
||||
.letter {
|
||||
.mobile-info {
|
||||
@apply hidden;
|
||||
}
|
||||
|
||||
.strong {
|
||||
@apply font-bold;
|
||||
}
|
||||
|
||||
.special {
|
||||
@apply font-bold tracking-widest text-lg italic;
|
||||
}
|
||||
}
|
||||
|
||||
table.signature {
|
||||
@apply w-auto ml-auto mt-4;
|
||||
|
||||
.letter__sign {
|
||||
width: 79%;
|
||||
height: 4rem;
|
||||
background-image: url('/img/letter-sign.jpg');
|
||||
background-size: contain;
|
||||
.print-button {
|
||||
display: initial;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -148,7 +168,7 @@ html, body {
|
||||
margin: 1cm;
|
||||
}
|
||||
|
||||
.container > .header, .container > .form, .print-button {
|
||||
.container > .header, .container > .form, .letter .print-button, .letter .mobile-info {
|
||||
@apply hidden;
|
||||
}
|
||||
|
||||
@@ -163,11 +183,5 @@ html, body {
|
||||
.letter__body-header {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
table.signature {
|
||||
.letter__sign {
|
||||
height: 3.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user