<template>
   <div class="header">
        <img class="header_l" :src="logoImg"/>
        <div class="header_c">实验室安全智能监测与控制系统</div>
        <img class="header_r" src="@/assets/image/index_icon16.png" @click="back"/>
   </div>
</template>

<script>
import {} from "../api/http"
export default {
  name: 'HelloWorld',
  setup(){
    return {
      logoImg:localStorage.getItem('logoImg'),
    }
  },
  methods:{
    back(){
      this.$router.push('/')
    },
  },
  mounted() {

  }
}
</script>

<style lang="scss" scoped>
@function rw($px){

  @return $px*100/1920 *1vw;
}
@function rh($px){

  @return $px*100/1080 *1vh;
}
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
.header {
  width: 100%;
  position: absolute;
  left: rw(0);
  top: rh(0);
  z-index: 100;
  display: flex;
  justify-content: flex-start;

.header_l {
  width: rw(182);
  height: rh(44);
  margin: rh(10) 0 0 rw(40);
}
.header_c {
  width: rw(1180);
  height: rh(152);
  margin-left: rw(136);
  background: url("~@/assets/image/index_icon2.png") no-repeat;
  background-size: 100% 100%;
  font-size: rh(30);
  font-family: Microsoft YaHei;
  font-weight: bold;
  color: #FFFFFF;
  line-height: rh(30);
  text-align: center;
  padding-top: rh(26);
}
.header_r {
  margin-left: rw(264);
  width: rw(82);
  height: rh(32);
  margin-top: rh(18);
}
}
</style>
