Skip to content

Commit dcfad7a

Browse files
committed
crm:code review 员工业绩的前端
1 parent f17dfb9 commit dcfad7a

File tree

5 files changed

+165
-129
lines changed

5 files changed

+165
-129
lines changed

src/components/DictSelect/src/DictSelect.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
<!-- 数据字典 Select 选择器 -->
12
<template>
23
<el-select class="w-1/1" v-bind="attrs">
34
<template v-if="valueType === 'int'">

src/views/crm/statistics/performance/components/ContractCountPerformance.vue

Lines changed: 53 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,18 @@
77
</el-skeleton>
88
</el-card>
99

10-
<!-- 统计列表 -->
10+
<!-- 统计列表 TODO @scholar:统计列表的展示不对 -->
1111
<el-card shadow="never" class="mt-16px">
1212
<el-table v-loading="loading" :data="tableData">
13-
<el-table-column v-for="item in columnsData" :key="item.prop" :label="item.label" :prop="item.prop" align="center">
13+
<el-table-column
14+
v-for="item in columnsData"
15+
:key="item.prop"
16+
:label="item.label"
17+
:prop="item.prop"
18+
align="center"
19+
>
1420
<template #default="scope">
15-
{{scope.row[item.prop]}}
21+
{{ scope.row[item.prop] }}
1622
</template>
1723
</el-table-column>
1824
</el-table>
@@ -23,7 +29,7 @@ import { EChartsOption } from 'echarts'
2329
import {
2430
StatisticsPerformanceApi,
2531
StatisticsPerformanceRespVO
26-
} from "@/api/crm/statistics/performance"
32+
} from '@/api/crm/statistics/performance'
2733
2834
defineOptions({ name: 'ContractCountPerformance' })
2935
const props = defineProps<{ queryParams: any }>() // 搜索参数
@@ -86,29 +92,30 @@ const echartsOption = reactive<EChartsOption>({
8692
type: 'shadow'
8793
}
8894
},
89-
yAxis: [{
90-
type: 'value',
91-
name: '数量(个)',
92-
axisTick: {
93-
show: false
94-
},
95-
axisLabel: {
96-
color: '#BDBDBD',
97-
formatter: '{value}'
98-
},
99-
/** 坐标轴轴线相关设置 */
100-
axisLine: {
101-
lineStyle: {
102-
color: '#BDBDBD'
95+
yAxis: [
96+
{
97+
type: 'value',
98+
name: '数量(个)',
99+
axisTick: {
100+
show: false
101+
},
102+
axisLabel: {
103+
color: '#BDBDBD',
104+
formatter: '{value}'
105+
},
106+
/** 坐标轴轴线相关设置 */
107+
axisLine: {
108+
lineStyle: {
109+
color: '#BDBDBD'
110+
}
111+
},
112+
splitLine: {
113+
show: true,
114+
lineStyle: {
115+
color: '#e6e6e6'
116+
}
103117
}
104118
},
105-
splitLine: {
106-
show: true,
107-
lineStyle: {
108-
color: '#e6e6e6'
109-
}
110-
}
111-
},
112119
{
113120
type: 'value',
114121
name: '',
@@ -134,7 +141,8 @@ const echartsOption = reactive<EChartsOption>({
134141
color: '#e6e6e6'
135142
}
136143
}
137-
}],
144+
}
145+
],
138146
xAxis: {
139147
type: 'category',
140148
name: '日期',
@@ -152,9 +160,7 @@ const loadData = async () => {
152160
153161
// 2.1 更新 Echarts 数据
154162
if (echartsOption.xAxis && echartsOption.xAxis['data']) {
155-
echartsOption.xAxis['data'] = performanceList.map(
156-
(s: StatisticsPerformanceRespVO) => s.time
157-
)
163+
echartsOption.xAxis['data'] = performanceList.map((s: StatisticsPerformanceRespVO) => s.time)
158164
}
159165
if (echartsOption.series && echartsOption.series[0] && echartsOption.series[0]['data']) {
160166
echartsOption.series[0]['data'] = performanceList.map(
@@ -165,43 +171,49 @@ const loadData = async () => {
165171
echartsOption.series[1]['data'] = performanceList.map(
166172
(s: StatisticsPerformanceRespVO) => s.lastMonthCount
167173
)
168-
echartsOption.series[3]['data'] = performanceList.map(
169-
(s: StatisticsPerformanceRespVO) => s.lastMonthCount !== 0 ? (s.currentMonthCount / s.lastMonthCount*100).toFixed(2) : 'NULL'
174+
echartsOption.series[3]['data'] = performanceList.map((s: StatisticsPerformanceRespVO) =>
175+
s.lastMonthCount !== 0 ? ((s.currentMonthCount / s.lastMonthCount) * 100).toFixed(2) : 'NULL'
170176
)
171177
}
172178
if (echartsOption.series && echartsOption.series[2] && echartsOption.series[2]['data']) {
173179
echartsOption.series[2]['data'] = performanceList.map(
174180
(s: StatisticsPerformanceRespVO) => s.lastYearCount
175181
)
176-
echartsOption.series[4]['data'] = performanceList.map(
177-
(s: StatisticsPerformanceRespVO) => s.lastYearCount !== 0 ? (s.currentMonthCount / s.lastYearCount*100).toFixed(2) : 'NULL'
182+
echartsOption.series[4]['data'] = performanceList.map((s: StatisticsPerformanceRespVO) =>
183+
s.lastYearCount !== 0 ? ((s.currentMonthCount / s.lastYearCount) * 100).toFixed(2) : 'NULL'
178184
)
179185
}
180186
181187
// 2.2 更新列表数据
182188
list.value = performanceList
183189
loading.value = false
184-
185190
}
186191
187192
// 初始化数据
188-
const columnsData = reactive([]);
189-
const tableData = reactive([{title: '当月合同数量统计(个)'}, {title: '上月合同数量统计(个)'},
190-
{title: '去年当月合同数量统计(个)'}, {title: '同比增长率(%)'}, {title: '环比增长率(%)'}])
193+
const columnsData = reactive([])
194+
const tableData = reactive([
195+
{ title: '当月合同数量统计(个)' },
196+
{ title: '上月合同数量统计(个)' },
197+
{ title: '去年当月合同数量统计(个)' },
198+
{ title: '同比增长率(%)' },
199+
{ title: '环比增长率(%)' }
200+
])
191201
192202
// 定义 init 方法
193203
const init = () => {
194-
const columnObj = {label: '日期', prop: 'title'}
204+
const columnObj = { label: '日期', prop: 'title' }
195205
columnsData.push(columnObj)
196206
197207
list.value.forEach((item, index) => {
198-
const columnObj = {label: item.time, prop: 'prop' + index}
208+
const columnObj = { label: item.time, prop: 'prop' + index }
199209
columnsData.push(columnObj)
200210
tableData[0]['prop' + index] = item.currentMonthCount
201211
tableData[1]['prop' + index] = item.lastMonthCount
202212
tableData[2]['prop' + index] = item.lastYearCount
203-
tableData[3]['prop' + index] = item.lastYearCount !== 0 ? (item.currentMonthCount / item.lastYearCount).toFixed(2) : 'NULL'
204-
tableData[4]['prop' + index] = item.lastMonthCount !== 0 ? (item.currentMonthCount / item.lastMonthCount).toFixed(2) : 'NULL'
213+
tableData[3]['prop' + index] =
214+
item.lastYearCount !== 0 ? (item.currentMonthCount / item.lastYearCount).toFixed(2) : 'NULL'
215+
tableData[4]['prop' + index] =
216+
item.lastMonthCount !== 0 ? (item.currentMonthCount / item.lastMonthCount).toFixed(2) : 'NULL'
205217
})
206218
}
207219

src/views/crm/statistics/performance/components/ContractPricePerformance.vue

Lines changed: 53 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,18 @@
77
</el-skeleton>
88
</el-card>
99

10-
<!-- 统计列表 -->
10+
<!-- 统计列表 TODO @scholar:统计列表的展示不对 -->
1111
<el-card shadow="never" class="mt-16px">
1212
<el-table v-loading="loading" :data="tableData">
13-
<el-table-column v-for="item in columnsData" :key="item.prop" :label="item.label" :prop="item.prop" align="center">
13+
<el-table-column
14+
v-for="item in columnsData"
15+
:key="item.prop"
16+
:label="item.label"
17+
:prop="item.prop"
18+
align="center"
19+
>
1420
<template #default="scope">
15-
{{scope.row[item.prop]}}
21+
{{ scope.row[item.prop] }}
1622
</template>
1723
</el-table-column>
1824
</el-table>
@@ -23,7 +29,7 @@ import { EChartsOption } from 'echarts'
2329
import {
2430
StatisticsPerformanceApi,
2531
StatisticsPerformanceRespVO
26-
} from "@/api/crm/statistics/performance"
32+
} from '@/api/crm/statistics/performance'
2733
2834
defineOptions({ name: 'ContractPricePerformance' })
2935
const props = defineProps<{ queryParams: any }>() // 搜索参数
@@ -86,29 +92,30 @@ const echartsOption = reactive<EChartsOption>({
8692
type: 'shadow'
8793
}
8894
},
89-
yAxis: [{
90-
type: 'value',
91-
name: '金额(元)',
92-
axisTick: {
93-
show: false
94-
},
95-
axisLabel: {
96-
color: '#BDBDBD',
97-
formatter: '{value}'
98-
},
99-
/** 坐标轴轴线相关设置 */
100-
axisLine: {
101-
lineStyle: {
102-
color: '#BDBDBD'
95+
yAxis: [
96+
{
97+
type: 'value',
98+
name: '金额(元)',
99+
axisTick: {
100+
show: false
101+
},
102+
axisLabel: {
103+
color: '#BDBDBD',
104+
formatter: '{value}'
105+
},
106+
/** 坐标轴轴线相关设置 */
107+
axisLine: {
108+
lineStyle: {
109+
color: '#BDBDBD'
110+
}
111+
},
112+
splitLine: {
113+
show: true,
114+
lineStyle: {
115+
color: '#e6e6e6'
116+
}
103117
}
104118
},
105-
splitLine: {
106-
show: true,
107-
lineStyle: {
108-
color: '#e6e6e6'
109-
}
110-
}
111-
},
112119
{
113120
type: 'value',
114121
name: '',
@@ -134,7 +141,8 @@ const echartsOption = reactive<EChartsOption>({
134141
color: '#e6e6e6'
135142
}
136143
}
137-
}],
144+
}
145+
],
138146
xAxis: {
139147
type: 'category',
140148
name: '日期',
@@ -152,9 +160,7 @@ const loadData = async () => {
152160
153161
// 2.1 更新 Echarts 数据
154162
if (echartsOption.xAxis && echartsOption.xAxis['data']) {
155-
echartsOption.xAxis['data'] = performanceList.map(
156-
(s: StatisticsPerformanceRespVO) => s.time
157-
)
163+
echartsOption.xAxis['data'] = performanceList.map((s: StatisticsPerformanceRespVO) => s.time)
158164
}
159165
if (echartsOption.series && echartsOption.series[0] && echartsOption.series[0]['data']) {
160166
echartsOption.series[0]['data'] = performanceList.map(
@@ -165,43 +171,49 @@ const loadData = async () => {
165171
echartsOption.series[1]['data'] = performanceList.map(
166172
(s: StatisticsPerformanceRespVO) => s.lastMonthCount
167173
)
168-
echartsOption.series[3]['data'] = performanceList.map(
169-
(s: StatisticsPerformanceRespVO) => s.lastMonthCount !== 0 ? (s.currentMonthCount / s.lastMonthCount*100).toFixed(2) : 'NULL'
174+
echartsOption.series[3]['data'] = performanceList.map((s: StatisticsPerformanceRespVO) =>
175+
s.lastMonthCount !== 0 ? ((s.currentMonthCount / s.lastMonthCount) * 100).toFixed(2) : 'NULL'
170176
)
171177
}
172178
if (echartsOption.series && echartsOption.series[2] && echartsOption.series[2]['data']) {
173179
echartsOption.series[2]['data'] = performanceList.map(
174180
(s: StatisticsPerformanceRespVO) => s.lastYearCount
175181
)
176-
echartsOption.series[4]['data'] = performanceList.map(
177-
(s: StatisticsPerformanceRespVO) => s.lastYearCount !== 0 ? (s.currentMonthCount / s.lastYearCount*100).toFixed(2) : 'NULL'
182+
echartsOption.series[4]['data'] = performanceList.map((s: StatisticsPerformanceRespVO) =>
183+
s.lastYearCount !== 0 ? ((s.currentMonthCount / s.lastYearCount) * 100).toFixed(2) : 'NULL'
178184
)
179185
}
180186
181187
// 2.2 更新列表数据
182188
list.value = performanceList
183189
loading.value = false
184-
185190
}
186191
187192
// 初始化数据
188-
const columnsData = reactive([]);
189-
const tableData = reactive([{title: '当月合同金额统计(元)'}, {title: '上月合同金额统计(元)'}, {title: '去年当月合同金额统计(元)'},
190-
{title: '同比增长率(%)'}, {title: '环比增长率(%)'}])
193+
const columnsData = reactive([])
194+
const tableData = reactive([
195+
{ title: '当月合同金额统计(元)' },
196+
{ title: '上月合同金额统计(元)' },
197+
{ title: '去年当月合同金额统计(元)' },
198+
{ title: '同比增长率(%)' },
199+
{ title: '环比增长率(%)' }
200+
])
191201
192202
// 定义 init 方法
193203
const init = () => {
194-
const columnObj = {label: '日期', prop: 'title'}
204+
const columnObj = { label: '日期', prop: 'title' }
195205
columnsData.push(columnObj)
196206
197207
list.value.forEach((item, index) => {
198-
const columnObj = {label: item.time, prop: 'prop' + index}
208+
const columnObj = { label: item.time, prop: 'prop' + index }
199209
columnsData.push(columnObj)
200210
tableData[0]['prop' + index] = item.currentMonthCount
201211
tableData[1]['prop' + index] = item.lastMonthCount
202212
tableData[2]['prop' + index] = item.lastYearCount
203-
tableData[3]['prop' + index] = item.lastYearCount !== 0 ? (item.currentMonthCount / item.lastYearCount).toFixed(2) : 'NULL'
204-
tableData[4]['prop' + index] = item.lastMonthCount !== 0 ? (item.currentMonthCount / item.lastMonthCount).toFixed(2) : 'NULL'
213+
tableData[3]['prop' + index] =
214+
item.lastYearCount !== 0 ? (item.currentMonthCount / item.lastYearCount).toFixed(2) : 'NULL'
215+
tableData[4]['prop' + index] =
216+
item.lastMonthCount !== 0 ? (item.currentMonthCount / item.lastMonthCount).toFixed(2) : 'NULL'
205217
})
206218
}
207219

0 commit comments

Comments
 (0)