|
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
|
<html lang="en">
|
|
|
|
|
|
<head>
|
|
|
|
|
|
<meta charset="utf-8">
|
|
|
|
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
|
|
|
|
<title>Traffy STDB Stat</title>
|
|
|
|
|
|
<link rel="shortcut icon" type="image/png" href="https://avatars1.githubusercontent.com/u/17867603?v=3&s=200"/>
|
|
|
|
|
|
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
|
|
|
|
|
<script src="js/jquery-3.0.0.min.js"></script>
|
|
|
|
|
|
<script type="text/javascript" src="js/materialize.min.js"></script>
|
|
|
|
|
|
<link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection"/>
|
|
|
|
|
|
<link type="text/css" rel="stylesheet" href="css/stdb.css" media="screen,projection"/>
|
|
|
|
|
|
<style>
|
|
|
|
|
|
|
|
|
|
|
|
html {
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
body {
|
|
|
|
|
|
min-height: 100%;
|
|
|
|
|
|
}
|
|
|
|
|
|
a:active {
|
|
|
|
|
|
-webkit-text-fill-color: #000000;
|
|
|
|
|
|
-webkit-text-stroke-width: 2px;
|
|
|
|
|
|
-webkit-text-stroke-color: #000000;
|
|
|
|
|
|
}
|
|
|
|
|
|
.column {
|
|
|
|
|
|
-webkit-flex-direction: column;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
float: left;
|
|
|
|
|
|
}
|
|
|
|
|
|
.column li {
|
|
|
|
|
|
background: deepskyblue;
|
|
|
|
|
|
}
|
|
|
|
|
|
.flex-container {
|
|
|
|
|
|
padding: 0;
|
|
|
|
|
|
margin: 0;
|
|
|
|
|
|
list-style: none;
|
|
|
|
|
|
|
|
|
|
|
|
-ms-box-orient: horizontal;
|
|
|
|
|
|
display: -webkit-box;
|
|
|
|
|
|
display: -moz-box;
|
|
|
|
|
|
display: -ms-flexbox;
|
|
|
|
|
|
display: -moz-flex;
|
|
|
|
|
|
display: -webkit-flex;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<body class="flexCenter" style="background-color:#0ca3d2;">
|
|
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<div style="max-width:800px;color:#F0F0F0;">
|
|
|
|
|
|
<div class="flexCenter">
|
|
|
|
|
|
<h1>หน่วยงานทั้งหมด</h1>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div id="organiz" style="max-width:800px"></div>
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</body>
|
|
|
|
|
|
<script language="javascript">
|
|
|
|
|
|
function getStatAll(){
|
|
|
|
|
|
urlStat = 'http://expert.traffy.xyz/api/v2/organization/stats/'
|
|
|
|
|
|
console.log(urlStat)
|
|
|
|
|
|
$.ajax({
|
|
|
|
|
|
type: "GET",
|
|
|
|
|
|
url: urlStat,
|
|
|
|
|
|
success: getData,
|
|
|
|
|
|
dataType: 'json',
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function getData(respone){
|
|
|
|
|
|
console.log(respone)
|
|
|
|
|
|
var htmlText = ''
|
|
|
|
|
|
for (i=0;i<respone.length;i++ ){
|
|
|
|
|
|
htmlText = htmlText+"<div class='cardStyle' style='width:800px;height:200px'>"
|
|
|
|
|
|
+"<h3 style='font-size:26px;margin-left:20px '>"+respone[i].organization.name+' ('+respone[i].organization.abbv_en+') '+"</h3>"
|
|
|
|
|
|
+"<div class='flexCenterSpace'>"
|
|
|
|
|
|
+"<div class='flex-container column flexCenter'>"
|
|
|
|
|
|
+"<i class='medium material-icons ' style=''>thumb_up</i>"
|
|
|
|
|
|
+"<i class='' style=''>ข้อมูลครบ</i>"
|
|
|
|
|
|
+"<i class='' style=''>"+respone[i].items.completed+"</i>"
|
|
|
|
|
|
+"</div>"
|
|
|
|
|
|
+"<div class='flex-container column flexCenter'>"
|
|
|
|
|
|
+"<i class='medium material-icons ' style=''>trending_up</i>"
|
|
|
|
|
|
+"<i class='' style=''>ข้อมูลอัพเดท</i>"
|
|
|
|
|
|
+"<i class='' style=''>"+respone[i].items.recent_update+"</i>"
|
|
|
|
|
|
+"</div>"
|
|
|
|
|
|
+"<div class='flex-container column flexCenter'>"
|
|
|
|
|
|
+"<i class='medium material-icons ' style=''>featured_play_list</i>"
|
|
|
|
|
|
+"<i class='' style=''>ทั้งหมด</i>"
|
|
|
|
|
|
+"<i class='' style=''>"+respone[i].items.all+"</i>"
|
|
|
|
|
|
+"</div>"
|
|
|
|
|
|
+"<div class='flex-container column flexCenter'>"
|
|
|
|
|
|
+"<i class='medium material-icons ' style=''>photo</i>"
|
|
|
|
|
|
+"<i class='' style=''>มีรูป</i>"
|
|
|
|
|
|
+"<i class='' style=''>"+respone[i].items.photos+"</i>"
|
|
|
|
|
|
+"</div>"
|
|
|
|
|
|
+"</div>"
|
|
|
|
|
|
+"</div>"
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
document.getElementById("organiz").innerHTML = htmlText
|
|
|
|
|
|
}
|
|
|
|
|
|
getStatAll()
|
|
|
|
|
|
</script>
|
|
|
|
|
|
</html>
|
