diff --git a/frontend/src/components/content_value/ContentEntryEditor.vue b/frontend/src/components/content_value/ContentEntryEditor.vue index 954f415..a9a2b54 100644 --- a/frontend/src/components/content_value/ContentEntryEditor.vue +++ b/frontend/src/components/content_value/ContentEntryEditor.vue @@ -11,6 +11,7 @@ import FullScreen from '@/components/icons/FullScreen.vue' import WindowClose from '@/components/icons/WindowClose.vue' import Pin from '@/components/icons/Pin.vue' import OffScreen from '@/components/icons/OffScreen.vue' +import ContentEditor from '@/components/content_value/ContentEditor.vue' const props = defineProps({ field: { @@ -79,6 +80,19 @@ const displayValue = computed(() => { } return viewAs.value }) +const editingContent = ref('') +const enableSave = computed(() => { + return editingContent.value !== viewAs.value +}) + +const viewLanguage = computed(() => { + switch (viewAs.format) { + case formatTypes.JSON: + return 'json' + default: + return 'plaintext' + } +}) const btnStyle = computed(() => ({ padding: '3px', @@ -112,7 +126,7 @@ const onFormatChanged = async (decode = '', format = '') => { format, }) viewAs.field = props.field + '' - viewAs.value = value + editingContent.value = viewAs.value = value viewAs.decode = decode || retDecode viewAs.format = format || retFormat } finally { @@ -125,6 +139,10 @@ const onUpdateValue = (value) => { viewAs.value = value } +const onInput = (content) => { + editingContent.value = content +} + const onToggleFullscreen = () => { emit('update:fullscreen', !!!props.fullscreen) } @@ -135,7 +153,7 @@ const onClose = () => { } const onSave = () => { - emit('save', viewAs.field, viewAs.value, viewAs.decode, viewAs.format) + emit('save', viewAs.field, editingContent.value, viewAs.decode, viewAs.format) if (!isPin.value) { nextTick().then(onClose) } @@ -160,14 +178,14 @@ const onSave = () => {
{{ props.valueLabel }}
- + style="height: 100%" + @input="onInput" + @reset="onInput" /> {