Merge branch 'master' of https://bitbucket.org/EthanYeh/gambleadmin

config/index.js

     // In our experience, they generally work as expected,
     // just be aware of this issue when enabling this option.
     cssSourceMap: false
+  },
+  const: {
+    GambleMemberChipsLog: {
+      type: {
+        deposit: 0,
+        reward: 1,
+      },
+    },
   }
 }

src/api/room.js

+import request from '@/utils/request'
+
+export function fetchWechatRooms(query) {
+  return request({
+    url: `/wechatRooms`,
+    method: 'get',
+    params: {
+      limit: query.limit,
+      offset: (query.page - 1) * query.limit,
+      startAt: query.startAt,
+      endAt: query.endAt,
+      name: query.name
+    }
+  })
+}

src/router/index.js

       {
         path: 'index',
         component: _import('room/index'),
-        name: 'Room',
+        name: 'room',
         // redirect: '/round/index/gambleMember/index',
         meta: {
           title: '房間管理',
         },
         children: [
           {
-            path: 'index',
+            path: '/room/index/gambleMember/index',
             name: 'GambleMember',
             component: _import('room/gambleMember/index'),
             hidden: true,
             },
             children: [
               {
-                path: '/round/index/gambleMember/index/gameHistory',
+                path: '/room/index/gambleMember/index/gameHistory',
                 name: 'gameHistory',
                 component: _import('room/gameHistory/index'),
                 hidden: true,
                 }
               },
               {
-                path: '/round/index/gambleMember/index/chipsHistory',
+                path: '/room/index/gambleMember/index/chipsHistory',
                 name: 'chipsHistory',
                 component: _import('room/chipsHistory/index'),
                 hidden: true,

src/store/modules/breadcrumb.js

+// TODO refactor better state mangement
 const breadcrumb = {
   state: {
-    visible: true
+    visible: {
+      firstLayer: true,
+      secondLayer: false,
+      thridLayer: false
+    }
   },
   mutations: {
     SET_VISIBLE: (state, visible) => {
-      state.visible = visible
+      switch (visible) {
+        case 1:
+          state.visible = {
+            firstLayer: true,
+            secondLayer: false,
+            thridLayer: false
+          }
+          break
+        case 2:
+          state.visible = {
+            firstLayer: false,
+            secondLayer: true,
+            thridLayer: false
+          }
+          break
+        case 3:
+          state.visible = {
+            firstLayer: false,
+            secondLayer: false,
+            thridLayer: true
+          }
+          break
+      }
     }
   },
   actions: {

src/views/gambleGameBucket/detail/index.vue

         this.roundOptions.push({ label: `第 ${i} 關`, key: i })
       }
     })
-    this.SetVisible(false)
+    this.SetVisible(2)
     this.getList()
     fetchList({ page: 1, limit: 9999999999, chipsSort: 'DESC' }).then(response => {
       const { rows } = response.data
     }
   },
   destroyed() {
-    this.SetVisible(true)
+    this.SetVisible(1)
   }
 }
 </script>

src/views/gambleGameBucket/index.vue

 <template>
 <div class="app-container calendar-list-container">
-  <div class="app-container" v-show="visible">
+  <div class="app-container" v-show="visible.firstLayer">
     <div class="app-container">
       <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item" placeholder="莊家" v-model="listQuery.bookie">
       </el-input>
   },
   created() {
     this.getList()
-    this.SetVisible(true)
+    this.SetVisible(1)
   },
   computed: {
     ...mapGetters([
       fetchGameBid(row).then(response => {
         this.temp.bidChips = response.data
       })
-      this.SetVisible(false)
+      this.SetVisible(2)
       this.bucket = this.temp
       // fetchMemberRecords(row).then(response => {
       //   console.log(response.data)

src/views/room/chipsHistory/index.vue

 <template>
-  <div class="app-container">
-    <div class="app-container">
+  <div   class="app-container">
+    <div v-show="visible.thirdLayer" class="app-container">
         <div class="block">
             <!-- <span class="demonstration">時間篩選</span> -->
             <el-date-picker
             {{scope.row.admin}}
           </template>
         </el-table-column>
-        <el-table-column label="上下分" align="center">
+        <el-table-column label="操作" align="center">
+          <template slot-scope="scope">
+            {{typeName(scope.row.type)}}
+          </template>
+        </el-table-column>
+        <el-table-column label="點數" align="center">
           <template slot-scope="scope">
             <span :style="moneyColor(scope.row.chips)">{{scope.row.chips}}</span>
           </template>
 
 <script>
 
-import { mapActions } from 'vuex'
+import { mapActions, mapGetters } from 'vuex'
 import { fetchChipsHistory } from '@/api/gambleMember'
 import waves from '@/directive/waves' // 水波纹指令
 import moment from 'moment-timezone'
+import config from '../../../../config' 
 
 export default {
   directives: {
     }
   },
   created() {
-    this.SetVisible(false)
+    this.SetVisible(3)
     this.getList()
   },
   props: ['member'],
+  computed: {
+    ...mapGetters([
+      'visible'
+    ])
+  },
   methods: {
     ...mapActions([
       'SetVisible'
     },
     moneyColor(money) {
       return money >= 0 ? { color: '#67C23A' } : { color: '#FA5555' }
+    },
+    typeName(type) {
+      if(type === config.const.GambleMemberChipsLog.type.deposit) {
+        return `上 / 下 分`
+      }
+      if(type === config.const.GambleMemberChipsLog.type.reward) {
+        return `獎勵 / 懲罰`
+      }
     }
   },
   destroyed() {
-    this.SetVisible(true)
+    this.SetVisible(2)
   }
 }
 </script>

src/views/room/gambleMember/index.vue

 <template>
 <div class="app-container calendar-list-container">
-  <div  v-show="visible">
+  <div  v-show="visible.secondLayer">
     <div class="app-container">
       <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item" placeholder="名稱" v-model="listQuery.name">
       </el-input>
       <el-table-column align="center" label="操作" width="350">
         <template slot-scope="scope">
             <el-button type="primary" size="mini" icon="el-icon-edit" @click="handleDeposit(scope.row)">上下分</el-button>
-            <router-link to="/gambleMember/index/chipsHistory">
+            <router-link to="/room/index/gambleMember/index/chipsHistory">
               <el-button type="primary" size="mini" icon="el-icon-tickets" @click="handleLog(scope.row)">上下分紀錄</el-button>            
             </router-link>
-            <router-link to="/gambleMember/index/gameHistory">
+            <router-link to="/room/index/gambleMember/index/gameHistory">
               <el-button type="primary" size="mini" icon="el-icon-tickets" @click="handlePage(scope.row)">歷史查詢</el-button>
             </router-link>       
         </template>
       </el-pagination>
     </div>
 
-    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
+    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" center>
       <el-form :rules="rules" ref="dataForm" :model="temp" label-position="left" label-width="100px" style='width: 400px; margin-left:50px;'>
         <el-form-item v-if="dialogStatus=='deposit'" label="ID" prop="id">
           <el-input v-model="temp.id" :disabled="true"></el-input>
 <script>
 
 import { mapGetters, mapActions } from 'vuex'
+// TODO 需更改抓取此房間人員
 import { fetchList, updateChips, createGambleMember } from '@/api/gambleMember'
 import waves from '@/directive/waves' // 水波纹指令
 
     }
   },
   created() {
-    this.SetVisible(true)
+    this.SetVisible(2)
     this.getList()
   },
+  destroyed() {
+    this.SetVisible(1)
+  },
   computed: {
     ...mapGetters([
       'visible'
     },
     handlePage(row) {
       const temp = Object.assign({}, row) // copy obj
-      this.SetVisible(false)
+      this.SetVisible(3)
       this.member = temp
     },
     handleLog(row) {
       const temp = Object.assign({}, row) // copy obj
-      this.SetVisible(false)
+      this.SetVisible(3)
       this.member = temp
     },
     handleFilter() {

src/views/room/gameHistory/index.vue

 <template>
-  <div class="app-container">
-    <div class="app-container">
+  <div  class="app-container">
+    <div v-show="visible.thirdLayer" class="app-container">
         <div class="block">
             <!-- <span class="demonstration">時間篩選</span> -->
             <el-date-picker
 
 <script>
 
-import { mapActions } from 'vuex'
+import { mapActions, mapGetters } from 'vuex'
 import { fetchGameHistory, fetchPersonGameDetail } from '@/api/gambleMember'
 import waves from '@/directive/waves' // 水波纹指令
 import moment from 'moment-timezone'
     }
   },
   created() {
-    this.SetVisible(false)
+    this.SetVisible(3)
     this.getList()
   },
+  computed: {
+    ...mapGetters([
+      'visible'
+    ])
+  },
   props: ['member'],
   methods: {
     ...mapActions([
     }
   },
   destroyed() {
-    this.SetVisible(true)
+    this.SetVisible(2)
   }
 }
 </script>

src/views/room/index.vue

 <!-- TODO select -->
 <template>
 <div class="app-container calendar-list-container">
-  <div  v-show="visible">
+  <div  v-show="visible.firstLayer">
     <div class="app-container">
-      <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item" placeholder="名稱" v-model="listQuery.name">
+      <el-input @keyup.enter.native="handleFilter" style="width: 200px;" class="filter-item" placeholder="房間名" v-model="listQuery.name">
       </el-input>
-      <el-select clearable @change='handleFilter' style="width: 120px" class="filter-item" v-model="listQuery.chipsSort" placeholder="點數">
-        <el-option v-for="item in chipsSortOptions" :key="item.label" :label="item.label" :value="item.key">
-        </el-option>
-      </el-select>
-      <el-select clearable @change='handleFilter' style="width: 120px" class="filter-item" v-model="listQuery.updatedSort" placeholder="更新時間">
-        <el-option v-for="item in updatedSortOptions" :key="item.label" :label="item.label" :value="item.key">
-        </el-option>
-      </el-select>
       <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="handleFilter">搜尋</el-button>
       <el-button class="filter-item" @click="handleCreate" type="primary" icon="el-icon-edit">創建</el-button>
     </div>
           {{scope.row.id}}
         </template>
       </el-table-column>
-      <el-table-column label="名稱" align="center">
+      <el-table-column label="房間" align="center">
         <template slot-scope="scope">
           {{scope.row.name}}
         </template>
       </el-table-column>
-      <el-table-column label="點數" align="center">
+      <el-table-column label="時間" align="center">
         <template slot-scope="scope">
-          <span>{{scope.row.chips}}</span>
+          <span>{{moment(scope.row.createdAt)}}</span>
         </template>
       </el-table-column>
       <el-table-column align="center" label="操作" width="350">
         <template slot-scope="scope">
-            <el-button type="primary" size="mini" icon="el-icon-edit" @click="handleDeposit(scope.row)">上下分</el-button>
-            <router-link to="/gambleMember/index/chipsHistory">
-              <el-button type="primary" size="mini" icon="el-icon-tickets" @click="handleLog(scope.row)">上下分紀錄</el-button>            
-            </router-link>
-            <router-link to="/gambleMember/index/gameHistory">
-              <el-button type="primary" size="mini" icon="el-icon-tickets" @click="handlePage(scope.row)">歷史查詢</el-button>
+            <router-link to="/room/index/gambleMember/index">
+              <el-button type="primary" size="mini" icon="el-icon-tickets" @click="handlePage(scope.row)">會員管理</el-button>
             </router-link>       
         </template>
       </el-table-column>
       </el-pagination>
     </div>
 
-    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
-      <el-form :rules="rules" ref="dataForm" :model="temp" label-position="left" label-width="100px" style='width: 400px; margin-left:50px;'>
-        <el-form-item v-if="dialogStatus=='deposit'" label="ID" prop="id">
-          <el-input v-model="temp.id" :disabled="true"></el-input>
-        </el-form-item>
-        <el-form-item label="名稱" prop="name">
-          <el-input v-if="dialogStatus=='deposit'" v-model="temp.name" :disabled="true"></el-input>
-          <el-input v-if="dialogStatus=='create'" v-model="temp.name"></el-input>          
-        </el-form-item>
-        <el-form-item label="點數" prop="chips">
-          <el-input v-if="dialogStatus=='deposit'" v-model="temp.chips" :disabled="true"></el-input>
-          <el-input v-if="dialogStatus=='create'" v-model="temp.chips"></el-input>          
-        </el-form-item>
-        <el-form-item v-if="dialogStatus=='deposit'" label="上下分" prop="depositChips">
-          <el-input placeholder="請輸入上下分" v-model="temp.depositChips">
-          </el-input>
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="dialogFormVisible = false">取 消</el-button>
-        <el-button v-if="dialogStatus=='create'" type="primary" @click="createData">確 定</el-button>
-        <el-button v-if="dialogStatus=='deposit'" type="primary" @click="depositChips">確 定</el-button>
-      </div>
-    </el-dialog>
   </div>
     <router-view :member="member"></router-view>
   </div>
 <script>
 
 import { mapGetters, mapActions } from 'vuex'
-import { fetchList, updateChips, createGambleMember } from '@/api/gambleMember'
+import { fetchWechatRooms } from '@/api/room'
 import waves from '@/directive/waves' // 水波纹指令
+import moment from 'moment-timezone'
 
 export default {
   name: 'gambleMemberTable',
       listQuery: {
         page: 1,
         limit: 20,
-        chipsSort: '',
-        updatedSort: ''
       },
       temp: {
         id: '',
         name: '',
         chips: '',
-        depositChips: ''
-      },
-      dialogFormVisible: false,
-      dialogStatus: '',
-      textMap: {
-        deposit: '儲值',
-        create: '新增'
       },
       member: {},
-      chipsSortOptions: [{ label: '多 -> 少', key: 'DESC' }, { label: '少 -> 多', key: 'ASC' }],
-      updatedSortOptions: [{ label: '新 -> 舊', key: 'DESC' }, { label: '舊 -> 新', key: 'ASC' }],
-      rules: {
-        depositChips: [{ pattern: /^-?\d+$/, required: true, message: '請輸入整數', trigger: 'change' }],
-        chips: [{ pattern: /^(0|[1-9][0-9]*)$/, required: true, message: '請輸入整數', trigger: 'change' }],
-        name: [{ type: 'string', required: true, message: '必填', trigger: 'change' }]
-      }
     }
   },
   created() {
-    this.SetVisible(true)
+    this.SetVisible(1)
     this.getList()
   },
   computed: {
     ]),
     getList() {
       this.listLoading = true
-      fetchList(this.listQuery).then(response => {
-        this.list = response.data.rows
-        this.total = response.data.count
+      fetchWechatRooms(this.listQuery).then(response => {
+        this.list = response.data
+        this.total = response.data.length
         this.listLoading = false
       })
     },
-    handleDeposit(row) {
-      this.temp = Object.assign({}, row) // copy obj
-      this.dialogStatus = 'deposit'
-      this.dialogFormVisible = true
-      this.$nextTick(() => {
-        this.$refs['dataForm'].clearValidate()
-      })
-    },
-    depositChips() {
-      this.$refs['dataForm'].validate((valid) => {
-        if (valid) {
-          const tempData = Object.assign({}, this.temp)
-          updateChips(tempData).then(() => {
-            for (const v of this.list) {
-              if (v.id === this.temp.id) {
-                const index = this.list.indexOf(v)
-                this.list.splice(index, 1, this.temp)
-                break
-              }
-            }
-            this.dialogFormVisible = false
-            this.$notify({
-              title: '成功',
-              message: '操作成功',
-              type: 'success',
-              duration: 2000
-            })
-            this.getList()
-          })
-        }
-      })
-    },
-    resetTemp() {
-      this.temp = {
-        id: undefined,
-        name: '',
-        chips: '',
-        depositChips: ''
-      }
-    },
-    handleCreate() {
-      this.resetTemp()
-      this.dialogStatus = 'create'
-      this.dialogFormVisible = true
-      this.$nextTick(() => {
-        this.$refs['dataForm'].clearValidate()
-      })
-    },
-    createData() {
-      this.$refs['dataForm'].validate((valid) => {
-        if (valid) {
-          createGambleMember(this.temp).then((response) => {
-            this.list.unshift(response.data)
-            this.dialogFormVisible = false
-            this.$notify({
-              title: '成功',
-              message: '創建成功',
-              type: 'success',
-              duration: 2000
-            })
-          })
-        }
-      })
-    },
     handlePage(row) {
       const temp = Object.assign({}, row) // copy obj
-      this.SetVisible(false)
+      this.SetVisible(2)
       this.member = temp
     },
-    handleLog(row) {
-      const temp = Object.assign({}, row) // copy obj
-      this.SetVisible(false)
-      this.member = temp
+    handleCreate() {
+      //TODO 了解wechat 的 room 關聯
     },
     handleFilter() {
       this.listQuery.page = 1
     handleCurrentChange(val) {
       this.listQuery.page = val
       this.getList()
-    }
+    },
+    moment(time) {
+      return moment(time).tz('Asia/Taipei').format('YYYY-MM-DD HH:mm:ss')
+    },
   }
 }
 </script>