解决项目列表不显示的问题。

This commit is contained in:
spllzh
2025-08-14 08:40:12 +08:00
parent 9b78f57e8c
commit 370664a283
3 changed files with 263 additions and 121 deletions

View File

@@ -6,15 +6,24 @@ export function getProjectList(params) {
url: '/projectManagement/list', url: '/projectManagement/list',
method: 'get', method: 'get',
params: { params: {
pageNum: params.pageNum || 1, current: params.pageNum || 1,
pageSize: params.pageSize || 10, size: params.pageSize || 10,
projectName: params.projectName, projectName: params.projectName,
storeId: params.storeId, dealershipId: params.dealershipId,
status: params.status status: params.status,
groupName: params.groupName
} }
}) })
} }
// 根据ID查询项目
export function getProjectById(id) {
return request({
url: `/projectManagement/get/${id}`,
method: 'get'
})
}
// 根据项目名称查询项目信息 // 根据项目名称查询项目信息
export function getProjectByName(projectName) { export function getProjectByName(projectName) {
return request({ return request({
@@ -37,7 +46,7 @@ export function batchDeleteProject(ids) {
return request({ return request({
url: '/projectManagement/batchDelete', url: '/projectManagement/batchDelete',
method: 'delete', method: 'delete',
data: { ids } data: ids
}) })
} }

View File

@@ -113,7 +113,7 @@ export const constantRoutes = [
path: 'index', path: 'index',
name: 'Dealership', name: 'Dealership',
component: () => import('@/views/dealership/index'), component: () => import('@/views/dealership/index'),
meta: { title: '经销商管理', icon: 'el-icon-s-shop' } meta: { title: '门店管理', icon: 'el-icon-s-shop' }
} }
] ]
}, },

View File

