<template>
  <div class="fp-design-editor" @mousedown="onDown">
    <div class="fp-editor-container">
      <fp-poster/>
    </div>
  </div>
</template>

<script>


import { mapActions, mapMutations } from 'vuex'
import FpPoster from "./FpPoster"

export default {
  name: "FpDesignEditor",
  components: {FpPoster},
  mounted() {
    this.getUserInfo().then(() => {
      this.openPoster()
    })
  },
  methods: {
    ...mapMutations({
      'setUnActiveAllItem': 'poster/setUnActiveAllItem',
    }),
    ...mapActions({
      'getUserInfo': 'editor/getUserInfo',
      'openPoster': 'aside/openPoster'
    }),
    onDown(ev) {
      // console.info('onDown', ev)
      // this.setUnActiveAllItem()
    }
  }
}
</script>

<style scoped>


.fp-editor-container {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  overflow: auto;
  font-size: 14px;
  color: #333;
  background: none;
  outline: none;
}
</style>