<template>
|
<win-md class="stock-edit" title="物品退回" @close="close" width="900px" :loading="loading">
|
<el-form class="form" ref="ruleForm" :model="formData" :rules="rules" label-width="120px">
|
<div class="main-w">
|
<el-row :gutter="24" class="headerHeight">
|
<el-col :span="12">
|
<el-form-item label="部门" prop="departmentId">
|
<el-select ref="department" v-model="formData.departmentId" clearable placeholder="请选择"
|
style="width: 100%">
|
<el-option v-for="item in departmentOptions" :key="item.id" :label="item.name" :value="item.id"
|
clearable/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="退回人" prop="operatorName">
|
<el-input v-model="formData.operatorName" disabled></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="退回时间" prop="dealTime">
|
<el-date-picker
|
v-model="formData.dealTime"
|
type="datetime"
|
value="yyyy-MM-dd HH:mm:ss"
|
value-format="yyyyMMddHHmmss"
|
placeholder="请选择日期"
|
style="width: 100%"
|
>
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="24" class="headerHeight">
|
<el-col :span="24">
|
<el-form-item label="退回审批手续" prop="procureDoc">
|
<upload ref="uploadRef" :settings="uploadSettings" @on-change="uploadChange"></upload>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<div class="goods-card" v-for="(goodsItem, goodsIndex) in formData.goods" :key="goodsIndex">
|
<el-row :gutter="24">
|
<el-col :span="12">
|
<el-form-item
|
label="物品分类"
|
:prop="`goods.${goodsIndex}.baseCategoryId`"
|
:rules="{
|
required: true,
|
message: '请选择物品分类',
|
trigger: 'change',
|
}"
|
>
|
<el-cascader
|
v-model="goodsItem.baseCategoryId"
|
:options="categoryOptions"
|
:props="{ value: 'id',emitPath: false }"
|
:show-all-levels="false"
|
filterable
|
clearable
|
@change="categoryChange($event, goodsIndex)"
|
style="width: 100%"
|
></el-cascader>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item
|
label="物品名称"
|
:prop="`goods.${goodsIndex}.baseGoodsTemplateId`"
|
:rules="rules.baseGoodsTemplateId"
|
>
|
<el-select
|
v-model="goodsItem.baseGoodsTemplateId"
|
:placeholder="goodsItem.baseCategoryId?'请选择物品':'请先选择物品分类'"
|
filterable
|
clearable
|
:disabled="!goodsItem.baseCategoryId"
|
style="width: 100%"
|
@change="goodsTemplateChange($event, goodsIndex)"
|
>
|
<el-option
|
v-for="item in goodsItem.goodsOptions"
|
:key="item.id"
|
:label="item.goodsName"
|
:value="item.id"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item
|
label="选择分发单"
|
:prop="`goods.${goodsIndex}.businessFormCode`"
|
:rules="rules.businessFormCode">
|
<div @click="showFenFa(goodsIndex)">
|
<el-input
|
placeholder="请选择分发单"
|
readonly
|
v-model="goodsItem.businessFormCode"
|
:placeholder="goodsItem.baseGoodsTemplateId?'请选择分发单':'请先选择物品'"
|
:disabled="!goodsItem.baseGoodsTemplateId"
|
suffix-icon="el-icon-arrow-down"
|
class="cursor-p"></el-input>
|
</div>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<div class="card3" v-for="(mItem, mIndex) in goodsItem.models" :key="mIndex">
|
<el-row :gutter="24" type="flex" align="middle" style="height: 50px">
|
<el-col :span="12">
|
<el-form-item label="规格型号:" prop="baseGoodsModelsId" style="margin-bottom: 0">
|
{{ mItem[0].modelName }}
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item label="单位:" prop="baseGoodsModelsId" style="margin-bottom: 0" label-width="80">
|
{{ mItem[0].unit }}
|
</el-form-item>
|
</el-col>
|
<el-col :span="6">
|
<el-form-item label="物品类别:" prop="baseGoodsModelsId" style="margin-bottom: 0" label-width="80">
|
{{ mItem[0].classification }}
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-table :data="mItem" :stripe="true">
|
<!-- A类商品显示 -->
|
<el-table-column prop="price" label="使用人" align="center" v-if="mItem[0].nowUserName">
|
<template slot-scope="scope">
|
{{ scope.row.nowUserName }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="price" label="分发数量" align="center">
|
<template slot-scope="scope">
|
{{ scope.row.goodsNum }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="price" label="可退数量" align="center">
|
<template slot-scope="scope">
|
{{ scope.row.userUseCount }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="counts" label="退回数量" align="center">
|
<template slot-scope="{row,$index}">
|
<el-form-item
|
label-width="0"
|
:prop="`goods.${goodsIndex}.models.${mIndex}.counts`"
|
:rules="[
|
{validator: checkCounts,counts:row.counts,userUseCount: row.userUseCount, trigger: ['blur', 'change']}
|
]"
|
>
|
<el-input
|
clearable
|
type="number"
|
v-model.number="row.counts"
|
></el-input>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
<div class="btn-group">
|
<el-button
|
v-if="formData.goods.length > 1"
|
name="移除"
|
type="danger"
|
plain
|
size="mini"
|
@click="removeGoods(goodsIndex)"
|
>移除
|
</el-button
|
>
|
<el-button
|
v-if="formData.goods.length - 1 == goodsIndex"
|
name="新增物品"
|
type="primary"
|
plain
|
size="mini"
|
@click="addGoods"
|
>新增物品
|
</el-button
|
>
|
</div>
|
</div>
|
</div>
|
</el-form>
|
<div slot="footer" align="center" class="dialog-footer">
|
<my-button name="取消" site="form" @click="close"/>
|
<my-button name="保存" site="form" @click="handleSubmit"/>
|
</div>
|
<win-md v-if="fenfaSetting.show" title="选择分发单" @close="fenfaSetting.show=false" :width="'800px'">
|
<el-table @current-change="handleCurrentChange" :data="fenfaData" highlight-current-row height="407">
|
<el-table-column label="分发单号" prop="businessFormCode" align="left"></el-table-column>
|
<el-table-column label="物品名称" prop="baseGoodsTemplateName" align="left"></el-table-column>
|
<el-table-column label="分发数量" prop="totalCount" align="center"></el-table-column>
|
<el-table-column label="剩余数量" prop="useCount" align="center"></el-table-column>
|
<el-table-column label="分发时间" prop="inTime" width="160" align="center">
|
<template slot-scope="{row}">
|
{{ DateFormatter.LongToDateTime(row.inTime) }}
|
</template>
|
</el-table-column>
|
</el-table>
|
<div slot="footer" align="center" class="dialog-footer">
|
<my-button name="取消" site="form"
|
@click="fenfaSetting.show=false;fenfaSetting.baseGoodsTemplateId=null;curFenfa=null;fenfaData=[]"/>
|
<el-button @click="handleConfirm" type="primary" size="medium">确定</el-button>
|
</div>
|
</win-md>
|
</win-md>
|
</template>
|
<script>
|
import {departmentListAll} from '@/api/system/deptment';
|
import {goodsTemplate} from '@/api/baseSetting/finsystenant';
|
import {getTree} from '@/api/foudation/classification';
|
import MyButton from '@/components/myButton/myButton';
|
import winMd from '@/components/win/win-md';
|
import winSm from '@/components/win/win-sm';
|
import upload from '@/components/upload/index';
|
import {getUploadUrl} from '@/utils/base';
|
import {mapGetters} from 'vuex';
|
import * as DateFormatter from '@/utils/DateFormatter';
|
import {getFfOrderByGoodsIdAndDept, getGoodsUseInfoByFfOrderAndGoodId} from "@/api/deptGoods/scrap";
|
import {returnAdd} from "@/api/deptGoods/itemret";
|
|
export default {
|
components: {MyButton, winMd, winSm, upload},
|
props: {
|
setting: {
|
type: Object,
|
default: () => {
|
},
|
},
|
},
|
data() {
|
return {
|
checkCounts: (rule, value, callback) => {
|
if (!rule.counts) {
|
return callback(new Error('请输入退回数量'));
|
}
|
if (!Number.isInteger(rule.counts)) {
|
// this.$message.warning('请输入数字值');
|
return callback(new Error('请输入数字值'));
|
}
|
if (rule.counts < 1) {
|
// this.$message.warning('数字值不能为0');
|
return callback(new Error('数字值必须大于0'));
|
}
|
if (rule.counts > rule.userUseCount) {
|
// this.$message.warning('分发数量不能大于剩余数量');
|
return callback(new Error('退回数量不能大于在用数量'));
|
}
|
callback();
|
},
|
DateFormatter: DateFormatter,
|
loading: true,
|
departmentOptions: [], // 部门列表
|
categoryOptions: [], // 物品分类列表
|
modelList: [], //型号列表
|
fenfaSetting: {
|
show: false,
|
goodsIdx: null,
|
baseGoodsTemplateId: null,
|
id: '',
|
},
|
curFenfa: null,
|
fenfaData: [],
|
formData: {
|
departmentId: '', // 退回部门id
|
dealTime: DateFormatter.formatDate(new Date(), 'yyyyMMddhhmmss'), // 退回时间
|
procureDoc: '',
|
goods: [],
|
},
|
goodsItem: {
|
businessFormCode: '', // 分发单id
|
transBusinessId: '', // 分发单id
|
baseCategoryId: '', // 分类编号
|
baseGoodsTemplateId: '', // 物品模版编号
|
goodsTemplateName: '', // 物品模版名称
|
goodsOptions: [], // 物品列表select
|
models: [], // 物品名称
|
},
|
modelsItem: {
|
baseGoodsModelsId: '', // 规格型号编号
|
worehouseCount: 0,
|
counts: null, // 操作数量
|
unit: null, //单位
|
},
|
rules: {
|
departmentId: [{required: true, message: '请选择部门', trigger: 'change'}],
|
dealTime: [{required: true, message: '请选择', trigger: 'change'}],
|
procureDoc: [{required: true, message: '请上传', trigger: 'change'}],
|
baseCategoryId: [{required: true, message: '请选择', trigger: 'change'}],
|
baseGoodsTemplateId: [{
|
required: true,
|
message: '请选择物品',
|
trigger: 'change'
|
}],
|
businessFormCode: [{required: true, message: '请选择分发单', trigger: 'change'}],
|
counts: [{required: true, message: '请输入', trigger: 'change'}],
|
reason: [{required: true, message: '请选择', trigger: 'change'}],
|
},
|
|
uploadSettings: {
|
title: '上传',
|
max: 20, // 最大大小,单位M
|
num: 10, // 支持上传图片个数
|
accept: '', // 限制格式
|
tip: '', // 提示 默认:`只能上传${this.defaultSettings.num}个${this.defaultSettings.accept}文件,且不超过${this.defaultSettings.max}kb`
|
uploadUrl: getUploadUrl(), // 上传路径
|
multiple: true, // 是否支持批量上传
|
disabled: false, // 是否禁用
|
},
|
};
|
},
|
computed: {
|
...mapGetters(['userInfo']),
|
},
|
created() {
|
this.init();
|
},
|
methods: {
|
async init() {
|
await this.getdeptmentList();
|
const treeRes = await getTree();
|
this.categoryOptions = this.removeEmptyChildren(treeRes);
|
this.getgoodsTemplate();
|
// 获取物品分类列表
|
this.formData.departmentId = this.userInfo.sysDeptId;
|
this.formData.operatorName = this.userInfo.userName;
|
this.loading = false
|
},
|
|
// 获取部门列表
|
async getdeptmentList() {
|
await departmentListAll({tenantId: this.userInfo.tenantId})
|
.then((res) => {
|
this.departmentOptions = res;
|
this.formData.goods.push(JSON.parse(JSON.stringify(this.goodsItem)));
|
})
|
.catch((err) => {
|
console.log('err', err);
|
});
|
},
|
|
removeEmptyChildren(arr) {
|
arr.forEach((item) => {
|
if (!item.children || !item.children.length) {
|
delete item.children;
|
} else {
|
this.removeEmptyChildren(item.children);
|
}
|
});
|
return arr;
|
},
|
|
// 获取物品名称列表
|
getgoodsTemplate(id, index) {
|
goodsTemplate({categoryId: id || ''}).then((res) => {
|
if (index || index == 0) {
|
this.$set(this.formData.goods[index], 'goodsOptions', res);
|
} else {
|
this.goodsTemplatelAll = res;
|
}
|
});
|
},
|
|
// 根据物品名称id获取名字
|
getGoodsTemplateName(id) {
|
let item = this.goodsTemplatelAll.find((v) => v.id == id);
|
if (item) {
|
return item.goodsName;
|
}
|
return;
|
},
|
|
// 根据规格型号id获取名字
|
getGoodsModelsName(id) {
|
let item = this.goodsModelAll.find((v) => v.id == id);
|
if (item) {
|
return item.modelName;
|
}
|
return;
|
},
|
|
// 物品分类选择
|
categoryChange(e, index) {
|
this.formData.goods[index].goodsOptions = [];
|
this.formData.goods[index].baseGoodsTemplateId = '';
|
this.formData.goods[index].goodsTemplateName = '';
|
this.formData.goods[index].models = [];
|
// 根据选中分类请求物品名称列表
|
this.getgoodsTemplate(e, index);
|
},
|
|
// 物品名称列表选择
|
goodsTemplateChange(e, index) {
|
this.formData.goods[index].models = [];
|
this.formData.goods[index].businessFormCode = '';
|
this.formData.goods[index].goodsTemplateName = this.getGoodsTemplateName(e);
|
},
|
showFenFa(index) {
|
this.loading = true
|
getFfOrderByGoodsIdAndDept({
|
departmentId: this.formData.departmentId,
|
baseGoodsTemplateId: this.formData.goods[index].baseGoodsTemplateId
|
}).then(res => {
|
this.loading = false
|
if (!res || res.length === 0) {
|
this.$message.error('未查询到需要退回的分发单');
|
return
|
}
|
this.fenfaSetting.show = true
|
this.fenfaSetting.baseGoodsTemplateId = this.formData.goods[index].baseGoodsTemplateId
|
this.fenfaSetting.goodsIdx = index
|
this.fenfaData = res
|
}).catch((err) => {
|
this.loading = false
|
});
|
},
|
// 上传
|
uploadChange() {
|
let arr = this.$refs.uploadRef.fileList;
|
this.formData.procureDoc = JSON.stringify(arr);
|
},
|
|
// 点击新增物品
|
addGoods() {
|
this.formData.goods.push(JSON.parse(JSON.stringify(this.goodsItem)));
|
},
|
|
// 点击移除
|
removeGoods(index) {
|
this.formData.goods.splice(index, 1);
|
},
|
handleCurrentChange(e) {
|
this.curFenfa = e
|
},
|
handleConfirm() {
|
if (!this.curFenfa) {
|
this.$message.error('请选择分发单');
|
return
|
}
|
let bIdx = this.formData.goods.findIndex((v) => v.businessFormCode == this.curFenfa.businessFormCode);
|
let gIdx = this.formData.goods.findIndex((v) => v.baseGoodsTemplateId == this.fenfaSetting.baseGoodsTemplateId);
|
|
if (gIdx !== -1 && gIdx !== this.fenfaSetting.goodsIdx && bIdx !== -1 && bIdx !== this.fenfaSetting.goodsIdx) {
|
this.$message.error('同一个物品不能选择相同的分发单');
|
return;
|
}
|
getGoodsUseInfoByFfOrderAndGoodId({
|
transBusinessId: this.curFenfa.transBusinessId,
|
baseGoodsTemplateId: this.fenfaSetting.baseGoodsTemplateId
|
}).then(res => {
|
if (res) {
|
let arr = []
|
for (let resKey in res) {
|
const item = res[resKey]
|
item.map(t => {
|
t.counts = null
|
})
|
arr.push(item)
|
}
|
this.formData.goods[this.fenfaSetting.goodsIdx].models = arr
|
this.formData.goods[this.fenfaSetting.goodsIdx].businessFormCode = this.curFenfa.businessFormCode
|
this.formData.goods[this.fenfaSetting.goodsIdx].transBusinessId = this.curFenfa.transBusinessId
|
}
|
this.fenfaSetting.show = false
|
})
|
},
|
// 提交
|
handleSubmit() {
|
this.$refs['ruleForm'].validate((valid) => {
|
if (valid) {
|
let params = JSON.parse(JSON.stringify(this.formData))
|
params.goods.map(g => {
|
delete g.goodsOptions
|
let arr = []
|
g.models.map(m => {
|
m.map(item=>{
|
if(item.counts&&item.counts>0){
|
arr.push(item)
|
}
|
})
|
})
|
g.models = arr
|
})
|
params.goods = params.goods.filter(g=>g.models.length>0)
|
if(params.goods.length===0){
|
this.$message.error('请至少填写一个退回物品');
|
return;
|
}
|
if (this.loading) return
|
this.loading = true
|
returnAdd(params)
|
.then((res) => {
|
this.loading = false
|
this.$message.success('保存成功!');
|
this.close();
|
this.$emit('search');
|
})
|
.catch((err) => {
|
this.loading = false
|
this.$message.error('保存失败');
|
});
|
} else {
|
this.$message.error('校验未通过,请检查。');
|
}
|
});
|
},
|
|
close() {
|
this.formData = {
|
warehouseId: '', // 报废仓库id
|
dealTime: '', // 报废时间
|
goods: [],
|
};
|
this.$emit('close');
|
},
|
},
|
};
|
</script>
|
<style scoped lang="scss">
|
@import url(../../../../styles/store.scss);
|
|
.cursor-p {
|
::v-deep {
|
.el-input__inner {
|
cursor: pointer;
|
}
|
}
|
}
|
|
.card3 {
|
border-radius: 2px;
|
background: #ffffff;
|
}
|
</style>
|