feat: 单位性质统计

config/routes.js

@@ -231,6 +231,11 @@ export default [
             path: '/statistic/customer/source',
             name: 'source',
             component: './Statistic/Customer/Source'
+          },
+          {
+            path: '/statistic/customer/nature',
+            name: 'nature',
+            component: './Statistic/Customer/Nature'
           }
         ]
       }

src/locales/zh-CN/menu.js

@@ -50,5 +50,6 @@ export default {
   'menu.statistic.product.receivables': '应收款统计',
   'menu.statistic.customer': '客户数据',
   'menu.statistic.customer.additions': '客户新增',
-  'menu.statistic.customer.source': '客户来源'
+  'menu.statistic.customer.source': '客户来源',
+  'menu.statistic.customer.nature': '单位性质'
 }

src/pages/Statistic/Customer/Nature/index.tsx

@@ -0,0 +1,111 @@
+import BasicTable from '@/components/Table'
+import consts from '@/consts'
+import { queryNatureList } from '@/services/statistic'
+import { disabledDate } from '@/utils/utils'
+import { PageContainer } from '@ant-design/pro-layout'
+import { Pie } from '@ant-design/charts'
+import { DatePicker, Table } from 'antd'
+import dayjs from 'dayjs'
+import React, { useRef, useState } from 'react'
+import OptionSelect from '../../components/OptionSelect'
+
+const Nature = () => {
+  const [state, setState] = useState({
+    params: {
+      optionType: 'singleStaff',
+      dataIds: [],
+      priceType: 'client',
+      startMonth: [dayjs(new Date()), dayjs(new Date())]
+    },
+    list: []
+  })
+
+  const tRef = useRef(null)
+
+  const handleOptionChange = (type, ids) =>
+    setState({ ...state, params: { ...state.params, optionType: type, dataIds: ids } })
+
+  const columnConfig = {
+    data: state.list.map(item => ({ type: item.name, value: item.count })),
+    appendPadding: 10,
+    angleField: 'value',
+    colorField: 'type',
+    radius: 0.9,
+    legend: {
+      flipPage: false
+    },
+    interactions: [{ type: 'element-active' }],
+    color: ['#40B7E6', '#79CE67', '#FBD743', '#ED9978', '#B8E641', '#E641B8', '#E67041', '#41E6C3']
+  }
+
+  const columns = [
+    {
+      dataIndex: 'name',
+      title: '服务方式',
+      align: 'center'
+    },
+    {
+      dataIndex: 'count',
+      title: '数量',
+      align: 'center',
+      render: text => <div className="text-right">{text}</div>
+    }
+  ]
+  return (
+    <PageContainer title={false} breadcrumb={false} waterMarkProps={{ offsetTop: 111 }}>
+      <div className="flex flex-col">
+        <div className="flex flex-row justify-between mb-4">
+          <div className="card-transition bg-white w-full h-250px">
+            {state.list?.length ? <Pie {...columnConfig} /> : null}
+          </div>
+        </div>
+        <BasicTable
+          search={false}
+          columns={columns}
+          actionRef={tRef}
+          rowkey="ID"
+          params={state.params}
+          pagination={false}
+          bordered
+          toolbar={{
+            title: [<OptionSelect onChange={handleOptionChange} type="Source" key="ID" multiple={false} />],
+            actions: [
+              <DatePicker.RangePicker
+                picker="month"
+                key="DatePicker"
+                allowClear={false}
+                disabledDate={current => disabledDate(current, 'month')}
+                value={state.params.startMonth}
+                onChange={val => setState({ ...state, params: { ...state.params, startMonth: val } })}
+              />
+            ]
+          }}
+          request={async params => {
+            const {
+              code = -1,
+              data: { list, sum }
+            } = await queryNatureList({ ...params })
+            setState({ ...state, sum, list })
+            return {
+              data: list,
+              success: code === consts.RET_CODE.SUCCESS,
+              total: list?.length || 0
+            }
+          }}
+          summary={data =>
+            data?.length ? (
+              <>
+                <Table.Summary.Row>
+                  <Table.Summary.Cell className="text-center">小计</Table.Summary.Cell>
+                  <Table.Summary.Cell className="text-right">{state.sum}</Table.Summary.Cell>
+                </Table.Summary.Row>
+              </>
+            ) : null
+          }
+        />
+      </div>
+    </PageContainer>
+  )
+}
+
+export default Nature

src/pages/Statistic/Customer/Source/index.tsx

@@ -36,6 +36,9 @@ const Source = () => {
     angleField: 'value',
     colorField: 'type',
     radius: 0.9,
+    legend: {
+      flipPage: false
+    },
     interactions: [{ type: 'element-active' }],
     color: ['#40B7E6', '#79CE67', '#FBD743', '#ED9978', '#B8E641', '#E641B8', '#E67041', '#41E6C3']
   }