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.
298 lines
8.6 KiB
298 lines
8.6 KiB
<!DOCTYPE html>
|
|
|
|
<html>
|
|
<!-- 主頁header -->
|
|
<?php
|
|
/*--- 處理session ----*/
|
|
include "include-session-security.php"; #確認session
|
|
/*--- 處理session ----*/
|
|
|
|
$id_schedule = $_GET["id_schedule"];
|
|
|
|
require_once "db/database.php"; # 載入db.php來連結資料庫
|
|
|
|
# 從資料庫取出jason並轉成array
|
|
$sql_query = "SELECT * FROM schedule where id = '$id_schedule'";
|
|
$data = mysqli_query($link, $sql_query);
|
|
foreach($data as $data){
|
|
$item = $data['item'];
|
|
$item_detail = $data['item_detail'];
|
|
$result = $data['result'];
|
|
}
|
|
|
|
$actualdate = $data['actualdate'];
|
|
#print_r("$item");
|
|
#print_r("$result");
|
|
|
|
$item_arr = json_decode($item,true); //加上 true 才會轉成陣列
|
|
$item_detail_arr = json_decode($item_detail,true); //加上 true 才會轉成陣列
|
|
$result_arr = json_decode($result,true); //加上 true 才會轉成陣列
|
|
|
|
$baditems = count($result_arr) - array_sum($result_arr);
|
|
|
|
/*
|
|
$i=count($result_arr);
|
|
for($j=0 ; $j<$i ; $j++){
|
|
echo "[" . $item_arr[$j] . "][" . $item_detail_arr[$j] . "][" . $result_arr[$j] . "]";
|
|
echo "<br>";
|
|
}
|
|
*/
|
|
|
|
include "include-header.php";
|
|
|
|
?>
|
|
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
|
|
<script src="js/jquery-2.1.4.min.js"></script>
|
|
<script type="text/javascript" src="js/index.js"></script>
|
|
<!-- <script type="text/javascript" src="js/html2canvas-0.4.1.js"></script> -->
|
|
<script type="text/javascript" src="js/html2canvas.min-1.js"></script>
|
|
<script type="text/javascript" src="js/jspdf.min.js"></script>
|
|
<script language="JavaScript" type="text/javascript" src="js/jSignature.min.js"></script>
|
|
|
|
<title>手写签名</title>
|
|
|
|
<style type="text/css">
|
|
|
|
#canvasDiv{
|
|
border:1px dotted #000;
|
|
}
|
|
|
|
.star-rater .star {
|
|
font-size: 2rem;
|
|
color: gray;
|
|
}
|
|
</style>
|
|
|
|
|
|
<body id="bb">
|
|
|
|
<br><br>
|
|
<div id="pdfContainer" class="container" style="background-color:#fff">
|
|
<div class="pageTitle bg-primary text-light">業主評價</div>
|
|
|
|
<!-- App Capsule -->
|
|
<div id="appCapsule">
|
|
<form name = "fileForm" action="app-maintenance-uploadsuccess-surveyupload.php" method="post">
|
|
|
|
<div class="tab-pane" id="sounds" role="tabpanel">
|
|
|
|
<div class="section full mt-1">
|
|
<div class="wide-block pt-2 pb-2">
|
|
|
|
<a class="item">保養日期： <?php echo $actualdate; ?> </a>
|
|
<?php
|
|
if ($baditems > 0){
|
|
echo "<span style='color:orange';>(有" . $baditems . "項問題)</span>";
|
|
}
|
|
else{
|
|
echo "<span style='color:blue';>Good!</span>";
|
|
}
|
|
?>
|
|
<!-- <span class="badge badge-primary">Good</span> -->
|
|
<!-- <span class="badge badge-danger">1</span> -->
|
|
<!-- <span class="badge badge-warning">1</span> -->
|
|
</a>
|
|
<!-- sub menu -->
|
|
<ul class="listview simple-listview">
|
|
<?php
|
|
$i=count($result_arr);
|
|
for($j=0 ; $j<$i ; $j++){
|
|
if ($result_arr[$j] == 0){
|
|
echo "<li style='color:orange';>" . ($j + 1) . $item_detail_arr[$j]. "</li>";
|
|
}
|
|
else{
|
|
echo "<li >" . ($j + 1) . $item_detail_arr[$j]. "</li>";
|
|
}
|
|
}
|
|
?>
|
|
</ul>
|
|
<!-- * sub menu-->
|
|
|
|
<div class="form-group boxed">
|
|
<div class="input-wrapper">
|
|
<label class="label" for="name5">星級評價</label>
|
|
<!-- 星級評價 -->
|
|
<?php
|
|
include "include-5starts.php";
|
|
?>
|
|
<!-- *星級評價 -->
|
|
<!--
|
|
<div class="rate-block mb-1">
|
|
<ion-icon name="star" class="active"></ion-icon>
|
|
<ion-icon name="star" class="active"></ion-icon>
|
|
<ion-icon name="star" class="active"></ion-icon>
|
|
<ion-icon name="star" class="active"></ion-icon>
|
|
<ion-icon name="star"></ion-icon>
|
|
</div>
|
|
-->
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<!--
|
|
<div class="form-group boxed">
|
|
<div class="input-wrapper">
|
|
<label class="label" for="name5">姓名</label>
|
|
<input type="text" class="form-control" id="name5" placeholder="Enter your name">
|
|
<i class="clear-input">
|
|
<ion-icon name="close-circle"></ion-icon>
|
|
</i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group boxed">
|
|
<div class="input-wrapper">
|
|
<label class="label" for="email5">E-mail</label>
|
|
<input type="email" class="form-control" id="email5" placeholder="E-mail address">
|
|
<i class="clear-input">
|
|
<ion-icon name="close-circle"></ion-icon>
|
|
</i>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group boxed">
|
|
<div class="input-wrapper">
|
|
<label class="label" for="phone5">聯絡電話</label>
|
|
<input type="tel" class="form-control card-body" id="phone5" placeholder="Enter your phone number">
|
|
<i class="clear-input">
|
|
<ion-icon name="close-circle"></ion-icon>
|
|
</i>
|
|
</div>
|
|
</div>
|
|
-->
|
|
|
|
|
|
<label class="label" for="signature5">業主簽名</label>
|
|
<!-- <input style="height:200px;" class="form-control card-body" id="signature5" placeholder="請在此處簽名"> -->
|
|
<div id="canvasDiv"></div>
|
|
<img id="qmimg"/>
|
|
<input type="hidden" value="" id="data_of_base64" name="data_of_base64">
|
|
<input type="hidden" value="<?php echo $id_schedule; ?>" id="id_schedule" name="id_schedule">
|
|
<input type="hidden" value="<?php echo $token; ?>" id="token" name="token">
|
|
|
|
<!--
|
|
<div class="">
|
|
<button type="submit" class="btn btn-primary btn-block btn-lg">確定</button>
|
|
</div>
|
|
-->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- * sounds tab -->
|
|
</form>
|
|
|
|
</div>
|
|
<!-- * App Capsule -->
|
|
|
|
|
|
</div>
|
|
|
|
<div class="section mt-1">
|
|
<button id="btn_clear">重簽</button>
|
|
<button id="btn_confirm">確定</button>
|
|
<button id="downloadPdf">下载</button>
|
|
</div>
|
|
|
|
<script type="text/javascript" src="js/drawWord.js"></script>
|
|
<script type="module" src="js/main.js"></script>
|
|
<script type="text/javascript">
|
|
/* var canvasDiv = document.getElementById('canvasDiv');
|
|
var canvas = document.createElement('canvas');
|
|
var canvasWidth = 1191;
|
|
var canvasHeight=670; */
|
|
|
|
/*
|
|
document.addEventListener( 'touchmove', onDocumentTouchMove, false );
|
|
var point = {};
|
|
point.notFirst = false;
|
|
canvas.setAttribute('width', canvasWidth);
|
|
canvas.setAttribute('height', canvasHeight);
|
|
canvas.setAttribute('id', 'canvas');
|
|
canvasDiv.appendChild(canvas);
|
|
if(typeof G_vmlCanvasManager != 'undefined') {
|
|
canvas = G_vmlCanvasManager.initElement(canvas);
|
|
}
|
|
|
|
var clickX = new Array();
|
|
var clickY = new Array();
|
|
var clickDrag = new Array();
|
|
var paint;
|
|
*/
|
|
|
|
$(document).ready(function() {
|
|
//$("#canvasDiv").jSignature({"decor-color":"transparent", "width":"300px", "height":"300px"})
|
|
|
|
//一開始"提交下一頁"與"下載"要隱藏
|
|
$("#downloadPdf").hide();
|
|
|
|
//var $sigdiv1 = $("#canvasDiv").jSignature({'UndoButton':false});
|
|
var $sigdiv1 = $("#canvasDiv").jSignature({'decor-color':'transparent', 'width':'295px', 'height':'300px','UndoButton':false});
|
|
|
|
//重写
|
|
$("#btn_clear").click( function() {
|
|
$("#canvasDiv").jSignature("reset");
|
|
//$("#signature1").innerHTML = '';
|
|
});
|
|
|
|
//確定則存base64內容與顯示圖案
|
|
var dataURL = {};
|
|
$('#btn_confirm').click(function(){
|
|
// Get response of type image
|
|
var data1 = $sigdiv1.jSignature('getData', 'image');
|
|
// Storing in textarea (存base64內容)
|
|
$('#data_of_base64').val(data1);
|
|
// Alter image source (顯示圖案)
|
|
$('#qmimg').attr('src',"data:"+data1);
|
|
$("#canvasDiv").hide(); //canvasDiv是畫布，要hide才能不讓繼續簽名
|
|
$("#btn_clear").hide(); //btn_clear是控制重簽，要hide才能不讓繼續簽名
|
|
$('#qmimg').show(); //qmimg 要設定show才行
|
|
$("#btn_confirm").hide(); //btn_clear是控制重簽，要hide才能不讓繼續簽名
|
|
//$('#qmimg').hide();
|
|
//document.fileForm.submit(); /* 整個頁面submit */
|
|
html2canvas(document.querySelector("#pdfContainer")).then(canvas => {
|
|
//document.body.appendChild(canvas); #放在圖下面
|
|
|
|
//console.log(canvas.toDataURL());
|
|
dataURL = canvas.toDataURL();
|
|
post_data(dataURL);
|
|
});
|
|
});
|
|
|
|
//下載圖案
|
|
$('#downloadPdf').click(function(){
|
|
$("#data_of_base64").attr("value",canvas.toDataURL("image/png")); /* 取canvas base64的值放到id="data_of_base64"的input中 */
|
|
});
|
|
|
|
|
|
function post_data(imageURL){
|
|
//console.log(imageURL);
|
|
var id_schedule = <?php echo $id_schedule; ?>;
|
|
$.ajax({
|
|
url: "save_data.php",
|
|
type: "POST",
|
|
data: {image: imageURL, pid: id_schedule},
|
|
dataType: "html",
|
|
success: function() {
|
|
//alert('Success!!');
|
|
//location.reload();
|
|
}
|
|
});
|
|
};
|
|
|
|
|
|
});
|
|
</script>
|
|
|
|
</body>
|
|
|
|
</html>
|
|
|
|
|
|
|
|
|
|
|
|
|