<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<dynamic>" %>
<style type="text/css">
	#appMenuForm table
	{
		margin: 0 auto;
	}
	#appMenuForm table th
	{
		font-weight: normal;
	}
</style>
 <% switch ((int)Session["isCN"]){case 1: %>
    <script type="text/javascript" src="/Scripts/en-US.js"></script>
    <% break; case 2: %>
    <script type="text/javascript" src="/Scripts/zh-TW.js"></script>
    <% break;default: %>
    <script type="text/javascript" src="/Scripts/zh-CN.js"></script>
    <% break; } %>
<table id="dgAppMenu" class="easyui-datagrid" style="width: 100%; height: auto;"
	data-options="
			toolbar: '#tbAppMenu',
			border: false,
			singleSelect: true,
			rownumbers: true,
			striped: true,
			fit: true,
			fitColumns: true,
			idField: 'ID',
			method: 'POST',
            url: '/MobileApp/LoadMenus/',
			queryParams: { type:0},
            onDblClickRow: function(index, row) { editAppMenu(row); }
		">
	<thead>
		<tr>
			<th data-options="field:'Name',sortable:true,width:30,resizable:false">
				<%: Html.Language("MenuName")%>
			</th>
			<th data-options="field:'EnglishName',sortable:true,width:100,resizable:false">
				<%: Html.Language("EnglishName")%>
			</th>
			<th data-options="field:'Icon',sortable:true,align:'center',formatter:iconFormatter,resizable:false">
				<%: Html.Language("Icon")%>
			</th>
			<th data-options="field:'Sort',sortable:true,align:'center',resizable:false">
				<%: Html.Language("Sort")%>
			</th>
			<th data-options="field:'ActiveIndicator',sortable:true,align:'center',resizable:false,formatter:function(val){return val ? '<%: Html.Language("Yes")%>':'<%: Html.Language("No")%>';}">
				<%: Html.Language("StartUsing")%>
			</th>
		</tr>
	</thead>
</table>
<div id="tbAppMenu">
	<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-reload',plain:true"
		onclick="$('#dgAppMenu').datagrid('reload')">
		<%: Html.Language("Refresh")%></a> 
	<a href="javascript:void(0)" class="easyui-linkbutton"
			data-options="iconCls:'icon-edit',plain:true" onclick="editAppMenu();">
			<%: Html.Language("Edit")%></a>
</div>
<div id="dialog" class="easyui-window"   style="padding: 5px; width: 300px; height: 250px;"
	data-options="
		closed: true,
		modal: true,
		collapsible: false,
		minimizable: false,
		maximizable: false
	">
	<div class="easyui-panel dlg-content" style="margin-bottom: 5px;">
		<form id="appMenuForm" class="easyui-form" method="post" data-options="novalidate:true"
		enctype="multipart/form-data">
		<input type="hidden" id="hfID" name="ID" value="0" />
		<table cellspacing="5px">
			<tr>
				<th>
					<label for="txtName">
						<%: Html.Language("MenuName")%></label>
				</th>
				<td>
					<input class="easyui-validatebox textbox text" id="txtName" name="Name" data-options="required:true" />
				</td>
			</tr>
			<tr>
				<th>
					<label for="txtEnglishName">
						<%: Html.Language("EnglishName")%></label>
				</th>
				<td>
					<input class="easyui-validatebox textbox text" id="txtEnglishName" name="EnglishName"
						data-options="required:false" />
				</td>
			</tr>
			<tr>
				<th>
					<label for="txtIcon">
						<%: Html.Language("Icon")%></label>
				</th>
				<td>
					<input class="easyui-filebox" name="Icon" data-options="buttonText:lang.Browse" />
				</td>
			</tr>
			<tr>
				<th>
					<label for="txtSort">
						<%: Html.Language("Sort")%></label>
				</th>
				<td>
					<input class="easyui-numberspinner textbox text" id="txtSort" name="Sort" data-options="min:1"
						value="1" data-options="required:true" />
				</td>
			</tr>
			<tr>
				<th>
					<label for="chkActiveIndicator">
						<%: Html.Language("StartUsing")%></label>
				</th>
				<td>
					<label>
						<input type="radio" id="rad1" name="ActiveIndicator" value="true" />
						<%: Html.Language("Yes")%></label>&nbsp;<label><input id="rad2" type="radio" name="ActiveIndicator"
							value="false" /><%: Html.Language("No")%></label>
				</td>
			</tr>
		</table>
		</form>
	</div>
	<div class="dlg-footer" style="text-align: right; padding: 5px 5px 0 0;">
		<a class="easyui-linkbutton dlg-btn-save" data-options="iconCls:'icon-save'" href="javascript:void(0)"
			onclick="saveAppMenu();">
			<%: Html.Language("Save")%></a> <a class="easyui-linkbutton dlg-btn-cancel" data-options="iconCls:'icon-cancel'"
				href="javascript:void(0)" onclick="$('#dialog').window('close');">
				<%: Html.Language("Cancel")%></a>
	</div>
</div>
<script type="text/javascript">
	function iconFormatter(val) {
		if (val && val != '') {
			return '<img src="/' + val + '" height="25px" />';
		}
		return '';
	}
	function editAppMenu(row) {
		var row = row || $('#dgAppMenu').datagrid('getSelected');
		if (row) {
			$('#appMenuForm').form('reset');
			$('#hfID').val(row.ID);
			$('#txtName').val(row.Name);
			$('#txtEnglishName').val(row.EnglishName);
			$('#txtSort').numberspinner('setValue', row.Sort);
			if (row.ActiveIndicator) {
				$('#appMenuForm input[name=ActiveIndicator][value=false]').removeAttr('checked');
				$('#appMenuForm input[name=ActiveIndicator][value=true]').attr('checked', 'checked');
			} else {
				$('#appMenuForm input[name=ActiveIndicator][value=true]').removeAttr('checked');
				$('#appMenuForm input[name=ActiveIndicator][value=false]').attr('checked', 'checked');
			}
			$('#dialog').window({ title: lang.EditMenu }).window('open');
		} else {
			$.tools.alert(lang.PleaseSelectTheData);
		}
	}
	function saveAppMenu() {

		$('#appMenuForm').form('submit', {
			url: '/MobileApp/SaveAppMenu/',
			success: function (r) {
				r = $.parseJSON(r);
				if (r.IsSuccess) {
					$('#dgAppMenu').datagrid('reload');
					$('#dialog').window('close');
				}
				$.tools.alert(r.Message);
			}
		});
	}
</script>
