Commit 6be56460 authored by 黄媛媛's avatar 黄媛媛

新增采购列表和详情

parent ce93e134
......@@ -101,13 +101,13 @@
</td>
<td :class="index1==tableData.length-1?'lastTdRight':''" :rowspan="item.DetailList.length" v-if="index==0">
<el-tooltip class="item" effect="dark" content="编辑" placement="top">
<img v-if="item.StockOutState==3" @click="Edit(item)" style="width:24px;height:24px" src="../../assets/img/edit.png" alt="">
<img v-if="item.StockOutState==3 && jumptype==1" @click="Edit(item)" style="width:24px;height:24px" src="../../assets/img/edit.png" alt="">
</el-tooltip>
<el-tooltip class="item" effect="dark" content="删除" placement="top">
<img v-if="item.StockOutState==2" @click="Delete(item)" style="width:24px;height:24px" src="../../assets/img/delete.png" alt="">
<img v-if="item.StockOutState==2 && jumptype==1" @click="Delete(item)" style="width:24px;height:24px" src="../../assets/img/delete.png" alt="">
</el-tooltip>
<el-tooltip class="item" effect="dark" content="取消出库单" placement="top">
<img v-show="item.StockOutState==1" @click="Quxiao(item)" style="width:24px;height:24px" src="../../assets/img/qx.png" alt="">
<img v-show="item.StockOutState==1 && jumptype==1" @click="Quxiao(item)" style="width:24px;height:24px" src="../../assets/img/qx.png" alt="">
</el-tooltip>
<!-- <el-tooltip class="item" effect="dark" content="恢复出库单" placement="top">
<span v-show="item.StockOutState==2" @click="Huifu(item)">恢复入库单</span>
......@@ -331,6 +331,7 @@ export default {
EndTime:'',
WarehouseId:'',
EmployeeId:'',
Id:0,
},
addMsg:{
Id:0,
......@@ -363,7 +364,8 @@ export default {
SuppliesNum:"",
BrandName:'',
CategoryId:'',
SupplierName:''
SupplierName:'',
},
wuliaodig:false,
wlcheckList:[],
......@@ -377,10 +379,17 @@ export default {
EmployeeList1:[],
EmployeeList2:[],
EmName:'',
jumptype:1,
}
},
created(){
// this.tableHeight=document.body.clientHeight-40-66-87;
if(this.$route.query.type){
this.jumptype = this.$route.query.type;
this.msg.Id = this.$route.query.ID;
}
},
mounted(){
this.getList();
......
......@@ -54,8 +54,8 @@
<table v-loading="loading" style="margin-top:10px" class="myTable noHoverTable" border="0" cellspacing="0" cellpadding="0">
<thead>
<th width="75">入库状态</th>
<th>入库单编码</th>
<th>入库时间</th>
<th>入库单编码</th>
<th>仓库名称</th>
<th>供应商名称</th>
<th>耗材名称</th>
......@@ -77,11 +77,11 @@
<span class="ColorSpan greenSpan" v-if="item.StockInState==1"></span>
{{item.StockInStateStr}}
</td>
<td :rowspan="item.DetailList.length" v-if="index==0">{{item.StockInNum}}</td>
<td :rowspan="item.DetailList.length" v-if="index==0">{{item.StockInDate}}</td>
<td :rowspan="item.DetailList.length" v-if="index==0">{{item.StockInNum}}</td>
<td :rowspan="item.DetailList.length" v-if="index==0">{{item.WareHouseName}}</td>
<td :rowspan="item.DetailList.length" v-if="index==0">{{item.SupplierName}}</td>
<td>{{delist.SuppliesName}}</td>
<td style="width:340px">{{delist.SuppliesName}}</td>
<td>{{delist.SuppliesNum}}</td>
<td>{{delist.CategoryName}}</td>
<td>{{delist.BrandName}}</td>
......
......@@ -116,7 +116,10 @@ export default {
res => {
this.loading = false;
if (res.data.resultCode === 1) {
if(res.data.data!=null){
this.tableData = res.data.data;
}
} else {
this.Error(res.data.message);
......
<template>
<div class="procurementDetails">
<div class="routerTitle">
<span class="pageTitle">采购详情 <span @click="Backto" style="position:relative;top:-5px" class="backTo">返回</span></span>
<span
style="display:inline-flex;align-items:center;cursor: pointer;"
class="f12 cd6"
>
<span style="margin-right:5px"></span>
</span>
</div>
<div class="padContent">
<div class="xiangq">
<div>
<span class="topkuang">仓库名称: {{tableData.WareHouseName}}</span>
<span class="topkuang">备注: {{tableData.Remark}}</span>
</div>
</div>
<div>
<vxe-table stripe style="margin-top:15px" :loading="loading"
:data="tableData.DetailList">
<el-table-column prop="Id" label="ID" width="60"></el-table-column>
<el-table-column prop="ImageList" label="封面图" width="80" align='center'>
<template slot-scope="scope">
<img :src="scope.row.MaterialModel.ImageList[0]" alt="" style="width: 50px; height: 50px;">
</template>
</el-table-column>
<el-table-column prop="Name" label="商品名称" >
<template slot-scope="scope">
<span>{{scope.row.MaterialModel.Name}}</span>
</template>
</el-table-column>
<el-table-column prop="GoodsSpecificationList" label="规格" >
<template slot-scope="scope">
<span v-for="(x,y) in scope.row.MaterialModel.GoodsSpecificationList" :key="y">{{x}} <span v-if="scope.row.MaterialModel.GoodsSpecificationList.length !== y+1"> , </span></span>
</template>
</el-table-column>
<el-table-column prop="Number" label="采购数量" width="80"></el-table-column>
<el-table-column prop="StockInNum" label="已入数量" width="80">
<template slot-scope="scope">
<span>{{scope.row.StockInNum!=null?scope.row.StockInNum:0}}</span>
</template>
</el-table-column>
<vxe-table-column field="Id" title="ID" width='60'></vxe-table-column>
<vxe-table-column field="GoodsName" title="封面图" width='80'>
<template v-slot="{ row }">
<img :src="row.MaterialModel.ImageList[0]" alt="" style="width: 50px; height: 50px;">
</template>
</vxe-table-column>
<vxe-table-column field="Name" title="商品名称" >
<template v-slot="{ row }">
<span>{{row.MaterialModel.Name}}</span>
</template>
</vxe-table-column>
<vxe-table-column field="GoodsSpecificationList" title="规格" width='450' >
<template v-slot="{ row }">
<span v-for="(x,y) in row.MaterialModel.GoodsSpecificationList" :key="y">{{x}} <span v-if="row.MaterialModel.GoodsSpecificationList.length !== y+1"> , </span></span>
</template>
</vxe-table-column>
<vxe-table-column field="Number" title="采购数量" width='150'></vxe-table-column>
<vxe-table-column field="StockInNum" title="已入数量" width='150'>
<template v-slot="{ row }">
<span>{{row.StockInNum!=null?row.StockInNum:0}}</span>
</template>
</vxe-table-column>
</vxe-table>
</div>
</div>
</div>
</template>
<script>
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
name: "procurementDetails",
data() {
return {
loading:false,
tableData:[],
morequery: false,
total:0,
};
},
mounted() {
this.getList();
},
methods: {
Backto(){
this.$router.push({
path: "/procurementList"
});
},
getList() {
this.loading = true;
this.apiJavaPost(
"/api/Supplies/GetProcurementInfo",
{ProcurementId:this.$route.query.ID},
res => {
this.loading = false;
if (res.data.resultCode === 1) {
if(res.data.data!=null){
this.tableData = res.data.data;
}
} else {
this.Error(res.data.message);
}
},
null
);
},
currentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
}
};
</script>
<style>
.procurementDetails .MyEditForm .baseform .el-form-item:nth-child(4n) {
margin-right: 0;
}
.procurementDetails .zczt1 {
background: #ffe4d5;
color: #ffa87c;
}
.procurementDetails .zczt2 {
background: #beeff0;
color: #089bab;
}
.procurementDetails .zczt3 {
background: #ffd6d5;
color: #ff7874;
}
.procurementDetails .zczt4 {
background: #d7d6ff;
color: #7b78ff;
}
.procurementDetails .Commonzczt {
display: inline-block;
width: 24px;
height: 24px;
line-height: 24px;
text-align: center;
border-radius: 50%;
font-size: 12px;
font-family: "Microsoft YaHei";
}
.procurementDetails {
width: 100%;
height: 100%;
}
.procurementDetails .topkuang{
padding: 5px 10px;
border:1px solid #e2e2e2;
background: #e2e2e2;
border-radius: 15px;
margin-right: 25px;
}
.procurementDetails .xiangq{
padding: 15px 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.procurementDetails .butoons{
/* float: right; */
margin-right: 10px;
}
</style>
<template>
<div class="procurementList">
<div class="routerTitle">
<span class="pageTitle">采购列表</span>
<span @click="morequery = !morequery" style="display:inline-flex;align-items:center;cursor: pointer;"
class="f12 cd6">
<span style="margin-right:5px">高级查询</span>
<img v-show="!morequery" style="width:12px;height:12px;" src="../../assets/img/more.png" alt="" />
<img v-show="morequery" class="roatImg" style="width:12px;height:12px" src="../../assets/img/more.png" alt="" />
</span>
<span @click="msg.pageIndex=1,getList()" style="margin-left:20px" class="chaxunSpan"
>查询</span
>
</div>
<div class="padContent">
<ul v-show="morequery" class="queryul">
<li>
<el-input
class="w200"
size="small"
v-model="msg.GoodsName"
placeholder="商品名称"
></el-input>
</li>
<li>
<el-select size="small" v-model="msg.StockInStatus" >
<el-option v-for="item in options" :key="item.ID" :label="item.Name" :value="item.ID">
</el-option>
</el-select>
</li>
<li>
<el-date-picker
v-model="dateList"
type="daterange"
range-separator="至"
value-format="yyyy-MM-dd"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</li>
</ul>
<div>
<vxe-table stripe style="margin-top:15px" :loading="loading" :data="tableData">
<vxe-table-column field="Id" title="ID"></vxe-table-column>
<vxe-table-column field="WareHouseName" title="仓库名称"></vxe-table-column>
<vxe-table-column field="TotalCostMoney" title="总价格" width="150"></vxe-table-column>
<vxe-table-column field="TotalNumber" title="总数量" width="150"></vxe-table-column>
<vxe-table-column field="FinanceId" title="绑定财务单据id" width="150"></vxe-table-column>
<vxe-table-column field="Remark" title="备注" width="260"></vxe-table-column>
<vxe-table-column field="Name" title="入库状态" width="150">
<template v-slot="{ row }">
<span v-if="row.StockInStatus==1">未入库</span>
<span v-if="row.StockInStatus==2">部分入库</span>
<span v-if="row.StockInStatus==3">全部入库</span>
</template>
</vxe-table-column>
<vxe-table-column field="CreateDate" title="创建时间"></vxe-table-column>
<vxe-table-column field="CreateDate" title="操作" width="150">
<template v-slot="{ row }">
<el-tooltip class="item" effect="dark" content="查看详情" placement="top" >
<img @click="SeeDetails(row,'/procurementDetails')" style="width:24px;height:24px;margin-right:10px;" src="../../assets/img/chakan.png" alt="" />
</el-tooltip>
</template>
</vxe-table-column>
</vxe-table>
<el-pagination @current-change="currentChange" background :page-size="msg.pageSize" layout="prev, pager, next"
:current-page.sync="msg.pageIndex" :total="total">
</el-pagination>
</div>
</div>
</div>
</template>
<script>
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
name: "procurementList",
data() {
return {
loading: false,
tableData: [],
morequery: false,
dateList: [],
options:[
{'ID':0,'Name':'全部'},{'ID':1,'Name':'未入库'}, {'ID':2,'Name':'部分入库'}, {'ID':3,'Name':'已入库'}
],
msg: {
pageIndex: 1,
pageSize: 15,
GoodsName: '',
StartTime: '',
EndTime:'',
StockInStatus:0,
},
total: 0,
};
},
mounted() {
this.getList();
},
methods: {
SeeDetails(item,path){
this.$router.push({
path: path,
query: {
ID:item.Id
}
});
},
getList() {
if (this.dateList && this.dateList.length > 0) {
this.msg.StartTime = this.dateList[0];
this.msg.EndTime = this.dateList[1];
} else {
this.msg.StartTime = "";
this.msg.EndTime = "";
}
this.loading = true;
this.apiJavaPost(
"/api/Supplies/GetProcurementPageList",
this.msg,
res => {
this.loading = false;
if (res.data.resultCode === 1) {
this.tableData = res.data.data.pageData;
this.total = res.data.data.count;
} else {
this.Error(res.data.message);
}
},
null
);
},
currentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
}
};
</script>
<style>
.procurementList .MyEditForm .baseform .el-form-item:nth-child(4n) {
margin-right: 0;
}
.procurementList .zczt1 {
background: #ffe4d5;
color: #ffa87c;
}
.procurementList .zczt2 {
background: #beeff0;
color: #089bab;
}
.procurementList .zczt3 {
background: #ffd6d5;
color: #ff7874;
}
.procurementList .zczt4 {
background: #d7d6ff;
color: #7b78ff;
}
.procurementList .Commonzczt {
display: inline-block;
width: 24px;
height: 24px;
line-height: 24px;
text-align: center;
border-radius: 50%;
font-size: 12px;
font-family: "Microsoft YaHei";
}
.procurementList {
width: 100%;
height: 100%;
}
.outBand_div{
width:24px;
height:24px;
border-radius: 6px;
text-align: center;
line-height: 24px;
background-color: #D7D6FF;
color:#7B78FF;
display:inline-block;
}
.procurementList .vxe-cell{
display: flex;
margin:5px 0;
}
</style>
......@@ -91,6 +91,18 @@ export default {
                    path: '/outboundDetails', 
                    name: 'outboundDetails',
                    component: resolve => require(['@/components/assetsman/outboundDetails'], resolve),
            },
// 采购列表
{
                    path: '/procurementList', 
                    name: 'procurementList',
                    component: resolve => require(['@/components/assetsman/procurementList'], resolve),
            },
//采购详情
{
                    path: '/procurementDetails', 
                    name: 'procurementDetails',
                    component: resolve => require(['@/components/assetsman/procurementDetails'], resolve),
            },
// 派发&退库
{
......
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