@@ -4,7 +4,7 @@
<el-card class="filter-container" shadow="never"> <el-card class="filter-container" shadow="never">
<el-form ref="queryForm" :model="queryParams" :inline="true" label-width="100px"> <el-form ref="queryForm" :model="queryParams" :inline="true" label-width="100px">
<el-form-item label="选择门店"> <el-form-item label="选择门店">
<el-select v-model="queryParams.storeId" placeholder="请选择所属门店" clearable> <el-select v-model="queryParams.dealershipId" placeholder="请选择所属门店" clearable>
<el-option <el-option
v-for="item in storeOptions" v-for="item in storeOptions"
:key="item.value" :key="item.value"
@@ -30,6 +30,15 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="分组名称">
<el-input
v-model="queryParams.groupName"
placeholder="请输入分组名称"
clearable
style="width: 200px"
/>
</el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" @click="handleQuery">筛选</el-button> <el-button type="primary" icon="el-icon-search" @click="handleQuery">筛选</el-button>
<el-button icon="el-icon-delete" @click="resetQuery">清空</el-button> <el-button icon="el-icon-delete" @click="resetQuery">清空</el-button>
@@ -53,27 +62,37 @@
> >
<el-table-column type="selection" width="55" /> <el-table-column type="selection" width="55" />
<el-table-column label="序号" type="index" width="50" /> <el-table-column label="序号" type="index" width="50" />
<el-table-column label="所属门店" prop="storeName" min-width="150" /> <el-table-column label="所属门店" prop="dealershipId" min-width="150" />
<el-table-column label="项目名称" prop="projectName" min-width="150" /> <el-table-column label="项目名称" prop="projectName" min-width="150" />
<el-table-column label="话术版本" prop="scriptVersion" min-width="100" /> <el-table-column label="话术版本" prop="scriptVersion" min-width="100" />
<el-table-column label="话术发布时间" prop="scriptReleaseTime" sortable min-width="150" /> <el-table-column label="话术发布时间" prop="scriptPublishTime" sortable min-width="150">
<el-table-column label="销售人员数量" prop="salesCount" min-width="120" /> <template slot-scope="scope">
<el-table-column label="平均录音时长(分钟)" prop="avgRecordingTime" min-width="150" /> {{ formatDateTime(scope.row.scriptPublishTime) }}
<el-table-column label="步骤" prop="steps" min-width="100" /> </template>
<el-table-column label="分组" prop="grouping" min-width="100" /> </el-table-column>
<el-table-column label="创建时间" prop="createTime" sortable min-width="150" /> <el-table-column label="销售人员数量" prop="salespersonCount" min-width="120" />
<el-table-column label="平均录音时长(分钟)" prop="avgRecordingDuration" min-width="150" />
<el-table-column label="步骤" prop="step" min-width="100" />
<el-table-column label="分组" prop="groupName" min-width="100" />
<el-table-column label="创建时间" prop="createTime" sortable min-width="150">
<template slot-scope="scope">
{{ formatDateTime(scope.row.createTime) }}
</template>
</el-table-column>
<el-table-column label="项目描述" prop="description" min-width="200" /> <el-table-column label="项目描述" prop="description" min-width="200" />
<el-table-column label="项目状态" prop="status" sortable min-width="100"> <el-table-column label="项目状态" prop="status" sortable min-width="100">
<template slot-scope="scope"> <template slot-scope="scope">
<el-tag :type="scope.row.status === '1' ? 'success' : 'danger'"> <el-tag :type="scope.row.status === true || scope.row.status === '1' ? 'success' : 'danger'">
{{ scope.row.status === '1' ? '启用' : '停用' }} {{ scope.row.status === true || scope.row.status === '1' ? '启用' : '停用' }}
</el-tag> </el-tag>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" width="200" fixed="right"> <el-table-column label="操作" width="280" fixed="right">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button type="text" @click="handleConfigureScript(scope.row)">配置话术</el-button> <el-button type="text" size="small" @click="handleEdit(scope.row)">编辑</el-button>
<el-button type="text" @click="handlePublishScript(scope.row)">发布话术</el-button> <el-button type="text" size="small" @click="handleConfigureScript(scope.row)">配置话术</el-button>
<el-button type="text" size="small" @click="handlePublishScript(scope.row)">发布话术</el-button>
<el-button type="text" size="small" style="color: #F56C6C;" @click="handleDelete(scope.row)">删除</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@@ -99,8 +118,8 @@
@close="handleDialogClose" @close="handleDialogClose"
> >
<el-form ref="projectForm" :model="projectForm" :rules="projectRules" label-width="100px"> <el-form ref="projectForm" :model="projectForm" :rules="projectRules" label-width="100px">
<el-form-item label="所属门店" prop="storeId"> <el-form-item label="所属门店" prop="dealershipId">
<el-select v-model="projectForm.storeId" placeholder="请选择所属门店" style="width: 100%"> <el-select v-model="projectForm.dealershipId" placeholder="请选择所属门店" style="width: 100%">
<el-option <el-option
v-for="item in storeOptions" v-for="item in storeOptions"
:key="item.value" :key="item.value"
@@ -112,6 +131,9 @@
<el-form-item label="项目名称" prop="projectName"> <el-form-item label="项目名称" prop="projectName">
<el-input v-model="projectForm.projectName" placeholder="请输入项目名称" /> <el-input v-model="projectForm.projectName" placeholder="请输入项目名称" />
</el-form-item> </el-form-item>
<el-form-item label="分组名称" prop="groupName">
<el-input v-model="projectForm.groupName" placeholder="请输入分组名称" />
</el-form-item>
<el-form-item label="项目描述" prop="description"> <el-form-item label="项目描述" prop="description">
<el-input <el-input
v-model="projectForm.description" v-model="projectForm.description"
@@ -122,8 +144,8 @@
</el-form-item> </el-form-item>
<el-form-item label="项目状态" prop="status"> <el-form-item label="项目状态" prop="status">
<el-radio-group v-model="projectForm.status"> <el-radio-group v-model="projectForm.status">
<el-radio label="1">启用</el-radio> <el-radio value="1">启用</el-radio>
<el-radio label="0">停用</el-radio> <el-radio value="0">停用</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
</el-form> </el-form>
@@ -136,7 +158,7 @@
</template> </template>
<script> <script>
import { getProjectList, addProject, updateProject, configureScript, publishScript, batchDeleteProject } from '@/api/project' import { getProjectList, getProjectById, addProject, updateProject, deleteProject, configureScript, publishScript, batchDeleteProject } from '@/api/project'
export default { export default {
name: 'Project', name: 'Project',
@@ -154,20 +176,22 @@ export default {
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
projectName: '', projectName: '',
storeId: '', dealershipId: '',
status: '' status: '',
groupName: ''
}, },
// 项目表单 // 项目表单
projectForm: { projectForm: {
id: null, id: null,
storeId: '', dealershipId: '',
projectName: '', projectName: '',
groupName: '',
description: '', description: '',
status: '1' status: '1' // 修复单选按钮组,使用字符串值而不是布尔值
}, },
// 表单验证规则 // 表单验证规则
projectRules: { projectRules: {
storeId: [ dealershipId: [
{ required: true, message: '请选择所属门店', trigger: 'change' } { required: true, message: '请选择所属门店', trigger: 'change' }
], ],
projectName: [ projectName: [
@@ -179,15 +203,24 @@ export default {
}, },
// 门店选项 // 门店选项
storeOptions: [ storeOptions: [
{ value: '1', label: '销售演示-奔驰' }, { value: 'DEAL001', label: '销售演示-奔驰' },
{ value: '2', label: '销售演示-上汽' }, { value: 'DEAL002', label: '销售演示-上汽' },
{ value: '3', label: '销售演示-比亚迪' } { value: 'DEAL003', label: '销售演示-比亚迪' }
] ]
} }
}, },
created() { created() {
this.getList() this.getList()
}, },
watch: {
// 监听项目表单状态值变化
'projectForm.status': {
handler(newVal, oldVal) {
console.log('状态值变化:', oldVal, '->', newVal)
},
immediate: true
}
},
methods: { methods: {
// 获取列表数据 // 获取列表数据
getList() { getList() {
@@ -202,81 +235,47 @@ export default {
}) })
getProjectList(params).then(response => { getProjectList(params).then(response => {
this.projectList = response.data.records || response.data console.log('API后端原始响应:', response) // 调试日志
this.total = response.data.total || response.data.length
// 检查响应结构 - 经过request拦截器处理后成功响应会包含code: 20000
if (response && response.code === 20000) {
// response.data 是后端返回的完整响应对象
const backendResponse = response
this.projectList = backendResponse.data || []
this.total = backendResponse.total || 0
// 更新分页信息
if (backendResponse.current) {
this.queryParams.pageNum = backendResponse.current
}
if (backendResponse.size) {
this.queryParams.pageSize = backendResponse.size
}
} else {
this.$message.error(response?.message || '获取项目列表失败')
this.projectList = []
this.total = 0
}
this.loading = false this.loading = false
}).catch(() => { }).catch(error => {
// 开发环境使用模拟数据 console.error('获取项目列表失败:', error)
// 开发环境使用模拟数据,字段与后端保持一致
this.projectList = [ this.projectList = [
{ {
id: 1, id: "1953688116294352897",
storeName: '销售演示-奔驰', dealershipId: "DEAL001",
projectName: '广丰项目', projectName: "广丰项目",
scriptVersion: 2, scriptVersion: 2,
scriptReleaseTime: '2025-08-01 13:07', scriptPublishTime: "2025-08-01T13:07:00",
salesCount: 5, salespersonCount: 5,
avgRecordingTime: 3.5, avgRecordingDuration: 3.5,
steps: '无', step: "进行中",
grouping: '默认', groupName: "默认分组",
createTime: '2025-07-15 10:30', createTime: "2025-07-15T10:30:00",
description: '广丰项目的详细描述信息', description: "广丰项目的详细描述信息",
status: '1' status: true
},
{
id: 2,
storeName: '销售演示-上汽',
projectName: '首次接待',
scriptVersion: 6,
scriptReleaseTime: '2025-07-28 15:20',
salesCount: 8,
avgRecordingTime: 2.8,
steps: '无',
grouping: '默认',
createTime: '2025-07-10 14:15',
description: '首次接待流程项目',
status: '1'
},
{
id: 3,
storeName: '销售演示-比亚迪',
projectName: '销售部',
scriptVersion: 17,
scriptReleaseTime: '2025-07-20 09:45',
salesCount: 12,
avgRecordingTime: 4.2,
steps: '无',
grouping: '默认',
createTime: '2025-07-05 16:20',
description: '销售部门管理项目',
status: '0'
},
{
id: 4,
storeName: '销售演示-奔驰',
projectName: 'E级车流程评测(GPT版)',
scriptVersion: 4,
scriptReleaseTime: '2025-08-05 11:30',
salesCount: 3,
avgRecordingTime: 5.1,
steps: '无',
grouping: '默认',
createTime: '2025-07-25 13:40',
description: 'E级车GPT评测流程',
status: '1'
},
{
id: 5,
storeName: '销售演示-上汽',
projectName: '客户跟进',
scriptVersion: 8,
scriptReleaseTime: '2025-07-30 14:15',
salesCount: 6,
avgRecordingTime: 3.8,
steps: '无',
grouping: '默认',
createTime: '2025-07-12 10:25',
description: '客户跟进管理项目',
status: '1'
} }
] ]
this.total = this.projectList.length this.total = this.projectList.length
@@ -297,8 +296,9 @@ export default {
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
projectName: '', projectName: '',
storeId: '', dealershipId: '',
status: '' status: '',
groupName: ''
} }
this.getList() this.getList()
}, },
@@ -326,20 +326,56 @@ export default {
this.isEdit = false this.isEdit = false
this.projectForm = { this.projectForm = {
id: null, id: null,
storeId: '', dealershipId: '',
projectName: '', projectName: '',
groupName: '',
description: '', description: '',
status: '1' status: '1' // 修复单选按钮组,使用字符串值而不是布尔值
} }
this.dialogVisible = true
// 使用$nextTick确保DOM更新完成后再显示对话框
this.$nextTick(() => {
this.dialogVisible = true
})
}, },
// 编辑项目 // 编辑项目
handleEdit(row) { handleEdit(row) {
this.dialogTitle = '编辑项目' this.dialogTitle = '编辑项目'
this.isEdit = true this.isEdit = true
this.projectForm = { ...row } this.loading = true
this.dialogVisible = true
getProjectById(row.id).then(response => {
console.log('编辑项目响应:', response) // 调试日志
if (response && response.code === 20000) {
const backendResponse = response
console.log('编辑项目数据,backendResponse.data :', backendResponse.data)
// 处理状态值转换
const projectData = { ...backendResponse.data }
if (typeof projectData.status === 'boolean') {
projectData.status = projectData.status ? '1' : '0'
}
this.projectForm = projectData
console.log('编辑项目数据projectForm :', this.projectForm)
console.log('编辑项目状态值:', this.projectForm.status)
// 使用$nextTick确保DOM更新完成后再显示对话框
this.$nextTick(() => {
this.dialogVisible = true
console.log('对话框显示后状态值:', this.projectForm.status)
})
} else {
this.$message.error(response?.message || '获取项目信息失败')
}
this.loading = false
}).catch(error => {
console.error('获取项目信息失败:', error)
this.$message.error('获取项目信息失败,请稍后重试')
this.loading = false
})
}, },
// 配置话术 // 配置话术
@@ -358,6 +394,36 @@ export default {
}) })
}, },
// 删除项目
handleDelete(row) {
this.$confirm(`确定要删除项目 "${row.projectName}" 吗?`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
deleteProject(row.id).then(response => {
console.log('删除项目响应:', response) // 调试日志
if (response && response.code === 20000) {
const backendResponse = response.data
if (backendResponse && backendResponse.success) {
this.$message.success(backendResponse.message || '删除成功')
this.getList()
} else {
this.$message.error(backendResponse?.message || '删除失败')
}
} else {
this.$message.error(response?.message || '删除失败')
}
}).catch(error => {
console.error('删除失败:', error)
this.$message.error('删除失败,请稍后重试')
})
}).catch(() => {
this.$message.info('已取消删除')
})
},
// 批量删除 // 批量删除
handleBatchDelete() { handleBatchDelete() {
if (this.selectedIds.length === 0) { if (this.selectedIds.length === 0) {
@@ -371,15 +437,23 @@ export default {
type: 'warning' type: 'warning'
}).then(() => { }).then(() => {
batchDeleteProject(this.selectedIds).then(response => { batchDeleteProject(this.selectedIds).then(response => {
if (response.code === 20000) { console.log('批量删除响应:', response) // 调试日志
this.$message.success('批量删除成功')
this.getList() if (response && response.code === 20000) {
const backendResponse = response.data
if (backendResponse && backendResponse.success) {
this.$message.success(backendResponse.message || '批量删除成功')
this.selectedIds = []
this.getList()
} else {
this.$message.error(backendResponse?.message || '批量删除失败')
}
} else { } else {
this.$message.error(response.message || '批量删除失败') this.$message.error(response?.message || '批量删除失败')
} }
}).catch(() => { }).catch(error => {
this.$message.success('批量删除成功') console.error('批量删除失败:', error)
this.getList() this.$message.error('批量删除失败,请稍后重试')
}) })
}).catch(() => { }).catch(() => {
this.$message.info('已取消删除') this.$message.info('已取消删除')
@@ -390,11 +464,33 @@ export default {
handleSubmit() { handleSubmit() {
this.$refs.projectForm.validate(valid => { this.$refs.projectForm.validate(valid => {
if (valid) { if (valid) {
// 处理状态值转换
const submitData = { ...this.projectForm }
if (typeof submitData.status === 'string') {
submitData.status = submitData.status === '1'
}
console.log('提交数据:', submitData) // 调试日志
const submitFunc = this.isEdit ? updateProject : addProject const submitFunc = this.isEdit ? updateProject : addProject
submitFunc(this.projectForm).then(() => { submitFunc(submitData).then(response => {
this.$message.success(this.isEdit ? '更新成功' : '添加成功') console.log('提交表单响应:', response) // 调试日志
this.dialogVisible = false
this.getList() if (response && response.code === 20000) {
const backendResponse = response.data
if (backendResponse && backendResponse.success) {
this.$message.success(backendResponse.message || (this.isEdit ? '更新成功' : '添加成功'))
this.dialogVisible = false
this.getList()
} else {
this.$message.error(backendResponse?.message || (this.isEdit ? '更新失败' : '添加失败'))
}
} else {
this.$message.error(response?.message || (this.isEdit ? '更新失败' : '添加失败'))
}
}).catch(error => {
console.error('提交失败:', error)
this.$message.error(this.isEdit ? '更新失败,请稍后重试' : '添加失败,请稍后重试')
}) })
} }
}) })
@@ -403,6 +499,18 @@ export default {
// 对话框关闭 // 对话框关闭
handleDialogClose() { handleDialogClose() {
this.$refs.projectForm.resetFields() this.$refs.projectForm.resetFields()
},
// 格式化时间
formatDateTime(timestamp) {
if (!timestamp) return ''
const date = new Date(timestamp)
const year = date.getFullYear()
const month = String(date.getMonth() + 1).padStart(2, '0')
const day = String(date.getDate()).padStart(2, '0')
const hours = String(date.getHours()).padStart(2, '0')
const minutes = String(date.getMinutes()).padStart(2, '0')
return `${year}-${month}-${day} ${hours}:${minutes}`
} }
} }
} }
@@ -424,5 +532,30 @@ export default {
.el-form-item { .el-form-item {
margin-bottom: 15px; margin-bottom: 15px;
} }
.el-button--text {
padding: 0;
margin-right: 10px;
}
.el-button--text:last-child {
margin-right: 0;
}
.dialog-footer {
text-align: right;
}
.el-table .el-button--text {
font-size: 12px;
}
.el-table .el-button--text:hover {
color: #409EFF;
}
.el-table .el-button--text.el-button--danger:hover {
color: #F56C6C;
}
</style> </style>