Browse Source

conversion

许静 5 years ago
parent
commit
729cd57a94

+ 24
- 0
config/routes.js View File

28
             name: '首页',
28
             name: '首页',
29
             component: './Welcome',
29
             component: './Welcome',
30
           },
30
           },
31
+          {
32
+            path: '/indexEcharts',
33
+            name: '图表管理',
34
+            component: '../layouts/BlankLayout',
35
+            hideInMenu: true,
36
+            routes: [
37
+              {
38
+                path: '/indexEcharts/userSource',
39
+                name: '用户来源',
40
+                component: './indexEcharts/userSource',
41
+              },
42
+              {
43
+                path: '/indexEcharts/newUsers',
44
+                name: '新增用户',
45
+                component: './indexEcharts/newUsers',
46
+              },
47
+
48
+              {
49
+                path: '/indexEcharts/userBehavior',
50
+                name: '用户行为',
51
+                component: './indexEcharts/userBehavior',
52
+              },
53
+            ],
54
+          },
31
           {
55
           {
32
             path: '/building',
56
             path: '/building',
33
             name: '项目管理',
57
             name: '项目管理',

+ 39
- 48
src/pages/indexEcharts/components/UserConversion.jsx View File

9
 
9
 
10
 import styles from '../styles.less'
10
 import styles from '../styles.less'
11
 
11
 
12
-const UserSource = (props) => {
13
 
12
 
14
-  const [data, setData] = useState({ records: [] })
15
-  const [theStatis, settheStatis] = useState({ records: [] })
16
-  const [Current, setTheCurrent] = useState({ records: [] })
13
+const UserSource = props => {
17
 
14
 
15
+  const [theCurrent, setTheCurrent] = useState({ records: [] })
18
 
16
 
19
   useEffect(() => {
17
   useEffect(() => {
20
     UserConversionRate({ conversion: 'authorization_phone' })
18
     UserConversionRate({ conversion: 'authorization_phone' })
21
   }, [])
19
   }, [])
22
 
20
 
23
-  function UserConversionRate(params) {
24
-    request({
25
-      ...apis.indexEcharts.userConversion,
26
-      params,
27
-    }).then((data) => {
28
-      console.log(data, "data")
29
-      setData(data)
30
-    })
21
+ function UserConversionRate(params) {
22
+      request({
23
+        ...apis.indexEcharts.userConversion,
24
+        params,
25
+      }).then(data => {
26
+        // console.log("data: ", data)
27
+        setDataset(data, params.conversion)
28
+      })
31
   }
29
   }
32
 
30
 
33
-  function setDataset(data) {
34
-
35
-    const { pvNum, ...other } = data['data_count']
31
+ function setDataset(data, theStatis) {
32
+    const { pvNum, ...other } = data.data_count
36
 
33
 
37
     // 获取第一个值
34
     // 获取第一个值
38
     let num = 0
35
     let num = 0
39
-    for (let v of Object.keys(other)) {
36
+    for (const v of Object.keys(other)) {
40
       num = other[v]
37
       num = other[v]
41
       break
38
       break
42
     }
39
     }
43
 
40
 
44
     if (pvNum < num) {
41
     if (pvNum < num) {
45
-      Current = []
42
+      setTheCurrent([])
46
     } else {
43
     } else {
47
-      Current = [
48
-        { name: getStatisName(), value: num },
44
+      setTheCurrent([
45
+        { name: getStatisName(theStatis), value: num },
49
         { name: '其余', value: pvNum - num },
46
         { name: '其余', value: pvNum - num },
50
-      ]
47
+      ])
51
     }
48
     }
52
-    console.log(Current, "Current")
53
-
54
-    // this.dataset[theStatis] = theCurrent
55
-
56
   }
49
   }
57
-  function getStatisName() {
58
-    const statisTypes = [
59
-      { label: '授权手机', value: 'authorization_phone' },
60
-      { label: '项目收藏', value: 'building_save' },
61
-      { label: '项目转发', value: 'building_share' },
62
-      { label: '活动收藏', value: 'activity_save' },
63
-      { label: '活动转发', value: 'activity_share' },
64
-      { label: '资讯收藏', value: 'news_save' },
65
-      { label: '资讯转发', value: 'news_share' },
66
-      { label: '活动报名', value: 'activity_sign' },
67
-
68
-    ]
69
-    return statisTypes.filter(x => x.value == theStatis)[0].label
50
+
51
+  function getStatisName(theStatis) {
52
+     const statisTypes = [
53
+    { label: '授权手机', value: 'authorization_phone' },
54
+    { label: '项目收藏', value: 'building_save' },
55
+    { label: '项目转发', value: 'building_share' },
56
+    { label: '活动收藏', value: 'activity_save' },
57
+    { label: '活动转发', value: 'activity_share' },
58
+    { label: '资讯收藏', value: 'news_save' },
59
+    { label: '资讯转发', value: 'news_share' },
60
+    { label: '活动报名', value: 'activity_sign' },
61
+
62
+  ]
63
+    return statisTypes.filter(x => x.value === theStatis)[0].label
70
   }
64
   }
71
 
65
 
72
   const options = {
66
   const options = {
77
       type: 'pie',
71
       type: 'pie',
78
       name: '转化率',
72
       name: '转化率',
79
       radius: ['34%', '52%'],
73
       radius: ['34%', '52%'],
80
-      data: Current,
81
-    
82
-    }
74
+      data: theCurrent,
75
+      // data:[ { name: '授权手机', value: 6 },
76
+      // { name: '其余', value: 5 },]
77
+    },
83
   }
78
   }
84
 
79
 
85
   function onChange(e) {
80
   function onChange(e) {
86
-    settheStatis(e)
87
-    UserConversionRate({ conversion: e }).then(res => {
88
-      console.log(data, "this")
89
-      setDataset(res)
90
-    })
81
+    UserConversionRate({ conversion: e })
91
   }
82
   }
92
   const piestyles = {
83
   const piestyles = {
93
     width: '100%',
84
     width: '100%',
97
   return (
88
   return (
98
     <>
89
     <>
99
       <div>
90
       <div>
100
-        <p style={{ fontSize: '0.12rem', fontWeight: '600' }}>转化率</p>
91
+      <p style={{ fontSize: '0.12rem', fontWeight: '600' }}>转化率</p>
101
 
92
 
102
         <Select
93
         <Select
103
           style={{ width: 200 }}
94
           style={{ width: 200 }}
121
 
112
 
122
     </>
113
     </>
123
   )
114
   )
124
-}
115
+ }
125
 
116
 
126
-export default UserSource;
117
+export default UserSource

+ 26
- 39
src/pages/indexEcharts/userSource.jsx View File

35
 
35
 
36
   const { RangePicker } = DatePicker;
36
   const { RangePicker } = DatePicker;
37
 
37
 
38
-  function onChangetime (dates, dateStrings) {
38
+  function onChangetime(dates, dateStrings) {
39
 
39
 
40
     daterange[1] = dateStrings[1]
40
     daterange[1] = dateStrings[1]
41
     daterange[0] = dateStrings[0]
41
     daterange[0] = dateStrings[0]
56
 
56
 
57
   }
57
   }
58
 
58
 
59
-  function onChange (e) {
59
+  function onChange(e) {
60
 
60
 
61
     // console.log(`radio checked:${e.target.value}`);
61
     // console.log(`radio checked:${e.target.value}`);
62
 
62
 
63
   }
63
   }
64
 
64
 
65
-  function datalist () {
65
+  function datalist() {
66
 
66
 
67
     setEndDate(daterange[1])
67
     setEndDate(daterange[1])
68
     setStartDate(daterange[0])
68
     setStartDate(daterange[0])
91
 
91
 
92
   // }
92
   // }
93
 
93
 
94
-  function onTabledatas (e) {
94
+  function onTabledatas(e) {
95
     const data = (e.data || []).reduce((acc, item, index) => {
95
     const data = (e.data || []).reduce((acc, item, index) => {
96
       const { date, fromName, count, registered } = item
96
       const { date, fromName, count, registered } = item
97
       const num = userType === 'registered' ? registered : count
97
       const num = userType === 'registered' ? registered : count
111
       title: '日期',
111
       title: '日期',
112
       dataIndex: 'label',
112
       dataIndex: 'label',
113
       key: 'label',
113
       key: 'label',
114
-      width: '20%',
114
+      width:'20%'
115
     },
115
     },
116
+    {
117
+      title: '名片分享',
118
+      dataIndex: '名片分享',
119
+      key: '名片分享',
120
+    },
121
+    {
122
+      title: '生成海报',
123
+      dataIndex: '生成海报',
124
+      key: '生成海报',
125
+    },
126
+    {
127
+      title: '小程序搜索',
128
+      dataIndex: '小程序搜索',
129
+      key: '小程序搜索',
130
+    },
131
+    {
132
+      title: '好友分享',
133
+      dataIndex: '好友分享',
134
+      key: '好友分享',
116
 
135
 
117
-    // {
118
-    //   title: '名片分享',
119
-    //   dataIndex: '名片分享',
120
-    //   key: '名片分享',
121
-    //   width: '16%'
122
-
123
-    // },
124
-    // {
125
-    //   title: '好友分享',
126
-    //   dataIndex: '好友分享',
127
-    //   key: '好友分享',
128
-    //   width: '16%'
129
-    // },
130
-    // {
131
-    //   title: '小程序搜索',
132
-    //   dataIndex: '小程序搜索',
133
-    //   key: '小程序搜索',
134
-    //   width: '16%'
135
-    // },
136
-    // {
137
-    //   title: '线下扫码',
138
-    //   dataIndex: '线下扫码',
139
-    //   key: '线下扫码',
140
-    //   width: '16%'
141
-    // },
142
-    // {
143
-    //   title: '群分享',
144
-    //   dataIndex: '群分享',
145
-    //   key: '群分享',
146
-    //   width: '16%'
147
-    // },
148
-
149
-
136
+    },
150
 
137
 
151
 
138
 
152
   ]
139
   ]
153
 
140
 
154
-  function handleSelectChange (e) {
141
+  function handleSelectChange(e) {
155
 
142
 
156
     console.log(e)
143
     console.log(e)
157
     setuserType(e)
144
     setuserType(e)

+ 2
- 2
src/utils/request.js View File

75
       });
75
       });
76
       throw new Error(response.statusText);
76
       throw new Error(response.statusText);
77
     } else {
77
     } else {
78
-      console.log('response: ', response)
79
-      console.log('response.headers: ', response.headers)
78
+      // console.log('response: ', response)
79
+      // console.log('response.headers: ', response.headers)
80
       const { code, data, message } = await response.clone().json();
80
       const { code, data, message } = await response.clone().json();
81
       if (code != 1000) {
81
       if (code != 1000) {
82
         notification.error({
82
         notification.error({