登录日志

src/api/modules/login-log.ts

@@ -2,8 +2,15 @@ import { handle } from '../index'
 
 const suffix = 'api'
 
+//  登录日志 > 列表
 export const getLoginLogList = (params: any) => handle({
   url: `/${suffix}/login/log/list`,
   method: 'post',
   params
 })
+//  登录日志 > 列表
+export const loginLogExport = (params: any) => handle({
+  url: `/${suffix}/login/log/export`,
+  method: 'post',
+  params
+})

src/views/system/login-log/index.vue

@@ -10,39 +10,33 @@
           <CusForm labelWidth="100px" @handleEnter="onSearch">
             <CusFormColumn
                 label="账号:"
-                v-model:param="queryForm.shipId"/>
+                v-model:param="queryForm.userName"/>
             <CusFormColumn
                 label="单位:"
-                link="dept"
-                v-model:param="queryForm.shipId"/>
+                link="select"
+                v-model:param="queryForm.deptId"
+                :options="$store.state.dictionary.deptList"/>
             <CusFormColumn
                 label="登陆时间:"
                 link="datetime"
                 type="datetimerange"
-                v-model:param="queryForm.shipId"/>
+                v-model:param="queryForm.loginDate"/>
             <CusFormColumn
                 label="状态:"
                 link="select"
-                static
-                v-model:param="queryForm.shipId"
-                labelKey="label"
-                valueKey="value"
-                :options="[
-                    {label: '类型一', value: '1'},
-                    {label: '类型二', value: '2'},
-                    {label: '类型三', value: '3'},
-                ]"/>
+                v-model:param="queryForm.status"
+                :options="$store.state.dictionary.loginStatusList"/>
             <CusFormColumn
                 label="注销时间:"
                 link="datetime"
                 type="datetimerange"
-                v-model:param="queryForm.shipId"/>
+                v-model:param="queryForm.exitDate"/>
             <CusFormColumn
                 label="设备IP:"
-                v-model:param="queryForm.shipId"/>
+                v-model:param="queryForm.ipaddr"/>
             <CusFormColumn
                 label="浏览器:"
-                v-model:param="queryForm.shipId"/>
+                v-model:param="queryForm.browser"/>
             <CusSearchButtons
                 @handleReset="handleReset"
                 @handleSearch="onSearch"
@@ -50,7 +44,7 @@
           </CusForm>
         </template>
         <template #buttons>
-          <div class="__cus-button_submit __hover">
+          <div class="__cus-button_submit __hover" @click="onExport">
             <SvgIcon name="export" size="16"/>导出
           </div>
         </template>
@@ -63,9 +57,19 @@
               :total="queryResult.total"
               :page="queryPage.pageNum"
               :pageSize="queryPage.pageSize"
+              v-model:selected="selected"
               @handlePage="handlePage"
               @handleSort="handleSort"
           >
+            <template #loginTime-column-value="{ scope }">
+              {{scope.row.loginTime ? $util.YMDHms(scope.row.loginTime) : scope.row.loginTime}}
+            </template>
+            <template #status-column-value="{ scope }">
+              {{$store.state.dictionary.loginStatusMap.get(scope.row.status)}}
+            </template>
+            <template #exitTime-column-value="{ scope }">
+              {{scope.row.exitTime ? $util.YMDHms(scope.row.exitTime) : scope.row.exitTime}}
+            </template>
           </CusTable>
         </template>
       </CusContent>
@@ -88,6 +92,8 @@ import {
 } from 'vue'
 import {useStore} from 'vuex'
 import {useRouter, useRoute} from 'vue-router'
