rachanon
/
stdbWeb
1
0
Fork 1
Code Issues Pull Requests Releases Activity
Browse Source

0.0.0.30.6

master
racha.non 9 years ago
parent
fe439b7d15
commit
c5087bc074
5 changed files with 244 additions and 217 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 22
      css/stdb.css
  2. 158
      index.html
  3. 87
      js/stdb.js
  4. 4
      login.html
  5. 158
      stdb.html

22
css/stdb.css
Unescape View File

@ -212,3 +212,25 @@ img{
border: 0px; border: 0px;
} }
/* Author :: Apirak */
/* Add cover image to display */
.box-left {
width: 20%;
height: 100%;
display: inline-table;
}
.box-right {
/*float: right;*/
width: 80%;
height: 100%;
display: inline-table;
}
img.cover-img {
width: 120px;
height: 120px;
margin-top: -2%;
margin-left: 1%;
}
/* End */

158
index.html
Unescape View File

@ -3,161 +3,45 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<!-- <meta name="viewport"
content="width=device-width, initial-scale=1, user-scalable=0, maximum-scale=1, minimum-scale=1"> -->
<title>Login Form</title> <title>Login Form</title>
<link rel="stylesheet" href="css/style.css">
<link rel="shortcut icon" type="image/png" href="https://avatars1.githubusercontent.com/u/17867603?v=3&s=200"/>
<script src="js/jquery-3.0.0.min.js"></script>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script type="text/javascript" src="js/materialize.min.js"></script>
<script type="text/javascript" src="js/jwtDecode.min.js"></script>
<script type="text/javascript" src="js/stdb.js"></script>
<link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection"/> <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"/> <link type="text/css" rel="stylesheet" href="css/stdb.css" media="screen,projection"/>
<link rel="shortcut icon" type="image/png" href="https://avatars1.githubusercontent.com/u/17867603?v=3&s=200"/>
<script src="js/jquery-3.0.0.min.js"></script>
<!--[if lt IE 9]><script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]--> <!--[if lt IE 9]><script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<style> <style>
</style>
</head>
<body>
<div>
<ul class="titleIn">
<center>
<li><a href="javascript:history.go(0)" class="active">Instrument</a></li>
<li style="float:right;font-size:18px"><a onClick="LogoutPage()">Logout</a></li>
<li style="float:right;font-size:18px"><a onClick="modalItem('add')">Add Instrument</a></li>
<li style="float:right;"><a class="material-icons" onclick="modalItem('search')" style="color:#FFF;">search</a></li>
</center>
</ul>
</div>
<div class="boxShow">
<div id="nameOrgan" class="flexCenter" style="margin-top:120px;font-size:40px;color:#F0F0F0"></div>
</div>
<div class="boxShow">
<!-- like -->
<div style="margin-top:20px;">
<li class="cardData" >
<div>
<i class="medium material-icons " style="">thumb_up</i>
<div class="flexCenter" style="font-size:18px;" id='like'></div>
<div style="font-size:14px;color:#868686" id='like'>(Last 7 day)</div>
</div>
</li> html {
<!-- status --> height: 100%;
<li class="cardData" > }
<div>
<i class="medium material-icons " style="color:#4CAF50">trending_up</i>
<div class="flexCenter" style="font-size:18px;" id='status'></div>
<div style="font-size:14px;color:#868686" id='like'>(Last 7 day)</div>
</div>
</li>
<!-- accountActive -->
<li class="cardData" >
<div>
<i class="medium material-icons " style="">people</i>
<div class="flexCenter" style="font-size:18px;" id='accountActive'></div>
<div style="font-size:14px;color:#868686" id='like'>(Last 7 day)</div>
</div>
</li>
<!-- equipment -->
<li class="cardData" style="width: 300px;display:block;" >
<center><h1 style="font-size:18px;margin-top:10px;margin-bottom:15px">อุปกรณ์</h1></center>
<div class="flexCenterSpace">
<i class="medium material-icons ">featured_play_list</i>
<i class="medium material-icons ">photo</i>
</div>
<div class="flexCenterSpace" style="margin-top:-3px;">
<i style='margin-right:15px'>ทั้งหมด</i>
<i style='margin-right:10px'>มีรูป</i>
</div>
<div class="flexCenterSpace" style="margin-top:-5px;">
<i id="numAll" style='margin-right:15px'></i>
<i id="numPhoto" style='margin-right:10px'></i>
</div>
</li> body {
</div> min-height: 100%;
</div> }
a:active {
-webkit-text-fill-color: #000000;
-webkit-text-stroke-width: 2px;
-webkit-text-stroke-color: #000000;
}
</style>
</head>
<div id="card" class="container" style="max-width:800px"></div>
<div id="modalAll" ></div> <body class="flexCenter" style="background-color:#0ca3d2;">
<div id="more" class="container" style="max-width:800px;height:80px"> </div >
<div id="modaladd" class="modal" style="max-height: 100%;display: none;padding-top:10px;"> <div >
<div class="modal-content cardStyle" >
<div class="flexCenter">
<div class="flexCenter bgImage">
<div class="flexCenter">
<img id="myImg0add" src="" alt=""/>
<div class="bgImage flexCenter"><h2>ไม่มีรูปภาพ</h2></div>
</div>
<div class="column bgMiniImage" style="margin-left:10px">
<img id="myImg1add" class="miniImage" src="" alt=""/>
<h6 class="miniImage flexCenter" >ไม่มีรูปภาพ</h6>
<img id="myImg2add" class="miniImage" src="" alt=""/>
<h6 class="miniImage flexCenter" >ไม่มีรูปภาพ</h6>
<img id="myImg3add" class="miniImage" style="margin-top:5px" src="" alt=""/>
<h6 class="miniImage flexCenter" style="margin-top:5px">ไม่มีรูปภาพ</h6>
</div>
</div>
</div>
<div class="flexCenter" style="margin-top:5px;">
<div class="upload flexCenter">
<a style="font-size:18px">Upload</a></div>
<input type="file" name="upload" onclick="uploadImage('add')"/>'
</div>'
<div>
<div style="font-size:20px;margin-top:10px">ชื่อครุภัณฑ์วิทยาศาสตร์</div>
<div style="font-size:16px;margin-top:5px;margin-left:5px"><input type="text" id="nameI" name="nameI" value="" placeholder="ชื่อครุภัณฑ์วิทยาศาสตร์"></div>
</div>
<div> <div>
<div style="font-size:20px;margin-top:10px">จุดประสงค์การใช้งาน</div> <a href="login.html" style="font-size:100px;color:#F0F0F0;" >LOGIN</a>
<div style="font-size:16px;margin-top:5px;margin-left:5px"><input type="text" id="noteI" name="noteI" value="" placeholder="จุดประสงค์การใช้งาน"></div> <h style="font-size:200px;color:#F0F0F0;" >|</h>
</div> <a href="stat.html" style="font-size:100px;color:#F0F0F0;" >STAT</a>
<div>
<div style="font-size:20px;margin-top:10px">เลขครุภัณฑ์</div>
<div style="font-size:16px;margin-top:5px;margin-left:5px"><input type="text" id="idI" name="idI" value="" placeholder="เลขครุภัณฑ์"></div>
</div>
<div>
<div style="font-size:20px;margin-top:10px">ผู้ดูแล</div>
<div style="font-size:16px;margin-top:5px;margin-left:5px"><input type="text" id="CrI" name="CrI" value="" placeholder="ชื่อ นามสกุล"></div>
</div>
<div class="flexCenterSpace" style="margin-top:20px">
<input type="button" onclick="addData('add')" class="buttonUpdate" value="Add">
<input type="button" onclick="backData('add')" class="buttonBack" value="Back">
</div>
</div> </div>
</div> </div>
<div id="modalsearch" class="modal" style="max-height: 100%;display: none;padding-top:100px;">
<div class="modal-content cardStyle" >
<div>
<input type="text" class="cardSearch" id="searchId" value="" placeholder="Search">
<div class="flexEnd">
<button class="buttonSearch flexCenter" onclick="searchItem('search')">
<a class="material-icons" style="color:#FFF;">search</a>
</button>
</div>
</div>
</div>
</div>
</body> </body>
<script language="javascript"> <script language="javascript">
function searchItem(idSearch){
var modal = document.getElementById('modal'+idSearch);
modal.style.display = "none";
getUser('search')
}
</script> </script>
</html> </html>

