11-wms/src/views/wmsOutStore/outStoreDocuments.vue
2022-10-21 14:09:21 +08:00

183 lines
4.3 KiB
Vue

<template>
<div class="app-container">
<head-form :form-config="headFormConfig" @headBtnClick="btnClick" />
<base-table
:top-btn-config="topBtnConfig"
:page="listQuery.current"
:limit="listQuery.size"
:height="tableH"
:table-config="tableProps"
:table-data="list"
:is-loading="listLoading"
@clickTopBtn="clickTopBtn"
>
<method-btn
v-if="tableBtn.length"
slot="handleBtn"
:method-list="tableBtn"
:width="trueWidth"
@clickBtn="handleClick"
/>
</base-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="listQuery.current"
:limit.sync="listQuery.size"
@pagination="getList()"
/>
<out-store-documents-add ref="outStoreDocumentsAdd" :dialog-title="showTitle" />
</div>
</template>
<script>
import HeadForm from '@/components/basicData/HeadForm'
import BaseTable from '@/components/BaseTable'
import Pagination from '@/components/Pagination'
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
import { tableHeight } from '@/utils/index'
import outStoreDocumentsAdd from './components/outStoreDocumentsAdd.vue'
import { getOutboundNoList, getHCQList, getProductSpecList } from '@/utils/wmsDic'
import moment from 'moment'
const topBtnConfig = [
{
type: 'add',
btnName: 'btn.add'
}
]
const tableProps = [
{
prop: 'outboundOrderNo',
label: '出库单号'
},
{
prop: 'customerName',
label: '客户名称'
},
{
prop: 'shipmentCacheArea',
label: '发货缓存区'
},
{
prop: 'spec',
label: '规格'
},
{
prop: 'num',
label: '数量'
},
{
prop: 'deliveryTime',
label: '要求发货时间'
}
]
const tableBtn = [
{
type: 'edit',
btnName: 'btn.edit'
},
{
type: 'delete',
btnName: 'btn.delete'
},
{
type: 'print',
btnName: 'btn.print'
}
]
export default {
name: 'OutStoreDocuments',
components: { HeadForm, BaseTable, Pagination, MethodBtn, outStoreDocumentsAdd },
data() {
return {
headFormConfig: [
{
type: 'input',
label: '关键字',
placeholder: '出库单号或客户名称',
param: 'name',
width: 300
},
{
type: 'button',
btnName: 'btn.search',
name: 'search',
color: 'primary'
}
],
topBtnConfig,
listQuery: {
current: 1,
size: 20
},
tableH: tableHeight(275),
tableProps,
list: [],
listLoading: false,
tableBtn,
total: 0,
trueWidth: 120,
showTitle: ''
}
},
mounted() {
window.addEventListener('resize', () => {
this.tableH = tableHeight(275)
})
this.getList()
},
methods: {
getList() {
const temp = []
const num = 20
for (let i = 0; i < num; i++) {
const obj = {}
obj.outboundOrderNo = getOutboundNoList()
obj.customerName = ''
obj.shipmentCacheArea = getHCQList()
obj.num = parseInt(Math.random() * 1000)
obj.spec = getProductSpecList()
const sj = Math.floor(Math.random() * 100)
obj.deliveryTime = moment().add(sj, 'days').add(sj, 'hour').add(sj, 'minutes').add(sj, 'seconds').format('YYYY-MM-DD hh:mm:ss')
temp.push(obj)
}
this.list = temp
this.total = num
},
btnClick(val) {
console.log(val)
this.getList()
},
clickTopBtn(val) {
console.log(val)
this.$refs.outStoreDocumentsAdd.init()
this.showTitle = '新增'
},
handleClick(val) {
// console.log(val)
if (val.type === 'delete') {
this.$confirm('确定删除出库单号为[ ' + val.data.outboundOrderNo + ' ]的数据吗?', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(async() => {
this.$message({
type: 'success',
message: '删除成功'
})
this.getList()
})
} else if (val.type === 'edit') {
console.log(val)
this.showTitle = '编辑'
this.$refs.outStoreDocumentsAdd.init(val.data)
} else {
this.$message({
type: 'success',
message: '打印成功'
})
}
}
}
}
</script>