<template>
  <div>
    <section class="demo-section">
      <h4>基本用法</h4>
      <div :style="{width: !collapsed ? '216px' : '56px'}">
        <logo
          logo="https://www.baidu.com/favicon.ico"
          name="易观方舟"
          key-id="clientId"
          key-name="clientName"
          :options="options"
          :collapsed="collapsed"
        ></logo>
      </div>

      <div><button @click="collapsed=!collapsed">收起</button></div>
    </section>
  </div>
</template>

<script>
import { logo } from '../src/index'

export default {
  name: 'app',
  components: { logo },

  data() {
    return {
      collapsed: false,
      options: [{
        clientId: 'uba',
        clientName: '方舟智能分析',
        logo: 'https://accounts.analysysdata.com/idc/image/ubalogo.svg',
        homeUrl: '/uba'
      }]
    }
  },
  methods: {

  }
}
</script>

<style lang="scss">
body,html {
  height: 100%;
}
body {
  margin: 0
}
</style>
