Server : Apache System : Linux server2.corals.io 4.18.0-348.2.1.el8_5.x86_64 #1 SMP Mon Nov 15 09:17:08 EST 2021 x86_64 User : corals ( 1002) PHP Version : 7.4.33 Disable Function : exec,passthru,shell_exec,system Directory :  /home/corals/vreg/components/States/WI/

Upload File : current_dir [ Writeable ] document_root [ Writeable ]

<template>
  <div :class="wrapperClass">


    <div class="row">
      <div class="col-md-12">
        <input-field rules="required" :form="form"
                     field="license_plate"
                     :vName="`license_plate_${index}`"
                     placeholder="License plate"/>
      </div>
    </div>


    <div class="row">
      <div class="col-md-6">
        <input-field rules="required|length:5" :form="form" field="zip_code" :vName="`zip_code_${index}`"
                     placeholder="Zip code"/>
      </div>
    </div>

  </div>
</template>

<script>

import InputField from "@/components/Forms/InputField";

export default {
  name: "OfflineVehicleForm",
  components: {InputField},
  props: {
    wrapperClass: {
      required: false
    },
    plate: {
      required: false
    },
    index: {
      required: true
    }
  },
  data() {
    let zipCode = this.$store.state.zip_code;

    return {
      form: this.$form({
        state_code: 'WI',
        zip_code: zipCode || '',
        license_plate: this.plate.license_plate || '',
        index: this.index,
        prices: this.plate.prices || [],
        expires_on: this.plate.expires_on || '',
        license_plate_label: this.plate.license_plate || '',
      })
    }
  },
  methods: {

    storePlate() {
      this.$store.commit('SET_OFFLINE_FORM_PLATE', {...this.form.data()});
      this.$store.commit('SET_ZIP_CODE', this.form.zip_code);
    }
  },
  computed: {
    offlineFormPlates() {
      return this.$store.getters.getOfflineFormPlates
    }
  },
  watch: {
    'form.zip_code'(value) {
      if (value) {
        this.form.zip_code = value.substr(0, 5).replace(/[\D]/g, '');
      }
    },
    'form.license_plate'(value) {
      this.form.license_plate = value.replace(/[^a-zA-Z0-9]/g, '').toUpperCase();
    }
  },
  beforeMount() {
    this.$eventBus.$on(`submitOfflineStep_${this.index}`, this.storePlate);
  },
  beforeDestroy() {
    this.$eventBus.$off(`submitOfflineStep_${this.index}`);
  }
}
</script>

<style scoped>

</style>