zls

config/routes.js

@@ -904,6 +904,12 @@ export default [
                 hideInMenu: true,
                 component: './qrcode/qrcodelist/add',
               },   
+              {
+                path: '/qrcode/qrcodelist/dataRecord',
+                name: '数据记录',
+                hideInMenu: true,
+                component: './qrcode/qrcodelist/dataRecord',
+              },   
             ],
           },
           // {

src/pages/qrcode/qrcodelist/add.jsx

@@ -0,0 +1,92 @@
+import React, { useState, useEffect } from 'react';
+import { Form, Input, Button, Switch, Icon, Select, Option, message, Table, Divider, Tag, Pagination, Modal, DatePicker, Row, Col } from 'antd';
+import router from 'umi/router';
+import moment from 'moment';
+import AuthButton from '@/components/AuthButton';
+import BuildSelect from '@/components/SelectButton/BuildSelect2'
+import ChannelSelect from '@/components/SelectButton/channelSelect'
+import QrcodeType from './components/qrcodeType'
+import QrText from './components/qrText'
+import apis from '../../../services/apis';
+import request from '../../../utils/request';
+
+
+
+const header = props => {
+
+    // const id = props.location.query.id
+
+    const [data, setData] = useState({})
+
+    const [visible, setVisible] = useState(true)
+
+    useEffect(() => {
+
+    }, [])
+
+    function handleSubmit(e) {
+        e.preventDefault();
+        props.form.validateFields((err, values) => {
+            if (!err) {
+                console.log(values)
+            }
+        }
+        )
+    }
+
+    // switch
+    function onChange(checked) {
+        console.log(`switch to ${checked}`);
+        setVisible(checked)
+    }
+
+
+    const { getFieldDecorator } = props.form
+
+    return (
+
+        <>
+            <Form labelCol={{ span: 7 }} wrapperCol={{ span: 12 }} onSubmit={handleSubmit}>
+                <Form.Item label="是否关联项目">
+                    {getFieldDecorator('channelName', {
+                        initialValue: true,
+                        rules: [{ required: true, message: '' }],
+                    })(<Switch onChange={onChange} defaultChecked />)}
+                </Form.Item>
+                {visible && <Form.Item label="关联项目">
+                    {getFieldDecorator('aaa', {
+                        rules: [{ required: true, message: '' }],
+                    })(<BuildSelect />)}
+                </Form.Item>}
+                <Form.Item label="二维码内容类型">
+                    {getFieldDecorator('333', {
+                        rules: [{ required: true, message: '' }],
+                    })(<QrcodeType visible={visible} ></QrcodeType>)}
+                </Form.Item>
+                <Form.Item label="二维码内容">
+                    {getFieldDecorator('444', {
+                        rules: [{ required: true, message: '' }],
+                    })(<QrText />)}
+                </Form.Item>
+                <Form.Item label="是否关联项目">
+                    {getFieldDecorator('chan555nelName')(
+                        <ChannelSelect />,
+                    )}
+                </Form.Item>
+
+                <Form.Item wrapperCol={{ span: 15, offset: 8 }}>
+                    <div style={{ width: '190px' }}>
+                        <Button type="primary" htmlType="submit">保存</Button>
+                        <Button onClick={() => router.go(-1)} htmlType="submit">取消</Button>
+                    </div>
+                </Form.Item>
+            </Form>
+
+        </>
+    )
+}
+
+
+
+const WrappedNormalLoginForm = Form.create({ name: 'header' })(header);
+export default WrappedNormalLoginForm

src/pages/qrcode/qrcodelist/components/qrText.jsx

