436 行
14 KiB
HTML
可执行文件
436 行
14 KiB
HTML
可执行文件
<!DOCTYPE html>
|
|
<html>
|
|
<!--[1.2.34]-->
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|
<title>商户进货单详情</title>
|
|
<link href="__PUBLIC__/Retail/css/base.css" rel="stylesheet">
|
|
<script src="__PUBLIC__/jquery/js/jquery-2.0.3.min.js"></script>
|
|
<link href="__PUBLIC__/bootstrap/css/bootstrap.min.css" rel="stylesheet">
|
|
<link href="__PUBLIC__/Retail/css/store.css" rel="stylesheet">
|
|
<link rel="stylesheet" type="text/css" href="__PUBLIC__/layui/css/layui.css"/>
|
|
<style>
|
|
.btn {
|
|
width: 88px;
|
|
background-color: #009688;
|
|
padding: 5px;
|
|
margin: 5px auto;
|
|
color: white;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.btn a {
|
|
color: white;
|
|
}
|
|
|
|
.btn span {
|
|
color: white;
|
|
}
|
|
|
|
/*#FF5722*/
|
|
.btn a.del {
|
|
color: white;
|
|
}
|
|
|
|
.mydel {
|
|
background-color: #FF5722;
|
|
}
|
|
|
|
.Business_tb1 table tr th {
|
|
height: 30px !important;
|
|
background-color: #D5e9ed;
|
|
color: #00a3d6;
|
|
}
|
|
|
|
.Business_tb1 table tr td {
|
|
/*border: none;*/
|
|
height: 100%;
|
|
position: relative;
|
|
/*background-color: white;*/
|
|
font-size: 12px;
|
|
}
|
|
|
|
.Business_tb1 table tr {
|
|
width: 100% !important;
|
|
}
|
|
|
|
.Business_tb1 table tr:nth-child(2n+1) {
|
|
/*background-color: pink;*/
|
|
}
|
|
|
|
.layui-form-item {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
flex-direction: row;
|
|
}
|
|
|
|
label {
|
|
margin-bottom: 0;
|
|
width: auto;
|
|
}
|
|
|
|
select {
|
|
height: 38px;
|
|
}
|
|
|
|
.delbtn {
|
|
color: #00a3d6;
|
|
}
|
|
|
|
.goodsinput {
|
|
width: 80px;
|
|
text-align: center;
|
|
}
|
|
|
|
.keywordinput {
|
|
width: 200px;
|
|
height: 40px;
|
|
box-sizing: border-box;
|
|
padding: 0px 10px;
|
|
}
|
|
|
|
.searchbtn {
|
|
/*width: 60px;*/
|
|
height: 40px;
|
|
padding: 0px 18px;
|
|
font-size: 14px;
|
|
text-align: center;
|
|
line-height: 40px;
|
|
background: #f55;
|
|
border: 0;
|
|
border-radius: 0 2px 2px 0;
|
|
margin: 0;
|
|
color: white;
|
|
}
|
|
|
|
.showgoodsitem {
|
|
width: 400px;
|
|
height: 400px;
|
|
position: absolute;
|
|
top: 100px;
|
|
left: calc(50% - 200px);
|
|
background-color: white;
|
|
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.6);
|
|
z-index: 400;
|
|
box-sizing: border-box;
|
|
padding: 20px;
|
|
}
|
|
|
|
.showgoodsitem input.keywordinput {
|
|
height: 28px;
|
|
}
|
|
|
|
.showgoodsitem .layui-form-label {
|
|
width: 90px;
|
|
}
|
|
|
|
body, html {
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: #f3f3f3;
|
|
}
|
|
|
|
.showgoodsitembox {
|
|
position: fixed;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: rgba(0, 0, 0, 0.1);
|
|
top: 0;
|
|
left: 0;
|
|
z-index: 450;
|
|
}
|
|
|
|
.showgoodsitembox2 {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.total {
|
|
width: 96%;
|
|
margin-left: 15px;
|
|
height: 80px;
|
|
margin-bottom: 40px;
|
|
margin-top: 10px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: flex-end;
|
|
align-items: flex-end;
|
|
box-sizing: border-box;
|
|
/*border:1px solid rgba(0,0,0,0.3);*/
|
|
padding: 10px 30px;
|
|
background-color: #f3f3f3;
|
|
}
|
|
|
|
.totalnum {
|
|
color: #00a3d6;
|
|
}
|
|
|
|
.import {
|
|
display: block;
|
|
width: 92px;
|
|
height: 40px;
|
|
opacity: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
|
|
input::-webkit-outer-spin-button,
|
|
input::-webkit-inner-spin-button {
|
|
-webkit-appearance: none;
|
|
}
|
|
|
|
input[type="number"] {
|
|
-moz-appearance: textfield;
|
|
}
|
|
|
|
[v-cloak] {
|
|
display: none
|
|
}
|
|
.sku_mask {
|
|
position: fixed;
|
|
top:0;
|
|
left:0;
|
|
width:100%;
|
|
height:100%;
|
|
background-color: rgba(0,0,0,0.7);
|
|
z-index:1000;
|
|
}
|
|
.gA_inner {
|
|
position: absolute;
|
|
top:0;
|
|
bottom:0;
|
|
right:0;
|
|
left:0;
|
|
width:80%;
|
|
margin:0 auto ;
|
|
z-index:1000;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body style="cursor: pointer;box-sizing: border-box;padding-top: 30px;">
|
|
<div id="app" style="position: relative;with:100%;height: 100%;" v-cloak>
|
|
<form class="" style="display: flex;height: 100%;flex-direction: column;">
|
|
<div class="Business"
|
|
style="flex: 1;overflow-y: hidden;display: flex;flex-direction:column;box-sizing: border-box;"
|
|
id="printhtml">
|
|
<div class="Business_tb1" style="height: 100%;">
|
|
<table border="0" cellspacing="0" cellpadding="0" class="layui-table"
|
|
style="height:100%;position: relative;display: flex;flex-direction: column;overflow-y: auto;">
|
|
<tr style="height: 30px;position: relative;top:0;left:0;" id="tabletitle">
|
|
<th>序号</th>
|
|
<th>商品名称</th>
|
|
<th>货号</th>
|
|
<th>条码</th>
|
|
<th>实际库存进货量</th>
|
|
<th>操作</th>
|
|
</tr>
|
|
<template v-for="(item,index) in goodsarr">
|
|
<tr style="height: 30px;">
|
|
<td>{{index+1}}</td>
|
|
<td>
|
|
{{item.goods_name}}
|
|
</td>
|
|
<td>
|
|
{{item.good_number}}
|
|
</td>
|
|
<td>
|
|
{{item.goods_code}}
|
|
</td>
|
|
<td>
|
|
{{item.num}}
|
|
</td>
|
|
<td>
|
|
<div @click="sku_details(index)" class="delbtn" v-if="item.attribute == 2">规格</div>
|
|
<div class="delbtn" v-else-if="item.attribute == 1">无规格</div>
|
|
</td>
|
|
</tr>
|
|
</template>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="total">
|
|
<div class="layui-form-item">
|
|
<input type="button" value="<<返回进货单" class="searchbtn" @click="doconfirm">
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<div class="sku_mask" v-if="skudetail" @click.stop="skudetail=false">
|
|
<div class="gA_inner" @click="skudetail=true" style="top:20px;width: 800px;overflow: auto;height: 600px;background: #fff">
|
|
<div >
|
|
<table class="layui-table" style="height: 100%">
|
|
<colgroup>
|
|
<col width="10%">
|
|
<col v-for="(title,index) in skuAttr" width="10%">
|
|
<col width="10%">
|
|
<col width="10%">
|
|
<col width="10%">
|
|
<col width="10%">
|
|
<col width="10%">
|
|
<col width="10%">
|
|
<col width="10%">
|
|
<col width="10%">
|
|
</colgroup>
|
|
<thead>
|
|
<tr>
|
|
<th style="padding: 0;text-align: center;">序号</th>
|
|
<th v-for="(title,index) in skuAttr">{{title.name}}</th>
|
|
<th>规格条码</th>
|
|
<th>零售价</th>
|
|
<th>商城价</th>
|
|
<th>商城会员价</th>
|
|
<th>单件对应库存</th>
|
|
<th>库存</th>
|
|
<th>进货量</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="attrData">
|
|
<tr v-for="(list,index) in skuList">
|
|
<td style="padding: 0;text-align: center;">{{index+1*1}}</td>
|
|
<td v-for="(name,i) in list.name">
|
|
<span>{{name}}</span>
|
|
</td>
|
|
<td>
|
|
{{list.sku_code}}
|
|
</td>
|
|
<td>
|
|
{{list.retail_price}}
|
|
</td>
|
|
<td>
|
|
{{list.online_price}}
|
|
</td>
|
|
<td>
|
|
{{list.shop_mem_price}}
|
|
</td>
|
|
<td>
|
|
{{list.sku_num}}
|
|
</td>
|
|
<td>
|
|
{{list.goods_num}}
|
|
</td>
|
|
<td>
|
|
<input type="number" v-model="list.num" disabled="disabled">
|
|
</td>
|
|
</tr>
|
|
<tr v-if="!skuList.length">
|
|
<td style="text-align: center;height: 40px;" :colspan="10+skuAttr.length">未选择规格</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<iframe id="myiframe" width="100%" height="100%" style="display: none" src="{:U('printflow')}?id={$order['id']}"
|
|
frameborder="0" scrolling="auto"></iframe>
|
|
</div>
|
|
|
|
<input type="hidden" id="supplier_idhide" value="{$order['supplier_id']}">
|
|
<input type="hidden" id="floworderid" value="{$id}">
|
|
<script type="text/javascript" src="__PUBLIC__/layui/layui.js"></script>
|
|
<script type="text/javascript" src="__PUBLIC__/flow/js/vue.js"></script>
|
|
<script type="text/javascript">
|
|
layui.use(['layer', 'form'], function () {
|
|
var layer = layui.layer;
|
|
var app = new Vue({
|
|
el: '#app',
|
|
data: function () {
|
|
return {
|
|
supplier_id: $('#supplier_idhide').val(),
|
|
myfile: "",
|
|
dismoney: "{$order['dismoney']}",
|
|
showgoods: false,
|
|
floworderid: $('#floworderid').val(),
|
|
canchangenum: false,
|
|
settimeouttimer: "",
|
|
shade: false,
|
|
keyword: "",
|
|
shade2: false,
|
|
searchgoodsinfo: {},
|
|
goodsarr: [],
|
|
skudetail: false,
|
|
skuAttr: [],
|
|
skuList: [],
|
|
}
|
|
},
|
|
created: function () {
|
|
// console.log(this.supplier_id);
|
|
$('.showgoodsitembox').css({'opacity': 1});
|
|
this.getgoodsarr();
|
|
},
|
|
methods: {
|
|
getgoodsarr: function () {
|
|
var floworderid = this.floworderid;
|
|
var app = this;
|
|
$.ajax({
|
|
url: "{:U('purchase_detail_list')}",
|
|
data: {
|
|
floworderid: floworderid
|
|
},
|
|
type: 'post',
|
|
success: function (res) {
|
|
if (res.status == 1) {
|
|
app.goodsarr = res.data;
|
|
} else {
|
|
app.goodsarr = [];
|
|
}
|
|
},
|
|
error: function (error) {
|
|
layer.msg('错误了。。。')
|
|
}
|
|
})
|
|
},
|
|
//规格
|
|
sku_details: function (index) {
|
|
var goods_bank_id = this.goodsarr[index].id
|
|
var that = this;
|
|
$.ajax({
|
|
url: "{:U('purchase_sku_details')}",
|
|
data: {goods_bank_id: goods_bank_id},
|
|
type: "post",
|
|
success: function (res) {
|
|
if (res.status == 1) {
|
|
that.skuAttr = res.info.attr;
|
|
that.skuList = res.info.list;
|
|
that.skudetail = true;
|
|
}
|
|
}
|
|
})
|
|
},
|
|
// 返回进货单
|
|
doconfirm: function () {
|
|
var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
|
|
parent.layer.close(index); //再执行关闭
|
|
//window.location.replace("{:U('purchase')}");
|
|
},
|
|
},
|
|
computed: {
|
|
floworderdata: function () {
|
|
var allnum = 0;
|
|
var allgivenum = 0;
|
|
var allmoney = 0;
|
|
var goodsarr = this.goodsarr;
|
|
for (var i = 0; i < goodsarr.length; i++) {
|
|
allnum = allnum + goodsarr[i]['num'] * 1;
|
|
allgivenum = allgivenum + goodsarr[i]['givenum'] * 1;
|
|
allmoney = allmoney + goodsarr[i]['num'] * goodsarr[i]['purch_price'];
|
|
}
|
|
allnum = Math.round(allnum);
|
|
allgivenum = Math.round(allgivenum);
|
|
allmoney = Math.round(allmoney * 100) / 100;
|
|
return {
|
|
allnum: allnum,
|
|
allgivenum: allgivenum,
|
|
allmoney: allmoney
|
|
};
|
|
}
|
|
}
|
|
})
|
|
})
|
|
</script>
|
|
</body>
|
|
</html>
|