update

src/api/monitor/server.js

@@ -0,0 +1,9 @@
+import request from '@/utils/request'
+
+// 查询服务器详细
+export function getServer() {
+  return request({
+    url: '/api/v1/monitor/server',
+    method: 'get'
+  })
+}

src/components/Go-Admin/Doc/index.vue

@@ -0,0 +1,21 @@
+<template>
+  <div>
+    <svg-icon icon-class="question" @click="goto" />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'GoAdminDoc',
+  data() {
+    return {
+      url: 'http://doc.zhangwj.com/go-admin'
+    }
+  },
+  methods: {
+    goto() {
+      window.open(this.url)
+    }
+  }
+}
+</script>

src/components/Go-Admin/Donate/index.vue

@@ -0,0 +1,21 @@
+<template>
+  <div>
+    <svg-icon icon-class="heart" @click="goto" />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'GoAdminDonate',
+  data() {
+    return {
+      url: 'http://doc.zhangwj.com/go-admin-site/donate/'
+    }
+  },
+  methods: {
+    goto() {
+      window.open(this.url)
+    }
+  }
+}
+</script>

src/components/Go-Admin/Git/index.vue

@@ -0,0 +1,21 @@
+<template>
+  <div>
+    <svg-icon icon-class="github" @click="goto" />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'GoAdminGit',
+  data() {
+    return {
+      url: 'https://github.com/wenjianzhang/go-admin'
+    }
+  },
+  methods: {
+    goto() {
+      window.open(this.url)
+    }
+  }
+}
+</script>

src/layout/components/Navbar.vue

@@ -10,6 +10,18 @@
 
         <error-log class="errLog-container right-menu-item hover-effect" />
 
+        <el-tooltip content="源码地址" effect="dark" placement="bottom">
+          <go-admin-git id="go-admin-git" class="right-menu-item hover-effect" />
+        </el-tooltip>
+
+        <el-tooltip content="文档地址" effect="dark" placement="bottom">
+          <go-admin-doc id="go-admin-doc" class="right-menu-item hover-effect" />
+        </el-tooltip>
+
+        <el-tooltip content="打赏" effect="dark" placement="bottom">
+          <go-admin-donate id="go-admin-donatet" class="right-menu-item hover-effect" />
+        </el-tooltip>
+
         <screenfull id="screenfull" class="right-menu-item hover-effect" />
 
         <el-tooltip content="Global Size" effect="dark" placement="bottom">
@@ -53,6 +65,9 @@ import ErrorLog from '@/components/ErrorLog'
 import Screenfull from '@/components/Screenfull'
 import SizeSelect from '@/components/SizeSelect'
 import Search from '@/components/HeaderSearch'
