diff --git a/src/app/modules/rup/components/ejecucion/hudsBusqueda.component.ts b/src/app/modules/rup/components/ejecucion/hudsBusqueda.component.ts
index 991625e2e6..b1a7aacaad 100644
--- a/src/app/modules/rup/components/ejecucion/hudsBusqueda.component.ts
+++ b/src/app/modules/rup/components/ejecucion/hudsBusqueda.component.ts
@@ -2,8 +2,6 @@ import { Auth } from '@andes/auth';
 import { Plex } from '@andes/plex';
 import { AfterContentInit, Component, EventEmitter, Input, OnChanges, OnDestroy, OnInit, Optional, Output, SimpleChanges, ViewEncapsulation } from '@angular/core';
 import * as moment from 'moment';
-import { LaboratorioService } from 'src/app/services/laboratorio.service';
-import { RecetaService } from 'src/app/services/receta.service';
 import { Observable, forkJoin } from 'rxjs';
 import { switchMap } from 'rxjs/operators';
 import { InternacionResumenHTTP } from 'src/app/apps/rup/mapa-camas/services/resumen-internacion.http';
@@ -12,7 +10,9 @@ import { PacienteService } from 'src/app/core/mpi/services/paciente.service';
 import { SECCION_CLASIFICACION } from 'src/app/modules/epidemiologia/constantes';
 import { FormsEpidemiologiaService } from 'src/app/modules/epidemiologia/services/ficha-epidemiologia.service';
 import { ConceptosTurneablesService } from 'src/app/services/conceptos-turneables.service';
+import { LaboratorioService } from 'src/app/services/laboratorio.service';
 import { ProfesionalService } from 'src/app/services/profesional.service';
+import { RecetaService } from 'src/app/services/receta.service';
 import { gtag } from '../../../../shared/services/analytics.service';
 import { IPrestacion } from '../../interfaces/prestacion.interface';
 import { getSemanticClass } from '../../pipes/semantic-class.pipes';
@@ -86,6 +86,7 @@ export class HudsBusquedaComponent implements AfterContentInit, OnInit, OnDestro
         });
     }
 
+
     public todos: any = [];
     public solicitudes: any = [];
     public solicitudesTOP: any = [];
@@ -147,6 +148,7 @@ export class HudsBusquedaComponent implements AfterContentInit, OnInit, OnDestro
     public filtroRecetas;
     public searchRecetas;
     public busquedaRecetas;
+    public busquedaRecetasOriginal;
     public motivosSuspension;
     public motivoSuspensionSelector;
     public seleccionRecetas = [];
@@ -243,6 +245,10 @@ export class HudsBusquedaComponent implements AfterContentInit, OnInit, OnDestro
                 this.permisosVac ? 'vacunas' :
                     'recetas';
         this.pacienteSelected = this.paciente;
+
+        if (this.filtroActual === 'recetas') {
+            this.showFiltros = true;
+        }
     }
 
     ngOnChanges(changes: SimpleChanges) {
@@ -273,11 +279,26 @@ export class HudsBusquedaComponent implements AfterContentInit, OnInit, OnDestro
         this._onDragEnd.emit(e);
     }
 
+    public tiposPrescripcion = [
+        { id: 'medicamento', nombre: 'Medicamento' },
+        { id: 'insumo', nombre: 'Dispositivos / Insumos' },
+        { id: 'alimentacion', nombre: 'Alimentación' },
+        { id: 'magistral', nombre: 'Magistrales' }
+    ];
+    public tipoPrescripcionSeleccionado = this.tiposPrescripcion[0];
+    public fechaInicioRecetas;
+    public fechaFinRecetas;
+
     toogleFiltros() {
         this.showFiltros = !this.showFiltros;
         if (!this.showFiltros) {
             this.fechaInicio = this.fechaFin = this.prestacionSeleccionada = null;
+            this.fechaInicioRecetas = this.fechaFinRecetas = null;
+            this.tipoPrescripcionSeleccionado = this.tiposPrescripcion[0];
             this.filtrar();
+            if (this.filtroActual === 'recetas') {
+                this.filtrarRecetas();
+            }
         }
     }
 
@@ -756,7 +777,7 @@ export class HudsBusquedaComponent implements AfterContentInit, OnInit, OnDestro
             case 'solicitudes':
                 return this.solicitudesMezcladas.length;
             case 'recetas':
-                return this.busquedaRecetas?.length;
+                return this.busquedaRecetasOriginal?.length;
             case 'registro':
                 return this.registrosTotalesCopia.registro.length;
         }
@@ -768,6 +789,9 @@ export class HudsBusquedaComponent implements AfterContentInit, OnInit, OnDestro
         if (key === 'planes') {
             this.setAmbitoOrigen('ambulatorio');
         }
+        if (key === 'recetas') {
+            this.showFiltros = true;
+        }
     }
 
     mostrarItem(item) {
@@ -945,12 +969,12 @@ export class HudsBusquedaComponent implements AfterContentInit, OnInit, OnDestro
     filtrarRecetas() {
         const searchTerm = this.searchRecetas?.toLowerCase() || '';
 
-        if (!searchTerm && !this.filtroRecetas) {
-            this.groupRecetas();
+        if (!searchTerm && !this.filtroRecetas && !this.tipoPrescripcionSeleccionado && !this.fechaInicioRecetas && !this.fechaFinRecetas) {
+            this.busquedaRecetas = this.busquedaRecetasOriginal;
             return;
         }
 
-        let filteredRecetas = this.busquedaRecetas;
+        let filteredRecetas = this.busquedaRecetasOriginal;
 
         if (searchTerm) {
             filteredRecetas = filteredRecetas.filter(group => {
@@ -958,9 +982,51 @@ export class HudsBusquedaComponent implements AfterContentInit, OnInit, OnDestro
             });
         }
 
+        if (this.fechaInicioRecetas || this.fechaFinRecetas) {
+            const fechaInicio = this.fechaInicioRecetas ? moment(this.fechaInicioRecetas).startOf('day') : null;
+            const fechaFin = this.fechaFinRecetas ? moment(this.fechaFinRecetas).endOf('day') : null;
+
+            filteredRecetas = filteredRecetas.filter(group => {
+                const fecha = moment(group.recetaVisible.fechaRegistro);
+                if (fechaInicio && fecha.isBefore(fechaInicio)) {
+                    return false;
+                }
+                if (fechaFin && fecha.isAfter(fechaFin)) {
+                    return false;
+                }
+                return true;
+            });
+        }
+
+        if (this.tipoPrescripcionSeleccionado) {
+            const tipo = this.tipoPrescripcionSeleccionado.id;
+            filteredRecetas = filteredRecetas.filter(group => {
+                const medicamento = group.recetaVisible.medicamento;
+                const concept = medicamento.concepto;
+                const semanticTag = concept.semanticTag;
+                const term = concept.term.toLowerCase();
+
+                switch (tipo) {
+                    case 'medicamento':
+                        return true;
+                    case 'insumo':
+                        return (semanticTag === 'objeto físico' || semanticTag === 'producto') && !term.includes('alimentacion') && !term.includes('fórmula');
+                    case 'alimentacion':
+                        // Assuming semantic tag is 'producto' but checking term for 'alimentacion' as heuristic
+                        return semanticTag === 'producto' && (term.includes('alimentacion') || term.includes('fórmula') || term.includes('leche'));
+                    case 'magistral':
+                        // Check if properties indicate magistral, currently no explicit property known, might be in concept term
+                        return term.includes('magistral');
+                    default:
+                        return true;
+                }
+            });
+        }
+
         if (this.filtroRecetas) {
             filteredRecetas = filteredRecetas.reduce((acc, receta) => {
                 const vigenteRecetas = receta.recetas.filter(r => r.estadoActual.tipo === 'vigente');
+
                 if (vigenteRecetas.length > 0) {
                     acc.push({
                         conceptId: receta.conceptId,
@@ -1005,6 +1071,7 @@ export class HudsBusquedaComponent implements AfterContentInit, OnInit, OnDestro
 
                 }))
             );
+            this.busquedaRecetasOriginal = this.busquedaRecetas;
         });
     }
 
@@ -1103,4 +1170,20 @@ export class HudsBusquedaComponent implements AfterContentInit, OnInit, OnDestro
             return 'info';
         }
     }
