51 lines
1 KiB
Vue
51 lines
1 KiB
Vue
<template>
|
|
<div>
|
|
<TextConfig v-model="textConfig" />
|
|
<div>
|
|
<div>{{l.format}}</div>
|
|
<textarea v-model="fmt" :rows="rows" :cols="cols" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import labels from './labels.json';
|
|
import TextConfig from '../TextConfig.vue';
|
|
import {format2previewText} from './codegen.js';
|
|
|
|
export default {
|
|
components: {
|
|
TextConfig,
|
|
},
|
|
props: {
|
|
value: {type: Object},
|
|
version: {type: String},
|
|
rows: {type: Number, default: 7},
|
|
cols: {type: Number, default: 40},
|
|
},
|
|
data() {
|
|
const {fmt, text, ...textConfig} = this.value;
|
|
return {
|
|
textConfig,
|
|
fmt,
|
|
};
|
|
},
|
|
computed: {
|
|
l() {
|
|
return labels[this.$lang] ?? labels['en-US'];
|
|
},
|
|
preview() {
|
|
return format2previewText(this.fmt, this.version);
|
|
},
|
|
},
|
|
methods: {
|
|
update() {
|
|
this.$emit('input', {fmt: this.fmt, text: this.preview, ...this.textConfig});
|
|
},
|
|
},
|
|
watch: {
|
|
textConfig() {this.update()},
|
|
fmt() {this.update()},
|
|
},
|
|
}
|
|
</script>
|