# Conflicts:
#	.env.base
dev-cl
caolin 2 weeks ago
commit 5740ca00d1
  1. 8
      src/api/home/reportSaler.js
  2. 9
      src/styles/index.scss
  3. 2
      src/views/Clue/Order/Comp/Reback.vue
  4. 3
      src/views/Clue/Pool/index.vue
  5. 295
      src/views/Home/Comp/DialogSalerReportDetail.vue
  6. 7
      src/views/Home/Index.vue
  7. 97
      src/views/Home/SalesReport.vue

@ -0,0 +1,8 @@
import request from '@/config/axios'
export const getInfo = async (data) => {
return await request.post({ url: '/admin-api/crm/sch-clue/sale/report/detail', data })
}
export const getList = async (data) => {
return await request.post({ url: '/admin-api/crm/sch-clue/sale/report', data })
}

@ -69,3 +69,12 @@
width: 100%;
}
}
.el-table {
.caret-wrapper {
width: 16px;
}
.sort-caret {
left: 2px;
}
}

@ -514,7 +514,7 @@ function handleSelectionChange(val) {
const batchAuditDialog = ref()
function batchAudit() {
if (batchIds.value.length) {
batchAuditDialog.value.open('aftersale', batchIds.value)
batchAuditDialog.value.open('feeback', batchIds.value)
} else {
message.info('请选择表格中需要审核的数据')
}

@ -92,6 +92,9 @@
快速新增
</el-button>
</div>
<div v-else-if="item.field == 'intentionStateName'">
<DictTag type="intention_state" :value="row.intentionState + ''" />
</div>
<div v-else-if="item.field == 'contact'">
<span>{{ row[item.field] }}</span>
<Icon class="ml-5px" icon="ep:phone" @click="makeCall(row.contact)" />

@ -1,14 +1,15 @@
<template>
<Dialog title="详情" v-model="dialogVisible" width="1000px">
<Dialog :title="dialogTitle" v-model="dialogVisible" width="1000px">
<el-form :model="searchForm" label-width="0" inline>
<el-form-item>
<el-date-picker
v-model="searchForm.period"
v-model="searchForm.consultTime"
type="daterange"
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
start-placeholder="选择日期"
end-placeholder="选择日期"
:clearable="false"
/>
</el-form-item>
<el-form-item>
@ -17,17 +18,19 @@
:data="props.sourceOptions"
:props="defaultProps"
check-strictly
clearable
node-key="sourceId"
placeholder="请选择渠道"
@change="sourceChange"
/>
</el-form-item>
<el-form-item>
<el-select v-model="searchForm.cartype" placeholder="选择驾照类型" clearable>
<el-select v-model="searchForm.licenseType" placeholder="选择驾照类型" clearable>
<el-option
v-for="item in props.cartypeOptions"
:key="item.value"
v-for="item in props.licenseTypeOptions"
:key="item.label"
:label="item.label"
:value="item.value"
:value="item.label"
/>
</el-select>
</el-form-item>
@ -42,17 +45,27 @@
<el-tab-pane label="详细数据" :name="1">
<el-table v-loading="loading" :data="tableList" border stripe>
<el-table-column prop="sourceName" label="渠道名称" width="100" fixed="left" />
<el-table-column prop="" label="新线索数" sortable />
<el-table-column prop="" label="成交数" sortable />
<el-table-column prop="" label="成交率" sortable />
<el-table-column prop="" label="成交周期" sortable />
<el-table-column prop="" label="毛利/单" sortable />
<el-table-column prop="" label="支出/单" sortable />
<el-table-column prop="" label="线索成本/条" sortable />
<el-table-column prop="" label="净利润/单" sortable />
<el-table-column label="总线索成本" prop="" sortable min-width="100" />
<el-table-column label="总支出" prop="" sortable min-width="100" />
<el-table-column label="总利润" prop="" sortable min-width="100" />
<el-table-column prop="newClueNumber" label="新线索数" sortable min-width="100" />
<el-table-column prop="signNumber" label="成交数" sortable min-width="100" />
<el-table-column prop="signRate" label="成交率" sortable min-width="100" />
<el-table-column prop="averageSignPeriod" label="成交周期" sortable min-width="100" />
<el-table-column
prop="grossProfitOfSingleSign"
label="毛利/单"
sortable
min-width="100"
/>
<el-table-column prop="payPriceOfSingleSign" label="支出/单" sortable min-width="100" />
<el-table-column prop="costOfSingleClue" label="线索成本/条" sortable min-width="100" />
<el-table-column
prop="netProfitOfSingleSign"
label="净利润/单"
sortable
min-width="100"
/>
<el-table-column label="总线索成本" prop="clueCostTotal" sortable min-width="100" />
<el-table-column label="总支出" prop="payPriceTotal" sortable min-width="100" />
<el-table-column label="总利润" prop="profitTotal" sortable min-width="100" />
</el-table>
</el-tab-pane>
<el-tab-pane label="图表展示" :name="2" lazy>
@ -82,11 +95,12 @@
<script setup name="DialogSalerReportDetail">
import { set } from 'lodash-es'
import * as reportApi from '@/api/home/reportSignRate'
import * as reportApi from '@/api/home/reportSaler'
import { getIntDictOptions } from '@/utils/dict'
import { removeNullField } from '@/utils'
const props = defineProps({
cartypeOptions: {
licenseTypeOptions: {
type: Array,
default: () => []
},
@ -103,18 +117,30 @@ const defaultProps = {
isLeaf: 'leaf'
}
const showChannel = ref([])
const intentionOptions = getIntDictOptions('intention_state')
const channelArr = computed(() => {
if (searchForm.value.sourceId) {
let arr =
props.sourceOptions.find((it) => it.sourceId == searchForm.value.sourceId)?.children || []
return arr.map((it) => it.sourceName)
} else {
return props.sourceOptions.map((it) => it.sourceName)
}
})
const dialogVisible = ref(false) //
const dialogTitle = ref('') //
const loading = ref(false)
const searchForm = ref({})
const showPane = ref(1)
const showChannel = ref([])
function handleReset() {
searchForm.value = {
nickname: undefined,
period: []
consultTime: []
}
}
@ -122,12 +148,11 @@ function handleReset() {
const open = async (info, queryInfo) => {
showPane.value = 1
dialogVisible.value = true
dialogTitle.value = `销售详情-【${info.nickname}`
searchForm.value.period = queryInfo.period
searchForm.value.cartype = queryInfo.cartype
showChannel.value = [...channelArr]
dialogTitle.value = info.nickname
searchForm.value = { ...queryInfo }
searchForm.value.userId = info.userId
handleSearch()
sourceChange()
}
defineExpose({ open }) // open
@ -136,31 +161,19 @@ const tableList = ref([])
async function handleSearch() {
loading.value = true
try {
setReportData()
const data = await reportApi.getList(removeNullField(searchForm.value))
tableList.value = data.map((item) => {
const count = item.monthClueSignRateReportList.reduce(
(pre, cur) => {
return {
signCount: pre.signCount + cur.clueSignNum,
clueCount: pre.clueCount + cur.followClueNum
}
},
{ signCount: 0, clueCount: 0 }
)
const rate = count.clueCount > 0 ? ((count.signCount * 100) / count.clueCount).toFixed(2) : 0
return {
...item,
totalRate: `${rate}%(${count.signCount}/${count.clueCount})`,
totalRateNum: rate
}
})
const params = { ...searchForm.value }
const data = await reportApi.getInfo(removeNullField(params))
tableList.value = data.sourceDetailVOList
setReportData(data)
} finally {
loading.value = false
}
}
const channelArr = ['美团', '高德', '线下渠道', '其他', '一点通', '抖音', '小红书', '宝典']
function sourceChange() {
handleSearch()
showChannel.value = channelArr.value
}
const echart1Option = ref({
title: {
@ -174,7 +187,9 @@ const echart1Option = ref({
},
polar: {},
legend: {
show: true
show: true,
type: 'scroll',
left: 100
}
})
@ -190,7 +205,9 @@ const echart2Option = ref({
},
polar: {},
legend: {
show: true
show: true,
type: 'scroll',
left: 100
}
})
@ -205,49 +222,45 @@ const echart3Option = ref({
{ name: '支出/单' },
{ name: '线索成本/条' },
{ name: '净利润/单' },
{ name: '线索总成本' },
{ name: '总支出' },
{ name: '总利润' }
{ name: '成交率' }
// { name: '线' },
// { name: '' },
// { name: '' }
]
},
legend: {
show: true
show: true,
right: '10px',
orient: 'vertical'
}
})
const setReportData = async () => {
const setReportData = async (data) => {
// const data = await HomeApi.getClueSignSignRate()
set(echart1Option.value, 'radiusAxis', {
type: 'category',
data: showChannel.value,
axisLabel: {
margin: 5,
fontSize: 10,
interval: 0
}
const channelClueArr = showChannel.value.sort((pre, cur) => {
const preArr = tableList.value.find((it) => it.sourceName == pre).clueIntentionNumVOList || []
const curArr = tableList.value.find((it) => it.sourceName == cur).clueIntentionNumVOList || []
const preCount = preArr.reduce((preVal, curVal) => preVal + curVal.intentionNum, 0)
const curCount = curArr.reduce((preVal, curVal) => preVal + curVal.intentionNum, 0)
return preCount - curCount
})
set(echart1Option.value, 'series', [
{
type: 'bar',
data: [2, 2, 3, 4, 10, 22, 43, 141],
coordinateSystem: 'polar',
name: '高意向A',
stack: 'a',
emphasis: {
focus: 'series'
},
label: {
show: true,
position: 'middle'
const arr1 = intentionOptions.map((intention) => {
const list = []
channelClueArr.map((item) => {
const row = tableList.value.find((it) => item == it.sourceName)
if (row) {
list.push(
row.clueIntentionNumVOList.find((it) => it.intentionState == intention.value).intentionNum
)
}
},
{
})
return {
type: 'bar',
data: [6, 6, 7, 8, 22, 14, 36, 128],
data: list,
coordinateSystem: 'polar',
name: '中意向B',
name: intention.label,
stack: 'a',
emphasis: {
focus: 'series'
@ -256,12 +269,31 @@ const setReportData = async () => {
show: true,
position: 'middle'
}
},
{
}
})
const channelSignArr = showChannel.value.sort((pre, cur) => {
const preArr = tableList.value.find((it) => it.sourceName == pre).signLicenseTypeNumVOList || []
const curArr = tableList.value.find((it) => it.sourceName == cur).signLicenseTypeNumVOList || []
const preCount = preArr.reduce((preVal, curVal) => preVal + curVal.licenseTypeNum, 0)
const curCount = curArr.reduce((preVal, curVal) => preVal + curVal.licenseTypeNum, 0)
return preCount - curCount
})
const arr2 = props.licenseTypeOptions.map((cartype) => {
const list = []
channelClueArr.map((item) => {
const row = tableList.value.find((it) => item == it.sourceName)
if (row) {
list.push(
row.signLicenseTypeNumVOList.find((it) => it.licenseType == cartype.label).licenseTypeNum
)
}
})
return {
type: 'bar',
data: [1, 4, 7, 11, 16, 42, 13, 42],
data: list,
coordinateSystem: 'polar',
name: '低意向C',
name: cartype.label,
stack: 'a',
emphasis: {
focus: 'series'
@ -271,75 +303,74 @@ const setReportData = async () => {
position: 'middle'
}
}
])
})
set(echart2Option.value, 'radiusAxis', {
set(echart1Option.value, 'radiusAxis', {
type: 'category',
data: showChannel.value,
data: channelClueArr,
axisLabel: {
margin: 5,
fontSize: 10,
interval: 0
}
})
set(echart2Option.value, 'series', [
{
type: 'bar',
data: [2, 2, 3, 4, 1, 11, 23, 41],
coordinateSystem: 'polar',
name: 'C1',
stack: 'a',
emphasis: {
focus: 'series'
},
label: {
show: true,
position: 'middle'
}
},
{
type: 'bar',
data: [6, 6, 7, 8, 12, 14, 6, 28],
coordinateSystem: 'polar',
name: 'C2',
stack: 'a',
emphasis: {
focus: 'series'
},
label: {
show: true,
position: 'middle'
}
},
{
type: 'bar',
data: [1, 4, 7, 1, 6, 2, 23, 14],
coordinateSystem: 'polar',
name: 'D/E/F',
stack: 'a',
emphasis: {
focus: 'series'
},
label: {
show: true,
position: 'middle'
}
set(echart1Option.value, 'series', arr1)
set(echart2Option.value, 'radiusAxis', {
type: 'category',
data: channelSignArr,
axisLabel: {
margin: 5,
fontSize: 10,
interval: 0
}
])
})
set(echart2Option.value, 'series', arr2)
const { personDetail, averageDetail } = data
set(echart3Option.value, 'series', [
{
type: 'radar',
data: [
{
value: [5.5, 1000, 200, 51, 666, 12345, 1245, 65478],
name: '平均',
value: [
averageDetail.averageSignPeriod,
averageDetail.grossProfitOfSingleSign,
averageDetail.payPriceOfSingleSign,
averageDetail.costOfSingleClue,
averageDetail.netProfitOfSingleSign,
averageDetail.signRate
// averageDetail.clueCostTotal,
// averageDetail.payPriceTotal,
// averageDetail.profitTotal
],
name: '平均水平',
lineStyle: {
type: 'dashed'
},
areaStyle: {
color: 'rgba(0, 191, 255, 0.6)'
},
label: {
show: true
}
},
{
value: [15, 800, 300, 66, 551, 23456, 2123, 25698],
name: '当前',
value: [
personDetail.averageSignPeriod,
personDetail.grossProfitOfSingleSign,
personDetail.payPriceOfSingleSign,
personDetail.costOfSingleClue,
personDetail.netProfitOfSingleSign,
averageDetail.signRate
// personDetail.clueCostTotal,
// personDetail.payPriceTotal,
// personDetail.profitTotal
],
name: dialogTitle.value,
areaStyle: {
color: 'rgba(255, 145, 124, 0.4)'
},
label: {
show: true
}

@ -113,9 +113,10 @@
</template>
<el-skeleton :loading="loading" animated>
<el-table :data="signList" size="small">
<el-table-column type="index" />
<el-table-column prop="username" label="姓名" width="100" />
<el-table-column prop="followNum" label="成交数量" width="70" />
<el-table-column type="index" width="40" />
<el-table-column prop="username" label="姓名" width="80" />
<el-table-column prop="followNum" label="成交数量" width="90" sortable />
<el-table-column prop="signPrice" label="成交额" min-width="90" sortable />
<el-table-column prop="deptName" label="所属组织" width="150" />
</el-table>
</el-skeleton>

@ -3,12 +3,13 @@
<el-form :model="searchForm" label-width="0" inline>
<el-form-item>
<el-date-picker
v-model="searchForm.period"
v-model="searchForm.consultTime"
type="daterange"
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
start-placeholder="选择日期"
end-placeholder="选择日期"
:clearable="false"
/>
</el-form-item>
<el-form-item>
@ -20,17 +21,18 @@
:data="sourceOptions"
:props="defaultProps"
check-strictly
clearable
node-key="sourceId"
placeholder="请选择渠道"
/>
</el-form-item>
<el-form-item>
<el-select v-model="searchForm.cartype" placeholder="选择驾照类型" clearable>
<el-select v-model="searchForm.licenseType" placeholder="选择驾照类型" clearable>
<el-option
v-for="item in cartypeOptions"
:key="item.value"
v-for="item in licenseTypeOptions"
:key="item.label"
:label="item.label"
:value="item.value"
:value="item.label"
/>
</el-select>
</el-form-item>
@ -45,33 +47,33 @@
<el-table-column type="index" width="50" fixed="left" />
<el-table-column prop="nickname" label="姓名" width="80" fixed="left">
<template #default="{ row }">
<el-button type="primary" style="padding: 0" text @click="handleDetail">{{
<el-button type="primary" style="padding: 0" text @click="handleDetail(row)">{{
row.nickname
}}</el-button>
</template>
</el-table-column>
<el-table-column prop="" sortable min-width="100">
<el-table-column prop="newClueNumber" sortable min-width="100">
<template #header>
<Tooltip message="咨询日期在所选周期内的线索总数" />
<span>新线索数</span>
</template>
</el-table-column>
<el-table-column label="成交数" prop="" sortable min-width="100">
<el-table-column label="成交数" prop="signNumber" sortable min-width="100">
<template #header>
<Tooltip message="成交日期在所选周期内的成交数" />
<span>成交数</span>
</template>
</el-table-column>
<el-table-column label="成交率" prop="" sortable min-width="100" />
<el-table-column label="跟进数/日" prop="" sortable min-width="100" />
<el-table-column label="成交数/日" prop="" sortable min-width="100" />
<el-table-column label="平均成交周期" prop="" sortable min-width="100">
<el-table-column label="成交率" prop="signRate" sortable min-width="100" />
<el-table-column label="跟进数/日" prop="dayFollowNumber" sortable min-width="100" />
<el-table-column label="成交数/日" prop="daySignNumber" sortable min-width="100" />
<el-table-column label="平均成交周期" prop="averageSignPeriod" sortable min-width="100">
<template #header>
<Tooltip message="平均每条成交的线索,从咨询开始到成交所需要的天数" />
<span>平均成交周期</span>
</template>
</el-table-column>
<el-table-column prop="" sortable min-width="100">
<el-table-column prop="grossProfitOfSingleSign" sortable min-width="100">
<template #header>
<Tooltip
message="平均每笔成交订单的公司利润【按照登记,不按审核到账】=总公司利润/总成交数"
@ -79,7 +81,7 @@
<span>毛利/</span>
</template>
</el-table-column>
<el-table-column prop="" sortable min-width="100">
<el-table-column prop="payPriceOfSingleSign" sortable min-width="100">
<template #header>
<Tooltip
message="平均每笔成交订单的额外支出(返费等)【按照登记,不按审核到账】=总支出/总成交数"
@ -87,42 +89,52 @@
<span>支出/</span>
</template>
</el-table-column>
<el-table-column prop="" sortable min-width="100">
<el-table-column prop="costOfSingleClue" sortable min-width="100">
<template #header>
<Tooltip message="平均每条线索的成本=总线索成本/新线索条数" />
<span>线索成本/</span>
</template>
</el-table-column>
<el-table-column prop="" sortable min-width="100">
<el-table-column prop="netProfitOfSingleSign" sortable min-width="100">
<template #header>
<Tooltip message="=(总公司利润-总支出-总线索成本)/总成交数" />
<span>净利润/</span>
</template>
</el-table-column>
<el-table-column label="总线索成本" prop="" sortable min-width="100" />
<el-table-column label="总支出" prop="" sortable min-width="100" />
<el-table-column label="总利润" prop="" sortable min-width="100" />
<el-table-column prop="" sortable min-width="100">
<el-table-column label="总线索成本" prop="clueCostTotal" sortable min-width="100" />
<el-table-column label="总支出" prop="payPriceTotal" sortable min-width="100" />
<el-table-column label="总利润" prop="profitTotal" sortable min-width="100" />
<el-table-column prop="efficiency" sortable min-width="100">
<template #header>
<Tooltip message="=总利润/(总成本+总支出)" />
<span>能效</span>
</template>
</el-table-column>
<el-table-column label="撞单数" prop="" sortable min-width="100" />
<el-table-column label="撞单成交数" prop="" sortable min-width="100" />
<el-table-column label="撞单数" prop="repeatClueNum" sortable min-width="100" />
<el-table-column label="撞单成交数" prop="repeatClueSignNum" sortable min-width="100" />
</el-table>
<DialogSalerReportDetail ref="SalerDetailDialog" />
<DialogSalerReportDetail
:licenseTypeOptions="licenseTypeOptions"
:source-options="sourceOptions"
ref="SalerDetailDialog"
/>
</ContentWrap>
</template>
<script setup name="SalesReport">
import DialogSalerReportDetail from './Comp/DialogSalerReportDetail.vue'
import * as reportApi from '@/api/home/reportSignRate'
import * as reportApi from '@/api/home/reportSaler'
import { getSimpleSourceList as getResourceOptions } from '@/api/clue/source'
import { removeNullField } from '@/utils'
import { formatDate } from '@/utils/formatTime'
import { handleTree } from '@/utils/tree'
import { getIntDictOptions } from '@/utils/dict'
onMounted(() => {
getOptions()
handleReset()
handleSearch()
})
@ -135,14 +147,16 @@ const defaultProps = {
}
const sourceOptions = ref([])
const cartypeOptions = ref([])
const licenseTypeOptions = ref([])
const searchForm = ref({})
function handleReset() {
const year = new Date().getFullYear()
const month = new Date().getMonth() + 1
searchForm.value = {
nickname: undefined,
period: []
consultTime: [`${year}-${month}-01`, formatDate(new Date())]
}
}
@ -152,23 +166,7 @@ async function handleSearch() {
loading.value = true
try {
const data = await reportApi.getList(removeNullField(searchForm.value))
tableList.value = data.map((item) => {
const count = item.monthClueSignRateReportList.reduce(
(pre, cur) => {
return {
signCount: pre.signCount + cur.clueSignNum,
clueCount: pre.clueCount + cur.followClueNum
}
},
{ signCount: 0, clueCount: 0 }
)
const rate = count.clueCount > 0 ? ((count.signCount * 100) / count.clueCount).toFixed(2) : 0
return {
...item,
totalRate: `${rate}%(${count.signCount}/${count.clueCount})`,
totalRateNum: rate
}
})
tableList.value = data
} finally {
loading.value = false
}
@ -179,13 +177,12 @@ function handleDetail(info) {
SalerDetailDialog.value.open(info, searchForm.value)
}
// function monthSort(pre, cur, idx) {
// return (
// Number(pre.monthClueSignRateReportList[idx].rate) -
// Number(cur.monthClueSignRateReportList[idx].rate)
// )
// }
function getOptions() {
getResourceOptions().then((data) => {
sourceOptions.value = handleTree(data, 'sourceId')
})
licenseTypeOptions.value = getIntDictOptions('license_type')
}
</script>
<style lang="scss" scoped></style>

Loading…
Cancel
Save