csu3_am335x/EVSE/rootfs/var/www/set_backend.php

<?php
	ini_set('error_reporting', E_ALL | E_STRICT);
	$tag_header = 'set';
	include 'head.php';
	$obj = json_decode(trim($output[3]));//var_dump($obj);
	$OcppConnStatus='';
	switch ($obj->{'OcppConnStatus'}){
		case 0:
			$OcppConnStatus='disconnected';
			break;
		case 1:
			$OcppConnStatus='connected';
			break;
	}
?>

<style>
img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
</style>
	<div class="envor-content">
		<!--
		Page Title start
		//-->
		<section class="envor-page-title-1" data-stellar-background-ratio="0.5">
			<div class="container">
				<div class="row">
					<div class="col-lg-9 col-md-9 col-sm-9">
						<h1><?php echo $lang->showWord("backend"); ?></h1>
					</div>
				</div>
			</div>
		<!--
		Page Title end
		//-->
		</section>
		<!--
		Main Content start
		//-->
		<a id="loadinghref"><div id="loading" style="display:none;"><img src="img/giphy.gif"/></div></a>
		<section class="envor-section">
			<div class="container">
				<div class="row">
					<div class="col-lg-12">
						<div class="envor-sorting" id="faq-sorting">
							<div class="envor-toggle">
								<!--Common Information-->
								<article class="envor-sorting-item css">
									<header><?php echo $lang->showWord("common_information"); ?><i class="fa fa-plus"></i></header>
									<section>
										<div class="form-group" style="display:<?php echo $am101;?>">
											<label>Backend Connection Timeout</label>
											<input type="text" name="BackendConnTimeout" id="BackendConnTimeout" class="form-control" value="<?php echo $obj->{'BackendConnTimeout'};?>">
											<small class="form-text text-muted-red">seconds</small>
										</div>
										<div class="form-group" style="display:<?php echo $am101;?>">
											<label>Offline Policy</label>
											<select class="form-control" id="OfflinePolicy" name="OfflinePolicy">
												<option value="0" <?php echo $obj->{'OfflinePolicy'}=="0"?"selected":""?>>local list</option>
												<option value="1" <?php echo $obj->{'OfflinePolicy'}=="1"?"selected":""?>>Phihong RFID tag</option>
												<option value="2" <?php echo $obj->{'OfflinePolicy'}=="2"?"selected":""?>>free charging</option>
												<option value="3" <?php echo $obj->{'OfflinePolicy'}=="3"?"selected":""?>>no charging</option>
											</select>
										</div>
										<div class="form-group" style="display:<?php echo $am101;?>">
											<label>Offline Max Charge Energy</label>
											<small class="form-text text-muted-red">kWh</small>
											<input type="text" name="OfflineMaxChargeEnergy" id="OfflineMaxChargeEnergy" class="form-control" value="<?php echo $obj->{'OfflineMaxChargeEnergy'};?>">
										</div>
										<div class="form-group" style="display:<?php echo $am101;?>">
											<label>Offline Max Charge Duration</label>
											<small class="form-text text-muted-red">minutes</small>
											<input type="text" name="OfflineMaxChargeDuration" id="OfflineMaxChargeDuration" class="form-control" value="<?php echo $obj->{'OfflineMaxChargeDuration'};?>">
										</div>
									</section>
								</article>
								<!--OCPP Backend-->
								<article class="envor-sorting-item css">
									<header><?php echo $lang->showWord("OCPP_backend"); ?><i class="fa fa-plus"></i></header>
									<section>
										<div class="form-group" style="display:<?php echo $am101;?>">
											<label>Ocpp Connection Status</label>
											<input type="text" readonly class="form-control" placeholder="<?php echo $OcppConnStatus;?>">
											<input type="hidden" name="OcppConnStatus" id="OcppConnStatus" value="<?php echo $obj->{'OcppConnStatus'};?>">
										</div>
										<div class="form-group" style="display:<?php echo $am101;?>">
											<label>Central System URL</label>
											<input type="text" name="OcppServerURL" id="OcppServerURL" class="form-control" value="<?php echo $obj->{'OcppServerURL'};?>">
										</div>
										<div class="form-group" style="display:<?php echo $am101;?>">
											<label>Charge Box Id</label>
											<input type="text" name="ChargeBoxId" id="ChargeBoxId" class="form-control" value="<?php echo $obj->{'ChargeBoxId'};?>">
										</div>
										<div class="form-group" style="display:<?php echo $am101;?>">
											<label>Charge Point Vendor</label>
											<input type="text" name="chargePointVendor" id="chargePointVendor" class="form-control" value="<?php echo $obj->{'chargePointVendor'};?>">
										</div>
									</section>
								</article>
								<article class="envor-sorting-item css">
									<div align="center"><button id="save"><?php echo $lang->showWord("set")?></button></div>
								</article>
							</div>
						</div>
					</div>
				</div>
			</div>
		</section>
	</div>

