<template>
  <div class="logo-wrapper"
       @click="">
  
    <div class="wrap2"
         v-if="!state.isCollapse">
         常熟市虞美文华展览服务有限公司
    </div>
  </div>
  <n-modal v-model:show="showModal"
           class="custom-card"
           preset="card"
           title="卡片预设"
           size="huge"
           :bordered="false">

  </n-modal>
</template>

<script lang="ts">
import { defineComponent } from "vue";
import { useLayoutStore } from "../index";
import { projectName } from "@/config/settings/index.js";
export default defineComponent({
  name: "Logo",
  props: {
    showTitle: {
      type: Boolean,
      default: true,
    },
    showLogo: {
      type: Boolean,
      default: true,
    },
    alwaysShow: {
      type: Boolean,
      default: false,
    },
    showModal: {
      type: Boolean,
      default: false,
    },
  },
  setup() {
    const store = useLayoutStore();
    return {
      state: store?.state,
      projectName,
    };
  },
});
</script>
<style lang="scss" scoped>
@import "@/assets/styles/variables";
.logo-wrapper {
  height: $logoHeight;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  font-weight: 600; 
  color: $theme-primary;
  .wrap2 {
    img {
      width: 121px;
      height: 18px;
    }
  }
  .wrap1 {
    margin-right: 10px;
    width: 24px;
    height: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background-color: #46299d;
    img {
      width: 16px;
      height: 16px;
    }
  }
}
</style>
