add:添加日志

acs/nladmin-ui/src/api/acs/lucene/log.js

@@ -1,5 +1,13 @@
 import request from '@/utils/request'
 
+export function getAddressLog(data) {
+  return request({
+    url: 'api/lucene/getAddressLog',
+    method: 'post',
+    data
+  })
+}
+
 export function delAll(id) {
   return request({
     url: 'api/lucene/' + id,
@@ -7,4 +15,4 @@ export function delAll(id) {
   })
 }
 
-export default { delAll }
+export default { getAddressLog, delAll }

acs/nladmin-ui/src/views/monitor/logQuery/index.vue

@@ -1,148 +1,443 @@
 <template>
   <div class="app-container">
     <div class="head-container">
-      <Search />
-      <crudOperation />
+      <!-- 搜索表单 -->
+      <el-form :inline="true" size="small" class="search-form">
+        <el-form-item label="日志级别">
+          <el-select
+            v-model="queryParams.logLevel"
+            clearable
+            placeholder="日志级别"
+            style="width: 150px"
+          >
+            <el-option label="DEBUG" :value="0" />
+            <el-option label="INFO" :value="1" />
+            <el-option label="WARN" :value="2" />
+            <el-option label="ERROR" :value="3" />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="日志类型">
+          <el-input
+            v-model="queryParams.logType"
+            clearable
+            placeholder="日志类型"
+            style="width: 150px;"
+          />
+        </el-form-item>
+
+        <el-form-item label="设备编号">
+          <el-input
+            v-model="queryParams.deviceCode"
+            clearable
+            placeholder="设备编号"
+            style="width: 150px;"
+          />
+        </el-form-item>
+
+        <el-form-item label="请求地址">
+          <el-input
+            v-model="queryParams.requestUrl"
+            clearable
+            placeholder="请求地址"
+            style="width: 200px;"
+          />
+        </el-form-item>
+
+        <el-form-item label="方法">
+          <el-select
+            v-model="queryParams.method"
+            clearable
+            filterable
+            placeholder="方法名"
+            style="width: 250px"
+          >
+            <el-option v-for="item in methods" :key="item.value" :label="item.label" :value="item.value" />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="方法名称">
+          <el-input
+            v-model="queryParams.methodName"
+            clearable
+            placeholder="方法名称"
+            style="width: 150px;"
+          />
+        </el-form-item>
+
+        <el-form-item label="内容详情">
+          <el-input
+            v-model="queryParams.content"
+            clearable
+            placeholder="内容详情"
+            style="width: 200px;"
+          />
+        </el-form-item>
+
+        <el-form-item label="请求参数">
+          <el-input
+            v-model="queryParams.requestParam"
+            clearable
+            placeholder="请求参数"
+            style="width: 200px;"
+          />
+        </el-form-item>
+
+        <el-form-item label="响应参数">
+          <el-input
+            v-model="queryParams.responseParam"
+            clearable
+            placeholder="响应参数"
+            style="width: 200px;"
+          />
+        </el-form-item>
+
+        <el-form-item label="状态码">
+          <el-select
+            v-model="queryParams.status"
+            clearable
+            placeholder="状态码"
+            style="width: 150px"
+          >
+            <el-option label="200 OK" value="200" />
+            <el-option label="400 Bad Request" value="400" />
+            <el-option label="401 Unauthorized" value="401" />
+            <el-option label="403 Forbidden" value="403" />
+            <el-option label="404 Not Found" value="404" />
+            <el-option label="500 Internal Server Error" value="500" />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="请求方向">
+          <el-select
+            v-model="queryParams.requestDirection"
+            clearable
+            placeholder="请求方向"
+            style="width: 150px"
+          >
+            <el-option label="TO_ACS" value="TO_ACS" />
+            <el-option label="ACS_TO_HJX" value="ACS_TO_HJX" />
+            <el-option label="ACS_TO_MES" value="ACS_TO_MES" />
+            <el-option label="ACS_TO_KIT" value="ACS_TO_KIT" />
+            <el-option label="ACS_TO_WMS" value="ACS_TO_WMS" />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="时间范围">
+          <el-date-picker
+            v-model="timeRange"
+            type="datetimerange"
+            :picker-options="pickerOptions"
+            format="yyyy-MM-dd HH:mm:ss"
+            value-format="timestamp"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            style="width: 350px"
+          />
+        </el-form-item>
+
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>
+          <el-button icon="el-icon-refresh" @click="handleReset">重置</el-button>
+        </el-form-item>
+      </el-form>
     </div>
+
     <!--表格渲染-->
     <el-table
       ref="table"
-      v-loading="crud.loading"
-      :data="crud.data"
+      v-loading="loading"
+      :data="tableData"
       style="width: 100%;"
-      @selection-change="crud.selectionChangeHandler"
     >
-      <!--      <el-table-column type="selection" width="55"/>-->
-      <!--      <el-table-column v-if="false" prop="id" label="id"/>-->
-      <!-- <el-table-column prop="trace_id" label="链路追踪" /> -->
-      <el-table-column prop="method" label="方法" width="150px" />
-      <el-table-column prop="requestparam" label="请求参数" class="text-wrapper">
+      <el-table-column prop="logLevelName" label="日志级别" width="100px" align="center">
         <template slot-scope="scope">
-          <div @click="handleClick(scope.row.requestparam)">
-            {{ truncateOrFullText(scope.row.requestparam) }}
-          </div>
+          <el-tag v-if="scope.row.logLevelName === '0'" type="info" size="small">DEBUG</el-tag>
+          <el-tag v-else-if="scope.row.logLevelName === '1'" type="success" size="small">INFO</el-tag>
+          <el-tag v-else-if="scope.row.logLevelName === '2'" type="warning" size="small">WARN</el-tag>
+          <el-tag v-else-if="scope.row.logLevelName === '3'" type="danger" size="small">ERROR</el-tag>
+          <span v-else>{{ scope.row.logLevelName }}</span>
         </template>
       </el-table-column>
-      <el-table-column prop="responseparam" label="返回参数" class="text-wrapper">
-        <template slot-scope="scope">
-          <div>
-            <pre class="json-pre">{{ scope.row.responseparam }}</pre>
-          </div>
-        </template>
-      </el-table-column>
-      <el-table-column prop="logTime" label="记录时间" width="190px" />
-      <el-table-column prop="content" label="内容详情" class="text-wrapper" />
 
+      <el-table-column prop="logTypeName" label="日志类型" width="120px" />
+
+      <el-table-column prop="deviceCode" label="设备编号" width="120px" />
+
+      <el-table-column prop="requestUrl" label="请求地址" width="200px" show-overflow-tooltip />
+
+      <el-table-column prop="method" label="方法" width="250px" show-overflow-tooltip />
+
+      <el-table-column prop="methodName" label="方法名称" width="150px" show-overflow-tooltip />
+
+      <el-table-column prop="content" label="内容详情" width="150px" show-overflow-tooltip />
+
+      <el-table-column prop="requestParam" label="请求参数" width="200px">
+        <template slot-scope="scope">
+          <div class="text-wrapper" @click="handleClick(scope.row.requestParam, '请求参数')">
+            {{ truncateText(scope.row.requestParam, 50) }}
+          </div>
+        </template>
+      </el-table-column>
+
+      <el-table-column prop="responseParam" label="响应参数" width="200px">
+        <template slot-scope="scope">
+          <div class="text-wrapper" @click="handleClick(scope.row.responseParam, '响应参数')">
+            {{ truncateText(scope.row.responseParam, 50) }}
+          </div>
+        </template>
+      </el-table-column>
+
+      <el-table-column prop="statusName" label="状态码" width="100px" align="center">
+        <template slot-scope="scope">
+          <el-tag v-if="scope.row.statusName === '200'" type="success" size="small">{{ scope.row.statusName }}</el-tag>
+          <el-tag v-else-if="scope.row.statusName && scope.row.statusName.startsWith('4')" type="warning" size="small">{{ scope.row.statusName }}</el-tag>
+          <el-tag v-else-if="scope.row.statusName && scope.row.statusName.startsWith('5')" type="danger" size="small">{{ scope.row.statusName }}</el-tag>
+          <span v-else>{{ scope.row.statusName }}</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column prop="requestDirectionName" label="请求方向" width="120px" align="center">
+        <template slot-scope="scope">
+          <el-tag v-if="scope.row.requestDirectionName === 'TO_ACS'" type="primary" size="small">TO_ACS</el-tag>
+          <el-tag v-else type="success" size="small">{{ scope.row.requestDirectionName }}</el-tag>
+        </template>
+      </el-table-column>
+
+      <el-table-column prop="executeTime" label="执行时间(s)" width="120px" align="right" />
+
+      <el-table-column prop="startTime" label="开始时间" width="180px">
+        <template slot-scope="scope">
+          {{ formatTimestamp(scope.row.startTime) }}
+        </template>
+      </el-table-column>
     </el-table>
+
     <!--分页组件-->
-    <pagination />
+    <el-pagination
+      :current-page="pagination.page"
+      :page-sizes="[10, 20, 50, 100]"
+      :page-size="pagination.size"
+      :total="pagination.total"
+      layout="total, sizes, prev, pager, next, jumper"
+      style="margin-top: 20px; text-align: right;"
+      @size-change="handleSizeChange"
+      @current-change="handlePageChange"
+    />
   </div>
 </template>
 
 <script>
-import Search from './search'
-import CRUD, { crud, header, presenter } from '@crud/crud'
-import crudOperation from '@crud/CRUD.operation'
-import pagination from '@crud/Pagination'
-import { delAll } from '@/api/acs/lucene/log'
+import { getAddressLog } from '@/api/acs/lucene/log'
+import { queryAddressCodeList } from '@/api/acs/Address'
 
 export default {
   name: 'LuceneLog',
-  components: { Search, pagination, crudOperation },
-  mixins: [presenter(), header(), crud()],
-  cruds: function() {
-    return CRUD({
-      title: '系统参数', url: 'api/lucene/getAddressLog', idField: 'id', sort: 'id,desc',
-      queryOnPresenterCreated: true,
-      optShow: {
-        add: false,
-        edit: false,
-        del: false,
-        download: false
-      },
-      page: {
-        size: 40,
-        total: 0,
-        page: 0
-      },
-      query: {
-        createTime: [new Date(new Date().setTime(new Date().getTime() - 3600 * 1000)), new Date(new Date().setTime(new Date().getTime() + 3600 * 1000))]
-      }
-    })
-  },
   data() {
     return {
-      query: { blurry: '123' },
-      permission: {
-        add: ['admin', 'param:add'],
-        edit: ['admin', 'param:edit'],
-        del: ['admin', 'param:del']
+      loading: false,
+      tableData: [],
+      methods: [],
+      timeRange: [],
+      queryParams: {
+        logLevel: null,
+        logType: '',
+        deviceCode: '',
+        requestUrl: '',
+        method: '',
+        methodName: '',
+        content: '',
+        requestParam: '',
+        responseParam: '',
+        status: '',
+        requestDirection: ''
       },
-      rules: {}
+      pagination: {
+        page: 1,
+        size: 10,
+        total: 0
+      },
+      pickerOptions: {
+        shortcuts: [{
+          text: '最近一周',
+          onClick(picker) {
+            const end = new Date()
+            const start = new Date()
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
+            picker.$emit('pick', [start, end])
+          }
+        }, {
+          text: '最近一个月',
+          onClick(picker) {
+            const end = new Date()
+            const start = new Date()
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
+            picker.$emit('pick', [start, end])
+          }
+        }, {
+          text: '最近三个月',
+          onClick(picker) {
+            const end = new Date()
+            const start = new Date()
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
+            picker.$emit('pick', [start, end])
+          }
+        }]
+      }
     }
   },
   created() {
+    this.loadMethods()
+    this.loadData()
   },
   methods: {
-    truncateOrFullText(text) {
-      debugger
-      if (text != null && text.length > 1000) {
-        return text.slice(0, 1000) + '...'
+    // 加载方法列表
+    loadMethods() {
+      queryAddressCodeList().then(data => {
+        this.methods = data.content
+      })
+    },
+    // 加载日志数据
+    loadData() {
+      this.loading = true
+      const params = {
+        ...this.queryParams,
+        page: this.pagination.page,
+        size: this.pagination.size
+      }
+
+      // 处理时间范围
+      if (this.timeRange && this.timeRange.length === 2) {
+        params.begin_time = this.timeRange[0]
+        params.end_time = this.timeRange[1]
+      }
+
+      // 移除空值
+      Object.keys(params).forEach(key => {
+        if (params[key] === '' || params[key] === null) {
+          delete params[key]
+        }
+      })
+
+      getAddressLog(params).then(res => {
+        this.tableData = res.data || []
+        this.pagination.total = res.total || 0
+        this.pagination.page = res.page || 1
+        this.loading = false
+      }).catch(() => {
+        this.loading = false
+      })
+    },
+    // 查询
+    handleQuery() {
+      this.pagination.page = 1
+      this.loadData()
+    },
+    // 重置
+    handleReset() {
+      this.queryParams = {
+        logLevel: null,
+        logType: '',
+        deviceCode: '',
+        requestUrl: '',
+        method: '',
+        methodName: '',
+        content: '',
+        requestParam: '',
+        responseParam: '',
+        status: '',
+        requestDirection: ''
+      }
+      this.timeRange = []
+      this.pagination.page = 1
+      this.loadData()
+    },
+    // 分页大小改变
+    handleSizeChange(val) {
+      this.pagination.size = val
+      this.pagination.page = 1
+      this.loadData()
+    },
+    // 页码改变
+    handlePageChange(val) {
+      this.pagination.page = val
+      this.loadData()
+    },
+    // 截断文本
+    truncateText(text, maxLength = 50) {
+      if (!text) return ''
+      if (text.length > maxLength) {
+        return text.slice(0, maxLength) + '...'
       }
       return text
     },
-    handleClick(content) {
-      debugger
-      if (content.length > 1000) {
-        this.$alert(content, '完整内容', {
+    // 点击查看完整内容
+    handleClick(content, title = '完整内容') {
+      if (!content) return
+      if (content.length > 50) {
+        // 尝试格式化 JSON
+        let displayContent = content
+        try {
+          const jsonObj = JSON.parse(content)
+          displayContent = '<pre style="max-height: 500px; overflow: auto; text-align: left;">' +
+                          JSON.stringify(jsonObj, null, 2) + '</pre>'
+        } catch (e) {
+          displayContent = '<pre style="max-height: 500px; overflow: auto; text-align: left; white-space: pre-wrap;">' +
+                          content + '</pre>'
+        }
+        this.$alert(displayContent, title, {
           confirmButtonText: '关闭',
           dangerouslyUseHTMLString: true,
           customClass: 'full-content-alert'
         })
       }
     },
-    // 钩子：在获取表格数据之前执行，false 则代表不获取数据
-    [CRUD.HOOK.beforeRefresh]() {
-      return true
-    },
-    confirmDelAll() {
-      this.$confirm(`确认清空所有操作日志吗?`, '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        this.crud.delAllLoading = true
-        delAll('device_execute').then(res => {
-          this.crud.delAllLoading = false
-          this.crud.dleChangePage(1)
-          this.crud.delSuccessNotify()
-          this.crud.toQuery()
-        }).catch(err => {
-          this.crud.delAllLoading = false
-          console.log(err.response.data.message)
-        })
-      }).catch(() => {
-      })
+    // 格式化时间戳
+    formatTimestamp(timestamp) {
+      if (!timestamp) return ''
+      const date = new Date(timestamp)
+      const year = date.getFullYear()
+      const month = String(date.getMonth() + 1).padStart(2, '0')
+      const day = String(date.getDate()).padStart(2, '0')
+      const hours = String(date.getHours()).padStart(2, '0')
+      const minutes = String(date.getMinutes()).padStart(2, '0')
+      const seconds = String(date.getSeconds()).padStart(2, '0')
+      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
     }
   }
 }
 </script>
 
 <style scoped>
+.search-form {
+  background: #f5f5f5;
+  padding: 20px;
+  border-radius: 4px;
+  margin-bottom: 20px;
+}
+
 .text-wrapper {
   word-break: break-all;
   word-wrap: break-word;
   cursor: pointer;
-  overflow: hidden;
-  text-overflow: ellipsis;
+  color: #409EFF;
+  text-decoration: underline;
 }
+
+.text-wrapper:hover {
+  color: #66b1ff;
+}
+
 .full-content-alert {
-  max-width: none; /* 如果需要自定义 tooltip 的宽度可以在这里设置 */
+  width: 80%;
+  max-width: 1200px;
 }
+
 .json-pre {
-  font-family: Arial, Helvetica, sans-serif;
-  max-height: 200px; /* 根据需要设置最大高度 */
-  overflow: auto; /* 添加滚动条 */
-  white-space: pre-wrap; /* 保留空格和换行 */
+  font-family: 'Courier New', Courier, monospace;
+  max-height: 200px;
+  overflow: auto;
+  white-space: pre-wrap;
+  word-wrap: break-word;
 }
 </style>

acs/nladmin-ui/src/views/monitor/logQuery/search.vue

@@ -1,62 +1,134 @@
 <template>
   <div v-if="crud.props.searchToggle">
-    <!--    <el-input-->
-    <!--      v-model="query.method"-->
-    <!--      clearable-->
-    <!--      size="small"-->
-    <!--      placeholder="请输入你要搜索的方法名"-->
-    <!--      style="width: 200px;"-->
-    <!--      class="filter-item"-->
-    <!--    />-->
+    <el-select
+      v-model="query.logLevel"
+      clearable
+      size="small"
+      placeholder="日志级别"
+      class="filter-item"
+      style="width: 150px"
+    >
+      <el-option label="DEBUG" :value="0" />
+      <el-option label="INFO" :value="1" />
+      <el-option label="WARN" :value="2" />
+      <el-option label="ERROR" :value="3" />
+    </el-select>
+
+    <el-input
+      v-model="query.logType"
+      clearable
+      size="small"
+      placeholder="日志类型"
+      style="width: 150px;"
+      class="filter-item"
+    />
+
+    <el-input
+      v-model="query.deviceCode"
+      clearable
+      size="small"
+      placeholder="设备编号"
+      style="width: 150px;"
+      class="filter-item"
+    />
+
+    <el-input
+      v-model="query.requestUrl"
+      clearable
+      size="small"
+      placeholder="请求地址"
+      style="width: 200px;"
+      class="filter-item"
+    />
+
     <el-select
       v-model="query.method"
       clearable
       filterable
       size="small"
-      placeholder="请输入你要搜索的方法名"
+      placeholder="方法名"
       class="filter-item"
-      style="width: 200px"
-      @change="crud.toQuery"
+      style="width: 250px"
     >
-      <el-option v-for="item in methods" :key="item.id" :label="item.label" :value="item.value" />
+      <el-option v-for="item in methods" :key="item.value" :label="item.label" :value="item.value" />
     </el-select>
+
     <el-input
-      v-model="query.requestparam"
+      v-model="query.methodName"
       clearable
       size="small"
-      placeholder="请输入你要搜索的请求参数"
+      placeholder="方法名称"
+      style="width: 150px;"
+      class="filter-item"
+    />
+
+    <el-input
+      v-model="query.content"
+      clearable
+      size="small"
+      placeholder="内容详情"
       style="width: 200px;"
       class="filter-item"
     />
+
     <el-input
-      v-model="query.responseparam"
+      v-model="query.requestParam"
       clearable
       size="small"
-      placeholder="请输入你要搜索的返回参数"
+      placeholder="请求参数"
       style="width: 200px;"
       class="filter-item"
     />
+
     <el-input
-      v-model="query.blurry"
+      v-model="query.responseParam"
       clearable
       size="small"
-      placeholder="请输入你要搜索的内容详情"
+      placeholder="响应参数"
       style="width: 200px;"
       class="filter-item"
     />
-    <!--
-        <date-range-picker v-model="query.createTime" class="date-item" />
-    -->
+
+    <el-select
+      v-model="query.status"
+      clearable
+      size="small"
+      placeholder="状态码"
+      class="filter-item"
+      style="width: 150px"
+    >
+      <el-option label="200 OK" value="200" />
+      <el-option label="400 Bad Request" value="400" />
+      <el-option label="401 Unauthorized" value="401" />
+      <el-option label="403 Forbidden" value="403" />
+      <el-option label="404 Not Found" value="404" />
+      <el-option label="500 Internal Server Error" value="500" />
+    </el-select>
+
+    <el-select
+      v-model="query.requestDirection"
+      clearable
+      size="small"
+      placeholder="请求方向"
+      class="filter-item"
+      style="width: 150px"
+    >
+      <el-option label="TO_ACS" value="TO_ACS" />
+      <el-option label="FROM_ACS" value="FROM_ACS" />
+    </el-select>
 
     <el-date-picker
       v-model="query.createTime"
       type="datetimerange"
       :picker-options="pickerOptions"
       format="yyyy-MM-dd HH:mm:ss"
-      start-placeholder="开始日期"
-      end-placeholder="结束日期"
+      value-format="timestamp"
+      start-placeholder="开始时间"
+      end-placeholder="结束时间"
+      :editable="true"
       class="date-item1"
     />
+
     <rrOperation />
   </div>
 </template>
@@ -99,9 +171,7 @@ export default {
             picker.$emit('pick', [start, end])
           }
         }]
-      },
-      value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
-      value2: ''
+      }
     }
   },
   created() {
@@ -113,13 +183,18 @@ export default {
 </script>
 
 <style scoped>
+.filter-item {
+  margin-right: 10px;
+  margin-bottom: 10px;
+}
+
 .date-item1 {
   display: inline-block;
   vertical-align: middle;
   margin-bottom: 10px;
+  margin-right: 10px;
   height: 30.5px !important;
   width: 350px;
 }
-
 </style>