feat: 个人用户视图表格新增编辑按钮+编辑弹窗

4个Tab的表格均添编辑按钮,点击弹窗可编辑关键字段并保存/删除

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2026-07-13 00:04:32 +08:00
parent 9a39b96316
commit 1fddc35119
@@ -25,6 +25,54 @@ const indivPlans = ref<any[]>([])
const indivMini = ref<any[]>([])
const indivKeyVisits = ref<any[]>([])
const indivLoading = ref(false)
// Individual record edit
const indivEditVisible = ref(false)
const indivEditType = ref('')
const indivEditForm = ref<any>({})
const indivEditSaving = ref(false)
function openIndivEdit(type: string, row: any) {
indivEditType.value = type
indivEditForm.value = { ...row }
indivEditVisible.value = true
}
async function handleIndivEditSave() {
indivEditSaving.value = true
try {
const type = indivEditType.value
const f = indivEditForm.value
if (type === 'visit') {
await api.put(`/visits/${f.id}`, { communication_content: f.communication_content, visitor_name: f.visitor_name })
} else if (type === 'plan') {
await api.put(`/work-plans/${f.id}`, { plan_content: f.plan_content, status: f.status })
} else if (type === 'mini') {
await api.put(`/mini-business/${f.id}`, { product_type: f.product_type, amount: f.amount, follow_up_detail: f.follow_up_detail, status: f.status })
} else if (type === 'key') {
await api.put(`/key-visits/${f.id}`, { description: f.description })
}
ElMessage.success('已更新')
indivEditVisible.value = false
loadIndividualData()
} catch (e: any) { ElMessage.error('保存失败') }
finally { indivEditSaving.value = false }
}
async function handleIndivEditDelete() {
try {
await ElMessageBox.confirm('确定删除?', '确认', { type: 'warning' })
const type = indivEditType.value
const id = indivEditForm.value.id
if (type === 'visit') await api.delete(`/visits/${id}`)
else if (type === 'plan') await api.delete(`/work-plans/${id}`)
else if (type === 'mini') await api.delete(`/mini-business/${id}`)
else if (type === 'key') await api.delete(`/key-visits/${id}`)
ElMessage.success('已删除')
indivEditVisible.value = false
loadIndividualData()
} catch (e: any) { if (e !== 'cancel') ElMessage.error('删除失败') }
}
const currentPage = ref(1)
const pageSize = ref(25)
const total = ref(0)
@@ -384,6 +432,7 @@ async function handleImport() {
<el-table-column prop="visitor_name" label="拜访人" width="80" />
<el-table-column prop="manager_name" label="客户经理" width="80" />
<el-table-column prop="customer_name" label="客户" width="100" />
<el-table-column label="操作" width="60" fixed="right"><template #default="{ row }"><el-button size="small" @click="openIndivEdit('visit', row)">编辑</el-button></template></el-table-column>
</el-table>
<div v-else class="empty-tab">暂无拜访记录</div>
</el-tab-pane>
@@ -393,6 +442,7 @@ async function handleImport() {
<el-table-column prop="plan_content" label="工作计划" min-width="250" show-overflow-tooltip />
<el-table-column prop="status" label="状态" width="80" />
<el-table-column prop="customer_name" label="客户" width="120" />
<el-table-column label="操作" width="60" fixed="right"><template #default="{ row }"><el-button size="small" @click="openIndivEdit('plan', row)">编辑</el-button></template></el-table-column>
</el-table>
<div v-else class="empty-tab">暂无工作计划</div>
</el-tab-pane>
@@ -403,6 +453,7 @@ async function handleImport() {
<el-table-column prop="status" label="状态" width="80" />
<el-table-column prop="follow_up_detail" label="跟进内容" min-width="200" show-overflow-tooltip />
<el-table-column prop="customer_name" label="客户" width="120" />
<el-table-column label="操作" width="60" fixed="right"><template #default="{ row }"><el-button size="small" @click="openIndivEdit('mini', row)">编辑</el-button></template></el-table-column>
</el-table>
<div v-else class="empty-tab">暂无商机记录</div>
</el-tab-pane>
@@ -412,6 +463,7 @@ async function handleImport() {
<el-table-column prop="description" label="内容" min-width="250" show-overflow-tooltip />
<el-table-column prop="urgency_level" label="紧急度" width="80" />
<el-table-column prop="customer_name" label="客户" width="120" />
<el-table-column label="操作" width="60" fixed="right"><template #default="{ row }"><el-button size="small" @click="openIndivEdit('key', row)">编辑</el-button></template></el-table-column>
</el-table>
<div v-else class="empty-tab">暂不要客记录</div>
</el-tab-pane>
@@ -628,6 +680,34 @@ async function handleImport() {
</el-dialog>
</template>
<!-- Individual Record Edit Dialog -->
<el-dialog v-model="indivEditVisible" :title="'编辑' + ({visit:'拜访',plan:'计划',mini:'商机',key:'要客'}[indivEditType]||'')" width="450px">
<el-form label-position="top" v-if="indivEditForm">
<template v-if="indivEditType === 'visit'">
<el-form-item label="沟通内容"><el-input v-model="indivEditForm.communication_content" type="textarea" :rows="4" /></el-form-item>
<el-form-item label="拜访人"><el-input v-model="indivEditForm.visitor_name" /></el-form-item>
</template>
<template v-else-if="indivEditType === 'plan'">
<el-form-item label="工作计划"><el-input v-model="indivEditForm.plan_content" type="textarea" :rows="3" /></el-form-item>
<el-form-item label="状态"><el-select v-model="indivEditForm.status" style="width:100%"><el-option v-for="s in ['计划中','已完成','已取消']" :key="s" :label="s" :value="s" /></el-select></el-form-item>
</template>
<template v-else-if="indivEditType === 'mini'">
<el-form-item label="产品类型"><el-input v-model="indivEditForm.product_type" /></el-form-item>
<el-form-item label="金额"><el-input v-model="indivEditForm.amount" /></el-form-item>
<el-form-item label="跟进内容"><el-input v-model="indivEditForm.follow_up_detail" type="textarea" :rows="3" /></el-form-item>
<el-form-item label="状态"><el-select v-model="indivEditForm.status" style="width:100%"><el-option v-for="s in ['跟进中','已签约','已流失']" :key="s" :label="s" :value="s" /></el-select></el-form-item>
</template>
<template v-else-if="indivEditType === 'key'">
<el-form-item label="内容描述"><el-input v-model="indivEditForm.description" type="textarea" :rows="4" /></el-form-item>
</template>
</el-form>
<template #footer>
<el-button type="danger" @click="handleIndivEditDelete" style="float:left">删除</el-button>
<el-button @click="indivEditVisible = false">取消</el-button>
<el-button type="primary" :loading="indivEditSaving" @click="handleIndivEditSave">保存</el-button>
</template>
</el-dialog>
<!-- Merge confirmation dialog -->
<el-dialog v-model="mergeDialogVisible" title="合并客户" width="520px" :close-on-click-modal="false">
<div style="line-height:1.8">