| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <div class="search_form"> |
| | | <div class="search_form" style="margin-bottom: 20px;"> |
| | | <div> |
| | | <span class="search_title">客户名称:</span> |
| | | <el-input v-model="searchForm.customerName" |
| | |
| | | style="width: 240px" |
| | | clearable |
| | | @change="handleQuery"> |
| | | <el-option label="零售客户" |
| | | value="零售客户" /> |
| | | <el-option label="进销商客户" |
| | | value="进销商客户" /> |
| | | <el-option label="三大油" |
| | | value="三大油" /> |
| | | <el-option label="外销" |
| | | value="外销" /> |
| | | </el-select> |
| | | <el-button type="primary" |
| | | @click="handleQuery" |
| | |
| | | </div> |
| | | <div> |
| | | <el-button type="primary" |
| | | v-hasPermi="['basic:customer:add']" |
| | | @click="openForm('add')">新增客户</el-button> |
| | | <el-button @click="handleOut">导出</el-button> |
| | | <el-button v-hasPermi="['basic:customer:export']" |
| | | @click="handleOut">导出</el-button> |
| | | <el-button type="info" |
| | | plain |
| | | icon="Upload" |
| | | v-hasPermi="['basic:customer:import']" |
| | | @click="handleImport">导入</el-button> |
| | | <el-button type="danger" |
| | | plain |
| | | v-hasPermi="['basic:customer:remove']" |
| | | @click="handleDelete">删除</el-button> |
| | | </div> |
| | | </div> |
| | |
| | | <el-select v-model="form.customerType" |
| | | placeholder="请选择" |
| | | clearable> |
| | | <el-option label="零售客户" |
| | | value="零售客户" /> |
| | | <el-option label="进销商客户" |
| | | value="进销商客户" /> |
| | | <el-option label="三大油" |
| | | value="三大油" /> |
| | | <el-option label="外销" |
| | | value="外销" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="绑定登录账号:" |
| | | prop="bindUserId"> |
| | | <el-select v-model="form.bindUserId" |
| | | placeholder="请选择该客户的登录账号" |
| | | clearable |
| | | filterable |
| | | style="width: 100%"> |
| | | <el-option v-for="item in userList" |
| | | :key="item.userId" |
| | | :label="item.nickName + '(' + item.userName + ')'" |
| | | :value="item.userId" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | |
| | | :limit="1" |
| | | accept=".xlsx, .xls" |
| | | :headers="upload.headers" |
| | | :action="upload.url + '?updateSupport=' + upload.updateSupport" |
| | | :action="upload.url" |
| | | :data="upload.data" |
| | | :disabled="upload.isUploading" |
| | | :before-upload="upload.beforeUpload" |
| | | :on-progress="upload.onProgress" |
| | |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | <!-- 回访提醒对话框 --> |
| | | <el-dialog title="回访提醒" |
| | | v-model="reminderDialogVisible" |
| | | width="500px" |
| | | @close="closeReminderDialog"> |
| | | <el-form :model="reminderForm" |
| | | label-width="100px" |
| | | :rules="reminderRules" |
| | | ref="reminderFormRef"> |
| | | <el-form-item label="客户名称:"> |
| | | <el-input v-model="reminderForm.customerName" |
| | | disabled /> |
| | | <!-- 近3年财务报表上传 --> |
| | | <el-dialog title="近3年财务报表上传" |
| | | v-model="reportDialogVisible" |
| | | width="900px" |
| | | @close="closeReportDialog"> |
| | | <div class="report-customer">客户:{{ reportCustomer.customerName }}</div> |
| | | <el-form :model="reportForm" |
| | | label-width="90px" |
| | | inline |
| | | class="report-form"> |
| | | <el-form-item label="报表年度"> |
| | | <el-select v-model="reportForm.reportYear" |
| | | placeholder="请选择年度" |
| | | style="width: 150px"> |
| | | <el-option v-for="year in reportYears" |
| | | :key="year" |
| | | :label="year + '年'" |
| | | :value="year" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="提醒开关:"> |
| | | <el-switch v-model="reminderForm.reminderSwitch" /> |
| | | </el-form-item> |
| | | <el-form-item label="提醒内容:" |
| | | prop="reminderContent"> |
| | | <el-input v-model="reminderForm.reminderContent" |
| | | type="textarea" |
| | | :maxlength="100" |
| | | show-word-limit |
| | | placeholder="请输入提醒内容" /> |
| | | </el-form-item> |
| | | <el-form-item label="提醒时间:" |
| | | prop="reminderTime"> |
| | | <el-date-picker v-model="reminderForm.reminderTime" |
| | | type="date" |
| | | value-format="YYYY-MM-DD" |
| | | format="YYYY-MM-DD" |
| | | placeholder="请选择提醒时间" |
| | | style="width: 100%" /> |
| | | <el-form-item label="报表名称"> |
| | | <el-input v-model="reportForm.reportName" |
| | | placeholder="例如:2025年度财务报表" |
| | | style="width: 260px" |
| | | clearable /> |
| | | </el-form-item> |
| | | </el-form> |
| | | <FileUpload v-model="reportForm.reportFiles" |
| | | :limit="5" |
| | | :file-size="20" |
| | | :file-type="['pdf', 'doc', 'docx', 'xls', 'xlsx', 'jpg', 'png', 'zip', 'rar']" /> |
| | | <div class="report-actions"> |
| | | <el-button type="primary" |
| | | :loading="reportSaving" |
| | | @click="saveReport">保存上传</el-button> |
| | | <el-button @click="resetReportForm">重置</el-button> |
| | | </div> |
| | | <el-table :data="reportRows" |
| | | border |
| | | size="small" |
| | | style="margin-top: 16px"> |
| | | <el-table-column prop="reportYear" |
| | | label="年度" |
| | | width="90" |
| | | align="center" /> |
| | | <el-table-column prop="reportName" |
| | | label="报表名称" |
| | | min-width="180" |
| | | show-overflow-tooltip /> |
| | | <el-table-column label="报表附件" |
| | | min-width="260"> |
| | | <template #default="scope"> |
| | | <FileUpload v-model="scope.row.reportFiles" |
| | | disabled |
| | | :is-show-tip="false" /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="uploadUserName" |
| | | label="上传人" |
| | | width="110" /> |
| | | <el-table-column prop="updateTime" |
| | | label="上传时间" |
| | | width="170" /> |
| | | <el-table-column label="审批状态" |
| | | width="100" |
| | | align="center"> |
| | | <template #default="scope"> |
| | | <el-tag :type="reportStatusTag(scope.row.auditStatus)"> |
| | | {{ reportStatusText(scope.row.auditStatus) }} |
| | | </el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" |
| | | width="140" |
| | | align="center"> |
| | | <template #default="scope"> |
| | | <el-button type="primary" |
| | | link |
| | | @click="editReport(scope.row)">修改</el-button> |
| | | <el-button type="danger" |
| | | link |
| | | @click="deleteReport(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <div v-if="reportRows.length === 0" |
| | | class="no-record">暂无财务报表,请按年度上传近3年财务报表</div> |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | | <el-button @click="closeReminderDialog">取消</el-button> |
| | | <el-button type="primary" |
| | | @click="submitReminderForm">提交</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | <!-- 添加/修改洽谈进度对话框 --> |
| | | <el-dialog :title="negotiationForm.editIndex !== undefined ? '修改进度' : '添加进度'" |
| | | v-model="negotiationDialogVisible" |
| | | width="600px" |
| | | @close="closeNegotiationDialog"> |
| | | <el-form :model="negotiationForm" |
| | | label-width="100px" |
| | | :rules="negotiationRules" |
| | | ref="negotiationFormRef"> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="跟进方式:" |
| | | prop="followUpMethod"> |
| | | <el-select v-model="negotiationForm.followUpMethod" |
| | | placeholder="请选择" |
| | | style="width: 100%"> |
| | | <el-option label="电话" |
| | | value="电话" /> |
| | | <el-option label="邮件" |
| | | value="邮件" /> |
| | | <el-option label="上门" |
| | | value="上门" /> |
| | | <el-option label="微信" |
| | | value="微信" /> |
| | | <el-option label="其他" |
| | | value="其他" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="跟进程度:" |
| | | prop="followUpLevel"> |
| | | <el-select v-model="negotiationForm.followUpLevel" |
| | | placeholder="请选择" |
| | | style="width: 100%"> |
| | | <el-option label="潜在客户" |
| | | value="潜在客户" /> |
| | | <el-option label="初次拜访" |
| | | value="初次拜访" /> |
| | | <el-option label="多次拜访" |
| | | value="多次拜访" /> |
| | | <el-option label="意向客户" |
| | | value="意向客户" /> |
| | | <el-option label="已签约客户" |
| | | value="已签约客户" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="跟进时间:" |
| | | prop="followUpTime"> |
| | | <el-date-picker v-model="negotiationForm.followUpTime" |
| | | type="datetime" |
| | | value-format="YYYY-MM-DD HH:mm:ss" |
| | | format="YYYY-MM-DD HH:mm:ss" |
| | | placeholder="请选择" |
| | | style="width: 100%" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="跟进人:"> |
| | | <el-input v-model="negotiationForm.followerUserName" |
| | | disabled /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-form-item label="内容:" |
| | | prop="content"> |
| | | <el-input v-model="negotiationForm.content" |
| | | type="textarea" |
| | | :rows="4" |
| | | placeholder="请输入" /> |
| | | </el-form-item> |
| | | </el-form> |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | | <el-button @click="closeNegotiationDialog">取消</el-button> |
| | | <el-button type="primary" |
| | | @click="submitNegotiationForm">提交</el-button> |
| | | <el-button @click="closeReportDialog">关闭</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | <!-- 客户详情对话框 --> |
| | | <el-dialog title="客户详情" |
| | | v-model="detailDialogVisible" |
| | | width="800px" |
| | | width="1000px" |
| | | @close="closeDetailDialog"> |
| | | <!-- 客户基本信息 --> |
| | | <div class="detail-section"> |
| | | <h3 class="section-title">客户基本信息</h3> |
| | | <div class="info-display"> |
| | |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <div class="info-item"> |
| | | <span class="info-label">绑定登录账号:</span> |
| | | <span class="info-value">{{ detailForm.bindUserName || '-' }}</span> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <div class="info-item"> |
| | | <span class="info-label">维护人:</span> |
| | | <span class="info-value">{{ detailForm.maintainer }}</span> |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <div class="info-item"> |
| | | <span class="info-label">维护时间:</span> |
| | |
| | | </el-row> |
| | | </div> |
| | | </div> |
| | | <!-- 洽谈进度记录 --> |
| | | <div class="detail-section"> |
| | | <div class="section-header"> |
| | | <h3 class="section-title">洽谈进度记录</h3> |
| | | <el-button type="primary" |
| | | size="small" |
| | | @click="openNegotiationDialog(detailForm)"> |
| | | 添加进度 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="negotiationRecords" |
| | | <h3 class="section-title">近3年财务报表</h3> |
| | | <el-table :data="detailReports" |
| | | border |
| | | size="small" |
| | | style="width: 100%"> |
| | | <el-table-column prop="followUpTime" |
| | | label="跟进时间" |
| | | width="160" /> |
| | | <el-table-column prop="followUpMethod" |
| | | label="跟进方式" |
| | | width="100" /> |
| | | <el-table-column prop="followUpLevel" |
| | | label="跟进程度" |
| | | width="120" /> |
| | | <el-table-column prop="followerUserName" |
| | | label="跟进人" |
| | | width="100" /> |
| | | <el-table-column prop="content" |
| | | label="内容" |
| | | <el-table-column prop="reportYear" |
| | | label="年度" |
| | | width="90" |
| | | align="center" /> |
| | | <el-table-column prop="reportName" |
| | | label="报表名称" |
| | | min-width="180" |
| | | show-overflow-tooltip /> |
| | | <el-table-column label="操作" |
| | | width="150" |
| | | align="center"> |
| | | <template #default="{ row, $index }"> |
| | | <el-button type="primary" |
| | | link |
| | | size="small" |
| | | @click="editNegotiationRecord(row, $index)"> |
| | | 修改 |
| | | </el-button> |
| | | <el-button type="danger" |
| | | link |
| | | size="small" |
| | | @click="deleteNegotiationRecord(row, $index)"> |
| | | 删除 |
| | | </el-button> |
| | | <el-table-column label="报表附件" |
| | | min-width="260"> |
| | | <template #default="scope"> |
| | | <FileUpload v-model="scope.row.reportFiles" |
| | | disabled |
| | | :is-show-tip="false" /> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="uploadUserName" |
| | | label="上传人" |
| | | width="110" /> |
| | | <el-table-column prop="updateTime" |
| | | label="上传时间" |
| | | width="170" /> |
| | | </el-table> |
| | | <div v-if="negotiationRecords.length === 0" |
| | | class="no-records"> |
| | | 暂无洽谈进度记录 |
| | | </div> |
| | | <div v-if="detailReports.length === 0" |
| | | class="no-record">暂无财务报表</div> |
| | | </div> |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | |
| | | |
| | | <script setup> |
| | | import { onMounted, ref, reactive, getCurrentInstance, toRefs } from "vue"; |
| | | import { Search } from "@element-plus/icons-vue"; |
| | | import { Search, Close } from "@element-plus/icons-vue"; |
| | | import { listCustomer, getCustomer, addCustomer, updateCustomer, delCustomer } from "@/api/basicData/customer.js"; |
| | | import { |
| | | addCustomer, |
| | | delCustomer, |
| | | getCustomer, |
| | | listCustomer, |
| | | updateCustomer, |
| | | addCustomerFollow, |
| | | updateCustomerFollow, |
| | | delCustomerFollow, |
| | | } from "@/api/basicData/customerFile.js"; |
| | | listCustomerFinancialReport, |
| | | saveCustomerFinancialReport, |
| | | delCustomerFinancialReport, |
| | | } from "@/api/basicData/customerFinancialReport.js"; |
| | | import { ElMessageBox } from "element-plus"; |
| | | import { userListNoPage } from "@/api/system/user.js"; |
| | | import useUserStore from "@/store/modules/user"; |
| | | import { getToken } from "@/utils/auth.js"; |
| | | import FileUpload from "@/components/FileUpload/index.vue"; |
| | | const { proxy } = getCurrentInstance(); |
| | | const userStore = useUserStore(); |
| | | |
| | | // 回访提醒相关 |
| | | const reminderDialogVisible = ref(false); |
| | | const reminderFormRef = ref(); |
| | | const reminderForm = reactive({ |
| | | customerName: "", |
| | | reminderSwitch: false, |
| | | reminderContent: "", |
| | | reminderTime: "", |
| | | }); |
| | | const reminderRules = { |
| | | reminderContent: [ |
| | | { required: true, message: "请输入提醒内容", trigger: "blur" }, |
| | | ], |
| | | reminderTime: [ |
| | | { required: true, message: "请选择提醒时间", trigger: "change" }, |
| | | ], |
| | | }; |
| | | |
| | | // 洽谈进度相关 |
| | | const negotiationDialogVisible = ref(false); |
| | | const negotiationFormRef = ref(); |
| | | const negotiationForm = reactive({ |
| | | customerName: "", |
| | | customerId: "", |
| | | followUpMethod: "", |
| | | followUpLevel: "", |
| | | followUpTime: "", |
| | | followerUserName: "", |
| | | content: "", |
| | | }); |
| | | const negotiationRules = { |
| | | followUpMethod: [ |
| | | { required: true, message: "请选择跟进方式", trigger: "change" }, |
| | | ], |
| | | followUpLevel: [ |
| | | { required: true, message: "请选择跟进程度", trigger: "change" }, |
| | | ], |
| | | followUpTime: [ |
| | | { required: true, message: "请选择跟进时间", trigger: "change" }, |
| | | ], |
| | | content: [{ required: true, message: "请输入内容", trigger: "blur" }], |
| | | }; |
| | | |
| | | // 详情相关 |
| | | const detailDialogVisible = ref(false); |
| | | const detailReports = ref([]); |
| | | const detailForm = reactive({ |
| | | customerName: "", |
| | | customerType: "", |
| | |
| | | bankCode: "", |
| | | contactPerson: "", |
| | | contactPhone: "", |
| | | bindUserId: "", |
| | | bindUserName: "", |
| | | maintainer: "", |
| | | maintenanceTime: "", |
| | | }); |
| | | const negotiationRecords = ref([]); |
| | | |
| | | // 近3年财务报表相关 |
| | | const reportDialogVisible = ref(false); |
| | | const reportSaving = ref(false); |
| | | const reportCustomer = reactive({ id: "", customerName: "" }); |
| | | const reportRows = ref([]); |
| | | const nowYear = new Date().getFullYear(); |
| | | const reportYears = [nowYear, nowYear - 1, nowYear - 2]; |
| | | const reportForm = reactive({ reportYear: nowYear, reportName: "", reportFiles: "" }); |
| | | |
| | | const tableColumn = ref([ |
| | | { |
| | |
| | | width: 150, |
| | | }, |
| | | { |
| | | label: "跟进进度", |
| | | prop: "followUpLevel", |
| | | width: 120, |
| | | }, |
| | | { |
| | | label: "跟进时间", |
| | | prop: "followUpTime", |
| | | width: 120, |
| | | }, |
| | | { |
| | | label: "银行基本户", |
| | | prop: "basicBankAccount", |
| | | width: 220, |
| | | }, |
| | | { |
| | | label: "银行账号", |
| | | prop: "bankAccount", |
| | | width: 220, |
| | | }, |
| | | { |
| | | label: "开户行号", |
| | | prop: "bankCode", |
| | | width: 220, |
| | | }, |
| | | { |
| | | label: "维护人", |
| | | prop: "maintainer", |
| | | }, |
| | | { |
| | | label: "维护时间", |
| | | prop: "maintenanceTime", |
| | | width: 100, |
| | | }, |
| | | { |
| | | dataType: "action", |
| | | label: "操作", |
| | | align: "center", |
| | | fixed: "right", |
| | | width: 250, |
| | | width: 240, |
| | | operation: [ |
| | | { |
| | | name: "编辑", |
| | | type: "text", |
| | | showHide: () => proxy.$auth.hasPermi("basic:customer:edit"), |
| | | clickFun: row => { |
| | | openForm("edit", row); |
| | | }, |
| | | }, |
| | | { |
| | | name: "近3年财务报表", |
| | | type: "text", |
| | | showHide: () => proxy.$auth.hasPermi("basic:customer:report"), |
| | | clickFun: row => { |
| | | openReportDialog(row); |
| | | }, |
| | | }, |
| | | { |
| | | name: "详情", |
| | | type: "text", |
| | | showHide: () => proxy.$auth.hasPermi("basic:customer:query"), |
| | | clickFun: row => { |
| | | openDetailDialog(row); |
| | | }, |
| | | }, |
| | | { |
| | | name: "回访提醒", |
| | | type: "text", |
| | | clickFun: row => { |
| | | openReminderDialog(row); |
| | | }, |
| | | }, |
| | | { |
| | | name: "添加洽谈进度", |
| | | type: "text", |
| | | clickFun: row => { |
| | | openNegotiationDialog(row); |
| | | }, |
| | | }, |
| | | ], |
| | |
| | | size: 100, |
| | | total: 0, |
| | | }); |
| | | const total = ref(0); |
| | | |
| | | // 用户信息表单弹框数据 |
| | | const operationType = ref(""); |
| | | const dialogFormVisible = ref(false); |
| | | const formYYs = ref({ |
| | | // 其他字段... |
| | | contactList: [ |
| | | { |
| | | contactPerson: "", |
| | |
| | | searchForm: { |
| | | customerName: "", |
| | | customerType: "", |
| | | type: 0 |
| | | }, |
| | | form: { |
| | | customerName: "", |
| | |
| | | companyPhone: "", |
| | | contactPerson: "", |
| | | contactPhone: "", |
| | | bindUserId: "", |
| | | maintainer: "", |
| | | maintenanceTime: "", |
| | | basicBankAccount: "", |
| | | bankAccount: "", |
| | | bankCode: "", |
| | | customerType: "", |
| | | type: 0 |
| | | }, |
| | | rules: { |
| | | customerName: [{ required: true, message: "请输入", trigger: "blur" }], |
| | |
| | | ], |
| | | companyAddress: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | companyPhone: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | // contactPerson: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | // contactPhone: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | maintainer: [{ required: false, message: "请选择", trigger: "change" }], |
| | | maintenanceTime: [ |
| | | { required: false, message: "请选择", trigger: "change" }, |
| | |
| | | headers: { Authorization: "Bearer " + getToken() }, |
| | | // 上传的地址 |
| | | url: import.meta.env.VITE_APP_BASE_API + "/basic/customer/importData", |
| | | data: { |
| | | type: 0 |
| | | }, |
| | | // 文件上传前的回调 |
| | | beforeUpload: file => { |
| | | console.log("文件即将上传", file); |
| | | // 可以在此处做文件类型或大小校验 |
| | | const isValid = |
| | | file.type === |
| | |
| | | }, |
| | | // 文件上传成功时的回调 |
| | | onSuccess: (response, file, fileList) => { |
| | | console.log("上传成功", response, file, fileList); |
| | | upload.isUploading = false; |
| | | if (response.code === 200) { |
| | | proxy.$modal.msgSuccess("文件上传成功"); |
| | |
| | | }, |
| | | // 文件上传失败时的回调 |
| | | onError: (error, file, fileList) => { |
| | | console.error("上传失败", error, file, fileList); |
| | | upload.isUploading = false; |
| | | proxy.$modal.msgError("文件上传失败"); |
| | | }, |
| | | // 文件上传进度回调 |
| | | onProgress: (event, file, fileList) => { |
| | | onProgress: event => { |
| | | console.log("上传中...", event.percent); |
| | | }, |
| | | }); |
| | |
| | | tableLoading.value = true; |
| | | listCustomer({ ...searchForm.value, ...page }).then(res => { |
| | | tableLoading.value = false; |
| | | tableData.value = res.records; |
| | | page.total = res.total; |
| | | tableData.value = res.data.records; |
| | | page.total = res.data.total; |
| | | }).catch(() => { |
| | | tableLoading.value = false; |
| | | }); |
| | | }; |
| | | // 表格选择数据 |
| | |
| | | contactPhone: "", |
| | | }, |
| | | ]; |
| | | form.value.type = 0; |
| | | form.value.maintenanceTime = getCurrentDate(); |
| | | userListNoPage().then(res => { |
| | | userList.value = res.data; |
| | |
| | | if (type === "edit") { |
| | | getCustomer(row.id).then(res => { |
| | | form.value = { ...res.data }; |
| | | formYYs.value.contactList = res.data.contactPerson |
| | | formYYs.value.contactList = (res.data.contactPerson || "") |
| | | .split(",") |
| | | .filter(item => item) |
| | | .map((item, index) => { |
| | | return { |
| | | contactPerson: item, |
| | | contactPhone: res.data.contactPhone.split(",")[index], |
| | | contactPhone: (res.data.contactPhone || "").split(",")[index], |
| | | }; |
| | | }); |
| | | if (formYYs.value.contactList.length === 0) { |
| | | formYYs.value.contactList = [{ contactPerson: "", contactPhone: "" }]; |
| | | } |
| | | }); |
| | | } |
| | | dialogFormVisible.value = true; |
| | |
| | | form.value.contactPhone = formYYs.value.contactList |
| | | .map(item => item.contactPhone) |
| | | .join(","); |
| | | addCustomer(form.value).then(res => { |
| | | addCustomer(form.value).then(() => { |
| | | proxy.$modal.msgSuccess("提交成功"); |
| | | closeDia(); |
| | | getList(); |
| | |
| | | form.value.contactPhone = formYYs.value.contactList |
| | | .map(item => item.contactPhone) |
| | | .join(","); |
| | | updateCustomer(form.value).then(res => { |
| | | updateCustomer(form.value).then(() => { |
| | | proxy.$modal.msgSuccess("提交成功"); |
| | | closeDia(); |
| | | getList(); |
| | |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | proxy.download("/basic/customer/export", {}, "客户档案.xlsx"); |
| | | proxy.download("/basic/customer/export", { type: 0 }, "客户档案.xlsx"); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已取消"); |
| | |
| | | const handleDelete = () => { |
| | | let ids = []; |
| | | if (selectedRows.value.length > 0) { |
| | | // 检查是否有他人维护的数据 |
| | | const unauthorizedData = selectedRows.value.filter( |
| | | item => item.maintainer !== userStore.nickName |
| | | item => item.type === 1 || item.type === "1" |
| | | ); |
| | | if (unauthorizedData.length > 0) { |
| | | proxy.$modal.msgWarning("不可删除他人维护的数据"); |
| | | proxy.$modal.msgWarning("公海分配的客户不能删除"); |
| | | return; |
| | | } |
| | | ids = selectedRows.value.map(item => item.id); |
| | |
| | | .then(() => { |
| | | tableLoading.value = true; |
| | | delCustomer(ids) |
| | | .then(res => { |
| | | .then(() => { |
| | | proxy.$modal.msgSuccess("删除成功"); |
| | | getList(); |
| | | }) |
| | |
| | | }); |
| | | }; |
| | | |
| | | // 打开回访提醒弹窗 |
| | | const openReminderDialog = row => { |
| | | reminderForm.customerName = row.customerName; |
| | | reminderForm.reminderSwitch = false; |
| | | reminderForm.reminderContent = ""; |
| | | reminderForm.reminderTime = ""; |
| | | |
| | | reminderDialogVisible.value = true; |
| | | // 打开近3年财务报表弹窗 |
| | | const openReportDialog = row => { |
| | | reportCustomer.id = row.id; |
| | | reportCustomer.customerName = row.customerName; |
| | | resetReportForm(); |
| | | loadReports(row.id); |
| | | reportDialogVisible.value = true; |
| | | }; |
| | | |
| | | // 关闭回访提醒弹窗 |
| | | const closeReminderDialog = () => { |
| | | proxy.resetForm("reminderFormRef"); |
| | | reminderDialogVisible.value = false; |
| | | }; |
| | | |
| | | // 提交回访提醒 |
| | | const submitReminderForm = () => { |
| | | proxy.$refs.reminderFormRef.validate(valid => { |
| | | if (valid) { |
| | | // 这里假设一个接口来提交回访提醒数据 |
| | | // 实际项目中需要根据后端接口进行调整 |
| | | console.log("提交回访提醒数据:", reminderForm); |
| | | |
| | | // 模拟接口调用 |
| | | setTimeout(() => { |
| | | proxy.$modal.msgSuccess("回访提醒设置成功"); |
| | | closeReminderDialog(); |
| | | }, 1000); |
| | | } |
| | | const loadReports = customerId => { |
| | | listCustomerFinancialReport({ customerId }).then(res => { |
| | | reportRows.value = res.data || []; |
| | | }); |
| | | }; |
| | | |
| | | // 打开洽谈进度弹窗 |
| | | const openNegotiationDialog = row => { |
| | | negotiationForm.customerName = row.customerName; |
| | | negotiationForm.customerId = row.id; |
| | | negotiationForm.followUpMethod = ""; |
| | | negotiationForm.followUpLevel = ""; |
| | | negotiationForm.followUpTime = ""; |
| | | negotiationForm.followerUserName = userStore.nickName; // 默认当前登录人 |
| | | negotiationForm.content = ""; |
| | | // { |
| | | // "customerId": 152, |
| | | // "followUpMethod": "电话沟通", |
| | | // "followUpLevel": "没有意向", |
| | | // "followUpTime": "2026-03-04T15:30:00", |
| | | // "followerUserName": "管理员账号", |
| | | // "content": "111" |
| | | // } |
| | | negotiationDialogVisible.value = true; |
| | | const reportStatusText = status => { |
| | | if (status === 1) return "已通过"; |
| | | if (status === 2) return "已退回"; |
| | | return "待审批"; |
| | | }; |
| | | const reportStatusTag = status => { |
| | | if (status === 1) return "success"; |
| | | if (status === 2) return "danger"; |
| | | return "warning"; |
| | | }; |
| | | |
| | | // 关闭洽谈进度弹窗 |
| | | const closeNegotiationDialog = () => { |
| | | proxy.resetForm("negotiationFormRef"); |
| | | // 清除编辑状态 |
| | | delete negotiationForm.editIndex; |
| | | delete negotiationForm.id; |
| | | negotiationDialogVisible.value = false; |
| | | const resetReportForm = () => { |
| | | reportForm.reportYear = nowYear; |
| | | reportForm.reportName = ""; |
| | | reportForm.reportFiles = ""; |
| | | }; |
| | | |
| | | // 提交洽谈进度 |
| | | const submitNegotiationForm = () => { |
| | | proxy.$refs.negotiationFormRef.validate(valid => { |
| | | if (valid) { |
| | | // 判断是新增还是修改 |
| | | const isEdit = negotiationForm.editIndex !== undefined; |
| | | const editReport = row => { |
| | | reportForm.reportYear = row.reportYear; |
| | | reportForm.reportName = row.reportName; |
| | | reportForm.reportFiles = row.reportFiles; |
| | | }; |
| | | |
| | | if (isEdit) { |
| | | // 修改操作 |
| | | console.log("修改洽谈进度数据:", negotiationForm); |
| | | // 这里可以调用更新接口 |
| | | // 实际项目中需要根据后端接口进行调整 |
| | | // 示例:updateCustomerFollow(negotiationForm).then(res => { |
| | | // // 更新本地数据 |
| | | // const index = negotiationForm.editIndex; |
| | | // negotiationRecords.value[index] = { |
| | | // followUpTime: negotiationForm.followUpTime, |
| | | // followUpMethod: negotiationForm.followUpMethod, |
| | | // followUpLevel: negotiationForm.followUpLevel, |
| | | // followerUserName: negotiationForm.followerUserName, |
| | | // content: negotiationForm.content, |
| | | // id: negotiationForm.id, |
| | | // }; |
| | | // proxy.$modal.msgSuccess("修改成功"); |
| | | // closeNegotiationDialog(); |
| | | // }); |
| | | updateCustomerFollow(negotiationForm).then(res => { |
| | | // 更新本地数据 |
| | | getCustomer(negotiationForm.customerId).then(res => { |
| | | // 更新本地数据 |
| | | negotiationRecords.value = res.data.followUpList || []; |
| | | }); |
| | | }); |
| | | proxy.$modal.msgSuccess("修改成功"); |
| | | closeNegotiationDialog(); |
| | | } else { |
| | | // 新增操作 |
| | | console.log("提交洽谈进度数据:", negotiationForm); |
| | | addCustomerFollow(negotiationForm).then(res => { |
| | | // 添加成功后更新详情页面的进度记录 |
| | | const newRecord = { |
| | | followUpTime: negotiationForm.followUpTime, |
| | | followUpMethod: negotiationForm.followUpMethod, |
| | | followUpLevel: negotiationForm.followUpLevel, |
| | | followerUserName: negotiationForm.followerUserName, |
| | | content: negotiationForm.content, |
| | | }; |
| | | negotiationRecords.value.unshift(newRecord); |
| | | |
| | | proxy.$modal.msgSuccess("提交成功"); |
| | | closeNegotiationDialog(); |
| | | getList(); |
| | | }); |
| | | } |
| | | } |
| | | const saveReport = () => { |
| | | if (!reportForm.reportFiles) { |
| | | proxy.$modal.msgWarning("请上传财务报表附件"); |
| | | return; |
| | | } |
| | | reportSaving.value = true; |
| | | saveCustomerFinancialReport({ |
| | | customerId: reportCustomer.id, |
| | | reportYear: reportForm.reportYear, |
| | | reportName: reportForm.reportName, |
| | | reportFiles: reportForm.reportFiles, |
| | | }).then(() => { |
| | | proxy.$modal.msgSuccess("保存成功"); |
| | | resetReportForm(); |
| | | loadReports(reportCustomer.id); |
| | | }).finally(() => { |
| | | reportSaving.value = false; |
| | | }); |
| | | }; |
| | | |
| | | const deleteReport = row => { |
| | | ElMessageBox.confirm("确定要删除该年度财务报表吗?", "删除提示", { |
| | | confirmButtonText: "确认", |
| | | cancelButtonText: "取消", |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | delCustomerFinancialReport(row.id).then(() => { |
| | | proxy.$modal.msgSuccess("删除成功"); |
| | | loadReports(reportCustomer.id); |
| | | }); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已取消"); |
| | | }); |
| | | }; |
| | | |
| | | const closeReportDialog = () => { |
| | | reportDialogVisible.value = false; |
| | | reportRows.value = []; |
| | | resetReportForm(); |
| | | }; |
| | | |
| | | // 打开详情弹窗 |
| | | const openDetailDialog = row => { |
| | | // 调用getCustomer接口获取客户详情 |
| | | getCustomer(row.id).then(res => { |
| | | // 填充客户基本信息 |
| | | Object.assign(detailForm, res.data); |
| | | |
| | | // 获取洽谈进度记录 |
| | | negotiationRecords.value = res.data.followUpList || []; |
| | | |
| | | const bindUser = userList.value.find(item => item.userId === res.data.bindUserId); |
| | | detailForm.bindUserName = bindUser ? bindUser.nickName : ""; |
| | | detailReports.value = []; |
| | | detailDialogVisible.value = true; |
| | | listCustomerFinancialReport({ customerId: row.id }).then(reportRes => { |
| | | detailReports.value = reportRes.data || []; |
| | | }); |
| | | }); |
| | | }; |
| | | |
| | |
| | | detailDialogVisible.value = false; |
| | | }; |
| | | |
| | | // 修改洽谈记录 |
| | | const editNegotiationRecord = (row, index) => { |
| | | // 将当前记录数据填充到表单 |
| | | Object.assign(negotiationForm, { |
| | | customerName: row.customerName, |
| | | customerId: row.customerId, |
| | | followUpMethod: row.followUpMethod, |
| | | followUpLevel: row.followUpLevel, |
| | | followUpTime: row.followUpTime, |
| | | followerUserName: row.followerUserName, |
| | | content: row.content, |
| | | id: row.id, // 记录ID用于更新 |
| | | editIndex: index, // 记录索引用于本地更新 |
| | | }); |
| | | negotiationDialogVisible.value = true; |
| | | }; |
| | | |
| | | // 删除洽谈记录 |
| | | const deleteNegotiationRecord = (row, index) => { |
| | | ElMessageBox.confirm("确定要删除这条洽谈记录吗?", "删除提示", { |
| | | confirmButtonText: "确定", |
| | | cancelButtonText: "取消", |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | // 这里可以调用删除接口 |
| | | // 实际项目中需要根据后端接口进行调整 |
| | | // 示例:deleteCustomerFollow(row.id).then(() => { |
| | | // negotiationRecords.value.splice(index, 1); |
| | | // proxy.$modal.msgSuccess("删除成功"); |
| | | // }); |
| | | delCustomerFollow(row.id).then(() => { |
| | | // 删除成功后更新本地数据 |
| | | getCustomer(row.customerId).then(res => { |
| | | // 更新本地数据 |
| | | negotiationRecords.value = res.data.followUpList || []; |
| | | }); |
| | | proxy.$modal.msgSuccess("删除成功"); |
| | | }); |
| | | // 本地删除(模拟) |
| | | negotiationRecords.value.splice(index, 1); |
| | | proxy.$modal.msgSuccess("删除成功"); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已取消删除"); |
| | | }); |
| | | }; |
| | | |
| | | // 获取当前日期并格式化为 YYYY-MM-DD |
| | | function getCurrentDate() { |
| | | const today = new Date(); |
| | | const year = today.getFullYear(); |
| | | const month = String(today.getMonth() + 1).padStart(2, "0"); // 月份从0开始 |
| | | const month = String(today.getMonth() + 1).padStart(2, "0"); |
| | | const day = String(today.getDate()).padStart(2, "0"); |
| | | return `${year}-${month}-${day}`; |
| | | } |
| | | |
| | | onMounted(() => { |
| | | userListNoPage().then(res => { |
| | | userList.value = res.data; |
| | | }); |
| | | getList(); |
| | | }); |
| | | </script> |
| | |
| | | padding: 15px; |
| | | background-color: #f9f9f9; |
| | | border-radius: 4px; |
| | | } |
| | | |
| | | .section-header { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | margin-bottom: 15px; |
| | | } |
| | | |
| | | .section-title { |
| | |
| | | word-break: break-word; |
| | | } |
| | | |
| | | .no-records { |
| | | .no-record { |
| | | text-align: center; |
| | | padding: 30px; |
| | | padding: 20px; |
| | | color: #999; |
| | | font-size: 14px; |
| | | } |
| | | |
| | | .report-customer { |
| | | font-size: 14px; |
| | | color: #606266; |
| | | margin-bottom: 12px; |
| | | } |
| | | |
| | | .report-form { |
| | | margin-bottom: 4px; |
| | | } |
| | | |
| | | .report-actions { |
| | | margin-top: 10px; |
| | | } |
| | | </style> |