You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
371 lines
11 KiB
371 lines
11 KiB
<!doctype html>
|
|
<html lang="en">
|
|
|
|
<!-- 主頁header -->
|
|
<?php
|
|
|
|
|
|
/*--- 處理session ----*/
|
|
include "include-session-security.php"; #確認session
|
|
/*--- 處理session ----*/
|
|
|
|
$id_schedule = $_REQUEST["id_schedule"];
|
|
|
|
/*
|
|
$contractno = $_POST['contractno'];
|
|
$facilityno = $_POST['facilityno'];
|
|
$combono = $_POST['combono'];
|
|
*/
|
|
|
|
$item = array();
|
|
$item_detail = array();
|
|
$result = array();
|
|
|
|
|
|
# Get到所有的item, item_description, result
|
|
include "include-function-allparts.php"; //產生$item, $item_detail, result
|
|
#$item = get_maintenance_item($combono, $data);
|
|
#$item_detail = get_maintenance_item_detail($combono, $data);
|
|
#$result = get_maintenance_result($combono, $data);
|
|
|
|
# Get到所有的item, item_description, result
|
|
#include "include-function.php"; //產生$item, $item_detail, result
|
|
#$item = get_maintenance_item($combono, $data);
|
|
#$item_detail = get_maintenance_item_detail($combono, $data);
|
|
#$result = get_maintenance_result($combono, $data);
|
|
|
|
/*
|
|
include "include-function-byparts.php"; //產生$item, $item_detail, result
|
|
$item = get_maintenance_item($combono);
|
|
$item_detail = get_maintenance_item_detail($combono);
|
|
$result = get_maintenance_result($combono);
|
|
*/
|
|
|
|
|
|
#print_r($item);
|
|
#echo "<br>";
|
|
#print_r($item_detail);
|
|
#echo "<br>";
|
|
#print_r($result);
|
|
#echo "<br>";
|
|
|
|
/*
|
|
$i=count($result);
|
|
for($j=0 ; $j<$i ; $j++){
|
|
echo "[" . $item[$j] . "][" . $item_detail[$j] . "][" . $result[$j] . "]";
|
|
echo "<br><br>";
|
|
}
|
|
*/
|
|
|
|
include "include-header.php";
|
|
$actualdate = date('Y/m/d H:i:s');
|
|
|
|
/*
|
|
$result = json_encode($result); #轉成json格式
|
|
$item = json_encode($item); #轉成json格式
|
|
$item_detail = urldecode(json_encode($item_detail)); #轉成json格式，利用urldecode確保進入資料庫是正確的中文。(GET時有特別urlencode過)
|
|
require_once "db/database.php"; # 載入db.php來連結資料庫
|
|
$sql_query = "UPDATE schedule set item = '$item', item_detail = '$item_detail', result = '$result', actualdate = '$actualdate' WHERE id='$id_schedule'";
|
|
mysqli_query($link, $sql_query);
|
|
*/
|
|
|
|
?>
|
|
|
|
<style type="text/css" media="screen">
|
|
.outer {
|
|
width:250px;
|
|
height:20px;
|
|
box-sizing: border-box;
|
|
border: 1px solid #ddd; <!-- 外框顏色 -->
|
|
padding: 1px;
|
|
border-radius: 3px;
|
|
}
|
|
.inner {
|
|
width:0%;
|
|
height:20px;
|
|
background-color: #7cc7ee;
|
|
}
|
|
</style>
|
|
|
|
<!-- * 主頁header -->
|
|
|
|
<body class="bg-white">
|
|
|
|
<!-- loader -->
|
|
<div id="loader">
|
|
<div class="spinner-border text-primary" role="status"></div>
|
|
</div>
|
|
<!-- * loader -->
|
|
|
|
<!-- App Header -->
|
|
<!-- <div class="appHeader no-border transparent position-absolute"> -->
|
|
<div class="appHeader bg-primary text-light">
|
|
<!--
|
|
<div class="left">
|
|
<a href="javascript:;" class="headerButton goBack">
|
|
<ion-icon name="chevron-back-outline"></ion-icon>
|
|
</a>
|
|
</div>
|
|
-->
|
|
<div class="pageTitle">檔案上傳</div>
|
|
<!--
|
|
<div class="right">
|
|
</div>
|
|
-->
|
|
</div>
|
|
<!-- * App Header -->
|
|
|
|
<!-- App Capsule -->
|
|
<div id="appCapsule">
|
|
<div class="login-form">
|
|
<div class="section">
|
|
|
|
<h1>請上傳照片</h1>
|
|
|
|
<div class="section mt-3 mb-3">
|
|
<div class="card">
|
|
<div class="card-body d-flex justify-content-between align-items-end">
|
|
<div>
|
|
<h5 class="card-title mb-0 d-flex align-items-center justify-content-between">
|
|
保養前
|
|
</h5>
|
|
|
|
<form id="form1" enctype="multipart/form-data">
|
|
<table>
|
|
<tr>
|
|
<td>
|
|
<input id="input1" type="file" name="my_file[]" multiple>
|
|
<input type = "hidden" name="id_schedule" value="<?php echo $id_schedule; ?>">
|
|
<input type = "hidden" name="photo_tag" value="<?php echo "before"; ?>">
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</form>
|
|
<br>
|
|
|
|
<div>
|
|
<div class="inner"><input id="button1" type="button" value="提交"></div>
|
|
</div>
|
|
<br>
|
|
|
|
<!-- 進度條外殼 -->
|
|
<div class="outer">
|
|
<!-- 進度條 -->
|
|
<div id="inner1" class="inner"></div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-------------------------下一個--------------------->
|
|
|
|
<div class="section mt-3 mb-3">
|
|
<div class="card">
|
|
<div class="card-body d-flex justify-content-between align-items-end">
|
|
<div>
|
|
<h5 class="card-title mb-0 d-flex align-items-center justify-content-between">
|
|
保養後
|
|
</h5>
|
|
|
|
<form id="form2" enctype="multipart/form-data">
|
|
<table>
|
|
<tr>
|
|
<td>
|
|
<input id="input2" type="file" name="my_file[]" multiple>
|
|
<input type = "hidden" name="id_schedule" value="<?php echo $id_schedule; ?>">
|
|
<input type = "hidden" name="photo_tag" value="<?php echo "after"; ?>">
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</form>
|
|
<br>
|
|
|
|
<div>
|
|
<div class="inner"><input id="button2" type="button" value="提交"></div>
|
|
</div>
|
|
<br>
|
|
|
|
<!-- 進度條外殼 -->
|
|
<div class="outer">
|
|
<!-- 進度條 -->
|
|
<div id="inner2" class="inner"></div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-------------------------下一個--------------------->
|
|
|
|
<div class="section mt-3 mb-3">
|
|
<div class="card">
|
|
<button type="button" class="btn btn-outline-primary" onclick="window.location.href='app-maintenance-uploadsuccess-photo-review.php?id_schedule=<?php echo $id_schedule; ?>&token=<?php echo $token; ?>'">
|
|
<ion-icon name="document-text-outline"></ion-icon>
|
|
查看上傳檔案
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- * App Capsule -->
|
|
|
|
|
|
<script type="text/javascript">
|
|
// 獲取form表單
|
|
var form1 = document.getElementById("form1");
|
|
// 獲取提交鍵
|
|
var submit1 = document.getElementById("button1");
|
|
// 獲取進度條
|
|
// var inner = document.querySelector(".inner");
|
|
var inner1 = document.getElementById("inner1");
|
|
// 為提交鍵設置事件
|
|
submit1.onclick = function(){
|
|
var files = document.getElementById("input1").files; //獲取選擇的檔案物件
|
|
var allowTypes = ["image/jpeg","image/png","image/x-png","image/bmp","image/gif"]; //允許上傳的檔案型別
|
|
var maxFileSize = 2 * 1024 * 1024; //允許上傳的單個檔案的大小限制，最大能上傳50M
|
|
var allowUpload = true; //經過校驗之後是否允許上傳
|
|
var errorMessage = ""; //校驗檔案之後，檔案不符合要求的提示資訊
|
|
|
|
for(var i=0; i< files.length; i++){
|
|
var fileName = files[i].name; //檔名
|
|
var fileType = files[i].type; //檔案型別
|
|
var fileSize = files[i].size; //檔案大小，單位為byte（位元組）
|
|
|
|
var typeAccepted = false;
|
|
for(var j = 0; j < allowTypes.length; j++){
|
|
if(allowTypes[j] == fileType){
|
|
typeAccepted = true;
|
|
break;
|
|
}
|
|
}
|
|
if(typeAccepted != true){
|
|
errorMessage += fileName + "不是圖片，只能上傳圖片！";
|
|
allowUpload = false;
|
|
}
|
|
|
|
if(typeAccepted && fileSize > maxFileSize){
|
|
errorMessage += fileName+"的檔案大小超出了2M！";
|
|
allowUpload = false;
|
|
}
|
|
}
|
|
|
|
if(allowUpload != true){
|
|
//el.outerHTML = el.outerHTML; //清空選擇的檔案
|
|
alert(errorMessage);
|
|
} else {
|
|
// 利用FormData快速格式化form表單
|
|
var formObj = new FormData(form1);
|
|
// 創建xhr對象
|
|
var xhr = new XMLHttpRequest();
|
|
// 設置上傳方式和網址
|
|
xhr.open('post','app-maintenance-uploadsuccess-file_upload-document-save.php');
|
|
// 因為FormData已經格式化好了，所以不用設置請求頭了
|
|
// xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
|
|
// 每當上傳進度變化時就觸發progress事件，改變進度條長度
|
|
xhr.upload.onprogress = function(e){
|
|
// 398為進度條最大長度
|
|
inner1.style.width = ((e.loaded / e.total) * 250) + 'px';
|
|
//inner1.style.width = ((e.loaded / e.total) * 100) + '%';
|
|
}
|
|
// 發送請求，將格式化后的form表單作為發送主體
|
|
xhr.send(formObj);
|
|
}
|
|
|
|
}
|
|
|
|
//--------------下一個--------------------
|
|
|
|
// 獲取form表單
|
|
var form2 = document.getElementById("form2");
|
|
// 獲取提交鍵
|
|
var submit2 = document.getElementById("button2");
|
|
// 獲取進度條
|
|
// var inner = document.querySelector(".inner");
|
|
var inner2 = document.getElementById("inner2");
|
|
// 為提交鍵設置事件
|
|
submit2.onclick = function(){
|
|
var files = document.getElementById("input2").files; //獲取選擇的檔案物件
|
|
var allowTypes = ["image/jpeg","image/png","image/x-png","image/bmp","image/gif"]; //允許上傳的檔案型別
|
|
var maxFileSize = 2 * 1024 * 1024; //允許上傳的單個檔案的大小限制，最大能上傳50M
|
|
var allowUpload = true; //經過校驗之後是否允許上傳
|
|
var errorMessage = ""; //校驗檔案之後，檔案不符合要求的提示資訊
|
|
|
|
for(var i=0; i< files.length; i++){
|
|
var fileName = files[i].name; //檔名
|
|
var fileType = files[i].type; //檔案型別
|
|
var fileSize = files[i].size; //檔案大小，單位為byte（位元組）
|
|
|
|
var typeAccepted = false;
|
|
for(var j = 0; j < allowTypes.length; j++){
|
|
if(allowTypes[j] == fileType){
|
|
typeAccepted = true;
|
|
break;
|
|
}
|
|
}
|
|
if(typeAccepted != true){
|
|
errorMessage += fileName + "不是圖片，只能上傳圖片！";
|
|
allowUpload = false;
|
|
}
|
|
|
|
if(typeAccepted && fileSize > maxFileSize){
|
|
errorMessage += fileName+"的檔案大小超出了2M！";
|
|
allowUpload = false;
|
|
}
|
|
}
|
|
|
|
if(allowUpload != true){
|
|
//el.outerHTML = el.outerHTML; //清空選擇的檔案
|
|
alert(errorMessage);
|
|
} else {
|
|
// 利用FormData快速格式化form表單
|
|
var formObj = new FormData(form2);
|
|
// 創建xhr對象
|
|
var xhr = new XMLHttpRequest();
|
|
// 設置上傳方式和網址
|
|
xhr.open('post','app-maintenance-uploadsuccess-file_upload-document-save.php');
|
|
// 因為FormData已經格式化好了，所以不用設置請求頭了
|
|
// xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
|
|
// 每當上傳進度變化時就觸發progress事件，改變進度條長度
|
|
xhr.upload.onprogress = function(e){
|
|
// 398為進度條最大長度
|
|
inner2.style.width = ((e.loaded / e.total) * 250) + 'px';
|
|
//inner1.style.width = ((e.loaded / e.total) * 100) + '%';
|
|
}
|
|
// 發送請求，將格式化后的form表單作為發送主體
|
|
xhr.send(formObj);
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
<!-- 主頁頁尾 -->
|
|
<?php
|
|
include "include-footer.php";
|
|
mysqli_close($link); #代表結束連線
|
|
?>
|
|
<!-- * 主頁頁尾 -->
|
|
|
|
|
|
<!-- 主頁頁尾按鈕 -->
|
|
<?php
|
|
#include "include-bottom-menu.php";
|
|
?>
|
|
<!-- * 主頁頁尾按鈕 -->
|
|
|
|
|
|
<!-- ///////////// Js Files //////////////////// -->
|
|
<!-- Jquery -->
|
|
<?php
|
|
include "include-jsfiles.php";
|
|
?>
|
|
|
|
|
|
</body>
|
|
|
|
</html>
|