Logo.vue 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. <template>
  2. <div class="logo">
  3. <router-link :to="{name:'index'}">
  4. <!-- <LogoSvg alt="logo" /> -->
  5. <!-- <img :src="LogoSvg" /> -->
  6. <img :src="logo" alt="logo" height="42" class="img_box"/>
  7. <!-- <h1 v-if="showTitle">{{ title }}</h1> -->
  8. </router-link>
  9. </div>
  10. </template>
  11. <script>
  12. import LogoMax from '@/assets/normalbtn_login.png'
  13. import LogoMin from '@/assets/selectedbtn_login.png'
  14. import LogoLightMax from '@/assets/lightMaxLogo.png'
  15. import LogoLightMin from '@/assets/lightMiniLogo.png'
  16. import { mapState } from 'vuex'
  17. export default {
  18. name: 'Logo',
  19. components: {
  20. // LogoSvg
  21. },
  22. props: {
  23. title: {
  24. type: String,
  25. default: process.env.VUE_APP_PRO_NAME,
  26. required: false
  27. },
  28. showTitle: {
  29. type: Boolean,
  30. default: true,
  31. required: false
  32. }
  33. },
  34. data () {
  35. return {
  36. // LogoSvg: LogoSvg,
  37. // logo: LogoSvg // logo
  38. }
  39. },
  40. computed: {
  41. ...mapState({
  42. sidebar: state => state.app.sidebar,
  43. navTheme: state => state.app.theme
  44. }),
  45. logo () {
  46. return this.sidebar ? (this.navTheme == 'light' ? LogoLightMax : LogoMax) : (this.navTheme == 'light' ? LogoLightMin : LogoMin)
  47. }
  48. }
  49. }
  50. </script>
  51. <style lang="less" scoped="scoped">
  52. .logo{
  53. padding-right: 10px;
  54. img{
  55. width: auto !important;
  56. height: auto !important;
  57. max-width: 100%;
  58. max-height: 100%;
  59. }
  60. }
  61. </style>