Hide and Render component in p:dialog

Question

I need to attach files and save the path in the database. Attachments belong to an object that can have multiple attachments, so I created an entity to store the path in the database, however I need to have that object saved first, so I can associate the path of attachments to it.

The form where this object will be filled is inside a panel, which is in a dialog. I am trying to solve this in the following way:

In the dialog I have the form to fill my object and save, when clicking save, the object is saved and the form is hidden and p:fileupload is displayed.

However, when you click save, the object is saved, but p:fileupload is not rendered and the panel is not hidden.

Some less important parts of the code have been omitted to exceed the character limit.

View

<ui:define name="content">
    // PARTE OCULTADA        
    <h:form>
        //PARTE OCULTADA
    <p:commandButton value="Adicionar Relato"
                                 onclick="dialogRelato.show();"
                                 icon="inserir"/>

                <p:commandButton value="Imprimir Livro de Ordem"
                                 icon="impressao"
                                 onclick="dialogRelato.show();"/>
            </h:panelGrid>

        </p:panel>

        <br />

        <p:dialog id="dialogRelato"
                  showEffect="fade" hideEffect="fade"
                  modal="true" header="Novo Relato"
                  widgetVar="dialogRelato" minHeight="40">

            <p:messages id="menssagens" autoUpdate="true" closable="true" />

            <p:panel id="panelFormRelato" rendered="#{livroOrdemController.renderizarFormRelato()}">
                <b>
                    <h:outputLabel value="Tipo de Relato: " />
                </b>
                <h:selectOneMenu style="height: 20px; background-color: #ffffff;"
                                 value="#{livroOrdemController.tipoRelatoSelecionado}"
                                 title="Tipo de Relato"
                                 converter="tipoRelatoConverter">

                    <f:selectItems value="#{livroOrdemController.preencherComboTiposRelatos()}"/>
                </h:selectOneMenu>
                <br />
                <br />

                <b>
                    <h:outputLabel for="calendarDataOcorrencia" value="Data da Ocorrencia: " />
                </b>
                <p:calendar id="calendarDataOcorrencia"
                            pattern="dd/MM/yyyy"
                            locale="pt_BR"
                            showOn="button"
                            value="#{livroOrdemController.dataOcorrencia}">
                    <p:ajax event="dateSelect" listener="#{livroOrdemController.onDataOcorrenciaSelect()}"/>
                </p:calendar>
                <br />
                <br />
                <b>
                    <h:outputLabel value="Fase da Obra/Serviço: " />
                </b>
                <h:selectOneMenu style="height: 20px; background-color: #ffffff;"
                                 value="#{livroOrdemController.faseObraServicoSelecionada}"
                                 title="Fase da Obra/Serviço"
                                 converter="faseObraServicoConverter">
                    <f:selectItems value="#{livroOrdemController.preencherComboFaseObraServico()}"/>
                </h:selectOneMenu>
                <br />
                <br />

                <b>
                    <h:outputLabel for="calendarInicioFase" value="Inicio da Fase: " />
                </b>
                <p:calendar id="calendarInicioFase"
                            pattern="dd/MM/yyyy"
                            locale="pt_BR"
                            showOn="button"
                            value="#{livroOrdemController.dataIncioFase}">
                    <p:ajax event="dateSelect" listener="#{livroOrdemController.onDataInicioFaseSelect()}"/>
                </p:calendar>
                <br />
                <br />

                <b>
                    <h:outputLabel for="calendarFimFase" value="Términio da Fase: " />
                </b>
                <p:calendar id="calendarFimFase"
                            pattern="dd/MM/yyyy"
                            locale="br"
                            showOn="button"
                            value="#{livroOrdemController.dataTerminioFase}">
                    <p:ajax event="dateSelect" listener="#{livroOrdemController.onDataTerminioFaseSelect()}"/>
                </p:calendar>
                <br />
                <br />

                <b>
                    <h:outputLabel for="inputDescricaoRelato" value="Descrição: " />
                </b>
                <br />
                <h:inputTextarea id="inputDescricaoRelato"
                                 value="#{livroOrdemController.descricao}"/>
                <br />
                <br />

                <p:commandButton value="Adicionar Relato"
                                 actionListener="#{livroOrdemController.adicionarRelato()}"
                                 process="@this,dialogRelato"
                                 update="@([id$=panelFormRelato], [id$=uploadAnexoRelato])">

                    <f:ajax event="click" listener="#{livroOrdemController.alterarEstadoDialogRelato()}"/>
                </p:commandButton>

                <p:commandButton value="Cancelar"
                            onclick="dialogRelato.hide();" />
            </p:panel>

            <p:panel id="uploadAnexoRelato"
                     rendered="#{livroOrdemController.renderizarAnexoRelato()}">

                <p:fileUpload fileUploadListener="#{livroOrdemController.handleFileUploadRelato}"
                              allowTypes="/(\.|\/)(gif|png|jpe?g|pdf)$/"
                              sizeLimit="10000000"
                              label="Anexar Arquivos"
                              multiple="true"
                              mode="advanced"
                              auto="true"
                              showButtons="false"
                              process="@this"
                              required="#{livroOrdemController.anexoRequired}"
                              requiredMessage="Anexo Obrigatório"
                              dragDropSupport="true"/>

                <ui:repeat var="arquivo" value="#{livroOrdemController.arquivosRelatos}">
                    <p:column>

                        <p:commandButton actionListener="#{livroOrdemController.excluirArquivo(arquivo)}" icon="excluir" update="#{livroOrdemController.componentes}" />

                        <h:outputText value="#{arquivo.nomeArquivo}"/>

                    </p:column>
                </ui:repeat>

                <p:commandButton value="Enviar Anexos"
                                 action="#{livroOrdemController.restaurarDialogRelato()}"                                   
                                 oncomplete="dialogRelato.hide();"
                                 process="@this,dialogRelato"
                                 update="#{livroOrdemController.componentes}"/>

                <p:commandButton value="Cancelar"
                                 onclick="dialogRelato.hide();" />
            </p:panel>

       </p:dialog>

        <ui:repeat var="itemRelato" value="#{livroOrdemController.relatos}" varStatus="status">

                <p:panel id="panelRelatos">
                    <f:facet name="header">

                        <h:outputText value="#{itemRelato.dataOcorrencia}">
                            <f:convertDateTime pattern="dd/MM/yyyy" />
                        </h:outputText>
                        <h:outputText value=" - #{itemRelato.tipoRelato.descricao}"/>

                    </f:facet>

                    <h:outputLabel value="Fase da Obra: "/>
                    <h:outputText value="#{itemRelato.faseObraServico.descricao}"/>
                    <br />

                    <h:outputLabel value="Inicio da Fase: "/>
                    <h:outputText value="#{itemRelato.dataIncioFase}">
                        <f:convertDateTime pattern="dd/MM/yyyy" />
                    </h:outputText>
                    <br />

                    <h:outputLabel value="Términio da Fase: "/>
                    <h:outputText value="#{itemRelato.dataTerminioFase}">
                        <f:convertDateTime pattern="dd/MM/yyyy" />
                    </h:outputText>
                    <br />

                    <h:outputLabel value="Descrição: "/><br />
                    <h:outputText value="#{itemRelato.descricao}"/>
                    <br />

                    <b>
                        <h:outputLabel value="Retificações/Complementos: "/>
                    </b>

                    <ui:repeat var="itemRetificacao" value="#{livroOrdemController.recuperarRetificacoes(itemRelato.idRelato)}"
                               varStatus="statusRetificacao">

                        <li>
                            <h:outputText value="#{itemRetificacao.descricao}"/>
                        </li>

                    </ui:repeat>

                    <br />

                    <p:commandButton value="Retificar Relato"
                                     update="#{livroOrdemController.componentes}"
                                     onclick="dialogRetificacao.show();">

                        <f:setPropertyActionListener value="#{itemRelato}" target="#{livroOrdemController.relatoASerRetificado}"/>

                    </p:commandButton>
                    <br />
                    <br />

                </p:panel>

               // PARTE OCULTADA
    </h:form>