+
+    checkDispensaAnticipada(receta) {
+        if (receta.estadoDispensaActual && receta.estadoDispensaActual.fecha) {
+            const fechaDispensa = moment(receta.estadoDispensaActual.fecha);
+            const fechaRegistro = moment(receta.fechaRegistro);
+
+            if (fechaDispensa.isBefore(fechaRegistro)) {
+                if (receta.estadoActual.tipo === 'finalizada') {
+                    return 'dispensa anticipada';
+                } else if (receta.estadoActual.tipo === 'pendiente') {
+                    return 'dispensa parcial anticipada';
+                }
+            }
+        }
+        return null;
+    }
 }
diff --git a/src/app/modules/rup/components/ejecucion/hudsBusqueda.html b/src/app/modules/rup/components/ejecucion/hudsBusqueda.html
index 4d97df6385..4ba285ff96 100644
--- a/src/app/modules/rup/components/ejecucion/hudsBusqueda.html
+++ b/src/app/modules/rup/components/ejecucion/hudsBusqueda.html
@@ -6,9 +6,9 @@
     <div class="container-filtros">
         <div class="slider-filtros">
             <plex-card class="card-filtro" *ngFor="let filtro of filtros; let iPrestacion = index"
-                       (click)="filtroBuscador(filtro.key)">
+                (click)="filtroBuscador(filtro.key)">
                 <div *ngIf="mostrarItem(filtro)" class="card-content {{filtro.key}}"
-                     [ngClass]="{'active': filtroActual === filtro.key}">
+                    [ngClass]="{'active': filtroActual === filtro.key}">
                     <div class="icon-wrapper">
                         <div class="contador"><small *ngIf="getCantidadResultados(filtro.key)">
                                 {{getCantidadResultados(filtro.key)}}
@@ -26,26 +26,25 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
 
         <div *ngIf="filtroActual === 'laboratorios'" justify="end">
             <plex-button class="mr-1" icon="refresh" type="primary" size="sm" tooltip="Actualizar listado"
-                         [autodisabled]="true" (click)="refreshLaboratorios(token)">
+                [autodisabled]="true" (click)="refreshLaboratorios(token)">
             </plex-button>
             <plex-button icon="database-search" type="success" size="sm" tooltipPosition="left"
-                         tooltip="Buscar nuevos registros" [disabled]="disabledBtnCDA" (click)="regenerarCDA()">
+                tooltip="Buscar nuevos registros" [disabled]="disabledBtnCDA" (click)="regenerarCDA()">
             </plex-button>
         </div>
-
-        <suspender-medicacion *ngIf="filtroActual==='recetas' && seleccionRecetas.length > 0"
-                              [seleccionRecetas]="seleccionSuspender" [motivoSelector]="motivoSuspensionSelector"
-                              [motivosSuspension]="motivosSuspension" [profesional]="profesional"
-                              (reset)="resetSeleccionRecetas()">
-        </suspender-medicacion>
     </div>
-    <div class="grow" *ngIf="filtroActual === 'planes'">
-        <plex-options class="filtros-ambitos" (activated)='setAmbitoOrigen($event)' [items]="filtrosAmbitos">
+    <div class="grow d-flex w-100" *ngIf="filtroActual === 'planes' || filtroActual === 'recetas'">
+        <plex-options *ngIf="filtroActual === 'planes'" class="filtros-ambitos" (activated)='setAmbitoOrigen($event)'
+            [items]="filtrosAmbitos">
         </plex-options>
-        <div class="ml-1">
+        <div class="d-flex align-items-center justify-content-end">
+            <suspender-medicacion *ngIf="filtroActual==='recetas' && seleccionRecetas.length > 0"
+                [seleccionRecetas]="seleccionSuspender" [motivoSelector]="motivoSuspensionSelector"
+                [motivosSuspension]="motivosSuspension" [profesional]="profesional" (reset)="resetSeleccionRecetas()">
+            </suspender-medicacion>
             <plex-button type="info" size="sm" [icon]="showFiltros ? 'chevron-up' : 'chevron-down'"
-                         [title]="showFiltros ? 'Cerrar filtros' : 'Ver filtros'" class="float-right"
-                         tooltipPosition="left" (click)="toogleFiltros()">
+                [title]="showFiltros ? 'Cerrar filtros' : 'Ver filtros'" class="float-right" tooltipPosition="left"
+                (click)="toogleFiltros()">
             </plex-button>
         </div>
     </div>
@@ -53,46 +52,68 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
 
 
 <ng-container
-              *ngIf="filtroActual !== 'solicitudes' && filtroActual !== 'planes' && filtroActual !== 'laboratorios' && filtroActual !== 'vacunas' && filtroActual !== 'dominios'">
+    *ngIf="filtroActual !== 'solicitudes' && filtroActual !== 'planes' && filtroActual !== 'laboratorios' && filtroActual !== 'vacunas' && filtroActual !== 'dominios'">
     <div *ngIf="hasRegistrosTotales(filtroActual)" class="mb-2">
         <plex-text [(ngModel)]="searchTerm" name="searchTerm" (change)="buscar()" placeholder="Buscar registros..."
-                   [autoFocus]="true">
+            [autoFocus]="true">
         </plex-text>
     </div>
 
     <div class="my-2" *ngIf="filtroActual === 'trastorno' && hasRegistrosTotales(filtroActual)">
         <plex-bool [(ngModel)]="filtroTrastornos" name="filtroTrastornos" (change)="filtrarTrastornos()" type="slide"
-                   label="{{filtroTrastornos ? 'Activos' : 'Todos'}}">
+            label="{{filtroTrastornos ? 'Activos' : 'Todos'}}">
         </plex-bool>
     </div>
 
 
     <!-- Vista Recetas -->
     <ng-container *ngIf="filtroActual === 'recetas'">
