|
|
@@ -0,0 +1,656 @@
|
|
|
+<template>
|
|
|
+ <div class="p-4">
|
|
|
+ <!-- 企业基本信息 -->
|
|
|
+ <el-card shadow="never" class="mb-4">
|
|
|
+ <template #header>
|
|
|
+ <span class="font-medium"
|
|
|
+ >企业基本信息/ <span style="color: #ff0033"> 客户编号:{{ customerNumber }} </span></span
|
|
|
+ >
|
|
|
+ <el-button style="float: right" type="primary" @click="handleSubmit" :loading="submitLoading">保存</el-button>
|
|
|
+ </template>
|
|
|
+ <el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="所属公司" prop="belongCompanyId">
|
|
|
+ <el-select v-model="form.belongCompanyId" placeholder="请选择所属公司" class="w-full" filterable>
|
|
|
+ <el-option label="公司A" value="1" />
|
|
|
+ <el-option label="公司B" value="2" />
|
|
|
+ <el-option label="公司C" value="3" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="客户名称" prop="companyName">
|
|
|
+ <el-input v-model="form.companyName" placeholder="请输入客户名称" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="工商名称" prop="businessCustomerName">
|
|
|
+ <el-input v-model="form.businessCustomerName" placeholder="请输入工商名称" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="企业简称" prop="shortName">
|
|
|
+ <el-input v-model="form.shortName" placeholder="请输入企业简称" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="开票类型" prop="invoiceTypeId">
|
|
|
+ <el-select v-model="form.invoiceTypeId" placeholder="请选择开票类型" class="w-full">
|
|
|
+ <el-option label="增值税专用发票" value="1" />
|
|
|
+ <el-option label="增值税普通发票" value="2" />
|
|
|
+ <el-option label="电子发票" value="3" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="企业规模" prop="enterpriseScaleId">
|
|
|
+ <el-select v-model="form.enterpriseScaleId" placeholder="请选择企业规模" class="w-full" filterable>
|
|
|
+ <el-option v-for="item in enterpriseScaleList" :key="item.id" :label="item.enterpriseScaleName" :value="item.id" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="客户类别" prop="customerTypeId">
|
|
|
+ <el-select v-model="form.customerTypeId" placeholder="请选择客户类别" class="w-full">
|
|
|
+ <el-option label="重点客户" value="1" />
|
|
|
+ <el-option label="普通客户" value="2" />
|
|
|
+ <el-option label="潜在客户" value="3" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="行业类别" prop="industryCategoryId">
|
|
|
+ <el-select v-model="form.industryCategoryId" placeholder="请选择行业类别" class="w-full" filterable>
|
|
|
+ <el-option v-for="item in industryCategoryList" :key="item.id" :label="item.industryCategoryName" :value="item.id" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="客户等级" prop="customerLevelId">
|
|
|
+ <el-select v-model="form.customerLevelId" placeholder="请选择客户等级" class="w-full">
|
|
|
+ <el-option label="A级" value="1" />
|
|
|
+ <el-option label="B级" value="2" />
|
|
|
+ <el-option label="C级" value="3" />
|
|
|
+ <el-option label="D级" value="4" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="固定电话" prop="landline">
|
|
|
+ <el-input v-model="form.landline" placeholder="请输入固定电话" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="传真" prop="fax">
|
|
|
+ <el-input v-model="form.fax" placeholder="请输入传真" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="网址" prop="url">
|
|
|
+ <el-input v-model="form.url" placeholder="请输入网址" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="邮政编码" prop="postCode">
|
|
|
+ <el-input v-model="form.postCode" placeholder="请输入邮政编码" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="开始时间" prop="validityFromDate">
|
|
|
+ <el-date-picker v-model="form.validityFromDate" type="date" placeholder="请选择开始时间" class="w-full" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="结束时间" prop="validityToDate">
|
|
|
+ <el-date-picker v-model="form.validityToDate" type="date" placeholder="请选择结束时间" class="w-full" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="发票抬头" prop="invoiceTop">
|
|
|
+ <el-input v-model="form.invoiceTop" placeholder="请输入发票抬头" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="详细地址">
|
|
|
+ <el-cascader v-model="codeArr" :options="regionData" placeholder="请选择" @change="handleChange" style="width: 100%"></el-cascader>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item prop="address">
|
|
|
+ <el-input v-model="form.address" placeholder="请输入详细地址" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </el-card>
|
|
|
+
|
|
|
+ <!-- 工商信息 -->
|
|
|
+ <el-card shadow="never" class="mb-4">
|
|
|
+ <template #header>
|
|
|
+ <span class="font-medium">工商信息</span>
|
|
|
+ </template>
|
|
|
+ <el-form :model="businessForm" label-width="120px">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="企业工商名称" prop="businessCustomerName">
|
|
|
+ <el-input v-model="businessForm.businessCustomerName" placeholder="请输入企业工商名称" :disabled="true" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="社会信用代码" prop="socialCreditCode">
|
|
|
+ <el-input v-model="businessForm.socialCreditCode" placeholder="请输入社会信用代码" :disabled="true" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="法人姓名" prop="legalPersonName">
|
|
|
+ <el-input v-model="businessForm.legalPersonName" placeholder="请输入法人姓名" :disabled="true" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="注册资本" prop="registeredCapital">
|
|
|
+ <el-input v-model="businessForm.registeredCapital" placeholder="请输入注册资本" :disabled="true" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="登记机关" prop="registrationAuthority">
|
|
|
+ <el-input v-model="businessForm.registrationAuthority" placeholder="请输入登记机关" :disabled="true" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="成立日期" prop="establishmentDate">
|
|
|
+ <el-input v-model="businessForm.establishmentDate" class="w-full" :disabled="true" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="吊销日期" prop="revocationDate">
|
|
|
+ <el-input v-model="businessForm.revocationDate" class="w-full" :disabled="true" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="登记状态" prop="registrationStatus">
|
|
|
+ <el-input v-model="businessForm.registrationStatus" placeholder="请输入登记状态" :disabled="true" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="实缴资本" prop="paidInCapital">
|
|
|
+ <el-input v-model="businessForm.paidInCapital" placeholder="请输入实缴资本" :disabled="true" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="16">
|
|
|
+ <el-form-item label="详细地址" prop="businessAddress">
|
|
|
+ <el-input v-model="businessForm.businessAddress" placeholder="请输入详细地址" :disabled="true" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="营业执照" prop="businessLicense">
|
|
|
+ <el-upload action="#" :auto-upload="false">
|
|
|
+ <el-button icon="Plus">上传</el-button>
|
|
|
+ </el-upload>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </el-card>
|
|
|
+
|
|
|
+ <!-- 联系人信息列表 -->
|
|
|
+ <el-card shadow="never" class="mb-4">
|
|
|
+ <template #header>
|
|
|
+ <div class="flex justify-between items-center">
|
|
|
+ <span class="font-medium">联系人信息列表</span>
|
|
|
+ <el-button type="primary" @click="handleAddContact">添加联系人</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <el-table :data="contactList" border>
|
|
|
+ <el-table-column type="index" label="序号" align="center" width="60" />
|
|
|
+ <el-table-column label="联系人姓名" align="center" prop="contactName" min-width="120" />
|
|
|
+ <el-table-column label="职位" align="center" prop="roleId" min-width="120">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <span>{{ getRoleName(row.roleId) }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="手机号" align="center" prop="phone" min-width="150" />
|
|
|
+ <el-table-column label="固定电话" align="center" prop="officePhone" min-width="150" />
|
|
|
+ <el-table-column label="邮箱地址" align="center" prop="email" min-width="180" />
|
|
|
+ <el-table-column label="备注信息" align="center" prop="remark" min-width="180" />
|
|
|
+ <el-table-column label="操作" align="center" width="150" fixed="right">
|
|
|
+ <template #default="{ row, $index }">
|
|
|
+ <el-button link type="primary" @click="handleEditContact(row, $index)">编辑</el-button>
|
|
|
+ <el-button link type="danger" @click="removeContact($index)">删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-card>
|
|
|
+
|
|
|
+ <!-- 添加/编辑联系人对话框 -->
|
|
|
+ <add-contact-dialog v-model="contactDialogVisible" :edit-data="currentContact" @confirm="handleContactConfirm" />
|
|
|
+
|
|
|
+ <!-- 销售信息 -->
|
|
|
+ <el-card shadow="never" class="mb-4">
|
|
|
+ <template #header>
|
|
|
+ <div class="flex justify-between items-center">
|
|
|
+ <span class="font-medium">销售信息</span>
|
|
|
+ <el-button type="primary" @click="handleSubmit" :loading="submitLoading">保存</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <el-form :model="salesForm" label-width="120px">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="业务人员" prop="salesPersonId">
|
|
|
+ <el-select v-model="salesForm.salesPersonId" placeholder="请选择业务人员" class="w-full" filterable>
|
|
|
+ <el-option label="张三" value="1" />
|
|
|
+ <el-option label="李四" value="2" />
|
|
|
+ <el-option label="王五" value="3" />
|
|
|
+ <el-option label="赵六" value="4" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="客服人员" prop="serviceStaffId">
|
|
|
+ <el-select v-model="salesForm.serviceStaffId" placeholder="请选择客服人员" class="w-full" filterable>
|
|
|
+ <el-option label="客服A" value="1" />
|
|
|
+ <el-option label="客服B" value="2" />
|
|
|
+ <el-option label="客服C" value="3" />
|
|
|
+ <el-option label="客服D" value="4" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="所属部门" prop="belongingDepartmentId">
|
|
|
+ <el-select v-model="salesForm.belongingDepartmentId" placeholder="请选择所属部门" class="w-full" filterable>
|
|
|
+ <el-option label="销售部" value="1" />
|
|
|
+ <el-option label="市场部" value="2" />
|
|
|
+ <el-option label="客服部" value="3" />
|
|
|
+ <el-option label="技术部" value="4" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </el-card>
|
|
|
+
|
|
|
+ <!-- 企业开票信息 -->
|
|
|
+ <el-card shadow="never" class="mb-4">
|
|
|
+ <template #header>
|
|
|
+ <div class="flex justify-between items-center">
|
|
|
+ <span class="font-medium">企业开票信息</span>
|
|
|
+ <el-button type="primary" @click="handleAddInvoice">新增</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <el-table :data="invoiceList" border>
|
|
|
+ <el-table-column type="index" label="序号" align="center" width="60" />
|
|
|
+ <el-table-column label="纳税人识别号" align="center" prop="taxId" min-width="180" />
|
|
|
+ <el-table-column label="开户行名称" align="center" prop="bankName" min-width="180" />
|
|
|
+ <el-table-column label="银行账户" align="center" prop="bankAccount" min-width="180" />
|
|
|
+ <el-table-column label="是否主账号" align="center" prop="isPrimaryAccount" min-width="120">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <span>{{ row.isPrimaryAccount === '0' ? '是' : '否' }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="备注" align="center" prop="remark" min-width="180" />
|
|
|
+ <el-table-column label="操作" align="center" width="150" fixed="right">
|
|
|
+ <template #default="{ row, $index }">
|
|
|
+ <el-button link type="primary" @click="handleEditInvoice(row, $index)">编辑</el-button>
|
|
|
+ <el-button link type="danger" @click="removeInvoice($index)">删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-card>
|
|
|
+
|
|
|
+ <!-- 添加/编辑开票信息对话框 -->
|
|
|
+ <add-invoice-dialog v-model="invoiceDialogVisible" :edit-data="currentInvoice" @confirm="handleInvoiceConfirm" />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup lang="ts" name="CustomerInfoAdd">
|
|
|
+import { listCustomerInfo, getCustomerInfo, delCustomerInfo, addCustomerInfo, updateCustomerInfo } from '@/api/customer/customerFile/customerInfo';
|
|
|
+import { CustomerInfoVO, CustomerInfoQuery, CustomerInfoForm } from '@/api/customer/customerFile/customerInfo/types';
|
|
|
+import { generateCustomerNumber } from '@/utils/customerNumber';
|
|
|
+import type { CustomerContactForm } from '@/api/customer/customerFile/customerContact/types';
|
|
|
+import type { InvoiceInfoForm } from '@/api/customer/customerFile/invoiceInfo/types';
|
|
|
+import type { SalesInfoForm } from '@/api/customer/customerFile/salesInfo/types';
|
|
|
+import type { BusinessInfoForm } from '@/api/customer/customerFile/businessInfo/types';
|
|
|
+import AddContactDialog from './components/addContactDialog.vue';
|
|
|
+import AddInvoiceDialog from './components/addInvoiceDialog.vue';
|
|
|
+import { regionData } from 'element-china-area-data';
|
|
|
+import { listEnterpriseScale } from '@/api/customer/customerCategory/enterpriseScale';
|
|
|
+import { listIndustryCategory } from '@/api/customer/customerCategory/industryCategory';
|
|
|
+import type { EnterpriseScaleVO } from '@/api/customer/customerCategory/enterpriseScale/types';
|
|
|
+import type { IndustryCategoryVO } from '@/api/customer/customerCategory/industryCategory/types';
|
|
|
+
|
|
|
+const route = useRoute();
|
|
|
+const router = useRouter();
|
|
|
+
|
|
|
+const formRef = ref<any>(null);
|
|
|
+const submitLoading = ref(false);
|
|
|
+
|
|
|
+// 生成客户编号
|
|
|
+const customerNumber = ref('');
|
|
|
+const isEdit = ref(false);
|
|
|
+const customerId = ref<string>('');
|
|
|
+const codeArr = ref([]);
|
|
|
+
|
|
|
+// 下拉框数据列表
|
|
|
+const enterpriseScaleList = ref<EnterpriseScaleVO[]>([]);
|
|
|
+const industryCategoryList = ref<IndustryCategoryVO[]>([]);
|
|
|
+
|
|
|
+// 初始化
|
|
|
+onMounted(async () => {
|
|
|
+ // 加载下拉框数据
|
|
|
+ await loadEnterpriseScaleList();
|
|
|
+ await loadIndustryCategoryList();
|
|
|
+
|
|
|
+ // 判断是新增还是编辑
|
|
|
+ const id = route.query.id;
|
|
|
+ if (id) {
|
|
|
+ // 编辑模式
|
|
|
+ isEdit.value = true;
|
|
|
+ customerId.value = id as string;
|
|
|
+ await loadCustomerData(id);
|
|
|
+ } else {
|
|
|
+ // 新增模式,生成客户编号
|
|
|
+ customerNumber.value = generateCustomerNumber();
|
|
|
+ }
|
|
|
+});
|
|
|
+
|
|
|
+// 加载客户数据(编辑模式)
|
|
|
+const loadCustomerData = async (id: string) => {
|
|
|
+ try {
|
|
|
+ const res = await getCustomerInfo(id);
|
|
|
+ const data = res.data;
|
|
|
+
|
|
|
+ // 填充基本信息
|
|
|
+ Object.assign(form, data);
|
|
|
+ customerNumber.value = data.customerNo || '';
|
|
|
+
|
|
|
+ // 填充工商信息
|
|
|
+ if (data.customerBusinessInfoVo) {
|
|
|
+ Object.assign(businessForm, data.customerBusinessInfoVo);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 填充销售信息
|
|
|
+ if (data.customerSalesInfoVo) {
|
|
|
+ Object.assign(salesForm, data.customerSalesInfoVo);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 填充联系人列表
|
|
|
+ if (data.customerContactVoList) {
|
|
|
+ contactList.value = data.customerContactVoList;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 填充开票信息列表
|
|
|
+ if (data.customerInvoiceInfoVoList) {
|
|
|
+ invoiceList.value = data.customerInvoiceInfoVoList;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 如果有省市区编码,回显到级联选择器
|
|
|
+ if (data.regProvincialNo && data.regCityNo && data.regCountyNo) {
|
|
|
+ codeArr.value = [data.regProvincialNo, data.regCityNo, data.regCountyNo] as any;
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error('加载客户数据失败:', error);
|
|
|
+ ElMessage.error('加载客户数据失败');
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 加载企业规模列表
|
|
|
+const loadEnterpriseScaleList = async () => {
|
|
|
+ try {
|
|
|
+ const res = await listEnterpriseScale();
|
|
|
+ enterpriseScaleList.value = res.rows || [];
|
|
|
+ } catch (error) {
|
|
|
+ console.error('加载企业规模列表失败:', error);
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 加载行业类别列表
|
|
|
+const loadIndustryCategoryList = async () => {
|
|
|
+ try {
|
|
|
+ const res = await listIndustryCategory();
|
|
|
+ industryCategoryList.value = res.rows || [];
|
|
|
+ } catch (error) {
|
|
|
+ console.error('加载行业类别列表失败:', error);
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 企业基本信息表单
|
|
|
+const form = reactive<CustomerInfoForm>({
|
|
|
+ customerNo: '',
|
|
|
+ belongCompanyId: undefined,
|
|
|
+ companyName: '',
|
|
|
+ businessCustomerName: '',
|
|
|
+ shortName: '',
|
|
|
+ invoiceTypeId: undefined,
|
|
|
+ enterpriseScaleId: undefined,
|
|
|
+ customerTypeId: undefined,
|
|
|
+ industryCategoryId: undefined,
|
|
|
+ customerLevelId: undefined,
|
|
|
+ landline: '',
|
|
|
+ fax: '',
|
|
|
+ url: '',
|
|
|
+ postCode: '',
|
|
|
+ validityFromDate: undefined,
|
|
|
+ validityToDate: undefined,
|
|
|
+ invoiceTop: '',
|
|
|
+ address: '',
|
|
|
+ status: '0',
|
|
|
+ remark: ''
|
|
|
+});
|
|
|
+
|
|
|
+// 工商信息
|
|
|
+const businessForm = reactive<BusinessInfoForm>({
|
|
|
+ businessCustomerName: '',
|
|
|
+ socialCreditCode: '',
|
|
|
+ legalPersonName: '',
|
|
|
+ registeredCapital: '',
|
|
|
+ registrationAuthority: '',
|
|
|
+ establishmentDate: '',
|
|
|
+ revocationDate: '',
|
|
|
+ registrationStatus: '',
|
|
|
+ paidInCapital: undefined,
|
|
|
+ businessAddress: '',
|
|
|
+ businessLicense: '',
|
|
|
+ status: '0'
|
|
|
+});
|
|
|
+
|
|
|
+// 联系人列表
|
|
|
+const contactList = ref<CustomerContactForm[]>([]);
|
|
|
+const contactDialogVisible = ref(false);
|
|
|
+const currentContact = ref<CustomerContactForm | undefined>(undefined);
|
|
|
+const currentContactIndex = ref<number>(-1);
|
|
|
+
|
|
|
+// 销售信息
|
|
|
+const salesForm = reactive<SalesInfoForm>({
|
|
|
+ salesPersonId: undefined,
|
|
|
+ serviceStaffId: undefined,
|
|
|
+ belongingDepartmentId: undefined,
|
|
|
+ status: '0'
|
|
|
+});
|
|
|
+
|
|
|
+// 开票信息列表
|
|
|
+const invoiceList = ref<InvoiceInfoForm[]>([]);
|
|
|
+const invoiceDialogVisible = ref(false);
|
|
|
+const currentInvoice = ref<InvoiceInfoForm | undefined>(undefined);
|
|
|
+const currentInvoiceIndex = ref<number>(-1);
|
|
|
+
|
|
|
+// 表单验证规则
|
|
|
+const rules = {
|
|
|
+ companyName: [{ required: true, message: '请输入客户名称', trigger: 'blur' }]
|
|
|
+};
|
|
|
+
|
|
|
+// 获取角色名称
|
|
|
+const getRoleName = (roleId: string | number | undefined) => {
|
|
|
+ const roleMap: Record<string, string> = {
|
|
|
+ '1': '采购经理',
|
|
|
+ '2': '财务',
|
|
|
+ '3': '其他'
|
|
|
+ };
|
|
|
+ return roleMap[String(roleId)] || '-';
|
|
|
+};
|
|
|
+
|
|
|
+// 打开添加联系人对话框
|
|
|
+const handleAddContact = () => {
|
|
|
+ currentContact.value = undefined;
|
|
|
+ currentContactIndex.value = -1;
|
|
|
+ contactDialogVisible.value = true;
|
|
|
+};
|
|
|
+/** 处理区域选择变化 */
|
|
|
+const handleChange = (val: string[]) => {
|
|
|
+ // 保存编码
|
|
|
+ form.regProvincialNo = val[0];
|
|
|
+ form.regCityNo = val[1];
|
|
|
+ form.regCountyNo = val[2];
|
|
|
+
|
|
|
+ // 根据编码获取名称
|
|
|
+ const names: string[] = [];
|
|
|
+ if (val[0]) {
|
|
|
+ const province = regionData.find((item: any) => item.value === val[0]);
|
|
|
+ if (province) {
|
|
|
+ names.push(province.label);
|
|
|
+
|
|
|
+ if (val[1] && province.children) {
|
|
|
+ const city = province.children.find((item: any) => item.value === val[1]);
|
|
|
+ if (city) {
|
|
|
+ names.push(city.label);
|
|
|
+
|
|
|
+ if (val[2] && city.children) {
|
|
|
+ const county = city.children.find((item: any) => item.value === val[2]);
|
|
|
+ if (county) {
|
|
|
+ names.push(county.label);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 将省市区名称用斜杠连接
|
|
|
+ form.provincialCityCounty = names.join('/');
|
|
|
+};
|
|
|
+// 编辑联系人
|
|
|
+const handleEditContact = (row: CustomerContactForm, index: number) => {
|
|
|
+ currentContact.value = { ...row };
|
|
|
+ currentContactIndex.value = index;
|
|
|
+ contactDialogVisible.value = true;
|
|
|
+};
|
|
|
+
|
|
|
+// 确认添加/编辑联系人
|
|
|
+const handleContactConfirm = (data: CustomerContactForm) => {
|
|
|
+ if (currentContactIndex.value >= 0) {
|
|
|
+ // 编辑
|
|
|
+ contactList.value[currentContactIndex.value] = data;
|
|
|
+ } else {
|
|
|
+ // 新增
|
|
|
+ contactList.value.push(data);
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 删除联系人
|
|
|
+const removeContact = (index: number) => {
|
|
|
+ ElMessageBox.confirm('确定要删除该联系人吗?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ contactList.value.splice(index, 1);
|
|
|
+ ElMessage.success('删除成功');
|
|
|
+ })
|
|
|
+ .catch(() => {});
|
|
|
+};
|
|
|
+
|
|
|
+// 打开添加开票信息对话框
|
|
|
+const handleAddInvoice = () => {
|
|
|
+ currentInvoice.value = undefined;
|
|
|
+ currentInvoiceIndex.value = -1;
|
|
|
+ invoiceDialogVisible.value = true;
|
|
|
+};
|
|
|
+
|
|
|
+// 编辑开票信息
|
|
|
+const handleEditInvoice = (row: InvoiceInfoForm, index: number) => {
|
|
|
+ currentInvoice.value = { ...row };
|
|
|
+ currentInvoiceIndex.value = index;
|
|
|
+ invoiceDialogVisible.value = true;
|
|
|
+};
|
|
|
+
|
|
|
+// 确认添加/编辑开票信息
|
|
|
+const handleInvoiceConfirm = (data: InvoiceInfoForm) => {
|
|
|
+ if (currentInvoiceIndex.value >= 0) {
|
|
|
+ // 编辑
|
|
|
+ invoiceList.value[currentInvoiceIndex.value] = data;
|
|
|
+ } else {
|
|
|
+ // 新增
|
|
|
+ invoiceList.value.push(data);
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+// 删除开票信息
|
|
|
+const removeInvoice = (index: number) => {
|
|
|
+ ElMessageBox.confirm('确定要删除该开票信息吗?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ invoiceList.value.splice(index, 1);
|
|
|
+ ElMessage.success('删除成功');
|
|
|
+ })
|
|
|
+ .catch(() => {});
|
|
|
+};
|
|
|
+
|
|
|
+// 提交表单
|
|
|
+const handleSubmit = async () => {
|
|
|
+ try {
|
|
|
+ await formRef.value?.validate();
|
|
|
+ submitLoading.value = true;
|
|
|
+
|
|
|
+ // 将客户编号赋值到表单
|
|
|
+ form.customerNo = customerNumber.value;
|
|
|
+
|
|
|
+ // 组装提交数据,按照后端要求的结构
|
|
|
+ const submitData: CustomerInfoForm = {
|
|
|
+ ...form,
|
|
|
+ customerBusinessBo: businessForm,
|
|
|
+ customerSalesInfoBo: salesForm,
|
|
|
+ customerContactBoList: contactList.value,
|
|
|
+ customerInvoiceInfoBoList: invoiceList.value
|
|
|
+ };
|
|
|
+
|
|
|
+ await addCustomerInfo(submitData);
|
|
|
+ ElMessage.success('添加成功');
|
|
|
+
|
|
|
+ router.back();
|
|
|
+ } catch (error) {
|
|
|
+ console.error('保存失败:', error);
|
|
|
+ ElMessage.error('保存失败,请重试');
|
|
|
+ } finally {
|
|
|
+ submitLoading.value = false;
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|