Fix update problem with assignments
This commit is contained in:
parent
f0c104a788
commit
8049428fb1
|
|
@ -3,7 +3,7 @@
|
||||||
<textarea
|
<textarea
|
||||||
:placeholder="placeholder"
|
:placeholder="placeholder"
|
||||||
:readonly="readonly"
|
:readonly="readonly"
|
||||||
:value="inputText"
|
v-model="editText"
|
||||||
:class="{ 'submission-form__textarea--readonly': readonly }"
|
:class="{ 'submission-form__textarea--readonly': readonly }"
|
||||||
data-cy="submission-textarea"
|
data-cy="submission-textarea"
|
||||||
rows="1"
|
rows="1"
|
||||||
|
|
@ -23,11 +23,14 @@
|
||||||
>
|
>
|
||||||
<loading-icon class="submission-form__save-status-icon submission-form__saving-icon" />
|
<loading-icon class="submission-form__save-status-icon submission-form__saving-icon" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { defineAsyncComponent } from 'vue';
|
import {defineAsyncComponent, ref, watch} from 'vue';
|
||||||
|
import EmojiBar from "@/components/ui/EmojiBar.vue";
|
||||||
const TickCircleIcon = defineAsyncComponent(() => import('@/components/icons/TickCircleIcon.vue'));
|
const TickCircleIcon = defineAsyncComponent(() => import('@/components/icons/TickCircleIcon.vue'));
|
||||||
const LoadingIcon = defineAsyncComponent(() => import('@/components/icons/LoadingIcon.vue'));
|
const LoadingIcon = defineAsyncComponent(() => import('@/components/icons/LoadingIcon.vue'));
|
||||||
|
|
||||||
|
|
@ -38,12 +41,29 @@ interface Props {
|
||||||
placeholder: string;
|
placeholder: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
withDefaults(defineProps<Props>(), {
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
placeholder: 'Ergebnis erfassen',
|
placeholder: 'Ergebnis erfassen',
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const editText = ref(props.inputText)
|
||||||
|
|
||||||
const emit = defineEmits(['input']);
|
const emit = defineEmits(['input']);
|
||||||
|
|
||||||
|
const containsEmoji = (text: String) =>{
|
||||||
|
const emojis= ['🖐️', '👍', '👎', '👏', '👋', '🎉', '😍', '😮', '🤔']
|
||||||
|
const graphemes = Array.from(text);
|
||||||
|
const lastGrapheme = graphemes[graphemes.length - 1];
|
||||||
|
return emojis.includes(lastGrapheme);
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(() => props.inputText, (newValue) => {
|
||||||
|
// TODO: Lorenz this is an ugly fix!
|
||||||
|
if (containsEmoji(newValue)){
|
||||||
|
editText.value = newValue;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
const input = (e: Event) => {
|
const input = (e: Event) => {
|
||||||
const value = (e.target as HTMLInputElement).value;
|
const value = (e.target as HTMLInputElement).value;
|
||||||
emit('input', value);
|
emit('input', value);
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue