Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!-- <div style="text-align:center">
- <h4 style="margin-bottom:-10px;margin-top:20px;">CADASTRO TRANSPORTE UNIVERSITÁRIO</h4>
- </div> -->
- <div class="wrapper">
- <div class="rvt-container rvt-container--center rvt-container--sophomore rvt-m-top-xxl" style="margin-left:-60px">
- <ol class="rvt-steps">
- <li [class]="classPersonalData">
- <a href="#0">
- <span class="rvt-steps__label">{{ 'Dados Pessoais' | translate }}</span>
- </a>
- </li>
- <li [class]="classAddress">
- <a href="#0">
- <span class="rvt-steps__label">{{ 'Endereço' | translate }}</span>
- </a>
- </li>
- <li [class]="classInstitution">
- <a href="#0">
- <span class="rvt-steps__label">{{ 'Dados da Instituição' | translate }}</span>
- </a>
- </li>
- <li [class]="classDocuments">
- <span class="rvt-steps__label">{{ 'Importação de Documentos' | translate }}</span>
- </li>
- <li>
- <span class="rvt-steps__label">{{ 'Salvar' | translate }}</span>
- </li>
- </ol>
- </div>
- <div class="content" style=" margin-top: 10px;">
- <div class="container-fluid">
- <div class="row">
- <div class="col-md-12">
- <div class="card">
- <div class="card-body">
- <form novalidate role="form" [formGroup]="formNewUser" (ngSubmit)="onSubmit()">
- <div class="form-content">
- <!--********************************DADOS PESSOAS******************************* -->
- <div *ngIf="visualizationPessoais" formGroupName="personalData">
- <div class="row justify-content-end" style="margin-bottom:-3em">
- <div class="col-4" style="margin-right: 5px; font-size:16px; font-weight:bold">
- {{ 'Passo 1' | translate }}
- <hr>
- </div>
- </div>
- <div class="row">
- <div class="form-group col-md-4">
- <fieldset class="form-group">
- <label class="radio-inline">
- <input class="ng-tns-c9-2" type="checkbox" formControlName="student">{{ 'Estudante' | translate }}
- </label>
- <label class="radio-inline">
- <input class="ng-tns-c9-2" type="checkbox" formControlName="teacher"> {{ 'Professor' | translate }}
- </label>
- </fieldset>
- </div>
- </div>
- <!-- gambi -->
- <div class="row" style="margin-top : -7px">
- <div class="form-group col-md-12">
- <label class="control-label">{{ 'Nome Completo' | translate }}</label>
- <input aria-describedby="addon-right addon-left" type="text" placeholder="{{ 'Nome Completo' | translate }}" class="form-control"
- [class.is-invalid]="formNewUser.get('personalData').get('name').touched && formNewUser.get('personalData').get('name').invalid"
- formControlName="name">
- <small *ngIf="formNewUser.get('personalData').get('name').valid && formNewUser.get('personalData').get('name').touched" class="form-text text-success">{{ 'Nome válido' | translate }}</small>
- <small *ngIf="!formNewUser.get('personalData').get('name').valid && formNewUser.get('personalData').get('name').touched"
- class="form-text text-danger">{{ 'Nome inválido - Favor informar nome, sobrenome e não utilizar números ou caracteres especiais!'
- | translate }}
- </small>
- </div>
- </div>
- <div class="row">
- <div class="form-group col-md-12">
- <label class="control-label">{{ 'E-mail' | translate }}</label>
- <input aria-describedby="addon-right addon-left" type="text" placeholder="{{ 'nome@exemplo.com' | translate }}" class="form-control"
- [class.is-invalid]="formNewUser.get('personalData').get('email').touched && formNewUser.get('personalData').get('email').invalid"
- formControlName="email">
- <small *ngIf="formNewUser.get('personalData').get('email').valid && formNewUser.get('personalData').get('email').touched"
- class="form-text text-success">{{ 'E-mail válido' | translate }}</small>
- <small *ngIf="!formNewUser.get('personalData').get('email').valid && formNewUser.get('personalData').get('email').touched"
- class="form-text text-danger">{{ 'E-mail inválido!' | translate }}
- </small>
- </div>
- </div>
- <div class="row" formGroupName="rg">
- <div class="form-group col-md-6">
- <label class="control-label">RG</label>
- <input aria-describedby="addon-right addon-left" type="text" class="form-control" formControlName="number" placeholder="RG">
- <small *ngIf="formNewUser.get('personalData').get('rg').get('number').valid && formNewUser.get('personalData').get('rg').get('number').touched"
- class="form-text text-success">{{ 'RG válido' | translate }}</small>
- <small *ngIf="!formNewUser.get('personalData').get('rg').get('number').valid && formNewUser.get('personalData').get('rg').get('number').touched"
- class="form-text text-danger">{{ 'RG inválido' | translate }}
- </small>
- </div>
- <div class="form-group col-md-2">
- <label class="control-label">UF</label>
- <input aria-describedby="addon-right addon-left" type="text" class="form-control" formControlName="state" placeholder="{{ 'Estado' | translate }}">
- <small *ngIf="formNewUser.get('personalData').get('rg').get('state').valid && formNewUser.get('personalData').get('rg').get('state').touched"
- class="form-text text-success">{{ 'UF válida' | translate }}</small>
- <small *ngIf="!formNewUser.get('personalData').get('rg').get('state').valid && formNewUser.get('personalData').get('rg').get('state').touched"
- class="form-text text-danger">{{ 'UF inválida' | translate }}
- </small>
- </div>
- <div class="form-group col-md-4">
- <label class="control-label">{{ 'Data de Expedição' | translate }}</label>
- <input aria-describedby="addon-right addon-left" type="text" class="form-control" formControlName="date" [mask]="getMask('date')"
- placeholder="00/00/0000">
- <small *ngIf="formNewUser.get('personalData').get('rg').get('date').valid && formNewUser.get('personalData').get('rg').get('date').touched"
- class="form-text text-success">{{ 'Data válida' | translate }}</small>
- <small *ngIf="!formNewUser.get('personalData').get('rg').get('date').valid && formNewUser.get('personalData').get('rg').get('date').touched"
- class="form-text text-danger">{{ 'Data inválida' | translate }}
- </small>
- </div>
- </div>
- <div class="row">
- <div class="form-group col-md-6">
- <label class="control-label">CPF</label>
- <input aria-describedby="addon-right addon-left" type="text" class="form-control" formControlName="cpf" [mask]="getMask('CPF')"
- placeholder="CPF">
- <small *ngIf="formNewUser.get('personalData').get('cpf').valid && formNewUser.get('personalData').get('cpf').touched" class="form-text text-success">{{ 'CPF válido' | translate }}</small>
- <small *ngIf="!formNewUser.get('personalData').get('cpf').valid && formNewUser.get('personalData').get('cpf').touched" class="form-text text-danger">{{ 'CPF inválido' | translate }}
- </small>
- </div>
- <div class="form-group col-md-6">
- <label class="control-label">{{ 'Tipo Sanguíneo' | translate }}</label>
- <select class="custom-select col-md-6" #selectBlood (change)="setValueBloodType(selectBlood.value)">
- <option *ngFor="let bloodType of bloodTypes" [value]="bloodType" [selected]="formNewUser.get('personalData').get('bloodType').value == bloodType">
- {{ bloodType | translate }}
- </option>
- </select>
- <small *ngIf="formNewUser.get('personalData').get('bloodType').valid && formNewUser.get('personalData').get('bloodType').touched"
- class="form-text text-success">{{ 'Tipo sanguíneo válido' | translate }}</small>
- <small *ngIf="!formNewUser.get('personalData').get('bloodType').valid && formNewUser.get('personalData').get('bloodType').touched"
- class="form-text text-danger">{{ 'Tipo sanguíneo inválido' | translate }}
- </small>
- </div>
- </div>
- <div class="form-row">
- <div class="form-group col-md-6">
- <label class="control-label">{{ 'Nome da Mãe' | translate }}</label>
- <input aria-describedby="addon-right addon-left" type="text" placeholder="{{ 'Nome Completo' | translate }}" class="form-control"
- formControlName="motherSname">
- <small *ngIf="formNewUser.get('personalData').get('motherSname').valid && formNewUser.get('personalData').get('motherSname').touched"
- class="form-text text-success">{{ 'Nome da mãe válido' | translate }}</small>
- <small *ngIf="!formNewUser.get('personalData').get('motherSname').valid && formNewUser.get('personalData').get('motherSname').touched"
- class="form-text text-danger">{{ 'Nome da mãe inválido' | translate }}
- </small>
- </div>
- <div class="form-group col-md-2" id="divPhoneType">
- <label class="control-label">{{ 'Tipo de telefone' | translate }}</label>
- <select class="custom-select" #selectPhone (change)="setValuePhoneType(selectPhone.value)">
- <option *ngFor="let phoneType of phoneTypes" [value]="phoneType" [selected]="formNewUser.get('personalData').get('phone').get('name').value == phoneType">
- {{ phoneType | translate }}
- </option>
- </select>
- </div>
- <div class="form-group col-md-4" id="divPhoneNumber" formGroupName="phone">
- <label class="control-label">{{ 'Número:' | translate }}</label>
- <input aria-describedby="addon-right addon-left" type="text" placeholder="{{ 'Telefone para Contato' | translate }}" class="form-control"
- formControlName="numberPhone" [mask]="getMask(selectPhone.value)">
- <small *ngIf="formNewUser.get('personalData').get('phone').get('numberPhone').valid && formNewUser.get('personalData').get('phone').get('numberPhone').touched"
- class="form-text text-success">{{ 'Telefone válido' | translate }}</small>
- <small *ngIf="!formNewUser.get('personalData').get('phone').get('numberPhone').valid && formNewUser.get('personalData').get('phone').get('numberPhone').touched"
- class="form-text text-danger">{{ 'Telefone inválido' | translate }}
- </small>
- </div>
- </div>
- <div class="text-center">
- <button class="btn btn-info float-right" type="button" (click)="openVisualizationForms('personalData', 'next')">{{ 'Próximo' | translate }}</button>
- </div>
- </div>
- <!--********************************ENDEREÇOS******************************* -->
- <div *ngIf="visualizationEnd" formGroupName="address">
- <div class="row justify-content-end">
- <div class="col-4" style="margin-bottom: 5px; font-size:16px; font-weight:bold">
- {{ 'Passo 2' | translate }}
- <hr>
- </div>
- </div>
- <div class="row">
- <div class="form-group col-md-6">
- <label class="control-label">{{ 'Logradouro' | translate }}</label>
- <input aria-describedby="addon-right addon-left" type="text" class="form-control" formControlName="street" placeholder="{{ 'Logradouro' | translate }}">
- <small *ngIf="formNewUser.get('address').get('street').valid && formNewUser.get('address').get('street').touched" class="form-text text-success">{{ 'Logradouro válido' | translate }}</small>
- <small *ngIf="!formNewUser.get('address').get('street').valid && formNewUser.get('address').get('street').touched" class="form-text text-danger">{{ 'Logradouro inválido' | translate }}
- </small>
- </div>
- <div class="form-group col-md-2">
- <label class="control-label">Nº</label>
- <input aria-describedby="addon-right addon-left" type="text" class="form-control" formControlName="number" placeholder="{{ 'Número' | translate }}">
- <small *ngIf="formNewUser.get('address').get('number').valid && formNewUser.get('address').get('number').touched" class="form-text text-success">{{ 'Número válido' | translate }}</small>
- <small *ngIf="!formNewUser.get('address').get('number').valid && formNewUser.get('address').get('number').touched" class="form-text text-danger">{{ 'Número inválido' | translate }}
- </small>
- </div>
- <div class="form-group col-md-4">
- <label class="control-label">{{ 'Bairro' | translate }}</label>
- <input aria-describedby="addon-right addon-left" type="text" class="form-control" formControlName="neighborhood" placeholder="{{ 'Bairro' | translate }}">
- <small *ngIf="formNewUser.get('address').get('neighborhood').valid && formNewUser.get('address').get('neighborhood').touched"
- class="form-text text-success">{{ 'Bairro válido' | translate }}</small>
- <small *ngIf="!formNewUser.get('address').get('neighborhood').valid && formNewUser.get('address').get('neighborhood').touched"
- class="form-text text-danger">{{ 'Bairro inválido' | translate }}
- </small>
- </div>
- </div>
- <div class="text-center">
- <button class="btn btn-info float-left" type="button" (click)="openVisualizationForms('address', 'previous')">{{ 'Anterior' | translate }}</button>
- <button class="btn btn-info float-right" type="button" (click)="openVisualizationForms('address', 'next')">{{ 'Próximo' | translate }}</button>
- </div>
- </div>
- <!--********************************DADOS DA INSTITUIÇÃO******************************* -->
- <div *ngIf="visualizationInsti" formGroupName="institution">
- <div class="row justify-content-end">
- <div class="col-4" style="margin-bottom: 5px; font-size:16px; font-weight:bold">
- {{ 'Passo 3' | translate }}
- <hr>
- </div>
- </div>
- <div class="row">
- <div class="form-group col-md-6">
- <label class="control-label">{{ 'Nome da Instituição' | translate }}</label>
- <select class="custom-select col-md-6" #selectInstitution (change)="setValueInstitution(selectInstitution.value)">
- <!-- faz a verificação do selected toda vez que entra no ng if para cada campo, é necessario para manter o
- valor caso fique alternando entre as paginas, mas como afeta o desempenho? -->
- <option *ngFor="let institution of institutions" [value]="institution" [selected]="formNewUser.get('institution').get('name').value == institution">
- {{ institution | translate }}
- </option>
- </select>
- <small *ngIf="formNewUser.get('institution').get('name').valid && formNewUser.get('institution').get('name').touched" class="form-text text-success">{{ 'Nome da Instituição válido' | translate }}</small>
- <small *ngIf="!formNewUser.get('institution').get('name').valid && formNewUser.get('institution').get('name').touched" class="form-text text-danger">{{ 'Nome da Instituição inválido' | translate }}
- </small>
- </div>
- <div class="form-group col-md-6">
- <label class="control-label">{{ 'Cidade da Instituição' | translate }}</label>
- <select class="custom-select col-md-6" #selectCity (change)="setValueCity(selectCity.value)">
- <option *ngFor="let city of citysInstitution" [value]="city" [selected]="formNewUser.get('institution').get('city').value == city">
- {{ city | translate }}
- </option>
- </select>
- <small *ngIf="formNewUser.get('institution').get('city').valid && formNewUser.get('institution').get('city').touched" class="form-text text-success">{{ 'Cidade válida' | translate }}</small>
- <small *ngIf="!formNewUser.get('institution').get('city').valid && formNewUser.get('institution').get('city').touched" class="form-text text-danger">{{ 'Cidade inválida' | translate }}
- </small>
- </div>
- </div>
- <div class="row">
- <div class="form-group col-md-7">
- <label class="control-label">{{ 'Nome do Curso' | translate }}</label>
- <input aria-describedby="addon-right addon-left" type="text" class="form-control" formControlName="course" placeholder="{{ 'Curso' | translate }}">
- <small *ngIf="formNewUser.get('institution').get('course').valid && formNewUser.get('institution').get('course').touched"
- class="form-text text-success">{{ 'Curso válido' | translate }}</small>
- <small *ngIf="!formNewUser.get('institution').get('course').valid && formNewUser.get('institution').get('course').touched"
- class="form-text text-danger">{{ 'Curso inválido' | translate }}
- </small>
- </div>
- <div class="form-group col-md-2">
- <label class="control-label">{{ 'Ano de Início' | translate }}</label>
- <input aria-describedby="addon-right addon-left" type="text" class="form-control" formControlName="startYear" placeholder="0000">
- <small *ngIf="formNewUser.get('institution').get('startYear').valid && formNewUser.get('institution').get('startYear').touched"
- class="form-text text-success">{{ 'Ano de início válido' | translate }}</small>
- <small *ngIf="!formNewUser.get('institution').get('startYear').valid && formNewUser.get('institution').get('startYear').touched"
- class="form-text text-danger">{{ 'Ano de início inválido' | translate }}
- </small>
- </div>
- <div class="form-group col-md-3">
- <label class="control-label">{{ 'Previsão de Término' | translate }}</label>
- <input aria-describedby="addon-right addon-left" type="email" class="form-control" formControlName="yearTermination" placeholder="0000">
- <small *ngIf="formNewUser.get('institution').get('yearTermination').valid && formNewUser.get('institution').get('yearTermination').touched"
- class="form-text text-success">{{ 'Ano de término válido' | translate }}</small>
- <small *ngIf="!formNewUser.get('institution').get('yearTermination').valid && formNewUser.get('institution').get('yearTermination').touched"
- class="form-text text-danger">{{ 'Ano de término inválido' | translate }}
- </small>
- </div>
- </div>
- <br>
- <div class="row">
- <div class="form-group col-md-6">
- <label>{{ 'Perído de Ida' | translate }}</label>
- <div class="table-responsive">
- <table class="table table-md">
- <thead>
- <tr id="periodosOnibus">
- <th scope="col"></th>
- <th scope="col">{{ 'Manhã' | translate}} - 7h </th>
- <th scope="col">{{ 'Tarde' | translate}} - 13h</th>
- <th scope="col">{{ 'Noite' | translate}} - 18h40</th>
- <th scope="col">{{ 'Não Vou' | translate}}</th>
- </tr>
- </thead>
- <tbody>
- <tr *ngFor="let day of daysOfTheWeek">
- <th scope="row">{{ day.name | translate}}</th>
- <td>
- <input class="form-check-input" type="checkbox" [checked]="timeToGoInstitution[day.index][0]" (change)="setValuetimeToGoInstitution(day.index, 0)">
- </td>
- <td>
- <input class="form-check-input" type="checkbox" [checked]="timeToGoInstitution[day.index][1]" (change)="setValuetimeToGoInstitution(day.index, 1)">
- </td>
- <td>
- <input class="form-check-input" type="checkbox" [checked]="timeToGoInstitution[day.index][2]" (change)="setValuetimeToGoInstitution(day.index, 2)">
- </td>
- <td>
- <input class="form-check-input" type="checkbox" [checked]="timeToGoInstitution[day.index][3]" (change)="setValuetimeToGoInstitution(day.index, 3)">
- </td>
- </tr>
- </tbody>
- </table>
- </div>
- </div>
- <div class="form-group col-md-6">
- <label>{{ 'Perído de Volta' | translate}}</label>
- <div class="table-responsive">
- <table class="table table-md" #table>
- <thead>
- <tr id="periodosOnibus">
- <th scope="col"></th>
- <th scope="col">{{ 'Manhã' | translate}} - 12h </th>
- <th scope="col">{{ 'Tarde' | translate}} - 17h30</th>
- <th scope="col">{{ 'Noite' | translate}} - 23h40</th>
- <th scope="col">{{ 'Não Vou' | translate}}</th>
- </tr>
- </thead>
- <tbody>
- <tr *ngFor="let day of daysOfTheWeek">
- <th scope="row">{{ day.name | translate}}</th>
- <td>
- <input class="form-check-input" type="checkbox" [checked]="timeToBackInstitution[day.index][0]" (change)="setValuetimeToBackInstitution(day.index, 0)">
- </td>
- <td>
- <input class="form-check-input" type="checkbox" [checked]="timeToBackInstitution[day.index][1]" (change)="setValuetimeToBackInstitution(day.index, 1)">
- </td>
- <td>
- <input class="form-check-input" type="checkbox" [checked]="timeToBackInstitution[day.index][2]" (change)="setValuetimeToBackInstitution(day.index, 2)">
- </td>
- <td>
- <input class="form-check-input" type="checkbox" [checked]="timeToBackInstitution[day.index][3]" (change)="setValuetimeToBackInstitution(day.index, 3)">
- </td>
- </tr>
- </tbody>
- </table>
- </div>
- </div>
- </div>
- <div class="text-center">
- <button class="btn btn-info float-left" type="button" (click)="openVisualizationForms('institution', 'previous')">{{ 'Anterior' | translate }}</button>
- <button class="btn btn-info float-right" type="button" (click)="openVisualizationForms('institution', 'next')">{{ 'Próximo' | translate }}</button>
- </div>
- </div>
- <!--********************************DOCUMENTOS******************************* -->
- <div *ngIf="visualizationDoc">
- <div class="row justify-content-end">
- <div class="col-4" style="margin-bottom: 5px; font-size:16px; font-weight:bold">
- {{ 'Passo 4' | translate }}
- <hr>
- </div>
- </div>
- <div class="row">
- <div class="col-md-6">
- <fieldset class="form-group">
- <label for="exampleInputFile">RG</label>
- <input type="file" class="form-control-file" id="exampleInputFile" #file>
- </fieldset>
- </div>
- <div class="col-md-6">
- <fieldset class="form-group">
- <label for="exampleInputFile">CPF</label>
- <input type="file" class="form-control-file" id="exampleInputFile">
- <div id="result">
- </div>
- </fieldset>
- </div>
- </div>
- <div class="row">
- <div class="col-md-6">
- <fieldset class="form-group">
- <label for="exampleInputFile">{{ 'Comprovante de Residência' | translate }}</label>
- <input type="file" class="form-control-file" id="exampleInputFile">
- </fieldset>
- </div>
- <div class="col-md-6">
- <fieldset class="form-group">
- <label for="exampleInputFile">{{ 'Comprovante de Matrícula' | translate }}</label>
- <input type="file" class="form-control-file" id="exampleInputFile">
- </fieldset>
- </div>
- </div>
- <div class="row">
- <div class="col-md-6">
- <fieldset class="form-group">
- <label for="exampleInputFile">{{ 'Cadastro Municipal' | translate }}</label>
- <input type="file" class="form-control-file" id="exampleInputFile">
- </fieldset>
- </div>
- <div class="col-md-6">
- <fieldset class="form-group">
- <label for="exampleInputFile">{{ 'Foto 3x4' | translate }}</label>
- <input type="file" class="form-control-file" id="exampleInputFile">
- </fieldset>
- </div>
- </div>
- <div class="text-center">
- <button type="button" class="btn btn-info float-right" (click)="openVisualizationForms('documents', 'next')">{{ 'Próximo' | translate }}</button>
- <button type="button" class="btn btn-info float-left" (click)="openVisualizationForms('documents', 'previous')">{{ 'Anterior' | translate }}</button>
- </div>
- </div>
- <!-- ************************ SALVAR ******************************** -->
- <div *ngIf="visualizationSave">
- <div class="text-center">
- <button type="submit" class="btn btn-info float-right">{{ 'CADASTRAR' | translate }}</button>
- <button type="button" class="btn btn-info float-left" (click)="openVisualizationForms('save', 'previous')">{{ 'Anterior' | translate }}</button>
- </div>
- </div>
- </div>
- </form>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement