vue-widget-mondial-relay v1.0.10

Vue Widget Mondial Relay

Mondial Relay Widget https://widget.mondialrelay.com/parcelshop-picker/v4_0/codesamples/Sample-LightImplementation.aspx to Vue

Installation

Using npm

npm i --save vue-widget-mondial-relay

Requirements

Vue 2

Vue 3 ? use the new component -> https://github.com/EduardoMateos/vue3-widget-mondial-relay

Props API

Translations

Prop: translations

Object example:

        :translations="{
          headerTitle: 'Select your mondial relay ®',
          findCpText: 'CP',
          findCityText: 'City',
          cityNoResults: 'no results',
          btnListMobile: 'List',
          btnMapMobile: 'Map'
        }"

Example

<template>
  <div id="app" style="max-width: 980px; margin: auto">
    <WidgetMondialRelay
        brand="BDTEST  "
        defaultPostCode="59000"
        defaultCountry="FR"
        maxResults="7"
        deliveryMode="24R"
        @select="setParcelSelected($event)"
        :translations="{
          headerTitle: 'Select your mondial relay ®',
          findCpText: 'CP',
          findCityText: 'City',
          cityNoResults: 'no results',
          btnListMobile: 'List',
          btnMapMobile: 'Map'
        }"
    />
  </div>
</template>

import WidgetMondialRelay from 'vue-widget-mondial-relay';
import 'vue-widget-mondial-relay/dist/widget-mondial-relay.min.css';

export default {
  name: 'App',
  components: {
    WidgetMondialRelay
  },
  methods:{
    setParcelSelected(data){
      console.log(data)
    }
  }
}