<template>
|
<el-dialog
|
:close-on-click-modal="false"
|
:visible.sync="islook"
|
width="60rem"
|
class="add-event-dialog"
|
@close="shutdown"
|
>
|
<div slot="title" class="tac drawerHeader">
|
<span>{{ editRow.id ? "编辑" : "创建" }}采购单</span>
|
</div>
|
<div class="dialog-content-box">
|
<div class="margin_bottom_20px font_size_14 title">基础信息</div>
|
<el-form
|
ref="form"
|
:rules="rules"
|
:model="form"
|
label-width="120px"
|
label-position="left"
|
>
|
<el-form-item
|
label="采购类型"
|
prop="brand"
|
class="form-item float_left"
|
>
|
<el-select
|
placeholder="请选择采购类型"
|
v-model="form.brand"
|
clearable
|
style="width: calc(100% - 30px)"
|
>
|
<el-option
|
v-for="ele in plcBrandList"
|
:key="ele.id"
|
:label="ele.name"
|
:value="ele.name"
|
></el-option>
|
</el-select>
|
<i
|
class="el-icon-setting margin_left_10px cursor_pointer"
|
style="font-size: 20px; color: #333"
|
@click="handleShow"
|
></i>
|
</el-form-item>
|
<el-form-item label="供应商名称" prop="returnNumber" class="form-item">
|
<el-input
|
v-model="form.returnNumber"
|
maxlength="50"
|
clearable
|
placeholder="请输入"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="单据来源" prop="returnName" class="form-item">
|
<el-input
|
v-model="form.returnName"
|
maxlength="50"
|
clearable
|
placeholder="请输入"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="采购单名称" prop="returnName" class="form-item">
|
<el-input
|
v-model="form.returnName"
|
maxlength="50"
|
clearable
|
placeholder="请输入"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="供应商联系人" prop="returnName" class="form-item">
|
<el-input
|
v-model="form.returnName"
|
maxlength="50"
|
clearable
|
placeholder="请输入"
|
></el-input>
|
</el-form-item>
|
|
<el-form-item label="联系人电话" prop="contact_phone" class="form-item">
|
<el-input
|
v-model="form.contact_phone"
|
placeholder="请输入"
|
maxlength="11"
|
show-word-limit
|
></el-input>
|
</el-form-item>
|
<el-form-item label="签约日期" prop="returnAt" class="form-item">
|
<el-date-picker
|
v-model="form.returnAt"
|
style="width: 100%"
|
type="date"
|
placeholder="选择日期"
|
value-format="yyyy-MM-dd"
|
>
|
</el-date-picker>
|
</el-form-item>
|
<el-form-item label="交付日期" prop="returnAt" class="form-item">
|
<el-date-picker
|
v-model="form.returnAt"
|
style="width: 100%"
|
type="date"
|
placeholder="选择日期"
|
value-format="yyyy-MM-dd"
|
>
|
</el-date-picker>
|
</el-form-item>
|
<el-form-item label="备注信息" prop="remark" class="form-item-two">
|
<el-input
|
type="textarea"
|
:autosize="{ minRows: 3, maxRows: 4 }"
|
maxlength="500"
|
clearable
|
v-model="form.remark"
|
></el-input>
|
</el-form-item>
|
</el-form>
|
<div class="form-bottom-box">
|
<div class="form-bottom-box-top">
|
<div class="margin_bottom_2px font_size_14 title">产品信息</div>
|
</div>
|
|
<el-table
|
ref="multipleTable"
|
:header-cell-style="{ background: '#f1f3f8', color: '#000009' }"
|
:data="returnItems"
|
tooltip-effect="dark"
|
height="calc(100% - 80px)"
|
row-key="id"
|
border
|
style="width: 100%; padding: 0"
|
>
|
<el-table-column label="序号" type="index" width="80">
|
</el-table-column>
|
<el-table-column label="工具类型" prop="toolType" width="120">
|
<!-- <template slot-scope="scope">
|
{{ scope.row.toolType }}
|
</template> -->
|
</el-table-column>
|
<el-table-column prop="toolNumber" label="工具编码">
|
</el-table-column>
|
<el-table-column prop="toolName" label="工具名称"> </el-table-column>
|
<el-table-column label="操作" width="100">
|
<template slot-scope="scope">
|
<el-button @click="deleteClick(scope)" type="text" size="small"
|
>移除</el-button
|
>
|
</template>
|
</el-table-column>
|
</el-table>
|
<div class="font_size_14 margin_top_10px float_right">
|
归还总数：{{ returnItems ? returnItems.length : 0 }}
|
</div>
|
</div>
|
</div>
|
<div slot="footer" class="dialog-footer tac">
|
<el-button @click="shutdown">取消</el-button>
|
|
<el-button type="primary" @click="onSubmit(form)">确定</el-button>
|
</div>
|
<BomDialog
|
ref="editDialog"
|
@sucessSet="handleGetBomKindDictList"
|
@handleConfirmSave="handleConfirmSave"
|
:workList="plcBrandList"
|
title="PLC品牌"
|
></BomDialog>
|
</el-dialog>
|
</template>
|
|
<script>
|
import BomDialog from "@/views/purchaseManage/purchase/components/BomDialog";
|
import {
|
postGetUnitDictList,
|
postGetSaveSUnitDict,
|
} from "@/api/purchaseManage/purchase";
|
export default {
|
components: {
|
BomDialog,
|
},
|
props: {
|
editRow: {
|
type: [Object],
|
default: () => {
|
return {};
|
},
|
},
|
},
|
data() {
|
return {
|
islook: false,
|
showWorkerList: [],
|
form: {
|
remark: "",
|
returnAt: "",
|
returnName: "",
|
returnNumber: "",
|
returnObj: "",
|
returnerId: "",
|
returnerName: "",
|
contact_phone: "",
|
},
|
|
rules: {
|
// 手机号
|
contact_phone: [
|
{
|
required: true,
|
message: "请填写",
|
trigger: "change",
|
},
|
{ validator: this.validatorPhone, trigger: "change" },
|
],
|
// 领用编号
|
returnNumber: [
|
{
|
required: true,
|
message: "请填写",
|
trigger: "change",
|
},
|
],
|
// 归还名称
|
returnName: [
|
{
|
required: true,
|
message: "请填写",
|
trigger: "change",
|
},
|
],
|
// 归还时间
|
returnAt: [
|
{
|
required: true,
|
message: "请选择",
|
trigger: "change",
|
},
|
],
|
// 归还人
|
returnObj: [
|
{
|
required: true,
|
message: "请选择",
|
trigger: "change",
|
},
|
],
|
},
|
|
returnItems: [], //字典下的表格
|
PreObj: {
|
pageSize: 0,
|
page: 0,
|
projectID: "",
|
},
|
|
// 某人的领用明细
|
toolsObj: {
|
takeName: "",
|
page: 1,
|
pageSize: 500,
|
takerId: "",
|
toolName: "",
|
toolType: "",
|
},
|
plcBrandList: [],
|
};
|
},
|
mounted() {},
|
watch: {
|
editRow(val) {
|
if (val.id && this.islook) {
|
this.initFormData(val);
|
}
|
},
|
islook(val) {
|
if (val) {
|
this.returnItems = [];
|
this.form = {
|
remark: "",
|
returnAt: "",
|
returnName: "",
|
returnNumber: "",
|
returnerId: "",
|
returnerName: "",
|
returnObj: "",
|
contact_phone: "",
|
};
|
|
if (this.editRow && this.editRow.id) {
|
this.initFormData(this.editRow);
|
}
|
}
|
},
|
},
|
methods: {
|
validatorPhone(rule, value, callback) {
|
if (value) {
|
if (value == undefined || value == null) {
|
callback(new Error("请输入"));
|
} else {
|
if (value.length != 11) {
|
callback(new Error("长度在11个字符！"));
|
} else {
|
var reg =
|
/^1(3\d|4[5-9]|5[0-35-9]|6[2567]|7[0-8]|8\d|9[0-35-9])\d{8}$/;
|
if (!reg.test(value)) {
|
callback(new Error("请填写正确的联系电话！"));
|
} else {
|
callback();
|
}
|
}
|
}
|
} else {
|
callback();
|
}
|
},
|
// PLC配置设置
|
handleShow() {
|
this.handleGetBomKindDictList();
|
this.$refs.editDialog.editDialogVisible = true;
|
},
|
// PLC配置
|
handleGetBomKindDictList(val) {
|
postGetUnitDictList().then((res) => {
|
this.unitList = res.data;
|
if (val) {
|
for (let i in this.unitList) {
|
if (this.unitList[i].isDefault) {
|
this.form.unit = this.form.unit
|
? this.form.unit
|
: this.unitList[i].name;
|
this.$set(this.form, "unit", this.form.unit);
|
break;
|
}
|
}
|
}
|
});
|
},
|
handleConfirmSave(data) {
|
postGetSaveSUnitDict({ data: data }).then((res) => {
|
if (res.code == 200) {
|
this.$message({
|
message: "操作成功！",
|
type: "success",
|
});
|
this.$refs.editDialog.editDialogVisible = false;
|
this.handleGetBomKindDictList();
|
}
|
});
|
},
|
returnChange(val) {
|
if (val) {
|
this.toolsObj.takerId = this.form.returnObj.split("&")[0];
|
} else {
|
this.toolsObj.takerId = "";
|
}
|
},
|
|
// 添加工具 领用明细
|
selectTools(frockType, selections) {
|
for (let i in selections) {
|
let isPush = true;
|
if (this.returnItems.length > 0) {
|
for (let j in this.returnItems) {
|
if (selections[i].id == this.returnItems[j].toolNumber) {
|
isPush = false;
|
}
|
}
|
}
|
|
if (isPush) {
|
let toolName = "";
|
if (frockType == "模具") {
|
toolName = selections[i].moldName;
|
} else if (frockType == "检具") {
|
toolName = selections[i].gaugeName;
|
} else {
|
toolName = selections[i].frockName;
|
}
|
let item = {
|
toolType: frockType,
|
toolNumber: selections[i].id,
|
toolName: toolName,
|
};
|
this.returnItems.push(item);
|
}
|
}
|
},
|
|
initFormData(row) {
|
if (row.id) {
|
let form = JSON.parse(JSON.stringify(row));
|
this.form = {
|
remark: form.remark,
|
returnAt: form.ReturnAt,
|
contact_phone: form.contact_phone,
|
returnName: form.ReturnName,
|
returnNumber: form.ReturnNumber,
|
returnerId: form.ReturnerId,
|
returnerName: form.ReturnerName,
|
returnObj: "",
|
id: row.id,
|
};
|
|
if (this.form.returnerId && this.form.returnerName) {
|
this.form.returnObj =
|
this.form.returnerId + "&" + this.form.returnerName;
|
}
|
this.returnItems = this.editRow.ReturnItems;
|
}
|
},
|
|
deleteClick(scope) {
|
this.returnItems.splice(scope.$index, 1);
|
this.$forceUpdate();
|
this.$message({
|
type: "success",
|
message: "移除成功！",
|
});
|
},
|
onSubmit() {
|
this.$refs.form.validate((valid) => {
|
if (valid) {
|
let params = JSON.parse(JSON.stringify(this.form));
|
params.returnerId = params.returnObj.split("&")[0];
|
params.returnerName = params.returnObj.split("&")[1];
|
params.returnItems = this.returnItems;
|
if (this.editRow && this.editRow.id) {
|
params.id = this.editRow.id;
|
// editReturn(params).then((res) => {
|
// if (res.code == 200) {
|
// this.$message.success("编辑成功！");
|
// this.$emit("shutdown", this.form);
|
// this.shutdown();
|
// }
|
// });
|
} else {
|
// addReturn(params).then((res) => {
|
// if (res.code == 200) {
|
// this.$message.success("添加成功！");
|
// this.$emit("shutdown", this.form);
|
// this.shutdown();
|
// }
|
// });
|
}
|
}
|
});
|
},
|
shutdown() {
|
this.islook = false;
|
this.$refs.form.resetFields();
|
},
|
},
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
::v-deep .el-tabs__content {
|
height: calc(100% - 55px);
|
overflow-y: auto;
|
}
|
.title {
|
height: 42px;
|
line-height:42px;
|
font-weight: 700px;
|
padding: 0 10px;
|
color: #333;
|
background: rgb(236, 244, 255);
|
}
|
.form-bottom-box {
|
height: calc(100% - 340px);
|
|
.form-bottom-box-top {
|
height: 50px;
|
overflow: hidden;
|
}
|
}
|
.form-item {
|
width: calc(50% - 20px);
|
float: left;
|
&:nth-of-type(odd) {
|
margin-right: 20px;
|
}
|
}
|
.form-item-two {
|
width: 100%;
|
float: left;
|
}
|
.form-item-three {
|
width: calc(100% - 20px);
|
float: left;
|
}
|
.form-item-check {
|
width: calc(33% - 40px);
|
float: left;
|
&:nth-of-type(odd) {
|
margin-right: 20px;
|
}
|
}
|
.title {
|
width: 100%;
|
}
|
.dialog-content-box {
|
height: 580px;
|
padding-bottom: 50px;
|
overflow-y: auto;
|
|
.el-form {
|
overflow: hidden;
|
padding: 0 10px;
|
}
|
}
|
.num-identify {
|
padding: 5px 8px;
|
background-color: rgba(255, 153, 0, 1);
|
border-radius: 6px;
|
font-size: 14px;
|
color: #fff;
|
font-weight: 600;
|
}
|
.drawerHeader {
|
// position:relative;
|
.identify {
|
width: 80px;
|
height: 25px;
|
line-height: 25px;
|
text-align: center;
|
border: 1px solid rgba(255, 153, 0, 1);
|
border-radius: 6px;
|
font-size: 16px;
|
color: rgba(255, 153, 0, 1);
|
transform: rotate(15deg);
|
font-weight: 600;
|
margin-right: 100px;
|
margin-top: 12px;
|
float: right;
|
}
|
}
|
</style>
|
