mirror of
https://gitee.com/hzchunfen/erp.git
synced 2025-11-30 22:20:45 +00:00
133 lines
3.7 KiB
Vue
133 lines
3.7 KiB
Vue
<template>
|
||
<div class="pageBox">
|
||
<div class="cardBox">
|
||
<div class="searchBox">
|
||
<div class="row">
|
||
<span>sku标题：</span>
|
||
<el-input v-model="filter.title" clearable></el-input>
|
||
</div>
|
||
<div class="row">
|
||
<span>商品编号：</span>
|
||
<el-input v-model="filter.external_sku_id" clearable></el-input>
|
||
</div>
|
||
<div class="row">
|
||
<span>创建时间：</span>
|
||
<el-date-picker
|
||
v-model="addTime"
|
||
type="datetimerange"
|
||
range-separator="-"
|
||
start-placeholder="开始时间"
|
||
end-placeholder="结束时间"
|
||
value-format="yyyy-MM-dd HH:mm:ss"
|
||
style="width: 340px">
|
||
</el-date-picker>
|
||
</div>
|
||
<div class="row">
|
||
<el-button type="primary" icon="el-icon-search" @click="handleSearch">筛选</el-button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<el-card>
|
||
<el-table v-loading="loading" :data="procureList" style="width: 100%" border>
|
||
<el-table-column prop="sku_id" label="商品id" width="80" align="center" />
|
||
<el-table-column prop="goods_sku.title" label="商品标题" />
|
||
<el-table-column prop="external_sku_id" label="商品编号" />
|
||
<el-table-column prop="num" label="采购数量" />
|
||
<el-table-column prop="cost" label="采购成本" />
|
||
<el-table-column prop="buyer_name" label="采购人名称" />
|
||
<el-table-column prop="status" label="状态" />
|
||
<el-table-column prop="expire_time" label="保质期时间" />
|
||
<el-table-column prop="supplier_name" label="供应商">
|
||
<template slot-scope="scope">
|
||
<span v-if="scope.row.supplier_name">{{ scope.row.supplier_name }}（{{scope.row.supplier_id}}）</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column prop="created_at" label="创建时间" align="center" />
|
||
</el-table>
|
||
<div class="page-pagination">
|
||
<el-pagination
|
||
@size-change="handleSizeChange"
|
||
@current-change="handleCurrentChange"
|
||
:current-page="page"
|
||
:page-sizes="[15, 30, 50, 100]"
|
||
:page-size="pageSize"
|
||
layout="prev, pager, next, jumper, sizes, total"
|
||
:total="total">
|
||
</el-pagination>
|
||
</div>
|
||
</el-card>
|
||
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { getPurchaseLog } from "@/api/supplyChain"
|
||
export default {
|
||
data() {
|
||
return {
|
||
loading: false,
|
||
page: 1,
|
||
pageSize: 15,
|
||
total: 0,
|
||
procureList: [],
|
||
filter: {
|
||
title: '',
|
||
external_sku_id: ''
|
||
},
|
||
addTime: []
|
||
}
|
||
},
|
||
methods: {
|
||
fetchList() {
|
||
this.loading = true
|
||
let params = {
|
||
page: this.page,
|
||
per_page: this.pageSize,
|
||
...this.filter,
|
||
start_time: this.addTime ? this.addTime[0] : '',
|
||
end_time: this.addTime ? this.addTime[1] : ''
|
||
}
|
||
getPurchaseLog(params).then((res) => {
|
||
this.procureList = res.data.data
|
||
this.total = res.data.meta.total
|
||
this.loading = false
|
||
}).catch(() => {
|
||
this.loading = false
|
||
})
|
||
},
|
||
handleSizeChange(val) {
|
||
this.page = 1
|
||
this.pageSize = val
|
||
this.fetchList()
|
||
},
|
||
handleCurrentChange(val) {
|
||
this.page = val
|
||
this.fetchList()
|
||
},
|
||
handleSearch() {
|
||
this.page = 1
|
||
this.fetchList()
|
||
}
|
||
},
|
||
mounted() {
|
||
this.fetchList()
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.searchBox{
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
white-space: nowrap;
|
||
.row{
|
||
font-size: 14px;
|
||
margin-bottom: 20px;
|
||
margin-right: 15px;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
}
|
||
</style>
|