张延森 5 년 전
부모
커밋
e5fbb63de0

+ 20
- 1
src/config/api.js 파일 보기

160
     finishActivity:{
160
     finishActivity:{
161
       method:'put',
161
       method:'put',
162
       url: `${commPrefix}/buildingDynamic/finish`
162
       url: `${commPrefix}/buildingDynamic/finish`
163
-    }
163
+    },
164
+    setWeight: {
165
+      method:'put',
166
+      url: `${commPrefix}/buildingDynamic/weight`
167
+    },
164
   },
168
   },
165
   recommendCustomer:{
169
   recommendCustomer:{
166
     list:{
170
     list:{
349
       method:'get',
353
       method:'get',
350
       url: `${commPrefix}/selectConversion`
354
       url: `${commPrefix}/selectConversion`
351
     },
355
     },
356
+
357
+    newUser: {
358
+      method:'get',
359
+      url: `${commPrefix}/selectNewsUserCount`
360
+    }
352
   },
361
   },
362
+  bizEvent: {
363
+    dict: {
364
+      method:'get',
365
+      url: `${commPrefix}/tdBizEventType`
366
+    },
367
+    list: {
368
+      method:'get',
369
+      url: `${commPrefix}/tdBizEventType`
370
+    },
371
+  }
353
 }
372
 }
354
 export default apis
373
 export default apis

+ 1
- 1
src/layout/default/index.vue 파일 보기

19
         <router-view></router-view>
19
         <router-view></router-view>
20
       </el-main>
20
       </el-main>
21
       <el-footer class="noPadding">
21
       <el-footer class="noPadding">
22
-        <xm-footer company="荟房科技"/>
22
+        <xm-footer company="知与行"/>
23
       </el-footer>
23
       </el-footer>
24
     </el-container>
24
     </el-container>
25
   </el-container>
25
   </el-container>

+ 15
- 0
src/store/modules/activity.js 파일 보기

73
         })
73
         })
74
       })
74
       })
75
     },
75
     },
76
+    // 置顶
77
+    updateWeight(_, payload) {
78
+      return new Promise((resolve, reject) => {
79
+        request({
80
+          ...apis.activity.setWeight,
81
+          params: payload,
82
+        }).then((data) => {
83
+          resolve(data)
84
+        }).catch(({ message }) => {
85
+          if (typeof message === 'string') {
86
+            reject(message)
87
+          }
88
+        })
89
+      })
90
+    }
76
   },
91
   },
77
 }
92
 }

+ 2
- 3
src/store/modules/indexEcharts.js 파일 보기

