update

src/api/appKeyInfo.js → src/api/appKey.js

@@ -7,6 +7,13 @@ export function findPage(data) {
     data
   })
 }
+export function findRequestLogsPage(data) {
+  return request({
+    url: '/appKey/findRequestLogsPage',
+    method: 'post',
+    data
+  })
+}
 
 export function save(data) {
   return request({

src/router/index.js

@@ -33,22 +33,22 @@ import Layout from '@/layout'
 
 export const asyncRoutes = [
   {
-    path: '/interface',
+    path: '/appKey',
     component: Layout,
-    name: 'Interface',
+    name: 'AppKey',
     meta: { title: '接口', icon: 'el-icon-eleme' },
-    redirect: '/interface/appkeys',
+    redirect: '/appKey/index',
     children: [
       {
-        path: 'appkeys',
-        name: 'InterfaceAppkeys',
-        component: () => import('@/views/appKey'),
+        path: 'index',
+        name: 'AppKeyIndex',
+        component: () => import('@/views/appKey/index'),
         meta: { title: 'AppKey管理' }
       },
       {
         path: 'requestLogs',
-        name: 'InterfaceRequestLogs',
-        component: () => import('@/views/dashboard/index'),
+        name: 'AppKeyRequestLogs',
+        component: () => import('@/views/appKey/requestLogs'),
         meta: { title: '调用日志' }
       }
     ]

src/views/appKey/DialogForm.vue

@@ -39,7 +39,7 @@
 
 <script>
 
-import { save, updateById } from '@/api/appKeyInfo'
+import { save, updateById } from '@/api/appKey'
 import { getApis } from '@/api/docsApis'
 
 export default {

src/views/appKey/index.vue

@@ -82,7 +82,7 @@
 </template>
 
 <script>
-import { findPage, enableByIds, disableByIds } from '@/api/appKeyInfo'
+import { findPage, enableByIds, disableByIds } from '@/api/appKey'
 import DialogForm from './DialogForm'
 import { dateTimeFormatter } from '@/utils/formater'
 

src/views/appKey/requestLogs.vue

@@ -0,0 +1,93 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryForm" inline size="small">
+      <el-form-item label="AppKey">
+        <el-input v-model="queryForm.appKey" placeholder="AppKey"/>
+      </el-form-item>
+      <el-form-item label="方法名">
+        <el-input v-model="queryForm.method" placeholder="方法名"/>
+      </el-form-item>
+      <el-form-item label="版本号">
+        <el-input v-model="queryForm.version" placeholder="版本号"/>
+      </el-form-item>
+      <el-form-item label="客户端IP">
+        <el-input v-model="queryForm.clientIp" placeholder="客户端IP"/>
+      </el-form-item>
+      <el-form-item label="请求时间">
+        <el-date-picker
+          v-model="queryForm.serviceBeginTime"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          value-format="yyyy-MM-dd"
+        />
+      </el-form-item>
+      <el-form-item label="请求参数">
+        <el-input v-model="queryForm.requestBody" placeholder="请求参数"/>
+      </el-form-item>
+
+    </el-form>
+    <el-row class="action-bar-container" type="flex" justify="end">
+      <el-button type="primary" size="small" @click.native="fetchData">查询</el-button>
+    </el-row>
+    <el-table
+      v-loading="isLoading"
+      :data="pageData.records"
+      border
+      fit
+      highlight-current-row
+    >
+      <el-table-column label="AppKey" prop="appKey" width="150"/>
+      <el-table-column label="方法名" prop="method" width="150"/>
+      <el-table-column label="版本号" prop="version" width="150"/>
+      <el-table-column label="客户端IP" prop="clientIp" width="150"/>
+      <el-table-column label="请求时间" prop="serviceBeginTime" :formatter="dateTimeFormatter" width="160"/>
+      <el-table-column label="响应时间" prop="serviceEndTime" :formatter="dateTimeFormatter" width="160"/>
+      <el-table-column label="请求参数" prop="requestBody"/>
+    </el-table>
+    <el-pagination
+      class="pagination-container"
+      background
+      layout="prev, pager, next"
+      :total="pageData.total"
+      :page-size="pageData.pageSize"
+      @current-change="paginationChange"
+    />
+  </div>
+</template>
+
+<script>
+import { findRequestLogsPage } from '@/api/appKey'
+import { dateTimeFormatter } from '@/utils/formater'
+
+export default {
+  data() {
+    return {
+      queryForm: {},
+      isLoading: true,
+      pageData: {},
+      currentPage: 1,
+      multipleSelection: []
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    dateTimeFormatter,
+    paginationChange(val) {
+      this.currentPage = val
+      this.fetchData()
+    },
+    fetchData() {
+      this.isLoading = true
+      findRequestLogsPage({ ...this.queryForm, current: this.currentPage })
+        .then((response) => {
+          this.pageData = response
+        })
+        .finally(() => (this.isLoading = false))
+    }
+  }
+}
+</script>