From 2e1411009d091655384adebb4af9dfae09daf71b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=BE=9A=E7=A5=96=E6=9C=9B?= <573413756@qq.com>
Date: Wed, 26 Oct 2022 10:52:19 +0800
Subject: [PATCH] add log Data

---
 xiuosiot-frontend/src/api/log/accessLog.js    |   9 ++
 xiuosiot-frontend/src/api/log/systemLog.js    |   9 ++
 .../src/views/log/accessLog/index.vue         |  94 ++++---------
 .../src/views/log/systemLog/index.vue         | 129 +++++++-----------
 4 files changed, 95 insertions(+), 146 deletions(-)
 create mode 100644 xiuosiot-frontend/src/api/log/accessLog.js
 create mode 100644 xiuosiot-frontend/src/api/log/systemLog.js

diff --git a/xiuosiot-frontend/src/api/log/accessLog.js b/xiuosiot-frontend/src/api/log/accessLog.js
new file mode 100644
index 0000000..266cd4b
--- /dev/null
+++ b/xiuosiot-frontend/src/api/log/accessLog.js
@@ -0,0 +1,9 @@
+import request from '@/utils/request'
+
+export function getList(data) {
+  return request({
+    url: '/log/requestLog',
+    method: 'get',
+    data
+  })
+}
diff --git a/xiuosiot-frontend/src/api/log/systemLog.js b/xiuosiot-frontend/src/api/log/systemLog.js
new file mode 100644
index 0000000..caf0f9f
--- /dev/null
+++ b/xiuosiot-frontend/src/api/log/systemLog.js
@@ -0,0 +1,9 @@
+import request from '@/utils/request'
+
+export function getList(data) {
+  return request({
+    url: '/log/deviceLog',
+    method: 'get',
+    data
+  })
+}
diff --git a/xiuosiot-frontend/src/views/log/accessLog/index.vue b/xiuosiot-frontend/src/views/log/accessLog/index.vue
index 8dcef5c..bd9c56f 100644
--- a/xiuosiot-frontend/src/views/log/accessLog/index.vue
+++ b/xiuosiot-frontend/src/views/log/accessLog/index.vue
@@ -12,14 +12,14 @@
     </el-row>
     <div v-for="(item, index) in logList" :key="index" class="log-container">
       <p class="ip"><img src="@/assets/images/ip.png" width="40px">访问IP</p>
-      <p class="ip_val">{{ item.ip }}</p>
+      <p class="ip_val">{{ item.requestip }}</p>
       <div class="line" />
       <p class="content"><img src="@/assets/images/take_time.png">请求耗时</p>
-      <p class="content_val">{{ item.requestTime }}</p>
+      <p class="content_val">{{ item.processtime+'ms' }}</p>
       <p class="content"><img src="@/assets/images/path.png">请求路径</p>
-      <p class="content_val">{{ item.path }}</p>
+      <p class="content_val">{{ item.requesturl }}</p>
       <p class="content"><img src="@/assets/images/timestamp.png">请求时间</p>
-      <p class="content_val">{{ item.time }}</p>
+      <p class="content_val">{{ item.requesttime }}</p>
       <div class="footer">
         <span class="usr">
           <img src="@/assets/images/usr.png">{{ item.user }}
@@ -40,7 +40,7 @@
           <p class="ip">
             <img src="@/assets/images/ip_white_border.png" width="40px">访问IP
           </p>
-          <p class="ip_val">{{ current.ip }}</p>
+          <p class="ip_val">{{ current.requestip }}</p>
           <div class="remove_icon" @click="close">X</div>
         </div>
         <div class="dialog_content">
@@ -55,40 +55,40 @@
               <div class="item_title">
                 <img src="@/assets/images/clip.png">URL
               </div>
-              <div class="item_content">XXXXXXX</div>
+              <div class="item_content">{{ current.requesturl }}</div>
               <div class="item_title">
                 <img
                   src="@/assets/images/ip_without_border.png"
                   style="margin-right: 20px"
                 >IP
               </div>
-              <div class="item_content">XXXXX</div>
+              <div class="item_content">{{ current.requestip }}</div>
             </div>
             <div class="line" />
             <div class="form_content">
               <div class="item_title">
                 <img src="@/assets/images/http_method.png">请求<br>方法
               </div>
-              <div class="item_content">XXXXXXX</div>
+              <div class="item_content">{{ current.requesttype }}</div>
               <div class="item_title">
                 <img
                   src="@/assets/images/timestamp_without_border.png"
                 >请求<br>时间
               </div>
-              <div class="item_content">XXXXX</div>
+              <div class="item_content">{{ current.requesttime }}</div>
             </div>
             <div class="line" />
             <div class="form_content">
               <div class="item_title">
-                <img src="@/assets/images/action.png">动作
+                <img src="@/assets/images/action.png">请求<br>参数
               </div>
-              <div class="item_content">XXXXXXX</div>
+              <div class="item_content">{{ current.requestparam }}</div>
               <div class="item_title">
                 <img
                   src="@/assets/images/take_time_without_border.png"
                 >请求<br>耗时
               </div>
-              <div class="item_content">XXXXX</div>
+              <div class="item_content">{{ current.processtime+'ms' }}</div>
             </div>
             <div class="line" />
           </div>
@@ -97,29 +97,29 @@
               <div class="item_title">
                 <img src="@/assets/images/class.png">类名
               </div>
-              <div class="item_content">XXXXXXX</div>
+              <div class="item_content">{{ current.classname }}</div>
               <div class="item_title">
                 <img
                   src="@/assets/images/method.png"
                 >方法<br>名
               </div>
-              <div class="item_content">XXXXX</div>
+              <div class="item_content">{{ current.methodname }}</div>
             </div>
             <div class="line" />
             <div class="form_content">
               <div class="item_title">
                 <img src="@/assets/images/header.png">请求<br>头
               </div>
-              <div class="item_content">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</div>
+              <div class="item_content">{{ current.requestheader }}</div>
             </div>
             <div class="line" />
             <div class="form_content">
               <div class="item_title">
                 <img
                   src="@/assets/images/param.png"
-                >请求<br>参数
+                >返回<br>结果
               </div>
-              <div class="item_content">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</div>
+              <div class="item_content">{{ current.requestresult }}</div>
             </div>
             <div class="line" />
           </div>
@@ -130,61 +130,13 @@
 </template>
 
 <script>
+import { getList } from '@/api/log/accessLog'
+
 export default {
   data() {
     return {
       date: '',
-      logList: [
-        {
-          ip: '196.105.55.103',
-          requestTime: '35ms',
-          path: '/device/select?activestatus=0',
-          time: '2022-11-14 0:11:54',
-          user: '大胜达'
-        },
-        {
-          ip: '196.105.55.103',
-          requestTime: '35ms',
-          path: '/device/select?activestatus=0',
-          time: '2022-11-14 0:11:54',
-          user: '大胜达'
-        },
-        {
-          ip: '196.105.55.103',
-          requestTime: '35ms',
-          path: '/device/select?activestatus=0',
-          time: '2022-11-14 0:11:54',
-          user: '大胜达'
-        },
-        {
-          ip: '196.105.55.103',
-          requestTime: '35ms',
-          path: '/device/select?activestatus=0',
-          time: '2022-11-14 0:11:54',
-          user: '大胜达'
-        },
-        {
-          ip: '196.105.55.103',
-          requestTime: '35ms',
-          path: '/device/select?activestatus=0',
-          time: '2022-11-14 0:11:54',
-          user: '大胜达'
-        },
-        {
-          ip: '196.105.55.103',
-          requestTime: '35ms',
-          path: '/device/select?activestatus=0',
-          time: '2022-11-14 0:11:54',
-          user: '大胜达'
-        },
-        {
-          ip: '196.105.55.103',
-          requestTime: '35ms',
-          path: '/device/select?activestatus=0',
-          time: '2022-11-14 0:11:54',
-          user: '大胜达'
-        }
-      ],
+      logList: [],
       visible: false,
       radio: '基本信息',
       current: {}
@@ -192,8 +144,14 @@ export default {
   },
   mounted() {
     this.date = new Date().toLocaleDateString()
+    this.getList()
   },
   methods: {
+    getList() {
+      getList().then(res => {
+        this.logList = res.data
+      })
+    },
     showDetail(item) {
       this.current = item
       this.visible = true
diff --git a/xiuosiot-frontend/src/views/log/systemLog/index.vue b/xiuosiot-frontend/src/views/log/systemLog/index.vue
index 207dca6..e728ca1 100644
--- a/xiuosiot-frontend/src/views/log/systemLog/index.vue
+++ b/xiuosiot-frontend/src/views/log/systemLog/index.vue
@@ -10,19 +10,19 @@
         <span class="date">{{ date }}</span>
       </div>
     </el-row>
-    <div v-for="(item, index) in logList" :key="index" class="log-container" :style="{'background-image':'url('+getBgImg(item.level)+')'}">
+    <div v-for="(item, index) in logList" :key="index" class="log-container" :style="{'background-image':'url('+item.bgImg+')'}">
       <p class="ip"><img src="@/assets/images/sysLog_type.png" width="40px">设备名称</p>
-      <p class="ip_val">{{ item.type }}</p>
+      <p class="ip_val">{{ item.deviceType }}</p>
       <div class="line" />
       <p class="content"><img src="@/assets/images/sysLog_no.png">设备序列号</p>
-      <p class="content_val">{{ item.no }}</p>
+      <p class="content_val">{{ item.deviceNo }}</p>
       <p class="content"><img src="@/assets/images/sysLog_time.png">日志时间</p>
-      <p class="content_val">{{ item.time }}</p>
+      <p class="content_val">{{ item.logTime }}</p>
       <p class="content"><img src="@/assets/images/sysLog_thread.png">线程</p>
-      <p class="content_val">{{ item.thread }}</p>
+      <p class="content_val">{{ item.threadNo }}</p>
       <div class="footer">
-        <span class="usr" :style="getColor(item.level)">
-          {{ item.level }}
+        <span class="usr" :style="{'color':item.color}">
+          {{ item.levelDesc }}
         </span>
         <span
           class="detail"
@@ -40,22 +40,31 @@
           <p class="ip">
             <img src="@/assets/images/sysLog_type_white.png" width="40px">设备名称
           </p>
-          <p class="ip_val">{{ current.type }}</p>
+          <p class="ip_val">{{ current.deviceType }}</p>
           <div class="remove_icon" @click="close">X</div>
         </div>
         <div class="dialog_content">
           <div class="form">
             <div class="form_content">
               <div class="item_title">
-                <img src="@/assets/images/sysLog_link.png">链路<br>ID
+                <img src="@/assets/images/sysLog_link.png">设备<br>序列号
               </div>
-              <div class="item_content">XXXXXXX</div>
+              <div class="item_content">{{ current.deviceNo }}</div>
               <div class="item_title">
                 <img
                   src="@/assets/images/sysLog_msg.png"
-                >消息<br>ID
+                >线程
               </div>
-              <div class="item_content">XXXXX</div>
+              <div class="item_content">{{ current.threadNo }}</div>
+            </div>
+            <div class="line" />
+            <div class="form_content">
+              <div class="item_title">
+                <img
+                  src="@/assets/images/sysLog_content.png"
+                >日志<br>时间
+              </div>
+              <div class="item_content">{{ current.logTime }}</div>
             </div>
             <div class="line" />
             <div class="form_content">
@@ -64,7 +73,7 @@
                   src="@/assets/images/sysLog_content.png"
                 >日志<br>内容
               </div>
-              <div class="item_content">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</div>
+              <div class="item_content">{{ current.deviceLog }}</div>
             </div>
             <div class="line" />
           </div>
@@ -75,83 +84,47 @@
 </template>
 
 <script>
+import { getList } from '@/api/log/systemLog'
+
 export default {
   data() {
     return {
       date: '',
-      logList: [
-        {
-          type: 'RV400-NPU16T-5G-AR100',
-          no: 'A000008',
-          thread: 'thread1',
-          time: '2022-11-14 0:11:54',
-          level: 'Info'
-        },
-        {
-          type: 'RV400-NPU16T-5G-AR100',
-          no: 'A000008',
-          thread: 'thread1',
-          time: '2022-11-14 0:11:54',
-          level: 'Warning'
-        },
-        {
-          type: 'RV400-NPU16T-5G-AR100',
-          no: 'A000008',
-          thread: 'thread1',
-          time: '2022-11-14 0:11:54',
-          level: 'Error'
-        },
-        {
-          type: 'RV400-NPU16T-5G-AR100',
-          no: 'A000008',
-          thread: 'thread1',
-          time: '2022-11-14 0:11:54',
-          level: 'Error'
-        },
-        {
-          type: 'RV400-NPU16T-5G-AR100',
-          no: 'A000008',
-          thread: 'thread1',
-          time: '2022-11-14 0:11:54',
-          level: 'Info'
-        },
-        {
-          type: 'RV400-NPU16T-5G-AR100',
-          no: 'A000008',
-          thread: 'thread1',
-          time: '2022-11-14 0:11:54',
-          level: 'Info'
-        }
-      ],
+      logList: [],
       visible: false,
       current: {}
     }
   },
+  created() {
+    this.getList()
+  },
   mounted() {
     this.date = new Date().toLocaleDateString()
   },
   methods: {
-    getBgImg(level) {
-      if (level === 'Info') {
-        return require('@/assets/images/systemlog_box_info.png')
-      }
-      if (level === 'Warning') {
-        return require('@/assets/images/systemlog_box_warning.png')
-      }
-      if (level === 'Error') {
-        return require('@/assets/images/systemlog_box_error.png')
-      }
-    },
-    getColor(level) {
-      if (level === 'Info') {
-        return 'color:#FAF200'
-      }
-      if (level === 'Warning') {
-        return 'color:#FFB300'
-      }
-      if (level === 'Error') {
-        return 'color:#FF4E00'
-      }
+    getList() {
+      getList().then(res => {
+        this.logList = res.data.map(item => {
+          switch (item.logLevel) {
+            case 0:
+              item.bgImg = require('@/assets/images/systemlog_box_info.png')
+              item.color = '#FAF200'
+              item.levelDesc = 'Info'
+              break
+            case 1:
+              item.bgImg = require('@/assets/images/systemlog_box_warning.png')
+              item.color = '#FFB300'
+              item.levelDesc = 'Warning'
+              break
+            case 2:
+              item.bgImg = require('@/assets/images/systemlog_box_error.png')
+              item.color = '#FF4E00'
+              item.levelDesc = 'Error'
+              break
+          }
+          return item
+        })
+      })
     },
     showDetail(item) {
       this.current = item