ソースを参照

feat: adjust some styles

Casper Dai 2 年 前
コミット
f9b10336b2
3 ファイル変更33 行追加24 行削除
  1. 1 1
      src/api/device.js
  2. 31 22
      src/layout/components/Notify.vue
  3. 1 1
      src/utils/upload.js

+ 1 - 1
src/api/device.js

@@ -401,7 +401,7 @@ export function getDeviceAlarms (query) {
               origin: true
             }
             : null,
-          type: bugMessage || `预警码【${type}】`,
+          type: bugMessage || `E${type.toString().padStart(3, '0')}`,
           handle: handeEnum[handle] || '-',
           status: handle <= 2 && status <= 2
             ? {

+ 31 - 22
src/layout/components/Notify.vue

@@ -1,9 +1,12 @@
 <template>
   <div
     v-if="hasMsg"
-    class="c-notify"
+    class="c-notify u-width--lg"
   >
-    <el-table :data="tableData">
+    <el-table
+      size="small"
+      :data="tableData"
+    >
       <el-table-column
         :label="title"
         class-name="notify-column"
@@ -14,7 +17,7 @@
             icon-class="v0-alarm"
             :color="scope.row.color"
           />
-          <span style="padding:10px;">{{ scope.row.happenTime }} {{ scope.row.deviceName }} {{ scope.row.bugName || `预警码【${scope.row.deviceErrorId}】` }}</span>
+          <span style="padding: 8px 0 8px 4px;">{{ scope.row.message }}</span>
         </template>
       </el-table-column>
       <el-table-column
@@ -57,8 +60,11 @@ export default {
     }
   },
   computed: {
-    ...mapGetters(['userId']),
+    ...mapGetters(['isSuperAdmin', 'userId']),
     topic () {
+      if (this.isSuperAdmin) {
+        return 'dashboard/event'
+      }
       return `user/event/${this.userId}`
     },
     title () {
@@ -71,11 +77,7 @@ export default {
       return this.msgData.length > 0
     },
     tableData () {
-      return this.msgData.slice(0, 5).map(msg => {
-        const { level } = msg
-        msg.color = AlarmColors[level] || AlarmColors[2]
-        return msg
-      })
+      return this.msgData.slice(0, 5)
     }
   },
   mounted () {
@@ -95,7 +97,21 @@ export default {
     },
     onMessage (topic, message) {
       if (topic === this.topic) {
-        this.msgData.unshift(JSON.parse(message))
+        this.msgData.unshift(this.transform(JSON.parse(message)))
+      }
+    },
+    transform ({ tenant, level, happenTime, deviceName, deviceErrorId, bugName }) {
+      const errorCode = bugName || `E${deviceErrorId.toString().padStart(3, '0')}`
+      const time = happenTime.split(' ')[1]
+      let message = ''
+      if (this.isSuperAdmin) {
+        message = `${time} ${errorCode}【${tenant} ${deviceName}】`
+      } else {
+        message = `${time} ${errorCode}【${deviceName}】`
+      }
+      return {
+        color: AlarmColors[level] || AlarmColors[2],
+        message
       }
     },
     onClear () {
@@ -112,32 +128,25 @@ export default {
 .c-notify {
   position: fixed;
   display: flex;
-  width: 300px;
   right: $spacing;
   bottom: $spacing;
+  border-radius: 8px 8px 0 0;
+  box-shadow: 0 0 16px rgba(0, 0, 0, 0.25);
   z-index: 2000;
-  overflow: hidden;
-  text-overflow: ellipsis;
 
   ::v-deep .el-table {
-    border-radius: 8px;
-    box-shadow: 10px rgba(0, 0, 0, 0.25);
+    border-radius: 8px 8px 0 0;
 
     &__cell {
-      padding: 4px 0;
+      padding: 2px 0;
     }
 
     .notify-column .cell {
-      padding-right: 0;
-    }
-
-    .cell {
-      font-size: $font-size--sm;
+      padding: 0 0 0 6px;
     }
 
     th.el-table__cell {
       color: white;
-      font-size: $font-size;
       background-color: #1c5cb0;
     }
   }

+ 1 - 1
src/utils/upload.js

@@ -558,7 +558,7 @@ async function startCheck (obj) {
     })
   } catch (e) {
     if (!isResolved(obj)) {
-      setInvalid(obj, `${obj.name}校验失败`, e)
+      setInvalid(obj, `${obj.name}服务器校验失败`, e)
     }
     return
   }