admin/smartDriveEEFront
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

19
src/api/project.js
View File

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

2
src/router/index.js
View File

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

363
src/views/project/index.vue
View File

@@ -4,7 +4,7 @@
<el-card class="filter-container" shadow="never">
<el-form ref="queryForm" :model="queryParams" :inline="true" label-width="100px">
<el-form-item label="选择门店">
<el-select v-model="queryParams.storeId" placeholder="请选择所属门店" clearable>
<el-select v-model="queryParams.dealershipId" placeholder="请选择所属门店" clearable>
<el-option
v-for="item in storeOptions"
:key="item.value"
@@ -30,6 +30,15 @@
</el-select>
</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-button type="primary" icon="el-icon-search" @click="handleQuery">筛选</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 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="scriptVersion" min-width="100" />
<el-table-column label="话术发布时间" prop="scriptReleaseTime" sortable min-width="150" />
<el-table-column label="销售人员数量" prop="salesCount" min-width="120" />
<el-table-column label="平均录音时长(分钟)" prop="avgRecordingTime" min-width="150" />
<el-table-column label="步骤" prop="steps" min-width="100" />
<el-table-column label="分组" prop="grouping" min-width="100" />
<el-table-column label="创建时间" prop="createTime" sortable min-width="150" />
<el-table-column label="话术发布时间" prop="scriptPublishTime" sortable min-width="150">
<template slot-scope="scope">
{{ formatDateTime(scope.row.scriptPublishTime) }}
</template>
</el-table-column>
<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="status" sortable min-width="100">
<template slot-scope="scope">
<el-tag :type="scope.row.status === '1' ? 'success' : 'danger'">
{{ scope.row.status === '1' ? '启用' : '停用' }}
<el-tag :type="scope.row.status === true || scope.row.status === '1' ? 'success' : 'danger'">
{{ scope.row.status === true || scope.row.status === '1' ? '启用' : '停用' }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="200" fixed="right">
<el-table-column label="操作" width="280" fixed="right">
<template slot-scope="scope">
<el-button type="text" @click="handleConfigureScript(scope.row)">配置话术</el-button>
<el-button type="text" @click="handlePublishScript(scope.row)">发布话术</el-button>
<el-button type="text" size="small" @click="handleEdit(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>
</el-table-column>
</el-table>
@@ -99,8 +118,8 @@
@close="handleDialogClose"
>
<el-form ref="projectForm" :model="projectForm" :rules="projectRules" label-width="100px">
<el-form-item label="所属门店" prop="storeId">
<el-select v-model="projectForm.storeId" placeholder="请选择所属门店" style="width: 100%">
<el-form-item label="所属门店" prop="dealershipId">
<el-select v-model="projectForm.dealershipId" placeholder="请选择所属门店" style="width: 100%">
<el-option
v-for="item in storeOptions"
:key="item.value"
@@ -112,6 +131,9 @@
<el-form-item label="项目名称" prop="projectName">
<el-input v-model="projectForm.projectName" placeholder="请输入项目名称" />
</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-input
v-model="projectForm.description"
@@ -122,8 +144,8 @@
</el-form-item>
<el-form-item label="项目状态" prop="status">
<el-radio-group v-model="projectForm.status">
<el-radio label="1">启用</el-radio>
<el-radio label="0">停用</el-radio>
<el-radio value="1">启用</el-radio>
<el-radio value="0">停用</el-radio>
</el-radio-group>
</el-form-item>
</el-form>
@@ -136,7 +158,7 @@
</template>
<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 {
name: 'Project',
@@ -154,20 +176,22 @@ export default {
pageNum: 1,
pageSize: 10,
projectName: '',
storeId: '',
status: ''
dealershipId: '',
status: '',
groupName: ''
},
// 项目表单
projectForm: {
id: null,
storeId: '',
dealershipId: '',
projectName: '',
groupName: '',
description: '',
status: '1'
status: '1' // 修复单选按钮组，使用字符串值而不是布尔值
},
// 表单验证规则
projectRules: {
storeId: [
dealershipId: [
{ required: true, message: '请选择所属门店', trigger: 'change' }
],
projectName: [
@@ -179,15 +203,24 @@ export default {
},
// 门店选项
storeOptions: [
{ value: '1', label: '销售演示-奔驰' },
{ value: '2', label: '销售演示-上汽' },
{ value: '3', label: '销售演示-比亚迪' }
{ value: 'DEAL001', label: '销售演示-奔驰' },
{ value: 'DEAL002', label: '销售演示-上汽' },
{ value: 'DEAL003', label: '销售演示-比亚迪' }
]
}
},
created() {
this.getList()
},
watch: {
// 监听项目表单状态值变化
'projectForm.status': {
handler(newVal, oldVal) {
console.log('状态值变化:', oldVal, '->', newVal)
},
immediate: true
}
},
methods: {
// 获取列表数据
getList() {
@@ -202,81 +235,47 @@ export default {
})
getProjectList(params).then(response => {
this.projectList = response.data.records || response.data
this.total = response.data.total || response.data.length
console.log('API后端原始响应:', response) // 调试日志
// 检查响应结构 - 经过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
}).catch(() => {
// 开发环境使用模拟数据
}).catch(error => {
console.error('获取项目列表失败:', error)
// 开发环境使用模拟数据，字段与后端保持一致
this.projectList = [
{
id: 1,
storeName: '销售演示-奔驰',
projectName: '广丰项目',
id: "1953688116294352897",
dealershipId: "DEAL001",
projectName: "广丰项目",
scriptVersion: 2,
scriptReleaseTime: '2025-08-01 13:07',
salesCount: 5,
avgRecordingTime: 3.5,
steps: '无',
grouping: '默认',
createTime: '2025-07-15 10:30',
description: '广丰项目的详细描述信息',
status: '1'
},
{
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'
scriptPublishTime: "2025-08-01T13:07:00",
salespersonCount: 5,
avgRecordingDuration: 3.5,
step: "进行中",
groupName: "默认分组",
createTime: "2025-07-15T10:30:00",
description: "广丰项目的详细描述信息",
status: true
}
]
this.total = this.projectList.length
@@ -297,8 +296,9 @@ export default {
pageNum: 1,
pageSize: 10,
projectName: '',
storeId: '',
status: ''
dealershipId: '',
status: '',
groupName: ''
}
this.getList()
},
@@ -326,20 +326,56 @@ export default {
this.isEdit = false
this.projectForm = {
id: null,
storeId: '',
dealershipId: '',
projectName: '',
groupName: '',
description: '',
status: '1'
status: '1' // 修复单选按钮组，使用字符串值而不是布尔值
}
this.dialogVisible = true
// 使用$nextTick确保DOM更新完成后再显示对话框
this.$nextTick(() => {
this.dialogVisible = true
})
},
// 编辑项目
handleEdit(row) {
this.dialogTitle = '编辑项目'
this.isEdit = true
this.projectForm = { ...row }
this.dialogVisible = true
this.loading = 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() {
if (this.selectedIds.length === 0) {
@@ -371,15 +437,23 @@ export default {
type: 'warning'
}).then(() => {
batchDeleteProject(this.selectedIds).then(response => {
if (response.code === 20000) {
this.$message.success('批量删除成功')
this.getList()
console.log('批量删除响应:', response) // 调试日志
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 {
this.$message.error(response.message || '批量删除失败')
this.$message.error(response?.message || '批量删除失败')
}
}).catch(() => {
this.$message.success('批量删除成功')
this.getList()
}).catch(error => {
console.error('批量删除失败:', error)
this.$message.error('批量删除失败，请稍后重试')
})
}).catch(() => {
this.$message.info('已取消删除')
@@ -390,11 +464,33 @@ export default {
handleSubmit() {
this.$refs.projectForm.validate(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
submitFunc(this.projectForm).then(() => {
this.$message.success(this.isEdit ? '更新成功' : '添加成功')
this.dialogVisible = false
this.getList()
submitFunc(submitData).then(response => {
console.log('提交表单响应:', response) // 调试日志
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() {
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 {
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>