</ui:define>

Controller

    private static final String DIALOG_RELATO_STATE = "Adicionar Relato";
private static final String DIALOG_ANEXO_RELATO_STATE = "Adicionar Anexo Relato";
private static final String DIALOG_RETIFICACAO_STATE = "Adicionar Retificacao";
private static final String DIALOG_ANEXO_RETIFICACAO_STATE = "Adicionar Anexo Retificacao";

private String currentStateDialogRelato;
private String currentStateDialogRetificacao;

// ALGUMAS VARIAVEIS OCULTADAS
private boolean anexoRequired;

public LivroOrdemController() {
}

@PostConstruct
public void inicializar() {
    relato = new Relato();
    retificacaoRelato = new RetificacaoRelato();
    currentStateDialogRelato = DIALOG_RELATO_STATE;
    currentStateDialogRetificacao = DIALOG_RETIFICACAO_STATE;
}

// GETTERS E SETTERS OCULTADOS

public boolean isAnexoRequired() {
    return anexoRequired;
}

public void setAnexoRequired(boolean anexoRequired) {
    this.anexoRequired = anexoRequired;
}



public void setRelatoASerRetificado(Relato relatoASerRetificado) {
    this.relatoASerRetificado = relatoASerRetificado;
}

public void alterarEstadoDialogRelato() {
    this.setCurrentStateDialogRelato(DIALOG_ANEXO_RELATO_STATE);
}

