<template>
|
<GlobalWindow title="新建出库单" :visible.sync="isShowModal" :confirm-working="isLoading" width="1000px" @close="close"
|
@confirm="confirm">
|
<el-form :model="param" ref="form" :rules="rules">
|
<div class="df_ac">
|
<el-form-item class="w3" label="出库仓库" prop="warehouseId">
|
<el-select :disabled="param.id" @change="changeStore" v-model="param.warehouseId" placeholder="请选择">
|
<el-option v-for="op in storeList" :key="op.id" :label="op.name" :value="op.id"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item class="w3" label="出库日期" prop="doneDate">
|
<el-date-picker type="date" v-model="param.doneDate" format="yyyy-MM-dd" value-format="yyyy-MM-dd"
|
placeholder="请选择出库日期"></el-date-picker>
|
</el-form-item>
|
<el-form-item class="w3" label="出库类型" prop="type">
|
<el-select :disabled="param.id" v-model="param.type" placeholder="请选择出库类型">
|
<el-option v-for="op in StoreTypeOps" :key="op.id" :label="op.name" :value="op.id"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item class="w3" label="处理人" prop="name">
|
<el-input v-model="param.createUserName" :disabled="true" v-trim />
|
</el-form-item>
|
<el-form-item class="w6" label="备注" prop="remark">
|
<el-input v-model="param.remark" placeholder="请输入" v-trim />
|
</el-form-item>
|
</div>
|
</el-form>
|
<!-- -->
|
<el-tabs v-model="activeName">
|
<el-tab-pane label="物料信息" name="first"></el-tab-pane>
|
</el-tabs>
|
<el-button type="primary" @click="handleOpenMaterial">选择物料</el-button>
|
<el-table :data="list" stripe>
|
<el-table-column align="center" label="序号" type="index" width="50" />
|
<el-table-column prop="name" label="物料名称" show-overflow-tooltip min-width="80px"></el-table-column>
|
<el-table-column prop="code" label="物料编码" show-overflow-tooltip min-width="90px"></el-table-column>
|
<el-table-column prop="qrcode" label="条形码" show-overflow-tooltip min-width="70px"></el-table-column>
|
<el-table-column prop="brand" label="品牌" show-overflow-tooltip min-width="70px"></el-table-column>
|
<el-table-column prop="unitName" label="单位" show-overflow-tooltip min-width="70px"></el-table-column>
|
<el-table-column prop="dealUserName" label="出库数量" min-width="90px">
|
<template v-slot="{ row }">
|
<el-input oninput="value=value.replace(/[^\d.]/g, '').replace(/\.{2,}/g, '.').replace('.', '$#$').replace(/\./g, '').replace('$#$', '.').replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3').replace(/^\./g, '')" v-model="row.stock"
|
class="w100"></el-input>
|
</template>
|
</el-table-column>
|
<el-table-column prop="maxStock" label="库存数量" show-overflow-tooltip min-width="80px"></el-table-column>
|
<el-table-column label="操作" min-width="60px">
|
<template v-slot="scope">
|
<span @click="handleDel(scope)" class="red pointer">删除</span>
|
</template>
|
</el-table-column>
|
</el-table>
|
<!-- -->
|
<AssetSel v-if="isShowSel" ref="AssetSelRef" @change="changeSel" @close="isShowSel = false" />
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
import AssetSel from './AssetSel'
|
import { fetchList as getStoreList } from '@/api/ywWarehouse'
|
import { ywOutinboundCreate } from '@/api/store/index'
|
import { StoreTypeOps, rules } from './config'
|
import { Message } from 'element-ui'
|
import dayjs from 'dayjs'
|
export default {
|
name: 'OperaCategoryWindow',
|
components: { GlobalWindow, AssetSel },
|
data() {
|
return {
|
// 表单数据
|
param: {
|
createUserName: this.$store.state.userInfo.realname || this.$store.state.userInfo.username,
|
creator: this.$store.state.userInfo.id,
|
inOut: 1
|
},
|
activeName: 'first',
|
isShowModal: false,
|
isShowSel: false,
|
isLoading: false,
|
// 验证规则
|
rules,
|
storeList: [],
|
list: [],
|
StoreTypeOps: StoreTypeOps.filter(i => i.type == 1),
|
|
dataList: [],
|
}
|
},
|
created() {
|
this.initData()
|
},
|
methods: {
|
confirm() {
|
this.$refs['form'].validate((valid) => {
|
if (valid) {
|
const { param, list } = this
|
if(list.length == 0) return Message.warning('请先选择物料信息')
|
let count = 0 // 出库数量必填
|
list.forEach(item => {
|
if(!item.stock) count ++
|
})
|
if(count > 0) return Message.warning('请输入正确的出库数量')
|
this.isLoading = true
|
ywOutinboundCreate({
|
...param,
|
recordList: list
|
}).then(res => {
|
this.isLoading = false
|
Message.success('提交成功')
|
this.$emit('success')
|
this.close()
|
}, () => {
|
this.isLoading = false
|
})
|
}
|
})
|
},
|
changeStore() {
|
this.list = []
|
},
|
initData() {
|
this.$set(this.param, 'doneDate', dayjs().format('YYYY-MM-DD'))
|
getStoreList({ capacity: 9999, page: 1, model: {status: 0} }).then(res => {
|
this.storeList = res.records || []
|
})
|
},
|
changeSel(val) {
|
const list = val
|
list.forEach(item => {
|
if(this.list.indexOf(item.id) === -1){
|
item.materialId = item.id
|
item.stock = null
|
item.createDate = null
|
this.list.push(item)
|
}
|
})
|
},
|
handleDel(val) {
|
const index = val.$index
|
this.list.splice(index, 1)
|
|
},
|
handleOpenMaterial() {
|
if(!this.param.warehouseId) return Message.warning('请先选择出库仓库')
|
this.isShowSel = true
|
this.$nextTick(() => {
|
this.$refs.AssetSelRef.isShowModal = true
|
this.$refs.AssetSelRef.isOut = true
|
this.$refs.AssetSelRef.warehouseId = this.param.warehouseId
|
this.$refs.AssetSelRef.getList()
|
console.log('-----');
|
|
})
|
},
|
close() {
|
this.isShowModal = false
|
this.$emit('close')
|
},
|
getDetail(id) {
|
getInfoById(id).then(res => {
|
this.param = res
|
})
|
},
|
}
|
}
|
</script>
|
<style lang="scss" scoped>
|
.df_ac {
|
display: flex;
|
align-items: center;
|
flex-wrap: wrap;
|
|
.w3 {
|
width: 33.3%;
|
padding: 0 10px;
|
box-sizing: border-box;
|
}
|
|
.w6 {
|
width: 66.6%;
|
padding: 0 10px;
|
box-sizing: border-box;
|
}
|
}
|
</style>
|