+import GoAdminGit from '@/components/Go-Admin/Git'
+import GoAdminDoc from '@/components/Go-Admin/Doc'
+import GoAdminDonate from '@/components/Go-Admin/Donate'
 
 export default {
   components: {
@@ -61,7 +76,10 @@ export default {
     ErrorLog,
     Screenfull,
     SizeSelect,
-    Search
+    Search,
+    GoAdminGit,
+    GoAdminDoc,
+    GoAdminDonate
   },
   computed: {
     ...mapGetters([

src/layout/components/Sidebar/Logo.vue

@@ -25,7 +25,7 @@ export default {
   data() {
     return {
       title: 'DEV后台管理系统',
-      logo: 'https://wpimg.wallstcn.com/69a1c46c-eb1c-4b46-8bd4-e9e686ef5251.png'
+      logo: 'https://raw.githubusercontent.com/wenjianzhang/image/master/img/go-admin.png'
     }
   }
 }

src/views/monitor/server/index.vue

@@ -0,0 +1,166 @@
+<template>
+  <div class="app-container">
+    <el-row>
+
+      <el-col :span="12" class="card-box">
+        <el-card>
+          <div slot="header">
+            <span>服务器信息</span>
+          </div>
+          <div class="el-table el-table--enable-row-hover el-table--medium">
+            <table cellspacing="0" style="width: 100%;">
+              <thead>
+                <tr>
+                  <th class="is-leaf"><div class="cell">属性</div></th>
+                  <th class="is-leaf"><div class="cell">值</div></th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr>
+                  <td><div class="cell">服务器架构</div></td>
+                  <td><div v-if="server.os" class="cell">{{ server.os.arch }}</div></td>
+                </tr>
+                <tr>
+                  <td><div class="cell">操作系统</div></td>
+                  <td><div v-if="server.os" class="cell">{{ server.os.goOs }}</div></td>
+                </tr>
+                <tr>
+                  <td><div class="cell">核心数</div></td>
+                  <td><div v-if="server.cpu" class="cell">{{ server.cpu.cpuNum }}</div></td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </el-card>
+      </el-col>
+
+      <el-col :span="12" class="card-box">
+        <el-card>
+          <div slot="header"><span>内存</span></div>
+          <div class="el-table el-table--enable-row-hover el-table--medium">
+            <table cellspacing="0" style="width: 100%;">
+              <thead>
+                <tr>
+                  <th class="is-leaf"><div class="cell">属性</div></th>
+                  <th class="is-leaf"><div class="cell">值</div></th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr>
+                  <td><div class="cell">总内存</div></td>
+                  <td><div v-if="server.mem" class="cell">{{ server.mem.total }}G</div></td>
+
+                </tr>
+                <tr>
+                  <td><div class="cell">已用内存</div></td>
+                  <td><div v-if="server.mem" class="cell">{{ server.mem.used }}G</div></td>
+
+                </tr>
+                <tr>
+                  <td><div class="cell">使用率</div></td>
+                  <td><div v-if="server.mem" class="cell" :class="{'text-danger': server.mem.usage > 80}">{{ server.mem.usage }}%</div></td>
+
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </el-card>
+      </el-col>
+
+      <el-col :span="12" class="card-box">
+        <el-card>
+          <div slot="header">
+            <span>go运行环境</span>
+          </div>
+          <div class="el-table el-table--enable-row-hover el-table--medium">
+            <table cellspacing="0" style="width: 100%;">
+              <thead>
+                <tr>
+                  <th class="is-leaf"><div class="cell">属性</div></th>
+                  <th class="is-leaf"><div class="cell">值</div></th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr>
+                  <td><div class="cell">go version</div></td>
+                  <td><div v-if="server.os" class="cell">{{ server.os.version }}</div></td>
+                </tr>
+                <tr>
+                  <td><div class="cell">Goroutine</div></td>
+                  <td><div v-if="server.os" class="cell">{{ server.os.numGoroutine }}</div></td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </el-card>
+      </el-col>
+
+      <el-col :span="12" class="card-box">
+        <el-card>
+          <div slot="header">
+            <span>磁盘状态</span>
+          </div>
+          <div class="el-table el-table--enable-row-hover el-table--medium">
+            <table cellspacing="0" style="width: 100%;">
+              <thead>
+                <tr>
+                  <th class="is-leaf"><div class="cell">属性</div></th>
+                  <th class="is-leaf"><div class="cell">值</div></th>
+                </tr>
+              </thead>
+              <tbody v-if="server.disk">
+
+                <tr>
+                  <td><div class="cell">总共</div></td>
+                  <td><div class="cell">{{ server.disk.total }}</div></td>
+                </tr>
+                <tr>
+                  <td><div class="cell">可用</div></td>
+                  <td><div class="cell">{{ server.disk.free }}</div></td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { getServer } from '@/api/monitor/server'
+
+export default {
+  name: 'Server',
+  data() {
+    return {
+      // 加载层信息
+      loading: [],
+      // 服务器信息
+      server: []
+    }
+  },
+  created() {
+    this.getList()
+    this.openLoading()
+  },
+  methods: {
+    /** 查询服务器信息 */
+    getList() {
+      getServer().then(response => {
+        this.server = response
+        this.loading.close()
+      })
+    },
+    // 打开加载层
+    openLoading() {
+      this.loading = this.$loading({
+        lock: true,
+        text: '拼命读取中',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      })
+    }
+  }
+}
+</script>