public void alterarEstadoDialogRetificacao() {
    this.setCurrentStateDialogRetificacao(DIALOG_ANEXO_RETIFICACAO_STATE);
}

public boolean renderizarAnexoRelato() {
    String state = this.getCurrentStateDialogRelato();

    return DIALOG_ANEXO_RELATO_STATE.equals(state);
}

public boolean renderizarFormRelato() {
    String state = this.getCurrentStateDialogRelato();

    return DIALOG_RELATO_STATE.equals(state);
}

public void recuperarNumeroArt(ValueChangeEvent valueChangeEvent) {
    numeroArt = valueChangeEvent.getNewValue().toString();

    recuperarLivroOrdem();
    recuperarRelatos();
    recuperarArt();
}

public void recuperarArt() {
    Map<String, Object> params = new HashMap<String, Object>();
    Art artTemp = new Art();
    String queryArt = "SELECT a.numeroart, a.nomeProprietario, a.cepobraservico, a.tipologradouroobraservico, "
            + "a.logradouroobraservico, a.numeroobraservico, a.bairroobraservico, a.cidadeobraservico, a.ufobraservico, "
            + "a.databaixa, a.datainicioobraservico "
            + "FROM Art a WHERE a.numeroart = :numeroart";
    params.put("numeroart", numeroArt);
    Object[] object = objectDao.pesqQuery(queryArt, params);

    artTemp.setNumeroArt((String) object[0]);
    artTemp.setNomeProprietario((String) object[1]);
    artTemp.getEnderecoObraServico().setCep((String) object[2]);
    artTemp.getEnderecoObraServico().setTipoLogradouro((String) object[3]);
    artTemp.getEnderecoObraServico().setLogradouro((String) object[4]);
    artTemp.getEnderecoObraServico().setNumero((String) object[5]);
    artTemp.getEnderecoObraServico().setBairro((String) object[6]);
    artTemp.getEnderecoObraServico().setCidade((String) object[7]);
    artTemp.getEnderecoObraServico().setUf((String) object[8]);
    artTemp.setDataBaixa((Date) object[9]);
    artTemp.setDataInicioObraServico((Date) object[10]);

    art = artTemp;    
}

public void recuperarLivroOrdem() {
    Map<String, Object> params = new HashMap<String, Object>();
    String queryLivroOrdem = "SELECT lo FROM LivroOrdem lo WHERE art_numeroart = :numeroart";
    params.put("numeroart", numeroArt);
    livroOrdem = livroOrdemDao.pesqParam(queryLivroOrdem, params);
}

