{$layout}
{$template "/left_menu_top"}

<div class="right-box without-tabbar">
	{$template "policy_menu"}

	<form method="post" class="ui form" data-tea-action="$" data-tea-success="success">
		<input type="hidden" name="cachePolicyId" :value="cachePolicy.id"/>
		<table class="ui table definition selectable">
			<tr>
				<td class="title">策略名称 *</td>
				<td><input type="text" name="name" maxlength="100" ref="focus" v-model="cachePolicy.name"/> </td>
			</tr>
			<tr>
				<td class="color-border">缓存类型 *</td>
				<td>
					<select class="ui dropdown auto-width" name="type" v-model="policyType">
						<option v-for="type in types" :value="type.type">{{type.name}}</option>
					</select>
				</td>
			</tr>

			<!-- 文件缓存选项 -->
			<tbody v-if="policyType == 'file'">
				<tr>
					<td class="color-border">缓存目录 *</td>
					<td>
						<input type="text" name="fileDir" maxlength="500" v-model="cachePolicy.options.dir"/>
						<p class="comment">存放文件缓存的目录，通常填写绝对路径。</p>
					</td>
				</tr>
			</tbody>


			<tr>
				<td>缓存最大容量</td>
				<td>
					<size-capacity-box :v-name="'capacityJSON'" :v-value="cachePolicy.capacity" :v-count="0" :v-unit="'gb'"></size-capacity-box>
					<p class="comment">允许缓存的最大内容长度，如果为0表示没有限制。</p>
				</td>
			</tr>
			<tr>
				<td colspan="2"><more-options-indicator></more-options-indicator></td>
			</tr>
			<tbody v-show="moreOptionsVisible">
				<tr>
					<td>最大内容长度</td>
					<td>
						<size-capacity-box :v-value="cachePolicy.maxSize" :v-name="'maxSizeJSON'" :v-count="32" :v-unit="'mb'"></size-capacity-box>
						<p class="comment">允许缓存的最大内容长度，如果为0表示没有限制。</p>
					</td>
				</tr>
				<tr>
					<td>容纳Key数量</td>
					<td>
						<input type="text" name="maxKeys" maxlength="10" style="width:10em" v-model="cachePolicy.maxKeys"/>
						<p class="comment">可以容纳多少数量的Key，0表示不限制。</p>
					</td>
				</tr>
				<tr>
					<td>描述</td>
					<td>
						<textarea maxlength="200" name="description" rows="3" v-model="cachePolicy.description"></textarea>
					</td>
				</tr>
				<tr>
					<td>是否启用</td>
					<td>
						<div class="ui checkbox">
							<input type="checkbox" name="isOn" value="1" v-model="cachePolicy.isOn"/>
							<label></label>
						</div>
					</td>
				</tr>
			</tbody>
		</table>
		<submit-btn></submit-btn>
	</form>
</div>