gyhlw_dotnet/网站项目/VRS/Management/VSAT/ModeManage.aspx

181 lines
7.3 KiB
Plaintext

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ModeManage.aspx.cs" Inherits="VRS.Management.VSAT.ModeManage" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>模式切换</title>
<link href="../../Assets/Layui/css/bootstrap.min.css" rel="stylesheet" />
<link href="../../Assets/Layui/css/materialdesignicons.min.css" rel="stylesheet" />
<link href="../../Assets/Layui/css/style.min.css" rel="stylesheet" />
<link href="../../Css/BaseStyle.css" type="text/css" rel="Stylesheet" />
<style>
html, body {
width: 100%;
height: 100%;
padding: 5px;
}
.mytable {
width: 99%;
height: 98%;
border: none;
margin-top: 10%;
}
.mytable tr {
border: none;
}
.mytable td {
border: none;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js"></asp:ScriptReference>
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js"></asp:ScriptReference>
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js"></asp:ScriptReference>
</Scripts>
</telerik:RadScriptManager>
<div class="hidden">
<asp:HiddenField ID="hideMode" runat="server" Value="关" />
<asp:HiddenField ID="hideModeTog" runat="server" Value="训练" />
<asp:Button ID="btn_Off" Text="" runat="server" OnClick="btn_Off_Click" />
<asp:Button ID="btn_On" Text="" runat="server" OnClick="btn_On_Click" />
<asp:Button ID="btn_Prc" Text="" runat="server" OnClick="btn_Prc_Click" />
<asp:Button ID="btn_Exa" Text="" runat="server" OnClick="btn_Exa_Click" />
</div>
<div>
<table class="mytable">
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td class="table-td-name" style="width: 42%">实践开关:</td>
<td class="table-td-content">
<input id="btnOff" type="button" class="btn btn-default" value="关闭" onclick="modeToggle('关')" />
<input id="btnOn" type="button" class="btn btn-default" value="开启" onclick="modeToggle('开')" />
</td>
</tr>
<tr>
<td colspan="2">
<br />
</td>
</tr>
<tr id="modes" class="hidden">
<td class="table-td-name">实践模式:</td>
<td class="table-td-content">
<div class="btn-group btn-group-toggle" data-toggle="buttons">
<label class="btn btn-default">
<input type="radio" name="options" id="option1" autocomplete="off" onclick="modeChange('训练')" />
<i class="mdi mdi-timer-sand">训练模式</i>
</label>
<label class="btn btn-default">
<input type="radio" name="options" id="option2" autocomplete="off" onclick="modeChange('考核')" />
<i class="mdi mdi-lead-pencil">考核模式</i>
</label>
</div>
</td>
</tr>
<%-- <tr>
<td class="table-td-name" style="width: 42%">年度:</td>
<td class="table-td-content">
<telerik:RadDropDownList ID="dp_task" runat="server" Skin="Bootstrap" Width="240px" >
<Items>
<telerik:DropDownListItem Text="2020" Value="2020" Selected="true" />
<telerik:DropDownListItem Text="2021" Value="2021" />
</Items>
</telerik:RadDropDownList>
</td>
</tr>--%>
</table>
</div>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="btn_On">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="btn_On" />
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="btn_Off">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="btn_Off" />
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="btn_Prc">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="btn_Prc" />
</UpdatedControls>
</telerik:AjaxSetting>
<telerik:AjaxSetting AjaxControlID="btn_Exa">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="btn_Exa" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
</form>
</body>
</html>
<script type="text/javascript">
function checkMode() {
var mode = $("#hideMode").val();
if (mode == "开") {
$("#btnOff").removeClass("btn-danger").addClass("btn-default");
$("#btnOn").removeClass("btn-default").addClass("btn-primary");
$("#modes").removeClass("hidden");
checkModeTog();
} else {
$("#btnOff").removeClass("btn-default").addClass("btn-danger");
$("#btnOn").removeClass("btn-primary").addClass("btn-default");
$("#modes").addClass("hidden");
}
}
function checkModeTog() {
var modeTog = $("#hideModeTog").val();
if (modeTog == "训练") {
$("#option1").attr("checked", "checked").parents("label").removeClass("btn-default").addClass("btn-success");
$("#option2").removeAttr("checked").parents("label").removeClass("btn-success").addClass("btn-default");
}
else {
$("#option2").attr("checked", "checked").parents("label").removeClass("btn-default").addClass("btn-success");
$("#option1").removeAttr("checked").parents("label").removeClass("btn-success").addClass("btn-default");
}
}
function modeToggle(data) {
$("#hideMode").val(data);
checkMode();
if (data == "开") {
$("#btn_On").click();
} else {
$("#btn_Off").click();
}
}
function modeChange(data) {
$("#hideModeTog").val(data);
checkModeTog();
if (data == "训练") {
$("#btn_Prc").click();
} else {
$("#btn_Exa").click();
}
}
checkMode();
</script>