<template>
|
<div class="dispose">
|
<a-form-model
|
ref="formRef"
|
name="advanced_search"
|
class="ant-advanced-search-form"
|
:model="info"
|
:rules="rules"
|
>
|
<a-row>
|
<a-col :span="12">
|
<a-form-model-item
|
class="ant-row-flex"
|
label="入库时间"
|
:labelCol="{ flex: '8em' }"
|
:wrapperCol="{ flex: 1 }"
|
prop="startTime"
|
>
|
<a-date-picker
|
format="YYYY-MM-DD"
|
disabled
|
valueFormat="YYYY-MM-DD"
|
:allowClear="false"
|
:disabled-date="disabledDate"
|
:show-time="{ defaultValue: moment('00:00:00', 'HH:mm:ss') }"
|
v-model="info.startTime"
|
/>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-model-item
|
class="ant-row-flex"
|
label="厂商名称"
|
:labelCol="{ flex: '8em' }"
|
:wrapperCol="{ flex: 1 }"
|
prop="provideName"
|
>
|
<a-input
|
disabled
|
placeholder="请输入厂商名称"
|
v-model.trim="info.provideName"
|
/>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-model-item
|
class="ant-row-flex"
|
label="产品名称"
|
:labelCol="{ flex: '8em' }"
|
:wrapperCol="{ flex: 1 }"
|
prop="productName"
|
>
|
<a-input
|
disabled
|
placeholder="请输入产品名称"
|
v-model.trim="info.productName"
|
/>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-model-item
|
class="ant-row-flex"
|
label="产品型号"
|
:labelCol="{ flex: '8em' }"
|
:wrapperCol="{ flex: 1 }"
|
prop="type"
|
>
|
<a-input
|
disabled
|
placeholder="请输入产品型号"
|
v-model.trim="info.type"
|
/>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-model-item
|
class="ant-row-flex"
|
label="剩余不良数"
|
:labelCol="{ flex: '8em' }"
|
:wrapperCol="{ flex: 1 }"
|
prop="restProduct"
|
>
|
<a-input disabled v-model.number="info.restProduct" />
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="12">
|
<a-form-model-item
|
class="ant-row-flex"
|
label="处理数量"
|
:labelCol="{ flex: '8em' }"
|
:wrapperCol="{ flex: 1 }"
|
prop="delProduct"
|
>
|
<a-input-number
|
placeholder="请输入处理数量"
|
:min="1"
|
:max="info.restProduct"
|
v-model.number="info.delProduct"
|
/>
|
</a-form-model-item>
|
</a-col>
|
<a-col :span="24">
|
<a-form-model-item
|
class="ant-row-flex"
|
label="处理描述"
|
:labelCol="{ flex: '8em' }"
|
:wrapperCol="{ flex: 1 }"
|
prop="note"
|
>
|
<a-textarea
|
placeholder="请输入处理描述"
|
v-model.trim="info.note"
|
:rows="2"
|
/>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
<a-row type="flex" class="row">
|
<a-col :span="12">
|
<a-form-model-item
|
class="ant-row-flex"
|
label="邮件通知"
|
:labelCol="{ flex: '8em' }"
|
:wrapperCol="{ flex: 1 }"
|
prop="selectedItems"
|
>
|
<a-select
|
mode="multiple"
|
placeholder=""
|
:value="info.selectedItems"
|
style="width: 100%"
|
allow-clear
|
@change="handleChange"
|
>
|
<a-select-option
|
v-for="item in filteredOptions"
|
:key="item.name"
|
:value="item.name"
|
:disabled="!item.isHasMail"
|
>
|
{{ item.name }}
|
</a-select-option>
|
</a-select>
|
</a-form-model-item>
|
</a-col>
|
</a-row>
|
<a-row type="flex" class="row">
|
<a-col flex="8em" class="label">附件</a-col>
|
<a-col :flex="1">
|
<a-upload
|
class="upload"
|
:before-upload="beforeUpload"
|
@change="uploadChange"
|
multiple
|
>
|
<!-- accept=".zip,.rar" -->
|
<a-button type="primary">选择附件</a-button>
|
</a-upload>
|
</a-col>
|
</a-row>
|
</a-form-model>
|
<div class="modal-footer">
|
<a-button type="danger" @click="cancel"> 取消 </a-button>
|
<a-button type="primary" @click="ok"> 提交 </a-button>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import moment from "moment";
|
import { updateDefective } from "./apis";
|
|
import { searchDefaultMailUser } from "../../components/emailCard/apis";
|
import { getUserList } from "../../permission/apis";
|
|
export default {
|
name: "",
|
props: {
|
record: {
|
type: Object,
|
required: true,
|
},
|
},
|
data() {
|
// console.log("record", this.record, "=============");
|
const {
|
restProduct,
|
id: deftId,
|
productName,
|
provideName,
|
type,
|
startTime,
|
} = this.record;
|
|
return {
|
userList: [],
|
defaultMailUsers: [],
|
selectedItems: [],
|
userListAll: [],
|
info: {
|
deftId,
|
restProduct,
|
provideName,
|
productName,
|
note: "",
|
type,
|
sumProduct: "",
|
badProduct: "",
|
delProduct: "",
|
// startTime: moment().format("YYYY-MM-DD"),
|
startTime,
|
selectedItems: [],
|
},
|
file: null,
|
receiverIds: "",
|
receiverNames: "",
|
rules: {
|
delProduct: [
|
{
|
required: true,
|
message: "请输入处理数量",
|
trigger: "blur",
|
},
|
],
|
note: [
|
{
|
required: true,
|
message: "请输入处理描述",
|
trigger: "blur",
|
},
|
],
|
selectedItems: [
|
{
|
required: true,
|
message: "请先择要邮件通知的人员",
|
trigger: "blur",
|
},
|
// { validator: validateSelectedItems, trigger: "change" },
|
],
|
},
|
};
|
},
|
computed: {
|
filteredOptions() {
|
let users = this.userListAll;
|
return users
|
.filter((o) => !this.info.selectedItems.includes(o.name))
|
.map((o) => {
|
o.isHasMail = o.mail ? true : false;
|
return o;
|
});
|
},
|
},
|
methods: {
|
moment,
|
beforeUpload() {
|
return false;
|
},
|
uploadChange(data) {
|
const { file, fileList } = data;
|
if (fileList.length) {
|
this.file = fileList.map((v) => v.originFileObj);
|
} else {
|
this.file = null;
|
}
|
},
|
searchAllUserList() {
|
getUserList()
|
.then((res) => {
|
let rs = res.data;
|
if (rs.code && rs.data) {
|
this.userListAll = rs.data2;
|
this.searchDefaultMailUser();
|
}
|
})
|
.catch((error) => {
|
console.log(error);
|
});
|
},
|
searchDefaultMailUser() {
|
// type为4
|
let type = 4;
|
searchDefaultMailUser(type).then((res) => {
|
let rs = res.data;
|
let data = [];
|
if (rs.code === 1) {
|
data = rs.data.map((item) => {
|
return item.user;
|
});
|
}
|
this.info.selectedItems = this.userListAll
|
.filter((o) => data.includes(o.name) && o.mail)
|
.map((item) => {
|
return item.name;
|
});
|
this.handleChange(this.info.selectedItems);
|
});
|
},
|
handleChange(selectedItems) {
|
this.info.selectedItems = selectedItems;
|
let users = this.userListAll;
|
let mailList = users.filter((o) =>
|
this.info.selectedItems.includes(o.name)
|
);
|
this.receiverNames = mailList.map((v) => v.name).join(",");
|
this.receiverIds = mailList.map((v) => v.id).join(",");
|
},
|
cancel() {
|
this.$emit("cancel");
|
},
|
ok() {
|
this.$refs["formRef"].validate((valid) => {
|
if (valid) {
|
let loading = this.$layer.loading();
|
const formData = new FormData();
|
if (this.file) {
|
this.file.forEach((v) => {
|
formData.append("multipartFileList", v);
|
});
|
}
|
let { deftId, note, delProduct } = this.info;
|
formData.append(
|
"defectiveHisJson",
|
JSON.stringify({
|
deftId,
|
note,
|
delProduct,
|
receiverIds: this.receiverIds,
|
receiverNames: this.receiverNames,
|
})
|
);
|
|
updateDefective(formData)
|
.then((res) => {
|
let { code, data } = res.data;
|
this.$layer.close(loading);
|
if (code && data) {
|
this.$message.success("操作成功");
|
this.$emit("ok");
|
} else {
|
this.$message.error("操作失败");
|
}
|
})
|
.catch((err) => {
|
console.log(err);
|
this.$layer.close(loading);
|
});
|
} else {
|
this.$message.error("存在未通过检验的表单项");
|
return false;
|
}
|
});
|
},
|
disabledDate(current) {
|
// Can not select days before today and today
|
return current > moment().endOf("day");
|
},
|
},
|
mounted() {
|
this.searchAllUserList();
|
},
|
};
|
</script>
|
|
<style lang="less" scoped>
|
.modal-footer {
|
text-align: right;
|
button + button {
|
margin-left: 8px;
|
}
|
}
|
.row {
|
color: rgba(0, 0, 0, 0.85);
|
line-height: 30px;
|
.label {
|
text-align: right;
|
}
|
.label::after {
|
content: ":";
|
position: relative;
|
top: -0.5px;
|
margin: 0 8px 0 2px;
|
}
|
}
|
|
/deep/ .ant-input-number {
|
width: 100%;
|
}
|
</style>
|