Commit 16cee65b authored by zhengke's avatar zhengke

s

parent 41cedddc
...@@ -21,8 +21,7 @@ ...@@ -21,8 +21,7 @@
width: auto; width: auto;
display: inline-block; display: inline-block;
margin: 0px auto; margin: 0px auto;
padding-top: 8px; padding: 10px 0;
min-height: 500px;
border: 1px solid #e5e5e5; border: 1px solid #e5e5e5;
position: relative; position: relative;
} }
...@@ -34,19 +33,19 @@ ...@@ -34,19 +33,19 @@
height: 20px; height: 20px;
margin: 0 5px; margin: 0 5px;
border: 1px solid #d1d1d1; border: 1px solid #d1d1d1;
cursor:default; cursor: default;
position:relative; position: relative;
} }
.seats-block .seat.selected { .seats-block .seat.selected {
display: inline-block; display: inline-block;
font-size: 12px; font-size: 12px;
width: 20px; width: 20px;
height: 20px; height: 20px;
margin: 0 5px; margin: 0 5px;
border: 1px solid #d1d1d1; border: 1px solid #d1d1d1;
background: url(/Scripts/Seat/images/selected.png) 0 1px no-repeat; background: url(/Scripts/Seat/images/selected.png) -5px 0 no-repeat;
} }
.seats-block .row-id-container { .seats-block .row-id-container {
width: 60px; width: 60px;
...@@ -194,29 +193,38 @@ ...@@ -194,29 +193,38 @@
display: none; display: none;
height: 19px; height: 19px;
padding: 0 4px; padding: 0 4px;
width:50px; width: 50px;
border:1px solid #d1d1d1; border: 1px solid #d1d1d1;
margin:0 0 6px 10px; margin: 0 0 6px 10px;
} }
._row_input { ._row_input {
width: 40px; width: 40px;
height: 20px; height: 20px;
border:1px solid #d1d1d1; border: 1px solid #d1d1d1;
margin:0 0 5px 10px; margin: 0 0 5px 10px;
} }
.showOneType, .showTwoType, .showThreeType { .showOneType, .showTwoType, .showThreeType {
display: block; display: block;
} }
.selected {
background-color:#000; .seatList {
opacity:0.6; width: 690px;
margin: auto;
text-align: left;
}
.seatList div {
display: inline-block;
}
.seatCked div {
margin-right: 20px;
} }
</style> </style>
</head> </head>
<body> <body>
<!--
<div style="width:100%;height:800px;"></div>
-->
<div id="seatBox"> <div id="seatBox">
<div class="choseContent seats-block clear"> <div class="choseContent seats-block clear">
<div class="row-id-container" data-bind="foreach:{ data: SeatData}"> <div class="row-id-container" data-bind="foreach:{ data: SeatData}">
...@@ -226,7 +234,8 @@ ...@@ -226,7 +234,8 @@
<div data-bind="foreach:{ data: SeatData , as: 'sItem'}"> <div data-bind="foreach:{ data: SeatData , as: 'sItem'}">
<div class="row" data-bind="foreach:{data:sItem.ColumnArray,as:'childItem'}"> <div class="row" data-bind="foreach:{data:sItem.ColumnArray,as:'childItem'}">
<span class="seat" data-bind="css:{'oneArea':childItem.SeatClassStr=='oneArea','twoArea':childItem.SeatClassStr=='twoArea', <span class="seat" data-bind="css:{'oneArea':childItem.SeatClassStr=='oneArea','twoArea':childItem.SeatClassStr=='twoArea',
'threeArea':childItem.SeatClassStr=='threeArea','specialArea':childItem.SeatClassStr=='specialArea','noSeat':childItem.SeatClassStr=='noSeat'}, 'threeArea':childItem.SeatClassStr=='threeArea','specialArea':childItem.SeatClassStr=='specialArea','noSeat':childItem.SeatClassStr=='noSeat',
'selected':childItem.IsReserved==1},
text:childItem.col,attr:{ data_row_id: childItem.rowIndex, data_column_id: childItem.columnIndex}"> text:childItem.col,attr:{ data_row_id: childItem.rowIndex, data_column_id: childItem.columnIndex}">
</span> </span>
</div> </div>
...@@ -246,14 +255,14 @@ ...@@ -246,14 +255,14 @@
</div> </div>
</div> </div>
</div> </div>
</div>
<div class="seatList">
<div>已选座位:</div>
<div class="seatCked"> <div class="seatCked">
</div> </div>
</div> </div>
</div> </div>
<div style="width:100%;text-align: center;">
<input type="button" class="normalBtn" data-bind="click: getSeat" value="获取座位">
</div>
<script> <script>
var SeatData = ko.observableArray(); var SeatData = ko.observableArray();
...@@ -265,37 +274,42 @@ ...@@ -265,37 +274,42 @@
function MyViewModel() { function MyViewModel() {
var self = this; var self = this;
/**
* 设置区域
* */
//获取数据
self.getSeat = function () {
console.log(SeatData(), '数据');
};
//第一次初始化 无数据默认生成
} }
ko.applyBindings(new MyViewModel()); ko.applyBindings(new MyViewModel());
$(document).ready(function () { $(document).ready(function () {
var dataList = [];
$(".seat").click(function () { $(".seat").click(function () {
$(this).addClass("selected"); var rowIndex = $(this).attr("data_row_id");
//排 var colIndex = $(this).attr("data_column_id");
var rowList = $(this).attr("data_row_id"); for (var i = 0; i < SeatData().length; i++) {
//列 if (SeatData()[i].rowOriIndex == rowIndex) {
var colList = $(this).html(); for (var j = 0; j < SeatData()[i].ColumnArray.length; j++) {
var obj = { if (SeatData()[i].ColumnArray[j].columnIndex == colIndex) {
row: rowList, if (SeatData()[i].ColumnArray[j].IsReserved == 0) {
col: colList SeatData()[i].ColumnArray[j].IsReserved = 1;
} else {
SeatData()[i].ColumnArray[j].IsReserved = 0;
}
}
}
}
}
if ($(this).hasClass('selected')) {
$(this).removeClass('selected');
} else {
$(this).addClass('selected');
} }
dataList.push(obj);
var temp = ''; var temp = '';
for (var i = 0; i < dataList.length; i++) { $(".seatCked").empty();
temp+='<div>第'+dataList[i].row+'排,第'+dataList[i].col+'列</div>' $(".seats-container span").each(function () {
} if ($(this).hasClass('selected')) {
$(".seatCked").html(temp); var colList = $(this).html();
console.log(dataList); var _rowIndex = $(this).attr('data_row_id');
temp += '<div>第' + _rowIndex + '排,第' + colList + '号</div>'
$(".seatCked").html(temp);
}
})
}) })
}); });
</script> </script>
</body> </body>
......
...@@ -62,7 +62,7 @@ ...@@ -62,7 +62,7 @@
.row_input { .row_input {
width: 40px; width: 40px;
height:20px; height: 20px;
margin-bottom: 5px; margin-bottom: 5px;
} }
...@@ -178,7 +178,7 @@ ...@@ -178,7 +178,7 @@
.seats-container { .seats-container {
float: left; float: left;
padding:0 25px; padding: 0 25px;
} }
#moveSelected { #moveSelected {
...@@ -190,11 +190,13 @@ ...@@ -190,11 +190,13 @@
left: 0; left: 0;
z-index: 999 z-index: 999
} }
.select-container { .select-container {
float:left; float: left;
width:100px; width: 100px;
height:100%; height: 100%;
} }
.SelectType { .SelectType {
height: 19px; height: 19px;
padding: 0 4px; padding: 0 4px;
...@@ -230,6 +232,13 @@ ...@@ -230,6 +232,13 @@
</select> </select>
</div> </div>
</div> </div>
<div class="seat_menu" style="position: fixed;display: none">
<button class="normalBtn" data-bind="click:function(data, event) { SetArea('A', data, event) }">设为甲区</button>
<button class="normalBtn" data-bind="click:function(data, event) { SetArea('B', data, event) }">设为乙区</button>
<button class="normalBtn" data-bind="click:function(data, event) { SetArea('C', data, event) }">设为丙区</button>
<button class="normalBtn" data-bind="click:function(data, event) { SetArea('D', data, event) }">设为特区</button>
<button class="normalBtn" data-bind="click:function(data, event) { SetArea('E', data, event) }">设为过道</button>
</div>
</div> </div>
</div> </div>
<div style="width:100%;text-align: center;"> <div style="width:100%;text-align: center;">
...@@ -240,13 +249,6 @@ ...@@ -240,13 +249,6 @@
<input type="button" class="normalBtn" id="selectArea" value="选择区域"> <input type="button" class="normalBtn" id="selectArea" value="选择区域">
<input type="button" class="normalBtn" id="resetNum" value="重设座位号"> <input type="button" class="normalBtn" id="resetNum" value="重设座位号">
</div> </div>
<div class="seat_menu" style="position: absolute;display: none">
<button class="normalBtn" data-bind="click:function(data, event) { SetArea('A', data, event) }">设为甲区</button>
<button class="normalBtn" data-bind="click:function(data, event) { SetArea('B', data, event) }">设为乙区</button>
<button class="normalBtn" data-bind="click:function(data, event) { SetArea('C', data, event) }">设为丙区</button>
<button class="normalBtn" data-bind="click:function(data, event) { SetArea('D', data, event) }">设为特区</button>
<button class="normalBtn" data-bind="click:function(data, event) { SetArea('E', data, event) }">设为过道</button>
</div>
<script> <script>
var SeatData = ko.observableArray(); var SeatData = ko.observableArray();
...@@ -491,10 +493,17 @@ ...@@ -491,10 +493,17 @@
$(document).bind('contextmenu', function (e) { $(document).bind('contextmenu', function (e) {
return false; return false;
}); });
$(".seat_menu").css({ "left": event.pageX, "top": event.pageY, "display": 'block' }); var _offTop = $(document).scrollTop();
$(".seat_menu").css({ "left": event.pageX, "top": event.pageY - _offTop, "display": 'block' });
}); });
} }
}); });
$(".seats-container").click(function () {
$(".seat_menu").css({ "display": "none" });
});
//鼠标抬起时计算遮罩的right 和 bottom,找出遮罩覆盖的块,关闭拖拽选中开关,清除遮罩数据 //鼠标抬起时计算遮罩的right 和 bottom,找出遮罩覆盖的块,关闭拖拽选中开关,清除遮罩数据
$(".seats-container").mouseup(function (event) { $(".seats-container").mouseup(function (event) {
moveSelected.style.bottom = Number(moveSelected.style.top.split('px')[0]) + Number(moveSelected.style.height.split('px')[0]) + 'px'; moveSelected.style.bottom = Number(moveSelected.style.top.split('px')[0]) + Number(moveSelected.style.height.split('px')[0]) + 'px';
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment