This commit is contained in:
wangchengming 2024-12-06 17:26:33 +08:00
parent 5469544f24
commit ecff73f776

View File

@ -41,35 +41,37 @@
</div>
</div>
<el-form
ref="Partnerform"
:model="form1"
:rules="form1Rules"
label-width="130rem"
style="margin-top: 40rem"
>
<div class="formBarContent">
<el-row>
<el-col :span="6">
<el-form-item label="公司名称(个人)">
<el-form-item label="公司名称(个人)" prop="companyName">
<el-input v-model="form1.companyName" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="地址">
<el-input v-model="form1.companyAddress" />
<el-form-item label="地址" prop="address">
<el-input v-model="form1.address" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="联系电话">
<el-input v-model="form1.phone" />
<el-form-item label="联系电话" prop="phoneNumber">
<el-input v-model="form1.phoneNumber" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电子邮箱">
<el-form-item label="电子邮箱" prop="email">
<el-input v-model="form1.email" />
</el-form-item>
</el-col>
</el-row>
<el-form-item label="擅长方向">
<el-checkbox-group v-model="form1.excelIn">
<el-checkbox-group v-model="form1.fieldType">
<el-checkbox
v-for="(item, index) in excelInList"
:key="'excelIn' + index"
@ -82,7 +84,7 @@
<el-col :span="12">
<el-form-item label="优势概念">
<el-input
v-model="form1.dominanceConcept"
v-model="form1.advantageConcept"
:autosize="{ minRows: 6, maxRows: 6 }"
type="textarea"
/>
@ -91,7 +93,7 @@
<el-col :span="12">
<el-form-item label="合作意向概述">
<el-input
v-model="form1.intention"
v-model="form1.cooperationIntention"
:autosize="{ minRows: 6, maxRows: 6 }"
type="textarea"
/>
@ -99,22 +101,47 @@
</el-col>
</el-row>
<el-form-item label="附件">
<el-upload
class="upload-demo"
action="https://jsonplaceholder.typicode.com/posts/"
:file-list="fileList1"
>
<el-button
size="small"
type="primary"
<div class="upload-file">
<el-upload
multiple
:action="uploadFileUrl"
:before-upload="handleBeforeUpload"
:file-list="fileList"
:limit="limit"
:on-error="handleUploadError"
:on-exceed="handleExceed"
:on-success="handleUploadSuccess"
:show-file-list="false"
class="upload-file-uploader"
ref="fileUpload"
>
上传
</el-button>
</el-upload>
<!-- 上传按钮 -->
<el-button size="small" type="primary">上传</el-button>
<!-- 上传提示 -->
<div class="el-upload__tip" slot="tip" v-if="isShowTip">
请上传
<template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b> </template>
<template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join("/") }}</b> </template>
的文件
</div>
</el-upload>
<!-- 文件列表 -->
<transition-group class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear" tag="ul">
<li :key="file.url" class="el-upload-list__item ele-upload-list__item-content" v-for="(file, index) in fileList">
<el-link :href="`${file.url}`" :underline="false" target="_blank">
<span class="el-icon-document"> {{ getFileName(file.name) }} </span>
</el-link>
<div class="ele-upload-list__item-content-action">
<el-link :underline="false" @click="handleDelete(index)" type="danger">删除</el-link>
</div>
</li>
</transition-group>
</div>
</el-form-item>
</div>
<el-form-item style="text-align: center;border-top:1rem solid #B0B0B0;padding: 20rem 0rem">
<el-button class="subBtn">
<el-button class="subBtn" @click="handleAddPartner">
提交
</el-button>
</el-form-item>
@ -133,28 +160,30 @@
</div>
<el-form
:model="form"
label-width="130rem"
:rules="formRules"
ref="Supperform"
label-width="140rem"
style="margin-top: 40rem"
>
<div class="formBarContent">
<el-row>
<el-col :span="6">
<el-form-item label="公司名称">
<el-form-item label="公司名称" prop="companyName">
<el-input v-model="form.companyName" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="公司地址">
<el-input v-model="form.companyAddress" />
<el-form-item label="公司地址" prop="address">
<el-input v-model="form.address" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="统一社会信用代码">
<el-input v-model="form.uniformCode" />
<el-form-item label="统一社会信用代码" prop="identifierCode">
<el-input v-model="form.identifierCode" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="电子邮箱">
<el-form-item label="电子邮箱" prop="email">
<el-input v-model="form.email" />
</el-form-item>
</el-col>
@ -162,7 +191,7 @@
<el-row>
<el-col :span="12">
<el-form-item label="企业性质">
<el-checkbox-group v-model="form.enterpriseProperty">
<el-checkbox-group :max="1" v-model="form.businessNature">
<el-checkbox
v-for="(item, index) in enterprisePropertyList"
:key="'enterpriseProperty' + index"
@ -174,29 +203,29 @@
</el-col>
<el-col :span="6">
<el-form-item label="行业领域">
<el-input v-model="form.industryField" />
<el-input v-model="form.fieldIndustry" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="主要产品">
<el-input v-model="form.mainProduct" />
<el-input v-model="form.mainProducts" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="6">
<el-form-item label="联系电话">
<el-input v-model="form.phone" />
<el-form-item label="联系电话" prop="phoneNumber">
<el-input v-model="form.phoneNumber" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="网址">
<el-input v-model="form.website" />
<el-form-item label="网址" >
<el-input v-model="form.webAddress" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="设计开发能力">
<el-checkbox-group v-model="form.designCapability">
<el-checkbox-group v-model="form.developmentCapability">
<el-checkbox
v-for="(item, index) in designCapabilityList"
:key="'designCapability' + index"
@ -210,7 +239,7 @@
<el-row>
<el-col :span="12">
<el-form-item label="遵守标准">
<el-checkbox-group v-model="form.standards">
<el-checkbox-group v-model="form.complianceStandards">
<el-checkbox
v-for="(item, index) in standardsList"
:key="'standards' + index"
@ -220,9 +249,9 @@
</el-checkbox-group>
</el-form-item>
</el-col>
<el-col :span="6">
<el-col :span="7">
<el-form-item label="产品已获得的认证">
<el-checkbox-group v-model="form.authentication">
<el-checkbox-group :max="1" v-model="form.productCertification">
<el-checkbox
v-for="(item, index) in authenticationList"
:key="'authentication' + index"
@ -232,9 +261,9 @@
</el-checkbox-group>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="">
<el-input v-model="form.otherRemark" />
<el-col :span="5">
<el-form-item label="" label-width="0rem">
<el-input v-show="form.productCertification[0] == '其他说明'" v-model="form.otherNotes" placeholder="请输入其他说明" />
</el-form-item>
</el-col>
</el-row>
@ -249,7 +278,7 @@
</el-checkbox-group>
</el-form-item>
<el-form-item label="是否具备相关资质">
<el-checkbox-group v-model="form.relevantQualification">
<el-checkbox-group v-model="form.relevantQualifications">
<el-checkbox
v-for="(item, index) in relevantQualificationList"
:key="'relevantQualification' + index"
@ -262,7 +291,7 @@
<el-col :span="12">
<el-form-item label="优势概念">
<el-input
v-model="form.dominanceConcept"
v-model="form.advantageConcept"
:autosize="{ minRows: 6, maxRows: 6 }"
type="textarea"
/>
@ -271,7 +300,7 @@
<el-col :span="12">
<el-form-item label="合作意向概述">
<el-input
v-model="form.intention"
v-model="form.cooperationIntention"
:autosize="{ minRows: 6, maxRows: 6 }"
type="textarea"
/>
@ -294,7 +323,7 @@
</el-form-item>
</div>
<el-form-item style="text-align: center;border-top:1rem solid #B0B0B0;padding: 20rem 0rem">
<el-button class="subBtn">
<el-button class="subBtn" @click="handleAddSupper">
提交
</el-button>
</el-form-item>
@ -368,34 +397,136 @@ export default {
{ label: '食品经营许可证', value: '食品经营许可证' },
{ label: '其他证书', value: '其他证书' },
],
form1Rules: {
companyName: [
{ required: true, message: '请输入公司名称(个人)', trigger: 'blur' },
],
address: [
{ required: true, message: '请输入地址', trigger: 'blur' },
],
phoneNumber: [
{ required: true, message: '请输入联系电话', trigger: 'blur' },
{
validator: function (rule, value, callback) {
const reg = /^1[3456789]\d{9}$/;
if (!reg.test(value)) {
callback(new Error('请输入手机号'));
} else {
callback();
}
},
trigger: 'blur',
},
],
email: [
{ required: true, message: '请输入电子邮箱', trigger: 'blur' },
{
validator: function (rule, value, callback) {
const reg3 = /^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
if (!reg3.test(value)) {
callback(new Error('请输入邮箱'));
} else {
callback();
}
},
trigger: 'blur',
},
],
},
form1: {
propertiesType: 1,
companyName: '',
companyAddress: '',
address: '',
phoneNumber: '',
email: '',
phone: '',
excelIn: [],
dominanceConcept: '',
intention: '',
fieldType: [],
advantageConcept: '',
cooperationIntention: '',
},
formRules: {
companyName: [
{ required: true, message: '请输入公司名称', trigger: 'blur' },
],
address: [
{ required: true, message: '请输入地址', trigger: 'blur' },
],
identifierCode: [
{ required: true, message: '请输入统一社会信用代码', trigger: 'blur' },
{
validator: function (rule, value, callback) {
const reg = /^[0-9A-HJ-NPQRTUWXY]{2}\d{6}[0-9A-HJ-NPQRTUWXY]{10}$/;
if (!reg.test(value)) {
callback(new Error('请输入统一社会信用代码'));
} else {
callback();
}
},
trigger: 'blur',
},
],
phoneNumber: [
{ required: true, message: '请输入联系电话', trigger: 'blur' },
{
validator: function (rule, value, callback) {
const reg = /^1[3456789]\d{9}$/;
if (!reg.test(value)) {
callback(new Error('请输入手机号'));
} else {
callback();
}
},
trigger: 'blur',
},
],
email: [
{ required: true, message: '请输入电子邮箱', trigger: 'blur' },
{
validator: function (rule, value, callback) {
const reg3 = /^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
if (!reg3.test(value)) {
callback(new Error('请输入邮箱'));
} else {
callback();
}
},
trigger: 'blur',
},
]
},
form: {
propertiesType: 2,
companyName: '',
companyAddress: '',
uniformCode: '',
address: '',
identifierCode: '',
email: '',
enterpriseProperty: [],
industryField: '',
mainProduct: '',
phone: '',
website: '',
designCapability: [],
standards: [],
authentication: [],
otherRemark: '',
businessNature: [],
fieldIndustry: '',
mainProducts: '',
phoneNumber: '',
webAddress: '',
developmentCapability: [],
complianceStandards: [],
productCertification: [],
otherNotes: '',
qualitySystem: [],
relevantQualification: [],
dominanceConcept: '',
intention: '',
relevantQualifications: [],
advantageConcept: '',
cooperationIntention: '',
},
//
limit: 10,
// (MB)
fileSize: 10,
// , ['png', 'jpg', 'jpeg']
fileType: ["doc", "docx", "xls","xlsx", "ppt", "txt", "pdf"],
//
isShowTip: true,
number: 0,
uploadList: [],
//
uploadFileUrl: process.env.VUE_APP_API_TARGET_URL + "/system/oss/upload",
fileList: [],
loadingModal: undefined,
};
},
computed: {
@ -428,6 +559,148 @@ export default {
this.screen1.Partner = res.rows.sort((a, b) => a.orders - b.orders);
} catch (error) {}
},
handleAddPartner() {
try {
this.$refs["Partnerform"].validate(valid => {
if (valid) {
this.form1.fieldType = this.form1.fieldType.toString();
this.$request.post(
'/official/companymessage/add',
this.form1,
).then(res => {
if(res.code == 200) {
this.form1= {
propertiesType: 1,
companyName: '',
address: '',
phoneNumber: '',
email: '',
fieldType: [],
advantageConcept: '',
cooperationIntention: '',
}
}
});
}
});
} catch (error) {}
},
handleAddSupper() {
try {
this.$refs["Supperform"].validate(valid => {
if (valid) {
this.form.businessNature = this.form.businessNature.toString();
this.form.developmentCapability = this.form.developmentCapability.toString();
this.form.complianceStandards = this.form.complianceStandards.toString();
this.form.productCertification = this.form.productCertification.toString();
this.form.qualitySystem = this.form.qualitySystem.toString();
this.form.relevantQualifications = this.form.relevantQualifications.toString();
this.$request.post(
'/official/companymessage/add',
this.form,
).then(res => {
if(res.code == 200) {
this.form= {
propertiesType: 2,
companyName: '',
address: '',
identifierCode: '',
email: '',
businessNature: [],
fieldIndustry: '',
mainProducts: '',
phoneNumber: '',
webAddress: '',
developmentCapability: [],
complianceStandards: [],
productCertification: [],
otherNotes: '',
qualitySystem: [],
relevantQualifications: [],
advantageConcept: '',
cooperationIntention: '',
}
}
});
}
});
} catch (error) {}
},
//
handleBeforeUpload(file) {
//
if (this.fileType) {
const fileName = file.name.split('.');
const fileExt = fileName[fileName.length - 1];
const isTypeOk = this.fileType.indexOf(fileExt) >= 0;
if (!isTypeOk) {
this.$message.error(`文件格式不正确, 请上传${this.fileType.join("/")}格式文件!`);
return false;
}
}
//
if (this.fileSize) {
const isLt = file.size / 1024 / 1024 < this.fileSize;
if (!isLt) {
this.$message.error(`上传文件大小不能超过 ${this.fileSize} MB!`);
return false;
}
}
this.loadingModal = this.$loading({
lock: true,
text: '正在上传文件,请稍候...',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
this.number++;
return true;
},
//
handleExceed() {
this.$message.error(`上传文件数量不能超过 ${this.limit} 个!`);
},
//
handleUploadError(err) {
this.$message.error(`上传文件失败,请重试`);
this.loadingModal.close();
},
//
handleUploadSuccess(res, file) {
if (res.code === 200) {
this.uploadList.push({ name: res.data.fileName, url: res.data.url, ossId: res.data.ossId });
this.uploadedSuccessfully();
} else {
this.number--;
this.loadingModal.close();
this.$message.error(res.msg);
this.$refs.fileUpload.handleRemove(file);
this.uploadedSuccessfully();
}
},
//
handleDelete(index) {
let ossId = this.fileList[index].ossId;
delOss(ossId);
this.fileList.splice(index, 1);
},
//
uploadedSuccessfully() {
if (this.number > 0 && this.uploadList.length === this.number) {
this.fileList = this.fileList.concat(this.uploadList);
this.uploadList = [];
this.number = 0;
this.loadingModal.close();
}
},
//
getFileName(name) {
// url
if (name.lastIndexOf("/") > -1) {
return name.slice(name.lastIndexOf("/") + 1);
} else {
return name;
}
},
},
};
</script>
@ -480,7 +753,6 @@ export default {
background: #F5F5F7;
}
.screen2 .wrapper1680 {
height: 565rem;
box-sizing: border-box;
background: #FFFFFF;
border-radius: 10rem 10rem 10rem 10rem;
@ -490,7 +762,6 @@ export default {
background: #F5F5F7;
}
.screen3 .wrapper1680 {
height: 830rem;
background: #FFFFFF;
border-radius: 10rem 10rem 10rem 10rem;
}
@ -561,8 +832,13 @@ export default {
/deep/.el-upload-list__item-status-label {
right: 5rem;
}
/deep/.el-upload__tip {
font-size: 12rem;
color: #606266;
margin-top: 7rem;
}
.formContent {
padding: 20rem 0rem;
padding: 20rem 0rem 0rem;
}
.formBarContent {
padding: 0rem 30rem;
@ -597,4 +873,22 @@ export default {
text-transform: none;
padding: 12rem 20rem;
}
.upload-file-uploader {
margin-bottom: 5rem;
}
.upload-file-list .el-upload-list__item {
border: 1rem solid #e4e7ed;
line-height: 2rem;
margin-bottom: 10rem;
position: relative;
}
.upload-file-list .ele-upload-list__item-content {
display: flex;
justify-content: space-between;
align-items: center;
color: inherit;
}
.ele-upload-list__item-content-action .el-link {
margin-right: 10rem;
}
</style>