Browse Source

ChipsHistory 1st version

Unknown 7 years ago
parent
commit
f716845c23

+ 14 - 1
src/api/gambleMember.js

@@ -35,7 +35,7 @@ export function createGambleMember(data) {
35 35
   })
36 36
 }
37 37
 
38
-export function fetchHistory(data, query) {
38
+export function fetchGameHistory(data, query) {
39 39
   return request({
40 40
     url: `/gambleMembers/${data.id}/history`,
41 41
     method: 'get',
@@ -48,6 +48,19 @@ export function fetchHistory(data, query) {
48 48
   })
49 49
 }
50 50
 
51
+export function fetchChipsHistory(data, query) {
52
+  return request({
53
+    url: `/gambleMembers/${data.id}/chipsLogs`,
54
+    method: 'get',
55
+    params: {
56
+      limit: query.limit,
57
+      offset: (query.page - 1) * query.limit,
58
+      startAt: query.startAt,
59
+      endAt: query.endAt
60
+    }
61
+  })
62
+}
63
+
51 64
 export function fetchPersonGameDetail(gambleMemberId, gambleGameBucketId) {
52 65
   return request({
53 66
     url: `/gambleMembers/${gambleMemberId}/gambleGameBuckets/${gambleGameBucketId}/detail`,

+ 11 - 1
src/router/index.js

@@ -59,13 +59,23 @@ export const constantRouterMap = [
59 59
         children: [
60 60
           {
61 61
             path: '/gambleMember/index/gameHistory',
62
-            name: 'GambleGameBucketDetail',
62
+            name: 'gameHistory',
63 63
             component: _import('gambleMember/gameHistory/index'),
64 64
             hidden: true,
65 65
             meta: {
66 66
               title: '歷史紀錄'
67 67
               // role: ['dd']
68 68
             }
69
+          },
70
+          {
71
+            path: '/gambleMember/index/chipsHistory',
72
+            name: 'chipsHistory',
73
+            component: _import('gambleMember/chipsHistory/index'),
74
+            hidden: true,
75
+            meta: {
76
+              title: '上下分紀錄'
77
+              // role: ['dd']
78
+            }
69 79
           }
70 80
         ]
71 81
       }

+ 170 - 0
src/views/gambleMember/chipsHistory/index.vue

@@ -0,0 +1,170 @@
1
+<template>
2
+  <div class="app-container">
3
+    <div class="app-container">
4
+        <div class="block">
5
+            <!-- <span class="demonstration">時間篩選</span> -->
6
+            <el-date-picker
7
+            v-model="date"
8
+            type="datetimerange"
9
+            :picker-options="pickerOptions"
10
+            range-separator="至"
11
+            start-placeholder="開始日期"
12
+            end-placeholder="结束日期"
13
+            align="right">
14
+            </el-date-picker>
15
+            <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">搜尋</el-button>
16
+        </div>
17
+    </div>
18
+    <el-table :data="list" v-loading.body="listLoading" element-loading-text="Loading" border fit highlight-current-row>
19
+      <el-table-column :label="member.name" align="center">
20
+        <el-table-column label="操作人員" align="center">
21
+          <template slot-scope="scope">
22
+            {{scope.row.admin}}
23
+          </template>
24
+        </el-table-column>
25
+        <el-table-column label="上下分" align="center">
26
+          <template slot-scope="scope">
27
+            <span :style="moneyColor(scope.row.chips)">{{scope.row.chips}}</span>
28
+          </template>
29
+        </el-table-column>
30
+        <el-table-column label="當前點數" align="center">
31
+          <template slot-scope="scope">
32
+            <span>{{scope.row.totalChips}}</span>
33
+          </template>
34
+        </el-table-column>
35
+        <el-table-column label="時間" align="center">
36
+          <template slot-scope="scope">
37
+            <span>{{moment(scope.row.createdAt)}}</span>
38
+          </template>
39
+        </el-table-column>
40
+      </el-table-column>      
41
+    </el-table>
42
+
43
+    <div v-show="!listLoading" class="pagination-container">
44
+      <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="listQuery.page"
45
+        :page-sizes="[10,20,30, 50]" :page-size="listQuery.limit" layout="total, sizes, prev, pager, next, jumper" :total="total">
46
+      </el-pagination>
47
+    </div>
48
+
49
+  </div>
50
+</template>
51
+
52
+<script>
53
+
54
+import { mapActions } from 'vuex'
55
+import { fetchChipsHistory } from '@/api/gambleMember'
56
+import waves from '@/directive/waves' // 水波纹指令
57
+import moment from 'moment-timezone'
58
+
59
+export default {
60
+  directives: {
61
+    waves
62
+  },
63
+  data() {
64
+    return {
65
+      list: null,
66
+      dialogList: null,
67
+      total: null,
68
+      listLoading: true,
69
+      listQuery: {
70
+        page: 1,
71
+        limit: 20,
72
+        startAt: null,
73
+        endAt: null
74
+      },
75
+      pickerOptions: {
76
+        shortcuts: [{
77
+          text: '最近一周',
78
+          onClick(picker) {
79
+            const end = new Date()
80
+            const start = new Date()
81
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
82
+            picker.$emit('pick', [start, end])
83
+          }
84
+        }, {
85
+          text: '最近一個月',
86
+          onClick(picker) {
87
+            const end = new Date()
88
+            const start = new Date()
89
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
90
+            picker.$emit('pick', [start, end])
91
+          }
92
+        }, {
93
+          text: '最近三個月',
94
+          onClick(picker) {
95
+            const end = new Date()
96
+            const start = new Date()
97
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
98
+            picker.$emit('pick', [start, end])
99
+          }
100
+        }, {
101
+          text: '最近半年',
102
+          onClick(picker) {
103
+            const end = new Date()
104
+            const start = new Date()
105
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 180)
106
+            picker.$emit('pick', [start, end])
107
+          }
108
+        }, {
109
+          text: '最近一年',
110
+          onClick(picker) {
111
+            const end = new Date()
112
+            const start = new Date()
113
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 365)
114
+            picker.$emit('pick', [start, end])
115
+          }
116
+        }]
117
+      },
118
+      date: null,
119
+      dialogFormVisible: false
120
+
121
+    }
122
+  },
123
+  created() {
124
+    this.SetVisible(false)
125
+    this.getList()
126
+  },
127
+  props: ['member'],
128
+  methods: {
129
+    ...mapActions([
130
+      'SetVisible'
131
+    ]),
132
+    getList() {
133
+      this.listLoading = true
134
+      fetchChipsHistory(this.member, this.listQuery).then(response => {
135
+        this.list = response.data
136
+        this.total = response.data.length
137
+        this.listLoading = false
138
+      })
139
+    },
140
+    handleFilter() {
141
+      this.listQuery.page = 1
142
+      if (this.date) {
143
+        this.listQuery.startAt = moment.utc(this.date[0]).format()
144
+        this.listQuery.endAt = moment.utc(this.date[1]).format()
145
+      } else {
146
+        this.listQuery.startAt = null
147
+        this.listQuery.endAt = null
148
+      }
149
+      this.getList()
150
+    },
151
+    handleSizeChange(val) {
152
+      this.listQuery.limit = val
153
+      this.getList()
154
+    },
155
+    handleCurrentChange(val) {
156
+      this.listQuery.page = val
157
+      this.getList()
158
+    },
159
+    moment(time) {
160
+      return moment(time).tz('Asia/Taipei').format('YYYY-MM-DD HH:mm:ss')
161
+    },
162
+    moneyColor(money) {
163
+      return money >= 0 ? { color: '#67C23A' } : { color: '#FA5555' }
164
+    }
165
+  },
166
+  destroyed() {
167
+    this.SetVisible(true)
168
+  }
169
+}
170
+</script>

+ 2 - 2
src/views/gambleMember/gameHistory/index.vue

@@ -92,7 +92,7 @@
92 92
 <script>
93 93
 
94 94
 import { mapActions } from 'vuex'
95
-import { fetchHistory, fetchPersonGameDetail } from '@/api/gambleMember'
95
+import { fetchGameHistory, fetchPersonGameDetail } from '@/api/gambleMember'
96 96
 import waves from '@/directive/waves' // 水波纹指令
97 97
 import moment from 'moment-timezone'
98 98
 
@@ -171,7 +171,7 @@ export default {
171 171
     ]),
172 172
     getList() {
173 173
       this.listLoading = true
174
-      fetchHistory(this.member, this.listQuery).then(response => {
174
+      fetchGameHistory(this.member, this.listQuery).then(response => {
175 175
         this.list = response.data
176 176
         this.total = response.data.length
177 177
         this.listLoading = false

+ 6 - 1
src/views/gambleMember/index.vue

@@ -35,7 +35,9 @@
35 35
       <el-table-column align="center" label="操作" width="350">
36 36
         <template slot-scope="scope">
37 37
             <el-button type="primary" size="mini" icon="el-icon-edit" @click="handleDeposit(scope.row)">上下分</el-button>
38
-            <el-button type="primary" size="mini" icon="el-icon-tickets" @click="handleLog(scope.row)">上下分紀錄</el-button>            
38
+            <router-link to="/gambleMember/index/chipsHistory">
39
+              <el-button type="primary" size="mini" icon="el-icon-tickets" @click="handleLog(scope.row)">上下分紀錄</el-button>            
40
+            </router-link>
39 41
             <router-link to="/gambleMember/index/gameHistory">
40 42
               <el-button type="primary" size="mini" icon="el-icon-tickets" @click="handlePage(scope.row)">歷史查詢</el-button>
41 43
             </router-link>       
@@ -213,6 +215,9 @@ export default {
213 215
       this.member = temp
214 216
     },
215 217
     handleLog(row) {
218
+      const temp = Object.assign({}, row) // copy obj
219
+      this.SetVisible(false)
220
+      this.member = temp
216 221
       console.log('上下分紀錄', row)
217 222
     },
218 223
     handleFilter() {