Solucionado (ver solução)
Solucionado
(ver solução)
5
respostas

Relacionamento de serviços

Preciso de uma ajuda pessoal, tenho um relatório de visitas as quais tem algumas informações e até aí tudo bem. Eu as exibo num dataList mas tem uma informação que no caso são os formulários preenchidos que não estou conseguindo resolver. Tenho um método que retorna os formulários preenchidos pelo Id da visita, mas da forma que estou fazendo só está exibindo a última. Caso alguém consigo me ajudar ficarei grato, sei que é um detalhe mas está passando batido

import { NotificationsService } from "angular2-notifications";

import { VisitService, Visit } from '../index';
import { FormAnswer, FormAnswerService } from '../../form-answer';


@Component({
  selector: 'app-report',
  templateUrl: './report.component.html',
  styleUrls: ['./report.component.css'],
  providers: [VisitService, FormAnswerService]
})
export class ReportComponent implements OnInit {

  visit: Visit = new Visit();
  visities: Array<Visit> = new Array<Visit>();
  formAnswer: FormAnswer = new FormAnswer();
  formAnswers: Array<FormAnswer> = new Array<FormAnswer>();

  constructor(
    private notificationService: NotificationsService,
    private visitService: VisitService,
    private formAnswerService: FormAnswerService) {

  }

  ngOnInit() {
    this.getAllVisities();
  }

  getAllVisities() {
    this.visitService.getAll().subscribe((visities) => {
      this.visities = visities;
      this.visities.forEach((visit => {
        this.getAllFormIdVisit(visit.idVisit);
      }
      ))
    },
      error => {
        this.notificationService.error(`Erro`, error);
      });
  }

  getAllFormIdVisit(idVisit) {
    this.formAnswerService.getByIdVisit(idVisit).subscribe((formAnswers) => {
      this.formAnswers = formAnswers;
    }, error => console.log("error"))
  }

}
<p-growl [value]="msgs" sticky="sticky"></p-growl>
<h4>VISIT</h4>
<p>&nbsp;</p>
<!--DATATABLE-->
<div style="margin-top:5px;"></div>
<div class="table-responsive" id="main-table">
  <p-dataList [value]="visities" [rows]="10" [paginator]="true" [pageLinks]="3">
    <template let-visit>
      <div class="ui-grid ui-grid-responsive ui-fluid bs-callout bs-callout-danger">
        <div class="ui-grid-col-4">
          Data da visita :{{visit?.dateVisit | date: 'dd/MM/yyyy'}}<br /> Horário Previsto para início :{{visit?.scheduleVisit
          | date: 'hh:mm'}}<br /> Horário Previsto para finalização:<br /><br /> Horário iniciado: <br /> Horário finalizado:
          <br />
        </div>
        <div class="ui-grid-col-4">
          AGÊNCIA: {{visit?.agency?.name}}<br /> Endereço:{{visit?.agency?.address}}<br /><br /> Responsável:{{visit?.user?.name}}
        </div>
        <div class="ui-grid-col-4">
          Ocorrências:<br /> Pendências abertas: <br /> Formulários preenchidos:<br />
          <div *ngFor="let formAnswer of formAnswers">
            {{formAnswer.name}}<br />

          </div>
        </div>
      </div>
    </template>
  </p-dataList>
</div>
<!--FIM DATATABLE-->
5 respostas

Não entendi muito bem, mas acho que entendi o suficiente.

O problema esta aqui, certo?

 <div *ngFor="let formAnswer of formAnswers">
            {{formAnswer.name}}<br />

</div>

Ele só exibe um item, quando na verdade era para exibir vários? Não entendi bem.

Tem um erro de lógica no seu código. Veja o método

getAllVisities() {
    this.visitService.getAll().subscribe((visities) => {
      this.visities = visities;
      this.visities.forEach((visit => {
        this.getAllFormIdVisit(visit.idVisit);
      }
      ))
    },
      error => {
        this.notificationService.error(`Erro`, error);
      });
  }

Você esta percorrendo this.visities e para cada visiti esta buscando o formulário com as answers passando visit.idVisit para o método this.getAllFormIdVisit. Mas o problema é que esse método pega a answer da visit de cada visit e grava em this.formAnswers. Daí para cada iteração ele grava por cima de this.formAnswers e vai ficar só as answers da última visita.

solução!

Flavio eu tinha acabado de notar isso e fiz isso

formAnswers: Array<FormAnswer[]> = new Array<FormAnswer[]>();

  getAllFormIdVisit(idVisit) {
    this.formAnswerService.getByIdVisit(idVisit).subscribe((formAnswers) => {
      this.formAnswers.push(formAnswers);
      //console.log(JSON.stringify(formAnswers));
    }, error => console.log("error"))
  }

