{{with .More.JSONParams}}
<style type="text/css">
	#bill_param_setting{
		margin-top:20px;
	}
	#divOperate{
		padding-bottom:20px;
	}
	#tabFieldSettings th,#tabFieldSettings td{
		word-break:keep-all;
	}
	#edtTag {
		font-size:13px;
		border:1px solid #ccc; 
		height:200px;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }

</style>
<div id="bill_param_setting" class="bill-field" data-bill-fieldname="PARAMS">
	<div class="row">
		<div id="divOperate" class="col-md-6">
			<span>操作类型:</span>
			<div class="btn-group" data-toggle="buttons">
				<label class="btn btn-default {{if ($.Field "PARAMS").Readonly}}disabled{{end}}">
					<input type="radio" name="radOperate" autocomplete="off" value="add" > 新增
				</label>
				<label class="btn btn-default {{if ($.Field "PARAMS").Readonly}}disabled{{end}}">
					<input type="radio" name="radOperate" autocomplete="off" value="edit"> 修改
				</label>
				<label class="btn btn-default {{if ($.Field "PARAMS").Readonly}}disabled{{end}}">
					<input type="radio" name="radOperate" autocomplete="off" value="delete"> 删除
				</label>
				<label class="btn btn-default {{if ($.Field "PARAMS").Readonly}}disabled{{end}}">
					<input type="radio" name="radOperate" autocomplete="off" value="browse"> 查看
				</label>
			</div>
		</div>
		<div class="col-md-6 checkbox">
			<input type='checkbox' id="chkAllowClone" {{if ($.Field "PARAMS").Readonly}}disabled="disabled" tabindex="-1"{{end}}
				{{if .AllowClone}}checked="checked"{{end}}>
			<label for="chkAllowClone">允许克隆</label>
		</div>
	</div>
	<table id="tabFieldSettings" class="table table-striped table-condensed table-hover">
		<thead>
			<tr>
				<th style="width:5%">序号</th>
				<th style="width:20%">名称</th>
				<th style="width:15%">
					<div class="dropdown">
					  <button class="btn btn-default dropdown-toggle" type="button" id="ddm权限" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
						权限
					    <span class="caret"></span>
					  </button>
					  <ul class="dropdown-menu" aria-labelledby="ddm权限">
					    <li><a id="btn全部可操作" href="javascript:void(0)">可操作</a></li>
					    <li><a id="btn全部只读" href="javascript:void(0)">只读</a></li>
					    <li><a id="btn全部隐藏" href="javascript:void(0)">隐藏</a></li>
					  </ul>
					</div>
				</th>
				<th style="width:15%">
					<div class="dropdown">
					  <button class="btn btn-default dropdown-toggle" type="button" id="ddm填充时机" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
						填充时机
					    <span class="caret"></span>
					  </button>
					  <ul class="dropdown-menu" aria-labelledby="ddm填充时机">
					    <li><a id="btn全部不填充" href="#">不填充</a></li>
					    <li><a id="btn全部打开时" href="#">打开时</a></li>
					    <li><a id="btn全部保存时" href="#">保存时</a></li>
					  </ul>
					</div>
				</th>
				<th style="width:45%">填充值</th>
			</tr>
		<thread>
		<tbody>
			{{range $idx,$field :=.FieldSettings}}
			<tr>
				<td>{{inc $idx}}</td>
				<td class="tdFieldName">{{$field.Name}}</td>
				<td>
					<select class="select2 selVisibility" {{if ($.Field "PARAMS").Readonly}}disabled{{end}} style="width:100%">
						<option value="" {{if eq "" $field.Visibility}}selected="selected"{{end}}>可操作</option>
						<option value="readonly" {{if eq "readonly" $field.Visibility}}selected="selected"{{end}}>只读</option>
						<option value="hidden" {{if eq "hidden" $field.Visibility}}selected="selected"{{end}}>隐藏</option>
					</select>
				</td>
				<td>
					<select class="select2 selFillAt" {{if ($.Field "PARAMS").Readonly}}disabled{{end}} style="width:100%">
						<option value="0" {{if eq 0 $field.FillAt}}selected="selected"{{end}}>不填充</option>
						<option value="1" {{if eq 1 $field.FillAt}}selected="selected"{{end}}>打开时</option>
						<option value="2" {{if eq 2 $field.FillAt}}selected="selected"{{end}}>保存时</option>
					</select>
				</td>
				<td>
					<div class="input-group">
						<input type="text" class="form-control txtFill" value="{{$field.Fill}}" {{if ($.Field "PARAMS").Readonly}}readonly{{end}}>
						<div class="input-group-btn">
							<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">常用<span class="caret"></span></button>
							<ul class="dropdown-menu dropdown-menu-right">
								<li><a href="#" class="liOften" data-value="{{print "{{.User.Name}}"}}">用户名</a></li>
								<li><a href="#" class="liOften" data-value="{{print "{{.User.Dept.Code}}"}}">部门代码</a></li>
								<li><a href="#" class="liOften" data-value="{{print "{{.User.Dept.Name}}"}}">部门名称</a></li>
								<li><a href="#" class="liOften" data-value="{{print "{{datetime}}"}}">当前时间</a></li>
								<li><a href="#" class="liOften" data-value="{{print "{{date}}"}}">当前日期</a></li>
							</ul>
						</div><!-- /btn-group -->
					</div><!-- /input-group -->
				</td>
			</tr>
			{{end}}
		</tbody>
	</table>
	<p>附加参数:</p>
	<div id="edtTag"></div>
</div>
<script>

$("input[name='radOperate'][value='{{.Operate}}']").parent().addClass("active");
$("#bill_param_setting .select2").select2({minimumResultsForSearch: Infinity});
$(".liOften").click(function(){
	$(this).closest("td").find(".txtFill").val($(this).data("value"));
});
$("#bill_param_setting").data("oncollection",function(){
	return JSON.stringify({
		Operate:$("#divOperate .active>:input").val(),
		AllowClone:$("#chkAllowClone").prop("checked"),
		FieldSettings:$("#tabFieldSettings tbody tr").map(function(){
			return {
				Name:$(".tdFieldName",this).text(),
				Visibility:$(".selVisibility",this).val(),
				FillAt:parseInt($(".selFillAt",this).val()),
				Fill:$(".txtFill",this).val()
			}
		}).get(),
		Tag:edtTag.getValue()
	},null,"\t");
	
});
$("#btn全部可操作").click(function(){
	$(".selVisibility").val("").trigger("change");
});
$("#btn全部只读").click(function(){
	$(".selVisibility").val("readonly").trigger("change");
});
$("#btn全部隐藏").click(function(){
	$(".selVisibility").val("hidden").trigger("change");
});
$("#btn全部不填充").click(function(){
	$(".selFillAt").val("0").trigger("change");
});
$("#btn全部打开时").click(function(){
	$(".selFillAt").val("1").trigger("change");
});
$("#btn全部保存时").click(function(){
	$(".selFillAt").val("2").trigger("change");
});
var edtTag = ace.edit($("#edtTag")[0]);
edtTag.getSession().setMode("ace/mode/json");
edtTag.setValue({{.Tag}});
</script>
{{end}}