|
|
@@ -2,16 +2,16 @@
|
|
|
<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-input v-model="queryForm.appKey" placeholder="AppKey"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="方法名">
|
|
|
- <el-input v-model="queryForm.method" placeholder="方法名" />
|
|
|
+ <el-input v-model="queryForm.method" placeholder="方法名"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="版本号">
|
|
|
- <el-input v-model="queryForm.version" placeholder="版本号" />
|
|
|
+ <el-input v-model="queryForm.version" placeholder="版本号"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="客户端IP">
|
|
|
- <el-input v-model="queryForm.clientIp" placeholder="客户端IP" />
|
|
|
+ <el-input v-model="queryForm.clientIp" placeholder="客户端IP"/>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="请求时间">
|
|
|
<el-date-picker
|
|
|
@@ -35,17 +35,19 @@
|
|
|
fit
|
|
|
highlight-current-row
|
|
|
>
|
|
|
- <el-table-column label="AppKey" prop="appKey" />
|
|
|
- <el-table-column label="方法名" prop="method" />
|
|
|
- <el-table-column label="版本号" prop="version" />
|
|
|
- <el-table-column label="客户端IP" prop="clientIp" />
|
|
|
- <el-table-column label="请求时间" prop="serviceBeginTime" :formatter="dateTimeFormatter" />
|
|
|
- <el-table-column label="响应时间" prop="serviceEndTime" :formatter="dateTimeFormatter" />
|
|
|
+ <el-table-column label="AppKey" prop="appKey"/>
|
|
|
+ <el-table-column label="方法名" prop="method"/>
|
|
|
+ <el-table-column label="版本号" prop="version"/>
|
|
|
+ <el-table-column label="客户端IP" prop="clientIp"/>
|
|
|
+ <el-table-column label="请求时间" prop="serviceBeginTime" :formatter="dateTimeFormatter"/>
|
|
|
+ <el-table-column label="响应时间" prop="serviceEndTime" :formatter="dateTimeFormatter"/>
|
|
|
<!-- <el-table-column label="请求参数" prop="requestBody" min-width="300" />-->
|
|
|
<!-- <el-table-column label="返回结果" prop="responseData" min-width="300" />-->
|
|
|
|
|
|
<el-table-column label="操作" width="70" fixed="right">
|
|
|
- <el-button type="text">详情</el-button>
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button type="text" @click.native="showDetail(scope.row)">详情</el-button>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
<el-pagination
|
|
|
@@ -56,16 +58,38 @@
|
|
|
:page-size="pageData.pageSize"
|
|
|
@current-change="paginationChange"
|
|
|
/>
|
|
|
+ <el-dialog
|
|
|
+ v-if="detailVisible"
|
|
|
+ width="900px"
|
|
|
+ :visible.sync="detailVisible"
|
|
|
+ >
|
|
|
+ <el-descriptions title="详情">
|
|
|
+ <el-descriptions-item label="AppKey">{{ detailData.appKey }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="方法名">{{ detailData.method }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="版本号">{{ detailData.version }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="客户端IP">{{ detailData.clientIp }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="请求时间">{{ formatDate(new Date(detailData.serviceBeginTime), 'yyyy-MM-dd hh:mm:ss') }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="响应时间">{{ formatDate(new Date(detailData.serviceEndTime), 'yyyy-MM-dd hh:mm:ss') }}</el-descriptions-item>
|
|
|
+ <el-descriptions-item label="请求参数" :span="3">
|
|
|
+ {{ detailData.requestBody }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="返回结果" :span="3">
|
|
|
+ {{ detailData.responseData }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ </el-descriptions>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import { findRequestLogsPage } from '@/api/appKey'
|
|
|
-import { dateTimeFormatter } from '@/utils/formater'
|
|
|
+import { dateTimeFormatter, formatDate } from '@/utils/formater'
|
|
|
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
+ detailVisible: false,
|
|
|
+ detailData: {},
|
|
|
queryForm: {},
|
|
|
isLoading: true,
|
|
|
pageData: {},
|
|
|
@@ -77,7 +101,12 @@ export default {
|
|
|
this.fetchData()
|
|
|
},
|
|
|
methods: {
|
|
|
+ formatDate,
|
|
|
dateTimeFormatter,
|
|
|
+ showDetail(data) {
|
|
|
+ this.detailVisible = true
|
|
|
+ this.detailData = data
|
|
|
+ },
|
|
|
paginationChange(val) {
|
|
|
this.currentPage = val
|
|
|
this.fetchData()
|
