complete room page

src/api/room.js

@@ -0,0 +1,15 @@
+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

@@ -51,7 +51,7 @@ export const constantRouterMap = [
       {
         path: 'index',
         component: _import('room/index'),
-        name: 'Room',
+        name: 'room',
         // redirect: '/round/index/gambleMember/index',
         meta: {
           title: '房間管理',
@@ -60,7 +60,7 @@ export const constantRouterMap = [
         },
         children: [
           {
-            path: 'index',
+            path: '/room/index/gambleMember/index',
             name: 'GambleMember',
             component: _import('room/gambleMember/index'),
             hidden: true,
@@ -70,7 +70,7 @@ export const constantRouterMap = [
             },
             children: [
               {
-                path: '/round/index/gambleMember/index/gameHistory',
+                path: '/room/index/gambleMember/index/gameHistory',
                 name: 'gameHistory',
                 component: _import('room/gameHistory/index'),
                 hidden: true,
@@ -80,7 +80,7 @@ export const constantRouterMap = [
                 }
               },
               {
-                path: '/round/index/gambleMember/index/chipsHistory',
+                path: '/room/index/gambleMember/index/chipsHistory',
                 name: 'chipsHistory',
                 component: _import('room/chipsHistory/index'),
                 hidden: true,

src/views/room/gambleMember/index.vue

@@ -35,10 +35,10 @@
       <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>

src/views/room/index.vue

@@ -3,16 +3,8 @@
 <div class="app-container calendar-list-container">
   <div  v-show="visible">
     <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>
@@ -23,24 +15,20 @@
           {{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>
@@ -52,30 +40,6 @@
       </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>
@@ -84,8 +48,9 @@
 <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',
@@ -100,29 +65,13 @@ export default {
       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() {
@@ -140,85 +89,19 @@ export default {
     ]),
     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.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
@@ -231,7 +114,10 @@ export default {
     handleCurrentChange(val) {
       this.listQuery.page = val
       this.getList()
-    }
+    },
+    moment(time) {
+      return moment(time).tz('Asia/Taipei').format('YYYY-MM-DD HH:mm:ss')
+    },
   }
 }
 </script>