feat: remote log

src/views/platform/remote-log/api.js

@@ -5,13 +5,22 @@ import {
   addTenant
 } from '@/api/base'
 
-// 设置日志抓取配置
-export function setRemoteLogConfig (data) {
-  return request({
+// 开启抓取日志
+export function startRemoteLog (data) {
+  return messageSend({
     url: `/device/remoteLog`,
     method: 'POST',
     data: addTenant(data)
-  })
+  }, '开始')
+}
+
+// 停止抓取日志
+export function stopRemoteLog (data) {
+  return messageSend({
+    url: `/device/remoteLog`,
+    method: 'POST',
+    data: addTenant(data)
+  }, '停止')
 }
 
 // 获取日志配置
@@ -23,30 +32,6 @@ export function getRemoteLogConfig (deviceId) {
   })
 }
 
-// 开启下发日志配置
-export function startRemoteLog (deviceId) {
-  return messageSend({
-    url: '/device/remoteLog/switch',
-    method: 'PUT',
-    data: {
-      activate: true,
-      deviceId
-    }
-  }, '开启')
-}
-
-// 停止下发日志配置
-export function stopRemoteLog (deviceId) {
-  return messageSend({
-    url: '/device/remoteLog/switch',
-    method: 'PUT',
-    data: {
-      activate: false,
-      deviceId
-    }
-  }, '停止')
-}
-
 // 设备上报记录查询
 export function getRemoteLogs (query) {
   const { pageNum: pageIndex, pageSize, ...params } = query
@@ -61,12 +46,12 @@ export function getRemoteLogs (query) {
 }
 
 // 获取心跳
-export function getHeartbeats (sn) {
-  if (sn) {
+export function getHeartbeats (mac) {
+  if (mac) {
     return request({
       url: '/device/remoteLog/singleHeartbeat',
       method: 'GET',
-      params: { sn }
+      params: { mac }
     })
   }
   return request({
@@ -74,3 +59,11 @@ export function getHeartbeats (sn) {
     method: 'GET'
   })
 }
+
+export function getDownloadUrl (recordId) {
+  return send({
+    url: `/device/remoteLog/download`,
+    method: 'GET',
+    params: { recordId }
+  })
+}

src/views/platform/remote-log/index.vue

@@ -21,8 +21,14 @@
     >
       <div class="c-sibling-item--v c-grid-form u-align-self--center">
         <div class="c-grid-form__row u-font-size--xs u-bold">
-          当前状态：{{ logSetting.activate ? '已下发配置' : '未下发配置' }}
+          <button
+            class="o-button"
+            @click="showDocument"
+          >
+            抓取说明
+          </button>
         </div>
+        <div class="c-grid-form__row u-font-size--xs u-bold">当前状态：{{ logSetting.activate ? '已下发配置' : '未下发配置' }}</div>
         <span class="c-grid-form__label u-required">抓取时长</span>
         <div class="l-flex--row">
           <el-input-number
@@ -77,20 +83,22 @@
       size="lg fixed"
       title="心跳记录"
       :schema="heartbeatSchema"
+      @hook:beforeDestroy="closeTimer"
     />
   </wrapper>
 </template>
 
 <script>
 import { parseTime } from '@/utils'
+import { getAssetUrl } from '@/api/asset'
 import { getDevicesByTenant } from '@/api/device'
 import {
   getRemoteLogConfig,
-  setRemoteLogConfig,
   startRemoteLog,
   stopRemoteLog,
   getRemoteLogs,
-  getHeartbeats
+  getHeartbeats,
+  getDownloadUrl
 } from './api'
 
 const defaultLogSettingForm = {
@@ -120,7 +128,7 @@ export default {
           { prop: 'mac', label: 'MAC' },
           { type: 'tag', render: ({ activate, onlineStatus }) => activate
             ? onlineStatus === 0
-              ? { type: 'primary', label: '已启用' }
+              ? { type: 'primary', label: '待接入' }
               : onlineStatus === 1
                 ? { type: 'success', label: '在线' }
                 : { type: 'danger', label: '离线' }
@@ -136,13 +144,17 @@ export default {
       heartbeatSchema: {
         nonPagination: true,
         list: this.getheartbeatData,
+        filters: [
+          { key: 'name', type: 'search', placeholder: '设备名称' }
+        ],
         cols: [
           { type: 'refresh' },
-          { prop: 'sn', label: '序列号' },
+          { prop: 'name', label: '设备名称', sortable: true },
+          { prop: 'sn', label: '序列号', sortable: true },
           { prop: 'mac', label: 'MAC', width: 140 },
           { prop: 'ip', label: 'ip', width: 140 },
           { prop: 'settingId', label: '当前事件' },
-          { label: '上报时间', render: ({ timestamp }) => parseTime(timestamp), width: 160 }
+          { label: '上报时间', render: ({ timestamp }) => parseTime(timestamp), sortable: true, sortBy: 'timestamp', width: 160 }
         ]
       },
       curDeviceId: null
@@ -162,13 +174,25 @@ export default {
               label: status ? '成功' : '失败'
             }
           } },
-          { prop: 'message', label: '备注', width: 320 },
-          { prop: 'createTime', label: '上传时间', width: 180 }
+          { prop: 'message', label: '备注' },
+          { prop: 'commandArrayString', label: '抓取命令数组' },
+          { prop: 'releaseTime', label: '命令发布时间', width: 180 },
+          { prop: 'createTime', label: '上传时间', width: 180 },
+          { type: 'invoke', render: [
+            { label: '下载日志', allow: ({ status }) => status, on: this.onDownload }
+          ] }
         ]
       }
     }
   },
+  beforeDestroy () {
+    this.closeTimer()
+  },
   methods: {
+    closeTimer () {
+      clearTimeout(this.$timer)
+      this.$timer = null
+    },
     onTenantChanged (tenant) {
       this.$tenant = tenant
       this.$refs.table?.pageTo(1)
@@ -179,6 +203,13 @@ export default {
       }
       return getDevicesByTenant(this.$tenant.path, params)
     },
+    onStop () {
+      stopRemoteLog({
+        duration: 60,
+        deviceId: this.curDeviceId,
+        activate: false
+      })
+    },
     onStart (device) {
       getRemoteLogConfig(device.id).then(({ data }) => {
         if (data) {
@@ -197,7 +228,7 @@ export default {
       })
     },
     async onConfirm (done) {
-      const { activate, duration, commands, reboot } = this.logSetting
+      const { duration, commands, reboot } = this.logSetting
       if (~commands.indexOf('；')) {
         this.$message({
           type: 'warning',
@@ -205,43 +236,83 @@ export default {
         })
         return
       }
-      if (activate) {
-        await stopRemoteLog(this.curDeviceId)
-      }
-      await setRemoteLogConfig({
+
+      await startRemoteLog({
         deviceId: this.curDeviceId,
         duration,
+        activate: true,
         commands: commands.split(';'),
         reboot
       })
-      await startRemoteLog(this.curDeviceId)
       done()
     },
-    onStop (device) {
-      stopRemoteLog(device.id)
-    },
     onResult (device) {
+      this.$deviceName = device.name
       this.curDeviceId = device.id
       this.$refs.resultDialog.show()
     },
     getheartbeatData () {
-      return getHeartbeats(this.$sn).then(({ data }) => {
+      this.closeTimer()
+      return getHeartbeats(this.$mac).then(({ data }) => {
+        this.$timer = setTimeout(() => {
+          this.$refs?.heartbeatDialog.getTable()?.onPagination()
+        }, 5 * 1000)
         if (!data) {
           return { data: [] }
         }
+
         if (Array.isArray(data)) {
+          if (this.$refs?.heartbeatDialog.getTable()?.options.params.name?.length) {
+            return { data: data.filter(i => i).map(i => JSON.parse(i))
+              .filter(i => new RegExp(this.$refs.heartbeatDialog.getTable().options.params.name).test(i.name)) }
+          }
           return { data: data.filter(i => i).map(i => JSON.parse(i)) }
         }
-        return { data: [JSON.parse(data)] }
+        data = JSON.parse(data)
+        if (this.$mac) {
+          const timestamp = data.timestamp
+          data.name = this.$deviceName
+          this.$heartBeatData = this.$heartBeatData || []
+          if (!(this.$heartBeatData.length && this.$heartBeatData[0].timestamp === timestamp)) {
+            this.$heartBeatData.unshift(data)
+          }
+
+          return { data: this.$heartBeatData }
+        }
+        return { data }
       })
     },
     onHeartbeats () {
-      this.$sn = null
+      this.$heartBeatData = []
+      this.$mac = null
+      this.heartbeatSchema.filters = [
+        { key: 'name', type: 'search', placeholder: '设备名称' }
+      ]
       this.$refs.heartbeatDialog.show()
     },
     onHeartbeat (device) {
-      this.$sn = device.serialNumber
+      this.$heartBeatData = []
+      this.$deviceName = device.name
+      this.$mac = device.mac
+      this.heartbeatSchema.filters = null
       this.$refs.heartbeatDialog.show()
+    },
+    showDocument () {
+      window.open('https://inspur-rd.feishu.cn/docx/M4oIdhmU1oFyvAxErn3cYv6Cnuf', '_blank')
+    },
+    onDownload ({ recordId, createTime }) {
+      getDownloadUrl(recordId).then(
+        ({ data: url }) => {
+          const a = document.createElement('a')
+          a.style.display = 'none'
+          a.setAttribute('target', '_blank')
+          a.setAttribute('download', `${this.$deviceName}-${createTime}日志`)
+          a.href = getAssetUrl(url)
+          document.body.appendChild(a)
+          a.click()
+          document.body.removeChild(a)
+        }
+      )
     }
   }
 }