|
@@ -1,26 +1,139 @@
|
|
<template>
|
|
<template>
|
|
- <div>
|
|
|
|
- manager
|
|
|
|
|
|
+ <div class="manager-page">
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="24" class="padding20">
|
|
|
|
+ <el-form :inline="true" :model="searchForm" class="demo-form-inline" size="small">
|
|
|
|
+ <el-form-item label="真实姓名">
|
|
|
|
+ <el-input v-model="searchForm.realName" placeholder="请输入真实姓名"></el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="最后登录时间">
|
|
|
|
+ <el-date-picker
|
|
|
|
+ v-model="lastLoginTime"
|
|
|
|
+ value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
|
+ type="daterange"
|
|
|
|
+ range-separator="至"
|
|
|
|
+ start-placeholder="开始日期"
|
|
|
|
+ end-placeholder="结束日期">
|
|
|
|
+ </el-date-picker>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item>
|
|
|
|
+ <el-button type="primary" @click="handleQuery">查询</el-button>
|
|
|
|
+ <el-button @click="handleReset">重置</el-button>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-form>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="24" class="padding20">
|
|
|
|
+ <el-table :data="tableData" border stripe style="width: 100%" size="small" height="700" v-loading="loading" element-loading-text="加载中" element-loading-spinner="el-icon-loading">
|
|
|
|
+ <el-table-column type="index" align="center" label="序号"></el-table-column>
|
|
|
|
+ <el-table-column prop="operatorId" align="center" label="管理人员ID"></el-table-column>
|
|
|
|
+ <el-table-column prop="userName" align="center" label="用户账户"></el-table-column>
|
|
|
|
+ <el-table-column prop="realName" align="center" label="真实姓名"></el-table-column>
|
|
|
|
+ <el-table-column prop="status" align="center" label="状态">
|
|
|
|
+ <template slot-scope="scope">
|
|
|
|
+ <span v-if="scope.row.status">正常</span>
|
|
|
|
+ <span v-else>禁用</span>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="addTime" align="center" label="创建时间"></el-table-column>
|
|
|
|
+ <el-table-column prop="lastLoginTime" align="center" label="最后登录时间"></el-table-column>
|
|
|
|
+ <el-table-column prop="lastLoginIp" align="center" label="最后登录IP"></el-table-column>
|
|
|
|
+ </el-table>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="24" class="padding20 flexend" >
|
|
|
|
+ <el-pagination
|
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
|
+ :current-page="currentPage"
|
|
|
|
+ :page-size="pageSize"
|
|
|
|
+ layout="total, prev, pager, next"
|
|
|
|
+ :total="total"
|
|
|
|
+ size="small"
|
|
|
|
+ >
|
|
|
|
+ </el-pagination>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
|
+import { getOperatorList } from '@/request/request'
|
|
export default {
|
|
export default {
|
|
name: 'manager',
|
|
name: 'manager',
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
-
|
|
|
|
|
|
+ lastLoginTime: '',
|
|
|
|
+ searchForm: {
|
|
|
|
+ realName: '',
|
|
|
|
+ minLastLoginTime: '',
|
|
|
|
+ maxLastLoginTime: ''
|
|
|
|
+ },
|
|
|
|
+ loading: false,
|
|
|
|
+ tableData: [],
|
|
|
|
+ currentPage: 1,
|
|
|
|
+ pageSize: 20,
|
|
|
|
+ total: 0
|
|
};
|
|
};
|
|
},
|
|
},
|
|
mounted() {
|
|
mounted() {
|
|
|
|
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
-
|
|
|
|
|
|
+ handleReset () {
|
|
|
|
+ this.lastLoginTime = ''
|
|
|
|
+ this.searchForm.minLastLoginTime = ''
|
|
|
|
+ this.searchForm.maxLastLoginTime = ''
|
|
|
|
+ this.searchForm.realName = ''
|
|
|
|
+ },
|
|
|
|
+ handleQuery () {
|
|
|
|
+ if (this.lastLoginTime) {
|
|
|
|
+ this.searchForm.minLastLoginTime = this.lastLoginTime[0]
|
|
|
|
+ this.searchForm.maxLastLoginTime = this.lastLoginTime[1]
|
|
|
|
+ } else {
|
|
|
|
+ this.searchForm.minLastLoginTime = ''
|
|
|
|
+ this.searchForm.maxLastLoginTime = ''
|
|
|
|
+ }
|
|
|
|
+ this.currentPage = 1
|
|
|
|
+ this.getOperatorListFn()
|
|
|
|
+ },
|
|
|
|
+ getOperatorListFn () {
|
|
|
|
+ let data = {
|
|
|
|
+ realName: this.searchForm.realName,
|
|
|
|
+ minLastLoginTime: this.searchForm.minLastLoginTime,
|
|
|
|
+ maxLastLoginTime: this.searchForm.maxLastLoginTime
|
|
|
|
+ }
|
|
|
|
+ this.loading = true
|
|
|
|
+ getOperatorList(data).then(res => {
|
|
|
|
+ this.loading = false
|
|
|
|
+ this.total = res.data.total
|
|
|
|
+ this.pageSize = res.data.pageSize
|
|
|
|
+ this.tableData = res.data.vos || []
|
|
|
|
+ console.log(res);
|
|
|
|
+ }).catch(e => {
|
|
|
|
+ this.loading = false
|
|
|
|
+ console.log(e)
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ handleCurrentChange (currentPage) {
|
|
|
|
+ this.currentPage = currentPage
|
|
|
|
+ this.getOperatorListFn()
|
|
|
|
+ }
|
|
},
|
|
},
|
|
};
|
|
};
|
|
</script>
|
|
</script>
|
|
|
|
|
|
-<style scoped>
|
|
|
|
-
|
|
|
|
|
|
+<style scoped lang="scss">
|
|
|
|
+.manager-page {
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ .padding20 {
|
|
|
|
+ padding: 20px;
|
|
|
|
+ }
|
|
|
|
+ .flexend {
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: flex-end;
|
|
|
|
+ }
|
|
|
|
+}
|
|
</style>
|
|
</style>
|