<patient-assessments :routes="routes"
                     :events="events"
                     :parent="component"
                     :assessments="assessments"
                     inline-template
>
    <div :class="{'formLoading' : loading}">
        <div class="cardTitle">
            <h3>
                Assessments
            </h3>
        </div>
        <div v-for="assessment in assessments">
            <table class="detailsTable">
                <tr>
                    <td>Form:</td>
                    <td v-html="assessment.form.name"></td>
                </tr>
                <tr v-for="orderItem in assessment.order_items">
                    <td>Product:</td>
                    <td v-html="orderItem.item_name"></td>
                </tr>
            </table>
            <div class="recordsList">
                <table class="detailsTable">
                    <tr>
                        <th style="width: 45%;">Question</th>
                        <th style="width: 45%">Answer</th>
                        <th style="width: 5%">Changes</th>
                        <th style="width: 5%"></th>
                    </tr>
                    <tr v-for="answer in assessment.answers" v-html="answer.html"></tr>
                </table>
            </div>
        </div>
    </div>
</patient-assessments>