<?php
	include 'foot.php';
?>

<script type="text/JavaScript">

	document.getElementById("save").onclick = function() {
		if(formCheck())
		{
			window.location="#loadinghref";
			document.getElementById("loading").style.display="block";
			// 發送 Ajax 查詢請求並處理
			var request = new XMLHttpRequest();
			request.open("POST", "set_backend_action.php");

			// POST 參數須使用 send() 發送
			var data =  "BackendConnTimeout=" + document.getElementById("BackendConnTimeout").value +
						"&OfflinePolicy=" + document.getElementById("OfflinePolicy").value +
						"&OfflineMaxChargeEnergy=" + document.getElementById("OfflineMaxChargeEnergy").value+
						"&OfflineMaxChargeDuration=" + document.getElementById("OfflineMaxChargeDuration").value+
//						"&OcppConnStatus=" + document.getElementById("OcppConnStatus").value+
						"&OcppServerURL=" + document.getElementById("OcppServerURL").value+
						"&ChargeBoxId=" + document.getElementById("ChargeBoxId").value+
						"&chargePointVendor=" + document.getElementById("chargePointVendor").value;
			
			// POST 請求必須設置表頭在 open() 下面，send() 上面
			request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
			request.send(data);

			request.onreadystatechange = function() {
				// 伺服器請求完成
				if (request.readyState == 4) {
					 document.getElementById("loading").style.display="none";
					// 伺服器回應成功
					if (request.status == 200 && JSON.parse(request.responseText).result=="Success") {
						alert("<?php echo $lang->showWord("done")?>");
						location.href="set_backend.php";
					} else {
						alert(JSON.parse(request.responseText).message);
					}
					request = null;
				}
			}
		}
	}
	
	function formCheck()
	{
		var OcppServerURL = document.getElementById("OcppServerURL").value;
		var ChargeBoxId = document.getElementById("ChargeBoxId").value;
		var chargePointVendor = document.getElementById("chargePointVendor").value;
		var tests=/^(ws|wss):\/\/((([0-9]{1,3}\.){3}[0-9]{1,3})|(([a-zA-Z0-9]+(([\-]?[a-zA-Z0-9]+)*\.)+)*[a-zA-Z]{2,}))+/;
		if(OcppServerURL!=""){
			if(OcppServerURL.match(tests)==null){
				alert("OcppServerURL format error!");
				document.getElementById("OcppServerURL").focus();
				return false;
			}
		}
		if(ChargeBoxId!=""){
			if(ChargeBoxId.length>25){
				alert("Length of ChargeBoxId should be less than 25!");
				document.getElementById("ChargeBoxId").focus();
				return false;
			}
		}
		if(chargePointVendor!=""){
			if(chargePointVendor.length>20){
				alert("Length of chargePointVendor should be less than 20!");
				document.getElementById("chargePointVendor").focus();
				return false;
			}
		}
		return true;
	}

	function isNumberKey(evt)
	{
		var charCode = (evt.which) ? evt.which : event.keyCode
		
		if (charCode > 31 && (charCode < 48 || charCode > 57) && (charCode != 46))
			return false;
		
		return true;
	}
	
</script>


</html>