日志样式修改

lms/nladmin-ui/src/views/loki/view/index.vue

@@ -95,7 +95,7 @@
         </el-form-item>
       </el-form>
     </div>
-    <div style="margin: 3px; min-height: 80vh;">
+  <!--  <div style="margin: 3px; min-height: 80vh;">
       <el-table :data="logs">
         <el-table-column label="ip" prop="requestIp" />
         <el-table-column label="所属系统" prop="system" />
@@ -105,9 +105,26 @@
         <el-table-column label="请求接口" prop="requestMethod" />
         <el-table-column label="logger" prop="logger" />
         <el-table-column label="thread" prop="thread" />
-        <el-table-column label="message" prop="message" />
+        <el-table-column label="message" prop="message" show-overflow-tooltip/>
       </el-table>
     </div>
+-->
+    <div style="margin: 3px; min-height: 80vh;">
+      <!--数据判空-->
+      <el-empty v-if="showEmpty" :description="emptyText" />
+      <!--数据加载-->
+      <el-card v-else shadow="hover" style="width: 100%;overflow-x: scroll" class="log-warpper">
+        <div style="width: 100%">
+          <div v-for="(log, index) in logs" :key="index">
+            <div>
+
+              <span style="margin: 5px;">{{log.system}}---{{log.message}}</span>
+            </div>
+
+          </div>
+        </div>
+      </el-card>
+    </div>
   </div>
 </template>
 
@@ -221,6 +238,7 @@ export default {
       queryParam.isRequest = this.filterSql === '1'
       queryParam.size = this.size
       queryParam.page = this.page
+
       logOperation.getLogData(queryParam).then(res => {
         this.showEmpty = false
         // 清空
@@ -254,7 +272,7 @@ export default {
 
 <style scoped>
 .log-warpper {
+  white-space: nowrap;
   word-break: break-word;
-  word-wrap: break-word
 }
 </style>