skillbox/client/src/components/content-forms/SolutionForm.vue

38 lines
827 B
Vue

<template>
<div class="solution-form">
<textarea
placeholder="Lösung erfassen"
class="skillbox-textarea"
:value="text"
@input="$emit('change-text', $event.target.value, index)"
/>
</div>
</template>
<script setup lang="ts">
import { computed } from 'vue';
export interface Props {
value: any;
index: number;
}
const props = withDefaults(defineProps<Props>(), {
value: null,
index: -1,
});
defineEmits(['change-text']);
const text = computed(() => {
// todo: refactor this and use the helper, just copied it from TextForm.vue
return props.value.text ? props.value.text.replace(/<br(\/)?>/, '\n').replace(/(<([^>]+)>)/gi, '') : '';
});
</script>
<style lang="postcss" scoped>
.solution-form {
display: flex;
flex-direction: column;
gap: var(--small-spacing);
}
</style>