EduardoDev
/
line-gestao-frontend
mirror of https://github.com/eduardolopesx03/line-gestao-frontend.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge 3df7a41518 into 864ec5baf0

This commit is contained in:
Eduardo Lopes 2026-01-22 20:26:31 -03:00 committed by GitHub
parent 864ec5baf0 3df7a41518
commit 8e4507b34a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 37 additions and 86 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

93
src/app/pages/faturamento/faturamento.html
View File

@ -338,7 +338,7 @@
<div *ngIf="detailOpen" #detailModal class="modal-card modal-xl-custom" (click)="$event.stopPropagation()">
<div class="modal-header">
<div class="modal-title">
<span class="icon-bg primary-soft"><i class="bi bi-receipt"></i></span>
<span class="icon-bg detail-icon"><i class="bi bi-receipt"></i></span>
Detalhes do Faturamento
</div>
<button class="btn btn-sm btn-icon" (click)="closeAllModals()"><i class="bi bi-x-lg"></i></button>
@ -347,24 +347,16 @@
<div class="modal-body modern-body bg-light-gray" *ngIf="detailData; else detailLoading">
<div class="mb-3 d-flex flex-wrap align-items-center justify-content-between gap-2">
<div class="d-flex flex-column">
<div class="fw-black" style="font-size: 1.05rem;">
<div class="fw-black detail-client">
{{ detailData.cliente || '—' }}
</div>
<small class="text-muted fw-bold">
ITEM: {{ detailData.item }} • QTD LINHAS: {{ detailData.qtdLinhas ?? 0 }}
</small>
</div>
<div class="d-flex flex-wrap gap-2">
<span class="badge-pill vivo"><i class="bi bi-telephone-fill me-1"></i> {{ formatMoney(detailData.valorContratoVivo) }}</span>
<span class="badge-pill line"><i class="bi bi-hdd-network-fill me-1"></i> {{ formatMoney(detailData.valorContratoLine) }}</span>
<span class="badge-pill lucro" *ngIf="hasLucro(detailData)">
<i class="bi bi-cash-stack me-1"></i> {{ formatMoney(detailData.lucro) }}
</span>
</div>
</div>
<div class="details-dashboard details-2col">
<div class="details-dashboard details-single">
<!-- IDENTIFICAÇÃO -->
<div class="detail-box">
@ -400,76 +392,15 @@
</div>
</div>
</div>
</div>
<!-- VIVO -->
<div class="detail-box">
<div class="box-header justify-content-center">
<span><i class="bi bi-telephone-fill me-2"></i> Vivo</span>
</div>
<div class="box-body">
<div class="info-grid">
<div class="info-item">
<span class="lbl">Franquia Vivo</span>
<span class="val fw-black">{{ formatFranquia(detailData.franquiaVivo) }}</span>
</div>
<div class="info-item">
<span class="lbl text-vivo">Valor Vivo (R$)</span>
<span class="val fw-black text-vivo">{{ formatMoney(detailData.valorContratoVivo) }}</span>
</div>
</div>
</div>
</div>
<!-- LINE -->
<div class="detail-box">
<div class="box-header justify-content-center">
<span><i class="bi bi-hdd-network-fill me-2"></i> Line Móvel</span>
</div>
<div class="box-body">
<div class="info-grid">
<div class="info-item">
<span class="lbl">Franquia Line</span>
<span class="val fw-black">{{ formatFranquia(detailData.franquiaLine) }}</span>
</div>
<div class="info-item">
<span class="lbl text-line">Valor Line (R$)</span>
<span class="val fw-black text-line">{{ formatMoney(detailData.valorContratoLine) }}</span>
</div>
<div class="info-item span-2">
<span class="lbl text-brand">Lucro</span>
<span class="val fw-black text-brand">{{ formatMoney(detailData.lucro) }}</span>
</div>
</div>
</div>
</div>
<!-- RESUMO -->
<div class="detail-box">
<div class="box-header justify-content-center">
<span><i class="bi bi-info-circle me-2"></i> Resumo</span>
</div>
<div class="box-body">
<div class="info-grid">
<div class="info-item span-2">
<span class="lbl">Observação</span>
<span class="val">{{ getObservacao(detailData) }}</span>
</div>
</div>
<div class="mt-3 d-flex justify-content-end gap-2 flex-wrap">
<button class="btn btn-outline-secondary btn-sm" (click)="closeAllModals()">
Fechar
</button>
<button class="btn btn-primary btn-sm" (click)="onComparativo(detailData)">
<i class="bi bi-columns-gap me-1"></i> Abrir Comparativo
</button>
</div>
</div>
</div>
<div class="mt-4 d-flex justify-content-end gap-2 flex-wrap">
<button class="btn btn-outline-secondary btn-sm" (click)="closeAllModals()">
Fechar
</button>
<button class="btn btn-primary btn-sm" (click)="onComparativo(detailData)">
<i class="bi bi-columns-gap me-1"></i> Abrir Comparativo
</button>
</div>
</div>
@ -482,7 +413,7 @@
<div *ngIf="compareOpen" #compareModal class="modal-card modal-lg" (click)="$event.stopPropagation()">
<div class="modal-header">
<div class="modal-title">
<span class="icon-bg success"><i class="bi bi-columns-gap"></i></span> Comparativo Vivo x Line
<span class="icon-bg compare-icon"><i class="bi bi-columns-gap"></i></span> Comparativo Vivo x Line
</div>
<button class="btn btn-sm btn-icon" (click)="closeAllModals()"><i class="bi bi-x-lg"></i></button>
</div>

30
src/app/pages/faturamento/faturamento.scss
View File

@ -781,14 +781,16 @@
}
.icon-bg {
width: 32px;
height: 32px;
border-radius: 10px;
background: rgba(3, 15, 170, 0.1);
width: 34px;
height: 34px;
border-radius: 12px;
background: rgba(3, 15, 170, 0.12);
color: var(--blue);
display: flex;
align-items: center;
justify-content: center;
box-shadow: inset 0 0 0 1px rgba(255,255,255,0.7), 0 8px 18px rgba(3, 15, 170, 0.18);
font-size: 1rem;
&.success { background: var(--success-bg); color: var(--success-text); }
&.primary-soft { background: rgba(3, 15, 170, 0.1); color: var(--blue); }
@ -811,6 +813,12 @@
}
.details-2col { grid-template-columns: 1fr 1fr; @media (max-width: 900px) { grid-template-columns: 1fr; } }
.details-single { grid-template-columns: minmax(0, 1fr); }
.detail-client {
font-size: 1.05rem;
letter-spacing: -0.01em;
}
.detail-box {
background: #fff;
@ -820,10 +828,22 @@
overflow: hidden;
}
.icon-bg.detail-icon {
background: linear-gradient(135deg, rgba(67, 56, 202, 0.18), rgba(14, 165, 233, 0.16));
color: #1d4ed8;
box-shadow: inset 0 0 0 1px rgba(255,255,255,0.7), 0 10px 22px rgba(29, 78, 216, 0.2);
}
.icon-bg.compare-icon {
background: linear-gradient(135deg, rgba(16, 185, 129, 0.22), rgba(59, 130, 246, 0.2));
color: #0f766e;
box-shadow: inset 0 0 0 1px rgba(255,255,255,0.7), 0 10px 24px rgba(16, 185, 129, 0.25);
}
.box-header.justify-content-center {
justify-content: center !important;
text-align: center;
background: rgba(227, 61, 207, 0.04);
background: linear-gradient(135deg, rgba(227, 61, 207, 0.08), rgba(59, 130, 246, 0.08));
color: var(--brand);
padding: 8px;