crm：code review 员工业绩统计
This commit is contained in:
YunaiV
parent
56543b8db4
commit
715f37eb0b
@ -1,4 +1,5 @@
|
||||
<!-- 员工业绩统计 -->
|
||||
<!-- TODO @scholar:参考 ReceivablePricePerformance 建议改 -->
|
||||
<template>
|
||||
<!-- Echarts图 -->
|
||||
<el-card shadow="never">
|
||||
@ -10,7 +11,13 @@
|
||||
<!-- 统计列表 -->
|
||||
<el-card shadow="never" class="mt-16px">
|
||||
<el-table v-loading="loading" :data="tableData">
|
||||
<el-table-column v-for="item in columnsData" :key="item.prop" :label="item.label" :prop="item.prop" align="center">
|
||||
<el-table-column
|
||||
v-for="item in columnsData"
|
||||
:key="item.prop"
|
||||
:label="item.label"
|
||||
:prop="item.prop"
|
||||
align="center"
|
||||
>
|
||||
<template #default="scope">
|
||||
{{ scope.row[item.prop] }}
|
||||
</template>
|
||||
@ -23,7 +30,7 @@ import { EChartsOption } from 'echarts'
|
||||
import {
|
||||
StatisticsPerformanceApi,
|
||||
StatisticsPerformanceRespVO
|
||||
} from "@/api/crm/statistics/performance"
|
||||
} from '@/api/crm/statistics/performance'
|
||||
|
||||
defineOptions({ name: 'ContractCountPerformance' })
|
||||
const props = defineProps<{ queryParams: any }>() // 搜索参数
|
||||
@ -86,7 +93,8 @@ const echartsOption = reactive<EChartsOption>({
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
yAxis: [{
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
name: '数量（个）',
|
||||
axisTick: {
|
||||
@ -134,7 +142,8 @@ const echartsOption = reactive<EChartsOption>({
|
||||
color: '#e6e6e6'
|
||||
}
|
||||
}
|
||||
}],
|
||||
}
|
||||
],
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
name: '日期',
|
||||
@ -152,9 +161,7 @@ const loadData = async () => {
|
||||
|
||||
// 2.1 更新 Echarts 数据
|
||||
if (echartsOption.xAxis && echartsOption.xAxis['data']) {
|
||||
echartsOption.xAxis['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.time
|
||||
)
|
||||
echartsOption.xAxis['data'] = performanceList.map((s: StatisticsPerformanceRespVO) => s.time)
|
||||
}
|
||||
if (echartsOption.series && echartsOption.series[0] && echartsOption.series[0]['data']) {
|
||||
echartsOption.series[0]['data'] = performanceList.map(
|
||||
@ -165,16 +172,16 @@ const loadData = async () => {
|
||||
echartsOption.series[1]['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.lastMonthCount
|
||||
)
|
||||
echartsOption.series[3]['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.lastMonthCount !== 0 ? (s.currentMonthCount / s.lastMonthCount*100).toFixed(2) : 'NULL'
|
||||
echartsOption.series[3]['data'] = performanceList.map((s: StatisticsPerformanceRespVO) =>
|
||||
s.lastMonthCount !== 0 ? ((s.currentMonthCount / s.lastMonthCount) * 100).toFixed(2) : 'NULL'
|
||||
)
|
||||
}
|
||||
if (echartsOption.series && echartsOption.series[2] && echartsOption.series[2]['data']) {
|
||||
echartsOption.series[2]['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.lastYearCount
|
||||
)
|
||||
echartsOption.series[4]['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.lastYearCount !== 0 ? (s.currentMonthCount / s.lastYearCount*100).toFixed(2) : 'NULL'
|
||||
echartsOption.series[4]['data'] = performanceList.map((s: StatisticsPerformanceRespVO) =>
|
||||
s.lastYearCount !== 0 ? ((s.currentMonthCount / s.lastYearCount) * 100).toFixed(2) : 'NULL'
|
||||
)
|
||||
}
|
||||
|
||||
@ -182,18 +189,22 @@ const loadData = async () => {
|
||||
list.value = performanceList
|
||||
convertListData()
|
||||
loading.value = false
|
||||
|
||||
}
|
||||
|
||||
// 初始化数据
|
||||
const columnsData = reactive([]);
|
||||
const tableData = reactive([{title: '当月合同数量统计（个）'}, {title: '上月合同数量统计（个）'},
|
||||
{title: '去年当月合同数量统计（个）'}, {title: '同比增长率（%）'}, {title: '环比增长率（%）'}])
|
||||
const columnsData = reactive([])
|
||||
const tableData = reactive([
|
||||
{ title: '当月合同数量统计（个）' },
|
||||
{ title: '上月合同数量统计（个）' },
|
||||
{ title: '去年当月合同数量统计（个）' },
|
||||
{ title: '同比增长率（%）' },
|
||||
{ title: '环比增长率（%）' }
|
||||
])
|
||||
|
||||
// 定义 convertListData 方法，数据行列转置，展示每月数据
|
||||
const convertListData = () => {
|
||||
const columnObj = { label: '日期', prop: 'title' }
|
||||
columnsData.splice(0, columnsData.length);//清空数组
|
||||
columnsData.splice(0, columnsData.length) //清空数组
|
||||
columnsData.push(columnObj)
|
||||
|
||||
list.value.forEach((item, index) => {
|
||||
@ -202,8 +213,10 @@ const convertListData = () => {
|
||||
tableData[0]['prop' + index] = item.currentMonthCount
|
||||
tableData[1]['prop' + index] = item.lastMonthCount
|
||||
tableData[2]['prop' + index] = item.lastYearCount
|
||||
tableData[3]['prop' + index] = item.lastMonthCount !== 0 ? (item.currentMonthCount / item.lastMonthCount).toFixed(2) : 'NULL'
|
||||
tableData[4]['prop' + index] = item.lastYearCount !== 0 ? (item.currentMonthCount / item.lastYearCount).toFixed(2) : 'NULL'
|
||||
tableData[3]['prop' + index] =
|
||||
item.lastMonthCount !== 0 ? (item.currentMonthCount / item.lastMonthCount).toFixed(2) : 'NULL'
|
||||
tableData[4]['prop' + index] =
|
||||
item.lastYearCount !== 0 ? (item.currentMonthCount / item.lastYearCount).toFixed(2) : 'NULL'
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
<!-- 员工业绩统计 -->
|
||||
<!-- TODO @scholar:参考 ReceivablePricePerformance 建议改 -->
|
||||
<template>
|
||||
<!-- Echarts图 -->
|
||||
<el-card shadow="never">
|
||||
@ -10,7 +11,13 @@
|
||||
<!-- 统计列表 -->
|
||||
<el-card shadow="never" class="mt-16px">
|
||||
<el-table v-loading="loading" :data="tableData">
|
||||
<el-table-column v-for="item in columnsData" :key="item.prop" :label="item.label" :prop="item.prop" align="center">
|
||||
<el-table-column
|
||||
v-for="item in columnsData"
|
||||
:key="item.prop"
|
||||
:label="item.label"
|
||||
:prop="item.prop"
|
||||
align="center"
|
||||
>
|
||||
<template #default="scope">
|
||||
{{ scope.row[item.prop] }}
|
||||
</template>
|
||||
@ -23,7 +30,7 @@ import { EChartsOption } from 'echarts'
|
||||
import {
|
||||
StatisticsPerformanceApi,
|
||||
StatisticsPerformanceRespVO
|
||||
} from "@/api/crm/statistics/performance"
|
||||
} from '@/api/crm/statistics/performance'
|
||||
|
||||
defineOptions({ name: 'ContractPricePerformance' })
|
||||
const props = defineProps<{ queryParams: any }>() // 搜索参数
|
||||
@ -86,7 +93,8 @@ const echartsOption = reactive<EChartsOption>({
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
yAxis: [{
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
name: '金额（元）',
|
||||
axisTick: {
|
||||
@ -134,7 +142,8 @@ const echartsOption = reactive<EChartsOption>({
|
||||
color: '#e6e6e6'
|
||||
}
|
||||
}
|
||||
}],
|
||||
}
|
||||
],
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
name: '日期',
|
||||
@ -152,9 +161,7 @@ const loadData = async () => {
|
||||
|
||||
// 2.1 更新 Echarts 数据
|
||||
if (echartsOption.xAxis && echartsOption.xAxis['data']) {
|
||||
echartsOption.xAxis['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.time
|
||||
)
|
||||
echartsOption.xAxis['data'] = performanceList.map((s: StatisticsPerformanceRespVO) => s.time)
|
||||
}
|
||||
if (echartsOption.series && echartsOption.series[0] && echartsOption.series[0]['data']) {
|
||||
echartsOption.series[0]['data'] = performanceList.map(
|
||||
@ -165,16 +172,16 @@ const loadData = async () => {
|
||||
echartsOption.series[1]['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.lastMonthCount
|
||||
)
|
||||
echartsOption.series[3]['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.lastMonthCount !== 0 ? (s.currentMonthCount / s.lastMonthCount*100).toFixed(2) : 'NULL'
|
||||
echartsOption.series[3]['data'] = performanceList.map((s: StatisticsPerformanceRespVO) =>
|
||||
s.lastMonthCount !== 0 ? ((s.currentMonthCount / s.lastMonthCount) * 100).toFixed(2) : 'NULL'
|
||||
)
|
||||
}
|
||||
if (echartsOption.series && echartsOption.series[2] && echartsOption.series[2]['data']) {
|
||||
echartsOption.series[2]['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.lastYearCount
|
||||
)
|
||||
echartsOption.series[4]['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.lastYearCount !== 0 ? (s.currentMonthCount / s.lastYearCount*100).toFixed(2) : 'NULL'
|
||||
echartsOption.series[4]['data'] = performanceList.map((s: StatisticsPerformanceRespVO) =>
|
||||
s.lastYearCount !== 0 ? ((s.currentMonthCount / s.lastYearCount) * 100).toFixed(2) : 'NULL'
|
||||
)
|
||||
}
|
||||
|
||||
@ -182,13 +189,17 @@ const loadData = async () => {
|
||||
list.value = performanceList
|
||||
convertListData()
|
||||
loading.value = false
|
||||
|
||||
}
|
||||
|
||||
// 初始化数据
|
||||
const columnsData = reactive([]);
|
||||
const tableData = reactive([{title: '当月合同金额统计（元）'}, {title: '上月合同金额统计（元）'}, {title: '去年当月合同金额统计（元）'},
|
||||
{title: '同比增长率（%）'}, {title: '环比增长率（%）'}])
|
||||
const columnsData = reactive([])
|
||||
const tableData = reactive([
|
||||
{ title: '当月合同金额统计（元）' },
|
||||
{ title: '上月合同金额统计（元）' },
|
||||
{ title: '去年当月合同金额统计（元）' },
|
||||
{ title: '同比增长率（%）' },
|
||||
{ title: '环比增长率（%）' }
|
||||
])
|
||||
|
||||
// 定义 init 方法
|
||||
const convertListData = () => {
|
||||
@ -202,8 +213,10 @@ const convertListData = () => {
|
||||
tableData[0]['prop' + index] = item.currentMonthCount
|
||||
tableData[1]['prop' + index] = item.lastMonthCount
|
||||
tableData[2]['prop' + index] = item.lastYearCount
|
||||
tableData[3]['prop' + index] = item.lastMonthCount !== 0 ? (item.currentMonthCount / item.lastMonthCount).toFixed(2) : 'NULL'
|
||||
tableData[4]['prop' + index] = item.lastYearCount !== 0 ? (item.currentMonthCount / item.lastYearCount).toFixed(2) : 'NULL'
|
||||
tableData[3]['prop' + index] =
|
||||
item.lastMonthCount !== 0 ? (item.currentMonthCount / item.lastMonthCount).toFixed(2) : 'NULL'
|
||||
tableData[4]['prop' + index] =
|
||||
item.lastYearCount !== 0 ? (item.currentMonthCount / item.lastYearCount).toFixed(2) : 'NULL'
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
@ -10,7 +10,14 @@
|
||||
<!-- 统计列表 -->
|
||||
<el-card shadow="never" class="mt-16px">
|
||||
<el-table v-loading="loading" :data="tableData">
|
||||
<el-table-column v-for="item in columnsData" :key="item.prop" :label="item.label" :prop="item.prop" align="center">
|
||||
<el-table-column
|
||||
v-for="item in columnsData"
|
||||
:key="item.prop"
|
||||
:label="item.label"
|
||||
:prop="item.prop"
|
||||
align="center"
|
||||
>
|
||||
<!-- TODO @scholar：IDEA 爆红的处理 -->
|
||||
<template #default="scope">
|
||||
{{ scope.row[item.prop] }}
|
||||
</template>
|
||||
@ -23,7 +30,7 @@ import { EChartsOption } from 'echarts'
|
||||
import {
|
||||
StatisticsPerformanceApi,
|
||||
StatisticsPerformanceRespVO
|
||||
} from "@/api/crm/statistics/performance"
|
||||
} from '@/api/crm/statistics/performance'
|
||||
|
||||
defineOptions({ name: 'ContractPricePerformance' })
|
||||
const props = defineProps<{ queryParams: any }>() // 搜索参数
|
||||
@ -86,7 +93,8 @@ const echartsOption = reactive<EChartsOption>({
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
yAxis: [{
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
name: '金额（元）',
|
||||
axisTick: {
|
||||
@ -113,6 +121,7 @@ const echartsOption = reactive<EChartsOption>({
|
||||
type: 'value',
|
||||
name: '',
|
||||
axisTick: {
|
||||
// TODO @scholar：IDEA 爆红的处理
|
||||
alignWithLabel: true,
|
||||
lineStyle: {
|
||||
width: 0
|
||||
@ -134,7 +143,8 @@ const echartsOption = reactive<EChartsOption>({
|
||||
color: '#e6e6e6'
|
||||
}
|
||||
}
|
||||
}],
|
||||
}
|
||||
],
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
name: '日期',
|
||||
@ -152,9 +162,7 @@ const loadData = async () => {
|
||||
|
||||
// 2.1 更新 Echarts 数据
|
||||
if (echartsOption.xAxis && echartsOption.xAxis['data']) {
|
||||
echartsOption.xAxis['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.time
|
||||
)
|
||||
echartsOption.xAxis['data'] = performanceList.map((s: StatisticsPerformanceRespVO) => s.time)
|
||||
}
|
||||
if (echartsOption.series && echartsOption.series[0] && echartsOption.series[0]['data']) {
|
||||
echartsOption.series[0]['data'] = performanceList.map(
|
||||
@ -165,16 +173,16 @@ const loadData = async () => {
|
||||
echartsOption.series[1]['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.lastMonthCount
|
||||
)
|
||||
echartsOption.series[3]['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.lastMonthCount !== 0 ? (s.currentMonthCount / s.lastMonthCount*100).toFixed(2) : 'NULL'
|
||||
echartsOption.series[3]['data'] = performanceList.map((s: StatisticsPerformanceRespVO) =>
|
||||
s.lastMonthCount !== 0 ? ((s.currentMonthCount / s.lastMonthCount) * 100).toFixed(2) : 'NULL'
|
||||
)
|
||||
}
|
||||
if (echartsOption.series && echartsOption.series[2] && echartsOption.series[1]['data']) {
|
||||
echartsOption.series[2]['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.lastYearCount
|
||||
)
|
||||
echartsOption.series[4]['data'] = performanceList.map(
|
||||
(s: StatisticsPerformanceRespVO) => s.lastYearCount !== 0 ? (s.currentMonthCount / s.lastYearCount*100).toFixed(2) : 'NULL'
|
||||
echartsOption.series[4]['data'] = performanceList.map((s: StatisticsPerformanceRespVO) =>
|
||||
s.lastYearCount !== 0 ? ((s.currentMonthCount / s.lastYearCount) * 100).toFixed(2) : 'NULL'
|
||||
)
|
||||
}
|
||||
|
||||
@ -182,13 +190,18 @@ const loadData = async () => {
|
||||
list.value = performanceList
|
||||
convertListData()
|
||||
loading.value = false
|
||||
|
||||
}
|
||||
|
||||
// 初始化数据
|
||||
const columnsData = reactive([]);
|
||||
const tableData = reactive([{title: '当月回款金额统计（元）'}, {title: '上月回款金额统计（元）'},
|
||||
{title: '去年当月回款金额统计（元）'}, {title: '同比增长率（%）'}, {title: '环比增长率（%）'}]);
|
||||
// TODO @scholar：加个 as any[]，避免 idea 爆红
|
||||
const columnsData = reactive([] as any[])
|
||||
const tableData = reactive([
|
||||
{ title: '当月回款金额统计（元）' },
|
||||
{ title: '上月回款金额统计（元）' },
|
||||
{ title: '去年当月回款金额统计（元）' },
|
||||
{ title: '同比增长率（%）' },
|
||||
{ title: '环比增长率（%）' }
|
||||
])
|
||||
|
||||
// 定义 init 方法
|
||||
const convertListData = () => {
|
||||
@ -202,8 +215,11 @@ const convertListData = () => {
|
||||
tableData[0]['prop' + index] = item.currentMonthCount
|
||||
tableData[1]['prop' + index] = item.lastMonthCount
|
||||
tableData[2]['prop' + index] = item.lastYearCount
|
||||
tableData[3]['prop' + index] = item.lastMonthCount !== 0 ? (item.currentMonthCount / item.lastMonthCount).toFixed(2) : 'NULL'
|
||||
tableData[4]['prop' + index] = item.lastYearCount !== 0 ? (item.currentMonthCount / item.lastYearCount).toFixed(2) : 'NULL'
|
||||
// TODO @scholar：百分比，使用 erpCalculatePercentage 直接计算；如果是 0，则返回 0，统一就好哈；
|
||||
tableData[3]['prop' + index] =
|
||||
item.lastMonthCount !== 0 ? (item.currentMonthCount / item.lastMonthCount).toFixed(2) : 'NULL'
|
||||
tableData[4]['prop' + index] =
|
||||
item.lastYearCount !== 0 ? (item.currentMonthCount / item.lastYearCount).toFixed(2) : 'NULL'
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
@ -60,7 +60,10 @@
|
||||
</el-tab-pane>
|
||||
<!-- 员工回款金额统计 -->
|
||||
<el-tab-pane label="员工回款金额统计" name="ReceivablePricePerformance" lazy>
|
||||
<ReceivablePricePerformance :query-params="queryParams" ref="ReceivablePricePerformanceRef" />
|
||||
<ReceivablePricePerformance
|
||||
:query-params="queryParams"
|
||||
ref="ReceivablePricePerformanceRef"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-col>
|
||||
@ -70,7 +73,7 @@
|
||||
import * as DeptApi from '@/api/system/dept'
|
||||
import * as UserApi from '@/api/system/user'
|
||||
import { useUserStore } from '@/store/modules/user'
|
||||
import { beginOfDay, defaultShortcuts, endOfDay, formatDate } from '@/utils/formatTime'
|
||||
import { beginOfDay, formatDate } from '@/utils/formatTime'
|
||||
import { defaultProps, handleTree } from '@/utils/tree'
|
||||
import ContractCountPerformance from './components/ContractCountPerformance.vue'
|
||||
import ContractPricePerformance from './components/ContractPricePerformance.vue'
|
||||
@ -97,6 +100,7 @@ const userListByDeptId = computed(() =>
|
||||
: []
|
||||
)
|
||||
|
||||
// TODO @scholar：改成尾注释，保证 vue 内容短一点；变量名小写
|
||||
// 活跃标签
|
||||
const activeTab = ref('ContractCountPerformance')
|
||||
// 1.员工合同数量统计
|
||||
@ -115,9 +119,11 @@ const handleQuery = () => {
|
||||
const fullDate = new Date(selectYear, 0, 1, 0, 0, 0)
|
||||
|
||||
// 将完整的日期时间格式化为需要的字符串形式，比如 2004-01-01 00:00:00
|
||||
queryParams.times[0] = `${fullDate.getFullYear()}-${
|
||||
String(fullDate.getMonth() + 1).padStart(2, '0')
|
||||
}-${String(fullDate.getDate()).padStart(2, '0')} ${String(fullDate.getHours()).padStart(2, '0')}:${String(fullDate.getMinutes()).padStart(2, '0')}:${String(fullDate.getSeconds()).padStart(2, '0')}`
|
||||
// TODO @scholar：看看，是不是可以使用 year 哈
|
||||
queryParams.times[0] = `${fullDate.getFullYear()}-${String(fullDate.getMonth() + 1).padStart(
|
||||
2,
|
||||
'0'
|
||||
)}-${String(fullDate.getDate()).padStart(2, '0')} ${String(fullDate.getHours()).padStart(2, '0')}:${String(fullDate.getMinutes()).padStart(2, '0')}:${String(fullDate.getSeconds()).padStart(2, '0')}`
|
||||
|
||||
switch (activeTab.value) {
|
||||
case 'ContractCountPerformance':
|
||||
|
||||
Loading…
Reference in New Issue
Block a user