Added account filter to user management page
This commit is contained in:
parent
ef9bb2801c
commit
a875360694
|
@ -1,5 +1,13 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input v-model="listQuery.accountName" placeholder="Account Name or Email" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
|
||||
<el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">
|
||||
Search
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%">
|
||||
<el-table-column align="center" label="Name" width="200">
|
||||
<template slot-scope="scope">
|
||||
|
|
|
@ -1,5 +1,15 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-select v-model="listQuery.accountId" :remote-method="getRemoteAccountList" filterable default-first-option remote placeholder="Search Accounts" loading-text="Loading...">
|
||||
<el-option v-for="(item,index) in accountListOptions" :key="item+index" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
<el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">
|
||||
Search
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table v-loading="listLoading" :data="list" border fit highlight-current-row style="width: 100%">
|
||||
|
||||
<el-table-column align="center" label="Name" width="200">
|
||||
|
@ -42,6 +52,7 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
const fetchAccountList = require('@/api/account').fetchList
|
||||
import { fetchList } from '@/api/user'
|
||||
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
|
||||
|
||||
|
@ -63,16 +74,18 @@ export default {
|
|||
list: null,
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
accountListOptions: [],
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20
|
||||
limit: 20,
|
||||
accountId: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// Set the type for the query
|
||||
// this.listQuery.type = this.$route.meta.type
|
||||
// this.listQuery.platform = 'OLFDE'
|
||||
this.listQuery.platform = 'OLFDE'
|
||||
|
||||
this.getList()
|
||||
},
|
||||
|
@ -84,6 +97,19 @@ export default {
|
|||
this.total = response.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
getRemoteAccountList(query) {
|
||||
query = {}
|
||||
query.platform = 'OLFDE'
|
||||
query.limit = 100
|
||||
fetchAccountList(query).then(response => {
|
||||
if (!response.data.docs) return
|
||||
this.accountListOptions = response.data.docs.map(v => { return { name: v.name, id: v._id } })
|
||||
})
|
||||
},
|
||||
handleFilter(query) {
|
||||
this.listQuery.page = 1
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue