许成详 6 年 前
コミット
8bdef9322a

+ 212
- 0
src/pages/system/dataStatistics/courseVerifyList/index.vue ファイルの表示

@@ -0,0 +1,212 @@
1
+<template>
2
+  <div class="subPage">
3
+    <div class="system-table-search">
4
+      <div class="flex-h">
5
+        <ul class="searchFilterLine" style="white-space: normal;">
6
+          <li>
7
+            <el-select v-model="postData.caseid" placeholder="请选择案场">
8
+              <el-option
9
+                v-for="item in cases"
10
+                :key="item.CaseId"
11
+                :label="item.CaseName"
12
+                :value="item.CaseId">
13
+              </el-option>
14
+            </el-select>
15
+          </li>
16
+          <li>
17
+            <el-input
18
+              placeholder="请输入课程活动名称"
19
+              v-model="postData.name"
20
+              clearable>
21
+            </el-input>
22
+          </li>
23
+          <li>
24
+            <el-input
25
+              placeholder="请输入手机号"
26
+              v-model="postData.tel"
27
+              clearable>
28
+            </el-input>
29
+          </li>
30
+          <li>
31
+            <el-select v-model="postData.status" placeholder="请选择状态">
32
+              <el-option
33
+                v-for="item in statusList"
34
+                :key="item.id"
35
+                :label="item.value"
36
+                :value="item.id">
37
+              </el-option>
38
+            </el-select>
39
+          </li>
40
+        </ul>
41
+      </div>
42
+      <div class="flex-h">
43
+        <div class="flex-item flex-h"></div>
44
+        <el-button
45
+          size="mini"
46
+          type="primary" @click="search">搜索</el-button>
47
+        <el-button
48
+          size="mini"
49
+          type="success" @click="search">导出Excel</el-button>
50
+      </div>
51
+      <div class="moreFilter"></div>
52
+    </div>
53
+    <div class="system-table-box">
54
+      <el-table
55
+        :data="courseVerifyList"
56
+        stripe
57
+        style="width: 100%">
58
+        <el-table-column
59
+          prop="CaseName"
60
+          label="所属案场">
61
+        </el-table-column>
62
+        <el-table-column
63
+          prop="CourseName"
64
+          label="课程名称">
65
+        </el-table-column>
66
+        <el-table-column
67
+          prop="BeginDate"
68
+          label="课程时间"
69
+          width="140px">
70
+          <template slot-scope="scope">
71
+            {{toolClass.dateFormat(scope.row.BeginDate)}}<br>
72
+            -<br>
73
+            {{toolClass.dateFormat(scope.row.EndDate)}}
74
+          </template>
75
+        </el-table-column>
76
+        <el-table-column
77
+          prop="CustomerName"
78
+          label="用户姓名">
79
+        </el-table-column>
80
+        <el-table-column
81
+          prop="Name"
82
+          label="微信昵称">
83
+        </el-table-column>
84
+        <el-table-column
85
+          prop="Phone"
86
+          label="手机号">
87
+        </el-table-column>
88
+        <el-table-column
89
+          prop="CreateDate"
90
+          label="下单时间"
91
+          width="140px">
92
+          <template slot-scope="scope">
93
+            {{toolClass.dateFormat(scope.row.CreateDate)}}
94
+          </template>
95
+        </el-table-column>
96
+        <el-table-column
97
+          prop="VerifyDate"
98
+          label="核销时间"
99
+          width="140px">
100
+          <template slot-scope="scope">
101
+            {{toolClass.dateFormat(scope.row.VerifyDate)}}
102
+          </template>
103
+        </el-table-column>
104
+        <el-table-column
105
+          prop="Status"
106
+          label="状态">
107
+          <template slot-scope="scope">
108
+            {{scope.row.Status === 'useable' ? '未使用' : scope.row.Status === 'used' ? '已使用' : scope.row.Status === 'late' ? '逾期核销' : ''}}
109
+          </template>
110
+        </el-table-column>
111
+      </el-table>
112
+    </div>
113
+    <el-pagination
114
+      @current-change="handleCurrentChange"
115
+      :current-page.sync="postData.page"
116
+      :page-size="postData.pagesize"
117
+      layout="prev, pager, next, jumper"
118
+      :total="total">
119
+    </el-pagination>
120
+  </div>
121
+</template>
122
+
123
+<script>
124
+import { mapState, createNamespacedHelpers } from 'vuex'
125
+import tableSearch from '@/components/tableSearch/index'
126
+const { mapState: mapStaState, mapActions: mapStaActions } = createNamespacedHelpers('sta')
127
+
128
+export default {
129
+  name: '',
130
+  data () {
131
+    return {
132
+      total: 0,
133
+      postData: { // 表格搜索条件
134
+        caseid: '', // 案场id
135
+        tel: '', // 手机号
136
+        status: '', // 状态
137
+        name: '', // 卡券名称
138
+        page: 1, // 当前页码
139
+        pagesize: 10, // 请求数据量
140
+      },
141
+      statusList: [{
142
+        value: '不限',
143
+        id: ''
144
+      }, {
145
+        value: '未使用',
146
+        id: 'useable'
147
+      }, {
148
+        value: '已使用',
149
+        id: 'used'
150
+      }, {
151
+        value: '逾期核销',
152
+        id: 'late'
153
+      }],
154
+    }
155
+  },
156
+  computed: {
157
+    ...mapState({
158
+      cases: x => x.app.cases.list,
159
+      defaultCaseId: x => x.app.cases.default
160
+    }),
161
+    ...mapStaState({
162
+      courseVerifyList: x => x.courseVerifyList.list || [],
163
+    }),
164
+    CaseId: {
165
+      get () {
166
+        return this.postData.caseid || this.defaultCaseId
167
+      },
168
+      set (val) {
169
+        this.postData.caseid = val
170
+      }
171
+    }
172
+  },
173
+  components: {
174
+    tableSearch,
175
+  },
176
+  mounted () {
177
+    this.$nextTick(function () {
178
+      this.getList()
179
+    })
180
+  },
181
+  methods: {
182
+    ...mapStaActions([
183
+      'getCourseVerifyList',
184
+    ]),
185
+    search () { // 搜索
186
+      this.page = 1
187
+      this.getList()
188
+    },
189
+    handleCurrentChange (val) { // 跳转到分页
190
+      this.page = val
191
+      this.getList()
192
+    },
193
+    getList () {
194
+      this.getCourseVerifyList(this.postData).then((res) => {
195
+        console.log(JSON.stringify(res))
196
+        this.postData.page = res.page
197
+        this.total = res.total
198
+      })
199
+    },
200
+  }
201
+}
202
+</script>
203
+
204
+<!-- Add "scoped" attribute to limit CSS to this component only -->
205
+<style lang="scss" scoped>
206
+@import "page.scss";
207
+.searchFilterLine {
208
+  > li {
209
+    margin-bottom: 20px;
210
+  }
211
+}
212
+</style>