@@ -0,0 +1,98 @@
+import React, { useState, useEffect, useMemo } from 'react';
+import { Button, Form, Modal, Pagination, Table, Input } from 'antd';
+import Navigate from '@/components/Navigate';
+import EditIcon from '@/components/EditIcon';
+
+
+const name = '324'
+
+const data = [
+    {
+        id: '12',
+        title: '234',
+    },
+]
+const qrText = props => {
+    const {
+        value,
+        onChange,
+        ...rest
+      } = props;
+    // const [data, setData] = useState([])
+    const [visible, setVisible] = useState(false);
+    const [info, setInfo] = useState({ title: value });
+
+    useEffect(() => {
+        // value?useState
+    }, [])
+
+    function handleSubmit(e) {
+        e.preventDefault();
+        props.form.validateFields((err, values) => {
+            if (!err) {
+                console.log(values)
+            }
+        }
+        )
+    }
+
+    const onChoice = e => {
+        setInfo(e)
+        setVisible(false)
+        onChange(e.id)
+    }
+
+    const columns = [
+
+        {
+            title: '标题',
+            dataIndex: 'title',
+            key: 'title',
+            align: 'center',
+
+        },
+
+        {
+            title: '操作',
+            dataIndex: '',
+            key: '2',
+            align: 'center',
+            render: (text, record) => (<EditIcon type="start" text="选择" onClick={() => onChoice(record)}></EditIcon>),
+        },
+    ];
+
+
+    const { getFieldDecorator } = props.form
+
+    return (
+        <>
+            <div>{info.title} <Navigate onClick={() => setVisible(true)}>请选择</Navigate></div>
+
+            <Modal
+                title="请选择"
+                visible={visible}
+                onCancel={() => setVisible(false)}
+                footer={[]}
+                width="500px"
+            >
+                <Form layout="inline" onSubmit={e => handleSubmit(e, props)}>
+                    <Form.Item>
+                        {getFieldDecorator('contractTemplateName')(
+                            <Input placeholder="请输入标题" />,
+                        )}
+                    </Form.Item>
+                    <Form.Item>
+                        <Button type="primary" htmlType="submit" >搜索 </Button>
+                        {/* <Button style={{ marginLeft: 8 }} onClick={handleReset}>重置</Button> */}
+                    </Form.Item>
+                </Form>
+                <Table columns={columns} dataSource={data} pagination={false} />
+                {/* <Pagination defaultCurrent={1} total={dataInfo.total} onChange={e => changePageNum(e)} current={dataInfo.current} /> */}
+            </Modal>
+        </>
+
+    )
+}
+const WrappedQrText = Form.create({ name: 'qrText' })(qrText);
+
+export default WrappedQrText

src/pages/qrcode/qrcodelist/components/qrcodeType.jsx

@@ -0,0 +1,83 @@
+import React, { useMemo } from 'react';
+import { Select } from 'antd';
+
+const { Option } = Select;
+
+
+const qrcodeType = props => {
+    //   const [data, setData] = useState([])
+    //   useEffect(() => {
+
+    //   }, [props.value])
+    // const visible2 = props.visible || true
+    const all = props.all || false
+
+    const visible = useMemo(() => (props.visible), [props.visible]);
+    console.log(visible, '123213')
+
+    const data = [
+        {
+            name: '项目',
+            value: '1',
+            visible: true,
+        },
+        {
+            name: '报名活动',
+            value: '2',
+            visible: true,
+        },
+        {
+            name: '助力活动',
+            value: '3',
+            visible: true,
+        },
+        {
+            name: '拼团活动',
+            value: '4',
+            visible: true,
+        },
+        {
+            name: 'H5活动',
+            value: '5',
+            visible,
+        },
+        {
+            name: '直播活动',
+            value: '6',
+            visible,
+        },
+        {
+            name: '资讯',
+            value: '7',
+            visible: true,
+        },
+        {
+            name: '在线选房',
+            value: '8',
+            visible: true,
+        },
+    ]
+
+
+    return (
+        // <>234</>
+        <Select
+            showSearch
+            value={props.value}
+            style={{ width: '250px' }}
+            placeholder="请选择二维码内容类型"
+            onChange={props.onChange}
+            // filterOption={(input, option) =>
+            //     // eslint-disable-next-line max-len
+            //     option.props.children && option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
+            // }
+        >
+            {all && <Option key="" value="">全部类型</Option>}
+            {data.map(Item => (
+
+                Item.visible ? <Option key={Item.vlaue} value={Item.value}> {Item.name} </Option> : ''
+            ))}
+        </Select>
+    )
+}
+export default qrcodeType

