168 lines
4.2 KiB
Vue
168 lines
4.2 KiB
Vue
|
|
<template>
|
|
<page-header-wrapper>
|
|
<template v-slot:content>
|
|
<div class="table-page-search-wrapper">
|
|
<a-form layout="inline">
|
|
<a-row :gutter="48">
|
|
<a-col :md="8" :sm="24">
|
|
<a-form-item label="入库时间">
|
|
<a-range-picker
|
|
:placeholder="['开始日期', '结束日期']"
|
|
:value="rang_at"
|
|
:ranges="{ Today: [moment(), moment()], 'This Month': [moment(), moment().endOf('month')] }"
|
|
@change="onCreateChange" />
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :md="8" :sm="24">
|
|
<a-button type="primary" @click="search"><a-icon type="search" />搜索</a-button>
|
|
<a-button class="ml8" @click="resetSearch"><a-icon type="undo" />重置</a-button>
|
|
</a-col>
|
|
</a-row>
|
|
</a-form>
|
|
</div>
|
|
</template>
|
|
|
|
<!-- 列表 -->
|
|
<a-card :bordered="false">
|
|
<a-card :bordered="false">
|
|
<a-row>
|
|
<a-col :sm="12" :xs="24">
|
|
<info title="线上库存量剩余" :value="listCount.online+''" :bordered="true" />
|
|
</a-col>
|
|
<a-col :sm="12" :xs="24">
|
|
<info title="线下库存量剩余" :value="listCount.offline+''" :bordered="false" />
|
|
</a-col>
|
|
</a-row>
|
|
</a-card>
|
|
<br/>
|
|
<s-table
|
|
ref="table"
|
|
:columns="columns"
|
|
:data="loadData"
|
|
:rowKey="(row) => row.middle_systen_id + ''"
|
|
showPagination="auto"
|
|
bordered
|
|
size="default">
|
|
<a slot="number" slot-scope="text, record" style="color: #1890ff">{{ record.number }}件</a>
|
|
</s-table>
|
|
</a-card>
|
|
</page-header-wrapper>
|
|
</template>
|
|
|
|
<script>
|
|
import { STable, UserInfo } from '@/components'
|
|
import DeriveButton from '@/components/OrderDetailInfo/DeriveButton'
|
|
import moment from 'moment'
|
|
import Info from '@/views/home/components/Info'
|
|
import {
|
|
getMiddlesStockInStocks
|
|
} from '@/api/stock'
|
|
|
|
const columns = [
|
|
{
|
|
title: 'ID',
|
|
dataIndex: 'middle_systen_id',
|
|
align: 'center',
|
|
width: 80
|
|
},
|
|
{
|
|
title: '渠道',
|
|
dataIndex: 'channel',
|
|
align: 'center',
|
|
width: 180
|
|
},
|
|
{
|
|
title: '补充库存数量',
|
|
scopedSlots: { customRender: 'number' },
|
|
align: 'center',
|
|
width: 180
|
|
},
|
|
{
|
|
title: '补充库存时间',
|
|
dataIndex: 'created_at',
|
|
align: 'center',
|
|
width: 180
|
|
},
|
|
{
|
|
title: '备注',
|
|
dataIndex: 'remark',
|
|
align: 'center'
|
|
}
|
|
]
|
|
|
|
export default {
|
|
name: 'StockIn',
|
|
components: {
|
|
STable,
|
|
UserInfo,
|
|
Info,
|
|
DeriveButton
|
|
},
|
|
data () {
|
|
return {
|
|
columns,
|
|
rang_at: [],
|
|
queryParam: {
|
|
start_at: undefined,
|
|
end_at: undefined
|
|
},
|
|
listCount: {
|
|
offline: 0,
|
|
online: 0
|
|
},
|
|
loadData: (parameter) => {
|
|
const requestParameters = Object.assign({}, parameter, this.queryParam)
|
|
return getMiddlesStockInStocks(requestParameters).then(res => {
|
|
this.listCount.offline = res.count.offline
|
|
this.listCount.online = res.count.online
|
|
return res.logs
|
|
})
|
|
}
|
|
}
|
|
},
|
|
watch: {
|
|
$route (to, from) {
|
|
if (to.name === 'StockIn' && (
|
|
from.name === 'Home' ||
|
|
from.name === 'cityExperienceOfficer' ||
|
|
from.name === 'StockOut' ||
|
|
from.name === 'StockIn' ||
|
|
from.name === 'DealerIn' ||
|
|
from.name === 'DealerOut' ||
|
|
from.name === 'SalesOnline' ||
|
|
from.name === 'SalesStock')
|
|
) {
|
|
this.$refs.table.loadData()
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
moment,
|
|
// 更改创建时间
|
|
onCreateChange (dates, dateStrings) {
|
|
this.queryParam.start_at = dateStrings[0]
|
|
this.queryParam.end_at = dateStrings[1]
|
|
this.rang_at = dateStrings
|
|
},
|
|
// 搜索列表
|
|
search () {
|
|
this.$refs.table.refresh(true) // 重置接口且刷先到第一页
|
|
},
|
|
// 重置搜索列表
|
|
resetSearch () {
|
|
this.queryParam.start_at = undefined
|
|
this.queryParam.end_at = undefined
|
|
this.rang_at = []
|
|
this.$refs.table.refresh(true) // 重置接口且刷先到第一页
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.ml8 {
|
|
margin-left: 8px;
|
|
}
|
|
</style>
|