+ 36
- 0
src/pages/system/dataStatistics/courseVerifyList/page.scss ファイルの表示

@@ -0,0 +1,36 @@
1
+
2
+
3
+
4
+
5
+
6
+
7
+
8
+
9
+
10
+
11
+
12
+
13
+
14
+
15
+
16
+
17
+
18
+
19
+
20
+
21
+
22
+
23
+
24
+
25
+
26
+
27
+
28
+
29
+
30
+
31
+
32
+
33
+
34
+
35
+
36
+

+ 6
- 0
src/pages/system/page.js ファイルの表示

@@ -83,6 +83,7 @@ import courseStatisticsList from './dataStatistics/courseStatisticsList/index' /
83 83
 import courseOrderList from './dataStatistics/courseOrderList/index' // 课程订单列表
84 84
 import goodsOrderList from './dataStatistics/goodsOrderList/index' // 商品订单列表
85 85
 import goodsStatisticsList from './dataStatistics/goodsStatisticsList/index' // 商品统计列表
86
+import courseVerifyList from './dataStatistics/courseVerifyList/index' // 课程核销列表
86 87
 
87 88
 import newOrder from './newOrder/index' // 商品订单系统
88 89
 import newOrderList from './newOrder/newOrderList/index' // 新订单列表
@@ -495,6 +496,11 @@ export default {
495 496
           name: 'goodsStatisticsList',
496 497
           component: goodsStatisticsList,
497 498
           children: []
499
+        }, { // 课程核销列表
500
+          path: 'courseVerifyList',
501
+          name: 'courseVerifyList',
502
+          component: courseVerifyList,
503
+          children: []
498 504
         }]
499 505
       }, { // 卡券管理
500 506
         path: 'cardAndCouponManager',

+ 17
- 0
src/store/sta/sta.js ファイルの表示

@@ -11,6 +11,7 @@ export default {
11 11
     course: {},
12 12
     cardCoupon: {},
13 13
     cardCouponUsedList: {},
14
+    courseVerifyList: {},
14 15
   },
15 16
   mutations: {
16 17
     updateGoods (state, payload) {
@@ -34,6 +35,9 @@ export default {
34 35
     updateCardCouponUsedList (state, payload) {
35 36
       state.cardCouponUsedList = payload || {}
36 37
     },
38
+    updateCourseVerifyList (state, payload) {
39
+      state.courseVerifyList = payload || {}
40
+    },
37 41
   },
38 42
   actions: {
39 43
     GetGoods ({ commit }, payload) {
@@ -127,5 +131,18 @@ export default {
127 131
         }).catch(reject)
128 132
       })
129 133
     },
134
+    getCourseVerifyList ({ commit }, payload) {
135
+      return new Promise((resolve, reject) => {
136
+        ajax(api.statistics.courseVerifyList.url, {
137
+          method: api.statistics.courseVerifyList.method,
138
+          queryData: {
139
+            ...payload,
140
+          }
141
+        }).then(res => {
142
+          commit('updateCourseVerifyList', res)
143
+          resolve(res)
144
+        }).catch(reject)
145
+      })
146
+    },
130 147
   }
131 148
 }

+ 4
- 0
src/util/api.js ファイルの表示

@@ -715,6 +715,10 @@ const $api = {
715 715
       method: 'get',
716 716
       url: `${baseUrl}${common}/statistics/cardcouponused`
717 717
     },
718
+    courseVerifyList: {
719
+      method: 'get',
720
+      url: `${baseUrl}${common}/statistics/cardcouponverify`
721
+    },
718 722
   }
719 723
 }
720 724
 export default $api