up

config/routes.ts

@@ -4,7 +4,60 @@ export default [
     layout: false,
     routes: [{ name: '登录', path: '/user/login', component: './User/Login' }],
   },
-  { path: '/dashboard', access: 'dashboardQuery', name: '仪表盘', icon: 'home', component: './Dashboard' },
+  { 
+    path: '/dashboard',
+    access: 'dashboardQuery',
+    name: '仪表盘',
+    icon: 'home',
+    routes: [
+      {
+        path: '',
+        component: './Dashboard',
+      },
+      {
+        name: '商户浏览排行',
+        path: 'business-views',
+        hideInMenu: true,
+        component: './Dashboard/BusinessViews',
+      },
+      {
+        name: '渠道商家数',
+        path: 'channel-statistics',
+        hideInMenu: true,
+        component: './Dashboard/ChannelStatistics',
+      },
+      {
+        name: '扫码人明细',
+        path: 'scan-detail',
+        hideInMenu: true,
+        component: './Dashboard/ScanDetail',
+      },
+    ],    
+  },
+  { 
+    path: '/operations-dashboard',
+    access: 'dashboardQuery',
+    name: '运营看板',
+    icon: 'dashboard',
+    routes: [
+      {
+        path: '',
+        component: './OperationsDashboard',
+      },
+      {
+        name: '注册商家明细',
+        path: 'business-detail',
+        hideInMenu: true,
+        component: './OperationsDashboard/BusinessDetail',
+      },
+      {
+        name: '注册商品明细',
+        path: 'product-detail',
+        hideInMenu: true,
+        component: './OperationsDashboard/ProductDetail',
+      }
+    ],    
+  },
   {
     name: '用户管理',
     path: '/user-list',

src/constants.ts

@@ -98,6 +98,13 @@ const Constants = {
     0: '卖家',
     1: '买家'
   },
+  /**
+   * 新老客
+   */
+  pbcMembersType: {
+    0: '新客',
+    1: '老客'
+  },
   /**
    * 会员来源渠道
    */
@@ -114,6 +121,14 @@ const Constants = {
     1: '港澳居民来往内地通行证',
     2: '台湾居民来往大陆通行证'
   },
+  /**
+   * 访问来源
+   */
+  pbcVisitSourceEnum: {
+    qrcode: '二维码',
+    link: '链接',
+    share: '分享'
+  },
   // 手机正则
   PHONE_PATTERN: /^(?:(0\d{2,3}-)?\d{7,8}|1[3-9]\d{9})$/,
   //邮箱正则

src/pages/Dashboard/BusinessViews.tsx

@@ -0,0 +1,116 @@
+import {
+  pbcUsersPageUsingPost,
+} from '@/services/pop-b2b2c/pbcUsersController';
+import { ActionType, ProColumns, ProTable } from '@ant-design/pro-components';
+import { PageContainer } from '@ant-design/pro-layout';
+import { Link, useAccess } from '@umijs/max';
+import React, { useRef } from 'react';
+
+/**
+ * 查询表格
+ * @param param0
+ */
+const fetchData = async (params: API.PageVO) => {
+  const msg = await pbcUsersPageUsingPost(params);
+  return {
+    data: msg.data?.records,
+    total: msg.data?.total,
+    success: msg.retcode,
+  } as any;
+};
+
+// eslint-disable-next-line @typescript-eslint/ban-types
+const TableList: React.FC<{}> = () => {
+  const actionRef = useRef<ActionType>();
+  const access: any = useAccess();
+
+  const columns: ProColumns<API.PbcBusiness>[] = [
+    {
+      title: '浏览次数',
+      dataIndex: 'pbcBusinessName',
+      search: false
+    },
+    {
+      title: '商户编号',
+      dataIndex: 'pbcBusinessCode',
+      search: false
+    },
+    {
+      title: '商户名称',
+      dataIndex: 'pbcBusinessName',
+    },
+    {
+      title: '联系人',
+      width: 100,
+      dataIndex: 'pbcBusinessContact',
+      search: false
+    },
+    {
+      title: '商户手机号',
+      width: 110,
+      dataIndex: 'pbcBusinessContactMobile',
+      search: false
+    },
+    {
+      title: '主营品类',
+      dataIndex: 'pbcBusinessMainCategory',
+      ellipsis: true,
+      search: false,
+    },
+    {
+      title: '注册日期',
+      dataIndex: 'pbcCreateAt',
+      width: 150,
+      valueType: 'dateTimeRange',
+      render: (text, record) => record.pbcCreateAt,
+    },
+    {
+      title: '商户等级',
+      width: 80,
+      dataIndex: 'pbcBusinessLevel',
+      search: false
+    },
+    {
+      title: '操作',
+      fixed: 'right',
+      width: 140,
+      valueType: 'option',
+      render: (text, record) => (
+        <Link to={`/business/detail/${record.pbcId}?isEdit=0`}>详情</Link>
+      ),
+    },
+  ];
+  return (
+    <PageContainer
+      header={{
+        title: '',
+        breadcrumb: {},
+      }}
+    >
+      <ProTable<API.PbcBusiness>
+        columns={columns}
+        actionRef={actionRef}
+        request={fetchData}
+        rowKey="pbcId"
+        size="small"
+        bordered
+        search={{
+          labelWidth: 'auto',
+          span: 6,
+        }}
+        pagination={{
+          defaultPageSize: 20,
+          showSizeChanger: true,
+        }}
+        scroll={{
+          y: 'calc(100vh - 320px)',
+        }}
+        dateFormatter="string"
+        options={false}
+        toolBarRender={() => []}
+      />
+    </PageContainer>
+  );
+};
+
+export default TableList;

src/pages/Dashboard/ChannelStatistics.tsx

@@ -0,0 +1,86 @@
+import Constants from '@/constants';
+import {
+    pbcUsersPageUsingPost,
+  } from '@/services/pop-b2b2c/pbcUsersController';
+  import { ActionType, ProColumns, ProTable } from '@ant-design/pro-components';
+  import { PageContainer } from '@ant-design/pro-layout';
+  import React, { useRef } from 'react';
+  
+  /**
+   * 查询表格
+   * @param param0
+   */
+  const fetchData = async (params: API.PageVO) => {
+    const msg = await pbcUsersPageUsingPost(params);
+    return {
+      data: msg.data?.records,
+      total: msg.data?.total,
+      success: msg.retcode,
+    } as any;
+  };
+  
+  // eslint-disable-next-line @typescript-eslint/ban-types
+  const TableList: React.FC<{}> = () => {
+    const actionRef = useRef<ActionType>();
+  
+    const columns: ProColumns<API.PbcBusiness>[] = [
+      {
+        title: '商户编号',
+        dataIndex: 'pbcBusinessCode',
+        search: false
+      },
+      {
+        title: '商户名称',
+        dataIndex: 'pbcBusinessName',
+        search: false
+      },
+      {
+        title: '渠道',
+        dataIndex: 'pbcVisitSourceEnum',
+        valueType: 'select',
+        valueEnum: Constants.pbcVisitSourceEnum
+      },
+      {
+        title: '访问时间',
+        dataIndex: 'pbcCreateAt',
+        width: 150,
+        hideInTable: true,
+        valueType: 'dateTimeRange',
+        render: (text, record) => record.pbcCreateAt,
+      },
+    ];
+    return (
+      <PageContainer
+        header={{
+          title: '',
+          breadcrumb: {},
+        }}
+      >
+        <ProTable<API.PbcBusiness>
+          columns={columns}
+          actionRef={actionRef}
+          request={fetchData}
+          rowKey="pbcId"
+          size="small"
+          bordered
+          search={{
+            labelWidth: 'auto',
+            span: 6,
+          }}
+          pagination={{
+            defaultPageSize: 20,
+            showSizeChanger: true,
+          }}
+          scroll={{
+            y: 'calc(100vh - 320px)',
+          }}
+          dateFormatter="string"
+          options={false}
+          toolBarRender={() => []}
+        />
+      </PageContainer>
+    );
+  };
+  
+  export default TableList;
+  

src/pages/Dashboard/ScanDetail.tsx

@@ -0,0 +1,100 @@
+import Constants from '@/constants';
+import {
+  pbcUsersPageUsingPost,
+} from '@/services/pop-b2b2c/pbcUsersController';
+import { handlePageQuery } from '@/utils/utils';
+import { ActionType, ProColumns, ProTable } from '@ant-design/pro-components';
+import { PageContainer } from '@ant-design/pro-layout';
+import React, { useRef } from 'react';
+
+/**
+ * 查询表格
+ * @param param0
+ */
+const fetchData = async (params: API.PageVO) => {
+  const msg = await pbcUsersPageUsingPost(params);
+  return {
+    data: msg.data?.records,
+    total: msg.data?.total,
+    success: msg.retcode,
+  } as any;
+};
+
+// eslint-disable-next-line @typescript-eslint/ban-types
+const TableList: React.FC<{}> = () => {
+  const actionRef = useRef<ActionType>();
+
+  const columns: ProColumns<API.PbcUsers>[] = [
+    {
+      title: '人员名称',
+      dataIndex: 'pbcUserNickName',
+      search: false
+    },
+    {
+      title: '手机号',
+      dataIndex: 'pbcUserMobile',
+      search: false
+    },
+    {
+      title: '新老客',
+      dataIndex: 'pbcVipGradeName',
+      valueType: 'select',
+      valueEnum: Constants.pbcMembersType
+    },
+    {
+      title: '扫码时间',
+      dataIndex: 'pbcCreateAt',
+      valueType: 'dateTimeRange',
+      render: (text, record) => record.pbcCreateAt
+    },
+  ];
+  return (
+    <PageContainer
+      header={{
+        title: '',
+        breadcrumb: {},
+      }}
+    >
+      <ProTable<API.PbcUsers>
+        columns={columns}
+        actionRef={actionRef}
+        request={(param: any) => {
+          console.log(param)
+          let hasUserType = false
+          if (param.pbcUserType) {
+            param.pbcUserType = parseInt(param.pbcUserType)
+            hasUserType = true
+          }
+          const queryParam = handlePageQuery(param);
+          if (!hasUserType && queryParam.filters) {
+            queryParam.filters.push({
+              key: 'pbcUserType'.replace(/([A-Z])/g, '_$1').toLowerCase(),
+              value: 1,
+              action: '<=',
+            });
+          }
+          return fetchData(queryParam);
+        }}
+        rowKey="pbcId"
+        size="small"
+        bordered
+        search={{
+          labelWidth: 'auto',
+          span: 6,
+        }}
+        pagination={{
+          defaultPageSize: 20,
+          showSizeChanger: true,
+        }}
+        scroll={{
+          y: 'calc(100vh - 320px)',
+        }}
+        dateFormatter="string"
+        options={false}
+        toolBarRender={() => []}
+      />
+    </PageContainer>
+  );
+};
+
+export default TableList;

src/pages/Dashboard/index.tsx

@@ -5,6 +5,7 @@ import { PageContainer, ProCard, ProForm, ProFormDateRangePicker, ProFormGroup,
 import { Card, Col, DatePickerProps, Row, Spin, Statistic } from 'antd';
 import React, { useEffect, useRef, useState } from 'react';
 import { querySearchKeyRankUsingPost } from '@/services/pop-b2b2c/pbcSearchKeyController';
+import { history, Link } from '@umijs/max';
 
 const Welcome: React.FC = () => {
 
@@ -231,6 +232,9 @@ const Welcome: React.FC = () => {
             <Card title="扫码情况" bodyStyle={{ display: 'flex', justifyContent: 'space-between' }} bordered={false}>
               <Statistic title="扫码次数" valueStyle={{ color: '#3f8600', fontSize: 30 }} value={pbcScanCodeStatical.pbcScanNumber || 0} />
               <Statistic title="扫码人数" valueStyle={{ color: '#3f8600', fontSize: 30 }} value={pbcScanCodeStatical.pbcScanUserNumber || 0} />
+              <Link to="/dashboard/scan-detail">
+                <Statistic title="新老客扫码>" valueStyle={{ color: '#3f8600', fontSize: 30 }} value={pbcScanCodeStatical.pbcScanUserNumber || 0} />
+              </Link>
             </Card>
           </Col>
           <Col span={8}>
@@ -242,13 +246,22 @@ const Welcome: React.FC = () => {
         </Row>
         <Row style={{ marginBottom: 12 }} gutter={16}>
           <Col span={12}>
-            <Card title="商户浏览量排行" bordered={false}>
+            <Card title="商户浏览量排行" extra={
+              <Link to="/dashboard/business-views">{'更多>>'}</Link>
+            } bordered={false}>
               <Bar {...config} data={data1} />
             </Card>
           </Col>
           <Col span={12}>
             <Card title="浏览量入口占比" bordered={false}>
-              <Pie {...pieConfig} />
+              <Pie {...pieConfig} onReady={(plot) => {
+                plot.on('plot:click', (evt: { x: any; y: any; }) => {
+                  const { x, y } = evt;
+                  const tooltipData = plot.chart.getTooltipItems({ x, y });
+                  console.log(tooltipData);
+                  history.push('/dashboard/channel-statistics')
+                });
+              }} />
             </Card>
           </Col>
         </Row>

src/pages/OperationsDashboard/BusinessDetail.tsx

@@ -0,0 +1,111 @@
+import Constants from '@/constants';
+import {
+  pbcUsersPageUsingPost,
+} from '@/services/pop-b2b2c/pbcUsersController';
+import { ActionType, ProColumns, ProTable } from '@ant-design/pro-components';
+import { PageContainer } from '@ant-design/pro-layout';
+import { Link, useAccess } from '@umijs/max';
+import React, { useRef } from 'react';
+
+/**
+ * 查询表格
+ * @param param0
+ */
+const fetchData = async (params: API.PageVO) => {
+  const msg = await pbcUsersPageUsingPost(params);
+  return {
+    data: msg.data?.records,
+    total: msg.data?.total,
+    success: msg.retcode,
+  } as any;
+};
+
+// eslint-disable-next-line @typescript-eslint/ban-types
+const TableList: React.FC<{}> = () => {
+  const actionRef = useRef<ActionType>();
+  const access: any = useAccess();
+
+  const columns: ProColumns<API.PbcBusiness>[] = [
+    {
+      title: '商户编号',
+      dataIndex: 'pbcBusinessCode',
+      search: false
+    },
+    {
+      title: '商户名称',
+      dataIndex: 'pbcBusinessName',
+    },
+    {
+      title: '联系人',
+      width: 100,
+      dataIndex: 'pbcBusinessContact',
+      search: false
+    },
+    {
+      title: '商户手机号',
+      width: 110,
+      dataIndex: 'pbcBusinessContactMobile',
+      search: false
+    },
+    {
+      title: '商户类别',
+      dataIndex: 'pbcBusinessType',
+      width: 80,
+      valueType: 'select',
+      search: false,
+      valueEnum: Constants.pbcBusinessType,
+    },
+    {
+      title: '主营品类',
+      dataIndex: 'pbcBusinessMainCategory',
+      ellipsis: true,
+      search: false,
+    },
+    {
+      title: '注册日期',
+      dataIndex: 'pbcCreateAt',
+      width: 150,
+      valueType: 'dateTimeRange',
+      render: (text, record) => record.pbcCreateAt,
+    },
+    {
+      title: '商户等级',
+      width: 80,
+      dataIndex: 'pbcBusinessLevel',
+      search: false
+    },
+  ];
+  return (
+    <PageContainer
+      header={{
+        title: '',
+        breadcrumb: {},
+      }}
+    >
+      <ProTable<API.PbcBusiness>
+        columns={columns}
+        actionRef={actionRef}
+        request={fetchData}
+        rowKey="pbcId"
+        size="small"
+        bordered
+        search={{
+          labelWidth: 'auto',
+          span: 6,
+        }}
+        pagination={{
+          defaultPageSize: 20,
+          showSizeChanger: true,
+        }}
+        scroll={{
+          y: 'calc(100vh - 320px)',
+        }}
+        dateFormatter="string"
+        options={false}
+        toolBarRender={() => []}
+      />
+    </PageContainer>
+  );
+};
+
+export default TableList;

src/pages/OperationsDashboard/ProductDetail.tsx

@@ -0,0 +1,114 @@
+import Constants from '@/constants';
+import { listAdminTreeUsingGet } from '@/services/pop-b2b2c/pbcCategoryController';
+import {
+  pbcUsersPageUsingPost,
+} from '@/services/pop-b2b2c/pbcUsersController';
+import { ActionType, ProColumns, ProTable } from '@ant-design/pro-components';
+import { PageContainer } from '@ant-design/pro-layout';
+import React, { useRef } from 'react';
+
+/**
+ * 查询表格
+ * @param param0
+ */
+const fetchData = async (params: API.PageVO) => {
+  const msg = await pbcUsersPageUsingPost(params);
+  return {
+    data: msg.data?.records,
+    total: msg.data?.total,
+    success: msg.retcode,
+  } as any;
+};
+
+// eslint-disable-next-line @typescript-eslint/ban-types
+const TableList: React.FC<{}> = () => {
+  const actionRef = useRef<ActionType>();
+
+  const columns: ProColumns<API.PbcProduct>[] = [
+    {
+      title: '商品类目',
+      dataIndex: 'pbcProductCategoryId',
+      hideInTable: true,
+      valueType: 'cascader',
+      fieldProps: {
+        fieldNames: { label: 'pbcCategoryName', value: 'pbcId', children: 'children' },
+      },
+      request: async () => {
+        const msg = await listAdminTreeUsingGet({ type: 2 });
+        if (msg.retcode && msg.data) {
+          return msg.data;
+        }
+        return [];
+      },
+    },
+    {
+      title: '商品大类',
+      dataIndex: 'pbcProductTopCategoryName',
+      search: false,
+    },
+    {
+      title: '商品中类',
+      dataIndex: 'pbcProductParentCategoryName',
+      search: false,
+    },
+    {
+      title: '商品小类',
+      dataIndex: 'pbcProductCategoryName',
+      search: false,
+    },
+    {
+      title: '商品名称',
+      dataIndex: 'pbcProductTitle',
+    },
+    {
+      title: '价格',
+      dataIndex: 'pbcProductPrice',
+      search: false,
+    },
+    {
+      title: '所属商户',
+      dataIndex: 'pbcBusinessName',
+      search: false,
+    },
+    {
+      title: '状态',
+      dataIndex: 'pbcState',
+      valueType: 'select',
+      search: false,
+      valueEnum: Constants.pbcProductState,
+    },
+  ];
+  return (
+    <PageContainer
+      header={{
+        title: '',
+        breadcrumb: {},
+      }}
+    >
+      <ProTable<API.PbcBusiness>
+        columns={columns}
+        actionRef={actionRef}
+        request={fetchData}
+        rowKey="pbcId"
+        size="small"
+        bordered
+        search={{
+          labelWidth: 'auto',
+          span: 6,
+        }}
+        pagination={{
+          defaultPageSize: 20,
+          showSizeChanger: true,
+        }}
+        scroll={{
+          y: 'calc(100vh - 320px)',
+        }}
+        dateFormatter="string"
+        options={false}
+        toolBarRender={() => []}
+      />
+    </PageContainer>
+  );
+};
+
+export default TableList;

src/pages/OperationsDashboard/index.tsx

@@ -0,0 +1,114 @@
+import { queryAllRoleUsingPost } from '@/services/pop-b2b2c/pbcRoleController';
+import {
+  pbcUsersPageUsingPost,
+} from '@/services/pop-b2b2c/pbcUsersController';
+import { handlePageQuery } from '@/utils/utils';
+import { ActionType, ProColumns, ProTable } from '@ant-design/pro-components';
+import { PageContainer } from '@ant-design/pro-layout';
+import React, { useRef } from 'react';
+
+/**
+ * 查询表格
+ * @param param0
+ */
+const fetchData = async (params: API.PageVO) => {
+  const msg = await pbcUsersPageUsingPost(params);
+  return {
+    data: msg.data?.records,
+    total: msg.data?.total,
+    success: msg.retcode,
+  } as any;
+};
+
+// eslint-disable-next-line @typescript-eslint/ban-types
+const TableList: React.FC<{}> = () => {
+  const actionRef = useRef<ActionType>();
+
+  const columns: ProColumns<API.PbcUsers>[] = [
+    {
+      title: '人员姓名',
+      dataIndex: 'pbcUserNickName'
+    },
+    {
+      title: '手机号',
+      dataIndex: 'pbcUserMobile',
+      search: false
+    },
+    {
+      title: '角色',
+      dataIndex: 'pbcUserRole',
+      valueType: 'select',
+      request: async () => {
+        const msg = await queryAllRoleUsingPost();
+        if (msg.retcode && msg.data) {
+          return msg.data.map((e) => {
+            return {
+              label: e.roleName,
+              value: e.pbcId,
+            };
+          });
+        }
+        return [];
+      },
+    },
+    {
+      title: '注册商家数',
+      dataIndex: 'pbcUserMobile',
+      search: false
+    },
+    {
+      title: '上传商品数',
+      dataIndex: 'pbcUserMobile',
+      search: false
+    },
+  ];
+  return (
+    <PageContainer
+      header={{
+        title: '',
+        breadcrumb: {},
+      }}
+    >
+      <ProTable<API.PbcUsers>
+        columns={columns}
+        actionRef={actionRef}
+        request={(param: any) => {
+          console.log(param)
+          let hasUserType = false
+          if (param.pbcUserType) {
+            param.pbcUserType = parseInt(param.pbcUserType)
+            hasUserType = true
+          }
+          const queryParam = handlePageQuery(param);
+          if (!hasUserType && queryParam.filters) {
+            queryParam.filters.push({
+              key: 'pbcUserType'.replace(/([A-Z])/g, '_$1').toLowerCase(),
+              value: 1,
+              action: '<=',
+            });
+          }
+          return fetchData(queryParam);
+        }}
+        rowKey="pbcId"
+        size="small"
+        bordered
+        search={{
+          labelWidth: 'auto',
+          span: 6,
+        }}
+        pagination={{
+          defaultPageSize: 20,
+          showSizeChanger: true,
+        }}
+        scroll={{
+          y: 'calc(100vh - 320px)',
+        }}
+        dateFormatter="string"
+        options={false}
+        toolBarRender={() => []}
+      />
+    </PageContainer>
+  );
+};
+
+export default TableList;