<template>
  <div class="logo">
    <router-link :to="{ name: 'dashboard' }">
      <img v-if="navTheme === 'dark'" src="~@/assets/images/logo-white.png" alt="logo" />
      <img v-else src="~@/assets/images/logo.png" alt="logo" />
      <h1 style="width: 180px" class="beyond-ellipsis">华软恒信 - {{ title }}</h1>
    </router-link>
  </div>
</template>

<script>
import { mixin } from '@/utils/mixin.js'

export default {
  name: 'Logo',
  mixins: [mixin],
  data() {
    return {
      title: process.env.VUE_APP_PROJECT_NAME
    }
  }
}
</script>
<style lang="less" scoped>
/*缩小首页布 局顶部的高度*/
@height: 59px;

.sider {
  box-shadow: none !important;

  .logo {
    height: @height !important;
    line-height: @height !important;
    box-shadow: none !important;
    transition: background 300ms;

    a {
      color: white;

      &:hover {
        color: rgba(255, 255, 255, 0.8);
      }
    }
  }

  &.light .logo {
    background-color: @primary-color;
  }
}
</style>