public void adicionarRelato() {
    if(dataOcorrencia == null) {
        FacesUtils.mensErro("Data da Ocorrência: Preenchimento Obrigatório");
    }

    if(tipoRelatoSelecionado == null) {
        FacesUtils.mensErro("Tipo de Relato: Selecione uma opção");
    }

    if(descricao.isEmpty()){
        FacesUtils.mensErro("Descrição: Preenchimento Obrigatório");
    }

    else {
        relato.setTipoRelato(tipoRelatoSelecionado);
        relato.setDataOcorrencia(dataOcorrencia);
        relato.setDescricao(descricao);
        relato.setFaseObraServico(faseObraServicoSelecionada);
        relato.setDataIncioFase(dataIncioFase);
        relato.setDataTerminioFase(dataTerminioFase);
        relato.setLivroOrdem(livroOrdem);
        relatoDao.salvar(relato);
    }

    dataIncioFase = null;
    dataTerminioFase = null;
    dataOcorrencia = null;
}

public void onDataOcorrenciaSelect() {
    Calendar dataPassado = Calendar.getInstance();
    dataPassado.add(Calendar.DATE, -30);

    Calendar dataFuturo = Calendar.getInstance();
    dataFuturo.add(Calendar.DATE, +30);

    if(dataOcorrencia.before(dataPassado.getTime()) || dataOcorrencia.after(dataFuturo.getTime())) {
        FacesUtils.mensErro("A data de Ocorrência não pode ser 30 dias antes ou depois da data atual");
    }
}

public void onDataInicioFaseSelect() {
    if(dataIncioFase.before(art.getDataInicioObraServico())) {
        FacesUtils.mensErro("A data não deve ser anterior à data de início da obra/serviço.");
    }

    else if(dataIncioFase.after(new Date())) {
        FacesUtils.mensErro("A data de início da fase não deve ser superior à data atual.");
    }
}

public void onDataTerminioFaseSelect() {
    if(dataTerminioFase.before(dataIncioFase)) {
        FacesUtils.mensErro("A data de términio da fase não deve ser superior a de inicio");
    }
}

public void retificarRelato() {
    if(descricaoRetificacao.isEmpty()) {
        FacesUtils.mensErro("Descrição: Preenchimento Obrigatório");
    }

    else {
        retificacaoRelato.setRelato(relatoASerRetificado);
        retificacaoRelato.setDescricao(descricaoRetificacao);
        retificacaoRelatoDao.salvar(retificacaoRelato); 
    }

    descricaoRetificacao = null;
}

public SelectItem[] preencherComboTiposRelatos() {
    SelectItem[] options = null;
    String query = "SELECT tr FROM TipoRelato tr";
    List<TipoRelato> tipoRelatos = tipoRelatoDao.listPesq(query);

    if (tipoRelatos != null && tipoRelatos.size() > 0) {
        int i = 0;
        options = new SelectItem[tipoRelatos.size() + 1];
        options[i++] = new SelectItem(null, "Selecione...");

        for (TipoRelato tr : tipoRelatos) {
            options[i++] = new SelectItem(tr, tr.getDescricao());
        }
    }

    return options;
}

public SelectItem[] preencherComboFaseObraServico() {
    SelectItem[] options = null;
    String query = "SELECT fos FROM FaseObraServico fos";
    List<FaseObraServico> faseObraServicos = faseObraServicoDao.listPesq(query);

    if (faseObraServicos != null && faseObraServicos.size() > 0) {
        int i = 0;
        options = new SelectItem[faseObraServicos.size() + 1];
        options[i++] = new SelectItem(null, "Selecione...");

        for (FaseObraServico fo : faseObraServicos) {
            options[i++] = new SelectItem(fo, fo.getDescricao());
        }
    }

    return options;
}

