Bläddra i källkod

feat: debug manager page

wangyuan 2 år sedan
förälder
incheckning
56d3bddb5d

+ 7 - 0
ittpc/src/request/request.js

@@ -8,10 +8,17 @@ const pwdLoginURL = BASE_API + '/pwd/login/v1'
 // 用户列表
 const getUserListURL = BASE_API + '/get/user/list/v1'
 
+// 管理人员列表
+const getOperatorListURl = BASE_API + '/get/operator/list/v1'
+
 export const pwdLogin = (data) => {
   return request.post(pwdLoginURL, data)
 }
 
 export const getUserList = (data) => {
   return request.post(getUserListURL, data)
+}
+
+export const getOperatorList = (data) => {
+  return request.post(getOperatorListURl, data)
 }

+ 119 - 6
ittpc/src/views/modules/manager/manager.vue

@@ -1,26 +1,139 @@
 <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>
 </template>
 
 <script>
+import { getOperatorList } from '@/request/request'
 export default {
   name: 'manager',
   data() {
     return {
-
+      lastLoginTime: '',
+      searchForm: {
+        realName: '',
+        minLastLoginTime: '',
+        maxLastLoginTime: ''
+      },
+      loading: false,
+      tableData: [],
+      currentPage: 1,
+      pageSize: 20,
+      total: 0
     };
   },
   mounted() {
 
   },
   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>
 
-<style scoped>
-
+<style scoped lang="scss">
+.manager-page {
+  width: 100%;
+  height: 100%;
+  .padding20 {
+    padding: 20px;
+  }
+  .flexend {
+    display: flex;
+    justify-content: flex-end;
+  }
+}
 </style>

+ 1 - 1
ittpc/src/views/modules/user/user.vue

@@ -53,7 +53,7 @@
 </template>
 
 <script>
-import { getUserList } from '../../../request/request'
+import { getUserList } from '@/request/request'
 export default {
   name: 'user',
   data() {