<template>
  <div class="navbar" :class="slideClass">

    <template> 
      <div style="
    height: 59px;
    position: fixed;
    left: 0px;
    z-index: 2000;
    background:#fff;
    padding:3px;
    padding-top:5px;
">
        <img :src="getLogoUrl()" style="height:46px;" class="sidebar-logo" />

      </div>
   

     </template>
    <!-- <span class="navbar-platform">快速开发平台</span> -->
    <NavbarRight />
  </div>
</template>

<script>
import { mapState } from 'vuex'
import NavbarRight from '../components/NavbarRight'

export default {
  components: { NavbarRight },
  computed: {
    ...mapState({
      slideClass: state => state.settings.slideClass,
      systemLogo: state => state.sysConfig.sysLogo,
    })
  },
  methods: {
    getLogoUrl() {
      // 处理sysLogo对象，提取URL
      if (this.systemLogo) {
          var baseUrl =process.env.VUE_APP_BASE_API;
        if (typeof this.systemLogo === 'string') {
          var d = JSON.parse( this.systemLogo);
          return baseUrl + d[0].url;
        } else if (this.systemLogo.url) {
          return this.systemLogo.url
        } else if (this.systemLogo.response && this.systemLogo.response.data && this.systemLogo.response.data.url) {
          return this.systemLogo.response.data.url
        }
      }
      return require('@/assets/images/toplog.jpg')
    }
  },
  created() {
    // 加载系统配置（静默处理）
    this.$store.dispatch('sysConfig/getSystemConfig').catch(() => {
      // 如果加载失败，使用默认值，不输出错误信息
    });
  },
}
</script>

<style lang="scss" scoped>
.navbar {
  height: 60px;
  overflow: hidden;
  position: relative;
  border-bottom: 1px solid #dcdfe6;
  box-sizing: border-box;
}
</style>