106 lines
3.8 KiB
PHP
106 lines
3.8 KiB
PHP
@extends('indexlayout')
|
|
|
|
@section('title', 'Dinas')
|
|
@push('style')
|
|
@endpush
|
|
@section('content')
|
|
<main id="js-page-content" role="main" class="page-content">
|
|
<ol class="breadcrumb page-breadcrumb">
|
|
<li class="breadcrumb-item"><a href="javascript:void(0);">Realisasi Kinerja & Anggaran </a></li>
|
|
<li class="breadcrumb-item">Kinerja</li>
|
|
<li class="breadcrumb-item">Kegiatan</li>
|
|
<li class="position-absolute pos-top pos-right d-none d-sm-block"><span class="js-get-date"></span></li>
|
|
</ol>
|
|
|
|
<div class="row">
|
|
<div class="col-xl-12">
|
|
<div id="panel-1" class="panel">
|
|
<div class="panel-hdr">
|
|
<h2>
|
|
Kegiatan
|
|
</h2>
|
|
</div>
|
|
<div class="panel-container show">
|
|
<div class="panel-content table">
|
|
|
|
<!-- datatable start -->
|
|
<main>
|
|
<div class="container">
|
|
<!-- Table -->
|
|
<table class="table">
|
|
<thead id="table-head"></thead>
|
|
<tbody id="table-body"></tbody>
|
|
</table>
|
|
<!-- Table -->
|
|
</div>
|
|
</main>
|
|
<!-- datatable end -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
@endsection
|
|
|
|
@push('script')
|
|
<script src="{{ asset('layout/dist/js/datagrid/datatables/datatables.bundle.js') }}"></script>
|
|
<script src="{{ asset('layout/dist/js/kegiatan.js') }}"></script>
|
|
<script type="text/javascript" src="js/mdb.min.js"></script>
|
|
<!-- Google API -->
|
|
<script src="https://apis.google.com/js/api.js"></script>
|
|
<!-- easyData -->
|
|
<script type="text/javascript" src="js/easyData-google-sheets.js"></script>
|
|
|
|
<!-- easyData - Creating table -->
|
|
<script>
|
|
{
|
|
{
|
|
// Your API KEY
|
|
const API_KEY = "";
|
|
|
|
function displayResult2(response) {
|
|
let tableHead = "";
|
|
let tableBody = "";
|
|
|
|
response.result.values.forEach((row, index) => {
|
|
if (index === 0) {
|
|
tableHead += "<tr>";
|
|
row.forEach((val) => (tableHead += "<th>" + val + "</th>"));
|
|
tableHead += "</tr>";
|
|
} else {
|
|
tableBody += "<tr>";
|
|
row.forEach((val) => (tableBody += "<td>" + val + "</td>"));
|
|
tableBody += "</tr>";
|
|
}
|
|
});
|
|
|
|
document.getElementById("table-head").innerHTML = tableHead;
|
|
document.getElementById("table-body").innerHTML = tableBody;
|
|
}
|
|
|
|
function loadData() {
|
|
// Spreadsheet ID
|
|
const spreadsheetId = "16iMJo0ZqSkdL9NHMIdl1mOz9_x0yVgZXwpGRsHyQycc";
|
|
const range = "A:Z";
|
|
getPublicValues({
|
|
spreadsheetId,
|
|
range
|
|
}, displayResult2);
|
|
}
|
|
|
|
window.addEventListener("load", (e) => {
|
|
initOAuthClient({
|
|
apiKey: API_KEY
|
|
});
|
|
});
|
|
|
|
document.addEventListener("gapi-loaded", (e) => {
|
|
loadData();
|
|
});
|
|
}
|
|
}
|
|
</script>
|
|
@endpush
|