239 lines
7.8 KiB
Vue
239 lines
7.8 KiB
Vue
<template>
|
||
<el-dialog :title="titleMap[mode]" v-model="visible" :width="1200" destroy-on-close draggable @closed="$emit('closed')">
|
||
<el-scrollbar height="500px" style="padding: 0 20px;">
|
||
<el-form :model="form" :rules="rules" ref="dialogForm" label-width="140px">
|
||
<el-row justify="space-between">
|
||
<el-col :span="11">
|
||
<div class="dialogBoxTitle"><span class="make"></span><span class="name">企业信息</span></div>
|
||
<el-form-item label="公司名称" prop="full_name">
|
||
<el-input v-model="form.full_name" placeholder="请填写认证企业名称" clearable></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="公司简称" prop="name">
|
||
<el-input v-model="form.name" placeholder="请输入公司简称" clearable></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="公司系统入口地址" prop="domain">
|
||
<el-input v-model="form.domain" placeholder="公司系统入口地址" clearable></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="公司类型" prop="company_type">
|
||
<el-select v-model="form.company_type" @visible-change="getCompanyTypeSelect" placeholder="请选择公司类型" clearable style="width: 100%;">
|
||
<el-option v-for="item in setMap.companyType" :key="item" :label="item.label" :value="item.company_type"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="公司地址" prop="address">
|
||
<el-input v-model="form.address" placeholder="请输入部门名称" clearable></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="公司LOGO" prop="logo">
|
||
<ossImgUpload @parentParams="parentParams" :url="form.logo" />
|
||
</el-form-item>
|
||
<el-form-item label="备注" prop="remark">
|
||
<el-input type="textarea" placeholder="请输入备注"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="12">
|
||
<div class="dialogBoxTitle"><span class="make"></span><span class="name">企业管理员信息</span></div>
|
||
<el-form-item label="负责人/联系方式" required>
|
||
<el-row justify="space-between">
|
||
<el-col :span="5">
|
||
<el-form-item prop="owner">
|
||
<el-input v-model="form.owner" placeholder="负责人"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="7">
|
||
<el-form-item prop="mobile">
|
||
<el-input v-model="form.mobile" placeholder="联系方式"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="10">
|
||
<el-form-item prop="email">
|
||
<el-input v-model="form.email" placeholder="邮箱地址"></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form-item>
|
||
<el-form-item label="账号" prop="admin_account">
|
||
<el-input v-model="form.admin_account" placeholder="请填写管理员账号"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="登录密码" prop="password" v-if="mode == 'add'">
|
||
<el-input v-model="form.password" type="password" placeholder="请填写密码"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="生成系统使用协议" prop="accord">
|
||
<el-switch v-model="form.accord" :active-value="1" :inactive-value="0"></el-switch>
|
||
</el-form-item>
|
||
<el-form-item label="证件照" prop="doc_url">
|
||
<ossImgListUpload :list="form.doc_url" :length="3" @parentParams="faultParentParams" />
|
||
<p class="el-form-item-msg">可接受格式为：jpg、jpeg、png、gif，图片大小不超过5M。</p>
|
||
<p class="el-form-item-msg">可接受证件类型:营业执照、组织机构代码证、统一社会信用代码证、事业单位法人证书。</p>
|
||
<p class="el-form-item-msg">可以添加"高德开放平台备案、地图开发申请、地图开发认证"等水印。</p>
|
||
<p class="el-form-item-msg">但不能遮挡关键信息，例如公司名称、公司证件号。</p>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form>
|
||
</el-scrollbar>
|
||
<template #footer>
|
||
<el-button @click="visible=false" >取 消</el-button>
|
||
<el-button v-if="mode!='show'" type="primary" :loading="isSave" @click="submit()">保 存</el-button>
|
||
</template>
|
||
</el-dialog>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
emits: ['success', 'closed'],
|
||
data() {
|
||
return {
|
||
mode: "add",
|
||
titleMap: {
|
||
add: '新增公司资料',
|
||
edit: '编辑公司资料',
|
||
},
|
||
setMap:{
|
||
companyType:[]
|
||
},
|
||
|
||
visible: false,
|
||
isSave: false,
|
||
//表单数据
|
||
form: {
|
||
id:"",
|
||
domain: "",
|
||
company_type: "",
|
||
name: "",
|
||
full_name:"",
|
||
address:"",
|
||
email:"",
|
||
logo:"",
|
||
doc_url:[],
|
||
owner:"",
|
||
mobile:"",
|
||
admin_account:"",
|
||
password:"",
|
||
remark: "",
|
||
accord:1
|
||
},
|
||
//验证规则
|
||
rules: {
|
||
full_name: [
|
||
{required: true, message: '公司名称不能为空', trigger: 'blur'}
|
||
],
|
||
name:[
|
||
{required: true, message: '公司简称不能为空', trigger: 'blur'}
|
||
],
|
||
domain:[
|
||
{required: true, message: '入口地址不能为空', trigger: 'blur'}
|
||
],
|
||
address:[
|
||
{required: true, message: '请填写公司地址', trigger: 'blur'}
|
||
],
|
||
email:[
|
||
{required: true, message: '请填写邮件地址', trigger: 'blur'}
|
||
],
|
||
mobile:[
|
||
{required: true, message: '请填写联系方式', trigger: 'blur'}
|
||
],
|
||
logo:[
|
||
{required: false, message: '公司LOGO不能为空'}
|
||
],
|
||
doc_url:[
|
||
{required: false, message: '证件照不能为空'}
|
||
],
|
||
owner:[
|
||
{required: true, message: '负责人不能为空', trigger: 'blur'}
|
||
],
|
||
admin_account: [
|
||
{required: true, message: '账号不能为空', trigger: 'blur'}
|
||
],
|
||
password: [
|
||
{required: true, message: '密码不能为空', trigger: 'blur'}
|
||
]
|
||
},
|
||
}
|
||
},
|
||
mounted() {
|
||
this.getCompanyTypeSelect(true);
|
||
},
|
||
methods: {
|
||
//显示
|
||
open(mode='add'){
|
||
this.mode = mode;
|
||
this.visible = true;
|
||
|
||
return this
|
||
},
|
||
// 加载公司类型
|
||
async getCompanyTypeSelect(e){
|
||
if(!e) return
|
||
const res = await this.$API.system.company.typeSelect.post();
|
||
if(res.code == 200){
|
||
this.setMap['companyType'] = res.data;
|
||
}
|
||
},
|
||
faultParentParams(item){
|
||
this.form.doc_url = item;
|
||
},
|
||
parentParams(item){
|
||
this.form.logo = item;
|
||
},
|
||
//表单提交方法
|
||
submit(){
|
||
this.$refs.dialogForm.validate(async (valid) => {
|
||
if (valid) {
|
||
this.isSave = true;
|
||
let res
|
||
if(this.mode == "add"){
|
||
res = await this.$API.system.company.add.post(this.form);
|
||
}else{
|
||
res = await this.$API.system.company.update.post(this.form);
|
||
}
|
||
this.isSave = false;
|
||
if(res.code == 200){
|
||
this.$emit('success', this.form, this.mode);
|
||
this.visible = false;
|
||
this.$message.success("操作成功")
|
||
}
|
||
}
|
||
})
|
||
},
|
||
//表单注入数据
|
||
async setData(data) {
|
||
let params = {
|
||
id:data.id
|
||
}
|
||
const res = await this.$API.system.company.info.post(params);
|
||
if(res.code == 200){
|
||
this.form.id = res.data.id;
|
||
this.form.domain = res.data.domain;
|
||
this.form.company_type = res.data.company_type;
|
||
this.form.name = res.data.name;
|
||
this.form.full_name = res.data.full_name;
|
||
this.form.address = res.data.address;
|
||
this.form.email = res.data.platform_user && res.data.platform_user.email?res.data.platform_user.email:'';
|
||
this.form.logo = res.data.logo;
|
||
this.form.doc_url = res.data.doc_attach && res.data.doc_attach.length>0?res.data.doc_attach.map(em=>em.doc_url):[];
|
||
this.form.owner = res.data.owner;
|
||
this.form.mobile = res.data.mobile;
|
||
this.form.admin_account = res.data.admin_account;
|
||
this.form.password = res.data.password;
|
||
this.form.remark = res.data.remark;
|
||
this.form.accord = 1;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.dialogBoxTitle{
|
||
margin-bottom: 20px;
|
||
display: flex;
|
||
align-items: center;
|
||
.make{
|
||
height: 14px;
|
||
width: 4px;
|
||
border-radius: 10px;
|
||
margin-right: 8px;
|
||
background: var(--el-color-primary);
|
||
}
|
||
}
|
||
</style>
|