+
+
| Seleccionar |
@@ -162,8 +169,11 @@
| Tags |
- {{ tag }}
- Sin tags
+
+ {{ tag }}
+
+ Sin tags
|
@@ -172,7 +182,6 @@
Seleccione método de deploy
diff --git a/ogWebconsole/src/app/components/groups/components/client-main-view/deploy-image/deploy-image.component.ts b/ogWebconsole/src/app/components/groups/components/client-main-view/deploy-image/deploy-image.component.ts
index 707e9e9..54265c6 100644
--- a/ogWebconsole/src/app/components/groups/components/client-main-view/deploy-image/deploy-image.component.ts
+++ b/ogWebconsole/src/app/components/groups/components/client-main-view/deploy-image/deploy-image.component.ts
@@ -109,6 +109,9 @@ export class DeployImageComponent implements OnInit{
selectedCommit: any = null;
private initialGitLoad = true;
+ showOnlyTagged: boolean = false;
+ filteredCommits: any[] = [];
+
constructor(
private http: HttpClient,
private toastService: ToastrService,
@@ -387,7 +390,7 @@ export class DeployImageComponent implements OnInit{
}
if (this.imageType === 'git') {
- if (!this.selectedCommit) {
+ if (!this.selectedCommit || this.filteredCommits.length === 0) {
return false;
}
}
@@ -519,7 +522,9 @@ export class DeployImageComponent implements OnInit{
this.selectedBranch = '';
this.branches = [];
this.commits = [];
+ this.filteredCommits = [];
this.selectedCommit = null;
+ this.showOnlyTagged = false;
this.loadGitBranches();
}
@@ -545,6 +550,8 @@ export class DeployImageComponent implements OnInit{
onGitBranchChange() {
this.selectedCommit = null;
this.commits = [];
+ this.filteredCommits = [];
+ this.showOnlyTagged = false;
this.loadGitCommits();
}
@@ -558,6 +565,12 @@ export class DeployImageComponent implements OnInit{
data => {
this.commits = data.commits || [];
this.loadingCommits = false;
+ this.filterCommits();
+ if (this.filteredCommits.length > 0) {
+ this.selectedCommit = this.filteredCommits.reduce((a, b) =>
+ new Date(a.committed_date * 1000) > new Date(b.committed_date * 1000) ? a : b
+ );
+ }
},
error => {
this.toastService.error('Error al cargar los commits');
@@ -565,4 +578,23 @@ export class DeployImageComponent implements OnInit{
}
);
}
+
+ filterCommits() {
+ if (this.showOnlyTagged) {
+ this.filteredCommits = this.commits.filter(commit =>
+ commit.tags && commit.tags.length > 0
+ );
+ } else {
+ this.filteredCommits = this.commits;
+ }
+ }
+
+ onTagFilterChange() {
+ this.filterCommits();
+ if (this.filteredCommits.length > 0 && !this.filteredCommits.includes(this.selectedCommit)) {
+ this.selectedCommit = this.filteredCommits.reduce((a, b) =>
+ new Date(a.committed_date * 1000) > new Date(b.committed_date * 1000) ? a : b
+ );
+ }
+ }
}
diff --git a/ogWebconsole/src/app/components/groups/components/client-main-view/partition-assistant/partition-assistant.component.css b/ogWebconsole/src/app/components/groups/components/client-main-view/partition-assistant/partition-assistant.component.css
index baaa2b0..87ee533 100644
--- a/ogWebconsole/src/app/components/groups/components/client-main-view/partition-assistant/partition-assistant.component.css
+++ b/ogWebconsole/src/app/components/groups/components/client-main-view/partition-assistant/partition-assistant.component.css
@@ -709,6 +709,454 @@
margin: 5px 0 !important;
}
+/* ===== LAYOUT PRINCIPAL ===== */
+.partition-layout {
+ display: flex;
+ flex-direction: column;
+ gap: 24px;
+ margin-top: 20px;
+}
+
+/* ===== BARRA DE PROGRESO DE PARTICIONES ===== */
+.partition-progress-container {
+ background: white;
+ border-radius: 12px;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+ border: 1px solid #e0e0e0;
+ padding: 24px;
+ margin-bottom: 20px;
+}
+
+.progress-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 20px;
+ flex-wrap: wrap;
+ gap: 16px;
+}
+
+.progress-header h3 {
+ margin: 0;
+ color: #333;
+ font-size: 18px;
+ font-weight: 600;
+}
+
+.disk-info-summary {
+ display: flex;
+ gap: 16px;
+ flex-wrap: wrap;
+}
+
+.disk-info-summary span {
+ padding: 6px 12px;
+ border-radius: 6px;
+ font-size: 14px;
+ font-weight: 500;
+}
+
+.total-size {
+ background: #e3f2fd;
+ color: #1976d2;
+}
+
+.used-size {
+ background: #fff3e0;
+ color: #f57c00;
+}
+
+.free-size {
+ background: #e8f5e8;
+ color: #388e3c;
+}
+
+.partition-progress-bar {
+ margin-bottom: 20px;
+}
+
+.progress-segments {
+ display: flex;
+ height: 60px;
+ border-radius: 8px;
+ overflow: hidden;
+ border: 2px solid #e0e0e0;
+ background: #f5f5f5;
+}
+
+.progress-segment {
+ position: relative;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ min-width: 20px;
+ transition: all 0.3s ease;
+ cursor: pointer;
+ border-right: 1px solid rgba(255, 255, 255, 0.3);
+ box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2);
+}
+
+.progress-segment:hover {
+ filter: brightness(1.2);
+ transform: scale(1.02);
+ box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.4), 0 2px 8px rgba(0, 0, 0, 0.2);
+ z-index: 2;
+}
+
+.progress-segment:last-child {
+ border-right: none;
+}
+
+.progress-segment.removed {
+ opacity: 0.3;
+ background: #ccc !important;
+}
+
+.progress-segment.free-space {
+ background: linear-gradient(45deg, #e8f5e8, #c8e6c9);
+ border-left: 1px solid #e0e0e0;
+}
+
+.segment-label {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ text-align: center;
+ color: white;
+ font-weight: 600;
+ font-size: 12px;
+ text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
+ width: 100%;
+ height: 100%;
+}
+
+.partition-number {
+ font-size: 14px;
+ font-weight: bold;
+}
+
+.partition-percentage {
+ font-size: 10px;
+ opacity: 0.9;
+}
+
+.free-label {
+ font-size: 12px;
+ font-weight: bold;
+}
+
+.free-percentage {
+ font-size: 10px;
+ opacity: 0.9;
+}
+
+/* ===== LEYENDA DE PARTICIONES ===== */
+.partition-legend {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 12px;
+ padding: 20px;
+ background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
+ border-radius: 12px;
+ border: 1px solid #e9ecef;
+ box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+
+.legend-item {
+ display: flex;
+ align-items: center;
+ gap: 10px;
+ padding: 10px 16px;
+ background: white;
+ border-radius: 8px;
+ border: 1px solid #e0e0e0;
+ font-size: 14px;
+ transition: all 0.3s ease;
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+}
+
+.legend-item:hover {
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+ transform: translateY(-1px);
+}
+
+.legend-item.removed {
+ opacity: 0.5;
+ text-decoration: line-through;
+}
+
+.legend-color {
+ width: 18px;
+ height: 18px;
+ border-radius: 4px;
+ border: 2px solid rgba(255, 255, 255, 0.8);
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+ transition: all 0.2s ease;
+}
+
+.legend-item:hover .legend-color {
+ transform: scale(1.1);
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+}
+
+.legend-color.free-color {
+ background: linear-gradient(45deg, #e8f5e8, #c8e6c9);
+}
+
+.legend-text {
+ font-weight: 600;
+ color: #333;
+ font-size: 14px;
+}
+
+.legend-size {
+ font-size: 12px;
+ color: #666;
+ font-weight: 500;
+ background: #f8f9fa;
+ padding: 2px 6px;
+ border-radius: 4px;
+ border: 1px solid #e9ecef;
+}
+
+/* ===== TABLA MAT-TABLE ===== */
+.table-container {
+ background: white;
+ border-radius: 12px;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+ border: 1px solid #e0e0e0;
+ overflow: hidden;
+}
+
+.table-header {
+ padding: 20px 24px 16px 24px;
+ border-bottom: 1px solid #e0e0e0;
+ background: #f8f9fa;
+}
+
+.table-header h3 {
+ margin: 0;
+ color: #333;
+ font-size: 18px;
+ font-weight: 600;
+}
+
+.partition-mat-table {
+ width: 100%;
+ background: white;
+}
+
+.partition-mat-table .mat-header-cell {
+ background: #f8f9fa;
+ color: #495057;
+ font-weight: 600;
+ font-size: 14px;
+ padding: 16px 12px;
+ border-bottom: 2px solid #e9ecef;
+}
+
+.partition-mat-table .mat-cell {
+ padding: 12px;
+ border-bottom: 1px solid #f1f3f4;
+ vertical-align: middle;
+}
+
+.partition-mat-table .mat-row:hover {
+ background: #f8f9fa;
+}
+
+/* Campos compactos para la tabla */
+.compact-form-field {
+ width: 100%;
+ margin: 0;
+}
+
+.compact-form-field .mat-form-field-wrapper {
+ padding-bottom: 0;
+ margin: 0;
+}
+
+.compact-form-field .mat-form-field-infix {
+ padding: 2px 0;
+ min-height: 20px;
+ font-size: 13px;
+}
+
+.compact-form-field .mat-form-field-outline {
+ border-radius: 4px;
+}
+
+.compact-form-field .mat-form-field-outline-start,
+.compact-form-field .mat-form-field-outline-end {
+ border-width: 1px;
+}
+
+.compact-form-field .mat-form-field-outline-gap {
+ border-width: 1px;
+}
+
+/* Estilos para inputs y selects compactos */
+.compact-form-field input,
+.compact-form-field .mat-select {
+ line-height: 1.2;
+}
+
+.compact-form-field .mat-select-value {
+ color: #333;
+}
+
+/* Reducir el padding de las celdas de la tabla */
+.partition-mat-table .mat-cell {
+ padding: 6px 6px;
+ vertical-align: middle;
+}
+
+.partition-mat-table .mat-header-cell {
+ padding: 10px 6px;
+}
+
+/* Hacer los inputs más pequeños */
+.compact-form-field .mat-form-field-infix {
+ padding: 2px 0;
+ min-height: 20px;
+}
+
+/* Ajustar el tamaño de los selects */
+.compact-form-field .mat-select-trigger {
+ height: 20px;
+}
+
+/* Ajustar el tamaño de los inputs numéricos */
+.compact-form-field input[type="number"] {
+ padding: 2px 6px;
+}
+
+/* Reducir el espacio del wrapper del form field */
+.compact-form-field .mat-form-field-wrapper {
+ padding-bottom: 0;
+ margin: 0;
+ line-height: 1.2;
+}
+
+/* Ajustar el espacio del outline */
+.compact-form-field .mat-form-field-outline {
+ top: 0;
+ bottom: 0;
+}
+
+.compact-form-field .mat-form-field-outline-start,
+.compact-form-field .mat-form-field-outline-end,
+.compact-form-field .mat-form-field-outline-gap {
+ border-width: 1px;
+}
+
+/* Checkbox en la tabla */
+.partition-mat-table .mat-checkbox {
+ margin: 0;
+}
+
+/* Botón de eliminar */
+.partition-mat-table .mat-icon-button {
+ width: 32px;
+ height: 32px;
+ line-height: 32px;
+}
+
+.partition-mat-table .mat-icon {
+ font-size: 18px;
+ width: 18px;
+ height: 18px;
+}
+
+/* ===== RESPONSIVE ===== */
+@media (max-width: 768px) {
+ .partition-layout {
+ gap: 16px;
+ }
+
+ .progress-header {
+ flex-direction: column;
+ align-items: flex-start;
+ }
+
+ .disk-info-summary {
+ width: 100%;
+ justify-content: space-between;
+ }
+
+ .partition-legend {
+ flex-direction: column;
+ gap: 8px;
+ }
+
+ .legend-item {
+ justify-content: space-between;
+ }
+
+ .partition-mat-table {
+ font-size: 12px;
+ }
+
+ .compact-form-field {
+ font-size: 12px;
+ }
+}
+
+@media (max-width: 480px) {
+ .progress-segments {
+ height: 40px;
+ }
+
+ .segment-label {
+ font-size: 10px;
+ }
+
+ .partition-number {
+ font-size: 12px;
+ }
+
+ .partition-percentage {
+ font-size: 8px;
+ }
+
+ .partition-mat-table .mat-header-cell,
+ .partition-mat-table .mat-cell {
+ padding: 8px 6px;
+ }
+}
+
+/* ===== ANIMACIONES ===== */
+.progress-segment {
+ animation: slideIn 0.3s ease-out;
+}
+
+@keyframes slideIn {
+ from {
+ opacity: 0;
+ transform: scaleX(0);
+ }
+ to {
+ opacity: 1;
+ transform: scaleX(1);
+ }
+}
+
+.legend-item {
+ animation: fadeIn 0.3s ease-out;
+}
+
+@keyframes fadeIn {
+ from {
+ opacity: 0;
+ transform: translateY(10px);
+ }
+ to {
+ opacity: 1;
+ transform: translateY(0);
+ }
+}
+
/* ===== ESTADOS DE ADVERTENCIA ===== */
/* Advertencia (90% a 99% usado) */
.warning {
@@ -847,3 +1295,4 @@
+
diff --git a/ogWebconsole/src/app/components/groups/components/client-main-view/partition-assistant/partition-assistant.component.html b/ogWebconsole/src/app/components/groups/components/client-main-view/partition-assistant/partition-assistant.component.html
index 4624d67..eadd905 100644
--- a/ogWebconsole/src/app/components/groups/components/client-main-view/partition-assistant/partition-assistant.component.html
+++ b/ogWebconsole/src/app/components/groups/components/client-main-view/partition-assistant/partition-assistant.component.html
@@ -256,18 +256,21 @@