exchange-2.0/resources/assets/vue/components/admin-workflow/elements/QuestionAnswerInnerComponent.vue

<template>
    <div class="row parentContainer">
        <div class="col-1">{{ item.id }}</div>
        <div class="col-2">{{ item.question_title }}</div>
        <div class="col-1">{{ item.answer }}</div>
        <div class="col-2">{{ parsedAnswer }}</div>
        <div class="col-1">{{ item.time }}</div>
        <div class="col-1">
            <a :href="route('booking.details', JSON.parse(item.question_metadata).booking.marking)"
                target="_blank">{{ JSON.parse(item.question_metadata).booking.marking }}
            </a>
        </div>
        <div class="col-1">
            <document-file-viewer-component v-if="item.documents" :file="item.documents.files[0]">
                <template slot="button">
                    <button class="btn btn-xs btn-default bg-master-lightest b-rad-none no-border">
                        <i class="fa fa-eye"></i>
                    </button>
                </template>
            </document-file-viewer-component>
        </div>
    </div>
</template>
<script>
    import componentHandler from '../../../general/mixins/componentHandler';
    export default {
        computed: {
            parsedAnswer() {
                try {
                    const parsed = this.item && this.item.answer_value ? JSON.parse(this.item.answer_value) : null;
                    return parsed && parsed.text ? parsed.text : this.item.answer_value;
                } catch (error) {
                    // console.error("Error parsing JSON:", error);
                    return this.item.answer_value;
                }
            },
        },
        mixins: [componentHandler]
    }
</script>