使用ASP.NET MVC局部视图避免JS拼接HTML,编写易于维护的HTML页面

 

以前使用ASP.NET WebForm开发时,喜欢使用Repeater控件嵌套的方式开发前台页面,这样就不用JS拼接HTML或者后台拼接HTML了,写出的HTML页面美观、简捷、易于维护,由于不用JS拼接HTML,所以JS写的也很少。

最近使用ASP.NET MVC开发,前台页面的功能比较复杂,每次刷新整个页面的话体验会很差,所以通过JS控制页面元素,实现局部刷新。刚开始使用的方法是通过JS在前台拼接HTML,结果JS写的很长,要命的事,每增加一个新功能,都要拼接很长的HTML,结果页面的JS越写越多。考虑到后期可能难以维护,所以花了半天的时间,对页面进行了大改,把这一个页面拆分成了四个页面,通过jQuery的load方法实现局部更新,修改之后页面清爽多了。

本来想使用ASP.NET MVC的PartialView实现,结果路由的问题遇到点麻烦。最后发现直接使用View也可以,就用View实现了,效果是一样的,不必太钻牛角尖。

模板页面代码(用了两层Layout嵌套):

Layout.cshtml页面代码:

 
@{
ViewBag.Title = "货机管理";
}
<!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
<style type="text/css">
body
{
font-size: 12px;
padding: 0;
margin: 0;
background-color: #666;
}
.ul-menu
{
float: left;
margin: 0;
padding: 0;
margin-left: 3px;
}
.ul-menu li
{
float: left;
list-style: none;
margin: 0;
padding: 0;
width: 45px;
height: 25px;
line-height: 25px;
text-align: center;
margin-right: 20px;
border: solid 1px #999;
cursor: pointer;
}
</style>
<script type="text/javascript" src="~/Scripts/jquery-1.8.2.js"></script>
<script type="text/javascript">
function gotourl(url) {
window.location = url;
}
</script>
</head>
<body>
<div style="width: 960px; margin: auto; background-color: #fff; padding: 7px;">
<div style="height: 110px; border: solid 1px #999;">
<div style="float: left; width: 105px; height: 65px; margin: 3px; text-align: center; border: solid 1px #999;">
<div style="font-size: 16px; margin-top: 12px;">
IMU
<br />
120×90
</div>
</div>
<div style="float: right; padding: 5px; margin-top: 5px;">
<div style="float: left;">
欢迎您,<span>XXX</span> 【退出】
</div>
<div style="float: left; margin-left: 50px;">
@{
string[] weekDays = { "星期天", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六" };
}
当前时间 @DateTime.Now.ToString("yyyy-MM-dd(" + weekDays[(int)DateTime.Now.DayOfWeek] + ")HH:mm")
</div>
<div style="float: left; margin-left: 50px; margin-right: 5px;">
帮助中心
</div>
</div>
<div style="margin-top: 76px;">
<ul class="ul-menu">
<li onclick="gotourl('@Url.Content("~/Backstage/MachineMng/MachineInfo/Index")')">货机</li>
<li onclick="gotourl('@Url.Content("~/Backstage/MachineMng/StartCargo/Index")')">运营</li>
<li>交易</li>
<li>系统</li>
</ul>
</div>
</div>
@RenderBody()
</div>
</body>
</html>

RoadSetLayout.cshtml页面代码:

 
@{
ViewBag.Title = "货道设置";
Layout = Url.Content("~/Views/Backstage/MachineMng/Layout.cshtml");
}
<!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
<style type="text/css">
.div-button1
{
float: left;
width: 120px;
height: 35px;
border: solid 1px #999;
font-size: 18px;
line-height: 35px;
text-align: center;
cursor: pointer;
}
.div-button2
{
float: left;
width: 120px;
height: 30px;
border: solid 1px #999;
font-size: 14px;
line-height: 30px;
text-align: center;
cursor: pointer;
}
.div-arrow
{
float: left;
height: 55px;
padding-top: 5px;
}
.div-arrow2
{
float: left;
width: 35px;
height: 22px;
padding-top: 6px;
margin-left: 10px;
}
</style>
<script type="text/javascript" src="~/Scripts/jquery-1.8.2.js"></script>
<script type="text/javascript" src="~/Scripts/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript">
$(function () {
});
</script>
</head>
<body>
<div style="height: 200px; border: solid 1px #999; border-top: 0;">
<div style="float: left; width: 200px; height: 150px; border: solid 1px #999; margin: 20px; padding: 5px;">
<div style="text-align: center; font-size: 18px; line-height: 25px; padding-top: 10px;">
货机现在运行正常
<br />
连续运行3天 72小时
</div>
<div style="padding-top: 10px; line-height: 20px;">
货机数据已经与平台数据同步,无需插数据盘。
请插入数据盘完成数据同步更新/数据盘已插入,数据传输完成10%
</div>
</div>
<div style="float: right; width: 600px; height: 160px; margin: 20px; margin-right: 50px;">
<div class="div-button1" style="margin-left: 100px; cursor: default; background-color: #eee;">
暂停货机
</div>
<div onclick="gotourl('@Url.Content("~/Backstage/MachineMng/StartCargo/Index")')" class="div-button1" style="margin-left: 50px;">
启动货机
</div>
<div style="float: left; width: 100%; height: 33px; line-height: 33px; text-align: center;">
<div style="float: left; margin-left: 100px;">
货机暂停才可以进行以下操作:以下操作完成须启动货机
</div>
</div>
<div style="float: left; width: 100%; height: 60px; line-height: 60px; text-align: center;">
<div class="div-arrow" style="margin-left: 150px;">
<img alt="" src="@Url.Content("~/Images/Cargo/roadset_arrow_down.png")" />
</div>
<div class="div-arrow" style="margin-left: 160px;">
<img alt="" src="@Url.Content("~/Images/Cargo/roadset_arrow_up.png")" />
</div>
</div>
<div class="div-button2" onclick="gotourl('@Url.Content("~/Backstage/MachineMng/RoadSet/Index")')" style="margin-left: 50px;">
商品货道设置
</div>
<div class="div-arrow2" style="">
<img alt="" src="@Url.Content("~/Images/Cargo/roadset_arrow_right.png")" />
</div>
<div class="div-button2" style="margin-left: 5px;">
现金管理理
</div>
<div class="div-arrow2" style="">
<img alt="" src="@Url.Content("~/Images/Cargo/roadset_arrow_right.png")" />
</div>
<div class="div-button2" style="margin-left: 5px;">
货机运维
</div>
</div>
</div>
@RenderBody()
</body>
</html>

Index.cshtml页面代码:

 
@{
ViewBag.Title = "货道设置";
Layout = Url.Content("~/Views/Backstage/MachineMng/RoadSetLayout.cshtml");
}
<!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
<link type="text/css" href="~/Scripts/jquery-easyui-1.4.1/themes/default/easyui.css" rel="stylesheet" />
<style type="text/css">
body
{
font-size: 12px;
}
.div-box
{
float: left;
border: solid 1px #f5f5f5;
height: 148px;
width: 97px;
background-color: #f5f5f5;
cursor: default;
}
.div-box div
{
float: left;
margin-top: 15px;
margin-left: 9px;
height: 120px;
width: 80px;
line-height: 120px;
font-size: 16px;
font-family: 黑体;
text-align: center;
}
.ul-instructions
{
float: left;
width: 200px;
padding: 0;
margin: 0;
margin-left: 10px;
margin-top: 10px;
margin-bottom: 10px;
}
.ul-instructions li
{
float: left;
list-style: none;
width: 200px;
line-height: 25px;
font-size: 12px;
margin: 0;
padding: 3px;
}
.ul-instructions li div
{
float: left;
}
.div-road
{
float: left;
height: 130px;
width: 100px;
margin-left: 20px;
margin-top: 20px;
}
.table-road
{
background-color: #ffff00;
border: solid 1px #999;
}
.div-highlight
{
border: solid 1px #6dbde4 !important;
background-color: #dceaf2 !important;
}
.img-btn
{
cursor: pointer;
margin: 3px;
}
.img-btn2
{
cursor: pointer;
margin-left: 10px;
}
.table-addroads
{
width: 100%;
}
.table-addroads tr td:first-child
{
text-align: right;
}
.table-addroads tr td
{
height: 30px;
padding: 3px;
}
</style>
<script type="text/javascript" src="~/Scripts/jquery-1.8.2.js"></script>
<script type="text/javascript" src="~/Scripts/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="~/Scripts/jquery-easyui-1.4.1/jquery.easyui.min.js"></script>
<script type="text/javascript" src="~/Scripts/SimpoWindow.js"></script>
<script type="text/javascript">
$(function () {
$("#tdboxs").load("Boxs?cargoCode=" + '@ViewBag.cargoCode', function (data) {
$(".div-box:first").click();
});
});
//显示货柜的货道
function showBox(obj, boxId) {
$(".div-box").removeClass("div-highlight");
$(obj).addClass("div-highlight");
$("#divfloors").load("Floors?boxId=" + boxId);
}
//添加货柜
function addbox(addType) {
if (confirm("确定添加?")) {
var cargoCode = '@ViewBag.cargoCode';
var floorType = $("input[name='floorType']:checked").val();
$.ajax({
type: "POST",
url: "@Url.Content("~/Backstage/MachineMng/RoadSet/AddBox")",
data: { "addType": addType, "cargoCode": cargoCode, "floorType": floorType },
success: function (d) {
var data = eval("(" + d + ")");
if (data.ok) {
$("#tdboxs").load("Boxs?cargoCode=" + cargoCode, function (data) {
if (addType == 1) {
$(".div-box:first").click();
} else {
$(".div-box:last").click();
}
});
} else {
alert("添加失败:" + data.msg);
}
},
error: function () {
alert("添加失败");
}
});
}
}
//删除货柜
function delbox(addType) {
if (confirm("确定删除?")) {
var cargoCode = '@ViewBag.cargoCode';
$.ajax({
type: "POST",
url: "@Url.Content("~/Backstage/MachineMng/RoadSet/DelBox")",
data: { "addType": addType, "cargoCode": cargoCode },
success: function (data) {
if (data == "ok") {
if (addType == 1) {
$(".div-box:first").remove();
}
else {
$(".div-box:last").remove();
}
$(".div-box:first").click();
}
else {
alert("删除失败" + data);
}
},
error: function () {
alert("删除失败");
}
});
}
}
//添加货道
function addroad(obj, boxId, floor) {
$.ajax({
type: "POST",
url: "@Url.Content("~/Backstage/MachineMng/RoadSet/AddRoad")",
data: { "boxId": boxId, "floor": floor },
success: function (d) {
var data = eval("(" + d + ")");
if (data.ok) {
var td = $(obj).parent().parent().parent().parent().find("td:first");
td.find("#divroads_" + floor).load("Roads?boxId=" + boxId + "&floor=" + floor);
var roadNum = parseInt(td.find(".span-roadNum").text(), 10);
td.find(".span-roadNum").html((roadNum + 1).toString());
} else {
alert("添加失败:" + data.msg);
}
},
error: function () {
alert("添加失败");
}
});
}
//删除货道
function delroad(obj, boxId, floor) {
if (confirm("确定删除?")) {
$.ajax({
type: "POST",
url: "@Url.Content("~/Backstage/MachineMng/RoadSet/DelRoad")",
data: { "boxId": boxId, "floor": floor },
success: function (data) {
if (data == "ok") {
var td = $(obj).parent().parent().parent().parent().find("td:first");
td.find(".div-road:last").remove();
var roadNum = parseInt(td.find(".span-roadNum").text(), 10);
if (roadNum > 0) {
td.find(".span-roadNum").html((roadNum - 1).toString());
}
}
else {
alert("删除失败" + data);
}
},
error: function () {
alert("删除失败");
}
});
}
}
//添加货道层
function addfloor(obj, boxId) {
$.ajax({
type: "POST",
url: "@Url.Content("~/Backstage/MachineMng/RoadSet/AddFloor")",
data: { "boxId": boxId },
success: function (d) {
var data = eval("(" + d + ")");
if (data.ok) {
$("#divfloors").load("Floors?boxId=" + boxId);
var div = $(obj).parent().parent();
var floorNum = parseInt(div.find(".span-floorNum").text(), 10);
div.find(".span-floorNum").html((floorNum + 1).toString());
} else {
alert("添加失败:" + data.msg);
}
},
error: function () {
alert("添加失败");
}
});
}
//删除货道层
function delfloor(obj, boxId) {
if ($(obj).parent().parent().find(".table-floor").length < 2) return;
if (confirm("确定删除?")) {
$.ajax({
type: "POST",
url: "@Url.Content("~/Backstage/MachineMng/RoadSet/DelFloor")",
data: { "boxId": boxId },
success: function (d) {
var data = eval("(" + d + ")");
if (data.ok) {
var div = $(obj).parent().parent();
div.find(".table-floor:last").remove();
var floorNum = parseInt(div.find(".span-floorNum").text(), 10);
div.find(".span-floorNum").html((floorNum - 1).toString());
} else {
alert("删除失败:" + data.msg);
}
},
error: function () {
alert("删除失败");
}
});
}
}
//批量添加货道
function addroads(obj, boxId, floor) {
SimpoWin.showWin2("更换货箱", "addroads", 240, 170);
var btnOK = $(".table-addroads").find("input[type='button']");
btnOK.bind("click", function () {
var roadNum = $("select[name='roadNum']").find("option:selected").val();
var roadSpec = $("select[name='roadSpec']").find("option:selected").val();
$.ajax({
type: "POST",
url: "@Url.Content("~/Backstage/MachineMng/RoadSet/AddRoads")",
data: { "boxId": boxId, "floor": floor, "roadNum": roadNum, "roadSpec": roadSpec },
success: function (d) {
var data = eval("(" + d + ")");
if (data.ok) {
var td = $(obj).parent().parent();
td.find("#divroads_" + floor).load("Roads?boxId=" + boxId + "&floor=" + floor);
td.find(".span-roadNum").html(data.roadNum.toString());
} else {
alert("添加失败:" + data.msg);
}
},
error: function () {
alert("添加失败");
}
});
btnOK.unbind("click");
SimpoWin.closeWin2("addroads");
});
}
</script>
</head>
<body>
<div style="height: 30px; line-height: 30px; padding-top: 5px; border-left: solid 1px #999; border-right: solid 1px #999; text-align: center;">
客户喜好
<img alt="" src="@Url.Content("~/Images/Cargo/roadset_arrow_longright.png")" />
商品
<img alt="" src="@Url.Content("~/Images/Cargo/roadset_arrow_longright.png")" />
选择货道
<img alt="" src="@Url.Content("~/Images/Cargo/roadset_arrow_longright.png")" />
摆放商品
<img alt="" src="@Url.Content("~/Images/Cargo/roadset_arrow_longright.png")" />
完成货道商品绑定
</div>
<div id="divbox" style="border: solid 1px #999; border-top: 0; border-bottom: none;">
<table cellpadding="0" cellspacing="0" style="border-collapse: collapse; width: 100%;">
<tr>
<td style="width: 260px;">
<ul class="ul-instructions">
<li>
<div style="height: 25px; width: 25px; background-color: yellow;"></div>
<div style="height: 25px; margin-left: 10px;">黄色:表示更换货道</div>
</li>
<li>
<div style="height: 25px; width: 25px; background-color: green;"></div>
<div style="height: 25px; margin-left: 10px;">绿色:表示上货数量</div>
</li>
<li>
<div style="height: 25px; width: 25px; background-color: red;"></div>
<div style="height: 25px; margin-left: 10px;">红色:表示现有商品数</div>
</li>
<li>
<div style="height: 25px; width: 25px; background-color: gray;"></div>
<div style="height: 25px; margin-left: 10px;">灰色:表示最大商品数</div>
</li>
<li>
<div style="height: 23px; width: 23px; border: solid 1px #000; text-align: center;">调</div>
<div style="height: 25px; margin-left: 10px;">调:表示调换本商品</div>
</li>
<li>
<div style="height: 23px; width: 23px; border: solid 1px #000; text-align: center;">换</div>
<div style="height: 25px; margin-left: 10px;">换:表示更换商品种类</div>
</li>
</ul>
</td>
<td>
<div style="float: left;">
<div style="text-align: center; margin-top: 25px;">
<img onclick="addbox(1)" alt="" class="img-btn" src="@Url.Content("~/Images/Cargo/roadset_add.png")" />
</div>
<div style="margin-top: 50px; text-align: center;">
<img onclick="delbox(1)" alt="" class="img-btn" src="@Url.Content("~/Images/Cargo/roadset_Del.png")" />
</div>
</div>
</td>
<!--货柜-->
<td id="tdboxs">&nbsp;
</td>
<td>
<div style="float: left;">
<div style="text-align: center; margin-top: 25px;">
<img onclick="addbox(2)" alt="" class="img-btn" src="@Url.Content("~/Images/Cargo/roadset_add.png")" />
</div>
<div style="margin-top: 50px; text-align: center;">
<img onclick="delbox(2)" alt="" class="img-btn" src="@Url.Content("~/Images/Cargo/roadset_Del.png")" />
</div>
</div>
</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td style="text-align: right;">
<input name="floorType" value="1" type="radio" checked="checked" />横箱<input name="floorType" value="0" type="radio" />竖箱</td>
<td>&nbsp;</td>
</tr>
</table>
</div>
<!--货道层-->
<div id="divfloors"></div>
<!-- 分隔线 -------------------------------------------------------------------------------------->
<div id="addroads" style="display: none;">
<div style="padding: 10px;">
<table class="table-addroads" cellpadding="0" cellspacing="0" style="border-collapse: collapse;">
<tr>
<td style="width: 80px;">货道数:</td>
<td>
<select name="roadNum">
<option value="4">4货道</option>
<option value="6">6货道</option>
<option value="8">8货道</option>
<option value="10">10货道</option>
</select>
</td>
</tr>
<tr>
<td>货道型号:</td>
<td>
<select name="roadSpec">
<option value="C25/80">C25/80</option>
<option value="C10/50">C10/50</option>
<option value="C30/85">C30/85</option>
<option value="C15/75">C15/75</option>
</select>
</td>
</tr>
<tr>
<td colspan="2" style="text-align: center;">
<input type="button" value="确定" />
</td>
</tr>
</table>
</div>
</div>
</body>
</html>

Index.cshtml页面中有两个局部页面Boxs.cshtml和Floors.cshtml,Floors.cshtml页面中有一个局部页面Roads.cshtml,代码如下:

Boxs.cshtml页面代码:

 
@using System.Data;
@using DAL;
@{
BoxInfoDal boxInfoDal = new BoxInfoDal();
string cargoCode = ViewBag.cargoCode;
DataTable dtLeftBox = boxInfoDal.GetListByBoxCodeDesc(cargoCode, 1);
DataTable dtRightBox = boxInfoDal.GetList(cargoCode, 2);
}
@foreach (System.Data.DataRow dr in dtLeftBox.Rows)
{
<div class="div-box" onclick="showBox(this,'@dr["id"].ToString()')">
<div style="background: url(@Url.Content("~/Images/Cargo/yougui.png")) no-repeat;">
@boxInfoDal.GetName(dr["cargoCode"].ToString())
</div>
</div>
}
<div id="divMainBox" style="float: left; height: 150px; width: 99px;">
<img alt="" src="@Url.Content("~/Images/Cargo/zhugui.png")" />
</div>
@foreach (System.Data.DataRow dr in dtRightBox.Rows)
{
<div class="div-box" onclick="showBox(this,'@dr["id"].ToString()')">
<div style="background: url(@Url.Content("~/Images/Cargo/yougui.png")) no-repeat;">
@boxInfoDal.GetName(dr["cargoCode"].ToString())
</div>
</div>
}

Floors.cshtml页面代码:

 
@using System.Data;
@using DAL;
@{
BoxInfoDal boxInfoDal = new BoxInfoDal();
string boxId = ViewBag.boxId;
DataRow drBox = boxInfoDal.Get(boxId).Rows[0];
string boxCode = drBox["cargoCode"].ToString();
string floorNum = drBox["floorNum"].ToString();
string floorType = drBox["floorType"].ToString();
}
<script type="text/javascript">
$(function () {
$("input[name='floorType'][value='" + @floorType + "']").attr("checked", "checked");
for (var i = 1; i <= parseInt('@floorNum', 10) ; i++) {
$("#divroads_" + i).load("Roads?boxId=" + '@boxId' + "&floor=" + i);
}
});
</script>
<div style="border-left: solid 1px #999; border-right: solid 1px #999; border-top: 0;">
<div style="padding: 10px; border-bottom: solid 1px #000;">
<div style="float: left; height: 20px; line-height: 20px;">
设置 @boxInfoDal.GetName(boxCode) 货道层数: <span class="span-floorNum">@floorNum</span>层
</div>
<img onclick="addfloor(this, '@boxId')" alt="" class="img-btn2" src="@Url.Content("~/Images/Cargo/roadset_add.png")" />
<img onclick="delfloor(this, '@boxId')" alt="" class="img-btn2" src="@Url.Content("~/Images/Cargo/roadset_Del.png")" />
</div>
@for (int i = 1; i <= int.Parse(floorNum); i++)
{
DataTable dtRoadList = boxInfoDal.GetRoadList(boxId, i);
<table class="table-floor" cellpadding="0" cellspacing="0" style="border-collapse: collapse; border-bottom: solid 1px #999; width: 100%;">
<tr>
<td style="padding: 10px; padding-bottom: 20px; vertical-align: top;">
<div style="padding: 10px;">
设置第 @i 层货道数: <span class="span-roadNum">@dtRoadList.Rows.Count</span>
<button onclick="addroads(this,'@boxId',@i)" style="margin-left: 20px;" >更换货箱</button>
</div>
<!--货道-->
<div id="divroads_@i"></div>
</td>
<td>
<div style="float: right;">
<div style="text-align: center; margin-top: 15px;">
<img onclick="addroad(this,'@boxId',@i)" alt="" class="img-btn" src="@Url.Content("~/Images/Cargo/roadset_add.png")" />
</div>
<div style="margin-top: 50px; text-align: center;">
<img onclick="delroad(this,'@boxId',@i)" alt="" class="img-btn" src="@Url.Content("~/Images/Cargo/roadset_Del.png")" />
</div>
</div>
</td>
</tr>
</table>
}
</div>

Roads.cshtml页面代码:

 
@using System.Data;
@using DAL;
@{
BoxInfoDal boxInfoDal = new BoxInfoDal();
string boxId = ViewBag.boxId;
int floor = ViewBag.floor;
DataTable dtRoadList = boxInfoDal.GetRoadList(boxId, floor);
int j = 0;
}
@foreach (System.Data.DataRow drRoad in dtRoadList.Rows)
{
j++;
<div class="div-road">
<table class="table-road" cellpadding="0" cellspacing="0" style="border-collapse: collapse; width: 100%;">
<tr>
<td>
<div style="margin: 2px;">@boxInfoDal.NumToABCD(floor)@j.ToString()</div>
</td>
</tr>
<tr>
<td>
<div style="margin: 2px;">货道 @drRoad["roadSpec"].ToString()</div>
</td>
</tr>
<tr style="line-height: 11px;">
<td>&nbsp;</td>
</tr>
<tr>
<td style="text-align: center;">
<input value="0" type="text" style="height: 17px; width: 25px; text-align: center;" />
</td>
</tr>
<tr>
<td style="text-align: center;">现
<input value="@drRoad["existProductNum"].ToString()" type="text" style="height: 19px; width: 25px; border: 0; background-color: red; text-align: center;" readonly="readonly" /><input value="@drRoad["maxProductNum"].ToString()" type="text" style="height: 19px; width: 25px; border: 0; background-color: gray; text-align: center;" readonly="readonly" />

</td>
</tr>
<tr>
<td style="text-align: center; font-weight: bold;">
<div style="margin-top: 5px;">@drRoad["productName"].ToString()&nbsp;</div>
</td>
</tr>
<tr>
<td style="text-align: center;">
<div style="position: relative; float: right; margin-right: -1px; margin-bottom: -1px; border: solid 1px #000; padding: 3px; cursor: pointer; background-color: white;">调</div>
</td>
</tr>
</table>
</div>
}

控制器代码:

 
using System;
using System.Collections.Generic;
using System.Data;
using System.Linq;
using System.Text;
using System.Web.Mvc;
using DAL;
using Newtonsoft.Json;
namespace Controllers.Backstage.MachineMng
{
/// <summary>
/// 货道设置
/// </summary>
public class RoadSetController : AdminBaseController
{
#region 构造函数及变量
private SQLiteHelper.SQLiteHelper sqliteHelper;
private BoxInfoDal boxInfoDal;
private CargoInformationDal cargoInformationDal;
public RoadSetController()
{
sqliteHelper = new SQLiteHelper.SQLiteHelper();
boxInfoDal = new BoxInfoDal();
cargoInformationDal = new CargoInformationDal();
}
#endregion
#region Index页面
public ActionResult Index()
{
ViewBag.cargoCode = "112";
return View();
}
#endregion
#region Boxs页面
public ActionResult Boxs(string cargoCode)
{
ViewBag.cargoCode = cargoCode;
return View();
}
#endregion
#region Floors页面
public ActionResult Floors(string boxId)
{
ViewBag.boxId = boxId;
return View();
}
#endregion
#region Roads页面
public ActionResult Roads(string boxId, int floor)
{
ViewBag.boxId = boxId;
ViewBag.floor = floor;
return View();
}
#endregion
#region 添加贷柜
public ActionResult AddBox(int addType, string cargoCode, string floorType)
{
DataTable dtCargo = cargoInformationDal.Get(cargoCode);
DataRow drCargo = dtCargo.Rows[0];
string boxId = Guid.NewGuid().ToString();
string positionNum = null;
string boxCode = null; //货柜编号
DataTable dtLeftBoxList = boxInfoDal.GetList(cargoCode, addType);
boxCode = addType.ToString() + (dtLeftBoxList.Rows.Count + 1).ToString("00");
positionNum = addType.ToString() + (dtLeftBoxList.Rows.Count + 1).ToString("00");
StringBuilder sql = new StringBuilder();
//插入货柜表
sql.AppendFormat(@"
insert into
mas_box_info(id, shopId, positionNum, cargoCode, floorType, floorNum, delFlag, addTime, addUserId, addMark)
values('{0}','{1}','{2}','{3}','{4}','{5}','{6}','{7}','{8}','{9}');",
boxId, drCargo["shopId"].ToString(), positionNum, boxCode, floorType, 1, 0, DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss"), -1, -1);
//插入关联表
sql.AppendFormat(@"
insert into
mas_cargo_container(id, boxId, positionNum, cargoCode, positionDescription, xCoordinate, yCoordinate, delFlag, addTime, addUserId, addMark)
values('{0}','{1}','{2}','{3}','{4}','{5}','{6}','{7}','{8}','{9}','{10}');", Guid.NewGuid().ToString(), boxId, positionNum, cargoCode, "", 0, 0, 0, DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss"), -1, -1);
sqliteHelper.BeginTransaction();
try
{
sqliteHelper.Execute(sql.ToString());
sqliteHelper.Commit();
Dictionary<string, object> dic = new Dictionary<string, object>();
dic["ok"] = true;
dic["id"] = boxId;
dic["name"] = (addType == 1 ? "左" : "右") + (dtLeftBoxList.Rows.Count + 1) + "柜";
return Content(JsonConvert.SerializeObject(dic));
}
catch (Exception ex)
{
sqliteHelper.Rollback();
Dictionary<string, object> dic = new Dictionary<string, object>();
dic["ok"] = false;
dic["msg"] = ex.Message;
return Content(JsonConvert.SerializeObject(dic));
}
}
#endregion
#region 删除贷柜
public ActionResult DelBox(int addType, string cargoCode)
{
DataTable dtCargo = cargoInformationDal.Get(cargoCode);
DataRow drCargo = dtCargo.Rows[0];
string boxId = null;
string boxCode = null; //货柜编号
DataTable dtLeftBoxList = boxInfoDal.GetList(cargoCode, addType);
boxCode = addType.ToString() + dtLeftBoxList.Rows.Count.ToString("00");
foreach (DataRow dr in dtLeftBoxList.Rows)
{
if (dr["cargoCode"].ToString() == boxCode)
{
boxId = dr["id"].ToString();
}
}
if (boxId == null)
{
return Content("");
}
StringBuilder sql = new StringBuilder();
//删除货柜
sql.AppendFormat(@"
delete from mas_box_info
where id='{0}';", boxId);
//删除货机货柜关联
sql.AppendFormat(@"
delete from mas_cargo_container
where boxid='{0}';", boxId);
//删除货道
sql.AppendFormat(@"
delete from mas_box_road_info
where id in
(select roadId from mas_container_cargo_road
where containerId='{0}');", boxId);
//删除货柜货道关联
sql.AppendFormat(@"
delete from mas_container_cargo_road
where containerId='{0}';", boxId);
sqliteHelper.BeginTransaction();
try
{
sqliteHelper.Execute(sql.ToString());
sqliteHelper.Commit();
return Content("ok");
}
catch (Exception ex)
{
sqliteHelper.Rollback();
return Content("错误:" + ex.Message);
}
}
#endregion
#region 添加货道
public ActionResult AddRoad(string boxId, int floor)
{
string roadId = Guid.NewGuid().ToString();
DataTable dtRoadList = boxInfoDal.GetRoadList(boxId, floor);
string roadNo = boxInfoDal.NumToABCD(floor) + (dtRoadList.Rows.Count + 1).ToString();
StringBuilder sql = new StringBuilder();
//插入货道表
sql.AppendFormat(@"
insert into
mas_box_road_info(id, roadNO, roadSpec, existProductNum, maxProductNum, productID, delFlag, addTime, addUserId, addMark)
values('{0}','{1}','{2}','{3}','{4}','{5}','{6}','{7}','{8}','{9}');",
roadId, roadNo, "C20/75", 0, 10, -1, 0, DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss"), -1, -1);
//插入关联表
sql.AppendFormat(@"
insert into
mas_container_cargo_road(id, containerId, layerNo, roadId, sort, delFlag, addTime, addUserId, addMark)
values('{0}','{1}','{2}','{3}','{4}','{5}','{6}','{7}','{8}');", Guid.NewGuid().ToString(), boxId, floor, roadId, dtRoadList.Rows.Count + 1, 0, DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss"), -1, -1);
sqliteHelper.BeginTransaction();
try
{
sqliteHelper.Execute(sql.ToString());
sqliteHelper.Commit();
Dictionary<string, object> dic = new Dictionary<string, object>();
dic["ok"] = true;
dic["id"] = roadId;
dic["roadNo"] = roadNo;
dic["roadSpec"] = "C20/75";
dic["maxProductNum"] = "10";
return Content(JsonConvert.SerializeObject(dic));
}
catch (Exception ex)
{
sqliteHelper.Rollback();
Dictionary<string, object> dic = new Dictionary<string, object>();
dic["ok"] = false;
dic["msg"] = ex.Message;
return Content(JsonConvert.SerializeObject(dic));
}
}
#endregion
#region 删除货道
public ActionResult DelRoad(string boxId, int floor)
{
DataTable dtRoad = boxInfoDal.GetRoadLast(boxId, floor);
if (dtRoad.Rows.Count > 0)
{
string roadId = dtRoad.Rows[0]["id"].ToString();
StringBuilder sql = new StringBuilder();
//删除货道
sql.AppendFormat(@"
delete from mas_box_road_info
where id='{0}';", roadId);
//删除货柜货道关联
sql.AppendFormat(@"
delete from mas_container_cargo_road
where roadId='{0}';", roadId);
sqliteHelper.BeginTransaction();
try
{
sqliteHelper.Execute(sql.ToString());
sqliteHelper.Commit();
return Content("ok");
}
catch (Exception ex)
{
sqliteHelper.Rollback();
return Content("错误:" + ex.Message);
}
}
else
{
return Content("ok");
}
}
#endregion
#region 添加货道层
public ActionResult AddFloor(string boxId)
{
DataTable dtBox = boxInfoDal.Get(boxId);
int floorNum = int.Parse(dtBox.Rows[0]["floorNum"].ToString());
StringBuilder sql = new StringBuilder();
//修改货柜信息
sql.AppendFormat(@"
update mas_box_info
set floorNum={1}
where id='{0}';", boxId, floorNum + 1);
sqliteHelper.BeginTransaction();
try
{
sqliteHelper.Execute(sql.ToString());
sqliteHelper.Commit();
Dictionary<string, object> dic = new Dictionary<string, object>();
dic["ok"] = true;
dic["name"] = boxInfoDal.GetName(dtBox.Rows[0]["cargoCode"].ToString());
dic["floorNum"] = floorNum + 1;
return Content(JsonConvert.SerializeObject(dic));
}
catch (Exception ex)
{
sqliteHelper.Rollback();
Dictionary<string, object> dic = new Dictionary<string, object>();
dic["ok"] = false;
dic["msg"] = ex.Message;
return Content(JsonConvert.SerializeObject(dic));
}
}
#endregion
#region 删除货道层
public ActionResult DelFloor(string boxId)
{
DataTable dtBox = boxInfoDal.Get(boxId);
int floorNum = int.Parse(dtBox.Rows[0]["floorNum"].ToString());
StringBuilder sql = new StringBuilder();
//修改货柜信息
sql.AppendFormat(@"
update mas_box_info
set floorNum={1}
where id='{0}';", boxId, floorNum - 1);
//删除货道
sql.AppendFormat(@"
delete from mas_box_road_info
where id in
(select road.id
from mas_box_road_info road
left join mas_container_cargo_road ccr on ccr.roadId=road.id
where ccr.layerNo={0}
and ccr.containerId='{1}');", floorNum, boxId);
//删除货柜货道关联
sql.AppendFormat(@"
delete from mas_container_cargo_road
where roadId in
(select road.id
from mas_box_road_info road
left join mas_container_cargo_road ccr on ccr.roadId=road.id
where ccr.layerNo={0}
and ccr.containerId='{1}');", floorNum, boxId);
sqliteHelper.BeginTransaction();
try
{
if (floorNum > 1)
{
sqliteHelper.Execute(sql.ToString());
sqliteHelper.Commit();
}
Dictionary<string, object> dic = new Dictionary<string, object>();
dic["ok"] = true;
return Content(JsonConvert.SerializeObject(dic));
}
catch (Exception ex)
{
sqliteHelper.Rollback();
Dictionary<string, object> dic = new Dictionary<string, object>();
dic["ok"] = false;
dic["msg"] = ex.Message;
return Content(JsonConvert.SerializeObject(dic));
}
}
#endregion
#region 更换货箱
public ActionResult AddRoads(string boxId, int floor, int roadNum, string roadSpec)
{
StringBuilder sql = new StringBuilder();
//删除货道
sql.AppendFormat(@"
delete from mas_box_road_info
where id in
(select road.id
from mas_box_road_info road
left join mas_container_cargo_road ccr on ccr.roadId=road.id
where ccr.layerNo={0}
and ccr.containerId='{1}');", floor, boxId);
//删除货柜货道关联
sql.AppendFormat(@"
delete from mas_container_cargo_road
where roadId in
(select road.id
from mas_box_road_info road
left join mas_container_cargo_road ccr on ccr.roadId=road.id
where ccr.layerNo={0}
and ccr.containerId='{1}');", floor, boxId);
for (int i = 1; i <= roadNum; i++)
{
string roadId = Guid.NewGuid().ToString();
//插入货道表
sql.AppendFormat(@"
insert into
mas_box_road_info(id, roadNO, roadSpec, existProductNum, maxProductNum, productID, delFlag, addTime, addUserId, addMark)
values('{0}','{1}','{2}','{3}','{4}','{5}','{6}','{7}','{8}','{9}');",
roadId, i, roadSpec, 0, 10, -1, 0, DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss"), -1, -1);
//插入关联表
sql.AppendFormat(@"
insert into
mas_container_cargo_road(id, containerId, layerNo, roadId, sort, delFlag, addTime, addUserId, addMark)
values('{0}','{1}','{2}','{3}','{4}','{5}','{6}','{7}','{8}');", Guid.NewGuid().ToString(), boxId, floor, roadId, i, 0, DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss"), -1, -1);
}
sqliteHelper.BeginTransaction();
try
{
sqliteHelper.Execute(sql.ToString());
sqliteHelper.Commit();
Dictionary<string, object> dic = new Dictionary<string, object>();
dic["ok"] = true;
dic["roadNo"] = boxInfoDal.NumToABCD(floor);
dic["roadNum"] = roadNum;
dic["maxProductNum"] = "10";
return Content(JsonConvert.SerializeObject(dic));
}
catch (Exception ex)
{
sqliteHelper.Rollback();
Dictionary<string, object> dic = new Dictionary<string, object>();
dic["ok"] = false;
dic["msg"] = ex.Message;
return Content(JsonConvert.SerializeObject(dic));
}
}
#endregion
}
}

效果图:

 
分类: ASP.NET MVC
标签: ASP.NET MVC

ASP.NET MVC局部视图的更多相关文章

  1. 使用ASP.NET MVC局部视图避免JS拼接HTML,编写易于维护的HTML页面

    以前使用ASP.NET WebForm开发时,喜欢使用Repeater控件嵌套的方式开发前台页面,这样就不用JS拼接HTML或者后台拼接HTML了,写出的HTML页面美观.简捷.易于维护,由于不用JS ...

  2. ASP.NET MVC搭建项目后台UI框架—1、后台主框架

    目录 ASP.NET MVC搭建项目后台UI框架—1.后台主框架 ASP.NET MVC搭建项目后台UI框架—2.菜单特效 ASP.NET MVC搭建项目后台UI框架—3.面板折叠和展开 ASP.NE ...

  3. ASP.NET MVC必知必会知识点总结(二)

    一.实现Controller的依赖注入: 1.自定义继承DefaultControllerFactory 类的控制器工厂类并重写GetControllerInstance方法:(如:InjectCon ...

  4. ASP.NET MVC使用Bootstrap系统(2)——使用Bootstrap CSS和HTML元素

    阅读目录 Bootstrap 栅格(Grid)系统 Bootstrap HTML元素 Bootstrap 验证样式 ASP.NET MVC创建包含Bootstrap样式编辑模板 小结 Bootstra ...

  5. ASP.NET MVC使用Bootstrap系列(3)——使用Bootstrap 组件

    阅读目录 Bootstrap 导航条 列表组 徽章 媒体对象 页头 路径导航 分页 输入框组 按钮式下拉菜单 警告框 进度条 小结 Bootstrap为我们提供了十几种的可复用组件,包括字体图标.下拉 ...

  6. asp.net mvc 4 高级编程学习笔记:第三章 视图(2)

    页面布局 asp.net MVC中提供了布局的支持,默认情况下才布局文件保存到 /View/Shared/目录下的_Layout.cshtml,View目录有个_ViewStart.cshtml文件, ...

  7. asp.net mvc 如何调用微信jssdk接口:分享到微信朋友(圈)| 分享到qq空间

    如何在asp.net mvc 项目里, 调用微信jssdk接口,现实功能: 分享到微信朋友(圈)| 分享到qq空间 1 创建一个Action,准备一些数据,初始化数据(签名): /// <sum ...

  8. ASP.NET MVC分页实现之改进版-增加同一个视图可设置多个分页

    我之前就已经实现了ASP.NET MVC分页(查看该博文),但它有局限性,必须确保在同一个视图中只能有一处分页,若需要在同一个视图中设置多个分页,却无能为力,为此,我重新对原先的代码进行了优化,增加了 ...

  9. ASP.NET MVC分页实现

    ASP.NET MVC中不能使用分页控件,所以我就自己写了一个分页局部视图,配合PageInfo类,即可实现在任何页面任意位置呈现分页,由于采用的是基于POST分页方式,所以唯一的限制就是必须放在FO ...

随机推荐

  1. OAuth打造webapi认证服务

    使用OAuth打造webapi认证服务供自己的客户端使用 一.什么是OAuth OAuth是一个关于授权(Authorization)的开放网络标准,目前的版本是2.0版.注意是Authorizati ...

  2. SQL Server 内存泄露(memory leak)——游标导致的内存问题

    原文:SQL Server 内存泄露(memory leak)--游标导致的内存问题 转自:http://blogs.msdn.com/b/apgcdsd/archive/2011/07/01/sql ...

  3. android4.4组件分析--service组件-bindService源代码分析

    6.1.1.    bindService 由于有前面分析startService的代码实现过程,则对于bindService的代码分析就不用那么具体介绍,在介绍流程的同一时候更关注一些细节上的部分. ...

  4. React JS高速新手教程

    翻译至官方文档<Tutorial>http://facebook.github.io/react/docs/tutorial.html 转载请注明出处:http://blog.csdn.n ...

  5. 模式识别 - libsvm该函数的调用方法 详细说明

    libsvm该函数的调用方法 详细说明 本文地址: http://blog.csdn.net/caroline_wendy/article/details/26261173 须要载入(load)SVM ...

  6. printf那点事

    1.打印内存地址 #include<stdio.h> int main() { int a; printf("%p\n",&a); //%p打印地址,自己主动加 ...

  7. wordpress常见的问题

    nginx如webserver,wordpress上传主题错误 413 Request Entity Too Large 解决: vim /usr/local/nginx/conf/nginx.con ...

  8. JAXB 操作XML 与 Object

    Java Architecture for XML Binding) 是一个业界的标准,是一项能够依据XML Schema产生Java类的技术.是一种xml与object映射绑定技术标准. JDK5下 ...

  9. UVa753/POJ1087_A Plug for UNIX(网络流最大流)(小白书图论专题)

    解题报告 题意: n个插头m个设备k种转换器.求有多少设备无法插入. 思路: 定义源点和汇点,源点和设备相连,容量为1. 汇点和插头相连,容量也为1. 插头和设备相连,容量也为1. 可转换插头相连,容 ...

  10. GitHub版本控制

    版本控制-GitHub 前面几篇文章,我们介绍了Git的基本用法及Git服务器的搭建,本篇文章来学习一下如何使用GitHub.GitHub是开源的代码库以及版本控制库,是目前使用网络上使用最为广泛的服 ...