Skip to content

Instantly share code, notes, and snippets.

@blogcacanid

blogcacanid/index.php

Created April 17, 2020 07:29
Show Gist options
  • Save blogcacanid/ba9137333324612d4beb02f74238a589 to your computer and use it in GitHub Desktop.
Save blogcacanid/ba9137333324612d4beb02f74238a589 to your computer and use it in GitHub Desktop.
Download ZIP
index.php Covid-19 Vue.js - Dunia
Raw
index.php
<?php include '../_layouts/_head.php'; ?>
<body class="hold-transition sidebar-mini layout-fixed">
<div class="wrapper">
<!-- Navbar -->
<?php include '../_layouts/_navbar.php'; ?>
<!-- /.navbar -->
<!-- Main Sidebar Container -->
<?php include '../_layouts/_sidebar.php'; ?>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper" id="app">
<!-- Content Header (Page header) -->
<div class="content-header">
<div class="container-fluid">
<div class="row mb-2">
<div class="col-sm-6">
<h1 class="m-0 text-dark"><?php echo ucwords($uriSegments[2]); ?></h1>
</div><!-- /.col -->
<div class="col-sm-6">
<ol class="breadcrumb float-sm-right">
<li class="breadcrumb-item"><a href="#">Covid-19</a></li>
<li class="breadcrumb-item active"><?php echo ucwords($uriSegments[2]); ?></li>
</ol>
</div><!-- /.col -->
</div><!-- /.row -->
</div><!-- /.container-fluid -->
</div>
<!-- /.content-header -->
<!-- Main content -->
<section class="content">
<div class="container-fluid">
<!-- Small boxes (Stat box) -->
<!-- Info boxes -->
<div class="row">
<div class="col-12 col-sm-6 col-md-4">
<div class="info-box mb-4">
<span class="info-box-icon bg-warning elevation-1"><i class="fas fa-users"></i></span>
<div class="info-box-content">
<span class="info-box-text">CONFIRMED</span>
<span class="info-box-number">{{ sumConfirmed.value }}</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-12 col-sm-6 col-md-4">
<div class="info-box mb-4">
<span class="info-box-icon bg-success elevation-1"><i class="fas fa-smile"></i></span>
<div class="info-box-content">
<span class="info-box-text">RECOVERED</span>
<span class="info-box-number">{{ sumRecovered.value }}</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-12 col-sm-6 col-md-4">
<div class="info-box mb-4">
<span class="info-box-icon bg-danger elevation-1"><i class="fas fa-ambulance"></i></span>
<div class="info-box-content">
<span class="info-box-text">DEATHS</span>
<span class="info-box-number">{{ sumDeaths.value }}</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
<!-- Main row -->
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h3 class="card-title"><b>Sistem Informasi Penyebaran Corona (Covid-19) - <?php echo ucwords($uriSegments[2]); ?></b></h3>
</div>
<!-- /.card-header -->
<div class="card-body">
<table class="table table-bordered table-striped">
<thead>
<tr>
<th>Country/Region</th>
<th>Confirmed</th>
<th>Recovered</th>
<th>Deaths</th>
<th>Active</th>
</tr>
</thead>
<tbody>
<tr v-for="(detail, index) in details">
<td>{{ detail.attributes.Country_Region }}</td>
<td>{{ detail.attributes.Confirmed }}</td>
<td>{{ detail.attributes.Recovered }}</td>
<td>{{ detail.attributes.Deaths }}</td>
<td>{{ detail.attributes.Active }}</td>
</tr>
</tbody>
</table>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
</div>
<!-- /.row (main row) -->
</div><!-- /.container-fluid -->
</section>
<!-- /.content -->
</div>
<!-- /.content-wrapper -->
<!-- footer -->
<?php include '../_layouts/_footer.php'; ?>
</div>
<!-- ./wrapper -->
<!-- jQuery -->
<script src="../plugins/jquery/jquery.min.js"></script>
<!-- Bootstrap 4 -->
<script src="../plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- DataTables -->
<script src="../plugins/datatables/jquery.dataTables.min.js"></script>
<script src="../plugins/datatables-bs4/js/dataTables.bootstrap4.min.js"></script>
<script src="../plugins/datatables-responsive/js/dataTables.responsive.min.js"></script>
<script src="../plugins/datatables-responsive/js/responsive.bootstrap4.min.js"></script>
<!-- AdminLTE App -->
<script src="../dist/js/adminlte.min.js"></script>
<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="dunia.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment