<template>
|
<el-dialog :visible.sync="isShow" :title="title" width="800px" :modal-append-to-body="false"
|
:close-on-click-modal="false">
|
<div class="warningInventory-top-style" v-loading="loadLoading"
|
element-loading-custom-class="customLoading">
|
<div class="row-style">
|
<div class="col-style"></div>
|
<el-row>
|
<el-col :span="12">预警库存值</el-col>
|
<el-col :span="12">当前库存</el-col>
|
</el-row>
|
</div>
|
<el-form size="mini" :model="form" label-width="140px" ref="form">
|
<el-form-item :label="item.name" v-for="(item,index) in form.data" :key="index">
|
<el-row :gutter="20">
|
<el-col :span="11">
|
<el-form-item :prop="'data.'+ index + '.warningStock'" :rules="[
|
{
|
validator: vailInputRule,
|
index: index,
|
trigger: 'change',
|
},
|
]">
|
<el-input v-model="item.warningStock" placeholder="请输入商品预警值" clearable>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="11">
|
<el-form-item :prop="'data.'+ index + '.stock'">
|
<el-input v-model="item.stock" disabled>
|
</el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form-item>
|
</el-form>
|
<div class="memo-style">ps：当商品库存≤预警库存时，中台定向给scm推送预警补货通知</div>
|
</div>
|
<div slot="footer" class="dialog-footer">
|
<el-button size="mini" @click="save('form')" type="primary" :loading="loading">保存
|
</el-button>
|
<el-button size="mini" @click="isShow = false">取消</el-button>
|
</div>
|
</el-dialog>
|
</template>
|
|
<script>
|
import dictApi from '@/api/dict'
|
import commodityStocksApi from '@/api/stockManagement/commodityStocks'
|
import ChannelInventoryApi from '@/api/stockManagement/channelInventory'
|
export default {
|
name: 'warningInventoryDialog',
|
props: {
|
dialogVisible: {
|
type: Boolean,
|
default: false
|
},
|
title: {
|
type: String,
|
default: ''
|
},
|
/**
|
* 选中项数据
|
*/
|
operItem: {
|
type: Object,
|
default: function() {
|
return {}
|
}
|
},
|
},
|
data() {
|
return {
|
isShow: false,
|
loading: false,
|
loadLoading: false,
|
form: {
|
data: []
|
},
|
selectItem: {},
|
}
|
},
|
watch: {
|
/**
|
* 监控外部显示变量变化
|
* 传递到dialog组件
|
*/
|
dialogVisible: function(newShow, oldShow) {
|
this.isShow = newShow
|
},
|
/**
|
* 监控内部显示属性变化
|
* 传递到外部调用变量
|
*/
|
isShow: function(newDialogShow, oldDialogShow) {
|
this.$emit('update:dialogVisible', newDialogShow)
|
if (!newDialogShow) {
|
this.initForm()
|
}
|
}
|
},
|
mounted() {
|
this.getChannelData();
|
},
|
methods: {
|
// 初始化表单
|
initForm() {
|
this.form.data.forEach((v) => {
|
v.warningStock = null;
|
v.stock = null;
|
})
|
this.loading = false;
|
},
|
/**
|
* 获取渠道数据字典
|
*/
|
async getChannelData() {
|
const res = await dictApi.getChanneldict()
|
const _data = res.data;
|
if (res.code === '0' && _data && _data.length > 0) {
|
const _arr = [];
|
_data.forEach((item) => {
|
_arr.push({
|
id: item.dictCode,
|
name: item.dictName,
|
warningStock: null,
|
stock: null,
|
})
|
})
|
this.form.data = _arr;
|
}
|
},
|
/**
|
*获取当前商品下所有渠道可用库存数
|
*/
|
async getCurrentGoodsChannelData(data) {
|
const params = {
|
spuNum: data.spuNum,
|
current: 1,
|
size: 50
|
}
|
this.selectItem = data;
|
this.loadLoading = true;
|
const res = await ChannelInventoryApi.getList(params)
|
if (res.code === '200') {
|
const _data = res.data.records;
|
this.form.data.forEach((v1) => {
|
const _obj = _data.find((v2) => v1.id === v2.channel);
|
if (_obj) {
|
v1.stock = _obj.stock;
|
v1.warningStock = _obj.warningStock;
|
}
|
})
|
this.loadLoading = false;
|
} else {
|
this.loadLoading = false;
|
}
|
},
|
/**
|
*预警库存验证规则---只能输入正整数
|
*/
|
vailInputRule(rule, value, callback) {
|
const reg = /^[0-9]*$/;
|
if (value && !reg.test(value)) {
|
callback(new Error('请输入大于等于0的整数'))
|
} else if (value > this.form.data[rule.index].stock) {
|
callback(new Error('建议合理设置预警库存值'))
|
} else {
|
callback()
|
}
|
},
|
/**
|
*保存
|
*/
|
save(formName) {
|
const _this = this;
|
_this.$refs[formName].validate((valid) => {
|
if (valid) {
|
this.submitWarningData();
|
} else {
|
console.log('error submit!!');
|
return false;
|
}
|
});
|
},
|
async submitWarningData() {
|
const arr = [];
|
this.form.data.forEach((v) => {
|
// if (v.warningStock || v.warningStock === 0) {
|
arr.push({
|
channel: v.id,
|
stock: v.warningStock
|
})
|
// }
|
})
|
const params = {
|
spuNum: this.selectItem.spuNum,
|
stockChannelWarnings: arr
|
}
|
this.loading = true;
|
const res = await commodityStocksApi.saveStockWarningData(params)
|
if (res.code === '200') {
|
this.$message({
|
message: '操作成功',
|
type: 'success'
|
})
|
this.isShow = false;
|
this.loading = false;
|
} else {
|
this.loading = false;
|
}
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.place {
|
margin-left: 20px;
|
}
|
.warningInventory-top-style {
|
.el-form-item {
|
margin-bottom: 10px !important;
|
}
|
.row-style {
|
> div {
|
display: inline-block;
|
margin-bottom: 10px;
|
font-weight: bold;
|
color: #909399;
|
}
|
> div:first-child {
|
width: 140px;
|
}
|
> div:last-child {
|
width: calc(100% - 140px);
|
}
|
}
|
.memo-style {
|
color: rgb(144, 147, 153);
|
font-size: 12px;
|
margin-left: 60px;
|
}
|
}
|
</style>
|