55
     getNewsUserCount ({ commit }, payload) {
55
     getNewsUserCount ({ commit }, payload) {
56
       return new Promise((resolve, reject) => {
56
       return new Promise((resolve, reject) => {
57
         request({
57
         request({
58
-          ...apis.indexEcharts.newsUserCount,
58
+          ...apis.indexEcharts.newUser,
59
           params: payload,
59
           params: payload,
60
         }).then((data) => {
60
         }).then((data) => {
61
-          commit('updateNewsUserCount', data)
62
-          resolve(data)
61
+          resolve(data.selectNewsUserCount)
63
         }).catch((err) => {
62
         }).catch((err) => {
64
           const message = err.message || err.msg
63
           const message = err.message || err.msg
65
           if (typeof message === 'string') {
64
           if (typeof message === 'string') {

+ 1
- 1
src/store/system.js 파일 보기

5
   state: {
5
   state: {
6
     app: {
6
     app: {
7
       logo: '',
7
       logo: '',
8
-      name: '荟房科技',
8
+      name: '知与行',
9
       version: 1.0,
9
       version: 1.0,
10
     },
10
     },
11
     menus: [],
11
     menus: [],

+ 7
- 6
src/views/Login.vue 파일 보기

1
 <template>
1
 <template>
2
   <div class="login-form" @keyup.enter="submit">
2
   <div class="login-form" @keyup.enter="submit">
3
-    <xm-polygon color="#044281" :dots="800" class="xm-polygon" />
3
+    <!-- <xm-polygon color="#044281" :dots="800" class="xm-polygon" /> -->
4
     <el-container class="login-layout">
4
     <el-container class="login-layout">
5
       <el-main>
5
       <el-main>
6
         <div class="head">
6
         <div class="head">
7
           <div class="logo"></div>
7
           <div class="logo"></div>
8
           <div class="title">
8
           <div class="title">
9
-            <h2>欢迎使用荟房科技后台系统</h2>
9
+            <h2>欢迎使用营销云系统</h2>
10
           </div>
10
           </div>
11
         </div>
11
         </div>
12
         <div class="body">
12
         <div class="body">
18
             </el-form-item>
18
             </el-form-item>
19
             <el-form-item>
19
             <el-form-item>
20
               <el-row :gutter="10">
20
               <el-row :gutter="10">
21
-                <el-col :span="18">
21
+                <el-input class="large-input" v-model="formdata.password" placeholder="请输入密码"></el-input>
22
+                <!-- <el-col :span="18">
22
                   <el-input class="large-input" v-model="formdata.password" placeholder="请输入验证码">
23
                   <el-input class="large-input" v-model="formdata.password" placeholder="请输入验证码">
23
                     <xm-icon name="password" size="small" slot="prefix" :style="{ lineHeight: '36px' }"/>
24
                     <xm-icon name="password" size="small" slot="prefix" :style="{ lineHeight: '36px' }"/>
24
                   </el-input>
25
                   </el-input>
25
                 </el-col>
26
                 </el-col>
26
                 <el-col :span="4">
27
                 <el-col :span="4">
27
                   <el-button type="success">验证码</el-button>
28
                   <el-button type="success">验证码</el-button>
28
-                </el-col>
29
+                </el-col> -->
29
               </el-row>              
30
               </el-row>              
30
             </el-form-item>
31
             </el-form-item>
31
             <el-form-item>
32
             <el-form-item>
37
         </div>
38
         </div>
38
       </el-main>
39
       </el-main>
39
       <el-footer class="foot">
40
       <el-footer class="foot">
40
-        <xm-footer company="荟房科技" />
41
+        <xm-footer company="知与行" />
41
       </el-footer>
42
       </el-footer>
42
     </el-container>
43
     </el-container>
43
   </div>
44
   </div>
51
   name: 'login',
52
   name: 'login',
52
   components: {
53
   components: {
53
     xmFooter: () => import('@/components/XMFooter.vue'),
54
     xmFooter: () => import('@/components/XMFooter.vue'),
54
-    xmPolygon: () => import('@/components/XMPolygon.vue'),
55
+    // xmPolygon: () => import('@/components/XMPolygon.vue'),
55
   },
56
   },
56
   data() {
57
   data() {
57
     return {
58
     return {

+ 17
- 12
src/views/activity/list.vue 파일 보기

68
         <el-button type="text" @click="getSignList(scope.row.dynamicId)" size="small" v-if="scope.row.isEnlist == '1' || scope.row.isEnlist === '2'">报名记录</el-button>
68
         <el-button type="text" @click="getSignList(scope.row.dynamicId)" size="small" v-if="scope.row.isEnlist == '1' || scope.row.isEnlist === '2'">报名记录</el-button>
69
         <el-button type="text" @click="toDetail(scope.row.dynamicId)" size="small">编辑</el-button>
69
         <el-button type="text" @click="toDetail(scope.row.dynamicId)" size="small">编辑</el-button>
70
         <el-button type="text" @click="finish(scope.row.dynamicId)" size="small">结束活动</el-button>
70
         <el-button type="text" @click="finish(scope.row.dynamicId)" size="small">结束活动</el-button>
71
-        <!-- <el-button type="text" @click="top(scope.row.dynamicId)" size="small">置顶</el-button> -->
71
+        <el-button type="text" @click="top(scope.row)" size="small">{{ scope.row.weight === 1 ? '取消置顶' : '置顶' }}</el-button>
72
       </template>
72
       </template>
73
     </el-table-column>
73
     </el-table-column>
74
   </el-table>
74
   </el-table>
127
     ]),
127
     ]),
128
     ...mapActivity([
128
     ...mapActivity([
129
       "getActivityList",
129
       "getActivityList",
130
-      'finishActivity'
130
+      'finishActivity',
131
+      'updateWeight',
131
       ]),
132
       ]),
132
     getList() {
133
     getList() {
133
       this.getActivityList(this.filterData,this.filterData.pageSize,this.filterData.pageNum).then(res => {
134
       this.getActivityList(this.filterData,this.filterData.pageSize,this.filterData.pageNum).then(res => {
161
         }).catch(() => {       
162
         }).catch(() => {       
162
         });
163
         });
163
     },
164
     },
164
-    top(id){
165
-        //   this.filterData.dynamicId = id
166
-        //   this.filterData.top = 1
167
-        //   this.finishActivity(
168
-        //   JSON.stringify(this.filterData)
169
-        // ).then((res) => {
170
-        //    this.getList();
171
-        //   this.getBuildList()   
172
-        // })
165
+    top(row){
166
+      const weight = Math.abs(row.weight - 1)
167
+
168
+      this.updateWeight({ dynamicId: row.dynamicId, weight }).then(() => {
169
+        this.list = this.list.map(x => x.dynamicId === row.dynamicId ? { ...x, weight } : x)
170
+
171
+        if (weight) {
172
+          this.$message.info('置顶成功')
173
+        } else {
174
+          this.$message.info('取消置顶成功')
175
+        }
176
+      }).catch((err) => {
177
+          this.$message.error(err.message || err)
178
+      })
173
     },
179
     },
174
     addDynamic() {
180
     addDynamic() {
175
       this.$router.push({ name: "activity-add" });
181
       this.$router.push({ name: "activity-add" });
176
-      console.log('11111')
177
     },
182
     },
178
     toDetail(row) {
183
     toDetail(row) {
179
       this.$router.push({ name: "activity-edit",query: { row }});
184
       this.$router.push({ name: "activity-edit",query: { row }});

+ 42
- 5
src/views/indexEcharts/components/NewUsers.vue 파일 보기

2
   <div>
2
   <div>
3
     <div class="chart-box" v-if="mode == 'all' || mode == 'line'">
3
     <div class="chart-box" v-if="mode == 'all' || mode == 'line'">
4
       <h3>新增客户</h3>
4
       <h3>新增客户</h3>
5
-      <v-chart class="chart" :options="options" />
5
+      <v-chart v-loading="loading" class="chart" :options="options" />
6
     </div>
6
     </div>
7
     <div class="chart-box" v-if="mode == 'all' || mode == 'table'">
7
     <div class="chart-box" v-if="mode == 'all' || mode == 'table'">
8
       <h3>新增客户 <small>最近七天</small></h3>
8
       <h3>新增客户 <small>最近七天</small></h3>
9
-      <el-table :data="tableData"  border  center  style="width: 100%; margin-top: 16px">
9
+      <el-table v-loading="loading" :data="tableData"  border  center  style="width: 100%; margin-top: 16px">
10
         <el-table-column v-for="(item, index) in tableTitle" :key="index" :label="item" :prop="index == 0 ? 'label': item"></el-table-column>
10
         <el-table-column v-for="(item, index) in tableTitle" :key="index" :label="item" :prop="index == 0 ? 'label': item"></el-table-column>
11
       </el-table>
11
       </el-table>
12
     </div>
12
     </div>
17
 import ECharts from 'vue-echarts'
17
 import ECharts from 'vue-echarts'
18
 import 'echarts/lib/chart/line'
18
 import 'echarts/lib/chart/line'
19
 import 'echarts/lib/component/tooltip'
19
 import 'echarts/lib/component/tooltip'
20
+import 'echarts/lib/component/dataZoom'
21
+import dayjs from 'dayjs'
22
+import { createNamespacedHelpers } from "vuex"
23
+
24
+const { mapActions } = createNamespacedHelpers("indexEcharts");
20
 
25
 
21
 export default {
26
 export default {
22
   name: 'NewUsers',
27
   name: 'NewUsers',
23
   props: ['value', 'mode'],
28
   props: ['value', 'mode'],
24
   data () {
29
   data () {
25
     return {
30
     return {
31
+      loading: false,
32
+      dataset: [],
26
       tableTitle: [ '类型' ],
33
       tableTitle: [ '类型' ],
27
       lineOpt: {
34
       lineOpt: {
28
         color: ["purple", "green"],
35
         color: ["purple", "green"],
37
           type: "category",
44
           type: "category",
38
         },
45
         },
39
         yAxis: {},
46
         yAxis: {},
47
+        dataZoom: [
48
+          {
49
+            type: 'inside',
50
+            start: 0,
51
+            end: 100
52
+          },
53
+          {
54
+            type: 'slider',
55
+            start: 0,
56
+            end: 100
57
+          },
58
+        ],
40
         series: [
59
         series: [
41
           {
60
           {
42
             name: "新用户数",
61
             name: "新用户数",
56
         ...this.lineOpt,
75
         ...this.lineOpt,
57
         dataset: {
76
         dataset: {
58
           dimensions: ['date', 'userCount', 'authorizationCount'],
77
           dimensions: ['date', 'userCount', 'authorizationCount'],
59
-          source: this.value || []
78
+          source: this.dataset
60
         }
79
         }
61
       }
80
       }
62
     },
81
     },
63
     tableData () {
82
     tableData () {
64
-      return (this.value || []).reduce((acc, item, index) => {
83
+      return this.dataset.reduce((acc, item, index) => {
65
           const { date, userCount, authorizationCount } = item
84
           const { date, userCount, authorizationCount } = item
66
           const row1 = {
85
           const row1 = {
67
             ...acc[0],
86
             ...acc[0],
77
           return [row1, row2];          
96
           return [row1, row2];          
78
         }, [{ label: '新增用户', }, { label: '授权注册', } ])
97
         }, [{ label: '新增用户', }, { label: '授权注册', } ])
79
     }
98
     }
80
-  }
99
+  },
100
+  mounted () {
101
+    const endDate = new Date()
102
+    const startDate = dayjs().subtract(7, 'day').toDate()
103
+
104
+    this.getData({ startDate, endDate })
105
+  },
106
+  methods: {
107
+    ...mapActions(['getNewsUserCount']),
108
+    getData(filters) {
109
+      this.loadding = true
110
+      this.getNewsUserCount(filters).then((data) => {
111
+        this.dataset = data || []
112
+        this.loading = false
113
+      }).catch((err) => {
114
+        this.loading = false
115
+      })
116
+    },
117
+  },
81
 }
118
 }
82
 </script>
119
 </script>
83
 
120
 

+ 36
- 10
src/views/indexEcharts/components/UserSource.vue 파일 보기

1
 <template>
1
 <template>
2
   <div>
2
   <div>
3
     <div class="chart-box" v-if="mode == 'all' || mode == 'report'">
3
     <div class="chart-box" v-if="mode == 'all' || mode == 'report'">
4
-      <h3>用户来源 <small>最近七天</small></h3>
5
-      <v-chart class="chart" :options="options" />
4
+      <h3>用户来源 <small>{{subTitle}}</small></h3>
5
+      <v-chart v-loading="loading" class="chart" :options="options" />
6
     </div>
6
     </div>
7
     <div class="chart-box" v-if="mode == 'all' || mode == 'table'">
7
     <div class="chart-box" v-if="mode == 'all' || mode == 'table'">
8
       <el-select v-model="userType">
8
       <el-select v-model="userType">
9
         <el-option label="所有用户" value="all"></el-option>
9
         <el-option label="所有用户" value="all"></el-option>
10
         <el-option label="注册用户" value="registered"></el-option>
10
         <el-option label="注册用户" value="registered"></el-option>
11
       </el-select>
11
       </el-select>
12
-      <el-table :data="tableData"  border  center  style="width: 100%; margin-top: 16px">
12
+      <el-table v-loading="loading" :data="tableData"  border  center  style="width: 100%; margin-top: 16px" height="400">
13
         <el-table-column v-for="(item, index) in tableTitle" :key="index" :label="item" :prop="index == 0 ? 'label' : item"></el-table-column>
13
         <el-table-column v-for="(item, index) in tableTitle" :key="index" :label="item" :prop="index == 0 ? 'label' : item"></el-table-column>
14
       </el-table>
14
       </el-table>
15
     </div>
15
     </div>
21
 import 'echarts/lib/chart/bar'
21
 import 'echarts/lib/chart/bar'
22
 import 'echarts/lib/chart/pie'
22
 import 'echarts/lib/chart/pie'
23
 import 'echarts/lib/component/tooltip'
23
 import 'echarts/lib/component/tooltip'
24
+import dayjs from 'dayjs'
25
+import { createNamespacedHelpers } from "vuex"
26
+
27
+const { mapActions } = createNamespacedHelpers("indexEcharts");
24
 
28
 
25
 export default {
29
 export default {
26
   name: 'UserSource',
30
   name: 'UserSource',
29
   },
33
   },
30
   props: [
34
   props: [
31
     'value',
35
     'value',
36
+    'subTitle',
32
     'mode',
37
     'mode',
33
   ],
38
   ],
34
   data () {
39
   data () {
35
     return {
40
     return {
41
+      loading: false,
42
+      dataset: {},
36
       reportOpts: {
43
       reportOpts: {
37
         legend: {},
44
         legend: {},
38
         color: ['#286DD0', '#8565CE', '#6A96F8', '#F5749E', '#8B7FE2'],
45
         color: ['#286DD0', '#8565CE', '#6A96F8', '#F5749E', '#8B7FE2'],
44
         ],
51
         ],
45
       },
52
       },
46
       userType: 'all',
53
       userType: 'all',
47
-      tableTitle: ['类型'],
54
+      tableTitle: ['日期'],
48
     }
55
     }
49
   },
56
   },
50
   computed: {
57
   computed: {
51
     tableData () {
58
     tableData () {
52
-      const data = (this.value || { data: [] }).data.reduce((acc, item, index) => {
53
-          const { date, fromName, count } = item
59
+      const data = (this.dataset.data || []).reduce((acc, item, index) => {
60
+          const { date, fromName, count, registered } = item
61
+          const num = this.userType === 'registered' ? registered : count
54
           
62
           
55
-          this.tableTitle = this.tableTitle.indexOf(date) > -1 ? this.tableTitle : this.tableTitle.concat(date) // eslint-disable-line
56
-          acc[fromName] = { ...acc[fromName], [`${date}`]: !count ? 0 : count }
63
+          this.tableTitle = this.tableTitle.indexOf(fromName) > -1 ? this.tableTitle : this.tableTitle.concat(fromName) // eslint-disable-line
64
+          acc[date] = { ...acc[date], [`${fromName}`]: !num ? 0 : num }
57
 
65
 
58
           return acc
66
           return acc
59
         }, {})
67
         }, {})
63
 
71
 
64
     // 柱图
72
     // 柱图
65
     barOptions () {
73
     barOptions () {
66
-      const source = (this.value || {}).columnar || [];
74
+      const source = this.dataset.columnar || [];
67
       return {
75
       return {
68
         xAxis: { type: 'category' },
76
         xAxis: { type: 'category' },
69
         legend: {
77
         legend: {
83
     },
91
     },
84
     // 饼图
92
     // 饼图
85
     pieOptions () {
93
     pieOptions () {
86
-      const { person_estate_agent = 0, person_null = 0, person_realty_consultant = 0 } = (this.value || {}).pie || {};
94
+      const { person_estate_agent = 0, person_null = 0, person_realty_consultant = 0 } = this.dataset.pie || {};
87
       return {
95
       return {
88
         xAxis: {},
96
         xAxis: {},
89
         legend: {
97
         legend: {
130
       }
138
       }
131
     }
139
     }
132
   },
140
   },
141
+  methods: {
142
+    ...mapActions(['getUserResource']),
143
+    getData(filters) {
144
+      this.loadding = true
145
+      this.getUserResource(filters).then((data) => {
146
+        this.dataset = data || {}
147
+        this.loading = false
148
+      }).catch((err) => {
149
+        this.loading = false
150
+      })
151
+    }
152
+  },
153
+  mounted () {
154
+    const endDate = new Date()
155
+    const startDate = dayjs().subtract(7, 'day').toDate()
156
+
157
+    this.getData({ startDate, endDate })
158
+  },
133
 }
159
 }
134
 </script>
160
 </script>
135
 
161
 

+ 1
- 1
src/views/indexEcharts/index.vue 파일 보기

11
       <card label="最近7天新增" @click.native="toNewUsers()" class="under-line" >{{echartsInfo.selectRecentlyCount}}</card>
11
       <card label="最近7天新增" @click.native="toNewUsers()" class="under-line" >{{echartsInfo.selectRecentlyCount}}</card>
12
     </el-col>
12
     </el-col>
13
   </el-row>
13
   </el-row>
14
-  <user-source :value="userSourceData" mode="report"></user-source>
14
+  <user-source :value="userSourceData" mode="report" sub-title="最近七天"></user-source>
15
   <user-behavior class="marginTB" :value="userBehaviorData" @click="toBehaviorAnalysis()"></user-behavior>
15
   <user-behavior class="marginTB" :value="userBehaviorData" @click="toBehaviorAnalysis()"></user-behavior>
16
  <el-row :gutter="20">
16
  <el-row :gutter="20">
17
     <el-col :span="12">
17
     <el-col :span="12">

+ 17
- 52
src/views/indexEcharts/newUsers.vue 파일 보기

1
 <template>
1
 <template>
2
 <div>
2
 <div>
3
-  <div class="title">
4
-    <span @click="choose(list.id)" :class="active==list.id?'active':''" v-for="(list,index) in dateList" :key="index" >{{list.date}}</span>  
3
+  <div>
4
+    <el-button type="text" @click="() => getDataOf(7)">最近7天</el-button>
5
+    <el-button type="text" @click="() => getDataOf(30)">最近1月</el-button>
5
     <el-date-picker
6
     <el-date-picker
6
-      v-model="value"
7
+      v-model="dateRange"
7
       type="daterange"
8
       type="daterange"
8
       start-placeholder="开始日期"
9
       start-placeholder="开始日期"
9
       end-placeholder="结束日期"
10
       end-placeholder="结束日期"
10
-      @change="changeDate"
11
-      default-value="2019-08-08">
11
+      style="margin-left: 16px">
12
     </el-date-picker>
12
     </el-date-picker>
13
+    <el-button type="primary" icon="el-icon-search" style="margin-left: 32px" @click="search">查询</el-button>
13
   </div>
14
   </div>
14
-  
15
-  <new-users :mode="all" :value="userData"></new-users>
16
-
15
+  <new-users mode="line" ref="chart"></new-users>
17
 </div>
16
 </div>
18
 </template>
17
 </template>
19
 
18
 
20
 <script>
19
 <script>
21
-import { createNamespacedHelpers } from "vuex"
22
-import { mapState } from "vuex"
20
+import dayjs from 'dayjs'
23
 
21
 
24
-const {
25
-  mapState: mapIndexEchartsState,
26
-  mapActions: mapIndexEchartsActions
27
-} = createNamespacedHelpers("indexEcharts");
28
 export default {
22
 export default {
29
   components: {
23
   components: {
30
     NewUsers: () => import('./components/NewUsers'),
24
     NewUsers: () => import('./components/NewUsers'),
31
   },
25
   },
32
   data() {
26
   data() {
33
     return {
27
     return {
34
-      value: "",
35
-      dateList:[
36
-        {date:'最近一周',id:1},
37
-        {date:'最近一个月',id:2},
38
-      ],
39
-      active:1,
40
-      userData: [],
28
+      dateRange: [],
41
     };
29
     };
42
   },
30
   },
43
-  computed: {
44
-    ...mapIndexEchartsState({
45
-      newsUserCount: x => x.newsUserCount
46
-    })
47
-  },
48
   methods: {
31
   methods: {
49
-    ...mapIndexEchartsActions(["getNewsUserCount"]),
50
-    choose(id){
51
-      this.active = id;
32
+    search () {
33
+      const [ startDate, endDate ] = this.dateRange || []
34
+      this.$refs.chart.getData({ startDate, endDate })
52
     },
35
     },
53
-    changeDate(){
54
-      if(this.value!=''){
55
-        this.active = '3'
56
-      }
57
-    },
58
-    initPage() {
59
-      this.getNewsUserCount().then(x => {
60
-        this.userData = this.newsUserCount.selectNewsUserCount
61
-      });
36
+    getDataOf(days) {      
37
+      const endDate = new Date()
38
+      const startDate = dayjs().subtract(days, 'day').toDate()
39
+
40
+      this.$refs.chart.getData({ startDate, endDate })
62
     },
41
     },
63
   },
42
   },
64
   mounted() {
43
   mounted() {
65
-    this.initPage();  
66
   }
44
   }
67
 };
45
 };
68
 </script>
46
 </script>
69
 
47
 
70
 <style lang="scss" scoped>
48
 <style lang="scss" scoped>
71
-p {
72
-  margin: 0;
73
-}
74
-.title{
75
-  span{
76
-    margin-right: 15px;
77
-  }
78
-  .active{
79
-    color: #044281;
80
-  }
81
-}
82
 </style>
49
 </style>
83
-
84
-

+ 27
- 37
src/views/indexEcharts/userSource.vue 파일 보기

1
 <template>
1
 <template>
2
-<div>
3
-  <p class="title">用户来源 最近2个月
4
-    <el-date-picker
5
-      v-model="value"
6
-      type="daterange"
7
-      @change="getInfo"
8
-      start-placeholder="开始日期"
9
-      end-placeholder="结束日期"
10
-      default-value="2019-08-08">
11
-    </el-date-picker></p>
12
-    <user-source :value="userData" mode="all"></user-source>
13
-</div>
2
+  <div>
3
+    <div>
4
+      <el-button type="text" @click="() => getDataOf(7)">最近7天</el-button>
5
+      <el-button type="text" @click="() => getDataOf(30)">最近1月</el-button>
6
+      <el-date-picker
7
+        v-model="dateRange"
8
+        type="daterange"
9
+        start-placeholder="开始日期"
10
+        end-placeholder="结束日期"
11
+        style="margin-left: 16px">
12
+      </el-date-picker>
13
+      <el-button type="primary" icon="el-icon-search" style="margin-left: 32px" @click="search">查询</el-button>
14
+    </div>
15
+    <user-source ref="chart" mode="all"></user-source>
16
+  </div>
14
 </template>
17
 </template>
15
 
18
 
16
 <script>
19
 <script>
17
-import { createNamespacedHelpers } from "vuex";
18
-
19
-const { mapActions: mapEchartsActions  } = createNamespacedHelpers("indexEcharts")
20
+import dayjs from 'dayjs'
20
 
21
 
21
 export default {
22
 export default {
22
   components: {
23
   components: {
24
   },
25
   },
25
   data() {
26
   data() {
26
     return {
27
     return {
27
-      value: '', // 时间
28
-      userData: {},
28
+      dateRange: [], // 时间
29
     };
29
     };
30
   },
30
   },
31
-  computed: {},
32
-    created(){
33
-      this.getInfo()
34
-    },
31
+  mounted(){
32
+  },
35
   methods: {
33
   methods: {
36
-     ...mapEchartsActions([
37
-        'getUserResource'
38
-     ]),
39
-    getInfo() { // 获取信息
34
+    search () {
35
+      const [ startDate, endDate ] = this.dateRange || []
36
+      this.$refs.chart.getData({ startDate, endDate })
37
+    },
38
+    getDataOf(days) {      
39
+      const endDate = new Date()
40
+      const startDate = dayjs().subtract(days, 'day').toDate()
40
 
41
 
41
-         this.getUserResource({
42
-             startDate: this.value[0],
43
-             endDate: this.value[1],
44
-             registeredType: this.registeredType
45
-         }).then((res) => {
46
-            this.userData = res
47
-         }).catch((err) => {
48
-             this.$notify.error(err.msg || err.message);
49
-             console.log('indexEcharts/getUserResource err')
50
-         })
42
+      this.$refs.chart.getData({ startDate, endDate })
51
     },
43
     },
52
   },
44
   },
53
-  mounted() {
54
-  }
55
 };
45
 };
56
 </script>
46
 </script>
57
 
47