<!DOCTYPE HTML>
<html>
<head>
<#include "/adminPage/common.html"/>
<style type="text/css">

.long{
	width: 150px;
}

.short{
	width: 110px!important;
}

input[name='param']{
	width: 100px;
}
</style>
</head>
<body class="layui-layout-body">
	<div class="layui-layout layui-layout-admin">

		<#include "/adminPage/header.html"/>
		<#include "/adminPage/menu.html"/>

		<div class="layui-body">
			<!-- 内容主体区域 -->
			<div style="padding: 15px">
				<fieldset class="layui-elem-field layui-field-title">
					<legend>${menuStr.template}</legend>
				</fieldset>

				<form action="${ctx}/adminPage/template" id="searchForm" method="post">
					<div class="layui-form">
						<div class="layui-inline">
							<button type="button" class="layui-btn layui-btn-normal" onclick="add()">${templateStr.add}</button>
						</div>
					</div>
				</form>

				<table class="layui-table" style="table-layout:fixed; WORD-BREAK:break-all;">
					<thead>
						<tr>
							<th>${commonStr.name}</th>
							<th>${templateStr.paramCount}</th>
							<th>
								${templateStr.def}
							</th>
							<th>${commonStr.operation}</th>
						</tr>
					</thead>
					<tbody>
						<#list templateList as ext>
						<tr>
							<td>${ext.template.name}</td>
							<td>${ext.count}</td>
							<td>${ext.template.def}
								<#if ext.template.def == 'server'>
									${menuStr.server}
								</#if>
								<#if ext.template.def == 'location'>
									${menuStr.location}
								</#if>
								<#if ext.template.def == 'upstream'>
									${menuStr.upstream}
								</#if>
							
							</td>
							<td>
								<button class="layui-btn layui-btn-sm" onclick="edit('${ext.template.id}')">${commonStr.edit}</button>
								<button class="layui-btn layui-btn-danger layui-btn-sm" onclick="del('${ext.template.id}')">${commonStr.del}</button>
							</td>
						</tr>
						</#list>
					</tbody>
				</table>
			</div>
		</div>
	</div>

	<div style="height: 0px; width: 0px; overflow: hidden;">
		<!-- 弹出框 -->
		<div id="windowDiv" class="layui-form" style="display: none;padding: 15px;"> 
			<input type="hidden" id="id" name="id">
			
			<div class="layui-form-item">
				<label class="layui-form-label">${templateStr.name}</label>
				<div class="layui-input-inline">
					<input type="text" name="name" id="name" class="layui-input">
				</div>
				
				<label class="layui-form-label">${templateStr.def}</label>
				<div class="layui-input-inline">
					<select name="def" id="def">
						<option value="">${commonStr.null}</option>
						<option value="server">${menuStr.server}</option>
						<option value="location">${menuStr.location}</option>
						<option value="upstream">${menuStr.upstream}</option>
					</select>
				</div>
			</div>
			
			<div class="layui-form-item">
				<button type="button" class="layui-btn layui-btn-sm layui-btn-normal" onclick="addParam()">${templateStr.addParam}</button>
			</div>
			
		
			
			<div class="layui-form-item">
				<table class="layui-table">
					<thead>
						<tr>
							<th>${commonStr.name}</th>
							<th>${commonStr.value}</th>
							<th style="width: 170px;">${commonStr.operation}</th>
						</tr>
					</thead>
					<tbody id="paramList">

					</tbody>
				</table>
			</div>

			<div class="layui-form-item">
				<button type="button" class="layui-btn layui-btn-normal" onclick="addOver()">${commonStr.submit}</button>
				<button type="button" class="layui-btn" onclick="layer.closeAll()">${commonStr.close}</button>
			</div>
		</div>
		
	</div>

	<#include '/adminPage/script.html'/>
	<script src="${ctx}/js/adminPage/template/index.js?v=${jsrandom}" type="text/javascript"></script>
</body>


</html>