+import { ElMessage } from 'element-plus';
+import {getLoginLogList, loginLogExport} from "@/api/modules/login-log";
 
 export default defineComponent({
   name: '',
@@ -118,19 +124,22 @@ export default defineComponent({
       querySort: {},
       //  表格表头
       tableHead: [
-        {value: "p1", label: "账号", show: true},
-        {value: "p1", label: "单位", show: true},
-        {value: "p1", label: "登陆时间", show: true},
-        {value: "p1", label: "状态", show: true},
-        {value: "p1", label: "注销时间", show: true},
-        {value: "p1", label: "设备IP", show: true},
-        {value: "p1", label: "浏览器", show: true},
-        {value: "p1", label: "时长", show: true},
+        {value: "userName", label: "账号", show: true},
+        {value: "deptName", label: "单位", show: true},
+        {value: "loginTime", label: "登陆时间", show: true},
+        {value: "status", label: "状态", show: true},
+        {value: "exitTime", label: "注销时间", show: true},
+        {value: "ipaddr", label: "设备IP", show: true},
+        {value: "browser", label: "浏览器", show: true},
+        {value: "duration", label: "时长", show: true},
       ],
+      selected: []
     });
     const ref_cusTable = ref()
     //  获取字典
     const initDictionary = () => {
+      store.dispatch('dictionary/LOAD_DEPT')
+      store.dispatch('dictionary/LOAD_DICT_LIST', 'login_status')
     }
     //  查询分页参数改变处理方法
     const handlePage = ({page, pageSize}: any) => {
@@ -155,41 +164,33 @@ export default defineComponent({
       const queryParams: any = {
         pageNum: page,
         pageSize: pageSize,
-        sort: {},
-        text: ''
-      }
-      //  添加排序参数
-      for (const [k, v] of Object.entries(state.querySort)) {
-        that.$util.isValue(v) ? (queryParams.sort[k] = v) : null;
       }
       //  添加表单参数
       for (const [k, v] of Object.entries(state.back_queryForm)) {
-        that.$util.isValue(v) ? (queryParams[k] = v) : null;
+        if (that.$util.isValue(v)) {
+          if (k === 'loginDate') {
+            queryParams['bLoginTime'] = v[0]
+            queryParams['eLoginTime'] = v[1]
+          } else if (k === 'exitDate') {
+            queryParams['bExitTime'] = v[0]
+            queryParams['eExitTime'] = v[1]
+          } else {
+            queryParams[k] = v
+          }
+        }
       }
-      //  添加复合查询参数
       state.loading = true
-
-      // mock
-      const arr = []
-      for (let i = 0; i < 77; i++) {
-        arr.push({p1: '阿三顶顶顶顶顶顶顶顶顶顶顶顶顶'})
-      }
-      state.queryResult.tableData = arr
-      state.queryResult.total = arr.length
-      state.loading = false
-      // that.$api.patrolBoatList(that.$util.formatGetParam(queryParams)).then((res: { code: number; rows: never[]; total: number; }) => {
-      //   if (res.code === 200) {
-      //     state.queryResult.tableData = res.rows
-      //     state.queryResult.total = res.total
-      //   }
-      //   setTimeout(() => {
-      //     state.loading = false
-      //   }, 1000)
-      // }).catch(() => {
-      //   setTimeout(() => {
-      //     state.loading = false
-      //   }, 1000)
-      // })
+      that.$api.getLoginLogList(queryParams).then((res: any) => {
+        if (res.code === 200) {
+          state.queryResult.tableData = res.rows
+          state.queryResult.total = res.total
+        } else {
+          ElMessage.error(res.message)
+        }
+        state.loading = false
+      }).catch(() => {
+        state.loading = false
+      })
     }
     //  点击查询按钮后
     const onSearch = () => {
@@ -198,6 +199,28 @@ export default defineComponent({
       state.queryPage.pageNum = 1
       handleSearch()
     }
+    const onExport = () => {
+      const queryParams: any = {
+      }
+      if (state.selected.length > 0) {
+
+      }
+      //  添加表单参数
+      for (const [k, v] of Object.entries(state.back_queryForm)) {
+        if (that.$util.isValue(v)) {
+          if (k === 'loginDate') {
+            queryParams['bloginTime'] = v[0]
+            queryParams['eloginTime'] = v[1]
+          } else if (k === 'exitDate') {
+            queryParams['bexitTime'] = v[0]
+            queryParams['eexitTime'] = v[1]
+          } else {
+            queryParams[k] = v
+          }
+        }
+      }
+      that.$api.loginLogExport(queryParams)
+    }
     onMounted(() => {
       state.back_queryForm = JSON.parse(JSON.stringify(state.queryForm))
       initDictionary()
@@ -211,6 +234,7 @@ export default defineComponent({
       handleSort,
       handleReset,
       onSearch,
+      onExport,
     }
   },
 })