<template>
  <a-layout-sider :theme="sideTheme" :class="['side-menu', 'beauty-scroll', isMobile ? null : 'shadow']" width="256px"
    :collapsible="collapsible" v-model="collapsed" :trigger="null">
    <div :class="['logo', theme]">
      <!-- PC端 -->
      <router-link to="/dashboard/workplace">
        
        <img class="logo" v-if="company.company_info.logo" :src="company.company_info.logo">
        <h1 v-if="company.company_info.name">{{company.company_info.name}}</h1>
      </router-link>
    </div>
    <i-menu :theme="theme" :collapsed="collapsed" :options="menuData" @select="onSelect" class="menu" />
    <div class="footer" style="display: none;">
      <page-footer />
    </div>
  </a-layout-sider>
</template>

<script>
import IMenu from './menu'
import { mapState } from 'vuex'
import PageFooter from '@/layouts/footer/PageFooter' // 加载页脚组件
export default {
  name: 'SideMenu',
  components: { IMenu, PageFooter },
  props: {
    collapsible: {
      type: Boolean,
      required: false,
      default: false
    },
    collapsed: {
      type: Boolean,
      required: false,
      default: false
    },
    menuData: {
      type: Array,
      required: true
    },
    theme: {
      type: String,
      required: false,
      default: 'dark'
    }
  },
  data() {
    return {
      // Project :localStorage.getItem(process.env.VUE_APP_PROJECT_KEY),
    }
  },

  beforeMount() {

  },
  created() {
    
    console.log("this.company.company_info.logo:",JSON.stringify(this.company.company_info))  
    console.log("this.project.logo:",this.project.project_logo)
  },
  computed: {
    ...mapState('account', ['project', 'company']), // 获取项目信息,公司信息
    sideTheme() {
      console.log("localStorage:", this.project)
      return this.theme == 'light' ? this.theme : 'dark'
    },
    ...mapState('setting', ['isMobile', 'systemName'])
  },
  methods: {
    onSelect(obj) {
      this.$emit('menuSelect', obj)
    }
  }
}
</script>

<style lang="less" scoped>
@import "index";

.footer {
  color: blanchedalmond !important;
  width: 100%;

  text-align: center;
  // 置底
  position: absolute;
  bottom: 0;

}
</style>
