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.
udiwms-vue/src/views/purchase/supManufacturerEditDialog.vue

768 lines
29 KiB
Vue

<template>
<div>
<el-form
:model="inputQuery"
:rules="rules"
ref="inputQuery"
label-width="100px"
style="margin-top: -30px"
>
<el-card class="el-card">
<div style="float:right ">
<el-button
type="primary"
size="mini"
icon="search"
v-if="inputQuery.auditStatus == 0"
@click="addOrModifyCompany(0)"
>草稿保存
</el-button
>
<el-button
type="primary"
size="mini"
icon="search"
v-if="inputQuery.auditStatus == 0|| inputQuery.auditStatus == 6"
@click="onModifySubmit(6)"
>提交审核
</el-button
>
<el-button
type="primary"
size="mini"
icon="search"
v-if="inputQuery.auditStatus == 3|| inputQuery.auditStatus == 1|| inputQuery.auditStatus == 2"
@click="onModifySubmit(3)"
>提交审核
</el-button
>
</div>
<el-row :gutter="20" class="el-row" type="flex" style="margin-top: 40px">
<el-col :span="10" class="el-col" v-if="fromType==2">
<el-form-item label="所属供应商:" label-width="150px" prop="customerId">
<el-select
v-model="inputQuery.customerId"
filterable
remote
clearable="true"
:disabled="editType!=0"
reserve-keyword
placeholder="请输入供应商名称"
:remote-method="findMethod"
:loading="loading"
style="width: 100%;"
@change="unitChange"
>
<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-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="companyName">
<el-input
size="small"
placeholder="请输入内容"
v-model="inputQuery.companyName"
@input="change()"
></el-input>
</el-form-item>
</el-col>
<el-col :span="10" class="el-col">
<el-form-item label="统一社会信用代码:" label-width="150px" prop="creditCode">
<el-input
size="small"
placeholder="请输入内容"
v-model="inputQuery.creditCode"
@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="companyType">
<el-select
size="small"
v-model="inputQuery.companyType"
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-col :span="10" class="el-col">
<el-form-item label="登记状态:" label-width="150px" prop="registerStatus">
<el-select
size="small"
v-model="inputQuery.registerStatus"
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-option label="迁出" value="4"></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="placeArea">
<el-cascader
size="small"
:options="options"
v-model="selectedOptions"
placeholder="请选择所在地区"
style="width: 100%"
@change="handleChange"
>
</el-cascader>
</el-form-item>
</el-col>
<el-col :span="10" class="el-col">
<el-form-item label="生产地区:" label-width="150px" prop="productionArea">
<el-cascader
size="small"
:options="options"
v-model="selectedOptions2"
placeholder="请选择生产地区"
style="width: 100%"
@change="handleChange2"
>
</el-cascader>
</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="placeAddress">
<el-input
size="small"
placeholder="请输入内容"
v-model="inputQuery.placeAddress"
@input="change()"
></el-input>
</el-form-item>
</el-col>
<el-col :span="10" class="el-col">
<el-form-item label="生产地址:" label-width="150px" prop="productionAddress">
<el-input
size="small"
placeholder="请输入内容"
v-model="inputQuery.productionAddress"
@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"
@input="change()"
></el-input>
</el-form-item>
</el-col>
</el-row>
</el-card>
<el-card class="el-card">
<div style="float:right ">
<el-button type="primary" size="mini" icon="search" @click="selectCert"
>选入资质证书
</el-button
>
<el-button
type="primary"
size="mini"
icon="search"
@click="addCert()"
>添加资质证书
</el-button
>
</div>
<el-table v-loading="certLoading"
:data="certList"
style="width: 100%;margin-top: 30px">
<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="name"></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="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="状态" prop="status" width="120">
<template slot-scope="scope">
<el-tag :type="(scope.row.status) | statusType">
{{ statusFlag[scope.row.status] }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="备注" prop="remark"></el-table-column>
<el-table-column label="操作" fixed="right" width="250">
<template slot-scope="scope">
<el-button
type="text"
size="small"
@click.native="addCert(scope.row)"
>编辑
</el-button
>
<el-button
type="text"
size="small"
@click.native="toViewCompanyCert(scope.row)"
>预览
</el-button
>
<el-button
type="text"
size="small"
v-if="scope.row.auditStatus == 0 || scope.row.auditStatus == 2|| scope.row.auditStatus == 6"
@click.native="deleteCompanyCert(scope.row)"
>删除
</el-button
>
<!-- <el-button
type="text"
size="small"
v-if=" scope.row.auditStatus == 1 && scope.row.status==0"
@click.native="disableCert(scope.row,1)"
>禁用
</el-button
>
<el-button
type="text"
size="small"
v-if=" scope.row.auditStatus == 1 && scope.row.status==1"
@click.native="disableCert(scope.row,0)"
>启用
</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
title="添加资质证书"
:visible.sync="addCertVisible"
:close-on-click-modal="false"
:close-on-press-escape="false"
width="70%"
v-if="addCertVisible"
append-to-body
@close='closeLocalDialog'
>
<companyAddCert
:closeDialog="closeLocalDialog"
:inputQuery="inputQuery"
:addType="addType"
:editTye="editTye"
></companyAddCert>
</el-dialog>
<el-dialog
title="选入资质证书"
:visible.sync="selectCertVisible"
:close-on-click-modal="false"
:close-on-press-escape="false"
width="70%"
v-if="selectCertVisible"
append-to-body
@close='closeLocalDialog'
>
<supCertSetSelectDialog
:certType="certType"
:manufacturerId="manufacturerId"
:customerId="customerId"
:closeDialog="closeLocalDialog"
></supCertSetSelectDialog>
</el-dialog>
</el-form>
</div>
</template>
<script>
import {getCompanyInfo, addOrModifyCompany} from "../../api/purchase/supManufacturer";
import {
provinceAndCityData,
regionData,
provinceAndCityDataPlus,
regionDataPlus,
CodeToText,
TextToCode,
} from "element-china-area-data";
import {BASE_URL} from "../../config/app";
import {filterCompanyCert, deleteCompanyCert, updateCompanyCert} from "../../api/purchase/companyCert";
import companyAddCert from "./supCertAddDialog";
import draggable from "vuedraggable";
import {getBasicUnitMaintains} from "@/api/basic/basicUnitMaintain";
import {getSupComapnys} from "@/api/purchase/supCompany";
import {getUUID} from "@/utils/strUtil";
import supCertSetSelectDialog from "@/views/purchase/supCertSetSelectDialog";
import {getCompany} from "@/api/inout/company";
export default {
name: "supManufacturerEdit",
props: {
addCloseDialog: {
type: Function,
required: true,
},
inputQuery: {
type: Object,
required: true,
},
editType: {
type: Object,
required: true,
},
fromType: {
type: Object,
required: true,
}
},
data() {
return {
loading: false,
classesDisplay: false,
selectedOptions: [],
selectedOptions2: [],
options: regionData,
rules: {
customerId: [
{
required: true,
message: "请选择所属供应商",
trigger: "blur"
}
],
companyName: [
{
required: true,
message: "请输入企业名称",
trigger: "blur"
}
],
creditCode: [
{
required: true,
message: "请输入统一社会信用代码",
trigger: "blur"
}
],
companyType: [
{
required: true,
message: "请选择企业类型",
trigger: "change"
}
],
registerStatus: [
{
required: true,
message: "请选择登记状态",
trigger: "change"
}
],
placeArea: [
{
required: true,
message: "请选择所在地区",
trigger: "change"
}
],
placeAddress: [
{
required: true,
message: "请输入所在地址",
trigger: "change"
}
],
legalPersonName: [
{
required: true,
message: "请输入法人姓名",
trigger: "change"
}
],
legalPersonPapersType: [
{
required: true,
message: "请选择法人证件类型",
trigger: "change"
}
],
legalPersonPapersCode: [
{
required: true,
message: "请输入法人证件号码",
trigger: "change"
}
],
},
uploadUrl: "",
fileList: [],
fileUrl: "",
certFileUrl: "",
url: 'http://127.0.0.1:9996/udiwms/image/register/file/getImage?type=image1&name=t11111.jpg',
certQuery: {
customerId: null,
manufacturerIdFk: null,
page: 1,
limit: 20,
type: 2,
},
certList: [],
certTotal: 0,
certLoading: false,
addCertVisible: false,
fromOptions: [],
idQuery: {
id: "",
},
addType: "2", //证书类型1:供应商2.生产企业3.产品品种
checkFlag: {
0: "草稿",
1: "已通过",
2: "已拒绝",
3: "变更未审核",
6: "未审核",
},
editTye: 1,
formName: 1,
formMap: {
1: "新增生产企业资质证书",
2: "编辑生产企业资质证书",
},
formMap: {
1: "新增生产企业资质证书",
2: "编辑生产企业资质证书",
},
manufacturerId: null,
customerId: null,
selectCertVisible: false,
certType: 2,
};
},
created() {
if (this.editType == 0) {
this.inputQuery.manufacturerId = getUUID("")
} else {
this.certQuery.customerId = this.inputQuery.customerId;
this.selectedOptions = this.inputQuery.placeAreaCode.split(",");
if(this.inputQuery.productionAreaCode!="" && this.inputQuery.productionAreaCode!=null && this.inputQuery.productionAreaCode!=undefined){
this.selectedOptions2 = this.inputQuery.productionAreaCode.split(",");
}
}
this.certQuery.manufacturerIdFk = this.inputQuery.manufacturerId;
this.manufacturerId = this.inputQuery.manufacturerId
this.customerId = this.inputQuery.customerId;
// this.getData();
this.getCompanyCertList();
this.findMethod();
this.uploadUrl = BASE_URL + "/udiwms/upload/register/file";
this.fileUrl = BASE_URL + "/udiwms/image/register/file/getImage?type=image2&name=";
this.certFileUrl = BASE_URL + "/udiwms/image/register/file/getImage?type=image2&name=";
},
components: {
draggable,
companyAddCert, supCertSetSelectDialog
},
methods: {
onModifySubmit(type) {
//判断本企业产品是否是通过审核的
let query = {
customerId: this.$store.getters.customerId
}
getCompany(query)
.then((response) => {
if(response.data.auditStatus!=1){
this.$message.error("本企业信息还未通过审核!");
return;
}else{
this.addOrModifyCompany(type);
}}).catch(() => {
});
},
addOrModifyCompany (type){
this.$refs["inputQuery"].validate(valid => {
if (valid) {
let formData = JSON.parse(JSON.stringify(this.inputQuery));
formData.auditStatus = type;
this.loading = true;
let urlName = this.editType == 0 ? 'add' : 'update';
addOrModifyCompany(formData, urlName).then(response => {
this.loading = false;
if (response.code === 20000) {
this.addCloseDialog(true);
this.$message.success("保存成功");
} else {
this.$message.error(response.message);
}
});
} else {
console.log("error submit!!");
return false;
}
});
},
certHandleCurrentChange(val) {
this.certQuery.page = val;
this.getCompanyCertList();
},
getCompanyCertList() {
this.certLoading = true;
filterCompanyCert(this.certQuery)
.then((response) => {
this.certLoading = false;
this.certList = response.data.list || [];
})
.catch(() => {
this.certLoading = false;
this.certList = [];
});
},
addCert(row) {
if (this.$isNotBlank(row)) {
this.formName = 2
this.inputQuery.formData = row;
this.editTye = 2;
} else {
this.formName = 1;
this.inputQuery.formData = {};
this.editTye = 1;
}
this.addCertVisible = true;
},
selectCert() {
this.customerId = this.inputQuery.customerId;
this.selectCertVisible = true;
},
toViewCompanyCert(row) {
window.open(this.certFileUrl + row.filePath);
},
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(() => {
});
},
disableCert(row, status) {
row.status = status;
updateCompanyCert(row).then(response => {
this.loading = false;
if (response.code === 20000) {
this.$message.success("更新成功!");
this.getCompanyCertList();
} else {
this.$message.error(response.message);
}
});
},
closeLocalDialog() {
this.addCertVisible = false;
this.selectCertVisible = false;
this.getCompanyCertList();
},
findMethod(query) {
this.fromOptions = [];
let cQuery = {
companyName: query,
};
getSupComapnys(cQuery)
.then((response) => {
this.loading = false;
this.fromOptions = response.data.list || [];
})
.catch(() => {
this.loading = false;
});
}
,
unitChange(val) {
this.certQuery.customerId = val;
},
handleChange(value) {
this.inputQuery.placeArea =
CodeToText[value[0]] + CodeToText[value[1]] + CodeToText[value[2]];
console.log(this.inputQuery.placeArea)
this.inputQuery.placeAreaCode = value.toString();
},
handleChange2(value) {
this.inputQuery.productionArea =
CodeToText[value[0]] + CodeToText[value[1]] + CodeToText[value[2]];
this.inputQuery.productionAreaCode = value.toString();
},
uploadHandleRemove(file, fileList) {
console.log(file, fileList);
},
uploadHandlePreview(file) {
console.log(file);
console.log(this.fileList);
},
uploadHandleExceed(files, fileList) {
this.$message.warning(`当前限制选择 1 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`);
},
uploadOnchange(file, fileList) {
let fileName = file.name;
let uid = file.uid
let pos = fileName.lastIndexOf(".");
let lastName = fileName.substring(pos, fileName.length);
if (lastName.toLowerCase() !== ".jpg" && lastName.toLowerCase() !== ".png") {
this.$message.error("上传文件只能是 .jpg,.png 格式");
for (let i = 0; i < fileList.length; i++) {//从list删除
if (fileList[i].uid === uid) {
fileList.splice(i, 1)
}
}
return;
}
// 限制上传文件的大小
const isLt = file.size / 1024 / 1024 / 2 <= 1;
if (!isLt) {
this.$message.error("上传文件大小不能超过 2MB");
for (let i = 0; i < fileList.length; i++) {
if (fileList[i].uid === uid) {
fileList.splice(i, 1)
}
}
}
return isLt;
},
uploadHandleSuccess(response, file, fileList) {
console.log(response)
if (response.code === 20000) {
this.inputQuery.newFilePath = response.data.name;
this.onModifySubmit('inputQuery');
} else {
this.$message.error("文件上传失败:" + response.message);
}
},
uploadHandleError() {
},
},
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>