+        <ng-container *ngIf="showFiltros">
+            <div class="row">
+                <div class="col-12">
+                    <plex-select [(ngModel)]="tipoPrescripcionSeleccionado" label="Tipo de prescripción"
+                        [data]="tiposPrescripcion" idField="id" labelField="nombre" (change)="filtrarRecetas()"
+                        [readonly]="true">
+                    </plex-select>
+                </div>
+            </div>
+            <div class="row pb-2">
+                <div class="col-6">
+                    <plex-datetime type="date" [(ngModel)]="fechaInicioRecetas" (change)="filtrarRecetas()"
+                        name="fechaInicioRecetas" label="Fecha Desde" [debounce]="400">
+                    </plex-datetime>
+                </div>
+                <div class="col-6">
+                    <plex-datetime type="date" [(ngModel)]="fechaFinRecetas" (change)="filtrarRecetas()"
+                        name="fechaFinRecetas" label="Fecha Hasta" [debounce]="400">
+                    </plex-datetime>
+                </div>
+            </div>
+        </ng-container>
         <plex-text [(ngModel)]="searchRecetas" name="searchRecetas" (change)="filtrarRecetas()"
-                   placeholder="Buscar recetas..." [autoFocus]="true">
+            placeholder="Buscar recetas..." [autoFocus]="true">
         </plex-text>
         <div class="my-2">
             <ul *ngIf="busquedaRecetas.length" class="hover listado list-unstyled">
                 <ng-container *ngFor="let grupo of busquedaRecetas; let iReceta = index">
                     <li>
                         <plex-bool [readonly]="!esRecetaSeleccionable(grupo?.recetaVisible)"
-                                   [ngModel]="seleccionRecetas[iReceta]" name="seleccionada" type="checkbox"
-                                   (change)="seleccionarReceta($event, grupo.recetas, iReceta)">
+                            [ngModel]="seleccionRecetas[iReceta]" name="seleccionada" type="checkbox"
+                            (change)="seleccionarReceta($event, grupo.recetas, iReceta)">
                         </plex-bool>
                         <div class="total">
                             <div class="row vista-badges"
-                                 *ngIf="grupo.recetaVisible?.medicamento?.tratamientoProlongado">
+                                *ngIf="grupo.recetaVisible?.medicamento?.tratamientoProlongado">
                                 <span class="pl-2 pr-2 mr-3 upTag" [ngClass]="{'active': huds.isOpen(grupo, 'receta')}">
                                     {{ textoTratamientoProlongado(grupo) }}
                                 </span>
                             </div>
                             <div class="rup-card mini recetas total"
-                                 [ngClass]="{'active': huds.isOpen(grupo, 'receta')}"
-                                 (click)="emitTabs(grupo, 'receta', iReceta)">
+                                [ngClass]="{'active': huds.isOpen(grupo, 'receta')}"
+                                (click)="emitTabs(grupo, 'receta', iReceta)">
                                 <div class="rup-header">
                                     <div class="rup-border rup-border-recetas"
-                                         [ngClass]="{'active': huds.isOpen(grupo, 'receta')}">
+                                        [ngClass]="{'active': huds.isOpen(grupo, 'receta')}">
                                         <div class="row p-0 m-0 border-secondary border-left-0">
                                             <div class="col-9 p-0 m-0">
                                                 <div class="row m-0 p-0">
@@ -124,12 +145,12 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                                                 <div class="p-0 pt-1 pr-1 float-right">
                                                     <div class="vista-badges">
                                                         <plex-badge size="sm"
-                                                                    [type]="estadoReceta[grupo.recetaVisible?.estadoActual.tipo]">
+                                                            [type]="estadoReceta[grupo.recetaVisible?.estadoActual.tipo]">
                                                             {{ grupo.recetaVisible?.estadoActual?.tipo.replace('-', ' ')
                                                             }}
                                                         </plex-badge>
                                                         <plex-badge size="sm"