src/pages/qrcode/qrcodelist/dataRecord.jsx

@@ -0,0 +1,109 @@
+import React, { useState, useEffect } from 'react';
+import { Input, Menu, Dropdown, Button, Icon, Modal, message, Table, Divider, Tabs, Tag, Select, Pagination } from 'antd';
+import router from 'umi/router';
+import apis from '../../../services/apis';
+import request from '../../../utils/request';
+import Visitors from './table/visitors'
+import VisitNum from './table/visitNum'
+import Newuser from './table/newuser'
+import moment from 'moment';
+
+const { TabPane } = Tabs;
+
+
+
+const DataRecord = props => {
+
+    const [tab, setTab] = useState('1')
+    const [data, setData] = useState({})
+    const [showHelp, setShowHelp] = useState(false)
+
+    useEffect(() => {
+
+        // getData({ id: id, type: type })
+
+    }, [])
+
+    const getData = (params) => {
+
+        // request({ ...apis.activityDataStatis.getStatisticData, params: { ...params, } }).then((data) => {
+        //     console.log(data)
+        //     setData(data || {})
+        // })
+    }
+
+    function tabsCallback(e) {
+
+        setTab(e)
+    }
+
+    return <>
+        <div>
+            <div>
+            <Icon type="question-circle" theme="filled" style={{ fontSize: '25px', color: '#F00', marginLeft: '30px' }} onClick={() => setShowHelp(true)} />
+          <Modal
+            title="指标说明（数据会存在一定时间延迟）"
+            centered
+            visible={showHelp}
+            footer={null}
+            onCancel={() => setShowHelp(false)}
+          >
+              <p style={{ fontSize: '0.106rem', color: '#333', marginBottom: '8px' }}>新增注册用户：</p>
+            <p style={{ fontSize: '0.106rem', color: '#999', marginBottom: '8px' }}>通过当前二维码授权手机号的总人数</p>
+            <p style={{ fontSize: '0.106rem', color: '#333', marginBottom: '8px' }}>访问人数：</p>
+            <p style={{ fontSize: '0.106rem', color: '#999', marginBottom: '8px' }}>通过当前二维码访问小程序的总人数</p>
+            <p style={{ fontSize: '0.106rem', color: '#333', marginBottom: '8px' }}>访问次数：</p>
+            <p style={{ fontSize: '0.106rem', color: '#999', marginBottom: '8px' }}>通过当前二维码访问小程序的总次数</p>
+          </Modal>
+                <Button style={{ float: 'right', zIndex: 1 }} onClick={() => router.go(-1)}>
+                    返回
+               </Button>
+            </div>
+            <div>
+
+                <div style={{ display: 'flex', marginBottom: '33px', marginTop: '20px' }}>
+                    <div style={{
+                        textAlign: 'center', display: 'flex', justifyContent: 'center', lineHeight: '100px', background: 'linear-gradient(144deg,rgba(241,43,62,1) 0%,rgba(254,144,155,1) 100%)', height: '100px',
+                        borderRadius: '12px', width: '32%', marginRight: '15px'
+                    }}>
+                        <span style={{ fontSize: '20px', color: '#fff' }}>访问总人数 </span>
+                        <span style={{ fontSize: '46px', color: '#fff', marginLeft: '26px', fontFamily: 'fantasy' }}>{data.visitPersons || '0'}</span>
+                    </div>
+                    <div style={{
+                        textAlign: 'center', display: 'flex', justifyContent: 'center', lineHeight: '100px', background: 'linear-gradient(144deg,rgba(255,126,74,1) 0%,rgba(255,196,168,1) 100%)', height: '100px',
+                        borderRadius: '12px', width: '32%', marginRight: '15px'
+                    }}>
+                        <span style={{ fontSize: '20px', color: '#fff' }}>访问总次数 </span>
+                        <span style={{ fontSize: '46px', color: '#fff', marginLeft: '26px', fontFamily: 'fantasy' }}>{data.visitNum || '0'}</span>
+                    </div>
+                    <div style={{
+                        textAlign: 'center', display: 'flex', justifyContent: 'center', lineHeight: '100px', background: 'linear-gradient(137deg,rgba(107,130,230,1) 0%,rgba(152,175,251,1) 100%)', height: '100px',
+                        borderRadius: '12px', width: '32%', marginRight: '15px'
+                    }}>
+                        <span style={{ fontSize: '20px', color: '#fff' }}>新增注册用户 </span>
+                        <span style={{ fontSize: '46px', color: '#fff', marginLeft: '26px', fontFamily: 'fantasy' }}>{data.newPersons || '0'}</span>
+                    </div>
+                </div>
+            </div>
+
+        </div>
+        <div>
+            <Tabs type="card" value={tab} buttonStyle="solid" onChange={e => tabsCallback(e)}>
+                <TabPane tab="访问人数" key="1" ></TabPane>
+                <TabPane tab="访问次数" key="2" ></TabPane>
+                <TabPane tab="新增注册用户" key="3" ></TabPane>
+            </Tabs>
+            <div style={{ marginTop: '20px' }}>
+                {/* 访问人数 */}
+                {(tab === '1' && <Visitors />)}
+                {/* 访问次数 */}
+                {(tab === '2' && <VisitNum />)}
+                {/* 新增注册用户 */}
+                {(tab === '3' && <Newuser />)}
+
+            </div>
+        </div>
+    </>
+}
+
+export default DataRecord

