Skip to content

Commit

Permalink
feat(help): scroll y height opcionales en plex-help
Browse files Browse the repository at this point in the history
  • Loading branch information
@ma7payne
ma7payne committed Oct 8, 2024
1 parent 80772b3 commit 9f8bdda
Show file tree
Hide file tree
Showing 2 changed files with 130 additions and 0 deletions.
123 changes: 123 additions & 0 deletions src/demo/app/help/help.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -237,5 +237,128 @@ <h6>
</plex-help>
</plex-title>

<plex-title titulo="plex-help (scroll='false')" size="sm">
<plex-help titulo="Ayuda de este panel" [scroll]="false" [maxHeight]="200">
<ol info class="list-group-flush">
<li>Buscá conceptos SNOMED en el campo de texto del panel lateral
(acepta búsquedas
parciales)</li>
<li>Seleccioná el concepto al cual quieras agregar o modificar
plantillas</li>
<li>Completá los campos "Título" y "Texto del procedimiento"</li>
<li>Opcionalmente podés elegir seleccionar a todos los descendientes
del concepto.</li>
<li>Hacé click en "Guardar todos" o el botón con el signo <i class="mdi mdi-check"></i> para
guardar
una plantilla individual</li>
<li>Buscá conceptos SNOMED en el campo de texto del panel lateral
(acepta búsquedas
parciales)</li>
<li>Seleccioná el concepto al cual quieras agregar o modificar
plantillas</li>
<li>Completá los campos "Título" y "Texto del procedimiento"</li>
<li>Opcionalmente podés elegir seleccionar a todos los descendientes
del concepto.</li>
<li>Hacé click en "Guardar todos" o el botón con el signo <i class="mdi mdi-check"></i> para
guardar
una plantilla individual</li>
<li>Buscá conceptos SNOMED en el campo de texto del panel lateral
(acepta búsquedas
parciales)</li>
<li>Seleccioná el concepto al cual quieras agregar o modificar
plantillas</li>
<li>Completá los campos "Título" y "Texto del procedimiento"</li>
<li>Opcionalmente podés elegir seleccionar a todos los descendientes
del concepto.</li>
<li>Hacé click en "Guardar todos" o el botón con el signo <i class="mdi mdi-check"></i> para
guardar
una plantilla individual</li>
<li>Buscá conceptos SNOMED en el campo de texto del panel lateral
(acepta búsquedas
parciales)</li>
<li>Seleccioná el concepto al cual quieras agregar o modificar
plantillas</li>
<li>Completá los campos "Título" y "Texto del procedimiento"</li>
<li>Opcionalmente podés elegir seleccionar a todos los descendientes
del concepto.</li>
<li>Hacé click en "Guardar todos" o el botón con el signo <i class="mdi mdi-check"></i> para
guardar
una plantilla individual</li>
<li>Buscá conceptos SNOMED en el campo de texto del panel lateral
(acepta búsquedas
parciales)</li>
<li>Seleccioná el concepto al cual quieras agregar o modificar
plantillas</li>
<li>Completá los campos "Título" y "Texto del procedimiento"</li>
<li>Opcionalmente podés elegir seleccionar a todos los descendientes
del concepto.</li>
<li>Hacé click en "Guardar todos" o el botón con el signo <i class="mdi mdi-check"></i> para
guardar
una plantilla individual</li>
</ol>
</plex-help>
</plex-title>

<plex-title titulo="plex-help (maxHeight='200')" size="sm">
<plex-help titulo="Ayuda de este panel" [maxHeight]="200">
<ol info class="list-group-flush">
<li>Buscá conceptos SNOMED en el campo de texto del panel lateral
(acepta búsquedas
parciales)</li>
<li>Seleccioná el concepto al cual quieras agregar o modificar
plantillas</li>
<li>Completá los campos "Título" y "Texto del procedimiento"</li>
<li>Opcionalmente podés elegir seleccionar a todos los descendientes
del concepto.</li>
<li>Hacé click en "Guardar todos" o el botón con el signo <i class="mdi mdi-check"></i> para
guardar
una plantilla individual</li>
<li>Buscá conceptos SNOMED en el campo de texto del panel lateral
(acepta búsquedas
parciales)</li>
<li>Seleccioná el concepto al cual quieras agregar o modificar
plantillas</li>
<li>Completá los campos "Título" y "Texto del procedimiento"</li>
<li>Opcionalmente podés elegir seleccionar a todos los descendientes
del concepto.</li>
<li>Hacé click en "Guardar todos" o el botón con el signo <i class="mdi mdi-check"></i> para
guardar
una plantilla individual</li>
<li>Buscá conceptos SNOMED en el campo de texto del panel lateral
(acepta búsquedas
parciales)</li>
<li>Seleccioná el concepto al cual quieras agregar o modificar
plantillas</li>
<li>Completá los campos "Título" y "Texto del procedimiento"</li>
<li>Opcionalmente podés elegir seleccionar a todos los descendientes
del concepto.</li>
<li>Hacé click en "Guardar todos" o el botón con el signo <i class="mdi mdi-check"></i> para
guardar
una plantilla individual</li>
<li>Buscá conceptos SNOMED en el campo de texto del panel lateral
(acepta búsquedas
parciales)</li>
<li>Seleccioná el concepto al cual quieras agregar o modificar
plantillas</li>
<li>Completá los campos "Título" y "Texto del procedimiento"</li>
<li>Opcionalmente podés elegir seleccionar a todos los descendientes
del concepto.</li>
<li>Hacé click en "Guardar todos" o el botón con el signo <i class="mdi mdi-check"></i> para
guardar
una plantilla individual</li>
<li>Buscá conceptos SNOMED en el campo de texto del panel lateral
(acepta búsquedas
parciales)</li>
<li>Seleccioná el concepto al cual quieras agregar o modificar
plantillas</li>
<li>Completá los campos "Título" y "Texto del procedimiento"</li>
<li>Opcionalmente podés elegir seleccionar a todos los descendientes
del concepto.</li>
<li>Hacé click en "Guardar todos" o el botón con el signo <i class="mdi mdi-check"></i> para
guardar
una plantilla individual</li>
</ol>
</plex-help>
</plex-title>
</plex-layout-sidebar>
</plex-layout>
7 changes: 7 additions & 0 deletions src/lib/help/help.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,10 @@ export class PlexHelpComponent implements OnInit, AfterViewInit {

@Input() icon = 'help';

@Input() scroll: boolean = true;

@Input() maxHeight: string = 'auto';

@Output() close = new EventEmitter();

@Output() open = new EventEmitter();
Expand Down Expand Up @@ -84,6 +88,9 @@ export class PlexHelpComponent implements OnInit, AfterViewInit {

const helpCard = this.elementRef.nativeElement.querySelector('div.toggle-help .card');

helpCard.style.overflow = !this.scroll ? 'hidden' : 'auto';
helpCard.style.maxHeight = this.maxHeight ? `${this.maxHeight}px` : 'auto';

this.closed = !this.closed;
if (!this.closed) {
this.helpService.setHelp(this);
Expand Down

0 comments on commit 9f8bdda

Please sign in to comment.