yinq
/
hwbm-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

1.0.27 客户关联客户经理

Browse Source
dev
yinq 1 month ago
parent 834ed22f5b
commit 57bc8af402
2 changed files with 306 additions and 123 deletions
Show Stats Download Patch File Download Diff File

20
src/api/oa/crm/customerInfo/types.ts
Unescape Escape View File

@ -44,6 +44,11 @@ export interface CustomerInfoVO {
*/
ownerId: string | number;
/**
* 归属人员名称
*/
ownerName?: string;
/**
* 详细地址
*/
@ -104,6 +109,11 @@ export interface CustomerInfoVO {
*/
activeFlag: string;
/**
* 本公司标识（1是 0否）
*/
ourCompanyFlag?: string;
}
export interface CustomerInfoForm extends BaseEntity {
@ -212,6 +222,11 @@ export interface CustomerInfoForm extends BaseEntity {
*/
activeFlag?: string;
/**
* 本公司标识（1是 0否）
*/
ourCompanyFlag?: string;
}
export interface CustomerInfoQuery extends PageQuery {
@ -311,6 +326,11 @@ export interface CustomerInfoQuery extends PageQuery {
*/
activeFlag?: string;
/**
* 本公司标识（1是 0否）
*/
ourCompanyFlag?: string;
/**
* 日期范围参数
*/

409
src/views/oa/crm/customerInfo/index.vue
Unescape Escape View File

@ -70,56 +70,61 @@
<el-table v-loading="loading" border :data="customerInfoList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="客户ID" align="center" prop="customerId" v-if="columns[0].visible"/>
<el-table-column label="客户名称" align="center" prop="customerName" width="120" v-if="columns[2].visible"/>
<el-table-column label="助记名称" align="center" prop="mnemonicName" v-if="columns[3].visible"/>
<el-table-column label="所属行业" align="center" prop="industryId" v-if="columns[4].visible">
<el-table-column label="客户ID" align="center" prop="customerId" width="80" v-if="columns[0].visible"/>
<el-table-column label="客户名称" align="center" prop="customerName" width="200" v-if="columns[2].visible" show-overflow-tooltip/>
<el-table-column label="助记名称" align="center" prop="mnemonicName" width="130" v-if="columns[3].visible" show-overflow-tooltip/>
<el-table-column label="所属行业" align="center" prop="industryId" width="110" v-if="columns[4].visible">
<template #default="scope">
<dict-tag :options="industry_id" :value="scope.row.industryId"/>
</template>
</el-table-column>
<el-table-column label="客户类型" align="center" prop="customerType" v-if="columns[5].visible">
<el-table-column label="客户类型" align="center" prop="customerType" width="110" v-if="columns[5].visible">
<template #default="scope">
<dict-tag :options="customer_type" :value="scope.row.customerType"/>
</template>
</el-table-column>
<el-table-column label="客户状态" align="center" prop="customerStatus" v-if="columns[6].visible">
<el-table-column label="客户状态" align="center" prop="customerStatus" width="120" v-if="columns[6].visible">
<template #default="scope">
<dict-tag :options="customer_status" :value="scope.row.customerStatus"/>
</template>
</el-table-column>
<el-table-column label="客户级别" align="center" prop="customerLevel" v-if="columns[7].visible">
<el-table-column label="客户级别" align="center" prop="customerLevel" width="110" v-if="columns[7].visible">
<template #default="scope">
<dict-tag :options="customer_level" :value="scope.row.customerLevel"/>
</template>
</el-table-column>
<el-table-column label="客户来源" align="center" prop="customerSource" v-if="columns[8].visible">
<el-table-column label="客户来源" align="center" prop="customerSource" width="130" v-if="columns[8].visible">
<template #default="scope">
<dict-tag :options="customer_source" :value="scope.row.customerSource"/>
</template>
</el-table-column>
<el-table-column label="归属人员" align="center" prop="ownerId" v-if="columns[9].visible"/>
<el-table-column label="详细地址" align="center" prop="detailedAddress" v-if="columns[10].visible"/>
<el-table-column label="企业规模" align="center" prop="customerScale" v-if="columns[11].visible">
<el-table-column label="客户经理" align="center" prop="ownerName" width="120" v-if="columns[9].visible" show-overflow-tooltip/>
<el-table-column label="详细地址" align="center" prop="detailedAddress" width="200" v-if="columns[10].visible" show-overflow-tooltip/>
<el-table-column label="企业规模" align="center" prop="customerScale" width="120" v-if="columns[11].visible">
<template #default="scope">
<dict-tag :options="customer_scale" :value="scope.row.customerScale"/>
</template>
</el-table-column>
<el-table-column label="下级客户" align="center" prop="parentCustomerId" v-if="columns[12].visible"/>
<el-table-column label="客户关系" align="center" prop="customerRelationship" v-if="columns[13].visible"/>
<el-table-column label="法定代表人" align="center" prop="legalRepresentative" width="120" v-if="columns[14].visible"/>
<el-table-column label="营业执照号码" align="center" prop="businessLicenseNumber" width="120" v-if="columns[15].visible"/>
<el-table-column label="税号" align="center" prop="taxNumber" v-if="columns[16].visible"/>
<el-table-column label="开户银行" align="center" prop="bankAccountOpening" v-if="columns[17].visible"/>
<el-table-column label="银行账号" align="center" prop="bankNumber" v-if="columns[18].visible"/>
<el-table-column label="附件ID" align="center" prop="ossId" v-if="columns[19].visible"/>
<el-table-column label="备注" align="center" prop="remark" v-if="columns[20].visible"/>
<el-table-column label="激活标识" align="center" prop="activeFlag" v-if="columns[21].visible">
<el-table-column label="下级客户" align="center" prop="parentCustomerId" width="100" v-if="columns[12].visible"/>
<el-table-column label="客户关系" align="center" prop="customerRelationship" width="120" v-if="columns[13].visible" show-overflow-tooltip/>
<el-table-column label="法定代表人" align="center" prop="legalRepresentative" width="130" v-if="columns[14].visible" show-overflow-tooltip/>
<el-table-column label="营业执照号码" align="center" prop="businessLicenseNumber" width="150" v-if="columns[15].visible" show-overflow-tooltip/>
<el-table-column label="税号" align="center" prop="taxNumber" width="150" v-if="columns[16].visible" show-overflow-tooltip/>
<el-table-column label="开户银行" align="center" prop="bankAccountOpening" width="180" v-if="columns[17].visible" show-overflow-tooltip/>
<el-table-column label="银行账号" align="center" prop="bankNumber" width="180" v-if="columns[18].visible" show-overflow-tooltip/>
<el-table-column label="附件ID" align="center" prop="ossId" width="100" v-if="columns[19].visible"/>
<el-table-column label="备注" align="center" prop="remark" width="200" v-if="columns[20].visible" show-overflow-tooltip/>
<el-table-column label="激活标识" align="center" prop="activeFlag" width="100" v-if="columns[21].visible">
<template #default="scope">
<dict-tag :options="active_flag" :value="scope.row.activeFlag"/>
</template>
</el-table-column>
<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
<el-table-column label="本公司标识" align="center" prop="ourCompanyFlag" width="110" v-if="columns[28].visible">
<template #default="scope">
<dict-tag :options="active_flag" :value="scope.row.ourCompanyFlag"/>
</template>
</el-table-column>
<el-table-column label="操作" align="center" fixed="right" width="120" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['oa/crm:customerInfo:edit']"></el-button>
@ -134,107 +139,199 @@
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card>
<!-- 添加或修改客户信息对话框 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-dialog :title="dialog.title" v-model="dialog.visible" width="900px" append-to-body>
<el-form ref="customerInfoFormRef" :model="form" :rules="rules" label-width="120px">
<el-form-item label="客户名称" prop="customerName">
<el-input v-model="form.customerName" placeholder="请输入客户名称" />
</el-form-item>
<el-form-item label="助记名称" prop="mnemonicName">
<el-input v-model="form.mnemonicName" placeholder="请输入助记名称" />
</el-form-item>
<el-form-item label="所属行业" prop="industryId">
<el-select v-model="form.industryId" placeholder="请选择所属行业">
<el-option
v-for="dict in industry_id"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="客户类型" prop="customerType">
<el-select v-model="form.customerType" placeholder="请选择客户类型">
<el-option
v-for="dict in customer_type"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="客户状态" prop="customerStatus">
<el-select v-model="form.customerStatus" placeholder="请选择客户状态">
<el-option
v-for="dict in customer_status"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="客户级别" prop="customerLevel">
<el-select v-model="form.customerLevel" placeholder="请选择客户级别">
<el-option
v-for="dict in customer_level"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="客户来源" prop="customerSource">
<el-select v-model="form.customerSource" placeholder="请选择客户来源">
<el-option
v-for="dict in customer_source"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="归属人员" prop="ownerId">
<el-input v-model="form.ownerId" placeholder="请输入归属人员" />
</el-form-item>
<el-form-item label="详细地址" prop="detailedAddress">
<el-input v-model="form.detailedAddress" placeholder="请输入详细地址" />
</el-form-item>
<el-form-item label="企业规模" prop="customerScale">
<el-select v-model="form.customerScale" placeholder="请选择企业规模">
<el-option
v-for="dict in customer_scale"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="下级客户" prop="parentCustomerId">
<el-input v-model="form.parentCustomerId" placeholder="请输入下级客户" />
</el-form-item>
<el-form-item label="客户关系" prop="customerRelationship">
<el-input v-model="form.customerRelationship" placeholder="请输入客户关系" />
</el-form-item>
<el-form-item label="法定代表人" prop="legalRepresentative">
<el-input v-model="form.legalRepresentative" placeholder="请输入法定代表人" />
</el-form-item>
<el-form-item label="营业执照号码" prop="businessLicenseNumber">
<el-input v-model="form.businessLicenseNumber" placeholder="请输入营业执照号码" />
</el-form-item>
<el-form-item label="税号" prop="taxNumber">
<el-input v-model="form.taxNumber" placeholder="请输入税号" />
</el-form-item>
<el-form-item label="开户银行" prop="bankAccountOpening">
<el-input v-model="form.bankAccountOpening" placeholder="请输入开户银行" />
</el-form-item>
<el-form-item label="银行账号" prop="bankNumber">
<el-input v-model="form.bankNumber" placeholder="请输入银行账号" />
</el-form-item>
<el-form-item label="附件ID" prop="ossId">
<el-input v-model="form.ossId" type="textarea" placeholder="请输入内容" />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入备注" />
</el-form-item>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="客户名称" prop="customerName">
<el-input v-model="form.customerName" placeholder="请输入客户名称" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="助记名称" prop="mnemonicName">
<el-input v-model="form.mnemonicName" placeholder="请输入助记名称" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="所属行业" prop="industryId">
<el-select v-model="form.industryId" placeholder="请选择所属行业" style="width: 100%">
<el-option
v-for="dict in industry_id"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="客户类型" prop="customerType">
<el-select v-model="form.customerType" placeholder="请选择客户类型" style="width: 100%">
<el-option
v-for="dict in customer_type"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="客户状态" prop="customerStatus">
<el-select v-model="form.customerStatus" placeholder="请选择客户状态" style="width: 100%">
<el-option
v-for="dict in customer_status"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="客户级别" prop="customerLevel">
<el-select v-model="form.customerLevel" placeholder="请选择客户级别" style="width: 100%">
<el-option
v-for="dict in customer_level"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="客户来源" prop="customerSource">
<el-select v-model="form.customerSource" placeholder="请选择客户来源" style="width: 100%">
<el-option
v-for="dict in customer_source"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="客户经理" prop="ownerId">
<el-select
v-model="form.ownerId"
placeholder="请选择客户经理"
filterable
remote
:remote-method="remoteUserMethod"
:loading="userLoading"
style="width: 100%"
clearable
>
<el-option
v-for="user in userOptions"
:key="user.userId"
:label="user.nickName"
:value="user.userId"
>
<span style="float: left">{{ user.nickName }}</span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ user.userName }}</span>
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="详细地址" prop="detailedAddress">
<el-input v-model="form.detailedAddress" placeholder="请输入详细地址" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="企业规模" prop="customerScale">
<el-select v-model="form.customerScale" placeholder="请选择企业规模" style="width: 100%">
<el-option
v-for="dict in customer_scale"
:key="dict.value"
:label="dict.label"
:value="parseInt(dict.value)"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="下级客户" prop="parentCustomerId">
<el-input v-model="form.parentCustomerId" placeholder="请输入下级客户" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="客户关系" prop="customerRelationship">
<el-input v-model="form.customerRelationship" placeholder="请输入客户关系" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="法定代表人" prop="legalRepresentative">
<el-input v-model="form.legalRepresentative" placeholder="请输入法定代表人" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="营业执照号码" prop="businessLicenseNumber">
<el-input v-model="form.businessLicenseNumber" placeholder="请输入营业执照号码" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="税号" prop="taxNumber">
<el-input v-model="form.taxNumber" placeholder="请输入税号" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="开户银行" prop="bankAccountOpening">
<el-input v-model="form.bankAccountOpening" placeholder="请输入开户银行" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="银行账号" prop="bankNumber">
<el-input v-model="form.bankNumber" placeholder="请输入银行账号" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="附件" prop="ossId">
<FileUpload v-model="ossIdString" :limit="5" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" type="textarea" :rows="3" placeholder="请输入备注" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="本公司标识" prop="ourCompanyFlag">
<el-radio-group v-model="form.ourCompanyFlag">
<el-radio
v-for="dict in active_flag"
:key="dict.value"
:value="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<!-- <el-form-item label="激活标识" prop="activeFlag">-->
<!-- <el-radio-group v-model="form.activeFlag">-->
<!-- <el-radio-->
@ -258,6 +355,9 @@
<script setup name="CustomerInfo" lang="ts">
import { listCustomerInfo, getCustomerInfo, delCustomerInfo, addCustomerInfo, updateCustomerInfo } from '@/api/oa/crm/customerInfo';
import { CustomerInfoVO, CustomerInfoQuery, CustomerInfoForm } from '@/api/oa/crm/customerInfo/types';
import { listUser, optionSelect } from '@/api/system/user';
import { UserVO } from '@/api/system/user/types';
import FileUpload from '@/components/FileUpload/index.vue';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { customer_type, active_flag, industry_id, customer_source, customer_scale, customer_status, customer_level } = toRefs<any>(proxy?.useDict('customer_type', 'active_flag', 'industry_id', 'customer_source', 'customer_scale', 'customer_status', 'customer_level'));
@ -270,10 +370,25 @@ const ids = ref<Array<string | number>>([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const userOptions = ref<UserVO[]>([]);
const userLoading = ref(false);
const queryFormRef = ref<ElFormInstance>();
const customerInfoFormRef = ref<ElFormInstance>();
// 附件ID字符串转换（用于FileUpload组件）
const ossIdString = computed({
get: () => {
if (form.value.ossId === undefined || form.value.ossId === null) {
return '';
}
return String(form.value.ossId);
},
set: (val: string) => {
form.value.ossId = val || undefined;
}
});
const dialog = reactive<DialogOption>({
visible: false,
title: ''
@ -290,7 +405,7 @@ const columns = ref<FieldOption[]>([
{ key: 6, label: `客户状态`, visible: true },
{ key: 7, label: `客户级别`, visible: true },
{ key: 8, label: `客户来源`, visible: true },
{ key: 9, label: `归属人员`, visible: true },
{ key: 9, label: `客户经理`, visible: true },
{ key: 10, label: `详细地址`, visible: true },
{ key: 11, label: `企业规模`, visible: true },
{ key: 12, label: `下级客户`, visible: true },
@ -309,6 +424,7 @@ const columns = ref<FieldOption[]>([
{ key: 25, label: `创建时间`, visible: false },
{ key: 26, label: `更新人`, visible: false },
{ key: 27, label: `更新时间`, visible: false },
{ key: 28, label: `本公司标识`, visible: true },
]);
const initFormData: CustomerInfoForm = {
@ -333,6 +449,7 @@ const initFormData: CustomerInfoForm = {
ossId: undefined,
remark: undefined,
activeFlag: undefined,
ourCompanyFlag: undefined,
}
const data = reactive<PageData<CustomerInfoForm, CustomerInfoQuery>>({
form: {...initFormData},
@ -358,6 +475,7 @@ const data = reactive<PageData<CustomerInfoForm, CustomerInfoQuery>>({
bankNumber: undefined,
ossId: undefined,
activeFlag: undefined,
ourCompanyFlag: undefined,
params: {
}
},
@ -386,6 +504,7 @@ const cancel = () => {
const reset = () => {
form.value = {...initFormData};
customerInfoFormRef.value?.resetFields();
userOptions.value = [];
}
/** 搜索按钮操作 */
@ -410,6 +529,7 @@ const handleSelectionChange = (selection: CustomerInfoVO[]) => {
/** 新增按钮操作 */
const handleAdd = () => {
reset();
userOptions.value = [];
dialog.visible = true;
dialog.title = "添加客户信息";
}
@ -420,10 +540,53 @@ const handleUpdate = async (row?: CustomerInfoVO) => {
const _customerId = row?.customerId || ids.value[0]
const res = await getCustomerInfo(_customerId);
Object.assign(form.value, res.data);
// 加载已选用户信息
if (form.value.ownerId) {
await loadSelectedUser(form.value.ownerId);
}
dialog.visible = true;
dialog.title = "修改客户信息";
}
/** 加载已选用户信息 */
const loadSelectedUser = async (userId: string | number) => {
try {
const res = await optionSelect([userId]);
if (res.data && res.data.length > 0) {
userOptions.value = res.data;
}
} catch (error) {
console.error('加载用户信息失败:', error);
}
}
/** 远程搜索用户 */
const remoteUserMethod = async (query: string) => {
if (query) {
userLoading.value = true;
try {
const res = await listUser({
pageNum: 1,
pageSize: 20,
nickName: query,
status: '0'
});
userOptions.value = res.rows || [];
} catch (error) {
console.error('搜索用户失败:', error);
userOptions.value = [];
} finally {
userLoading.value = false;
}
} else {
userOptions.value = [];
// 如果有已选用户，加载已选用户信息
if (form.value.ownerId) {
await loadSelectedUser(form.value.ownerId);
}
}
}
/** 提交按钮 */
const submitForm = () => {
customerInfoFormRef.value?.validate(async (valid: boolean) => {

Write Preview
Loading…
Cancel
Save