Category.vue 1.82 KB
Newer Older
Rémy Marronnier's avatar
Rémy Marronnier committed
1
 <template>
Rémy Marronnier's avatar
Rémy Marronnier committed
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28
  <v-card align="center">
    <v-form @submit.prevent="submitCategory" ref="formCategory" v-model="validity">
      Êtes-vous actuellement dans l'une des situations suivantes ?
      <v-radio-group required :rules="rules" v-model="category">
        <v-radio autofocus value="categories_12345">
          <template v-slot:label>
            <ul>
              <li>En activité à temps complet (hors contrat aidé)</li>
              <li>En création d'entreprise</li>
              <li>En arrêt maladie</li>
              <li>En congé maternité ou congé parental</li>
              <li>En formation autre que formation professionnelle</li>
            </ul>
          </template>
        </v-radio>
        <v-radio label="Je ne suis dans aucune de ces situations" value="other_categorie"></v-radio>
      </v-radio-group>
      <v-btn x-large class="ma-2" color="#96a8b2" @click="back">Revenir</v-btn>
      <v-btn
        x-large
        class="ma-2"
        color="secondary"
        v-bind:disabled="!validity"
        type="submit"
      >Continuer</v-btn>
    </v-form>
  </v-card>
Rémy Marronnier's avatar
Rémy Marronnier committed
29 30 31 32
</template>
 
 <script>
export default {
Rémy Marronnier's avatar
Rémy Marronnier committed
33
  name: "Category",
Rémy Marronnier's avatar
Rémy Marronnier committed
34 35 36 37 38 39 40 41
  created() {
    this.category = this.$store.state.situation.category;
  },
  data: () => ({
    category: "",
    validity: false,
    rules: [v => !!v || "doit être renseigné"]
  }),
Rémy Marronnier's avatar
Rémy Marronnier committed
42
  methods: {
Rémy Marronnier's avatar
Rémy Marronnier committed
43 44 45 46 47 48 49 50 51 52 53
    validate() {
      if (this.$refs.formCategory.validate()) {
        this.validity = true;
      }
    },
    back() {
      this.$router.go(-1);
    },
    submitCategory() {
      this.validate();
      this.$store.dispatch("submitCategory", this.category);
Rémy Marronnier's avatar
Rémy Marronnier committed
54 55 56
      this.$router.push("votre-allocation");
    }
  }
Rémy Marronnier's avatar
Rémy Marronnier committed
57 58 59
};
</script>
 
Rémy Marronnier's avatar
Rémy Marronnier committed
60
 <style scoped>
Rémy Marronnier's avatar
Rémy Marronnier committed
61 62 63
ul {
  list-style-type: none;
  border-left: 4px grey solid;
Rémy Marronnier's avatar
Rémy Marronnier committed
64
  margin-left: 4px;
Rémy Marronnier's avatar
Rémy Marronnier committed
65 66 67 68 69
}
li {
  margin-top: 10px;
  margin-bottom: 10px;
}
Rémy Marronnier's avatar
Rémy Marronnier committed
70
</style>