Compare commits
21 Commits
dev-report
...
main
Author | SHA1 | Date |
---|---|---|
qsh | 72341a96a5 | 5 days ago |
qsh | 9cdfa01d33 | 1 week ago |
qsh | af84640a4b | 1 week ago |
qsh | 15179707d9 | 1 week ago |
qsh | fe4270178f | 1 week ago |
qsh | cd22e26589 | 2 weeks ago |
qsh | b475af8dd3 | 2 weeks ago |
qsh | 3022106428 | 2 weeks ago |
qsh | d4641eacb5 | 2 weeks ago |
qsh | d3b4a360dd | 2 weeks ago |
qsh | 91a509d49d | 2 weeks ago |
qsh | 7e771a89e4 | 2 weeks ago |
qsh | 24e540f151 | 3 weeks ago |
qsh | 0ef7703f7d | 3 weeks ago |
qsh | fa39fd8492 | 3 weeks ago |
qsh | b8bc124162 | 3 weeks ago |
qsh | e1036fd2c3 | 3 weeks ago |
qsh | 014bb14170 | 3 weeks ago |
qsh | eaaceb9595 | 4 weeks ago |
qsh | 1ab365efae | 4 weeks ago |
qiushanhe | 0f04d7e80c | 1 month ago |
@ -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 }) |
||||||
|
} |
@ -0,0 +1,33 @@ |
|||||||
|
import request from '@/config/axios' |
||||||
|
// 查询列表
|
||||||
|
export const getSupplierPage = async (params) => { |
||||||
|
return await request.get({ url: '/admin-api/crm/erp-supplier/page', params }) |
||||||
|
} |
||||||
|
|
||||||
|
export const getSupplierSimpleList = async (params) => { |
||||||
|
return await request.get({ url: '/admin-api/crm/erp-supplier/simple-list', params }) |
||||||
|
} |
||||||
|
|
||||||
|
// 查询详情
|
||||||
|
export const getSupplier = async (id) => { |
||||||
|
return await request.get({ url: '/admin-api/crm/erp-supplier/get?id=' + id }) |
||||||
|
} |
||||||
|
|
||||||
|
// 新增
|
||||||
|
export const createSupplier = async (data) => { |
||||||
|
return await request.post({ |
||||||
|
url: '/admin-api/crm/erp-supplier/create', |
||||||
|
data: data, |
||||||
|
isSubmitForm: true |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
// 修改
|
||||||
|
export const updateSupplier = async (params) => { |
||||||
|
return await request.put({ url: '/admin-api/crm/erp-supplier/update', data: params }) |
||||||
|
} |
||||||
|
|
||||||
|
// 删除
|
||||||
|
export const deleteSupplier = async (id) => { |
||||||
|
return await request.delete({ url: '/admin-api/crm/erp-supplier/delete?id=' + id }) |
||||||
|
} |
@ -0,0 +1,130 @@ |
|||||||
|
<template> |
||||||
|
<Dialog title="添加产品" v-model="show" width="800px"> |
||||||
|
<el-form :model="form" ref="formRef" :rules="rules" label-width="80px"> |
||||||
|
<el-row :gutter="20"> |
||||||
|
<el-col :span="12" :offset="0"> |
||||||
|
<el-form-item label="成交产品" prop="productId"> |
||||||
|
<el-select |
||||||
|
v-model="form.productId" |
||||||
|
placeholder="选择成交产品" |
||||||
|
filterable |
||||||
|
@change="form.specsId = undefined" |
||||||
|
> |
||||||
|
<el-option |
||||||
|
v-for="item in prodOptions" |
||||||
|
:key="item.productId" |
||||||
|
:label="item.productName" |
||||||
|
:value="item.productId" |
||||||
|
/> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="12" :offset="0"> |
||||||
|
<el-form-item label="产品规格" prop="specsId"> |
||||||
|
<el-select |
||||||
|
v-model="form.specsId" |
||||||
|
placeholder="选择规格" |
||||||
|
filterable |
||||||
|
:disabled="!form.productId" |
||||||
|
> |
||||||
|
<el-option |
||||||
|
v-for="item in specsOptions(form.productId)" |
||||||
|
:key="item.specsId" |
||||||
|
:label="item.specsName" |
||||||
|
:value="item.specsId" |
||||||
|
/> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="12" :offset="0"> |
||||||
|
<el-form-item label="成交数量" prop="signNum"> |
||||||
|
<el-input-number v-model="form.signNum" :min="1" :controls="false" /> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="12" :offset="0"> |
||||||
|
<el-form-item label="生产状态" prop="isProduced"> |
||||||
|
<el-radio-group v-model="form.isProduced"> |
||||||
|
<el-radio :label="0">待生产</el-radio> |
||||||
|
<el-radio :label="1">已生产</el-radio> |
||||||
|
</el-radio-group> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="24" :offset="0"> |
||||||
|
<el-form-item label="备注" prop="remark"> |
||||||
|
<el-input |
||||||
|
type="textarea" |
||||||
|
:autoSize="{ minRows: 3 }" |
||||||
|
v-model="form.remark" |
||||||
|
placeholder="请输入备注" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
</el-form> |
||||||
|
<template #footer> |
||||||
|
<span> |
||||||
|
<el-button @click="show = false">取 消</el-button> |
||||||
|
<el-button :disabled="formLoading" type="primary" @click="handleSave">保 存</el-button> |
||||||
|
</span> |
||||||
|
</template> |
||||||
|
</Dialog> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup name="DialogProduct"> |
||||||
|
import { addOrderProduct } from '@/api/clue/sign' |
||||||
|
|
||||||
|
const message = useMessage() // 消息弹窗 |
||||||
|
|
||||||
|
const specsOptions = computed({ |
||||||
|
get() { |
||||||
|
return (prodId) => { |
||||||
|
if (prodId) { |
||||||
|
return prodOptions.value.find((it) => it.productId == prodId).productSpecList |
||||||
|
} |
||||||
|
return [] |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
const show = ref(false) |
||||||
|
const form = ref({}) |
||||||
|
const rules = { |
||||||
|
productId: { required: true, message: '成交产品不可为空', trigger: 'change' }, |
||||||
|
specsId: { required: true, message: '产品规格不可为空', trigger: 'change' }, |
||||||
|
signNum: { required: true, message: '成交数量不可为空', trigger: 'blur' } |
||||||
|
} |
||||||
|
|
||||||
|
const prodOptions = ref([]) |
||||||
|
|
||||||
|
function open(signId, arr) { |
||||||
|
prodOptions.value = arr |
||||||
|
form.value.signId = signId |
||||||
|
form.value.isProduced = 0 |
||||||
|
show.value = true |
||||||
|
} |
||||||
|
defineExpose({ open }) |
||||||
|
|
||||||
|
const emit = defineEmits(['success']) |
||||||
|
const formRef = ref() |
||||||
|
const formLoading = ref(false) |
||||||
|
async function handleSave() { |
||||||
|
// 校验表单 |
||||||
|
if (!formRef.value) return |
||||||
|
const valid = await formRef.value.validate() |
||||||
|
if (!valid) return |
||||||
|
|
||||||
|
// 提交请求 |
||||||
|
formLoading.value = true |
||||||
|
try { |
||||||
|
await addOrderProduct(form.value) |
||||||
|
message.success('新增成功!') |
||||||
|
show.value = false |
||||||
|
// 发送操作成功的事件 |
||||||
|
emit('success') |
||||||
|
} finally { |
||||||
|
formLoading.value = false |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped></style> |
@ -0,0 +1,62 @@ |
|||||||
|
<template> |
||||||
|
<Echart :options="optionsData" :width="400" :height="200" /> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup name="BarSalerClueReport"> |
||||||
|
import { set } from 'lodash-es' |
||||||
|
|
||||||
|
onMounted(() => { |
||||||
|
nextTick(() => { |
||||||
|
getReportData() |
||||||
|
}) |
||||||
|
}) |
||||||
|
|
||||||
|
const optionsData = ref({}) |
||||||
|
|
||||||
|
const getReportData = async () => { |
||||||
|
// const data = await HomeApi.getClueSignSignRate() |
||||||
|
set(optionsData, 'radiusAxis', { |
||||||
|
type: 'category', |
||||||
|
data: ['宝典', '一点通', '抖音', '小红书'], |
||||||
|
z: 10 |
||||||
|
}) |
||||||
|
set(optionsData, 'series', [ |
||||||
|
{ |
||||||
|
type: 'bar', |
||||||
|
data: [1, 2, 3, 4], |
||||||
|
coordinateSystem: 'polar', |
||||||
|
name: '高意向A', |
||||||
|
stack: 'a', |
||||||
|
emphasis: { |
||||||
|
focus: 'series' |
||||||
|
} |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'bar', |
||||||
|
data: [2, 4, 6, 8], |
||||||
|
coordinateSystem: 'polar', |
||||||
|
name: '中意向B', |
||||||
|
stack: 'a', |
||||||
|
emphasis: { |
||||||
|
focus: 'series' |
||||||
|
} |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'bar', |
||||||
|
data: [1, 2, 3, 4], |
||||||
|
coordinateSystem: 'polar', |
||||||
|
name: '低意向C', |
||||||
|
stack: 'a', |
||||||
|
emphasis: { |
||||||
|
focus: 'series' |
||||||
|
} |
||||||
|
} |
||||||
|
]) |
||||||
|
} |
||||||
|
|
||||||
|
defineExpose({ |
||||||
|
getReportData |
||||||
|
}) |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped></style> |
@ -0,0 +1,402 @@ |
|||||||
|
<template> |
||||||
|
<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.consultTime" |
||||||
|
type="daterange" |
||||||
|
format="YYYY-MM-DD" |
||||||
|
value-format="YYYY-MM-DD" |
||||||
|
start-placeholder="选择日期" |
||||||
|
end-placeholder="选择日期" |
||||||
|
:clearable="false" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-tree-select |
||||||
|
v-model="searchForm.sourceId" |
||||||
|
:data="props.sourceOptions" |
||||||
|
:props="defaultProps" |
||||||
|
check-strictly |
||||||
|
clearable |
||||||
|
filterable |
||||||
|
node-key="sourceId" |
||||||
|
placeholder="请选择渠道" |
||||||
|
@change="sourceChange" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item v-if="appStore.getAppInfo?.instanceType == 1"> |
||||||
|
<el-select |
||||||
|
v-model="searchForm.licenseTypeList" |
||||||
|
placeholder="选择驾照类型" |
||||||
|
clearable |
||||||
|
multiple |
||||||
|
> |
||||||
|
<el-option |
||||||
|
v-for="item in props.licenseTypeOptions" |
||||||
|
:key="item.label" |
||||||
|
:label="item.label" |
||||||
|
:value="item.label" |
||||||
|
/> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
|
||||||
|
<el-form-item> |
||||||
|
<el-button @click="handleSearch">查询</el-button> |
||||||
|
<el-button @click="handleReset">重置</el-button> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
|
||||||
|
<el-tabs v-model="showPane" class="pb-10px"> |
||||||
|
<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="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" |
||||||
|
:formatter="(row) => row.signRate + '%'" |
||||||
|
/> |
||||||
|
<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> |
||||||
|
<el-row :gutter="20"> |
||||||
|
<el-col :span="24" :offset="0"> |
||||||
|
<el-checkbox-group v-model="showChannel" @change="setReportData"> |
||||||
|
<el-checkbox v-for="(item, index) in channelArr" :key="index" :label="item" /> |
||||||
|
</el-checkbox-group> |
||||||
|
</el-col> |
||||||
|
|
||||||
|
<el-col :span="12" :offset="0"> |
||||||
|
<el-skeleton :loading="loading" animated> |
||||||
|
<Echart :options="echart1Option" width="100%" :height="400" /> |
||||||
|
</el-skeleton> |
||||||
|
</el-col> |
||||||
|
<el-col :span="12" :offset="0" v-if="appStore.getAppInfo?.instanceType == 1"> |
||||||
|
<Echart :options="echart2Option" width="100%" :height="400" /> |
||||||
|
</el-col> |
||||||
|
<el-col :span="24" :offset="0"> |
||||||
|
<Echart :options="echart3Option" width="100%" :height="400" /> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
</el-tab-pane> |
||||||
|
</el-tabs> |
||||||
|
</Dialog> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup name="DialogSalerReportDetail"> |
||||||
|
import { set } from 'lodash-es' |
||||||
|
import * as reportApi from '@/api/home/reportSaler' |
||||||
|
import { getIntDictOptions } from '@/utils/dict' |
||||||
|
import { removeNullField } from '@/utils' |
||||||
|
import { useAppStore } from '@/store/modules/app' |
||||||
|
import { formatDate } from '@/utils/formatTime' |
||||||
|
|
||||||
|
const appStore = useAppStore() |
||||||
|
|
||||||
|
const props = defineProps({ |
||||||
|
licenseTypeOptions: { |
||||||
|
type: Array, |
||||||
|
default: () => [] |
||||||
|
}, |
||||||
|
sourceOptions: { |
||||||
|
type: Array, |
||||||
|
default: () => [] |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
const defaultProps = { |
||||||
|
children: 'children', |
||||||
|
label: 'sourceName', |
||||||
|
value: 'sourceId', |
||||||
|
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) |
||||||
|
|
||||||
|
function handleReset() { |
||||||
|
searchForm.value = { |
||||||
|
nickname: undefined, |
||||||
|
consultTime: [`${year}-${month}-01`, formatDate(new Date())], |
||||||
|
licenseTypeList: [], |
||||||
|
sourceId: undefined |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
/** 打开弹窗 */ |
||||||
|
const open = async (info, queryInfo) => { |
||||||
|
showPane.value = 1 |
||||||
|
dialogVisible.value = true |
||||||
|
dialogTitle.value = info.nickname |
||||||
|
searchForm.value = { ...queryInfo } |
||||||
|
searchForm.value.userId = info.userId |
||||||
|
|
||||||
|
sourceChange() |
||||||
|
} |
||||||
|
defineExpose({ open }) // 提供 open 方法,用于打开弹窗 |
||||||
|
|
||||||
|
const tableList = ref([]) |
||||||
|
|
||||||
|
async function handleSearch() { |
||||||
|
loading.value = true |
||||||
|
try { |
||||||
|
const params = { ...searchForm.value } |
||||||
|
const data = await reportApi.getInfo(removeNullField(params)) |
||||||
|
tableList.value = data.sourceDetailVOList |
||||||
|
setReportData(data) |
||||||
|
} finally { |
||||||
|
loading.value = false |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
function sourceChange() { |
||||||
|
handleSearch() |
||||||
|
showChannel.value = channelArr.value |
||||||
|
} |
||||||
|
|
||||||
|
const echart1Option = ref({ |
||||||
|
title: { |
||||||
|
text: '线索分布图' |
||||||
|
}, |
||||||
|
radiusAxis: {}, |
||||||
|
angleAxis: {}, |
||||||
|
tooltip: { |
||||||
|
show: true, |
||||||
|
formatter: '{b0}-{a}: {c}' |
||||||
|
}, |
||||||
|
polar: {}, |
||||||
|
legend: { |
||||||
|
show: true, |
||||||
|
type: 'scroll', |
||||||
|
left: 100 |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
const echart2Option = ref({ |
||||||
|
title: { |
||||||
|
text: '成交分布图' |
||||||
|
}, |
||||||
|
radiusAxis: {}, |
||||||
|
angleAxis: {}, |
||||||
|
tooltip: { |
||||||
|
show: true, |
||||||
|
formatter: '{b0}-{a}: {c}' |
||||||
|
}, |
||||||
|
polar: {}, |
||||||
|
legend: { |
||||||
|
show: true, |
||||||
|
type: 'scroll', |
||||||
|
left: 100 |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
const echart3Option = ref({ |
||||||
|
title: { |
||||||
|
text: '销售雷达图' |
||||||
|
}, |
||||||
|
radar: { |
||||||
|
indicator: [ |
||||||
|
{ name: '成交周期' }, |
||||||
|
{ name: '毛利/单' }, |
||||||
|
{ name: '支出/单' }, |
||||||
|
{ name: '线索成本/条' }, |
||||||
|
{ name: '净利润/单' }, |
||||||
|
{ name: '成交率' } |
||||||
|
// { name: '线索总成本' }, |
||||||
|
// { name: '总支出' }, |
||||||
|
// { name: '总利润' } |
||||||
|
] |
||||||
|
}, |
||||||
|
legend: { |
||||||
|
show: true, |
||||||
|
right: '10px', |
||||||
|
orient: 'vertical' |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
const setReportData = async (data) => { |
||||||
|
// const data = await HomeApi.getClueSignSignRate() |
||||||
|
|
||||||
|
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 |
||||||
|
}) |
||||||
|
|
||||||
|
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: list, |
||||||
|
coordinateSystem: 'polar', |
||||||
|
name: intention.label, |
||||||
|
stack: 'a', |
||||||
|
emphasis: { |
||||||
|
focus: 'series' |
||||||
|
}, |
||||||
|
label: { |
||||||
|
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: list, |
||||||
|
coordinateSystem: 'polar', |
||||||
|
name: cartype.label, |
||||||
|
stack: 'a', |
||||||
|
emphasis: { |
||||||
|
focus: 'series' |
||||||
|
}, |
||||||
|
label: { |
||||||
|
show: true, |
||||||
|
position: 'middle' |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
set(echart1Option.value, 'radiusAxis', { |
||||||
|
type: 'category', |
||||||
|
data: channelClueArr, |
||||||
|
axisLabel: { |
||||||
|
margin: 5, |
||||||
|
fontSize: 10, |
||||||
|
interval: 0 |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
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: [ |
||||||
|
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: [ |
||||||
|
personDetail.averageSignPeriod, |
||||||
|
personDetail.grossProfitOfSingleSign, |
||||||
|
personDetail.payPriceOfSingleSign, |
||||||
|
personDetail.costOfSingleClue, |
||||||
|
personDetail.netProfitOfSingleSign, |
||||||
|
personDetail.signRate |
||||||
|
// personDetail.clueCostTotal, |
||||||
|
// personDetail.payPriceTotal, |
||||||
|
// personDetail.profitTotal |
||||||
|
], |
||||||
|
name: dialogTitle.value, |
||||||
|
areaStyle: { |
||||||
|
color: 'rgba(255, 145, 124, 0.4)' |
||||||
|
}, |
||||||
|
label: { |
||||||
|
show: true |
||||||
|
} |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
|
]) |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped></style> |
@ -0,0 +1,248 @@ |
|||||||
|
<template> |
||||||
|
<ContentWrap> |
||||||
|
<el-form :model="searchForm" label-width="0" inline> |
||||||
|
<el-form-item> |
||||||
|
<el-date-picker |
||||||
|
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> |
||||||
|
<el-input v-model="searchForm.nickname" placeholder="销售姓名" clearable /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-tree-select |
||||||
|
v-model="searchForm.sourceId" |
||||||
|
:data="sourceOptions" |
||||||
|
:props="defaultProps" |
||||||
|
check-strictly |
||||||
|
clearable |
||||||
|
filterable |
||||||
|
node-key="sourceId" |
||||||
|
placeholder="请选择渠道" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item v-if="appStore.getAppInfo?.instanceType == 1"> |
||||||
|
<el-select |
||||||
|
v-model="searchForm.licenseTypeList" |
||||||
|
placeholder="选择驾照类型" |
||||||
|
clearable |
||||||
|
multiple |
||||||
|
> |
||||||
|
<el-option |
||||||
|
v-for="item in licenseTypeOptions" |
||||||
|
:key="item.label" |
||||||
|
:label="item.label" |
||||||
|
:value="item.label" |
||||||
|
/> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
|
||||||
|
<el-form-item> |
||||||
|
<el-button @click="handleSearch">查询</el-button> |
||||||
|
<el-button @click="handleReset">重置</el-button> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
|
||||||
|
<el-table |
||||||
|
v-loading="loading" |
||||||
|
:data="tableList" |
||||||
|
border |
||||||
|
stripe |
||||||
|
show-summary |
||||||
|
:summary-method="getSummaries" |
||||||
|
> |
||||||
|
<el-table-column type="index" width="60" fixed="left" align="center" /> |
||||||
|
<el-table-column prop="nickname" label="姓名" width="80" fixed="left"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-button type="primary" style="padding: 0" text @click="handleDetail(row)">{{ |
||||||
|
row.nickname |
||||||
|
}}</el-button> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="newClueNumber" sortable min-width="100"> |
||||||
|
<template #header> |
||||||
|
<Tooltip message="咨询日期在所选周期内的线索总数" /> |
||||||
|
<span>新线索数</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<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="signRate" |
||||||
|
sortable |
||||||
|
min-width="100" |
||||||
|
:formatter="(row) => row.signRate + '%'" |
||||||
|
/> |
||||||
|
<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="grossProfitOfSingleSign" sortable min-width="100"> |
||||||
|
<template #header> |
||||||
|
<Tooltip |
||||||
|
message="平均每笔成交订单的公司利润【按照登记,不按审核到账】=总公司利润/总成交数" |
||||||
|
/> |
||||||
|
<span>毛利/单</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="payPriceOfSingleSign" sortable min-width="100"> |
||||||
|
<template #header> |
||||||
|
<Tooltip |
||||||
|
message="平均每笔成交订单的额外支出(返费等)【按照登记,不按审核到账】=总支出/总成交数" |
||||||
|
/> |
||||||
|
<span>支出/单</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="costOfSingleClue" sortable min-width="100"> |
||||||
|
<template #header> |
||||||
|
<Tooltip message="平均每条线索的成本=总线索成本/新线索条数" /> |
||||||
|
<span>线索成本/条</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="netProfitOfSingleSign" sortable min-width="100"> |
||||||
|
<template #header> |
||||||
|
<Tooltip message="=(总公司利润-总支出-总线索成本)/总成交数" /> |
||||||
|
<span>净利润/单</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<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="repeatClueNum" sortable min-width="100" /> |
||||||
|
<el-table-column label="撞单成交数" prop="repeatClueSignNum" sortable min-width="100" /> |
||||||
|
</el-table> |
||||||
|
|
||||||
|
<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/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' |
||||||
|
import { useAppStore } from '@/store/modules/app' |
||||||
|
|
||||||
|
const appStore = useAppStore() |
||||||
|
onMounted(() => { |
||||||
|
getOptions() |
||||||
|
handleReset() |
||||||
|
handleSearch() |
||||||
|
}) |
||||||
|
|
||||||
|
const defaultProps = { |
||||||
|
children: 'children', |
||||||
|
label: 'sourceName', |
||||||
|
value: 'sourceId', |
||||||
|
isLeaf: 'leaf' |
||||||
|
} |
||||||
|
|
||||||
|
const sourceOptions = ref([]) |
||||||
|
const licenseTypeOptions = ref([]) |
||||||
|
|
||||||
|
const searchForm = ref({}) |
||||||
|
|
||||||
|
function handleReset() { |
||||||
|
const year = new Date().getFullYear() |
||||||
|
const month = new Date().getMonth() + 1 |
||||||
|
searchForm.value = { |
||||||
|
nickname: undefined, |
||||||
|
consultTime: [`${year}-${month}-01`, formatDate(new Date())], |
||||||
|
licenseTypeList: [], |
||||||
|
sourceId: undefined |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
const loading = ref(false) |
||||||
|
const tableList = ref([]) |
||||||
|
const avgData = ref({}) |
||||||
|
async function handleSearch() { |
||||||
|
loading.value = true |
||||||
|
try { |
||||||
|
const data = await reportApi.getList(removeNullField(searchForm.value)) |
||||||
|
tableList.value = data.personDataVOList |
||||||
|
avgData.value = data.averageDataVO |
||||||
|
} finally { |
||||||
|
loading.value = false |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
function getSummaries({ columns, data }) { |
||||||
|
const sums = [] |
||||||
|
columns.forEach((column, index) => { |
||||||
|
if (index == 0) { |
||||||
|
sums[index] = '统计' |
||||||
|
return |
||||||
|
} |
||||||
|
|
||||||
|
const doubleSumsColumns = [ |
||||||
|
'newClueNumber', |
||||||
|
'signNumber', |
||||||
|
'clueCostTotal', |
||||||
|
'payPriceTotal', |
||||||
|
'profitTotal' |
||||||
|
] |
||||||
|
if (column.property in avgData.value) { |
||||||
|
sums[index] = `均值: ${avgData.value[column.property]}` |
||||||
|
} else if (doubleSumsColumns.includes(column.property)) { |
||||||
|
const values = data.map((item) => Number(item[column.property])) |
||||||
|
let sum = values.reduce((prev, curr) => prev + curr, 0) |
||||||
|
let avg = sum / values.length |
||||||
|
if (['newClueNumber', 'signNumber'].includes(column.property)) { |
||||||
|
avg = Math.floor(avg) |
||||||
|
} else { |
||||||
|
sum = sum.toFixed(2) |
||||||
|
avg = avg.toFixed(2) |
||||||
|
} |
||||||
|
sums[index] = h('div', {}, [h('div', {}, `合计:${sum}`), h('div', {}, `均值:${avg}`)]) |
||||||
|
} else { |
||||||
|
sums[index] = '' |
||||||
|
} |
||||||
|
}) |
||||||
|
return sums |
||||||
|
} |
||||||
|
|
||||||
|
const SalerDetailDialog = ref() |
||||||
|
function handleDetail(info) { |
||||||
|
SalerDetailDialog.value.open(info, searchForm.value) |
||||||
|
} |
||||||
|
|
||||||
|
function getOptions() { |
||||||
|
getResourceOptions().then((data) => { |
||||||
|
sourceOptions.value = handleTree(data, 'sourceId') |
||||||
|
}) |
||||||
|
licenseTypeOptions.value = getIntDictOptions('license_type') |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped></style> |
Loading…
Reference in new issue