public void recuperarRelatos() {
    Map<String, Object> params = new HashMap<String, Object>();
    String queryRelato = "SELECT r.idRelato, r.dataOcorrencia, r.dataIncioFase, r.dataTerminioFase, r.descricao AS descricaoRelato, "
            + "tr.descricao AS tiporelato, fos.descricao AS faseobraservico "
            + "FROM Relato r "
            + "LEFT JOIN TipoRelato tr ON tr.idTipoRelato = r.tiporelato_idtiporelato "
            + "LEFT JOIN FaseObraServico fos ON fos.idFaseObraServico = r.faseobraservico_idfaseobraservico "
            + "WHERE r.livroordem_idlivroordem = :idlivroordem ORDER BY dataocorrencia DESC";

    params.put("idlivroordem", livroOrdem.getIdLivroOrdem());
    List<Object[]> objects = objectDao.listPesqQuery(queryRelato, params);

    for (Object[] o : objects) {
        Relato relatoTemp = new Relato();
        BigInteger id = (BigInteger) o[0];
        relatoTemp.setIdRelato(id.longValue());
        relatoTemp.setDataOcorrencia((Date) o[1]);
        relatoTemp.setDataIncioFase((Date) o[2]);
        relatoTemp.setDataTerminioFase((Date) o[3]);
        relatoTemp.setDescricao((String) o[4]);

        relatoTemp.setTipoRelato(new TipoRelato());
        relatoTemp.getTipoRelato().setDescricao((String) o[5]);
        relatoTemp.setFaseObraServico(new FaseObraServico());
        relatoTemp.getFaseObraServico().setDescricao((String) o[6]);

        relatos.add(relatoTemp);
    }
}

   public List<RetificacaoRelato> recuperarRetificacoes(Long idRelato) 
{
        List<RetificacaoRelato> retificacoes = new ArrayList<RetificacaoRelato>();
    Map<String, Object> params = new HashMap<String, Object>();
    String queryRetificacoes = "SELECT rr.descricao FROM RetificacaoRelato rr "
            + "WHERE rr.relato_idrelato = :idrelato";
    params.put("idrelato", idRelato);

    List<Object> objects = objectDao.listPesqQueryUmParametro(queryRetificacoes, params);

    for (Object o : objects) {
        RetificacaoRelato retificacaoRelatoTemp = new RetificacaoRelato();
        retificacaoRelatoTemp.setDescricao((String) o);
        retificacoes.add(retificacaoRelatoTemp);
    }

    return retificacoes;
}

   public void handleFileUploadRelato(FileUploadEvent event) throws 
