bonus-ui/src/views/material/lease/outBound/component/addToolsOutBound.vue

713 lines
21 KiB
Vue

<template>
<!-- 新增工机具 -->
<div>
<el-form
:model="maForm"
ref="maForm"
size="small"
:rules="rules"
:inline="true"
label-width="120px"
>
<el-form-item label="共享单位" prop="arrivalTime">
<el-select
v-model="maForm.supplierId"
placeholder="共享单位"
clearable
filterable
style="width: 240px"
disabled
>
<el-option
v-for="item in supplierList"
:key="item.supplierId"
:label="item.supplier"
:value="item.supplierId"
/>
</el-select>
</el-form-item>
<el-form-item label="共享工程" prop="supplierId">
<el-select
v-model="maForm.supplierId"
placeholder="共享工程"
clearable
filterable
style="width: 240px"
disabled
>
<el-option
v-for="item in supplierList"
:key="item.supplierId"
:label="item.supplier"
:value="item.supplierId"
/>
</el-select>
</el-form-item>
<el-form-item label="领料人" prop="leasePerson">
<el-input
v-model="maForm.leasePerson"
placeholder="请输入领料人"
clearable
maxlength="50"
style="width: 240px"
@keyup.enter.native="handleQuery"
disabled
/>
</el-form-item>
<el-form-item label="联系电话" prop="phone">
<el-input
v-model="maForm.phone"
placeholder="请输入联系电话"
clearable
maxlength="50"
style="width: 240px"
@keyup.enter.native="handleQuery"
disabled
/>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleSave"
>保存</el-button
>
</el-col>
<!-- <el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" v-if="isEdit">导出</el-button>
</el-col> -->
</el-row>
<el-table v-loading="loading" :data="equipmentList" height="546">
<el-table-column align="center" label="序号" type="index" width="55" />
<el-table-column
align="center"
label="类型名称"
prop="maTypeName"
show-overflow-tooltip
></el-table-column>
<el-table-column
align="center"
label="规格型号"
prop="typeName"
show-overflow-tooltip
/>
<el-table-column align="center" label="计量单位" prop="unitName" />
<el-table-column align="center" label="当前库存" prop="storageNum" />
<el-table-column label="预领数量" prop="purchaseNum" align="center">
</el-table-column>
<el-table-column align="center" label="已领数量" prop="unitName" />
<el-table-column align="center" label="管理模式" prop="unitName" />
<el-table-column align="center" label="出库数量" prop="unitName">
<template slot-scope="scope">
<div
v-if="scope.row.unitName != null && scope.row.unitName != ''"
@click="codeBind(scope.row)"
style="color: #02a7f0; cursor: pointer"
>
{{ scope.row.unitName }}
</div>
<el-input-number
v-else
v-model="scope.row.preNum"
controls-position="right"
style="width: 100%"
></el-input-number>
</template>
<!-- <template slot-scope="scope">
<el-input-number
v-if="scope.row.unitName != null && scope.row.unitName != ''"
v-model="scope.row.preNum"
controls-position="right"
style="width: 100%"
></el-input-number>
</template> -->
</el-table-column>
<el-table-column label="备注" prop="remark" align="center">
<template v-slot="scope">
<el-input
v-model="scope.row.remark"
controls-position="right"
style="width: 100%"
></el-input>
</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope" v-if="scope.row.roleId !== 1">
<el-button
size="mini"
type="text"
icon="el-icon-delete"
style="color: red"
@click="handleDelete(scope.row)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<!-- 绑定弹框-->
<el-dialog
width="70%"
append-to-body
title="编码绑定"
:visible.sync="bindCodeVisible"
@close="closeCancel"
>
<el-form
size="small"
:inline="true"
ref="queryFormBindRef"
:model="queryBindForm"
:rules="queryBindFormRules"
>
<el-form-item label="前缀" prop="codePrefix">
<el-input
clearable
maxlength="20"
placeholder="请输入前缀"
v-model="queryBindForm.codePrefix"
/>
</el-form-item>
<el-form-item label="后缀范围" prop="codeSuffixStart">
<el-input
clearable
placeholder="开始数值"
v-model="queryBindForm.codeSuffixStart"
/>
</el-form-item>
<el-form-item prop="codeSuffixEnd">
<el-input
clearable
placeholder="结束数值"
v-model="queryBindForm.codeSuffixEnd"
/>
</el-form-item>
<el-form-item label="编码" prop="code">
<el-input
clearable
maxlength="20"
placeholder="请输入编码"
v-model="queryBindForm.code"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" size="mini" @click="handleAdd"
>填充</el-button
>
<el-button type="primary" size="mini" @click="handleCodeBinding"
>绑定</el-button
>
</el-form-item>
</el-form>
<el-table border max-height="600px" :data="codeTableList" height="546">
<el-table-column align="center" label="序号" type="index" />
<el-table-column align="center" label="设备名称" prop="materialName" />
<el-table-column align="center" label="规格型号" prop="materialModel" />
<el-table-column align="center" label="设备编码">
<template slot-scope="{ row }">
<el-input clearable v-model="row.maCode" placeholder="请填写编码" />
</template>
</el-table-column>
<el-table-column align="center" label="状态"> </el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button
size="mini"
type="danger"
icon="el-icon-remove"
@click="handleRemove(scope.$index)"
>
移除
</el-button>
</template>
</el-table-column>
</el-table>
</el-dialog>
</div>
</template>
<script>
import {
getPurchaseCheckInfo,
equipmentTypeTree,
addApplyInfo,
updatePurchaseCheckInfo,
} from "@/api/purchase/goodsArrived";
import { getListFacturer } from "@/api/ma/supplier";
import { getToken } from "@/utils/auth";
import {
uploadPurchaseFile,
getPurchaseFileList,
} from "@/api/purchase/goodsAccept";
// import Treeselect from '@riophae/vue-treeselect'
// import '@riophae/vue-treeselect/dist/vue-treeselect.css'
// import HoldingpoleDialog from '@/components/HoldingpoleDialog/index.js'
export default {
name: "AddTools",
dicts: ["purchase_task_status"],
// components: { Treeselect, HoldingpoleDialog },
props: {
isEdit: {
type: Boolean,
default: () => {
return false;
},
},
editTaskId: {
type: [String, Number],
default: () => {
return "";
},
},
editId: {
type: [String, Number],
default: () => {
return "";
},
},
},
data() {
return {
taskId: "",
// isEdit: false,
// 遮罩层
loading: false,
loadingTwo: false,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
bindCodeVisible: false, // 绑定弹框
// 总条数
total: 0,
//物资厂家
supplierList: [],
//机具类型
equipmentTypeList: [],
//绑定的数据
codeTableList: [],
// 角色表格数据
equipmentList: [{ unitName: 4 }, { unitName: null }],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
rowData: {},
// 查询参数
queryParams: {
equipmentId: undefined,
productionTime: "",
},
maForm: {
taxRate: 13,
arrivalTime: "",
purchaser: "",
remark: "",
purchaseNumber: "",
},
// 表单参数
form: {},
defaultProps: {
children: "children",
label: "label",
},
// 编码绑定表单数据源
queryBindForm: {
typeId: "", // 物资typeId
typeName: "", // 规格型号
codePrefix: "", // 编码前缀
maTypeName: "", // 物资名称
codeSuffixEnd: "", // 后缀结束
codeSuffixStart: "", // 后缀开始
code: "", //编码
},
// 表单校验
rules: {
// deviceType: [
// {
// required: true,
// message: '请选择类型规格',
// trigger: 'blur',
// },
// ],
deviceType: [
{
required: true,
message: "请选择规格型号",
trigger: "blur",
},
],
},
// 编码校验规则
queryBindFormRules: {
codePrefix: [
{ required: true, message: "请输入前缀", trigger: "blur" },
],
codeSuffixStart: [
{
required: true,
trigger: "blur",
message: "请输入前缀",
},
{
pattern: /^[1-9][0-9]*$/,
message: "请输入大于0且不能以0开头的正整数",
},
],
codeSuffixEnd: [
{
required: true,
trigger: "blur",
message: "请输入后缀",
},
{
pattern: /^[1-9][0-9]*$/,
message: "请输入大于0且不能以0开头的正整数",
},
],
},
deviceTypeTreeProps: {
children: "children",
label: "typeName",
// multiple: false,
value: "typeId",
multiple: true,
},
deviceType: [],
propsKey: 1000,
waitBindNum: 0, // 待绑定数量
// taxRate:0,
};
},
computed: {
pickerOptions() {
return {
disabledDate(time) {
const currentDate = new Date();
currentDate.setHours(0, 0, 0, 0);
return time.getTime() < currentDate.getTime();
},
};
},
},
watch: {},
mounted() {
if (this.isEdit) {
console.log("isEdit", this.isEdit);
this.taskId = this.editTaskId;
this.id = this.editId;
// this.getTaskInfo();
}
this.supplierInfoList();
this.equipmentType();
},
methods: {
//取消弹窗
closeCancel() {
this.bindCodeVisible = false;
this.resetForm("queryFormBindRef");
},
codeBind(row) {
this.bindCodeVisible = true;
this.waitBindNum = row.unitName;
},
handleAdd() {
if (this.queryBindForm.code != "") {
console.log("this.queryBindForm.code", this.queryBindForm.code);
} else {
// 1. 校验表单
this.$refs.queryFormBindRef.validate((valid) => {
if (valid) {
// 1.1 判断结束值是否大于开始值
const {
typeName,
codePrefix,
maTypeName,
codeSuffixEnd,
codeSuffixStart,
} = this.queryBindForm;
if (parseInt(codeSuffixEnd) < parseInt(codeSuffixStart)) {
this.$modal.msgError("结束值不可小于开始值");
return;
}
// 1.2 判断可编码数量
let waitCodeNum = this.waitBindNum; // 待编码数量
// 可编码数量 如相减大于代编码数量 则取待编码数量 如小于待编码数量 则取相减后值
let passCodeNUm =
codeSuffixEnd - codeSuffixStart > waitCodeNum
? waitCodeNum
: codeSuffixEnd - codeSuffixStart;
this.codeTableList = [];
// 1.3 循环生成编码
for (let i = 0; i < passCodeNUm; i++) {
const codeItem = {
typeName,
maTypeName,
outFacCode: "",
productDate: "",
maCode: `${codePrefix}${parseInt(codeSuffixStart) + i}`,
};
this.codeTableList.push(codeItem);
}
}
});
}
},
handleCodeBinding() {},
/** 物资厂家-下拉选 */
supplierInfoList() {
let param = {
pageNum: 1,
pageSize: 100,
keyWord: undefined,
};
getListFacturer(param).then((response) => {
this.supplierList = response.rows;
});
},
//选择物资厂家
// changeSupplier(supplierId) {
// this.equipmentList.forEach((item) => {
// this.$set(item, 'supplierId', supplierId)
// })
// },
/** 机具类型 */
equipmentType() {
equipmentTypeTree().then((response) => {
this.equipmentTypeList = response.data;
this.equipmentTypeList.forEach((item, index) => {
if (item.children && item.children.length > 0) {
item.children.forEach((item2, index2) => {
if (item2.children && item2.children.length > 0) {
item2.children.forEach((item3) => {
if (item3.children && item3.children.length > 0) {
item3.children.forEach((item4) => {
item4.maTypeName = item3.typeName;
item4.specificationType = item4.typeName;
this.$set(item4, "purchaseTaxPrice", 0);
this.$set(item4, "purchasePrice", 0);
});
}
});
}
});
}
});
//反显
let selectList = [];
this.equipmentList.forEach((e) => {
selectList.push(
this.getParentsById(this.equipmentTypeList, e.typeId)
);
});
this.deviceType = selectList;
});
},
//添加机具类型
deviceTypeChange(val) {
const deviceTypeList = this.$refs.deviceTypeCascader.getCheckedNodes();
let tempList = [];
if (val.length > 0) {
const items = val.map((e) => {
return e[3];
});
for (let i of items) {
for (let z of deviceTypeList) {
if (z.data.typeId === i) {
const obj = JSON.parse(JSON.stringify(z.data));
// obj.supplierId = ''
obj.createTime = null;
obj.productionTime = "";
obj.purchaseTaxPrice = 0;
obj.purchaseTaxPrice = 0;
obj.purchaseNum = 1;
obj.fixCode = "0";
obj.bmFileInfos = [];
tempList.push(obj);
break;
}
}
}
const newDataListNew = [...this.equipmentList, ...tempList];
const map = new Map();
for (let item of newDataListNew) {
if (!map.has(item.typeId)) {
map.set(item.typeId, item);
}
}
const newArray = [...map.values()];
let newArray_array = [];
items.forEach((e) => {
newArray.forEach((j) => {
if (e == j.typeId) {
newArray_array.push(j);
}
});
});
this.equipmentList = newArray_array;
} else {
this.equipmentList = [];
}
},
//获取任务详情--- 编辑回显数据
getTaskInfo() {
// this.loading = true;
getPurchaseCheckInfo({
taskId: this.taskId,
id: this.id,
taskStatus: 1,
}).then((response) => {
this.maForm = response.data.purchaseCheckInfo;
this.maForm.id = response.data.purchaseCheckInfo.id;
this.maForm.taskId = response.data.purchaseCheckInfo.taskId;
this.maForm.arrivalTime = response.data.purchaseCheckInfo.arrivalTime;
this.maForm.supplierId = response.data.purchaseCheckInfo.supplierId;
this.maForm.remark = response.data.purchaseCheckInfo.remark;
this.maForm.taxRate = response.data.purchaseCheckInfo.taxRate;
// this.maForm.purchaseNumber = response.data.purchaseNumber
// this.maForm.productionTime = response.data.purchaseCheckInfo.productionTime
this.equipmentList = response.data.purchaseCheckDetailsList;
console.log(this.equipmentList);
// this.loading = false;
});
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.roleId);
this.single = selection.length != 1;
this.multiple = !selection.length;
},
/** 保存按钮操作 */
handleSave() {
// console.log(this.equipmentList)
if (this.equipmentList.length > 0) {
this.$refs["maForm"].validate((valid) => {
if (valid) {
this.maForm.taskId = this.taskId;
// this.maForm.checkDetailsList = this.equipmentList
this.$modal
.confirm("是否确认保存当前页面")
.then(function () {})
.then(() => {
if (this.isEdit) {
console.log("编辑");
this.loading = true;
updatePurchaseCheckInfo({
purchaseCheckDetailsList: this.equipmentList,
purchaseCheckInfo: this.maForm,
}).then((response) => {
if (response.code == 200) {
this.$modal.msgSuccess("编辑成功");
// this.$tab.closeOpenPage({
// path: '/store/newBuy/newDevicesList',
// })
this.$emit("addToolsSuccess");
}
this.loading = false;
});
} else if (!this.isEdit) {
console.log("新增");
// console.log(this.equipmentList)
this.loading = true;
addApplyInfo({
leaseApplyDetailsList: this.equipmentList,
leaseApplyInfo: this.maForm,
}).then((response) => {
if (response.code == 200) {
this.$modal.msgSuccess("新增成功");
// this.$tab.closeOpenPage({
// path: '/store/newBuy/newDevicesList',
// })
this.$emit("addToolsSuccess");
}
this.loading = false;
});
}
})
.catch(() => {});
}
});
} else {
this.$modal.msgError("请先添加机具类型");
}
},
//树结构数据获取父
getParentsById(list, id) {
for (let i in list) {
if (list[i].typeId == id) {
//查询到就返回该数组对象的value
return [list[i].typeId];
}
if (list[i].children) {
let node = this.getParentsById(list[i].children, id);
if (node !== undefined) {
//查询到把父节把父节点加到数组前面
node.unshift(list[i].typeId);
return node;
}
}
}
},
/** 删除按钮操作 */
handleDelete(row) {
// console.log(row.id)
this.$modal
.confirm("是否确认删除所选择的数据项?")
.then(() => {
this.deviceType.forEach((e, index) => {
if (e[3] === row.typeId) {
this.deviceType.splice(index, 1);
this.propsKey++;
}
});
this.equipmentList.forEach((item, index) => {
if (item.id == row.id) {
this.equipmentList.splice(index, 1);
}
});
})
.catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
this.download(
"/material/purchase_check_info/exportDetails",
{ taskId: this.taskId },
`新购到货详情_${new Date().getTime()}.xlsx`
);
},
},
};
</script>
<style lang="scss">
.popper-select {
.el-cascader-panel .el-scrollbar .el-checkbox {
display: none;
}
.el-cascader-panel .el-scrollbar:nth-child(4) .el-checkbox {
display: block !important;
}
}
</style>