add agent management

src/api/agnetManagement.js

@@ -0,0 +1,27 @@
+import request from '@/utils/request'
+
+export function fetchList(query) {
+  return request({
+    url: '/agents',
+    method: 'get'
+    // params: {
+    //   limit: query.limit,
+    //   offset: (query.page - 1) * query.limit,
+    //   name: query.name,
+    //   chipsSort: query.chipsSort,
+    //   updatedSort: query.updatedSort
+    // }
+  })
+}
+
+export function createAgent(data) {
+  return request({
+    url: '/agents',
+    method: 'post',
+    data: {
+      name: data.name,
+      feeRatio: data.feeRatio
+    }
+  })
+}
+

src/router/index.js

@@ -126,6 +126,23 @@ export const constantRouterMap = [
       }
     ]
   },
+  {
+    path: '/agent',
+    component: Layout,
+    redirect: '/agent/index',
+    children: [
+      {
+        path: 'index',
+        name: 'AgentManagement',
+        component: _import('agnetManagement/index'),
+        meta: {
+          title: '代理商管理',
+          icon: 'table'
+          // role: ['dd']
+        }
+      }
+    ]
+  },
   // {
   //   path: '/example',
   //   component: Layout,

src/views/agnetManagement/index.vue

@@ -0,0 +1,165 @@
+<template>
+<div class="app-container calendar-list-container">
+  <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>
+      <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>
+    <el-table :data="list" v-loading.body="listLoading" element-loading-text="Loading" border fit highlight-current-row
+      style="width: 100%">
+      <el-table-column align="center" label='ID' >
+        <template slot-scope="scope">
+          {{scope.row.id}}
+        </template>
+      </el-table-column>
+      <el-table-column label="名稱" align="center">
+        <template slot-scope="scope">
+          {{scope.row.GambleMember.name}}
+        </template>
+      </el-table-column>
+      <el-table-column label="抽水％" align="center">
+        <template slot-scope="scope">
+          {{scope.row.feeRatio}}
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <div v-show="!listLoading" class="pagination-container">
+      <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="listQuery.page"
+        :page-sizes="[10,20,30, 50]" :page-size="listQuery.limit" layout="total, sizes, prev, pager, next, jumper" :total="total">
+      </el-pagination>
+    </div>
+
+    <el-dialog title="創建代理商" :visible.sync="dialogCreateFormVisible" :before-close="handleDialogClose" center>
+        <el-form :rules="rules" ref="createForm" :model="createFormData" label-position="left" label-width="100px" style='width: 400px; margin-left:50px;'>
+          <el-form-item label="名稱" prop="name">
+            <el-input v-model="createFormData.name"></el-input>
+          </el-form-item>
+          <el-form-item label="抽水 ％" prop="feeRatio">
+            <el-input v-model="createFormData.feeRatio"></el-input>
+          </el-form-item>
+        </el-form>          
+        <div slot="footer" class="dialog-footer">
+          <el-button @click="handleDialogClose">取 消</el-button>
+          <el-button type="primary" @click="createData">確 定</el-button>
+        </div>
+    </el-dialog>
+  </div>
+    <router-view :member="member"></router-view>
+  </div>
+</template>
+
+<script>
+
+import { mapGetters, mapActions } from 'vuex'
+import { fetchList, createAgent } from '@/api/agnetManagement'
+import waves from '@/directive/waves' // 水波纹指令
+
+export default {
+  directives: {
+    waves
+  },
+  data() {
+    return {
+      list: null,
+      total: null,
+      listLoading: true,
+      listQuery: {
+        page: 1,
+        limit: 20,
+      },
+      dialogCreateFormVisible: false,
+      dialogStatus: '',
+      member: {},
+      rules: {
+        // rewardChips: [{ pattern: /^-?\d+$/, required: true, message: '請輸入整數', trigger: 'change' }],        
+        // 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' }]
+      },
+      createFormData: {
+        name: '',
+        feeRatio: '',
+      }
+    }
+  },
+  created() {
+    this.SetVisible(1)
+    this.getList()
+  },
+  computed: {
+    ...mapGetters([
+      'visible'
+    ])
+  },
+  methods: {
+    ...mapActions([
+      'SetVisible'
+    ]),
+    getList() {
+      this.listLoading = true
+      fetchList(this.listQuery).then(response => {
+        this.list = response.data.rows
+        console.log(this.list)
+        this.total = response.data.count
+        this.listLoading = false
+      })
+    },
+    resetCreateData() {
+      this.temp = {
+        id: undefined,
+        name: '',
+        chips: '',
+        depositChips: ''
+      }
+    },
+    handleCreate() {
+      this.resetCreateData()
+      this.dialogCreateFormVisible = true
+      this.$nextTick(() => {
+        this.$refs['createForm'].clearValidate()
+      })
+    },
+    createData() {
+      this.$refs['createForm'].validate((valid) => {
+        if (valid) {
+          createAgent(this.createFormData).then((response) => {
+            const agent = response.data.gambleAgentSetting;
+            agent.GambleMember = response.data.agent
+            this.list.unshift(agent)
+            this.dialogCreateFormVisible = false         
+            this.$notify({
+              title: '成功',
+              message: '創建成功',
+              type: 'success',
+              duration: 2000
+            })
+          })
+        }
+      })
+    },
+    handlePage(row) {
+      const temp = Object.assign({}, row) // copy obj
+      this.SetVisible(3)
+      this.member = temp
+    },
+    handleFilter() {
+      this.listQuery.page = 1
+      this.getList()
+    },
+    handleSizeChange(val) {
+      this.listQuery.limit = val
+      this.getList()
+    },
+    handleCurrentChange(val) {
+      this.listQuery.page = val
+      this.getList()
+    },
+    handleDialogClose() {
+      this.dialogCreateFormVisible = false;
+    },
+  },
+}
+</script>

src/views/room/gambleMember/index.vue

@@ -13,7 +13,6 @@
         </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>
     <el-table :data="list" v-loading.body="listLoading" element-loading-text="Loading" border fit highlight-current-row
       style="width: 100%">
@@ -143,7 +142,7 @@ export default {
         // chips: [{ pattern: /^(0|[1-9][0-9]*)$/, required: true, message: '請輸入整數', trigger: 'change' }],
         // name: [{ type: 'string', required: true, message: '必填', trigger: 'change' }]
       },
-      activeName: 'deposit'
+      activeName: 'deposit',
     }
   },
   created() {
@@ -211,31 +210,6 @@ export default {
         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.activeName = 'depoist';            
-    //         this.$notify({
-    //           title: '成功',
-    //           message: '創建成功',
-    //           type: 'success',
-    //           duration: 2000
-    //         })
-    //       })
-    //     }
-    //   })
-    // },
     handlePage(row) {
       const temp = Object.assign({}, row) // copy obj
       this.SetVisible(3)