Agora ele está concatenando tudo. Vou continuar tentando aqui porque to quase lá kk pelo menos eu acho.

Só me diz uma coisa, estou curioso.

this.formAnswerService.getByIdVisit(idVisit).subscribe((formAnswers)

O retorno capturado no subscribe é o que? Um array ou um objeto?

Um array de objetos

Abaixo segue uma iteração do foreach

[
    {
        "name": "Teste Offline",
        "user": {
            "name": "EDUARDO",
            "lastName": "ABREU",
            "username": "eabreu",
            "password": "0c76c98463ea35660be0efda32fa064d",
            "email": "eduardo@gmail.com",
            "cpf": "233.433.321-11",
            "rg": null,
            "cargo": "lider",
            "supervisor": null,
            "icon": null,
            "marker": null,
            "token": "fLOY4CzhAhk:APA91bHTE4G8dcUfXJBYYJT-WVpTQb5-rcNaMmULB2LUL1T_H6qM8flOkmZpbS_zvasKn85tqtMPjOAX_QawcgRtPEvs3m8RDSKq5C6m3rnq_G5EsSuQfZKl9PP-DDxb9O0MoPKIotbw",
            "idUser": "57ce1dacc2b0da3f106d16b6"
        },
        "dateAnswered": 1478571700596,
        "idVisit": "e832088d-6d20-47a3-964a-c247aeb56be2",
        "idForm": "5818976051915b3d7afa310a",
        "sync": true,
        "groupsForm": [
            {
                "name": "Offline",
                "questions": [
                    {
                        "name": "Nome",
                        "order": null,
                        "type": null,
                        "typeOptions": [],
                        "active": null,
                        "answer": [
                            "Teste"
                        ],
                        "idQuestion": null
                    }
                ],
                "idGroupForm": null
            }
        ],
        "idFormAnswer": "91ce85f7-dafd-45f7-bc46-236680454c1f"
    },
    {
        "name": "Descritivo de manutenção ",
        "user": {
            "name": "EDUARDO",
            "lastName": "ABREU",
            "username": "eabreu",
            "password": "0c76c98463ea35660be0efda32fa064d",
            "email": "eduardo@gmail.com",
            "cpf": "233.433.321-11",
            "rg": null,
            "cargo": "lider",
            "supervisor": null,
            "icon": null,
            "marker": null,
            "token": "fLOY4CzhAhk:APA91bHTE4G8dcUfXJBYYJT-WVpTQb5-rcNaMmULB2LUL1T_H6qM8flOkmZpbS_zvasKn85tqtMPjOAX_QawcgRtPEvs3m8RDSKq5C6m3rnq_G5EsSuQfZKl9PP-DDxb9O0MoPKIotbw",
            "idUser": "57ce1dacc2b0da3f106d16b6"
        },
        "dateAnswered": 1478617050338,
        "idVisit": "e832088d-6d20-47a3-964a-c247aeb56be2",
        "idForm": "580e047051915b5d88e28639",
        "sync": true,
        "groupsForm": [
            {
                "name": "DISPOSITIVOS",
                "questions": [
                    {
                        "name": "Porta giratória",
                        "order": null,
                        "type": null,
                        "typeOptions": [],
                        "active": null,
                        "answer": [
                            "Bom"
                        ],
                        "idQuestion": null
                    },
                    {
                        "name": "Alarmes",
                        "order": null,
                        "type": null,
                        "typeOptions": [],
                        "active": null,
                        "answer": [
                            "Ruim"
                        ],
                        "idQuestion": null
                    },
                    {
                        "name": "Sistema de iluminação ",
                        "order": null,
                        "type": null,
                        "typeOptions": [],
                        "active": null,
                        "answer": [
                            "bom"
                        ],
                        "idQuestion": null
                    }
                ],
                "idGroupForm": null
            },
            {
                "name": "DADOS CADASTRAIS",
                "questions": [
                    {
                        "name": "Nome",
                        "order": null,
                        "type": null,
                        "typeOptions": [],
                        "active": null,
                        "answer": [
                            "Tests"
                        ],
                        "idQuestion": null
                    },
                    {
                        "name": "CPF",
                        "order": null,
                        "type": null,
                        "typeOptions": [],
                        "active": null,
                        "answer": [
                            "Teste"
                        ],
                        "idQuestion": null
                    },
                    {
                        "name": "Telefone",
                        "order": null,
                        "type": null,
                        "typeOptions": [],
                        "active": null,
                        "answer": [
                            "Teste"
                        ],
                        "idQuestion": null
                    }
                ],
                "idGroupForm": null
            }
        ],
        "idFormAnswer": "27f240ad-c0dd-460e-9d76-8396c94413c4"
    }
]