87
js/stdb.js
Unescape View File

@ -8,8 +8,6 @@ var nextUrl = ''
htmlText = '' htmlText = ''
var dataUri = [] var dataUri = []
console.log('Welcome to Web STDB')
function getStartPage(){ function getStartPage(){
sesToken = sessionStorage.getItem('token'); sesToken = sessionStorage.getItem('token');
if( sesToken === null){ if( sesToken === null){
@ -87,7 +85,7 @@ function getUser(status){
token = sessionStorage.getItem("token") token = sessionStorage.getItem("token")
var searchText = '' var searchText = ''
if (status === 'search'){ if (status === 'search'){
// console.log("search") console.log("search")
dataInstrument = [] dataInstrument = []
searchText = '&search='+document.getElementById("searchId").value searchText = '&search='+document.getElementById("searchId").value
start = 0 start = 0
@ -96,12 +94,12 @@ function getUser(status){
htmlText = ''; htmlText = '';
modalText = ''; modalText = '';
dataInstrument = []; dataInstrument = [];
// console.log(' >> end of search button'); console.log(' >> end of search button');
// console.log(dataInstrument) console.log(dataInstrument)
// console.log($('#card').html()); console.log($('#card').html());
} }
var url = 'http://www.serv.stdb.most.go.th/api/v2/instrument/?organization='+respone.organizations[0].id+searchText; var url = 'http://www.serv.stdb.most.go.th/api/v2/instrument/?organization='+respone.organizations[0].id+searchText;
// console.log('url = ' + url) console.log('url = ' + url)
$.ajax({ $.ajax({
type: "GET", type: "GET",
url: url, url: url,
@ -122,7 +120,7 @@ function getUser(status){
function getDataStat(respone){ function getDataStat(respone){
getUser('first'); getUser('first');
// console.log(respone) // console.log(respone)
document.getElementById("like").innerHTML = respone.items.completed document.getElementById("like").innerHTML = '0'
document.getElementById("status").innerHTML = '+'+respone.items.recent_update document.getElementById("status").innerHTML = '+'+respone.items.recent_update
document.getElementById("accountActive").innerHTML = respone.users.active document.getElementById("accountActive").innerHTML = respone.users.active
document.getElementById("numAll").innerHTML = respone.items.all document.getElementById("numAll").innerHTML = respone.items.all
@ -131,28 +129,35 @@ function getDataStat(respone){
function getData(respone) { function getData(respone) {
// console.log(dataInstrument) // console.log(dataInstrument)
// console.log(respone) console.log(respone)
// console.log("---------------- Next") console.log("---------------- Next")
// console.log(respone.next) console.log(respone.next)
// console.log(respone.results) // console.log(respone.results)
// console.log(dataInstrument) console.log(dataInstrument)
dataInstrument = dataInstrument.concat(respone.results) dataInstrument = dataInstrument.concat(respone.results)
// console.log('*******ฬฬฬฬฬฬฬฬฬ*********') console.log('*******ฬฬฬฬฬฬฬฬฬ*********')
// console.log(respone.results) console.log(respone.results)
var htmlText = '' var htmlText = ''
var modalText = '' var modalText = ''
for (i=start;i<dataInstrument.length;i++ ){ for (i=start;i<dataInstrument.length;i++ ){
// console.log('========='+i+'==========') console.log('========='+i+'==========')
// console.log(dataInstrument[i].name) // console.log(dataInstrument[i].name)
htmlText = htmlText+"<div id='"+i.toString()+"'' class='cardStyle' onclick='modalItem("+i.toString()+")'>" htmlText = htmlText+"<div id='"+i.toString()+"'' class='cardStyle' onclick='modalItem("+i.toString()+")'>"
// Author :: Apirak
+'<div class="box-left">'
+'<img src="'+dataInstrument[i].clips[0].photo+'" class="cover-img">'
+'</div>'// end of left
+'<div class="box-right">'
+'<h3 style="font-size:26px;margin-left:20px " >'+dataInstrument[i].name+'</h3>' +'<h3 style="font-size:26px;margin-left:20px " >'+dataInstrument[i].name+'</h3>'
+'<h3 style="color:#9E9E9E;font-size:22px;margin-left:20px " >#'+dataInstrument[i].custom_id+'</h3>' +'<h3 style="color:#9E9E9E;font-size:22px;margin-left:20px " >#'+dataInstrument[i].custom_id+'</h3>'
+'<h3 style="color:#9E9E9E;font-size:22px;margin-left:20px " >@'+dataInstrument[i].caretaker+'</h3>' +'<h3 style="color:#9E9E9E;font-size:22px;margin-left:20px " >@'+dataInstrument[i].caretaker+'</h3>'
+'</div>'// end of right
// End
+'</div>'; +'</div>';
// console.log(dataInstrument[i].clips.length) console.log(dataInstrument[i].clips.length)
if(dataInstrument[i].clips.length === 0){ if(dataInstrument[i].clips.length === 0){
// console.log('========= = 0 =========') console.log('========= = 0 =========')
imageTag = '<div class="flexCenter">' imageTag = '<div class="flexCenter">'
+'<div class="flexCenter bgImage">' +'<div class="flexCenter bgImage">'
+'<div class="flexCenter">' +'<div class="flexCenter">'
@ -178,7 +183,7 @@ function getData(respone) {
else{ else{
var style4 = '' var style4 = ''
if(dataInstrument[i].clips.length >= 2){ if(dataInstrument[i].clips.length >= 2){
// console.log('*********** >= 2 ***********') console.log('*********** >= 2 ***********')
var tagMiniImage = '' var tagMiniImage = ''
var loopImage = dataInstrument[i].clips.length var loopImage = dataInstrument[i].clips.length
if (loopImage > 4){ if (loopImage > 4){
@ -202,7 +207,7 @@ function getData(respone) {
} }
} }
else{ else{
// console.log('*********** < 2 ***********') console.log('*********** < 2 ***********')
var tagMiniImage = '' var tagMiniImage = ''
for(j=1;j<4;j++){ for(j=1;j<4;j++){
if (j==3){ if (j==3){
@ -318,11 +323,11 @@ function uploadImage(idImage) {
$(":file").change(function () { $(":file").change(function () {
if (this.files && this.files[0] && check===0) { if (this.files && this.files[0] && check===0) {
var reader = new FileReader(); var reader = new FileReader();
// console.log(reader) console.log(reader)
reader.onload = function(e) { reader.onload = function(e) {
instrument = dataInstrument[parseInt(idImage)] instrument = dataInstrument[parseInt(idImage)]
// console.log(instrument) console.log(instrument)
// console.log('-------------xxxx-------------') console.log('-------------xxxx-------------')
var uriAdd = [{'uri':e.target.result}]; var uriAdd = [{'uri':e.target.result}];
dataUri = dataUri.concat(uriAdd); dataUri = dataUri.concat(uriAdd);
if(idImage == 'add'){ if(idImage == 'add'){
@ -334,22 +339,22 @@ function uploadImage(idImage) {
$('#myImg'+idImg+''+idImage).attr('src', dataInstrument[idImage].clips[idImg].photo); $('#myImg'+idImg+''+idImage).attr('src', dataInstrument[idImage].clips[idImg].photo);
} }
} }
// console.log(idImage) console.log(idImage)
var dataUriSort = dataUri var dataUriSort = dataUri
idloopImage = loopImage idloopImage = loopImage
if(loopImage==0){ if(loopImage==0){
idloopImage = 0 idloopImage = 0
} }
var idUri = 0 var idUri = 0
// console.log(dataUri) console.log(dataUri)
// console.log(loopImage-1) console.log(loopImage-1)
// console.log(idloopImage+dataUri.length) console.log(idloopImage+dataUri.length)
for(idImg=loopImage;idImg<idloopImage+dataUri.length;idImg++){ for(idImg=loopImage;idImg<idloopImage+dataUri.length;idImg++){
$('#myImg'+idImg+''+idImage).attr('src', dataUri[idUri].uri); $('#myImg'+idImg+''+idImage).attr('src', dataUri[idUri].uri);
idUri += 1 idUri += 1
} }
// console.log('---------------------------') console.log('---------------------------')
// console.log(dataUri) console.log(dataUri)
check += 1 check += 1
}; };
reader.readAsDataURL(this.files[0]); reader.readAsDataURL(this.files[0]);
@ -375,9 +380,9 @@ function addData(){
if(dataUri.length != 0){ if(dataUri.length != 0){
data.clips = dataUri data.clips = dataUri
} }
// console.log(data) console.log(data)
data = JSON.stringify(data) data = JSON.stringify(data)
// console.log(data) console.log(data)
token = sessionStorage.getItem('token') token = sessionStorage.getItem('token')
$.ajax({ $.ajax({
type: "POST", type: "POST",
@ -389,7 +394,7 @@ function addData(){
'Authorization': 'Bearer ' + token, 'Authorization': 'Bearer ' + token,
}, },
success: function(respone){ success: function(respone){
// console.log(respone) console.log(respone)
window.location.reload(true); window.location.reload(true);
}, },
dataType: 'json' dataType: 'json'
@ -397,10 +402,10 @@ function addData(){
} }
function updateData(idData){ function updateData(idData){
// console.log(document.getElementById("name"+idData)) console.log(document.getElementById("name"+idData))
// console.log(document.getElementById("note"+idData)) console.log(document.getElementById("note"+idData))
// console.log(document.getElementById("id"+idData)) console.log(document.getElementById("id"+idData))
// console.log(document.getElementById("cr"+idData)) console.log(document.getElementById("cr"+idData))
dataUpdate = { dataUpdate = {
'name':document.getElementById("name"+idData).value, 'name':document.getElementById("name"+idData).value,
'note':document.getElementById("note"+idData).value, 'note':document.getElementById("note"+idData).value,
@ -421,7 +426,7 @@ function updateData(idData){
'Authorization': 'Bearer ' + token, 'Authorization': 'Bearer ' + token,
}, },
success: function(respone){ success: function(respone){
// console.log(respone) console.log(respone)
window.location.reload(true); window.location.reload(true);
}, },
dataType: 'json' dataType: 'json'
@ -442,7 +447,7 @@ function deleteData(idData){
'Authorization': 'Bearer ' + token, 'Authorization': 'Bearer ' + token,
}, },
success: function(respone){ success: function(respone){
// console.log(respone) console.log(respone)
window.location.reload(true); window.location.reload(true);
}, },
dataType: 'json' dataType: 'json'
@ -465,12 +470,12 @@ function removeImage(idData){
else{ else{
var time = new Date() var time = new Date()
var loopImage = dataInstrument[idData].clips.length var loopImage = dataInstrument[idData].clips.length
// console.log(dataInstrument[idData]) console.log(dataInstrument[idData])
for(j=0;j<loopImage;j++){ for(j=0;j<loopImage;j++){
// console.log('#myImg'+j+''+idData) console.log('#myImg'+j+''+idData)
document.getElementById("myImg"+j+''+idData).src = dataInstrument[idData].clips[j].photo+'?'+time; document.getElementById("myImg"+j+''+idData).src = dataInstrument[idData].clips[j].photo+'?'+time;
// console.log(document.getElementById("myImg"+j+''+idData).src) console.log(document.getElementById("myImg"+j+''+idData).src)
// console.log(document.getElementById("myImg"+j+''+idData)) console.log(document.getElementById("myImg"+j+''+idData))
} }
} }

4
login.html
Unescape View File

@ -72,7 +72,7 @@
} }
} }
else{ else{
window.location.href = 'index.html'; window.location.href = 'stdb.html';
} }
} }
@ -80,7 +80,7 @@
sessionStorage.getItem('token',tokenrespone.token); sessionStorage.getItem('token',tokenrespone.token);
try { try {
if( tokenrespone.token === token ){ if( tokenrespone.token === token ){
window.location.href = 'index.html'; window.location.href = 'stdb.html';
// console.log('go to page'); // console.log('go to page');
// console.log(tokenrespone.token); // console.log(tokenrespone.token);
} }

158
stdb.html
Unescape View File

@ -3,45 +3,161 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<!-- <meta name="viewport"
content="width=device-width, initial-scale=1, user-scalable=0, maximum-scale=1, minimum-scale=1"> -->
<title>Login Form</title> <title>Login Form</title>
<link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection"/> <link rel="stylesheet" href="css/style.css">
<link type="text/css" rel="stylesheet" href="css/stdb.css" media="screen,projection"/>
<link rel="shortcut icon" type="image/png" href="https://avatars1.githubusercontent.com/u/17867603?v=3&s=200"/> <link rel="shortcut icon" type="image/png" href="https://avatars1.githubusercontent.com/u/17867603?v=3&s=200"/>
<script src="js/jquery-3.0.0.min.js"></script> <script src="js/jquery-3.0.0.min.js"></script>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script type="text/javascript" src="js/materialize.min.js"></script>
<script type="text/javascript" src="js/jwtDecode.min.js"></script>
<script type="text/javascript" src="js/stdb.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"/>
<!--[if lt IE 9]><script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]--> <!--[if lt IE 9]><script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<style> <style>
html {
height: 100%;
}
body { </style>
min-height: 100%;
}
a:active {
-webkit-text-fill-color: #000000;
-webkit-text-stroke-width: 2px;
-webkit-text-stroke-color: #000000;
}
</style>
</head> </head>
<body>
<div>
<ul class="titleIn">
<center>
<li><a href="javascript:history.go(0)" class="active">Instrument</a></li>
<li style="float:right;font-size:18px"><a onClick="LogoutPage()">Logout</a></li>
<li style="float:right;font-size:18px"><a onClick="modalItem('add')">Add Instrument</a></li>
<li style="float:right;"><a class="material-icons" onclick="modalItem('search')" style="color:#FFF;">search</a></li>
</center>
</ul>
</div>
<div class="boxShow">
<div id="nameOrgan" class="flexCenter" style="margin-top:120px;font-size:40px;color:#F0F0F0"></div>
</div>
<div class="boxShow">
<!-- like -->
<div style="margin-top:20px;">
<li class="cardData" >
<div>
<i class="medium material-icons " style="">thumb_up</i>
<div class="flexCenter" style="font-size:18px;" id='like'></div>
<div style="font-size:14px;color:#868686" id='like'>(Last 7 day)</div>
</div>
</li>
<!-- status -->
<li class="cardData" >
<div>
<i class="medium material-icons " style="color:#4CAF50">trending_up</i>
<div class="flexCenter" style="font-size:18px;" id='status'></div>
<div style="font-size:14px;color:#868686" id='like'>(Last 7 day)</div>
</div>
</li>
<!-- accountActive -->
<li class="cardData" >
<div>
<i class="medium material-icons " style="">people</i>
<div class="flexCenter" style="font-size:18px;" id='accountActive'></div>
<div style="font-size:14px;color:#868686" id='like'>(Last 7 day)</div>
</div>
</li>
<!-- equipment -->
<li class="cardData" style="width: 300px;display:block;" >
<center><h1 style="font-size:18px;margin-top:10px;margin-bottom:15px">อุปกรณ์</h1></center>
<div class="flexCenterSpace">
<i class="medium material-icons ">featured_play_list</i>
<i class="medium material-icons ">photo</i>
</div>
<div class="flexCenterSpace" style="margin-top:-3px;">
<i style='margin-right:15px'>ทั้งหมด</i>
<i style='margin-right:10px'>มีรูป</i>
</div>
<div class="flexCenterSpace" style="margin-top:-5px;">
<i id="numAll" style='margin-right:15px'></i>
<i id="numPhoto" style='margin-right:10px'></i>
</div>
</li>
</div>
</div>
<div id="card" class="container" style="max-width:800px"></div>
<body class="flexCenter" style="background-color:#0ca3d2;"> <div id="modalAll" ></div>
<div id="more" class="container" style="max-width:800px;height:80px"> </div >
<div > <div id="modaladd" class="modal" style="max-height: 100%;display: none;padding-top:10px;">
<div class="modal-content cardStyle" >
<div class="flexCenter">
<div class="flexCenter bgImage">
<div class="flexCenter">
<img id="myImg0add" src="" alt=""/>
<div class="bgImage flexCenter"><h2>ไม่มีรูปภาพ</h2></div>
</div>
<div class="column bgMiniImage" style="margin-left:10px">
<img id="myImg1add" class="miniImage" src="" alt=""/>
<h6 class="miniImage flexCenter" >ไม่มีรูปภาพ</h6>
<img id="myImg2add" class="miniImage" src="" alt=""/>
<h6 class="miniImage flexCenter" >ไม่มีรูปภาพ</h6>
<img id="myImg3add" class="miniImage" style="margin-top:5px" src="" alt=""/>
<h6 class="miniImage flexCenter" style="margin-top:5px">ไม่มีรูปภาพ</h6>
</div>
</div>
</div>
<div class="flexCenter" style="margin-top:5px;">
<div class="upload flexCenter">
<a style="font-size:18px">Upload</a></div>
<input type="file" name="upload" onclick="uploadImage('add')"/>'
</div>'
<div>
<div style="font-size:20px;margin-top:10px">ชื่อครุภัณฑ์วิทยาศาสตร์</div>
<div style="font-size:16px;margin-top:5px;margin-left:5px"><input type="text" id="nameI" name="nameI" value="" placeholder="ชื่อครุภัณฑ์วิทยาศาสตร์"></div>
</div>
<div> <div>
<a href="login.html" style="font-size:100px;color:#F0F0F0;" >LOGIN</a> <div style="font-size:20px;margin-top:10px">จุดประสงค์การใช้งาน</div>
<h style="font-size:200px;color:#F0F0F0;" >|</h> <div style="font-size:16px;margin-top:5px;margin-left:5px"><input type="text" id="noteI" name="noteI" value="" placeholder="จุดประสงค์การใช้งาน"></div>
<a href="stat.html" style="font-size:100px;color:#F0F0F0;" >STAT</a> </div>
<div>
<div style="font-size:20px;margin-top:10px">เลขครุภัณฑ์</div>
<div style="font-size:16px;margin-top:5px;margin-left:5px"><input type="text" id="idI" name="idI" value="" placeholder="เลขครุภัณฑ์"></div>
</div>
<div>
<div style="font-size:20px;margin-top:10px">ผู้ดูแล</div>
<div style="font-size:16px;margin-top:5px;margin-left:5px"><input type="text" id="CrI" name="CrI" value="" placeholder="ชื่อ นามสกุล"></div>
</div>
<div class="flexCenterSpace" style="margin-top:20px">
<input type="button" onclick="addData('add')" class="buttonUpdate" value="Add">
<input type="button" onclick="backData('add')" class="buttonBack" value="Back">
</div>
</div> </div>
</div> </div>
<div id="modalsearch" class="modal" style="max-height: 100%;display: none;padding-top:100px;">
<div class="modal-content cardStyle" >
<div>
<input type="text" class="cardSearch" id="searchId" value="" placeholder="Search">
<div class="flexEnd">
<button class="buttonSearch flexCenter" onclick="searchItem('search')">
<a class="material-icons" style="color:#FFF;">search</a>
</button>
</div>
</div>
</div>
</div>
</body> </body>
<script language="javascript"> <script language="javascript">
function searchItem(idSearch){
var modal = document.getElementById('modal'+idSearch);
modal.style.display = "none";
getUser('search')
}
</script> </script>
</html> </html>

Write Preview
Loading…
Cancel
Save