修复中介库

This commit is contained in:
wkc
2026-04-20 11:24:18 +08:00
parent c278d11390
commit 2b321a8621
31 changed files with 1360 additions and 1466 deletions

View File

@@ -43,15 +43,6 @@ export function addEntityIntermediary(data) {
})
}
// 修改中介黑名单
export function updateIntermediary(data) {
return request({
url: '/ccdi/intermediary',
method: 'put',
data: data
})
}
// 修改个人中介黑名单
export function updatePersonIntermediary(data) {
return request({
@@ -78,6 +69,90 @@ export function delIntermediary(intermediaryIds) {
})
}
// 查询中介亲属列表
export function listIntermediaryRelatives(bizId) {
return request({
url: '/ccdi/intermediary/' + bizId + '/relatives',
method: 'get'
})
}
// 查询中介亲属详情
export function getIntermediaryRelative(relativeBizId) {
return request({
url: '/ccdi/intermediary/relative/' + relativeBizId,
method: 'get'
})
}
// 新增中介亲属
export function addIntermediaryRelative(bizId, data) {
return request({
url: '/ccdi/intermediary/' + bizId + '/relative',
method: 'post',
data: data
})
}
// 修改中介亲属
export function updateIntermediaryRelative(data) {
return request({
url: '/ccdi/intermediary/relative',
method: 'put',
data: data
})
}
// 删除中介亲属
export function delIntermediaryRelative(relativeBizId) {
return request({
url: '/ccdi/intermediary/relative/' + relativeBizId,
method: 'delete'
})
}
// 查询中介关联机构列表
export function listIntermediaryEnterpriseRelations(bizId) {
return request({
url: '/ccdi/intermediary/' + bizId + '/enterprise-relations',
method: 'get'
})
}
// 查询中介关联机构详情
export function getIntermediaryEnterpriseRelation(id) {
return request({
url: '/ccdi/intermediary/enterprise-relation/' + id,
method: 'get'
})
}
// 新增中介关联机构
export function addIntermediaryEnterpriseRelation(bizId, data) {
return request({
url: '/ccdi/intermediary/' + bizId + '/enterprise-relation',
method: 'post',
data: data
})
}
// 修改中介关联机构
export function updateIntermediaryEnterpriseRelation(data) {
return request({
url: '/ccdi/intermediary/enterprise-relation',
method: 'put',
data: data
})
}
// 删除中介关联机构
export function delIntermediaryEnterpriseRelation(id) {
return request({
url: '/ccdi/intermediary/enterprise-relation/' + id,
method: 'delete'
})
}
// 下载导入模板(已废弃,保留以兼容旧代码)
export function importTemplate() {
return request({

View File

@@ -2,34 +2,29 @@
<div>
<el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="姓名/机构名称" align="center" prop="name" :show-overflow-tooltip="true"/>
<el-table-column label="证件号" align="center" prop="certificateNo" :show-overflow-tooltip="true"/>
<el-table-column label="中介类型" align="center" prop="intermediaryType" width="100">
<template slot-scope="scope">
<span v-if="scope.row.intermediaryType === '1'">个人</span>
<span v-else-if="scope.row.intermediaryType === '2'">实体</span>
</template>
</el-table-column>
<el-table-column label="名称" align="center" prop="name" :show-overflow-tooltip="true" />
<el-table-column label="证件号" align="center" prop="certificateNo" :show-overflow-tooltip="true" />
<el-table-column label="关联中介姓名" align="center" prop="relatedIntermediaryName" :show-overflow-tooltip="true" />
<el-table-column label="关联关系" align="center" prop="relationText" :show-overflow-tooltip="true" />
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="240">
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="260">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-view"
@click="$emit('detail', scope.row)"
>详情</el-button>
<el-button size="mini" type="text" icon="el-icon-view" @click="$emit('detail', scope.row)">
{{ scope.row.recordType === 'INTERMEDIARY' ? '详情' : '查看' }}
</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="$emit('update', scope.row)"
v-hasPermi="['ccdi:intermediary:edit']"
>修改</el-button>
>
{{ scope.row.recordType === 'INTERMEDIARY' ? '修改' : '编辑' }}
</el-button>
<el-button
size="mini"
type="text"
@@ -42,7 +37,7 @@
</el-table>
<pagination
v-show="total>0"
v-show="total > 0"
:total="total"
:page.sync="pageParams.pageNum"
:limit.sync="pageParams.pageSize"

View File

@@ -1,70 +1,59 @@
<template>
<el-dialog title="中介黑名单详情" :visible.sync="visible" width="800px" append-to-body>
<el-dialog title="中介详情维护" :visible.sync="dialogVisible" width="1100px" append-to-body>
<div class="section-header">
<span>中介基本信息</span>
<el-button size="mini" type="primary" plain icon="el-icon-edit" @click="$emit('edit-person')">编辑中介信息</el-button>
</div>
<el-descriptions :column="2" border>
<!-- 核心字段 -->
<el-descriptions-item label="中介类型">
<span v-if="detailData.intermediaryType === '1'">个人</span>
<span v-else-if="detailData.intermediaryType === '2'">实体</span>
<span v-else>-</span>
</el-descriptions-item>
<el-descriptions-item label="姓名/机构名称">{{ detailData.name || detailData.enterpriseName || '-' }}</el-descriptions-item>
<el-descriptions-item label="证件号/信用代码">
<span v-if="detailData.intermediaryType === '1'">{{ detailData.personId || '-' }}</span>
<span v-else>{{ detailData.socialCreditCode || '-' }}</span>
</el-descriptions-item>
<!-- 个人类型专属字段 -->
<template v-if="detailData.intermediaryType === '1'">
<el-descriptions-item label="人员类型">{{ detailData.personType || '-' }}</el-descriptions-item>
<el-descriptions-item label="中介子类型">{{ detailData.personSubType || detailData.relationType || '-' }}</el-descriptions-item>
<el-descriptions-item label="性别">
<span v-if="detailData.gender === 'M'"></span>
<span v-else-if="detailData.gender === 'F'"></span>
<span v-else-if="detailData.gender === 'O'">其他</span>
<span v-else>{{ detailData.gender || '-' }}</span>
</el-descriptions-item>
<el-descriptions-item label="证件类型">{{ detailData.idType || '-' }}</el-descriptions-item>
<el-descriptions-item label="手机号码">{{ detailData.mobile || '-' }}</el-descriptions-item>
<el-descriptions-item label="微信号">{{ detailData.wechatNo || '-' }}</el-descriptions-item>
<el-descriptions-item label="联系地址" :span="2">{{ detailData.contactAddress || '-' }}</el-descriptions-item>
<el-descriptions-item label="所在公司">{{ detailData.company || '-' }}</el-descriptions-item>
<el-descriptions-item label="职位">{{ detailData.position || '-' }}</el-descriptions-item>
<el-descriptions-item label="企业统一信用码">{{ detailData.socialCreditCode || '-' }}</el-descriptions-item>
<el-descriptions-item label="关联人员ID">{{ detailData.relatedNumId || '-' }}</el-descriptions-item>
</template>
<!-- 机构类型专属字段 -->
<template v-if="detailData.intermediaryType === '2'">
<el-descriptions-item label="统一社会信用代码" :span="2">{{ detailData.socialCreditCode || '-' }}</el-descriptions-item>
<el-descriptions-item label="主体类型">{{ detailData.enterpriseType || '-' }}</el-descriptions-item>
<el-descriptions-item label="企业性质">{{ detailData.enterpriseNature || '-' }}</el-descriptions-item>
<el-descriptions-item label="行业分类">{{ detailData.industryClass || '-' }}</el-descriptions-item>
<el-descriptions-item label="所属行业">{{ detailData.industryName || '-' }}</el-descriptions-item>
<el-descriptions-item label="成立日期">{{ detailData.establishDate || '-' }}</el-descriptions-item>
<el-descriptions-item label="注册地址" :span="2">{{ detailData.registerAddress || '-' }}</el-descriptions-item>
<el-descriptions-item label="法定代表人">{{ detailData.legalRepresentative || '-' }}</el-descriptions-item>
<el-descriptions-item label="法定代表人证件类型">{{ detailData.legalCertType || '-' }}</el-descriptions-item>
<el-descriptions-item label="法定代表人证件号码" :span="2">{{ detailData.legalCertNo || '-' }}</el-descriptions-item>
<el-descriptions-item label="股东1">{{ detailData.shareholder1 || '-' }}</el-descriptions-item>
<el-descriptions-item label="股东2">{{ detailData.shareholder2 || '-' }}</el-descriptions-item>
<el-descriptions-item label="股东3">{{ detailData.shareholder3 || '-' }}</el-descriptions-item>
<el-descriptions-item label="股东4">{{ detailData.shareholder4 || '-' }}</el-descriptions-item>
<el-descriptions-item label="股东5">{{ detailData.shareholder5 || '-' }}</el-descriptions-item>
</template>
<!-- 通用字段 -->
<el-descriptions-item label="数据来源">
<span v-if="detailData.dataSource === 'MANUAL'">手动录入</span>
<span v-else-if="detailData.dataSource === 'SYSTEM'">系统同步</span>
<span v-else-if="detailData.dataSource === 'IMPORT'">批量导入</span>
<span v-else-if="detailData.dataSource === 'API'">接口获取</span>
<span v-else>{{ detailData.dataSource || '-' }}</span>
</el-descriptions-item>
<el-descriptions-item label="姓名">{{ detailData.name || '-' }}</el-descriptions-item>
<el-descriptions-item label="证件号">{{ detailData.personId || '-' }}</el-descriptions-item>
<el-descriptions-item label="人员类型">{{ detailData.personType || '-' }}</el-descriptions-item>
<el-descriptions-item label="性别">{{ formatGender(detailData.gender) }}</el-descriptions-item>
<el-descriptions-item label="证件类型">{{ detailData.idType || '-' }}</el-descriptions-item>
<el-descriptions-item label="职位">{{ detailData.position || '-' }}</el-descriptions-item>
<el-descriptions-item label="手机号码">{{ detailData.mobile || '-' }}</el-descriptions-item>
<el-descriptions-item label="微信号">{{ detailData.wechatNo || '-' }}</el-descriptions-item>
<el-descriptions-item label="所在公司">{{ detailData.company || '-' }}</el-descriptions-item>
<el-descriptions-item label="企业统一信用码">{{ detailData.socialCreditCode || '-' }}</el-descriptions-item>
<el-descriptions-item label="联系地址" :span="2">{{ detailData.contactAddress || '-' }}</el-descriptions-item>
<el-descriptions-item label="备注" :span="2">{{ detailData.remark || '-' }}</el-descriptions-item>
<el-descriptions-item label="创建时间">{{ detailData.createTime || '-' }}</el-descriptions-item>
</el-descriptions>
<div class="section-header">
<span>亲属信息</span>
<el-button size="mini" type="primary" plain icon="el-icon-plus" @click="$emit('add-relative')">新增亲属</el-button>
</div>
<el-table :data="relativeList" border>
<el-table-column label="姓名" prop="name" />
<el-table-column label="证件号" prop="personId" />
<el-table-column label="关联关系" prop="personSubType" />
<el-table-column label="手机号码" prop="mobile" />
<el-table-column label="操作" width="180" align="center">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="$emit('edit-relative', { ...scope.row, recordType: 'RELATIVE' })">编辑</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="$emit('delete-relative', { ...scope.row, recordType: 'RELATIVE' })">删除</el-button>
</template>
</el-table-column>
</el-table>
<div class="section-header">
<span>关联机构信息</span>
<el-button size="mini" type="primary" plain icon="el-icon-plus" @click="$emit('add-enterprise-relation')">新增关联机构</el-button>
</div>
<el-table :data="enterpriseRelationList" border>
<el-table-column label="机构名称" prop="enterpriseName" />
<el-table-column label="统一社会信用代码" prop="socialCreditCode" />
<el-table-column label="关联职务" prop="relationPersonPost" />
<el-table-column label="操作" width="180" align="center">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="$emit('edit-enterprise-relation', { ...scope.row, recordType: 'ENTERPRISE_RELATION' })">编辑</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="$emit('delete-enterprise-relation', { ...scope.row, recordType: 'ENTERPRISE_RELATION' })">删除</el-button>
</template>
</el-table-column>
</el-table>
<div slot="footer" class="dialog-footer">
<el-button @click="visible = false"> </el-button>
<el-button @click="dialogVisible = false"> </el-button>
</div>
</el-dialog>
</template>
@@ -80,12 +69,49 @@ export default {
detailData: {
type: Object,
default: () => ({})
},
relativeList: {
type: Array,
default: () => []
},
enterpriseRelationList: {
type: Array,
default: () => []
}
},
data() {
return {
dialogVisible: false
};
},
watch: {
visible(val) {
visible: {
immediate: true,
handler(val) {
this.dialogVisible = val;
}
},
dialogVisible(val) {
this.$emit("update:visible", val);
}
},
methods: {
formatGender(gender) {
if (gender === "M") return "男";
if (gender === "F") return "女";
if (gender === "O") return "其他";
return gender || "-";
}
}
};
</script>
<style scoped>
.section-header {
display: flex;
justify-content: space-between;
align-items: center;
margin: 18px 0 12px;
font-weight: 600;
}
</style>

View File

@@ -1,314 +1,104 @@
<template>
<el-dialog :title="title" :visible.sync="visible" width="900px" append-to-body @close="handleClose">
<!-- 新增模式显示类型选择卡片 -->
<div v-if="isAddMode && !selectedType" class="type-selector">
<div class="type-cards">
<div
class="type-card"
:class="{ 'selected': tempSelectedType === '1' }"
@click="handleTypeSelect('1')"
>
<i class="el-icon-user type-card-icon"></i>
<div class="type-card-title">个人</div>
<div class="type-card-desc">添加个人中介信息</div>
</div>
<div
class="type-card"
:class="{ 'selected': tempSelectedType === '2' }"
@click="handleTypeSelect('2')"
>
<i class="el-icon-office-building type-card-icon"></i>
<div class="type-card-title">机构</div>
<div class="type-card-desc">添加机构中介信息</div>
</div>
</div>
</div>
<!-- 表单区域选择类型后或修改模式显示 -->
<div v-show="selectedType || !isAddMode" class="form-container" :class="{ 'fade-in': shouldAnimate }">
<el-divider v-if="isAddMode" content-position="left">{{ getTypeDividerText }}</el-divider>
<!-- 个人类型表单 -->
<el-form
v-if="form.intermediaryType === '1'"
ref="indivForm"
:model="form"
:rules="indivRules"
label-width="120px"
>
<el-row>
<el-col :span="12">
<el-form-item label="姓名" prop="name">
<el-input v-model="form.name" placeholder="请输入姓名" maxlength="100" clearable/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="证件号" prop="personId">
<el-input v-model="form.personId" placeholder="请输入证件号码" maxlength="50" clearable/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="人员类型">
<el-select v-model="form.personType" placeholder="请选择人员类型" clearable style="width: 100%">
<el-option
v-for="item in indivTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="中介子类型">
<el-select
v-model="form.personSubType"
placeholder="请选择中介子类型"
clearable
style="width: 100%"
@change="handlePersonSubTypeChange"
>
<el-option
v-for="item in personSubTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="性别">
<el-select v-model="form.gender" placeholder="请选择性别" clearable style="width: 100%">
<el-option
v-for="item in genderOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="证件类型">
<el-select v-model="form.idType" placeholder="请选择证件类型" clearable style="width: 100%">
<el-option
v-for="item in certTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="手机号码">
<el-input v-model="form.mobile" placeholder="请输入手机号码" maxlength="20" clearable/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="微信号">
<el-input v-model="form.wechatNo" placeholder="请输入微信号" maxlength="50" clearable/>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="联系地址">
<el-input v-model="form.contactAddress" placeholder="请输入联系地址" maxlength="200" clearable/>
</el-form-item>
<el-row>
<el-col :span="12">
<el-form-item label="所在公司">
<el-input v-model="form.company" placeholder="请输入所在公司" maxlength="200" clearable/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="职位">
<el-input v-model="form.position" placeholder="请输入职位" maxlength="100" clearable/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="企业统一信用码">
<el-input v-model="form.socialCreditCode" placeholder="请输入企业统一信用码" maxlength="50" clearable/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="关联人员ID">
<el-input v-model="form.relatedNumId" placeholder="请输入关联人员ID" maxlength="50" clearable/>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="备注" prop="remark">
<el-input
v-model="form.remark"
type="textarea"
placeholder="请输入备注"
maxlength="500"
:rows="3"
show-word-limit
/>
</el-form-item>
</el-form>
<!-- 机构类型表单 -->
<el-form
v-else-if="form.intermediaryType === '2'"
ref="corpForm"
:model="form"
:rules="corpRules"
label-width="140px"
>
<el-row>
<el-col :span="12">
<el-form-item label="机构名称" prop="enterpriseName">
<el-input v-model="form.enterpriseName" placeholder="请输入机构名称" maxlength="200" clearable/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="证件号" prop="socialCreditCode">
<el-input
v-model="form.socialCreditCode"
placeholder="统一社会信用代码"
maxlength="50"
clearable
<el-dialog :title="title" :visible.sync="dialogVisible" width="820px" append-to-body @close="handleClose">
<el-form ref="formRef" :model="localForm" :rules="rules" label-width="120px">
<el-row>
<el-col :span="12">
<el-form-item label="姓名" prop="name">
<el-input v-model="localForm.name" placeholder="请输入姓名" maxlength="100" clearable />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="证件号" prop="personId">
<el-input v-model="localForm.personId" placeholder="请输入证件号码" maxlength="50" clearable />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="人员类型">
<el-select v-model="localForm.personType" placeholder="请选择人员类型" clearable style="width: 100%">
<el-option
v-for="item in indivTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="主体类型">
<el-select v-model="form.enterpriseType" placeholder="请选择主体类型" clearable style="width: 100%">
<el-option
v-for="item in corpTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="企业性质">
<el-select v-model="form.enterpriseNature" placeholder="请选择企业性质" clearable style="width: 100%">
<el-option
v-for="item in corpNatureOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="成立日期">
<el-date-picker
v-model="form.establishDate"
type="date"
placeholder="选择成立日期"
value-format="yyyy-MM-dd"
style="width: 100%"
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="证件类型">
<el-select v-model="localForm.idType" placeholder="请选择证件类型" clearable style="width: 100%">
<el-option
v-for="item in certTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="行业分类">
<el-input v-model="form.industryClass" placeholder="请输入行业分类" maxlength="100" clearable/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="所属行业">
<el-input v-model="form.industryName" placeholder="请输入所属行业" maxlength="100" clearable/>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="注册地址">
<el-input v-model="form.registerAddress" type="textarea" placeholder="请输入注册地址" maxlength="500" :rows="2"/>
</el-form-item>
<el-row>
<el-col :span="12">
<el-form-item label="法定代表人">
<el-input v-model="form.legalRepresentative" placeholder="请输入法定代表人" maxlength="100" clearable/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="法定代表人证件类型">
<el-select v-model="form.legalCertType" placeholder="请选择证件类型" clearable style="width: 100%">
<el-option
v-for="item in certTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="法定代表人证件号码">
<el-input v-model="form.legalCertNo" placeholder="请输入法定代表人证件号码" maxlength="50" clearable/>
</el-form-item>
<el-divider content-position="left">股东信息</el-divider>
<el-row>
<el-col :span="12">
<el-form-item label="股东1">
<el-input v-model="form.shareholder1" placeholder="请输入股东1" maxlength="100" clearable/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="股东2">
<el-input v-model="form.shareholder2" placeholder="请输入股东2" maxlength="100" clearable/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="股东3">
<el-input v-model="form.shareholder3" placeholder="请输入股东3" maxlength="100" clearable/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="股东4">
<el-input v-model="form.shareholder4" placeholder="请输入股东4" maxlength="100" clearable/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="股东5">
<el-input v-model="form.shareholder5" placeholder="请输入股东5" maxlength="100" clearable/>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="备注" prop="remark">
<el-input
v-model="form.remark"
type="textarea"
placeholder="请输入备注"
maxlength="500"
:rows="3"
show-word-limit
/>
</el-form-item>
</el-form>
</div>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="性别">
<el-select v-model="localForm.gender" placeholder="请选择性别" clearable style="width: 100%">
<el-option
v-for="item in genderOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="职位">
<el-input v-model="localForm.position" placeholder="请输入职位" maxlength="100" clearable />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="手机号码">
<el-input v-model="localForm.mobile" placeholder="请输入手机号码" maxlength="20" clearable />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="微信号">
<el-input v-model="localForm.wechatNo" placeholder="请输入微信号" maxlength="50" clearable />
</el-form-item>
</el-col>
</el-row>
<el-form-item label="联系地址">
<el-input v-model="localForm.contactAddress" placeholder="请输入联系地址" maxlength="200" clearable />
</el-form-item>
<el-row>
<el-col :span="12">
<el-form-item label="所在公司">
<el-input v-model="localForm.company" placeholder="请输入所在公司" maxlength="200" clearable />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="企业统一信用码">
<el-input v-model="localForm.socialCreditCode" placeholder="请输入企业统一信用码" maxlength="50" clearable />
</el-form-item>
</el-col>
</el-row>
<el-form-item label="备注">
<el-input
v-model="localForm.remark"
type="textarea"
placeholder="请输入备注"
maxlength="500"
:rows="3"
show-word-limit
/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button
type="primary"
:disabled="isAddMode && !selectedType"
@click="handleSubmit"
> </el-button>
<el-button type="primary" @click="handleSubmit"> </el-button>
<el-button @click="handleClose"> </el-button>
</div>
</el-dialog>
@@ -341,321 +131,48 @@ export default {
certTypeOptions: {
type: Array,
default: () => []
},
relationTypeOptions: {
type: Array,
default: () => []
},
corpTypeOptions: {
type: Array,
default: () => []
},
corpNatureOptions: {
type: Array,
default: () => []
}
},
data() {
return {
// 新增模式:是否为新增操作(通过 computed 动态计算)
// isAddMode: true,
// 已选择的类型(确认后的类型)
selectedType: null,
// 临时选择的类型(用于卡片高亮)
tempSelectedType: null,
// 是否需要显示淡入动画
shouldAnimate: false,
// 个人类型验证规则
indivRules: {
name: [
{ required: true, message: "姓名不能为空", trigger: "blur" },
{ max: 100, message: "姓名长度不能超过100个字符", trigger: "blur" }
],
personId: [
{ required: true, message: "证件号不能为空", trigger: "blur" },
{ max: 50, message: "证件号长度不能超过50个字符", trigger: "blur" }
],
remark: [
{ max: 500, message: "备注长度不能超过500个字符", trigger: "blur" }
]
},
// 机构类型验证规则
corpRules: {
enterpriseName: [
{ required: true, message: "机构名称不能为空", trigger: "blur" },
{ max: 200, message: "机构名称长度不能超过200个字符", trigger: "blur" }
],
socialCreditCode: [
{ required: true, message: "统一社会信用代码不能为空", trigger: "blur" },
{ max: 50, message: "统一社会信用代码长度不能超过50个字符", trigger: "blur" }
],
remark: [
{ max: 500, message: "备注长度不能超过500个字符", trigger: "blur" }
]
dialogVisible: false,
localForm: {},
rules: {
name: [{ required: true, message: "姓名不能为空", trigger: "blur" }],
personId: [{ required: true, message: "证件号不能为空", trigger: "blur" }]
}
};
},
computed: {
// 判断是否为新增模式
isAddMode() {
return !this.form || !this.form.bizId;
},
// 根据选择的类型返回分隔线文本
getTypeDividerText() {
if (this.form.intermediaryType === '1') {
return '个人信息';
} else if (this.form.intermediaryType === '2') {
return '机构信息';
}
return '';
},
personSubTypeOptions() {
const options = [{ label: '个人', value: '个人' }, ...this.relationTypeOptions];
const dedupedOptions = [];
const existedValues = new Set();
options.forEach(item => {
if (!item || !item.value || existedValues.has(item.value)) {
return;
}
existedValues.add(item.value);
dedupedOptions.push(item);
});
return dedupedOptions;
}
},
watch: {
// 监听 visible 变化,重置状态
visible(newVal) {
if (newVal) {
// 延迟初始化,确保 form 数据已经传入
this.$nextTick(() => {
this.initDialogState();
});
visible: {
immediate: true,
handler(val) {
this.dialogVisible = val;
}
},
dialogVisible(val) {
this.$emit("update:visible", val);
},
form: {
immediate: true,
deep: true,
handler(val) {
this.localForm = { ...val };
}
}
},
methods: {
/**
* 初始化弹窗状态
*/
initDialogState() {
// 始终基于当前的 form 状态判断
const isAdd = !this.form || !this.form.bizId;
if (isAdd) {
// 新增模式:重置选择状态
this.selectedType = null;
this.tempSelectedType = null;
this.shouldAnimate = false;
// 重置为个人类型(默认)
if (this.form) {
this.form.intermediaryType = '1';
}
} else {
// 修改模式:设置已选择的类型
if (this.form && this.form.intermediaryType) {
this.selectedType = this.form.intermediaryType;
}
this.shouldAnimate = false;
}
this.syncPersonSubTypeRelation();
},
/**
* 处理类型选择
*/
handleTypeSelect(type) {
this.tempSelectedType = type;
this.form.intermediaryType = type;
if (type === '1') {
this.syncPersonSubTypeRelation();
}
// 延迟设置 selectedType使表单显示带动画效果
setTimeout(() => {
this.selectedType = type;
this.shouldAnimate = true;
// 清除表单验证状态,避免立即显示验证错误
this.$nextTick(() => {
const formRef = type === '1' ? 'indivForm' : 'corpForm';
if (this.$refs[formRef]) {
this.$refs[formRef].clearValidate();
}
});
}, 50);
},
/**
* 提交表单
*/
handleSubmit() {
// 未选择类型时不提交
if (this.isAddMode && !this.selectedType) {
this.$message.warning('请先选择中介类型');
return;
}
if (this.form.intermediaryType === '1') {
this.syncPersonSubTypeRelation();
}
// 根据类型验证不同的表单
const formRef = this.form.intermediaryType === '1' ? 'indivForm' : 'corpForm';
this.$refs[formRef].validate(valid => {
this.$refs.formRef.validate(valid => {
if (valid) {
this.$emit("submit");
} else {
// 验证失败:滚动到第一个错误字段
this.scrollToFirstError();
this.$emit("submit", { ...this.localForm });
}
});
},
handlePersonSubTypeChange(value) {
this.form.relationType = value || null;
},
syncPersonSubTypeRelation() {
if (!this.form || this.form.intermediaryType !== '1') {
return;
}
const currentValue = this.form.personSubType || this.form.relationType || null;
this.form.personSubType = currentValue;
this.form.relationType = currentValue;
},
/**
* 滚动到第一个错误字段
*/
scrollToFirstError() {
const firstError = document.querySelector('.el-form-item__error');
if (firstError) {
firstError.scrollIntoView({ behavior: 'smooth', block: 'center' });
}
},
/**
* 关闭弹窗
*/
handleClose() {
// 清除表单验证状态
this.$nextTick(() => {
if (this.$refs.indivForm) {
this.$refs.indivForm.clearValidate();
}
if (this.$refs.corpForm) {
this.$refs.corpForm.clearValidate();
}
});
this.dialogVisible = false;
this.$emit("close");
},
/**
* 验证表单(供父组件调用)
*/
validateForm() {
const formRef = this.form.intermediaryType === '1' ? 'indivForm' : 'corpForm';
return this.$refs[formRef] ? this.$refs[formRef].validate() : Promise.reject();
}
}
};
</script>
<style scoped lang="scss">
/* 类型选择器区域 */
.type-selector {
padding: 20px 0;
text-align: center;
}
.type-cards {
display: flex;
justify-content: center;
gap: 30px;
margin-bottom: 20px;
}
.type-card {
flex: 1;
max-width: 200px;
padding: 30px 20px;
border: 2px solid #e4e7ed;
border-radius: 8px;
cursor: pointer;
transition: all 0.3s ease;
background-color: #fff;
&:hover {
border-color: #409eff;
box-shadow: 0 2px 12px rgba(64, 158, 255, 0.2);
transform: translateY(-2px);
}
&.selected {
border-color: #409eff;
background-color: #ecf5ff;
box-shadow: 0 4px 16px rgba(64, 158, 255, 0.3);
}
&-icon {
font-size: 48px;
color: #909399;
margin-bottom: 10px;
transition: color 0.3s ease;
}
&.selected &-icon {
color: #409eff;
}
&-title {
font-size: 18px;
font-weight: bold;
color: #303133;
margin-bottom: 8px;
}
&-desc {
font-size: 14px;
color: #909399;
}
}
/* 表单容器 */
.form-container {
padding: 10px 0;
&.fade-in {
animation: fadeIn 0.3s ease-in-out;
}
}
@keyframes fadeIn {
from {
opacity: 0;
transform: translateY(-10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
/* 分隔线样式 */
::v-deep .el-divider {
margin: 20px 0;
.el-divider__text {
font-weight: bold;
color: #409eff;
}
}
/* 必填项星号样式 */
::v-deep .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label::before {
color: #f56c6c;
}
</style>

View File

@@ -5,19 +5,38 @@
<el-input :value="ownerName" disabled />
</el-form-item>
<el-form-item label="统一社会信用代码" prop="socialCreditCode">
<el-input v-model="localForm.socialCreditCode" placeholder="请输入统一社会信用代码" maxlength="18" clearable />
<el-input
v-model="localForm.socialCreditCode"
placeholder="请输入统一社会信用代码"
maxlength="18"
clearable
:disabled="readonly"
/>
</el-form-item>
<el-form-item label="关联角色/职务">
<el-input v-model="localForm.relationPersonPost" placeholder="请输入关联角色/职务" maxlength="100" clearable />
<el-form-item label="关联职务">
<el-input
v-model="localForm.relationPersonPost"
placeholder="请输入关联职务"
maxlength="100"
clearable
:disabled="readonly"
/>
</el-form-item>
<el-form-item label="备注">
<el-input v-model="localForm.remark" type="textarea" :rows="3" maxlength="500" show-word-limit />
<el-input
v-model="localForm.remark"
type="textarea"
:rows="3"
maxlength="500"
show-word-limit
:disabled="readonly"
/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleSubmit"> </el-button>
<el-button @click="handleClose"> </el-button>
<el-button v-if="!readonly" type="primary" @click="handleSubmit"> </el-button>
<el-button @click="handleClose">{{ readonly ? ' ' : ' ' }}</el-button>
</div>
</el-dialog>
</template>
@@ -41,6 +60,10 @@ export default {
ownerName: {
type: String,
default: ""
},
readonly: {
type: Boolean,
default: false
}
},
data() {
@@ -72,6 +95,9 @@ export default {
},
methods: {
handleSubmit() {
if (this.readonly) {
return;
}
this.$refs.formRef.validate(valid => {
if (valid) {
this.$emit("submit", { ...this.localForm });

View File

@@ -9,7 +9,7 @@
</el-col>
<el-col :span="12">
<el-form-item label="亲属关系" prop="personSubType">
<el-select v-model="localForm.personSubType" placeholder="请选择亲属关系" clearable style="width: 100%">
<el-select v-model="localForm.personSubType" placeholder="请选择亲属关系" clearable style="width: 100%" :disabled="readonly">
<el-option
v-for="item in filteredRelationOptions"
:key="item.value"
@@ -23,19 +23,19 @@
<el-row>
<el-col :span="12">
<el-form-item label="姓名" prop="name">
<el-input v-model="localForm.name" placeholder="请输入姓名" maxlength="100" clearable />
<el-input v-model="localForm.name" placeholder="请输入姓名" maxlength="100" clearable :disabled="readonly" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="证件号" prop="personId">
<el-input v-model="localForm.personId" placeholder="请输入证件号码" maxlength="50" clearable />
<el-input v-model="localForm.personId" placeholder="请输入证件号码" maxlength="50" clearable :disabled="readonly" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="人员类型">
<el-select v-model="localForm.personType" placeholder="请选择人员类型" clearable style="width: 100%">
<el-select v-model="localForm.personType" placeholder="请选择人员类型" clearable style="width: 100%" :disabled="readonly">
<el-option
v-for="item in indivTypeOptions"
:key="item.value"
@@ -47,7 +47,7 @@
</el-col>
<el-col :span="12">
<el-form-item label="证件类型">
<el-select v-model="localForm.idType" placeholder="请选择证件类型" clearable style="width: 100%">
<el-select v-model="localForm.idType" placeholder="请选择证件类型" clearable style="width: 100%" :disabled="readonly">
<el-option
v-for="item in certTypeOptions"
:key="item.value"
@@ -61,7 +61,7 @@
<el-row>
<el-col :span="12">
<el-form-item label="性别">
<el-select v-model="localForm.gender" placeholder="请选择性别" clearable style="width: 100%">
<el-select v-model="localForm.gender" placeholder="请选择性别" clearable style="width: 100%" :disabled="readonly">
<el-option
v-for="item in genderOptions"
:key="item.value"
@@ -73,33 +73,33 @@
</el-col>
<el-col :span="12">
<el-form-item label="手机号码">
<el-input v-model="localForm.mobile" placeholder="请输入手机号码" maxlength="20" clearable />
<el-input v-model="localForm.mobile" placeholder="请输入手机号码" maxlength="20" clearable :disabled="readonly" />
</el-form-item>
</el-col>
</el-row>
<el-form-item label="联系地址">
<el-input v-model="localForm.contactAddress" placeholder="请输入联系地址" maxlength="200" clearable />
<el-input v-model="localForm.contactAddress" placeholder="请输入联系地址" maxlength="200" clearable :disabled="readonly" />
</el-form-item>
<el-row>
<el-col :span="12">
<el-form-item label="所在公司">
<el-input v-model="localForm.company" placeholder="请输入所在公司" maxlength="200" clearable />
<el-input v-model="localForm.company" placeholder="请输入所在公司" maxlength="200" clearable :disabled="readonly" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="职位">
<el-input v-model="localForm.position" placeholder="请输入职位" maxlength="100" clearable />
<el-input v-model="localForm.position" placeholder="请输入职位" maxlength="100" clearable :disabled="readonly" />
</el-form-item>
</el-col>
</el-row>
<el-form-item label="备注">
<el-input v-model="localForm.remark" type="textarea" :rows="3" maxlength="500" show-word-limit />
<el-input v-model="localForm.remark" type="textarea" :rows="3" maxlength="500" show-word-limit :disabled="readonly" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleSubmit"> </el-button>
<el-button @click="handleClose"> </el-button>
<el-button v-if="!readonly" type="primary" @click="handleSubmit"> </el-button>
<el-button @click="handleClose">{{ readonly ? ' ' : ' ' }}</el-button>
</div>
</el-dialog>
</template>
@@ -124,6 +124,10 @@ export default {
type: String,
default: ""
},
readonly: {
type: Boolean,
default: false
},
relationTypeOptions: {
type: Array,
default: () => []
@@ -177,6 +181,9 @@ export default {
},
methods: {
handleSubmit() {
if (this.readonly) {
return;
}
this.$refs.formRef.validate(valid => {
if (valid) {
this.$emit("submit", { ...this.localForm });

View File

@@ -1,11 +1,11 @@
<template>
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
<el-form-item label="姓名/机构名称" prop="name">
<el-form-item label="名称" prop="name">
<el-input
v-model="queryParams.name"
placeholder="请输入姓名/机构名称"
placeholder="请输入名称"
clearable
style="width: 240px"
style="width: 220px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
@@ -14,17 +14,26 @@
v-model="queryParams.certificateNo"
placeholder="请输入证件号"
clearable
style="width: 240px"
style="width: 220px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="中介类型" prop="intermediaryType">
<el-select v-model="queryParams.intermediaryType" placeholder="中介类型" clearable style="width: 240px">
<el-option label="全部" value="" />
<el-option label="个人" value="1" />
<el-option label="实体" value="2" />
<el-form-item label="记录类型" prop="recordType">
<el-select v-model="queryParams.recordType" placeholder="请选择记录类型" clearable style="width: 180px">
<el-option label="中介本人" value="INTERMEDIARY" />
<el-option label="中介亲属" value="RELATIVE" />
<el-option label="关联机构" value="ENTERPRISE_RELATION" />
</el-select>
</el-form-item>
<el-form-item label="关联中介信息" prop="relatedIntermediaryKeyword">
<el-input
v-model="queryParams.relatedIntermediaryKeyword"
placeholder="请输入关联中介姓名或证件号"
clearable
style="width: 260px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>

File diff suppressed because it is too large Load Diff