-
Notifications
You must be signed in to change notification settings - Fork 154
/
Editor.vue
46 lines (40 loc) · 983 Bytes
/
Editor.vue
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<template>
<Monaco :value="raw" :language="language" @change="update" />
</template>
<script setup lang="ts">
import type { PropType } from 'vue3'
import { ref, watch, defineProps, computed } from 'vue3'
import type { File } from '../../type'
import { useApi } from '../plugins/api'
import Monaco from './Monaco.vue'
const props = defineProps({
file: {
type: Object as PropType<File>,
required: true
},
apiEntry: {
type: String,
default: '/content'
}
})
const api = useApi()
const raw = ref(props.file.raw)
const language = computed(() => {
if (props.file.extension === '.vue') return 'html'
if (props.file.extension === '.ts') return 'javascript'
if (props.file.extension === '.js') return 'javascript'
return 'markdown'
})
// Sync local data when file changes
watch(
() => props.file,
newVal => {
raw.value = newVal.raw
}
)
function update(content) {
api.put(props.apiEntry + props.file.path, {
raw: content
})
}
</script>