src/pages/qrcode/qrcodelist/index.jsx

@@ -7,7 +7,6 @@ import withActions from '@/components/ActionList';
 import EditIcon from '@/components/EditIcon';
 import Navigate from '@/components/Navigate';
 import styles from '../../style/GoodsList.less';
-import SelectCity from '../../../components/SelectButton/CitySelect'
 import BuildSelect from '@/components/SelectButton/BuildSelect'
 import ChannelSelect from '@/components/SelectButton/channelSelect'
 import apis from '../../../services/apis';
@@ -15,11 +14,13 @@ import request from '../../../utils/request';
 
 // import RaiseHelpDoc from '../edit/components/RaiseHelpDoc';
 
+const data = [{
+    id: '1',
+}]
 
-
-const header = props => {
-    const [data, setData] = useState()
-
+const qrcodelist = props => {
+    // const [data, setData] = useState([])
+    const [showHelp, setShowHelp] = useState(false)
 
     // 查询列表
     //   const getList = params => {
@@ -34,13 +35,17 @@ const header = props => {
     //     getList({ pageNum: 1, pageSize: 10 });
     //   }, [])
 
-    //   const toAdd = rowData => () => {
-    //     router.push({
-    //       pathname: '/eContract/template/add',
-    //     });
-    //   }
-
+    const toAdd = () => {
+        router.push({
+            pathname: '/qrcode/qrcodelist/add',
+        });
+    }
 
+    const toDataRecord = () => {
+        router.push({
+            pathname: '/qrcode/qrcodelist/dataRecord',
+        });
+    }
 
     /**
      *
@@ -48,45 +53,74 @@ const header = props => {
      * @param {*} props
      * @returns
      */
-    //   const columns = [
-    //     {
-    //       title: '合同标题',
-    //       dataIndex: 'contractTemplateName',
-    //       key: 'contractTemplateName',
-    //       align: 'center',
-    //       render:  (x, row) => <Navigate onClick={toDetail(row)}>{row.contractTemplateName}</Navigate>,
-    //     },
-    //     {
-    //       title: '新增时间',
-    //       dataIndex: 'createDate',
-    //       key: 'createDate',
-    //       align: 'center',
-    //       render: (x, row) => <><span>{`${moment(row.createDate).format('YYYY-MM-DD HH:mm:ss')}`}</span></>,
-    //     },
-    //     {
-    //       title: '操作',
-    //       dataIndex: '',
-    //       key: '',
-    //       align: 'center',
-    //       render: withActions((text, record) => [(
-    //           <AuthButton name="admin.eContractTemplate.detail.get" noRight={null}>
-    //             <EditIcon type="look" text="查看详情" onClick={toDetail(record)}></EditIcon>
-    //           </AuthButton>
-    //       ),])
-    //     },
-    //   ];
+    const columns = [
+        {
+            title: '二维码',
+            dataIndex: 'contractTemplateName',
+            key: 'contractTemplateName',
+            align: 'center',
+            render: (x, row) => <Navigate >{row.contractTemplateName}</Navigate>,
+        },
+        {
+            title: '二维码内容',
+            dataIndex: 'createDate',
+            key: 'createDate',
+            align: 'center',
+
+        },
+        {
+            title: '二维码类型',
+            dataIndex: 'createDate',
+            key: 'createDate',
+            align: 'center',
+
+        },
+        {
+            title: '关联项目',
+            dataIndex: 'createDate',
+            key: 'createDate',
+            align: 'center',
+
+        },
+        {
+            title: '关联渠道',
+            dataIndex: 'createDate',
+            key: 'createDate',
+            align: 'center',
+
+        },
+        {
+            title: '创建时间',
+            dataIndex: 'createDate',
+            key: 'createDate',
+            align: 'center',
+
+        },
+        {
+            title: '操作',
+            dataIndex: '',
+            key: '',
+            align: 'center',
+            render: withActions((text, record) => [
+                <EditIcon type="download" text="下载二维码" ></EditIcon>,
+
+                <EditIcon type="data" text="数据" onClick={() => toDataRecord(record.id)} ></EditIcon>,
+
+            ]),
+        },
+    ];
 
 
     //   const changePageNum = pageNumber => {
     //     getList({ pageNum: pageNumber, pageSize: 10, ...props.form.getFieldsValue() })
     //   }
 
-    //   const rowSelection = {
-    //     onChange: (selectedRowKeys, selectedRows) => {
-    //       console.log('selectedRowKeys:', selectedRowKeys, 'selectedRows: ', selectedRows);
-    //       setContractList(selectedRows)
-    //     },
-    //   };
+    const rowSelection = {
+        onChange: (selectedRowKeys, selectedRows) => {
+            console.log('selectedRowKeys:', selectedRowKeys, 'selectedRows: ', selectedRows);
+            //   setContractList(selectedRows)
+        },
+    };
 
     //   // 提交事件
     //   const handleSubmit = e => {
@@ -109,8 +143,7 @@ const header = props => {
     return (
 
         <>
-            <div>234</div>
-            <Form layout="inline" onSubmit={e => handleSubmit(e)}>
+            <Form layout="inline" style={{ marginBottom: '10px' }} onSubmit={e => handleSubmit(e)}>
                 <Form.Item>
                     {getFieldDecorator('qrcodetype')(
                         <Input
@@ -141,18 +174,33 @@ const header = props => {
                 </Form.Item>
             </Form>
 
-                <Button type="danger" >新增</Button>
+            <Button type="danger" onClick={() => toAdd()}>新增</Button>
+
+            <Button type="primary" style={{ marginLeft: '30px' }}>删除</Button>
+            <Icon type="question-circle" theme="filled" style={{ fontSize: '25px', color: '#F00', marginLeft: '30px' }} onClick={() => setShowHelp(true)} />
+            <Modal
+                title="相关说明"
+                centereds
+                visible={showHelp}
+                footer={null}
+                onCancel={() => setShowHelp(false)}
+                width="700px"
+            >
+                <p style={{ fontSize: '0.106rem', color: '#333', marginBottom: '8px' }}>1、支持为小程序中的项目、活动、资讯生成单独的二维码，用于渠道投放；</p>
+                <p style={{ fontSize: '0.106rem', color: '#333', marginBottom: '8px' }}>2、同一个活动需要投放多个渠道时，需要生成多个二维码；</p>
+                <p style={{ fontSize: '0.106rem', color: '#333', marginBottom: '8px' }}>3、点击每个二维码列表的“数据记录”可查看对应的获客记录</p>
+
 
-                <Button type="primary" style={{ marginLeft: '30px' }}>删除</Button>
+            </Modal>
 
-            {/* <Table rowSelection={rowSelection}
-       dataSource={data.records} columns={columns} pagination={false} rowKey={r => r.contractTemplateId} />
-      <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: '30px' }}>
+            <Table rowSelection={rowSelection}
+                dataSource={data} columns={columns} pagination={false} rowKey={r => r.id} />
+            {/* <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: '30px' }}>
         <Pagination showQuickJumper defaultCurrent={1} total={data.total} onChange={e => changePageNum(e)} current={data.current}/>
       </div> */}
         </>
     )
 }
-const WrappedHeader = Form.create({ name: 'header' })(header);
+const WrappedQrcodelist = Form.create({ name: 'qrcodelist' })(qrcodelist);
 
-export default WrappedHeader
+export default WrappedQrcodelist

src/pages/qrcode/qrcodelist/table/newuser.jsx

@@ -0,0 +1,97 @@
+import React, { useState, useEffect } from 'react';
+import { Form, Input, Button, Icon, Select, message, Table, Divider, Tag, Pagination, Modal, DatePicker } from 'antd';
+import router from 'umi/router';
+import apis from '../../../../services/apis';
+import request from '../../../../utils/request';
+import AuthButton from '../../../../components/AuthButton';
+import WxDictSelect from '@/components/SelectButton/WxDictSelect';
+import moment from 'moment';
+
+
+const newuser = props => {
+  const [showHelp, setShowHelp] = useState(false)
+  const [data, setData] = useState({})
+
+
+  useEffect(() => {
+    // console.log(activityId, activityType)
+    // getList({ pageNum: 1, pageSize: 10 })
+
+  }, [])
+
+  const getList = params => {
+    // console.log(params)
+    // request({ ...apis.activityDataStatis.activityAddRegist, params: { ...params, activityId: activityId, activityType: activityType, ...date } }).then(data => {
+    //   console.log(data)
+    //   props.getData()
+    //   setData(data)
+    // }).catch(e => {
+    //   console.log(e)
+    // })
+  }
+
+  const columns = [
+    {
+      title: '姓名',
+      dataIndex: 'nickName',
+      key: 'nickName',
+    },
+    {
+      title: '电话',
+      dataIndex: 'phone',
+      key: 'phone',
+    },
+    {
+      title: '性别',
+      dataIndex: 'gender',
+      key: 'gender',
+    },
+    {
+      title: '归属地',
+      dataIndex: 'province',
+      key: 'province',
+    },
+    {
+      title: '注册时间',
+      dataIndex: 'visitDate',
+      key: 'visitDate',
+      render: (x, row) => <><span>{`${moment(row.visitDate).format('YYYY-MM-DD HH:mm:ss')}`}</span></>,
+    },
+  ]
+
+
+  const changePageNum = pageNumber => {
+    getList({ pageNum: pageNumber, pageSize: 10, ...props.form.getFieldsValue() })
+  }
+
+
+  const exportActivityStats = () => {
+
+    request({ ...apis.activityDataStatis.activityAddRegistNumExport, params: { activityId: activityId, activityType: activityType, ...props.form.getFieldsValue(), ...date } }).then(data => {
+      if (!data) {
+        return
+      }
+      const url = window.URL.createObjectURL(new Blob([data]))
+      const link = document.createElement('a')
+      link.style.display = 'none'
+      link.href = url
+      link.setAttribute('download', '访问统计.xlsx')
+      document.body.append(link)
+      link.click()
+    }).catch()
+  }
+
+  return <>
+    <div>
+      <div>
+        <Button type="primary" style={{ float: 'right', marginBottom: '20px', zIndex: 1 }} onClick={exportActivityStats}>导出</Button>
+      </div>
+      <Table style={{ marginTop: '30px' }} dataSource={data.records} columns={columns} pagination={false} rowKey="activityList" />
+      <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: '30px' }}>
+        <Pagination showQuickJumper defaultCurrent={1} total={data.total} onChange={changePageNum} current={data.current} />
+      </div>
+    </div>
+  </>
+}
+
+export default newuser

src/pages/qrcode/qrcodelist/table/visitNum.jsx

@@ -0,0 +1,102 @@
+import React, { useState, useEffect } from 'react';
+import { Form, Input, Button, Icon, Select, message, Table, Divider, Tag, Pagination, Modal, DatePicker } from 'antd';
+import router from 'umi/router';
+import apis from '../../../../services/apis';
+import request from '../../../../utils/request';
+import AuthButton from '../../../../components/AuthButton';
+import WxDictSelect from '@/components/SelectButton/WxDictSelect';
+import moment from 'moment';
+
+const visitNum = props => {
+  const [data, setData] = useState({})
+
+
+  useEffect(() => {
+    // console.log(activityId, activityType)
+    // getList({ pageNum: 1, pageSize: 10 })
+
+  }, [])
+
+  const getList = params => {
+    // console.log(params)
+    // request({ ...apis.activityDataStatis.activityVisitNum, params: { ...params, activityId: activityId, activityType: activityType, ...date } }).then(data => {
+    //   console.log(data)
+    //   props.getData()
+    //   setData(data)
+    // }).catch(e => {
+    //   console.log(e)
+    // })
+  }
+
+
+  const columns = [
+    {
+      title: '姓名',
+      dataIndex: 'nickName',
+      key: 'nickName',
+    },
+    {
+      title: '电话',
+      dataIndex: 'phone',
+      key: 'phone',
+    },
+    {
+      title: '性别',
+      dataIndex: 'gender',
+      key: 'gender',
+    },
+    {
+      title: '归属地',
+      dataIndex: 'province',
+      key: 'province',
+    },
+    {
+      title: '访问时间',
+      dataIndex: 'visitDate',
+      key: 'visitDate',
+      render: (x, row) => <><span>{`${moment(row.visitDate).format('YYYY-MM-DD HH:mm:ss')}`}</span></>,
+    },
+  ]
+
+
+  const changePageNum = pageNumber => {
+    getList({ pageNum: pageNumber, pageSize: 10, ...props.form.getFieldsValue() })
+  }
+
+
+
+  const exportActivityStats = () => {
+
+    request({ ...apis.activityDataStatis.activityVisitNumExport, params: { activityId: activityId, activityType: activityType, ...props.form.getFieldsValue(), ...date } }).then(data => {
+      if (!data) {
+        return
+      }
+      const url = window.URL.createObjectURL(new Blob([data]))
+      const link = document.createElement('a')
+      link.style.display = 'none'
+      link.href = url
+      link.setAttribute('download', '访问统计.xlsx')
+      document.body.append(link)
+      link.click()
+    }).catch()
+  }
+
+  return <>
+    <div>
+      <div>
+
+
+        <Button type="primary" style={{ float: 'right', marginBottom: '20px', zIndex: 1 }} onClick={exportActivityStats} >
+          导出
+            </Button>
+
+      </div>
+      <Table style={{ marginTop: '30px' }} dataSource={data.records} columns={columns} pagination={false} rowKey="activityList" />
+      <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: '30px' }}>
+        <Pagination showQuickJumper defaultCurrent={1} total={data.total} onChange={changePageNum} current={data.current} />
+      </div>
+    </div>
+  </>
+}
+
+export default visitNum

src/pages/qrcode/qrcodelist/table/visitors.jsx

@@ -0,0 +1,117 @@
+import React, { useState, useEffect } from 'react';
+import { Form, Input, Button, Icon, Select, message, Table, Divider, Tag, Pagination, Modal, DatePicker } from 'antd';
+import router from 'umi/router';
+import apis from '../../../../services/apis';
+import request from '../../../../utils/request';
+import AuthButton from '../../../../components/AuthButton';
+import WxDictSelect from '@/components/SelectButton/WxDictSelect';
+import moment from 'moment';
+
+
+
+const visitors = props => {
+
+  // const [id,type] = props
+
+  const [data, setData] = useState({})
+
+
+  useEffect(() => {
+
+    // getList({ pageNum: 1, pageSize: 10 })
+
+  }, [])
+
+  const getList = params => {
+    console.log(params)
+    // request({ ...apis.activityDataStatis.activityVisitPersonNum, params: { ...params, activityId: activityId, activityType: activityType, ...date } }).then(data => {
+    //   console.log(data)
+    //   props.getData()
+    //   setData(data)
+    // }).catch(e => {
+    //   console.log(e)
+    // })
+  }
+
+  // getTableList () {
+
+  //   console.log(formData)
+  //   request({ ...apis.activityDataStatis.activityVisitPersonNum, params: formData }).then(data => {
+  //     console.log(data)
+  //     this.setState({ tableData: data.records, total: data.total})
+  //   }).catch()
+  // }
+
+  const columns = [
+    {
+      title: '姓名',
+      dataIndex: 'nickName',
+      key: 'nickName',
+    },
+    {
+      title: '电话',
+      dataIndex: 'phone',
+      key: 'phone',
+    },
+    {
+      title: '性别',
+      dataIndex: 'gender',
+      key: 'gender',
+    },
+    {
+      title: '归属地',
+      dataIndex: 'province',
+      key: 'province',
+    },
+    {
+      title: '访问次数',
+      dataIndex: 'visitNum',
+      key: 'visitNum',
+    },
+  ]
+
+
+  const changePageNum = pageNumber => {
+    getList({ pageNum: pageNumber, pageSize: 10, ...props.form.getFieldsValue() })
+  }
+
+
+
+  const exportActivityStats = () => {
+
+    request({ ...apis.activityDataStatis.activityVisitPersonNumExport, params: { activityId: activityId, activityType: activityType, ...props.form.getFieldsValue(), ...date } }).then(data => {
+      if (!data) {
+        return
+      }
+      const url = window.URL.createObjectURL(new Blob([data]))
+      const link = document.createElement('a')
+      link.style.display = 'none'
+      link.href = url
+      link.setAttribute('download', '访问统计.xlsx')
+      document.body.append(link)
+      link.click()
+    }).catch()
+  }
+
+
+  return <>
+    <div >
+
+      <div>
+
+
+        <Button type="primary" style={{ float: 'right', marginBottom: '20px', zIndex: 1 }} onClick={exportActivityStats}>
+          导出
+            </Button>
+
+      </div>
+      <Table style={{ marginTop: '30px' }} dataSource={data.records} columns={columns} pagination={false} rowKey="activityList" />
+      <div style={{ display: 'flex', justifyContent: 'flex-end', marginTop: '30px' }}>
+        <Pagination showQuickJumper defaultCurrent={1} total={data.total} onChange={changePageNum} current={data.current} />
+      </div>
+    </div>
+  </>
+}
+
+
+export default visitors