|
|
|
@ -1,11 +1,10 @@
|
|
|
|
|
import React, { Children, useContext, useState } from 'react';
|
|
|
|
|
import React, { useContext } from 'react';
|
|
|
|
|
import { observer } from 'mobx-react';
|
|
|
|
|
import { stores_Context } from '../config';
|
|
|
|
|
import moment from 'moment';
|
|
|
|
|
import { SlackOutlined, SketchOutlined, AntCloudOutlined, RedditOutlined, GithubOutlined } from '@ant-design/icons';
|
|
|
|
|
import { Row, Col, Table, Select, Space, Typography, Progress, Spin, Divider, Button, Switch } from 'antd';
|
|
|
|
|
import { InfoCircleOutlined } from '@ant-design/icons';
|
|
|
|
|
import { Row, Col, Table, Tooltip } from 'antd';
|
|
|
|
|
import SearchForm from '../components/search/SearchForm';
|
|
|
|
|
import { cloneDeep, fixTo2Decimals, sortBy, isEmpty, pick } from '../utils/commons';
|
|
|
|
|
import { pick } from '../utils/commons';
|
|
|
|
|
|
|
|
|
|
const COLOR_SETS = [
|
|
|
|
|
"#FFFFFF",
|
|
|
|
@ -58,6 +57,7 @@ export default observer((props) => {
|
|
|
|
|
rowClassName: (record, rowIndex) => {
|
|
|
|
|
return record.groupType === 'operator' ? '': 'ant-tag-blue';
|
|
|
|
|
},
|
|
|
|
|
showSorterTooltip: false,
|
|
|
|
|
columns: [
|
|
|
|
|
{ title: '', dataIndex: 'groupsLabel', key: 'groupsLabel', width: '6rem',
|
|
|
|
|
filterSearch: true,
|
|
|
|
@ -68,18 +68,60 @@ export default observer((props) => {
|
|
|
|
|
title: '顾问动作',
|
|
|
|
|
key: 'date',
|
|
|
|
|
children: [
|
|
|
|
|
{ title: '首次响应率24H', dataIndex: 'firstTouch24', key: 'firstTouch24', render: percentageRender,
|
|
|
|
|
{ title: () => (
|
|
|
|
|
<>
|
|
|
|
|
首次响应率24H{' '}
|
|
|
|
|
<Tooltip title="达到24H内回复的订单数/总订单数">
|
|
|
|
|
<InfoCircleOutlined />
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</>
|
|
|
|
|
), dataIndex: 'firstTouch24', key: 'firstTouch24', render: percentageRender,
|
|
|
|
|
sorter: (a, b) => tableSorter(a, b, 'firstTouch24'),
|
|
|
|
|
},
|
|
|
|
|
{ title: '48H内报价率', dataIndex: 'firstQuote48', key: 'firstQuote48',render: percentageRender ,
|
|
|
|
|
{ title: () => (
|
|
|
|
|
<>
|
|
|
|
|
48H内报价率{' '}
|
|
|
|
|
<Tooltip title="达到48H内报价的订单数/总订单数">
|
|
|
|
|
<InfoCircleOutlined />
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</>
|
|
|
|
|
), dataIndex: 'firstQuote48', key: 'firstQuote48',render: percentageRender ,
|
|
|
|
|
sorter: (a, b) => tableSorter(a, b, 'firstQuote48'), },
|
|
|
|
|
{ title: '一次报价率', dataIndex: 'quote1', key: 'quote1',render: percentageRender ,
|
|
|
|
|
{ title: () => (
|
|
|
|
|
<>
|
|
|
|
|
一次报价率{' '}
|
|
|
|
|
<Tooltip title="首次报价的订单数/总订单数">
|
|
|
|
|
<InfoCircleOutlined />
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</>
|
|
|
|
|
), dataIndex: 'quote1', key: 'quote1',render: percentageRender ,
|
|
|
|
|
sorter: (a, b) => tableSorter(a, b, 'quote1'), },
|
|
|
|
|
{ title: '二次报价率', dataIndex: 'quote2', key: 'quote2',render: percentageRender ,
|
|
|
|
|
{ title: () => (
|
|
|
|
|
<>
|
|
|
|
|
二次报价率{' '}
|
|
|
|
|
<Tooltip title="二次报价的订单数/一次报价后回复数">
|
|
|
|
|
<InfoCircleOutlined />
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</>
|
|
|
|
|
), dataIndex: 'quote2', key: 'quote2',render: percentageRender ,
|
|
|
|
|
sorter: (a, b) => tableSorter(a, b, 'quote2'), },
|
|
|
|
|
{ title: '>50条会话', dataIndex: 'turnsGT50', key: 'turnsGT50', render: percentageRender ,
|
|
|
|
|
{ title: () => (
|
|
|
|
|
<>
|
|
|
|
|
>50条会话{' '}
|
|
|
|
|
<Tooltip title=">50条会话的订单数/总订单">
|
|
|
|
|
<InfoCircleOutlined />
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</>
|
|
|
|
|
), dataIndex: 'turnsGT50', key: 'turnsGT50', render: percentageRender ,
|
|
|
|
|
sorter: (a, b) => tableSorter(a, b, 'turnsGT50'), },
|
|
|
|
|
{ title: '违规数', dataIndex: 'violations', key: 'violations',
|
|
|
|
|
{ title: () => (
|
|
|
|
|
<>
|
|
|
|
|
违规数{' '}
|
|
|
|
|
<Tooltip title="未遵循24H回复的订单数">
|
|
|
|
|
<InfoCircleOutlined />
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</>
|
|
|
|
|
), dataIndex: 'violations', key: 'violations',
|
|
|
|
|
sorter: (a, b) => tableSorter(a, b, 'violations'), },
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
@ -88,28 +130,56 @@ export default observer((props) => {
|
|
|
|
|
key: 'department',
|
|
|
|
|
children: [
|
|
|
|
|
{
|
|
|
|
|
title: '首次回复率24H', dataIndex: 'firstReply24', key: 'firstReply24',
|
|
|
|
|
title: () => (
|
|
|
|
|
<>
|
|
|
|
|
首次回复率24H{' '}
|
|
|
|
|
<Tooltip title="达到24H内回复的订单数/总订单数">
|
|
|
|
|
<InfoCircleOutlined />
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</>
|
|
|
|
|
), dataIndex: 'firstReply24', key: 'firstReply24',
|
|
|
|
|
render: (_, r) => ({
|
|
|
|
|
props: { style: { backgroundColor: COLOR_SETS[1]+transparentHex } },
|
|
|
|
|
children: percentageRender(_),
|
|
|
|
|
}),
|
|
|
|
|
sorter: (a, b) => tableSorter(a, b, 'firstReply24'), },
|
|
|
|
|
{
|
|
|
|
|
title: '48H内报价回复率', dataIndex: 'replyQuote48', key: 'replyQuote48',
|
|
|
|
|
title: () => (
|
|
|
|
|
<>
|
|
|
|
|
48H内报价回复率{' '}
|
|
|
|
|
<Tooltip title="48H内报价后的回复数/报价的订单数">
|
|
|
|
|
<InfoCircleOutlined />
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</>
|
|
|
|
|
), dataIndex: 'replyQuote48', key: 'replyQuote48',
|
|
|
|
|
render: (_, r) => ({
|
|
|
|
|
props: { style: { backgroundColor: COLOR_SETS[1]+transparentHex } },
|
|
|
|
|
children: percentageRender(_),
|
|
|
|
|
}),
|
|
|
|
|
sorter: (a, b) => tableSorter(a, b, 'replyQuote48'), },
|
|
|
|
|
{
|
|
|
|
|
title: '一次报价回复率', dataIndex: 'replyQuote1', key: 'replyQuote1',
|
|
|
|
|
title: () => (
|
|
|
|
|
<>
|
|
|
|
|
一次报价回复率{' '}
|
|
|
|
|
<Tooltip title="一次报价后回复率/订单总数">
|
|
|
|
|
<InfoCircleOutlined />
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</>
|
|
|
|
|
), dataIndex: 'replyQuote1', key: 'replyQuote1',
|
|
|
|
|
render: (_, r) => ({
|
|
|
|
|
props: { style: { backgroundColor: COLOR_SETS[1]+transparentHex } },
|
|
|
|
|
children: percentageRender(_),
|
|
|
|
|
}),
|
|
|
|
|
sorter: (a, b) => tableSorter(a, b, 'replyQuote1'), },
|
|
|
|
|
{
|
|
|
|
|
title: '二次报价回复率', dataIndex: 'replyQuote2', key: 'replyQuote2',
|
|
|
|
|
title: () => (
|
|
|
|
|
<>
|
|
|
|
|
二次报价回复率{' '}
|
|
|
|
|
<Tooltip title="二次报价后回复数/一次报价后回复数">
|
|
|
|
|
<InfoCircleOutlined />
|
|
|
|
|
</Tooltip>
|
|
|
|
|
</>
|
|
|
|
|
), dataIndex: 'replyQuote2', key: 'replyQuote2',
|
|
|
|
|
render: (_, r) => ({
|
|
|
|
|
props: { style: { backgroundColor: COLOR_SETS[1]+transparentHex } },
|
|
|
|
|
children: percentageRender(_),
|
|
|
|
@ -127,6 +197,7 @@ export default observer((props) => {
|
|
|
|
|
rowClassName: (record, rowIndex) => {
|
|
|
|
|
return record.groupType === 'operator' ? '': 'ant-tag-blue';
|
|
|
|
|
},
|
|
|
|
|
showSorterTooltip: false,
|
|
|
|
|
columns: [
|
|
|
|
|
{ title: '', dataIndex: 'groupsLabel', key: 'groupsLabel', width: '6rem',
|
|
|
|
|
filterSearch: true,
|
|
|
|
|