IOException {  
   UploadedFile item = event.getFile();

   Calendar c = Calendar.getInstance();
   c.setTime(new Date());
   int mes = c.get(Calendar.MONTH);
   mes++;
   String complementoDir = c.get(Calendar.YEAR) + "/" + mes + "/" + c.get(Calendar.DAY_OF_MONTH) + "/";
   String sDiretorio = SistemaConstante.CAMINHO_ARQUIVOS_LIVRO_ORDEM + complementoDir;
   String sCaminho = SistemaConstante.DIRETORIO_ARQUIVOS_LIVRO_ORDEM + complementoDir;
   String nomeArquivo = item.getFileName().replace("\\", File.separator);
   File diretorio = new File(sDiretorio);

   boolean diretorioCriado = true;

   if (!diretorio.exists()) {
       if (!diretorio.mkdir()) {
           if (!diretorio.mkdirs()) {
               FacesUtils.mensFatal("Falha na criação do diretório!");
               diretorioCriado = false;
           }
       }
     }

  if(diretorioCriado) {
      String aux = removerAcentos(livroOrdem.getIdLivroOrdem() + nomeArquivo);
      String caminhoArquivo = sDiretorio + aux;
      String caminhoVerArquivo = sCaminho + aux;
      File arquivo = new File(caminhoArquivo);

      OutputStream out = new FileOutputStream(arquivo);
      out.write(item.getContents());
      out.close();

      ArquivoRelato arqRelato = new ArquivoRelato();
      arqRelato.setCaminhoArquivo(caminhoArquivo);
      arqRelato.setCaminhoVerArquivo(caminhoVerArquivo);
      arqRelato.setRelato(relato);
      arquivoRelatoDao.salvar(arqRelato);
      arquivosRelatos.add(arqRelato);

      FacesUtils.mensInfo("Arquivo(s) enviado(s) com sucesso!");
  }
   }

   public void handleFileUploadRetificacao(FileUploadEvent event) throws IOException {  
         UploadedFile item = event.getFile();

   Calendar c = Calendar.getInstance();
   c.setTime(new Date());
   int mes = c.get(Calendar.MONTH);
   mes++;
   String complementoDir = c.get(Calendar.YEAR) + "/" + mes + "/" + c.get(Calendar.DAY_OF_MONTH) + "/";
   String sDiretorio = SistemaConstante.CAMINHO_ARQUIVOS_LIVRO_ORDEM + complementoDir;
   String sCaminho = SistemaConstante.DIRETORIO_ARQUIVOS_LIVRO_ORDEM + complementoDir;
   String nomeArquivo = item.getFileName().replace("\\", File.separator);
   File diretorio = new File(sDiretorio);

   boolean diretorioCriado = true;

   if (!diretorio.exists()) {
       if (!diretorio.mkdir()) {
           if (!diretorio.mkdirs()) {
               FacesUtils.mensFatal("Falha na criação do diretório!");
               diretorioCriado = false;
           }
       }
  }

  if(diretorioCriado) {
      String aux = removerAcentos(livroOrdem.getIdLivroOrdem() + nomeArquivo);
      String caminhoArquivo = sDiretorio + aux;
      String caminhoVerArquivo = sCaminho + aux;
      File arquivo = new File(caminhoArquivo);

      OutputStream out = new FileOutputStream(arquivo);
      out.write(item.getContents());
      out.close();

      ArquivoRelato arqRelato = new ArquivoRelato();
      arqRelato.setCaminhoArquivo(caminhoArquivo);
      arqRelato.setCaminhoVerArquivo(caminhoVerArquivo);
      arqRelato.setNomeArquivo(nomeArquivo);
      arqRelato.setRetificacaoRelato(retificacaoRelato);
      arquivoRelatoDao.salvar(arqRelato);
      arquivosRelatos.add(arqRelato);

      FacesUtils.mensInfo("Arquivo(s) enviado(s) com sucesso!");
  }
   }

   public static String removerAcentos(String str) {
       return Normalizer.normalize(str, Normalizer.Form.NFD).replaceAll("[^\\p{ASCII}]", "");
  }

  public void excluirArquivo(ArquivoRelato arquivoRelato) {
    this.arquivoRelato = arquivoRelato;
    ArquivoRelato ar = arquivoRelato;
    File f = new File(arquivoRelato.getCaminhoArquivo());
    f.delete();
    arquivoRelatoDao.excluir(this.arquivoRelato);
    arquivosRelatos.remove(ar);
 }

 public void restaurarDialogRelato() {
     currentStateDialogRelato = DIALOG_RELATO_STATE;
 }

 public void restaurarDialogRetificacao() {
     currentStateDialogRetificacao = DIALOG_RETIFICACAO_STATE;
 }
  }

Answer 1

Replace your dialog with this, I’ve included a h:panelGroup to control the rendering:

