系统架构图

src/layout/header-aside/components/header-architecture/index.vue

@@ -0,0 +1,31 @@
+<template>
+  <div class="ibps-layout-header-user">
+    <el-button type="text" @click="open" style="color:#000">系统架构图</el-button>
+  </div>
+</template>
+
+<script>
+import imgSrc from '../header-architecture/assets/systemArchitecture.png'
+export default {
+ 
+  data() {
+    
+  },
+
+  methods: {
+    open() {
+      this.$alert('<img src="'+imgSrc+'" alt="" srcset="" style = "width:100%">', '系统架构图', {
+        dangerouslyUseHTMLString: true,
+        center: true,
+        showConfirmButton: false,
+        customClass: 'headerArchitectureMessageCss'
+      });
+    }
+  }
+}
+</script>
+<style>
+.headerArchitectureMessageCss{
+  width: 98%;
+}
+</style>

src/layout/header-aside/layout.vue

@@ -96,6 +96,8 @@
 
                     <span style="font-size: 12px; cursor: pointer;" @click="goToMain()">首页</span>
                     <span style="margin: 0 10px;">|</span>
+                    <ibps-header-architecture />
+                    <span style="margin: 0 10px;">|</span>
                     <ibps-header-message />
                     <!-- 消息中心 -->
                     <span style="margin: 0 10px;">|</span>
@@ -179,6 +181,8 @@
     import IbpsHeaderSearch from './components/header-search'
     import FloatBall from './components/components/float-ball'
     import IbpsHeaderFullscreen from './components/header-fullscreen'
+    import IbpsHeaderArchitecture from './components/header-architecture'
+
     // import IbpsHeaderLocking from './components/header-locking'
     // import IbpsHeaderLanguage from './components/header-language'
     // import IbpsHeaderSize from './components/header-size'
@@ -210,6 +214,7 @@
             FloatBall,
             panle,
             IbpsHeaderFullscreen,
+            IbpsHeaderArchitecture,
             // IbpsHeaderLocking,
             // IbpsHeaderLanguage,
             // IbpsHeaderSize,