Hafifie PKB
100 lines
4.1 KiB
Vue
100 lines
4.1 KiB
Vue
<template>
|
|
<div class="container">
|
|
|
|
<div class="flex w-full">
|
|
<div class="xl:w-2/3 2xl:w-1/2 p-8 mx-auto">
|
|
<div class="bg-yellow-600 text-gray-200 text-lg px-6 py-4 rounded-t-lg">
|
|
<router-link to="/akaunhome">
|
|
<i class="fas fa-backspace text-white"></i>
|
|
</router-link>
|
|
|
|
<span class="text-center mx-auto text-white font-bold">Laporan Akru Bulanan</span>
|
|
</div>
|
|
<form method="get" id="formakru" :action="Urlredirect()" target="_blank">
|
|
<div class="rounded bg-white shadow p-6">
|
|
<input :value="jenisgenerate" type="hidden" name="jenis" />
|
|
<input :value="$kodcaw" name="kodcaw" hidden />
|
|
<input :value="$hostname" name="hostname" hidden />
|
|
<label for="year"
|
|
class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Pilih Tahun</label>
|
|
<select name="year" id="year"
|
|
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500">
|
|
<option selected disabled>Tahun</option>
|
|
<option v-for="year in upcomingYears" :value="year" :key="year">{{ year }}</option>
|
|
</select>
|
|
<div class="flex justify-center mt-10">
|
|
<button @click.prevent="generatepdf"
|
|
class=" mr-2 border border-yellow-600 text-yellow-600 font-montserrat py-2 px-8 font-medium rounded-xl hover:bg-yellow-600 hover:text-white transition-all duration-300"><i
|
|
class="fas fa-file-pdf mr-2"></i>PDF</button>
|
|
<button @click.prevent="generateview"
|
|
class="border border-yellow-600 text-yellow-600 font-montserrat py-2 px-8 font-medium rounded-xl hover:bg-yellow-600 hover:text-white transition-all duration-300"><i
|
|
class="fas fa-eye mr-2"></i>View</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
jenisgenerate: 'none',
|
|
kodcaw: '',
|
|
upcomingYears: []
|
|
}
|
|
},
|
|
mounted() {
|
|
this.calculateUpcomingYears();
|
|
},
|
|
methods: {
|
|
calculateUpcomingYears() {
|
|
const currentYear = new Date().getFullYear();
|
|
for (let i = 0; i <= 1; i++) {
|
|
this.upcomingYears.push(currentYear - i);
|
|
}
|
|
},
|
|
async generatepdf() {
|
|
await this.setJenis('pdf');
|
|
|
|
|
|
Vue.swal({
|
|
title: 'Memuatkan...',
|
|
allowEscapeKey: false,
|
|
allowOutsideClick: false,
|
|
showCancelButton: false,
|
|
showConfirmButton: false,
|
|
timer: 8000,
|
|
});
|
|
|
|
document.getElementById("formakru").submit();
|
|
},
|
|
async generateview() {
|
|
await this.setJenis('view');
|
|
|
|
|
|
Vue.swal({
|
|
title: 'Memuatkan...',
|
|
allowEscapeKey: false,
|
|
allowOutsideClick: false,
|
|
showCancelButton: false,
|
|
showConfirmButton: false,
|
|
timer: 8000,
|
|
});
|
|
|
|
document.getElementById("formakru").submit();
|
|
},
|
|
Urlredirect: function () {
|
|
return window.route('cetak.akrubulan')
|
|
},
|
|
setJenis: function (value) {
|
|
return this.jenisgenerate = value;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|