<template>
<div class="col-md-12">
<form class="form-horizontal" role="form">
<div class="tab-content">
<div class="form-group" v-bind:class="{ 'has-error': $v.remedio.nomer.$error }">
<label for="nomer" class="col-md-2 control-label ui-outputlabel ui-widget text-left">Nome: *</label>
<div class="col-md-9">
<input type="text" class="form-control" id="nomer" v-model="remedio.nomer" autocomplete="off" @input="$v.remedio.nomer.$touch()" maxlength="50">
<span class="help-block" v-show="$v.remedio.nomer.$error">Campo é obrigatório</span>
</div>
</div>
<div class="form-group">
<label for="descricao" class="col-md-2 control-label ui-outputlabel ui-widget text-left">Descrição: </label>
<div class="col-md-9">
<textarea
type="text"
class="form-control"
id="descricao"
autocomplete="off"
v-model="remedio.descricao"
></textarea>
</div>
</div>
<div class="form-group" v-bind:class="{ 'has-error': $v.remedio.dataDeValidade.$error }">
<label for="dataDeValidade" class="col-md-2 control-label ui-outputlabel ui-widget text-left">Data de Validade: *</label>
<div class="col-md-9">
<input
type="text"
class="form-control"
id="dataDeValidade"
autocomplete="off"
v-model="remedio.dataDeValidade" />
<span class="help-block" v-show="$v.remedio.dataDeValidade.$error">Campo é obrigatório</span>
</div>
</div>
<div class="form-group" v-bind:class="{ 'has-error': $v.remedio.quantidade.$error }">
<label for="quantidade" class="col-md-2 control-label ui-outputlabel ui-widget text-left">Quantidade: *</label>
<div class="col-md-9">
<input
type="text"
class="form-control"
id="quantidade"
autocomplete="off"
v-model="remedio.quantidade" />
<span class="help-block" v-show="$v.remedio.quantidade.$error">Campo é obrigatório</span>
</div>
</div>
<div class="form-group" v-bind:class="{ 'has-error': $v.remedio.principioAtivo.$error }">
Não consegui identificar o que está indefinido no meu código
nomer
,dataDeValidade
,quantidade
,principioAtivo
. Pode até mesmo serremedio
.