214 lines
8.9 KiB
Vue
214 lines
8.9 KiB
Vue
<template>
|
|
<div style="margin-bottom: 10px">
|
|
<el-config-provider :locale="zhCn">
|
|
<el-row style="margin-top: 10px;">
|
|
<el-input v-model="queryKey" style="width: 256px; margin-right: 10px;" placeholder="请输入搜索信息" />
|
|
<el-button type="primary" @click="search()">搜索</el-button>
|
|
<el-button type="warning" @click="reset()">重置</el-button>
|
|
</el-row>
|
|
<br />
|
|
<el-table :data="wmsLogs" stripe border v-loading="loading" class="table-class" max-height="650px"
|
|
highlight-current-row @row-click="getCurrentRow" :header-cell-style="{ 'text-align': 'center' }"
|
|
:cell-style="{ 'text-align': 'center' }">
|
|
<el-table-column width="65px" fixed="left">
|
|
<template v-slot="scope">
|
|
<el-radio :label="scope.row.logId" v-model="logId"> </el-radio>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="logId" label="请求id" fixed="left" min-width="120px" show-overflow-tooltip />
|
|
<el-table-column prop="logTitle" label="请求名称" fixed="left" min-width="120px" show-overflow-tooltip />
|
|
<el-table-column prop="logMethod" label="请求接口" fixed="left" min-width="120px" show-overflow-tooltip />
|
|
<el-table-column prop="logRequest" label="请求信息" min-width="180px" show-overflow-tooltip />
|
|
<el-table-column prop="logResponse" label="响应信息" min-width="180px" show-overflow-tooltip />
|
|
<el-table-column prop="logIp" label="请求ip" min-width="120px" />
|
|
<el-table-column prop="logTime" label="请求时间" :formatter="timeFormat" show-overflow-tooltip min-width="120px" />
|
|
<el-table-column prop="logUser" label="请求用户" min-width="120px" />
|
|
<el-table-column fixed="right" label="操作" width="120px">
|
|
<template v-slot="scope">
|
|
<el-button plain type="primary" @click="detailCurrentRowLog(scope.row)">查看详情</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<br />
|
|
<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 25, 50]"
|
|
:small="false" :disabled="false" :background="false" :default-page-size="10"
|
|
layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="search"
|
|
@current-change="search" />
|
|
<el-dialog v-model="dialogVisible" title="日志详情" width="40%" draggable :show-close="false">
|
|
<el-form ref="wmsLogFormRef" :model="wmsLogEntity" :label-position="labelPosition" label-width="100px"
|
|
style="max-width: 100%" :rules="rules" status-icon>
|
|
<el-row :gutter="16">
|
|
<el-col :span="12" :offset="0">
|
|
<el-form-item label="请求id" prop="logId">
|
|
<el-input v-model="wmsLogEntity.logId" readonly />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="请求名称" prop="logTitle">
|
|
<el-input v-model="wmsLogEntity.logTitle" readonly />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row :gutter="16">
|
|
<el-col :span="12" :offset="0">
|
|
<el-form-item label="请求接口" prop="logMethod">
|
|
<el-input v-model="wmsLogEntity.logMethod" readonly />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="请求ip" prop="logIp">
|
|
<el-input v-model="wmsLogEntity.logIp" readonly />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row :gutter="16">
|
|
<el-col :span="12" :offset="0">
|
|
<el-form-item label="请求信息" prop="logRequest">
|
|
<el-input type="textarea" :rows="2" v-model="wmsLogEntity.logRequest" placeholder=""
|
|
:maxlength="-1" :show-word-limit="false" :autosize="{ minRows: 2, maxRows: 4 }"
|
|
:formatter="(value) => jsonFormat(value)" readonly>
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="响应信息" prop="logResponse">
|
|
<el-input type="textarea" :rows="2" v-model="wmsLogEntity.logResponse"
|
|
:maxlength="-1" :show-word-limit="false" :autosize="{ minRows: 2, maxRows: 4 }"
|
|
:formatter="(value) => jsonFormat(value)" readonly>
|
|
</el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row :gutter="16">
|
|
<el-col :span="12" :offset="0">
|
|
<el-form-item label="请求时间" prop="logTime">
|
|
<el-input v-model="wmsLogEntity.logTime" readonly />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="请求用户" prop="logUser">
|
|
<el-input v-model="wmsLogEntity.logUser" readonly />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
<template #footer>
|
|
<span class="dialog-footer">
|
|
<el-button @click="dialogVisible = false">关闭</el-button>
|
|
</span>
|
|
</template>
|
|
</el-dialog>
|
|
</el-config-provider>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { queryLogs } from '@/api/wmsLog.js'
|
|
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
|
|
import { ElMessage } from 'element-plus'
|
|
import { timeFormatter } from '@/utils/formatter.js'
|
|
import { ref, reactive } from 'vue'
|
|
</script>
|
|
<script>
|
|
export default {
|
|
name: 'wmsLog',
|
|
data() {
|
|
return {
|
|
wmsLogs: [],
|
|
pageInfo: {},
|
|
currentPage: 1,
|
|
pageSize: 10,
|
|
total: 0,
|
|
queryKey: '',
|
|
loading: true,
|
|
dialogVisible: false,
|
|
logId: '',
|
|
wmsLogEntity: reactive({}),
|
|
labelPosition: 'top',
|
|
wmsLogFormRef: ref(),
|
|
rules: reactive({})
|
|
}
|
|
},
|
|
mounted() {
|
|
this.search()
|
|
},
|
|
methods: {
|
|
search() {
|
|
this.loading = true
|
|
this.pageInfo.pageNum = this.currentPage
|
|
this.pageInfo.pageSize = this.pageSize
|
|
const tableRequest = {
|
|
page: this.pageInfo,
|
|
param: {
|
|
logRequest: this.queryKey.trim()
|
|
},
|
|
}
|
|
queryLogs(tableRequest).then(res => {
|
|
const tableResponse = res.data
|
|
if (tableResponse.code != 0) {
|
|
ElMessage.error(tableResponse.message)
|
|
}
|
|
this.wmsLogs = tableResponse.rows
|
|
this.total = tableResponse.total
|
|
}).catch(err => {
|
|
ElMessage.error('查询物料错误' + err.message)
|
|
})
|
|
this.loading = false
|
|
},
|
|
timeFormat: (row, column, cellValue, index) => {
|
|
return timeFormatter(cellValue)
|
|
},
|
|
reset() {
|
|
this.queryKey = ''
|
|
this.search
|
|
},
|
|
detailCurrentRowLog(row) {
|
|
this.wmsLogEntity = row
|
|
this.dialogVisible = true
|
|
},
|
|
getCurrentRow(row) {
|
|
this.logId = row.logId
|
|
},
|
|
jsonFormat(value) {
|
|
try {
|
|
return JSON.stringify(JSON.parse(value), null, 4)
|
|
} catch(e) {
|
|
return value
|
|
}
|
|
}
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.el-pagination {
|
|
padding-left: 5px;
|
|
}
|
|
|
|
.el-row .el-button {
|
|
width: 72px;
|
|
margin-left: 0px;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.table-class {
|
|
width: 100%;
|
|
}
|
|
|
|
.el-row .el-form-item {
|
|
width: 10% inherit;
|
|
justify-content: center;
|
|
}
|
|
|
|
.el-row .el-form-item .el-select-v2 {
|
|
width: 100% !important;
|
|
}
|
|
|
|
.el-row .el-form-item .el-input-number {
|
|
width: 100% !important;
|
|
}
|
|
|
|
.el-row .el-form-item .el-button {
|
|
margin: auto;
|
|
}
|
|
</style> |