2d528a6a4e
Former-commit-id: 18249e7b2f568d64429b4453a9507e64c5634d6a [formerly 1dca9ca367cdbe78fde1fbc4ffb191947050a885] [formerly 287797e28367eb5fb6de3af8b1c0b54c317013cd [formerly 9ad231c1b8ab0ba936d8be8a44e71b45d51c2f78]] Former-commit-id: 0c25a6a88a0cba03408be4d53c867eca910f3f97 [formerly b414f310c3f86e13f081c984355c6b06015f03d3] Former-commit-id: 7eebc725347308574085abd3d866d97085da141a
51 lines
1.1 KiB
Vue
51 lines
1.1 KiB
Vue
<template>
|
|
<form id="editor">
|
|
<h2 v-if="hasMetadata">Metadata</h2>
|
|
<textarea v-if="hasMetadata" id="metadata">{{ req.metadata }}</textarea>
|
|
|
|
<h2 v-if="hasMetadata">Body</h2>
|
|
<textarea id="content">{{ req.content }}</textarea>
|
|
</form>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapState } from 'vuex'
|
|
import CodeMirror from '@/codemirror'
|
|
|
|
export default {
|
|
name: 'editor',
|
|
computed: {
|
|
...mapState(['req']),
|
|
hasMetadata: function () {
|
|
return (this.req.metadata !== undefined && this.req.metadata !== null)
|
|
}
|
|
},
|
|
data: function () {
|
|
return {
|
|
metadata: null,
|
|
content: null
|
|
}
|
|
},
|
|
mounted: function () {
|
|
CodeMirror.modeURL = this.$store.state.baseURL + '/static/js/codemirror/mode/%N/%N.js'
|
|
|
|
this.content = CodeMirror.fromTextArea(document.getElementById('content'), {
|
|
lineNumbers: (this.req.language !== 'markdown'),
|
|
viewportMargin: Infinity
|
|
})
|
|
|
|
this.metadata = CodeMirror.fromTextArea(document.getElementById('metadata'), {
|
|
viewportMargin: Infinity
|
|
})
|
|
|
|
CodeMirror.autoLoadMode(this.content, this.req.language)
|
|
},
|
|
methods: {
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style>
|