-                                                                    [type]="estadoDispensa[grupo.recetaVisible?.estadoDispensaActual.tipo]">
+                                                            [type]="estadoDispensa[grupo.recetaVisible?.estadoDispensaActual.tipo]">
                                                             {{
                                                             grupo.recetaVisible?.estadoDispensaActual?.tipo.replace('-',
                                                             ' ')
@@ -152,7 +173,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
             <hr class="mt-0">
             <div class="item-lista-vacia">
                 <plex-label size="sm" justify="center" icon="adi adi-listado-receta"
-                            titulo="No hay recetas registradas">
+                    titulo="No hay recetas registradas">
                 </plex-label>
             </div>
         </div>
@@ -167,11 +188,11 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <ng-container *ngFor="let registro of solicitudesMezcladas; let iPrestacion = index">
                     <li>
                         <div class="rup-card mini procedimiento"
-                             [ngClass]="{'active': huds.isOpen(registro, 'solicitud') ||  huds.isOpen(registro, 'concepto'), 'solicitud': true}"
-                             (click)="clickSolicitud(registro, iPrestacion)">
+                            [ngClass]="{'active': huds.isOpen(registro, 'solicitud') ||  huds.isOpen(registro, 'concepto'), 'solicitud': true}"
+                            (click)="clickSolicitud(registro, iPrestacion)">
                             <div class="rup-header">
                                 <div class="rup-border rup-border-procedimiento"
-                                     [ngClass]="{'active': huds.isOpen(registro, 'solicitud') ||  huds.isOpen(registro, 'concepto'), 'rup-border-plan': true}">
+                                    [ngClass]="{'active': huds.isOpen(registro, 'solicitud') ||  huds.isOpen(registro, 'concepto'), 'rup-border-plan': true}">
                                     <div class="row p-0 m-0 border-secondary border-left-0">
                                         <div class="col-10 p-0 m-0">
                                             <div class="row m-0 p-0">
@@ -213,16 +234,15 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                                         <div class="col-2 p-0 m-0">
                                             <div class="p-0 pt-1 pr-1 float-right">
                                                 <plex-badge *ngIf="registro.estadoActual" size="sm"
-                                                            [type]="estadoRegistro(registro.estadoActual?.tipo)">
+                                                    [type]="estadoRegistro(registro.estadoActual?.tipo)">
                                                     {{ registro.estadoActual.tipo }}
                                                     <plex-button *ngIf='registro.evoluciones' size="sm" type="info"
-                                                                 icon="information-outline"
-                                                                 title="Registrado por profesional"
-                                                                 titlePosition="left">
+                                                        icon="information-outline" title="Registrado por profesional"
+                                                        titlePosition="left">
                                                     </plex-button>
                                                     <plex-button *ngIf='!registro.evoluciones' size="sm" type="info"
-                                                                 icon="information-outline"
-                                                                 title="Registrado por gestión" titlePosition="left">
+                                                        icon="information-outline" title="Registrado por gestión"
+                                                        titlePosition="left">
                                                     </plex-button>
                                                 </plex-badge>
                                             </div>
@@ -238,7 +258,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <hr class="mt-0">
                 <div class="item-lista-vacia">
                     <plex-label size="sm" justify="center" icon="adi adi-mano-corazon"
-                                titulo="No hay solicitudes registradas">
+                        titulo="No hay solicitudes registradas">
                     </plex-label>
                 </div>
             </div>
@@ -250,11 +270,11 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <ng-container *ngFor="let registro of registrosTotales.hallazgo ; let iConcepto = index">
                     <li>
                         <div class="rup-card mini hallazgo"
-                             [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'solicitud': registro.esSolicitud}"
-                             (click)="emitTabs(registro, 'concepto', iConcepto)">
+                            [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'solicitud': registro.esSolicitud}"
+                            (click)="emitTabs(registro, 'concepto', iConcepto)">
                             <div class="rup-header">
                                 <div class="rup-border rup-border-hallazgo"
-                                     [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'rup-border-plan': registro.esSolicitud}">
+                                    [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'rup-border-plan': registro.esSolicitud}">
                                     <div class="row p-0 m-0 border-secondary border-left-0">
                                         <div class="col-10 p-0 m-0">
                                             <div class="row m-0 p-0">
@@ -298,7 +318,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <hr class="mt-0">
                 <div class="item-lista-vacia">
                     <plex-label size="sm" justify="center" icon="adi adi-hallazgo"
-                                titulo="No hay hallazgos registrados">
+                        titulo="No hay hallazgos registrados">
                     </plex-label>
                 </div>
             </div>
@@ -310,17 +330,17 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <ng-container *ngFor="let registro of registrosTotales.trastorno; let iConcepto = index">
                     <li>
                         <div class="rup-card mini trastorno"
-                             [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'solicitud': registro.esSolicitud}"
-                             (click)="emitTabs(registro, 'concepto', iConcepto)">
+                            [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'solicitud': registro.esSolicitud}"
+                            (click)="emitTabs(registro, 'concepto', iConcepto)">
                             <div class="rup-header">
                                 <div class="rup-border rup-border-trastorno"
-                                     [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'rup-border-plan': registro.esSolicitud}">
+                                    [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'rup-border-plan': registro.esSolicitud}">
                                     <div class="row p-0 m-0 border-secondary border-left-0">
                                         <div class="col-10 p-0 m-0">
                                             <div class="row m-0 p-0">
                                                 <div class="icon-rup drag-handle p-0 pt-1" draggable
-                                                     [dragScope]="'registros-rup'" [dragData]="registro.concepto"
-                                                     (onDragStart)="dragStart($event)" (onDragEnd)="dragEnd($event)">
+                                                    [dragScope]="'registros-rup'" [dragData]="registro.concepto"
+                                                    (onDragStart)="dragStart($event)" (onDragEnd)="dragEnd($event)">
                                                     <i class="adi adi-trastorno"></i>
                                                 </div>
                                                 <div class="col p-0 pl-2 float-left">
@@ -348,14 +368,14 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                                             <div class="p-0 pt-1 pr-1 float-right">
                                                 <ng-container *ngIf="registro.evoluciones">
                                                     <plex-badge size="sm"
-                                                                [type]="registro.evoluciones[0].estado === 'activo' ? 'success' : 'danger'">
+                                                        [type]="registro.evoluciones[0].estado === 'activo' ? 'success' : 'danger'">
                                                         {{ registro.evoluciones[0].estado }}
                                                     </plex-badge>
                                                 </ng-container>
                                                 <button class="btn btn-sm btn-primary btn-icon-rup p-0"
-                                                        *ngIf="emitirConceptos && registro?.evoluciones[0]?.estado !== 'resuelto' "
-                                                        (click)="$event.stopPropagation(); agregarRegistro(registro)"
-                                                        title="Agregar a la consulta" titlePosition="left">
+                                                    *ngIf="emitirConceptos && registro?.evoluciones[0]?.estado !== 'resuelto' "
+                                                    (click)="$event.stopPropagation(); agregarRegistro(registro)"
+                                                    title="Agregar a la consulta" titlePosition="left">
                                                     <i class="mdi mdi-plus"></i>
                                                 </button>
                                             </div>
@@ -371,7 +391,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <hr class="mt-0">
                 <div class="item-lista-vacia">
                     <plex-label size="sm" justify="center" icon="adi adi-trastorno"
-                                titulo="No hay trastornos registrados">
+                        titulo="No hay trastornos registrados">
                     </plex-label>
                 </div>
             </div>
@@ -383,11 +403,11 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <ng-container *ngFor="let registro of registrosTotales.registro; let iConcepto = index">
                     <li>
                         <div class="rup-card mini elementoderegistro"
-                             [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'solicitud': registro.esSolicitud}"
-                             (click)="emitTabs(registro, 'concepto', iConcepto)">
+                            [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'solicitud': registro.esSolicitud}"
+                            (click)="emitTabs(registro, 'concepto', iConcepto)">
                             <div class="rup-header">
                                 <div class="rup-border rup-border-elementoderegistro"
-                                     [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'rup-border-registro': registro.esSolicitud}">
+                                    [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'rup-border-registro': registro.esSolicitud}">
                                     <div class="row p-0 m-0 border-secondary border-left-0">
                                         <div class="col-10 p-0 m-0">
                                             <div class="row m-0 p-0">
@@ -432,7 +452,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <hr class="mt-0">
                 <div class="item-lista-vacia">
                     <plex-label size="sm" justify="center" icon="adi adi-documento-lapiz"
-                                titulo="No hay elementos de registros cargados">
+                        titulo="No hay elementos de registros cargados">
                     </plex-label>
                 </div>
             </div>
@@ -444,17 +464,17 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <ng-container *ngFor="let registro of registrosTotales.procedimiento; let iPrestacion = index">
                     <li>
                         <div class="rup-card mini procedimiento"
-                             [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'solicitud': registro.esSolicitud}"
-                             (click)="emitTabs(registro, 'concepto', iPrestacion)">
+                            [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'solicitud': registro.esSolicitud}"
+                            (click)="emitTabs(registro, 'concepto', iPrestacion)">
                             <div class="rup-header">
                                 <div class="rup-border rup-border-procedimiento"
-                                     [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'rup-border-plan': registro.esSolicitud}">
+                                    [ngClass]="{'active': huds.isOpen(registro, 'concepto'), 'rup-border-plan': registro.esSolicitud}">
                                     <div class="row p-0 m-0 border-secondary border-left-0">
                                         <div class="col-10 p-0 m-0">
                                             <div class="row m-0 p-0">
                                                 <div class="col-2 icon-rup drag-handle">
                                                     <i class="adi" [class.adi-termometro]="!registro.isSolicitud"
-                                                       [class.adi-mano-corazon]="registro.esSolicitud"></i>
+                                                        [class.adi-mano-corazon]="registro.esSolicitud"></i>
                                                 </div>
                                                 <div class="col p-0 pl-2 float-left">
                                                     {{ registro.concepto.term }}
@@ -492,7 +512,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <hr class="mt-0">
                 <div class="item-lista-vacia">
                     <plex-label size="sm" justify="center" icon="adi adi-termometro"
-                                titulo="No hay procedimientos registrados">
+                        titulo="No hay procedimientos registrados">
                     </plex-label>
                 </div>
             </div>
@@ -504,26 +524,26 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <div class="row">
                     <div class="col-12">
                         <plex-select [(ngModel)]="prestacionSeleccionada" label="Prestación" [data]="tiposPrestacion"
-                                     idField="conceptId" labelField="term" (change)="filtrar()" [multiple]="true">
+                            idField="conceptId" labelField="term" (change)="filtrar()" [multiple]="true">
                         </plex-select>
                     </div>
                 </div>
                 <div *ngIf="!efectorRestringido" class="row">
                     <div class="col-12">
                         <plex-select [(ngModel)]="organizacionSeleccionada" label="Organización" [data]="organizaciones"
-                                     idField="id" labelField="nombre" (change)="filtrar()">
+                            idField="id" labelField="nombre" (change)="filtrar()">
                         </plex-select>
                     </div>
                 </div>
                 <div class="row pb-2">
                     <div class="col-6">
                         <plex-datetime type="date" [(ngModel)]="fechaInicio" (change)="filtrar()" name="fechaInicio"
-                                       label="Fecha Desde" [debounce]="400">
+                            label="Fecha Desde" [debounce]="400">
                         </plex-datetime>
                     </div>
                     <div class="col-6">
                         <plex-datetime type="date" [(ngModel)]="fechaFin" (change)="filtrar()" name="fechaFin"
-                                       label="Fecha Hasta" [debounce]="400">
+                            label="Fecha Hasta" [debounce]="400">
                         </plex-datetime>
                     </div>
                 </div>
@@ -537,7 +557,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                                 <div plex-accordion-title case="capitalize">
                                     <div class="d-flex">
                                         <div class="icono"><plex-icon class="icon" size="lg"
-                                                       name="documento"></plex-icon></div>
+                                                name="documento"></plex-icon></div>
                                         <div>
                                             Detalle de la internacion
                                             <br>
@@ -555,9 +575,9 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
 
                                 <div class="list-group">
                                     <div *ngFor="let registro of internacion.registros; let iInternacion = index"
-                                         class="item-prestacion list-group-item"
-                                         [ngClass]="{'activo': huds.someOpen(internacion, iInternacion)}"
-                                         (click)="emitTabs(internacion, 'internacion', iInternacion)">
+                                        class="item-prestacion list-group-item"
+                                        [ngClass]="{'activo': huds.someOpen(internacion, iInternacion)}"
+                                        (click)="emitTabs(internacion, 'internacion', iInternacion)">
                                         <div *ngIf="registro.conceptId === '430147008'" class="icono hidrico">
                                             <plex-icon class="icon" size="lg" name="mano-gota"></plex-icon>
                                         </div>
@@ -565,7 +585,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                                             <plex-icon class="icon" size="lg" name="pildoras"></plex-icon>
                                         </div>
                                         <div *ngIf="!registro.conceptId" class="icono otras"><plex-icon class="icon"
-                                                       size="lg" name="circulo-paciente"></plex-icon></div>
+                                                size="lg" name="circulo-paciente"></plex-icon></div>
                                         <div class="titulo text-capitalize">
                                             <p>{{registro.term || 'Evoluciones y otros registros'}}</p>
                                         </div>
@@ -580,7 +600,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                                 <div plex-accordion-title case="capitalize">
                                     <div class="d-flex">
                                         <div class="icono"><plex-icon class="icon" size="lg"
-                                                       name="documento"></plex-icon></div>
+                                                name="documento"></plex-icon></div>
                                         <div>
                                             Prestación fuera de internación
                                             <br>
@@ -596,15 +616,15 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
 
                                 <div class="list-group">
                                     <div *ngFor="let indice of otrasPrestaciones.indices; let iInternacion = index"
-                                         class="item-prestacion list-group-item"
-                                         [ngClass]="{'activo': huds.someOpen(internacion, iInternacion)}"
-                                         (click)="emitTabs(otrasPrestaciones, 'internacion', iInternacion)">
+                                        class="item-prestacion list-group-item"
+                                        [ngClass]="{'activo': huds.someOpen(internacion, iInternacion)}"
+                                        (click)="emitTabs(otrasPrestaciones, 'internacion', iInternacion)">
                                         <div *ngIf="indice.conceptId === '430147008'" class="icono hidrico"><plex-icon
-                                                       class="icon" size="lg" name="mano-gota"></plex-icon></div>
+                                                class="icon" size="lg" name="mano-gota"></plex-icon></div>
                                         <div *ngIf="indice.conceptId === '33633005'" class="icono medico"><plex-icon
-                                                       class="icon" size="lg" name="pildoras"></plex-icon></div>
+                                                class="icon" size="lg" name="pildoras"></plex-icon></div>
                                         <div *ngIf="!indice.conceptId" class="icono otras"><plex-icon class="icon"
-                                                       size="lg" name="circulo-paciente"></plex-icon></div>
+                                                size="lg" name="circulo-paciente"></plex-icon></div>
                                         <div class="titulo text-capitalize">
                                             <p>{{indice.term || 'Evoluciones y otros registros'}}</p>
                                         </div>
@@ -617,7 +637,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                         <hr class="mt-0">
                         <div class="item-lista-vacia">
                             <plex-label size="sm" justify="center" icon="adi adi-clipboard-check-outline"
-                                        titulo="No hay prestaciones registradas">
+                                titulo="No hay prestaciones registradas">
                             </plex-label>
                         </div>
                     </div>
@@ -627,11 +647,11 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                     <ng-container *ngFor="let prestacion of prestaciones; let iPrestacion = index">
                         <li>
                             <div class="rup-card mini prestacion"
-                                 [ngClass]="{'active': huds.isOpen(prestacion.data, prestacion.tipo)}"
-                                 (click)="emitTabs(prestacion, prestacion.tipo, iPrestacion)">
+                                [ngClass]="{'active': huds.isOpen(prestacion.data, prestacion.tipo)}"
+                                (click)="emitTabs(prestacion, prestacion.tipo, iPrestacion)">
                                 <div class="rup-header">
                                     <div class="rup-border rup-border-prestacion"
-                                         [ngClass]="{'active': huds.isOpen(prestacion.data, prestacion.tipo)}">
+                                        [ngClass]="{'active': huds.isOpen(prestacion.data, prestacion.tipo)}">
                                         <div class="row p-0 m-0 border-secondary border-left-0">
                                             <div class="col-10 p-0 m-0">
                                                 <div class="row m-0 p-0">
@@ -665,7 +685,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                                             <div class="col-2 p-0 m-0">
                                                 <div class="p-0 pt-1 pr-1 float-right">
                                                     <plex-badge size="sm"
-                                                                [type]=" prestacion.tipo !== 'ficha-epidemiologica' ? 'success' : 'info'">
+                                                        [type]=" prestacion.tipo !== 'ficha-epidemiologica' ? 'success' : 'info'">
                                                         {{prestacion.estado}}
                                                     </plex-badge>
                                                 </div>
@@ -680,7 +700,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                         <hr class="mt-0">
                         <div class="item-lista-vacia">
                             <plex-label size="sm" justify="center" icon="adi adi-clipboard-check-outline"
-                                        titulo="No hay prestaciones registradas">
+                                titulo="No hay prestaciones registradas">
                             </plex-label>
                         </div>
                     </div>
@@ -694,7 +714,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <ng-container *ngFor="let registro of this.registrosTotales.producto; let iCronico = index">
                     <li>
                         <div class="rup-card mini producto" [ngClass]="{'active': huds.isOpen(registro, 'concepto')}"
-                             (click)="emitTabs(registro, 'concepto', iCronico)">
+                            (click)="emitTabs(registro, 'concepto', iCronico)">
                             <div class="rup-header">
                                 <div class="rup-border rup-border-producto">
                                     <div class="row p-0 m-0 border-secondary border-left-0">
@@ -720,7 +740,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                                             <div class="p-0 pt-1 pr-1 float-right">
                                                 <ng-container *ngIf="registro.evoluciones">
                                                     <plex-badge size="sm"
-                                                                [type]="registro.evoluciones[registro.evoluciones.length-1].estado === 'activo' ? 'success' : 'danger'">
+                                                        [type]="registro.evoluciones[registro.evoluciones.length-1].estado === 'activo' ? 'success' : 'danger'">
                                                         {{ registro.evoluciones[registro.evoluciones.length-1].estado }}
                                                     </plex-badge>
                                                 </ng-container>
@@ -737,7 +757,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <hr class="mt-0">
                 <div class="item-lista-vacia">
                     <plex-label size="sm" justify="center" icon="adi adi-pildoras"
-                                titulo="No hay productos registrados">
+                        titulo="No hay productos registrados">
                     </plex-label>
                 </div>
             </div>
@@ -753,7 +773,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                     <ng-container *ngFor="let laboratorio of laboratorios; let iLaboratorio = index">
                         <li>
                             <div class="rup-card mini laboratorio"
-                                 [ngClass]="{'active': huds.isOpen(laboratorio,  laboratorio.idProtocolo ? 'laboratorio' : 'cda')}">
+                                [ngClass]="{'active': huds.isOpen(laboratorio,  laboratorio.idProtocolo ? 'laboratorio' : 'cda')}">
                                 <div class="rup-header">
                                     <div class="rup-border rup-border-laboratorio">
                                         <div class="row p-0 m-0 border-secondary border-left-0">
@@ -765,7 +785,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                                                         </div>
                                                     </ng-container>
                                                     <div class="col p-0 pl-2 float-left"
-                                                         (click)="emitTabs(laboratorio, laboratorio.idProtocolo ? 'laboratorio' : 'cda', iLaboratorio)">
+                                                        (click)="emitTabs(laboratorio, laboratorio.idProtocolo ? 'laboratorio' : 'cda', iLaboratorio)">
                                                         <div>
                                                             <small>
                                                                 <span *ngIf="laboratorio?.prestacion?.term">{{
@@ -801,7 +821,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                                                                 </div>
 
                                                                 <div *ngIf="laboratorio?.efectorSolicitante || laboratorio?.profesional"
-                                                                     class="text-sm">
+                                                                    class="text-sm">
                                                                     <small>Médico solicitante: <b>{{
                                                                             laboratorio?.medicoSolicitante ||
                                                                             laboratorio?.profesional }}</b></small>
@@ -823,7 +843,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <hr class="mt-0">
                 <div class="item-lista-vacia">
                     <plex-label size="sm" justify="center" icon="adi adi-recipiente"
-                                titulo="No hay laboratorios registrados">
+                        titulo="No hay laboratorios registrados">
                     </plex-label>
                 </div>
             </div>
@@ -848,7 +868,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                                                         </div>
                                                     </ng-container>
                                                     <div class="col p-0 pl-2 float-left"
-                                                         (click)="emitTabs(unaVacuna, 'cda', iVacuna)">
+                                                        (click)="emitTabs(unaVacuna, 'cda', iVacuna)">
                                                         {{ unaVacuna?.prestacion.term }}
                                                         <div class="row p-0 m-0">
                                                             <div class="col-10 p-0 m-0">
@@ -890,11 +910,11 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <ng-container *ngFor="let registro of derivaciones; let iDerivacion = index">
                     <li>
                         <div class="rup-card mini recc"
-                             [ngClass]="{'active': huds.isOpen(registro, 'recc'), 'recc': true}"
-                             (click)="clickDerivacion(registro, iDerivacion)">
+                            [ngClass]="{'active': huds.isOpen(registro, 'recc'), 'recc': true}"
+                            (click)="clickDerivacion(registro, iDerivacion)">
                             <div class="rup-header">
                                 <div class="rup-border rup-border-recc"
-                                     [ngClass]="{'active': huds.isOpen(registro, 'recc') , 'rup-border-recc': true}">
+                                    [ngClass]="{'active': huds.isOpen(registro, 'recc') , 'rup-border-recc': true}">
                                     <div class="row p-0 m-0 border-secondary border-left-0">
                                         <div class="col-10 p-0 m-0">
                                             <div class="row m-0 p-0">
@@ -915,12 +935,12 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                                                                 <br>
                                                                 <small>Profesional:
                                                                     <ng-container
-                                                                                  *ngIf='registro.profesionalSolicitante'>
+                                                                        *ngIf='registro.profesionalSolicitante'>
                                                                         {{ registro.profesionalSolicitante |
                                                                         nombre }}
                                                                     </ng-container>
                                                                     <ng-container
-                                                                                  *ngIf='!registro.profesionalSolicitante'>
+                                                                        *ngIf='!registro.profesionalSolicitante'>
                                                                         No existe
                                                                     </ng-container>
                                                                 </small>
@@ -941,7 +961,7 @@ <h6 class="titulo-filtro {{filtroActual}}">{{ getTitulo(filtroActual) | uppercas
                 <hr class="mt-0">
                 <div class="item-lista-vacia">
                     <plex-label size="sm" justify="center" icon="adi adi-mano-corazon"
-                                titulo="No hay derivaciones registradas">
+                        titulo="No hay derivaciones registradas">
                     </plex-label>
                 </div>
             </div>
diff --git a/src/app/modules/rup/components/huds/vistaReceta.html b/src/app/modules/rup/components/huds/vistaReceta.html
index 5d158b1fc1..db3d531fce 100644
--- a/src/app/modules/rup/components/huds/vistaReceta.html
+++ b/src/app/modules/rup/components/huds/vistaReceta.html
@@ -5,28 +5,33 @@
             <div class="info-registro">
                 <div class="vista-badges">
                     <plex-badge *ngIf="recetaPrincipal.estadoActual" size="sm"
-                                [type]="estadoReceta[recetaPrincipal.estadoActual.tipo]">
+                        [type]="estadoReceta[recetaPrincipal.estadoActual.tipo]">
                         {{ recetaPrincipal.estadoActual.tipo.replace('-', ' ') }}
                     </plex-badge>
                     <plex-badge *ngIf="recetaPrincipal.estadoDispensaActual" size="sm"
-                                [type]="estadoDispensa[recetaPrincipal.estadoDispensaActual.tipo]">
+                        [type]="estadoDispensa[recetaPrincipal.estadoDispensaActual.tipo]">
                         {{ recetaPrincipal.estadoDispensaActual.tipo.replace('-', ' ') }}
                     </plex-badge>
+                    <plex-badge *ngIf="checkDispensaAnticipada(recetaPrincipal)" size="sm" type="warning">
+                        {{ checkDispensaAnticipada(recetaPrincipal) }}
+                    </plex-badge>
                     <plex-badge *ngIf="recetaPrincipal.medicamento" size="sm" type="default">
                         {{ recetaPrincipal.medicamento.tipoReceta }}
                     </plex-badge>
                 </div>
                 <div case="capitalize"><b>{{ recetaPrincipal.medicamento.concepto.term }}</b></div>
                 <p *ngIf="recetaPrincipal.medicamento.cantidad && recetaPrincipal.medicamento.cantEnvases "><small>
-                                    {{ recetaPrincipal.medicamento.cantEnvases}} envase(s) de {{ recetaPrincipal.medicamento.cantidad}} {{recetaPrincipal.medicamento.presentacion }}(s) 
+                        {{ recetaPrincipal.medicamento.cantEnvases}} envase(s) de {{
+                        recetaPrincipal.medicamento.cantidad}} {{recetaPrincipal.medicamento.presentacion }}(s)
 
-                </small></p>
+                    </small></p>
                 <p *ngIf="recetaPrincipal.medicamento.dosisDiaria.dosis"><small>{{
                         '|' +recetaPrincipal.medicamento.dosisDiaria.dias ? recetaPrincipal.medicamento.dosisDiaria.dias
                         + ' día(s)' : '' }} {{
                         recetaPrincipal.medicamento.dosisDiaria.dosis }} {{
                         recetaPrincipal.medicamento.presentacion }} cada {{
                         recetaPrincipal.medicamento.dosisDiaria.intervalo?.nombre }}</small>
+
                 </p>
             </div>
         </div>
@@ -67,99 +72,115 @@
         </div>
     </div>
 
-    <div class="mt-2 mb-2" *ngIf="listadoDispensas.length > 0">
-        <plex-title titulo="Detalle dispensa" size="sm"></plex-title>
-        <div class="info-solicitud dispensada mt-2" *ngIf="recetaPrincipal.estadosDispensa.length > 0">
-            <div class="fila-dispensa grid-dispensa">
-                <div><b>FECHA</b></div>
-                <div><b>SISTEMA</b></div>
-                <div><b>ORGANIZACIÓN</b></div>
-                <div><b>ESTADO</b></div>
-                <div><b></b></div>
+    <plex-accordion>
+        <plex-panel class="lista-panel" [active]="true" #panelHistorial>
+            <div plex-accordion-title>
+                <div class="titulo">Historial de medicamento</div>
+                <plex-button disabled type="info" size="sm" [icon]="panelHistorial.active ? 'chevron-up' : 'chevron-down'" class="float-right">
+                </plex-button>
             </div>
+            <plex-label class="mt-3" *ngIf="!historialRecetas.length" size="sm" justify="center"
+                icon="adi adi-listado-receta" titulo="No hay elementos registrados">
+            </plex-label>
+            <plex-table *ngIf="historialRecetas.length" [columns]="columns" #table="plTable" style="width:100%">
+                <plex-table-columns>
+                </plex-table-columns>
+                <tr *ngFor="let receta of historialRecetas; let i = index" [ngClass]="{'suspendida': receta.estadoActual.tipo === 'suspendida'}">
+                    <td *plTableCol="'fecha'">
+                        {{ receta.fechaRegistro | date:'dd/MM/yyyy HH:mm' }}
+                    </td>
+                    <td *plTableCol="'organizacion'">
+                        {{ receta.organizacion.nombre }}
+                    </td>
+                    <td *plTableCol="'profesional'">
+                        {{ receta.profesional.nombre }} {{ receta.profesional.apellido }}
+                    </td>
+                    <td *plTableCol="'diagnostico'">
+                        {{ receta.diagnostico.term || receta.diagnostico.descripcion }}
+                    </td>
+                    <td *plTableCol="'estado'">
+                        <div class="vista-badges">
+                            <plex-badge size="sm" [type]="estadoReceta[receta.estadoActual.tipo]">
+                                {{ receta.estadoActual.tipo }}
+                            </plex-badge>
+                            <plex-badge size="sm" [type]="estadoDispensa[receta.estadoDispensaActual.tipo]">
+                                {{ receta.estadoDispensaActual.tipo.replace('-', ' ') }}
+                            </plex-badge>
+                        </div>
+                    </td>
+                    <td *plTableCol="'acciones'">
+                        <plex-button class="w-10" label="" size="sm" type="danger" icon="delete" (click)="deleteAccion(i)">
+                        </plex-button>
+                    </td>
+                </tr>
+            </plex-table>
+        </plex-panel>
 
-            <ng-container *ngFor="let estadoDispensa of listadoDispensas; let i = index">
-                <div class="fila-dispensa grid-dispensa">
-                    <div class="detalle-dispensa">{{ estadoDispensa.fecha | date: 'dd/MM/yyyy HH:mm' }}</div>
-                    <div class="detalle-dispensa">{{ estadoDispensa.sistema }}</div>
-                    <div class="detalle-dispensa">{{ estadoDispensa.organizacion }}</div>
-                    <div class="detalle-dispensa">{{ estadoDispensa.tipo}} </div>
-                    <div class="detalle-dispensa">
-                        <plex-badge *ngIf="estadoDispensa.dispensaDuplicada" size="sm" [type]="'warning'">
-                            dispensa duplicada
-                        </plex-badge>
-                        <plex-badge *ngIf="estadoDispensa.cancelada" size="sm" [type]="'danger'"  >
-                            dispensa cancelada {{(estadoDispensa.fechaCancelada | date: 'dd/MM/yyyy HH:mm')}}
-                        </plex-badge>
-                    </div>
-                </div>
-            </ng-container>
-        </div>
-    </div>
-    <div class="mt-4 mb-3" *ngIf="recetaPrincipal.estadoActual.tipo === 'suspendida'">
-        <plex-title titulo="Motivo de suspensión" size="sm"></plex-title>
-    </div>
-
-    <div class="info-solicitud suspendida mt-4" *ngIf="recetaPrincipal.estadoActual.tipo === 'suspendida'">
-        <div class="data">
-            <div>
-                <b>Fecha</b>
-                <p class="texto-detalle">{{recetaPrincipal.estadoActual.createdAt | date:'dd/MM/yyyy HH:mm'}}</p>
+        <plex-panel class="lista-panel" *ngIf="listadoDispensas.length > 0" #panelDispensa>
+            <div plex-accordion-title>
+                <div class="titulo">Detalle dispensa</div>
+                <plex-button disabled type="info" size="sm" [icon]="panelDispensa.active ? 'chevron-up' : 'chevron-down'" class="float-right">
+                </plex-button>
             </div>
-            <div>
-                <b>Profesional</b>
-                <p class="texto-detalle" *ngIf="recetaPrincipal.estadoActual.profesional">
-                    {{recetaPrincipal.estadoActual.profesional?.apellido}},
-                    {{recetaPrincipal.estadoActual.profesional?.nombre}}</p>
-                <p class="texto-detalle" *ngIf="!recetaPrincipal.estadoActual.profesional">- Sin profesional -</p>
+            <div class="mt-2" *ngIf="recetaPrincipal.estadosDispensa.length > 0">
+                <plex-table *ngIf="listadoDispensas.length" [columns]="columnsDetalleDispensa" #table="plTable" style="width:100%">
+                    <plex-table-columns>
+                    </plex-table-columns>
+                    <tr *ngFor="let estadoDispensa of listadoDispensas; let i = index">
+                        <td *plTableCol="'fecha'">
+                            {{ estadoDispensa.fecha | date: 'dd/MM/yyyy HH:mm' }}
+                        </td>
+                        <td *plTableCol="'sistema'">
+                            {{ estadoDispensa.sistema }}
+                        </td>
+                        <td *plTableCol="'organizacion'">
+                            {{ estadoDispensa.organizacion }}
+                        </td>
+                        <td *plTableCol="'tipo'">
+                            {{ estadoDispensa.tipo }}
+                        </td>
+                        <td *plTableCol="'estado'">
+                            <plex-badge *ngIf="estadoDispensa.dispensaDuplicada" size="sm" [type]="'warning'">
+                                dispensa duplicada
+                            </plex-badge>
+                            <plex-badge *ngIf="estadoDispensa.cancelada" size="sm" [type]="'danger'">
+                                dispensa cancelada {{(estadoDispensa.fechaCancelada | date: 'dd/MM/yyyy HH:mm')}}
+                            </plex-badge>
+                        </td>
+                    </tr>
+                </plex-table>
             </div>
-            <div>
-                <b>Motivo</b>
-                <p class="texto-detalle">{{recetaPrincipal.estadoActual.motivo || '- Sin especificar -'}}</p>
-            </div>
-            <div>
-                <b>Observación</b>
-                <p class="texto-detalle">{{recetaPrincipal.estadoActual.observacion || "- Sin especificar -"}}</p>
-            </div>
-        </div>
-    </div>
-
-    <div class="mt-4 mb-3">
-        <plex-title titulo="Historial de recetas" size="sm"></plex-title>
-    </div>
+        </plex-panel>
 
-    <div class="mt-4 mb-3 historial-recetas">
-        <plex-label *ngIf="!historialRecetas.length" size="sm" justify="center" icon="adi adi-listado-receta"
-                    titulo="No hay elementos registrados">
-        </plex-label>
-        <plex-table *ngIf="historialRecetas.length" [columns]="columns" #table="plTable">
-            <plex-table-columns>
-            </plex-table-columns>
-            <tr *ngFor="let receta of historialRecetas"
-                [ngClass]="{'suspendida': receta.estadoActual.tipo === 'suspendida'}">
-                <td *plTableCol="'fecha'">
-                    {{ receta.fechaRegistro | date:'dd/MM/yyyy HH:mm' }}
-                </td>
-                <td *plTableCol="'organizacion'">
-                    {{ receta.organizacion.nombre }}
-                </td>
-                <td *plTableCol="'profesional'">
-                    {{ receta.profesional.nombre }} {{ receta.profesional.apellido }}
-                </td>
-                <td *plTableCol="'diagnostico'">
-                    {{ receta.diagnostico.term || receta.diagnostico.descripcion }}
-                </td>
-                <td *plTableCol="'estado'">
-                    <div class="vista-badges">
-                        <plex-badge size="sm" [type]="estadoReceta[receta.estadoActual.tipo]">
-                            {{ receta.estadoActual.tipo }}
-                        </plex-badge>
-                        <plex-badge size="sm" [type]="estadoDispensa[receta.estadoDispensaActual.tipo]">
-                            {{ receta.estadoDispensaActual.tipo.replace('-', ' ') }}
-                        </plex-badge>
+        <plex-panel class="lista-panel" *ngIf="recetaPrincipal.estadoActual.tipo === 'suspendida'" #panelSuspension>
+            <div plex-accordion-title>
+                <div class="titulo">Motivo de suspensión</div>
+                <plex-button disabled type="info" size="sm" [icon]="panelSuspension.active ? 'chevron-up' : 'chevron-down'" class="float-right">
+                </plex-button>
+            </div>
+            <div class="info-solicitud suspendida mt-4">
+                <div class="data">
+                    <div>
+                        <b>Fecha</b>
+                        <p class="texto-detalle">{{recetaPrincipal.estadoActual.createdAt | date:'dd/MM/yyyy HH:mm'}}</p>
                     </div>
-                </td>
-            </tr>
-        </plex-table>
-    </div>
-</div>
\ No newline at end of file
+                    <div>
+                        <b>Profesional</b>
+                        <p class="texto-detalle" *ngIf="recetaPrincipal.estadoActual.profesional">
+                            {{recetaPrincipal.estadoActual.profesional?.apellido}},
+                            {{recetaPrincipal.estadoActual.profesional?.nombre}}</p>
+                        <p class="texto-detalle" *ngIf="!recetaPrincipal.estadoActual.profesional">- Sin profesional -</p>
+                    </div>
+                    <div>
+                        <b>Motivo</b>
+                        <p class="texto-detalle">{{recetaPrincipal.estadoActual.motivo || '- Sin especificar -'}}</p>
+                    </div>
+                    <div>
+                        <b>Observación</b>
+                        <p class="texto-detalle">{{recetaPrincipal.estadoActual.observacion || "- Sin especificar -"}}</p>
+                    </div>
+                </div>
+            </div>
+        </plex-panel>
+    </plex-accordion>
+</div>
diff --git a/src/app/modules/rup/components/huds/vistaReceta.scss b/src/app/modules/rup/components/huds/vistaReceta.scss
index e6795ae3bc..295b34fec1 100644
--- a/src/app/modules/rup/components/huds/vistaReceta.scss
+++ b/src/app/modules/rup/components/huds/vistaReceta.scss
@@ -92,6 +92,30 @@
     .detalle-dispensa {
         margin-right: 1;
     }
+
+    plex-panel.lista-panel {
+        display: block;
+        margin-bottom: 0.2rem;
+        cursor: pointer;
+        overflow: hidden;
+        transition: transform 0.2s ease, box-shadow 0.2s ease;
+
+        .titulo {
+            font-size: 1rem;
+            color: $recetas;
+            letter-spacing: 0.5px;
+            display: flex;
+            align-items: center;
+        }
+
+        &[active="true"] {
+            border-left: 5px solid $recetas;
+
+            .titulo {
+                font-weight: 700;
+            }
+        }
+    }
 }
 
 .historial-recetas {
diff --git a/src/app/modules/rup/components/huds/vistaReceta.ts b/src/app/modules/rup/components/huds/vistaReceta.ts
index cc800b467f..008d23fb05 100644
--- a/src/app/modules/rup/components/huds/vistaReceta.ts
+++ b/src/app/modules/rup/components/huds/vistaReceta.ts
@@ -3,6 +3,7 @@ import { IPaciente } from '../../../../core/mpi/interfaces/IPaciente';
 import { HUDSService } from '../../services/huds.service';
 import { RecetaService } from 'src/app/services/receta.service';
 import { OrganizacionService } from 'src/app/services/organizacion.service';
+import * as moment from 'moment';
 
 @Component({
     selector: 'vista-receta',
@@ -106,7 +107,7 @@ export class VistaRecetaComponent implements OnInit {
     ) { }
 
     ngOnInit() {
-        this.recetaPrincipal = this.registro.recetas.length>1?this.recetaService.getRecetaPrincipal(this.registro.recetas): this.registro.recetas[0];
+        this.recetaPrincipal = this.registro.recetas.length > 1 ? this.recetaService.getRecetaPrincipal(this.registro.recetas) : this.registro.recetas[0];
         this.combinarDispensas();
         this.historialRecetas = this.registro.recetas.filter(receta => receta.id !== this.recetaPrincipal.id && receta.fechaRegistro <= this.recetaPrincipal.fechaRegistro && receta.estadoActual?.tipo !== 'eliminada');
     }
@@ -143,4 +144,19 @@ export class VistaRecetaComponent implements OnInit {
         return this.listadoDispensas.shift();
     }
 
+    checkDispensaAnticipada(receta) {
+        if (receta.estadoDispensaActual && receta.estadoDispensaActual.fecha) {
+            const fechaDispensa = moment(receta.estadoDispensaActual.fecha);
+            const fechaRegistro = moment(receta.fechaRegistro);
+            if (fechaDispensa.isBefore(fechaRegistro)) {
+                if (receta.estadoActual.tipo === 'finalizada') {
+                    return 'dispensa anticipada';
+                } else if (receta.estadoActual.tipo === 'pendiente') {
+                    return 'dispensa parcial anticipada';
+                }
+            }
+        }
+        return null;
+    }
+
 }