@{
|
ViewBag.Title = "OutItemBoard";
|
Layout = "~/Views/Shared/_LayoutVue.cshtml";
|
}
|
@section head{
|
<link href="~/Content/OutItemBoard/CSS/style.css" rel="stylesheet" />
|
<style type="text/css">
|
.el-carousel__arrow {
|
display: none;
|
}
|
|
.el-carousel__indicators {
|
position: fixed;
|
}
|
</style>
|
}
|
<div class="wrapper" id="OutItemBoard" v-cloak>
|
<div class="head">
|
<div class="fL"><h2>宁波三生生物科技有限公司</h2></div>
|
<div class="fR"><span>{{year}}年{{month}}月{{date}}日</span><span style="margin:0 15px;">{{dayByDay}}</span><span>{{hour}}：{{minutes}}：{{seconds}}</span></div>
|
<div class="clear"></div>
|
</div>
|
<div class="content">
|
<div class="tableList" id="tableList">
|
<el-carousel v-bind:interval="5000" arrow="always" v-bind:height="itemHeight+'px'">
|
<el-carousel-item v-for="m in outItemBoardData">
|
<table width="100%" border="0" cellspacing="0" v-for="n in m.d">
|
<thead>
|
<tr>
|
<td align="left" colspan="3">
|
<div><label>发货单号：</label><span>{{n.OpNo}}</span></div>
|
<div v-if="n.FromNo"><label>来源单号：</label><span>{{n.FromNo}}</span></div>
|
<div><span class="state" style="color:#E9CC01">{{n.PickState}}</span></div>
|
</td>
|
<td align="right" colspan="3">
|
<div><label>客户名称：</label><span>{{n.Customer}}</span></div>
|
</td>
|
</tr>
|
</thead>
|
<tbody>
|
<tr>
|
<th width="15%" align="center">物料编码</th>
|
<th width="23%" align="center">物料名称</th>
|
<th width="22%" align="center">规格型号</th>
|
<th width="15%" align="center">批次</th>
|
<th width="13%" align="center">数量</th>
|
<th width="12%" align="center">单位</th>
|
</tr>
|
<tr v-for="item in n.Items">
|
<td align="center">{{item.ItemCode}}</td>
|
<td align="center">{{item.ItemName}}</td>
|
<td align="center">{{item.ItemModel}}</td>
|
<td align="center">{{item.ProductNo}}</td>
|
<td align="center">{{item.Qty}}</td>
|
<td align="center">{{item.Unit}}</td>
|
</tr>
|
</tbody>
|
</table>
|
</el-carousel-item>
|
</el-carousel>
|
</div>
|
</div>
|
|
<div class="footer">
|
<div class="fR"><img src="~/Content/OutItemBoard/Images/hhLogo.png" style="width:20px; height:20px;" /><span style="line-height:20px;">汉和智能WMS</span></div>
|
</div>
|
|
</div>
|
@section scripts{
|
<script type="text/javascript">
|
$(function () {
|
var height = $("#tableList").height();
|
$(".alarm").css("height", height);
|
$(".content .tableList").css("height", $(window).height() - 130);
|
$(window).resize(function () {
|
var height = $("#tableList").height();
|
$(".alarm").css("height", height);
|
$(".content .tableList").css("height", $(window).height() - 130);
|
})
|
});
|
new Vue({
|
mixins: [useAutoHeight],
|
computed: {
|
itemHeight: function () {
|
return this.autoHeight - 138;
|
},
|
dayByDay: function () {
|
switch (this.day) {
|
case 0: return '星期天';
|
case 1: return '星期一';
|
case 2: return '星期二';
|
case 3: return '星期三';
|
case 4: return '星期四';
|
case 5: return '星期五';
|
case 6: return '星期六';
|
}
|
return '';
|
},
|
},
|
el: '#OutItemBoard',
|
data: {
|
year: (new Date()).getFullYear(),
|
month: ((new Date()).getMonth() + 1) < 10 ? "0" + ((new Date()).getMonth() + 1) : (new Date()).getMonth() + 1,
|
date: ((new Date()).getDate()) < 10 ? "0" + ((new Date()).getDate()) : (new Date()).getDate(),
|
day: (new Date()).getDay(),
|
hour: ((new Date()).getHours()) < 10 ? "0" + ((new Date()).getHours()) : (new Date()).getHours(),
|
minutes: ((new Date()).getMinutes()) < 10 ? "0" + ((new Date()).getMinutes()) : (new Date()).getMinutes(),
|
seconds: ((new Date()).getSeconds()) < 10 ? "0" + (new Date()).getSeconds() : (new Date()).getSeconds(),
|
outItemBoardData: [],
|
outItemData: [],
|
},
|
methods: {
|
loadOutItemBoard: function () {
|
var $this = this;
|
ajaxManage({
|
url: "@Url.Action("OutItemBoardData")",
|
success: function (result) {
|
if (result.Success) {
|
var currentData = result.Data;
|
if (JSON.stringify(currentData) === JSON.stringify($this.outItemData))
|
return;
|
$this.outItemData = result.Data;
|
$this.outItemBoardData = [];
|
var temp = [];
|
result.Data.forEach(function (n, i) {
|
temp.push(n);
|
if ((i + 1) % 2 == 0) {
|
$this.outItemBoardData.push({
|
d: temp
|
});
|
temp = [];
|
} else {
|
if (i == result.Data.length - 1) {
|
$this.outItemBoardData.push({
|
d: temp
|
});
|
}
|
}
|
});
|
}
|
else
|
wms.error(result.Msg);
|
}
|
});
|
}
|
},
|
mounted: function () {
|
var $this = this;
|
$this.loadOutItemBoard();
|
setInterval(function () {
|
var dt = new Date();
|
$this.year = dt.getFullYear();
|
$this.month = (dt.getMonth() + 1) < 10 ? "0" + (dt.getMonth() + 1) : dt.getMonth() + 1;
|
$this.date = (dt.getDate()) < 10 ? "0" + (dt.getDate()) : dt.getDate();
|
$this.day = dt.getDay();
|
$this.hour = (dt.getHours()) < 10 ? "0" + (dt.getHours()) : dt.getHours();
|
$this.minutes = (dt.getMinutes()) < 10 ? "0" + (dt.getMinutes()) : dt.getMinutes();
|
$this.seconds = (dt.getSeconds()) < 10 ? "0" + (dt.getSeconds()) : dt.getSeconds();
|
}, 1000);
|
setInterval(function () {
|
$this.loadOutItemBoard();
|
}, 2000);
|
}
|
});
|
</script>
|
}
|
