使用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. android利用jdk制作签名

    Apk签名首先要有一个keystore的签名用的文件. keystore是由jdk自带的工具keytool生成的.详细生成方式參考一下: 開始->执行->cmd->cd 到你安装的j ...

  2. POJ3617 Best Cow Line 馋

    虽然这个问题很简单,但非常好,由于过程是很不错的.发展思路的比较 并鼓励人们,不像有些贪心太偏,推动穷人,但恼人 鉴于长N弦S,然后又空字符串STR.每当有两个选择 1:删S增加虚假的第一要素STR于 ...

  3. android 防止多次点击提交

    版权声明:本文博客原创文章.博客,未经同意,不得转载.

  4. PC远程调试设备(转)

    我们在移动端进行前端开发时,会遇到一个让人头痛但不得不面对的问题——调试. 在 PC 机器上,我们有功能强大的 Chrome DevTools.Firebug,即便是老版本的 IE ,我们也可以安装微 ...

  5. 二十9天 月出冲击黑鸟 —Spring的AOP_AspectJ @annotation

    6月14日,阴转雨. "四面垂杨十里荷,向云何处最花多, 画楼南畔夕阳和.天气乍凉人寂寞, 光阴须得酒消磨,且来花里听笙歌." 面向切面的框架AspectJ邂逅Spring,不仅造 ...

  6. AIX6.1/11.2.0.3在有关数据库SWAP一个BUG

    昨天南京到客户服务数据库的优化调整,其中新上线,经过审查alert.log当日志现在是在过去一段时间内取得,每隔几个小时的时间滞后,班会报似的内容: Thu Aug 21 09:01:26 2014 ...

  7. 源码编译安装 MySQL 5.5.x 实践(转)

    1.安装cmakeMySQL从5.5版本开始,通过./configure进行编译配置方式已经被取消,取而代之的是cmake工具.因此,我们首先要在系统中源码编译安装cmake工具. # wget ht ...

  8. JAVA连接ACCESS、MYSQL、SQLSEVER、ORACLE数据库

    . 概要 1.1 JDBC概念 JDBC(Java Database Connectivity)是Java语言为了支持SQL功能而提供的与数据库连接的用户的接口.JDBC中包含了一组由(Java)语言 ...

  9. VARCHAR2 他们占几个字节? NLS_LENGTH_SEMANTICS,nls_language

    ORACLE初始化参数:NLS_LENGTH_SEMANTICS 初始化參数NLS_LENGTH_SEMANTICS用于指定CHAR列或VARCHAR2列的长度定义方式,默认值为BYTE. 当设置该參 ...

  10. Linux在iptables教程基本应用防火墙

    iptables它是Linux防火墙软件经常使用,下面说一下iptables设备.删除iptables规则.iptables只要打开指定的port.iptables屏蔽指定ip.ip科和解锁.删除添加 ...