Vuejs Валидация с зависимостями

Вообщем у меня есть такая форма:

<v-form ref="form" v-model="valid" lazy-validation>
  <v-menu ref="menu" v-model="menu" :close-on-content-click="false" transition="scale-transition" offset-y min-width="auto">
    <template v-slot:activator="{ on, attrs }">
      <v-text-field v-model="dateFormatted" :label="$t('form.date')" dense outlined v-bind="attrs" v-on="on" @blur="date = parseDate(dateFormatted)"></v-text-field>
    </template>
    <v-date-picker ref="picker" v-model="date" :max="new Date().toISOString().substr(0, 10)" min="1970-01-01" @change="saveDate" first-day-of-week="1" :locale="this.$root.$i18n.locale">
    </v-date-picker>
  </v-menu>

  <v-select :items="category" :label="$t('form.category')" :rules="categoryRules" dense outlined item-text="title" item-value="id" v-model="category_id" required></v-select>

  <v-radio-group v-model="currency" row :label="$t('form.currency')" :rules="currencyRules" dense outlined>
    <v-radio v-for="item in currencies" :key="item.type" :label="item.label" on-icon="radio_button_checked" :value="item.type" off-icon="radio_button_unchecked"></v-radio>
  </v-radio-group>

  <v-radio-group v-model="type" row :label="$t('form.type')" :rules="typeRules" dense outlined>
    <v-radio v-for="item in types" :key="item.type" :label="item.label" on-icon="radio_button_checked"
                 :value="item.type" off-icon="radio_button_unchecked"></v-radio>
  </v-radio-group>

  <v-text-field type="number" :label="$t('form.amount')" :rules="amountRules" v-model="amount" dense outlined required></v-text-field>
  <v-text-field :label="$t('form.description')" maxlength="255" v-model="description" dense outlined></v-text-field>
</v-form>

И js код к этому:

data () {
return {
  date: new Date().toISOString().substr(0, 10),
  dateFormatted: this.saveDate(new Date().toISOString().substr(0, 10)),
  menu: false,
  category_id: '',
  categoryRules: [
    v => !!v || this.$i18n.t('form.errors.categoryRequired'),
  ],
  currency: 'rub',
  currencies: [
    { type: 'rub', label: 'RUB' },
    { type: 'usd', label: 'USD' },
    { type: 'eur', label: 'EUR' }
  ],
  currencyRules: [
    v => !!v || this.$i18n.t('form.errors.currencyRequired'),
  ],
  type: 'income',
  types: [
    { type: 'income', label: 'Доход' },
    { type: 'outcome', label: 'Расход' }
  ],
  typeRules: [
    v => !!v || this.$i18n.t('form.errors.typeRequired'),
  ],
  amount: 0,
  amountRules: [
    v => !!v || this.$i18n.t('form.errors.amountRequired'),
    v => (v > 0) || this.$i18n.t('form.errors.amountAboveZero'),
    v => (this.type === 'outcome' ? (this.currency === 'rub' ? (v < this.$store.getters.profile.balanceRUB)
        || this.$i18n.t('form.errors.amountInsufficient') : (this.currency === 'usd' ? (v < this.$store.getters.profile.balanceUSD)
        || this.$i18n.t('form.errors.amountInsufficient') : ((v < this.$store.getters.profile.balanceEUR)
        || this.$i18n.t('form.errors.amountInsufficient')))) : true) ,
  ],
  description: '',
  valid: false
}

},

Как видите парвила для поля amount выгялдят как полный хаус потому что связано сдругими полями, поскольку библиотеками кроме vuetify, я не польлзуюсь, если какой нибуть способ написать данные правила, более ... лучше?? т.к. у меня будет еще одна подобная форма.


Ответы (0 шт):