
<template>
  <div class="app">
    <el-toolbar>
      <el-button><i class="fa fa-close"></i>关闭</el-button>
    </el-toolbar>
    <div class="main">
      <codemirror
        ref="editor"
        :content.sync="content"
        :mode="editorMode"
        :config="editorConfig"
        @contentChange="contentChange">
      </codemirror></div>
    <div class="sidebar"></div>
  </div>
</template>

<style>
.app {
  height: 100%;
}
.main {
  width: calc(100vw - 210px);
  background-color: #666;
}
.sidebar {
  position: fixed;
  width: 210px;
  top: 50px;
  right: 0;
  bottom: 0;
  background-color: #f6f9fd;
}
</style>

<script>
import util from '@src/common/util.js'
import codemirror from '@src/components/CodeMirror.vue'

export default {
  data() {
    return {
      // 编辑器配置
      editorConfig: {
      },
      editorMode: '',
      content: ''
    }
  },
  async created() {
    const name = util.url.getQueryValue(location.href, 'name')
    const res = await axios.get(`/ui/core/file/initeditor?name=${name}`)
    const data = res.data.data
    this.content = data.content
  },
  methods: {
    contentChange(e, v) {
    }
  },
  components: { codemirror }
}
</script>
