chill-bundles/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/SuggestPane.vue

<template>
    <div v-if="insideModal === false" class="loading">
        <i
            v-if="flag.loading"
            class="fa fa-circle-o-notch fa-spin fa-2x fa-fw"
        />
        <span class="sr-only">{{ $t("loading") }}</span>
    </div>

    <div v-if="errorMsg && errorMsg.length > 0" class="alert alert-danger">
        {{ errorMsg }}
    </div>

    <h4 class="h3">
        {{ $t("address_suggestions") }}
    </h4>

    <div class="flex-table AddressSuggestionList">
        <div
            v-for="(a, i) in context.suggestions"
            class="item-bloc"
            :key="`suggestions-${i}`"
        >
            <div class="float-button bottom">
                <div class="box">
                    <div class="action">
                        <!-- QUESTION normal que ça vienne avant l'adresse ? pourquoi pas après avoir affiché le address-render-box ? -->
                        <ul class="record_actions">
                            <li>
                                <button
                                    class="btn btn-sm btn-choose"
                                    @click="this.pickAddress(a)"
                                >
                                    {{ $t("use_this_address") }}
                                </button>
                            </li>
                        </ul>
                    </div>
                    <ul class="list-content fa-ul">
                        <li>
                            <i class="fa fa-li fa-map-marker" />
                            <address-render-box :address="a" />
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

    <action-buttons
        v-if="insideModal === false"
        :options="this.options"
        :defaultz="this.defaultz"
    >
        <template #before>
            <slot name="before" />
        </template>
        <template #action>
            <slot name="action" />
        </template>
        <template #after>
            <slot name="after" />
        </template>
    </action-buttons>
</template>

<script>
import AddressRenderBox from "ChillMainAssets/vuejs/_components/Entity/AddressRenderBox.vue";
import ActionButtons from "./ActionButtons.vue";

export default {
    name: "SuggestPane",
    components: {
        AddressRenderBox,
        ActionButtons,
    },
    props: [
        "context",
        "options",
        "defaultz",
        "flag",
        "entity",
        "errorMsg",
        "insideModal",
    ],
    computed: {},
    methods: {
        pickAddress(address) {
            console.log("pickAddress in suggest pane", address);
            this.$emit("pickAddress", address);
        },
    },
};
</script>