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

<template>
  <div class="ibps-layout-header-user">
    <el-tooltip class="item" effect="dark" content="系统架构图" placement="bottom">
          <el-button type="text" @click="open" style="color:#409EFF;font-size:16px;" icon="el-icon-set-up"></el-button>
    </el-tooltip>
  </div>
</template>

<script>
import imgSrc from '../header-architecture/assets/systemArchitecture.png'
export default {
 
  data() {
    return{

    }
  },

  methods: {
    open() {
      this.$alert('<img src="'+imgSrc+'" alt="" srcset="" style = "width:100%">', '系统架构图', {
        dangerouslyUseHTMLString: true,
        center: true,
        showConfirmButton: false,
        customClass: 'headerArchitectureMessageCss'
      }).catch(()=>{}) ;
    }
  }
}
</script>
<style>
.headerArchitectureMessageCss{
  width: 85%;
}
</style>