<style type="text/css">#TimePara{visibility:hidden}span.to-time{display:inline-block;vertical-align:middle;line-height:28px;font-size:14px;color:#4f5356;padding-left:5px;padding-right:5px}div.time-btn{margin:45px auto 10px}div.time-reboot{width:410px;height:310px;overflow:hidden;border-radius:5px;background-color:#FFF;margin:210px auto;position:relative}div.time-err{position:absolute;margin:0 50px}i.close-btn{top:7px;right:10px}input.btn-time{width:292px;margin-left:0}li.text-time{width:94px}li.text-con span.select-time{width:60px;padding:0 14px}li.text-con span.set-time{width:118px}ul.sel-opts-ul{width:100%}li.option span{padding:0 6px}label.time-lbl{position:relative;margin-right:12px;width:80px;margin-left:0}span.set-con-time{width:212px}ul.set-time{margin:20px 0}</style>
<script type="text/javascript">
(function(){
	<%
		local para = {
			device = {info = {}},
			time_reboot = {config = {}}
		}
		local result = tpl_get_data(para, true)
	-%>
	var timeInfo = <%=result%>;
	var timeNotSync = ("" == timeInfo[K_MODULE].device.info.current_time);

	init(timeInfo);

	function init(result){
		var errNo = result[ERR_CODE];
		var ret;
		if (E_NONE == errNo){
			ret = result[K_MODULE];
		}else{
			console.log(result);
			return;
		}

		var info = ret.time_reboot.config;

		var rebootSwitch = info.enable;

		initSwitch("RebootSwitch", rebootSwitch, function(state){
			if (1 == state){
				$("#TimePara").css('visibility','visible');
			}else{
				$("#TimePara").css('visibility','hidden');
				$(".err-note").hide();
			}
		});

		var curHour = parseInt(info.reboot_hour, 10);
		var curMin = parseInt(info.reboot_minute, 10);
		var hourList = [];
		var hour;
		for (var i = 0; i < 24; i++){
			if (i.toString().length == 1){
				hour = "0" + i;
			}else{
				hour = i;
			}
			hourList.push({name : hour, value : i});
		}

		var minList = [];
		var min, val;
		for (var i = 0; i < 12; i++){
			if (i < 2){
				min = "0" + i * 5;
			}else{
				min = i * 5;
			}
			val = i * 5;
			minList.push({name : min, value : val});
		}

		initSelect("RebootHour", hourList, curHour);
		initSelect("RebootMin", minList, curMin);
	}

	$("#SaveTime").click(function(){
		var data = {};
		var para = {};
		para.time_reboot = {};
		para.time_reboot.config = data;

		data.enable = $("#RebootSwitch").attr("data-value");
		data.reboot_hour = $("#RebootHour").attr("data-value");
		data.reboot_minute = $("#RebootMin").attr("data-value");

		var thenSave = function (){
			apiSet(para, function(ret){
				var code = ret[ERR_CODE];
				if (E_NONE == code){
					$(".close-btn").click();
				}else{
					errHandle(code);
				}
			});
		};

		if ("1" == data.enable && timeNotSync){
			// ÍøÂçÊ±¼äÎ´Í¬²½
			showAlert(label.timingRebootTip, thenSave);
		}else{
			thenSave();
		}
	});

	function showNote(noteStr){
		$("#TimeErr").show();
		$("#TimeTip").html(noteStr);
	}

	function errHandle(code){
		switch(code){
		case E_NONE:
			break;
		default:
			showNote(errStr.unknownErr + code);
			break;
		}
		return true;
	}
})();
</script>
<div class="time-reboot">
	<p class="alert-title">{%label.timeRebootRouter%}</p>
	<i class="tip icon_close color-red close-btn"></i>
	<div class="set-con">
		<div class="time-switch">
			<ul class="set-con set-time">
				<li class="text-con">
					<label class="desc-lbl time-lbl">{%label.rebootSwitch%}</label>
					<span class="set-con-middle set-con-time">
						<span id="RebootSwitch" class="switch-short switch">
							<i class="switch-circle icon_select_off"></i>
						</span>
					</span>
				</li>
			</ul>
		</div>
		<div id="TimePara">
			<ul class="set-con set-time">
					<label class="desc-lbl time-lbl">{%label.rebootTime%}</label>
					<li class="text-con text-time">
						<span id="RebootHour" class="select select-time">
							<span class="value sel-value set-time"></span>
							<i class="tip icon_list-expansion"></i>
						</span>
					</li>
					<span class="to-time">{%label.colon%}</span>
					<li class="text-con text-time">
						<span id="RebootMin" class="select select-time">
							<span class="value sel-value"></span>
							<i class="tip icon_list-expansion"></i>
						</span>
					</li>
			</ul>
		</div>
		<div class="err-note hidden time-err" id="TimeErr">
			<i class="err-icon icon_remind_line"></i>
			<p class="note-str" id="TimeTip"></p>
		</div>
		<div class="btn-con time-btn">
			<input id="SaveTime" class="btn btn-time" type="button" value="{%btn.save%}" />
		</div>
	</div>
</div>