<p:dialog id="dialogRelato"
              showEffect="fade" hideEffect="fade"
              modal="true" header="Novo Relato"
              widgetVar="dialogRelato" minHeight="40">

        <p:messages id="menssagens" autoUpdate="true" closable="true" />


        <p:panel>
            <h:panelGroup id="panelFormRelato" rendered="#{livroOrdemController.renderizarFormRelato()}">
                <b>
                    <h:outputLabel value="Tipo de Relato: " />
                </b>
                <h:selectOneMenu style="height: 20px; background-color: #ffffff;"
                                value="#{livroOrdemController.tipoRelatoSelecionado}"
                                title="Tipo de Relato"
                                converter="tipoRelatoConverter">

                    <f:selectItems value="#{livroOrdemController.preencherComboTiposRelatos()}"/>
                </h:selectOneMenu>
                <br />
                <br />

                <b>
                    <h:outputLabel for="calendarDataOcorrencia" value="Data da Ocorrencia: " />
                </b>
                <p:calendar id="calendarDataOcorrencia"
                            pattern="dd/MM/yyyy"
                            locale="pt_BR"
                            showOn="button"
                            value="#{livroOrdemController.dataOcorrencia}">
                    <p:ajax event="dateSelect" listener="#{livroOrdemController.onDataOcorrenciaSelect()}"/>
                </p:calendar>
                <br />
                <br />
                <b>
                    <h:outputLabel value="Fase da Obra/Serviço: " />
                </b>
                <h:selectOneMenu style="height: 20px; background-color: #ffffff;"
                                value="#{livroOrdemController.faseObraServicoSelecionada}"
                                title="Fase da Obra/Serviço"
                                converter="faseObraServicoConverter">
                    <f:selectItems value="#{livroOrdemController.preencherComboFaseObraServico()}"/>
                </h:selectOneMenu>
                <br />
                <br />

                <b>
                    <h:outputLabel for="calendarInicioFase" value="Inicio da Fase: " />
                </b>
                <p:calendar id="calendarInicioFase"
                            pattern="dd/MM/yyyy"
                            locale="pt_BR"
                            showOn="button"
                            value="#{livroOrdemController.dataIncioFase}">
                    <p:ajax event="dateSelect" listener="#{livroOrdemController.onDataInicioFaseSelect()}"/>
                </p:calendar>
                <br />
                <br />

                <b>
                    <h:outputLabel for="calendarFimFase" value="Términio da Fase: " />
                </b>
                <p:calendar id="calendarFimFase"
                            pattern="dd/MM/yyyy"
                            locale="br"
                            showOn="button"
                            value="#{livroOrdemController.dataTerminioFase}">
                    <p:ajax event="dateSelect" listener="#{livroOrdemController.onDataTerminioFaseSelect()}"/>
                </p:calendar>
                <br />
                <br />

                <b>
                    <h:outputLabel for="inputDescricaoRelato" value="Descrição: " />
                </b>
                <br />
                <h:inputTextarea id="inputDescricaoRelato"
                                value="#{livroOrdemController.descricao}"/>
                <br />
                <br />

                <p:commandButton value="Adicionar Relato"
                                actionListener="#{livroOrdemController.adicionarRelato()}"
                                process="@this,dialogRelato"
                                update="@([id$=panelFormRelato], [id$=uploadAnexoRelato])">

                    <f:ajax event="click" listener="#{livroOrdemController.alterarEstadoDialogRelato()}"/>
                </p:commandButton>

                <p:commandButton value="Cancelar"
                            onclick="dialogRelato.hide();" />
            </h:panelGroup>
        </p:panel>

        <p:panel>
            <h:panelGroup id="uploadAnexoRelato" rendered="#{livroOrdemController.renderizarAnexoRelato()}">
                <p:fileUpload fileUploadListener="#{livroOrdemController.handleFileUploadRelato}"
                            allowTypes="/(\.|\/)(gif|png|jpe?g|pdf)$/"
                            sizeLimit="10000000"
                            label="Anexar Arquivos"
                            multiple="true"
                            mode="advanced"
                            auto="true"
                            showButtons="false"
                            process="@this"
                            required="#{livroOrdemController.anexoRequired}"
                            requiredMessage="Anexo Obrigatório"
                            dragDropSupport="true"/>

                <ui:repeat var="arquivo" value="#{livroOrdemController.arquivosRelatos}">
                    <p:column>

                        <p:commandButton actionListener="#{livroOrdemController.excluirArquivo(arquivo)}" icon="excluir" update="#{livroOrdemController.componentes}" />

                        <h:outputText value="#{arquivo.nomeArquivo}"/>

                    </p:column>
                </ui:repeat>

                <p:commandButton value="Enviar Anexos"
                                action="#{livroOrdemController.restaurarDialogRelato()}"                                   
                                oncomplete="dialogRelato.hide();"
                                process="@this,dialogRelato"
                                update="#{livroOrdemController.componentes}"/>

                <p:commandButton value="Cancelar"
                                onclick="dialogRelato.hide();" />
            </h:panelGroup>
        </p:panel>

   </p:dialog>