!433 CRM: 修复客户导入、销售漏斗。上传组件的文件列表给拓展一个下载 。
Merge pull request !433 from puhui999/dev-crm
This commit is contained in:
commit
c96902d622
@ -6,11 +6,11 @@
|
||||
"private": false,
|
||||
"scripts": {
|
||||
"i": "pnpm install",
|
||||
"dev": "vite --mode local-dev",
|
||||
"dev-server": "vite --mode dev",
|
||||
"local-dev": "vite --mode local-dev",
|
||||
"dev": "vite --mode dev",
|
||||
"ts:check": "vue-tsc --noEmit",
|
||||
"build:local-dev": "node --max_old_space_size=8192 ./node_modules/vite/bin/vite.js build --mode local-dev",
|
||||
"build:dev": "node --max_old_space_size=8192 ./node_modules/vite/bin/vite.js build --mode local-dev",
|
||||
"build:dev": "node --max_old_space_size=8192 ./node_modules/vite/bin/vite.js build --mode dev",
|
||||
"build:test": "node --max_old_space_size=8192 ./node_modules/vite/bin/vite.js build --mode test",
|
||||
"build:stage": "node --max_old_space_size=8192 ./node_modules/vite/bin/vite.js build --mode stage",
|
||||
"build:prod": "node --max_old_space_size=8192 ./node_modules/vite/bin/vite.js build --mode prod",
|
||||
|
@ -32,6 +32,25 @@
|
||||
格式为 <b style="color: #f56c6c">{{ fileType.join('/') }}</b> 的文件
|
||||
</div>
|
||||
</template>
|
||||
<template #file="row">
|
||||
<div class="flex items-center">
|
||||
<span>{{ row.file.name }}</span>
|
||||
<div class="ml-10px">
|
||||
<el-link
|
||||
:href="row.file.url"
|
||||
:underline="false"
|
||||
download
|
||||
target="_blank"
|
||||
type="primary"
|
||||
>
|
||||
下载
|
||||
</el-link>
|
||||
</div>
|
||||
<div class="ml-10px">
|
||||
<el-button link type="danger" @click="handleRemove(row.file)"> 删除</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-upload>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -2,23 +2,24 @@ import * as echarts from 'echarts/core'
|
||||
|
||||
import {
|
||||
BarChart,
|
||||
FunnelChart,
|
||||
GaugeChart,
|
||||
LineChart,
|
||||
PieChart,
|
||||
MapChart,
|
||||
PictorialBarChart,
|
||||
RadarChart,
|
||||
GaugeChart
|
||||
PieChart,
|
||||
RadarChart
|
||||
} from 'echarts/charts'
|
||||
|
||||
import {
|
||||
TitleComponent,
|
||||
TooltipComponent,
|
||||
GridComponent,
|
||||
PolarComponent,
|
||||
AriaComponent,
|
||||
ParallelComponent,
|
||||
GridComponent,
|
||||
LegendComponent,
|
||||
ParallelComponent,
|
||||
PolarComponent,
|
||||
TitleComponent,
|
||||
ToolboxComponent,
|
||||
TooltipComponent,
|
||||
VisualMapComponent
|
||||
} from 'echarts/components'
|
||||
|
||||
@ -41,7 +42,8 @@ echarts.use([
|
||||
CanvasRenderer,
|
||||
PictorialBarChart,
|
||||
RadarChart,
|
||||
GaugeChart
|
||||
GaugeChart,
|
||||
FunnelChart
|
||||
])
|
||||
|
||||
export default echarts
|
||||
|
@ -1,16 +1,24 @@
|
||||
<!-- 客户导入窗口 -->
|
||||
<template>
|
||||
<Dialog v-model="dialogVisible" title="客户导入" width="400">
|
||||
<div class="flex items-center my-10px">
|
||||
<span class="mr-10px">负责人</span>
|
||||
<el-select v-model="ownerUserId" class="!w-240px" clearable>
|
||||
<el-option
|
||||
v-for="item in userOptions"
|
||||
:key="item.id"
|
||||
:label="item.nickname"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
<el-upload
|
||||
ref="uploadRef"
|
||||
v-model:file-list="fileList"
|
||||
:auto-upload="false"
|
||||
:disabled="formLoading"
|
||||
:headers="uploadHeaders"
|
||||
:limit="1"
|
||||
:on-error="submitFormError"
|
||||
:on-exceed="handleExceed"
|
||||
:on-success="submitFormSuccess"
|
||||
accept=".xlsx, .xls"
|
||||
action="none"
|
||||
drag
|
||||
@ -43,9 +51,10 @@
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import * as CustomerApi from '@/api/crm/customer'
|
||||
import { getAccessToken, getTenantId } from '@/utils/auth'
|
||||
import download from '@/utils/download'
|
||||
import type { UploadUserFile } from 'element-plus'
|
||||
import * as UserApi from '@/api/system/user'
|
||||
import { useUserStore } from '@/store/modules/user'
|
||||
|
||||
defineOptions({ name: 'SystemUserImportForm' })
|
||||
|
||||
@ -54,15 +63,18 @@ const message = useMessage() // 消息弹窗
|
||||
const dialogVisible = ref(false) // 弹窗的是否展示
|
||||
const formLoading = ref(false) // 表单的加载中
|
||||
const uploadRef = ref()
|
||||
const uploadHeaders = ref() // 上传 Header 头
|
||||
const fileList = ref<UploadUserFile[]>([]) // 文件列表
|
||||
const updateSupport = ref(false) // 是否更新已经存在的客户数据
|
||||
const ownerUserId = ref<undefined | number>() // 负责人编号
|
||||
const userOptions = ref<UserApi.UserVO[]>([]) // 用户列表
|
||||
|
||||
/** 打开弹窗 */
|
||||
const open = () => {
|
||||
const open = async () => {
|
||||
dialogVisible.value = true
|
||||
fileList.value = []
|
||||
resetForm()
|
||||
await resetForm()
|
||||
// 获得用户列表
|
||||
userOptions.value = await UserApi.getSimpleUserList()
|
||||
ownerUserId.value = useUserStore().getUser.id
|
||||
}
|
||||
defineExpose({ open }) // 提供 open 方法,用于打开弹窗
|
||||
|
||||
@ -72,17 +84,20 @@ const submitForm = async () => {
|
||||
message.error('请上传文件')
|
||||
return
|
||||
}
|
||||
// 提交请求
|
||||
uploadHeaders.value = {
|
||||
Authorization: 'Bearer ' + getAccessToken(),
|
||||
'tenant-id': getTenantId()
|
||||
}
|
||||
|
||||
formLoading.value = true
|
||||
try {
|
||||
const formData = new FormData()
|
||||
formData.append('updateSupport', updateSupport.value)
|
||||
formData.append('file', fileList.value[0].raw)
|
||||
// TODO @芋艿:后面是不是可以采用这种形式,去掉 uploadHeaders
|
||||
await CustomerApi.handleImport(formData)
|
||||
formData.append('updateSupport', String(updateSupport.value))
|
||||
formData.append('file', fileList.value[0].raw as Blob)
|
||||
formData.append('ownerUserId', String(ownerUserId.value))
|
||||
const res = await CustomerApi.handleImport(formData)
|
||||
submitFormSuccess(res)
|
||||
} catch {
|
||||
submitFormError()
|
||||
} finally {
|
||||
formLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
/** 文件上传成功 */
|
||||
@ -108,6 +123,8 @@ const submitFormSuccess = (response: any) => {
|
||||
text += '< ' + customerName + ': ' + data.failureCustomerNames[customerName] + ' >'
|
||||
}
|
||||
message.alert(text)
|
||||
formLoading.value = false
|
||||
dialogVisible.value = false
|
||||
// 发送操作成功的事件
|
||||
emits('success')
|
||||
}
|
||||
@ -119,9 +136,12 @@ const submitFormError = (): void => {
|
||||
}
|
||||
|
||||
/** 重置表单 */
|
||||
const resetForm = () => {
|
||||
const resetForm = async () => {
|
||||
// 重置上传状态和文件
|
||||
formLoading.value = false
|
||||
fileList.value = []
|
||||
updateSupport.value = false
|
||||
ownerUserId.value = undefined
|
||||
await nextTick()
|
||||
uploadRef.value?.clearFiles()
|
||||
}
|
||||
|
||||
|
@ -79,7 +79,7 @@
|
||||
<Icon class="mr-5px" icon="ep:search" />
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button @click="resetQuery(undefined)">
|
||||
<el-button @click="resetQuery">
|
||||
<Icon class="mr-5px" icon="ep:refresh" />
|
||||
重置
|
||||
</el-button>
|
||||
@ -113,7 +113,7 @@
|
||||
<el-tab-pane label="下属负责的" name="3" />
|
||||
</el-tabs>
|
||||
<el-table v-loading="loading" :data="list" :show-overflow-tooltip="true" :stripe="true">
|
||||
<el-table-column align="center" label="客户名称" fixed="left" prop="name" width="160">
|
||||
<el-table-column align="center" fixed="left" label="客户名称" prop="name" width="160">
|
||||
<template #default="scope">
|
||||
<el-link :underline="false" type="primary" @click="openDetail(scope.row.id)">
|
||||
{{ scope.row.name }}
|
||||
@ -125,9 +125,9 @@
|
||||
<dict-tag :type="DICT_TYPE.CRM_CUSTOMER_SOURCE" :value="scope.row.source" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="手机" align="center" prop="mobile" width="120" />
|
||||
<el-table-column label="电话" align="center" prop="telephone" width="130" />
|
||||
<el-table-column label="邮箱" align="center" prop="email" width="180" />
|
||||
<el-table-column align="center" label="手机" prop="mobile" width="120" />
|
||||
<el-table-column align="center" label="电话" prop="telephone" width="130" />
|
||||
<el-table-column align="center" label="邮箱" prop="email" width="180" />
|
||||
<el-table-column align="center" label="客户级别" prop="level" width="135">
|
||||
<template #default="scope">
|
||||
<dict-tag :type="DICT_TYPE.CRM_CUSTOMER_LEVEL" :value="scope.row.level" />
|
||||
@ -164,7 +164,7 @@
|
||||
width="180px"
|
||||
/>
|
||||
<el-table-column align="center" label="最后跟进记录" prop="contactLastContent" width="200" />
|
||||
<el-table-column label="地址" align="center" prop="detailAddress" width="180" />
|
||||
<el-table-column align="center" label="地址" prop="detailAddress" width="180" />
|
||||
<el-table-column align="center" label="距离进入公海天数" prop="poolDay" width="140">
|
||||
<template #default="scope"> {{ scope.row.poolDay }} 天</template>
|
||||
</el-table-column>
|
||||
@ -254,7 +254,7 @@ const activeName = ref('1') // 列表 tab
|
||||
|
||||
/** tab 切换 */
|
||||
const handleTabClick = (tab: TabsPaneContext) => {
|
||||
queryParams.sceneType = tab.paneName
|
||||
queryParams.sceneType = tab.paneName as string
|
||||
handleQuery()
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user