You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
spms-vue/src/views/purchase/supProductAuditDialog.vue

685 lines
20 KiB
Vue

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div>
<el-form
:model="inputQuery"
:rules="rules"
ref="inputQuery"
label-width="100px"
style="margin-top: -20px"
>
<el-card class="el-card">
<div style="display: flex;" v-if="editType==2">
<el-button
type="primary"
size="mini"
icon="search"
@click="onPassSubmit"
>审核通过
</el-button
>
<el-button
type="primary"
size="mini"
icon="search"
@click="onRejectSubmit"
>审核拒绝
</el-button
>
</div>
<el-row :gutter="20" class="el-row" type="flex" style="margin-top: 20px">
<el-col :span="10" class="el-col">
<el-form-item label="所属供应商:" label-width="150px" prop="customerId">
<el-select
v-model="inputQuery.customerId"
filterable
remote
clearable="true"
reserve-keyword
placeholder="请选择供应商"
:remote-method="findMethod" disabled
:loading="loading"
style="width: 100%;"
@change="supChange"
>
<el-option
v-for="item in fromOptions"
:key="item.customerId"
:label="item.companyName"
:value="item.customerId"
>
<span style="float: left">{{ item.companyName }}</span>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="10" class="el-col">
<el-form-item label="所属生产企业:" label-width="150px" prop="manufacturerIdFk">
<el-select
v-model="inputQuery.manufacturerIdFk"
filterable
remote
clearable="true"
disabled
reserve-keyword
placeholder="请选择生产企业"
:remote-method="findPMMethod"
:loading="loading"
style="width: 100%;"
>
<el-option
v-for="item in fromPMOptions"
:key="item.manufacturerId"
:label="item.companyName"
:value="item.manufacturerId"
>
<span style="float: left">{{ item.companyName }}</span>
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20" class="el-row" type="flex">
<el-col :span="10" class="el-col">
<el-form-item label="注册/备案号:" label-width="150px" prop="recordCode">
<el-input
size="small"
placeholder="请输入内容"
v-model="inputQuery.recordCode" disabled
@input="change()"
></el-input>
</el-form-item>
</el-col>
<el-col :span="10" class="el-col">
<el-form-item label="注册/备案产品名称:" label-width="150px" prop="recordProductName">
<el-input
size="small"
placeholder="请输入内容"
v-model="inputQuery.recordProductName" disabled
@input="change()"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20" class="el-row" type="flex">
<el-col :span="10" class="el-col">
<el-form-item label="注册/备案人名称:" label-width="150px" prop="recordPeopleName">
<el-input
size="small"
placeholder="请输入内容" disabled
v-model="inputQuery.recordPeopleName"
@input="change()"
></el-input>
</el-form-item>
</el-col>
<el-col :span="10" class="el-col">
<el-form-item label="代理人名称:" label-width="150px" prop="agentName">
<el-input
size="small"
placeholder="请输入内容"
v-model="inputQuery.agentName" disabled
@input="change()"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20" class="el-row" type="flex">
<el-col :span="10" class="el-col">
<el-form-item label="医疗器械管理类别:" label-width="150px" prop="productManageType">
<el-select
size="small"
v-model="inputQuery.productManageType" disabled
placeholder="医疗器械管理类别"
style="width: 100%;"
>
<el-option label="Ⅰ类" value="1"></el-option>
<el-option label="Ⅱ类" value="2"></el-option>
<el-option label="Ⅲ类" value="3"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="10" class="el-col">
<el-form-item label="器械类别:" label-width="150px" prop="productType">
<el-select
size="small"
v-model="inputQuery.productType" disabled
placeholder="医疗器械管理类别"
style="width: 100%;"
>
<el-option label="器械" value="1"></el-option>
<el-option label="诊断试剂" value="2"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20" class="el-row" type="flex">
<el-col :span="10" class="el-col">
<el-form-item label="器械目录分类编码:" label-width="150px" prop="productDirectoryCode">
<el-input
size="small"
placeholder="请输入内容"
v-model="inputQuery.productDirectoryCode" disabled
@input="change()"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20" class="el-row" type="flex">
<el-col :span="20" class="el-col">
<el-form-item label="规格型号:" label-width="150px" prop="specification">
<el-input
type="textarea"
size="small"
placeholder="请输入内容"
v-model="inputQuery.specification" disabled
@input="change()"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20" class="el-row" type="flex">
<el-col :span="20" class="el-col">
<el-form-item label="备注:" label-width="150px" prop="remark">
<el-input
type="textarea"
size="small"
placeholder="请输入内容"
v-model="inputQuery.remark" disabled
@input="change()"
></el-input>
</el-form-item>
</el-col>
</el-row>
</el-card>
</el-form>
<el-card class="el-card">
<el-table v-loading="certLoading"
:data="certList"
style="width: 100%">
<el-table-column type="index" label="序号" width="50"></el-table-column>
<el-table-column label="证书名称" prop="name"></el-table-column>
<el-table-column label="证书编号" prop="code"></el-table-column>
<el-table-column label="有效期" prop="vailDate"></el-table-column>
<el-table-column label="失效期" prop="expireDate"></el-table-column>
<el-table-column label="备注" prop="remark"></el-table-column>
<el-table-column label="证书状态" prop="status">
<template slot-scope="scope">
{{ supStatus[scope.row.status] }}
</template>
</el-table-column>
<el-table-column label="审核状态" prop="auditStatus" width="120">
<template slot-scope="scope">
<el-tag :type="(scope.row.auditStatus) | statusFilterType">
{{ checkFlag[scope.row.auditStatus] }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" width="250">
<template slot-scope="scope">
<el-button
type="text"
size="small"
@click.native="toViewCompanyCert(scope.row)"
>预览
</el-button
>
<el-button
type="text"
size="small"
v-if="editType==2"
@click.native="auditCert(scope.row)"
>审核
</el-button
>
<el-button
type="text"
size="small"
@click.native="rejectInfo(scope.row)"
>说明
</el-button
>
<!-- <el-button-->
<!-- type="text"-->
<!-- size="small"-->
<!-- @click.native="deleteCompanyCert(scope.row)"-->
<!-- >删除-->
<!-- </el-button-->
<!-- >-->
</template>
</el-table-column>
</el-table>
<el-pagination
:page-size="certQuery.limit"
@current-change="certHandleCurrentChange"
layout="prev, pager, next"
:total="certTotal"
>
</el-pagination>
</el-card>
<el-dialog width="30%" :visible.sync="certAuditVisible" append-to-body>
<el-form :model="currentAudit">
<label></label>
<el-form-item label="审核备注:" :label-width="120">
<el-input type="textarea" v-model="currentAudit.auditComment" autocomplete="off"
autosize></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="rejectAuditCert">审核拒绝</el-button>
<el-button type="primary" @click="passAuditCert"></el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {auditSupProduct} from "../../api/purchase/suppliersRegistrationBasic";
import {
provinceAndCityData,
regionData,
provinceAndCityDataPlus,
regionDataPlus,
CodeToText,
TextToCode,
} from "element-china-area-data";
import draggable from "vuedraggable";
import {getSupComapnys} from "@/api/purchase/supCompany";
import {addOrModifyCompany, getCompanyList} from "@/api/purchase/supManufacturer";
import {auditSupCert, deleteCompanyCert, filterCompanyCert} from "@/api/purchase/companyCert";
import companyAddCert from "@/views/purchase/supCertAddDialog";
import {getUUID} from "@/utils/strUtil";
import {BASE_URL} from "@/config/app";
export default {
name: "supProductEditDialog",
props: {
closeRegistrationDialog: {
type: Function,
required: true,
},
inputQuery: {
type: Object,
required: true,
},
editType: {
type: Object,
required: true,
}
},
data() {
return {
fromOptions: [],
fromPMOptions: [],
pmQuery: {
customerId: null,
companyName: null,
page: 1,
limit: 10,
},
loading: false,
classesDisplay: false,
selectedOptions: [],
selectedOptions2: [],
options: regionDataPlus,
rules: {
customerId: [
{
required: true,
message: "请选择供应商",
trigger: "change"
}
],
manufacturerIdFk: [
{
required: true,
message: "请选择生产企业",
trigger: "change"
}
],
recordCode: [
{
required: true,
message: "请输入注册/备案号",
trigger: "blur"
}
],
recordProductName: [
{
required: true,
message: "请输入注册/备案产品名称",
trigger: "blur"
}
],
productManageType: [
{
required: true,
message: "请选择医疗器械管理类别",
trigger: "change"
}
],
productType: [
{
required: true,
message: "请选择器械类别",
trigger: "change"
}
],
recordPeopleName: [
{
required: true,
message: "请输入注册/备案人名称",
trigger: "change"
}
],
productDirectoryCode: [
{
required: true,
message: "请输入器械目录分类编码",
trigger: "change"
}
],
specification: [
{
required: true,
message: "请输入规格型号",
trigger: "change"
}
],
},
fileList: [],
fileList2: [],
idQuery: {
id: "",
},
certQuery: {
customerId: null,
manufacturerIdFk: null,
page: 1,
limit: 20
},
certList: [],
certTotal: 0,
certLoading: false,
addCertVisible: false,
certFileUrl: "",
addType: "3", //证书类型1:供应商2.生产企业3.产品品种
checkFlag: {
0: "草稿",
1: "已通过",
2: "已拒绝",
3: "变更未审核",
6: "未审核",
},
supStatus: {
0: "有效",
1: "失效",
},
certAuditVisible: false,
currentAudit: {},
};
},
created() {
if (this.editType == 0) {
this.inputQuery.productId = getUUID("");
} else {
if(this.editType!=2 && this.editType!=0){
this.certQuery.auditStatus = 20;
}
this.getCompanyCertList();
this.pmQuery.customerId = this.inputQuery.customerId;
this.findPMMethod();
}
this.findMethod();
this.certFileUrl = BASE_URL + "/udiwms/image/register/file/getImage?type=image2&name=";
},
components: {
draggable, companyAddCert
},
methods: {
onPassSubmit() {
this.$confirm("是否审核通过?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
this.loading = true;
this.inputQuery.auditStatus = 1;
auditSupProduct(this.inputQuery).then(response => {
this.loading = false;
if (response.code === 20000) {
this.closeRegistrationDialog(true);
this.$message.success("保存成功");
} else {
this.$message.error(response.message);
}
});
}).catch(() => {
});
},
onRejectSubmit() {
this.$prompt('请输入驳回意见', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
}).then(({value}) => {
this.inputQuery.auditComment = value;
this.inputQuery.auditStatus = 2;
auditSupProduct(this.inputQuery).then(response => {
this.loading = false;
if (response.code === 20000) {
this.closeRegistrationDialog(true);
this.$message.success("保存成功");
} else {
this.$message.error(response.message);
}
});
}).catch(() => {
});
}
,
findMethod(query) {
this.fromOptions = [];
let cQuery = {
companyName: query,
};
getSupComapnys(cQuery)
.then((response) => {
this.loading = false;
this.fromOptions = response.data.list || [];
})
.catch(() => {
this.loading = false;
});
},
supChange(val) {
this.pmQuery.customerId = val;
this.findPMMethod();
},
findPMMethod(key) {
this.fromPMOptions = [];
this.pmQuery.companyName = key;
getCompanyList(this.pmQuery)
.then((response) => {
this.loading = false;
this.fromPMOptions = response.data.list || [];
this.total = response.data.total || 0;
})
.catch(() => {
this.loading = false;
this.fromPMOptions = [];
this.total = 0;
});
},
closeLocalDialog() {
this.addCertVisible = false;
this.getCompanyCertList();
},
addCert(index, row) {
this.idQuery.id = '';
if (this.$isNotBlank(row) && this.$isNotBlank(row.id)) {
this.idQuery.id = row.id;
this.idQuery.formData = row;
}
this.addCertVisible = true;
},
deleteCompanyCert(row) {
this.$confirm("是否删除?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
this.certLoading = true;
let tquery = {
id: row.id,
filePath: row.filePath,
};
deleteCompanyCert(tquery)
.then((response) => {
this.certLoading = false;
if (response.code === 20000) {
this.getCompanyCertList();
this.$message({
type: "success",
message: "删除成功!",
});
} else {
this.$message.error(response.message);
}
})
.catch(() => {
this.certLoading = false;
});
}).catch(() => {
});
},
getCompanyCertList() {
this.certLoading = true;
this.certQuery.customerId = this.inputQuery.customerId;
this.certQuery.manufacturerIdFk = this.inputQuery.manufacturerIdFk;
this.certQuery.productIdFk = this.inputQuery.productId;
this.certQuery.type = 3;
filterCompanyCert(this.certQuery)
.then((response) => {
this.certLoading = false;
this.certList = response.data.list || [];
})
.catch(() => {
this.certLoading = false;
this.certList = [];
});
},
toViewCompanyCert(row) {
window.open(this.certFileUrl + row.filePath);
},
auditCert(row) {
this.certAuditVisible = true;
this.currentAudit = row;
},
passAuditCert() {
this.currentAudit.auditStatus = 1;
this.auditSupCert(this.currentAudit);
},
rejectAuditCert() {
this.currentAudit.auditStatus = 2;
this.auditSupCert(this.currentAudit);
},
rejectInfo(row) {
this.$confirm(row.auditComment, "审核备注", {
confirmButtonText: "确定",
type: "warning",
showCancelButton: false,
})
.then(() => {
});
},
auditSupCert(inputQuery) {
auditSupCert(inputQuery).then(response => {
this.loading = false;
if (response.code === 20000) {
this.getCompanyCertList();
this.certAuditVisible = false;
} else {
this.$message.error(response.message);
}
});
},
},
filters: {
statusFilterType(status) {
const statusMap = {
0: "warning",
1: "success",
2: "danger",
6: "warning",
};
return statusMap[status];
},
},
};
</script>
<style>
.itemTag {
float: left;
text-align: left;
margin-top: 10px;
width: 120px;
}
.text {
width: 100%;
font-size: 13px;
font-family: "Microsoft YaHei";
}
.el-card {
margin-right: 20px;
margin-top: 15px;
/*transition: all .5s;*/
}
.el-row {
display: flex;
flex-wrap: wrap;
}
.el-col {
border-radius: 4px;
flex-wrap: wrap;
}
</style>