diff --git a/apps/web/src/routes/(dashboard)/recursos-humanos/funcionarios/relatorios/+page.svelte b/apps/web/src/routes/(dashboard)/recursos-humanos/funcionarios/relatorios/+page.svelte index 122e1b1..12d2799 100644 --- a/apps/web/src/routes/(dashboard)/recursos-humanos/funcionarios/relatorios/+page.svelte +++ b/apps/web/src/routes/(dashboard)/recursos-humanos/funcionarios/relatorios/+page.svelte @@ -1,367 +1,590 @@ -
- -
- -
+
+ +
+ +
- -
-
- - - -
-
-

Relatórios de Funcionários

-

Análise de distribuição de salários e funcionários por símbolo

-
-
+ +
+
+ + + +
+
+

Relatórios de Funcionários

+

+ Análise de distribuição de salários e funcionários por símbolo +

+
+
- {#if notice} -
- - - - {notice.text} -
- {/if} + {#if notice} +
+ + + + {notice.text} +
+ {/if} - {#if isLoading} -
- -
- {:else} -
- -
-
-
-
- - - -
-
-

Distribuição de Salários por Símbolo

-

Valores dos símbolos cadastrados no sistema

-
-
-
- - {#if rows.length === 0} - Sem dados - {:else} - {@const max = getMax(rows, (r) => r.valor)} + {#if isLoading} +
+ +
+ {:else} +
+ +
+
+
+
+ + + +
+
+

+ Distribuição de Salários por Símbolo +

+

+ Valores dos símbolos cadastrados no sistema +

+
+
+
+ + {#if rows.length === 0} + Sem dados + {:else} + {@const max = getMax(rows, (r) => r.valor)} - - {#each [0,1,2,3,4,5] as t} - {@const val = Math.round((max/5) * t)} - {@const y = chartHeight - padding.bottom - scaleY(val, max)} - - {`R$ ${val.toLocaleString('pt-BR')}`} - {/each} + + {#each [0, 1, 2, 3, 4, 5] as t (t)} + {@const val = Math.round((max / 5) * t)} + {@const y = chartHeight - padding.bottom - scaleY(val, max)} + + {`R$ ${val.toLocaleString('pt-BR')}`} + {/each} - - - + + + - - r.valor, max)} - fill="url(#gradient-salary)" - opacity="0.7" - /> + + r.valor, max)} + fill="url(#gradient-salary)" + opacity="0.7" + /> - - { - const x = getX(i, rows.length); - const y = chartHeight - padding.bottom - scaleY(r.valor, max); - return `${x},${y}`; - }).join(' ')} - fill="none" - stroke="rgb(59, 130, 246)" - stroke-width="3" - /> + + { + const x = getX(i, rows.length); + const y = chartHeight - padding.bottom - scaleY(r.valor, max); + return `${x},${y}`; + }) + .join(' ')} + fill="none" + stroke="rgb(59, 130, 246)" + stroke-width="3" + /> - - {#each rows as r, i} - {@const x = getX(i, rows.length)} - {@const y = chartHeight - padding.bottom - scaleY(r.valor, max)} - - - {`R$ ${r.valor.toLocaleString('pt-BR', { minimumFractionDigits: 2 })}`} - - {/each} + + {#each rows as r, i (r._id)} + {@const x = getX(i, rows.length)} + {@const y = chartHeight - padding.bottom - scaleY(r.valor, max)} + + + {`R$ ${r.valor.toLocaleString('pt-BR', { minimumFractionDigits: 2 })}`} + + {/each} - - {#each rows as r, i} - {@const x = getX(i, rows.length)} - -
- - {r.nome} - -
- - {/each} + + {#each rows as r, i (r._id)} + {@const x = getX(i, rows.length)} + +
+ + {r.nome} + +
+ + {/each} - - - - - - - - {/if} - -
-
-
+ + + + + + + + {/if} + +
+
+
- -
-
-
-
- - - -
-
-

Distribuição de Funcionários por Símbolo

-

Quantidade de funcionários alocados em cada símbolo

-
-
-
- - {#if rows.length === 0} - Sem dados - {:else} - {@const maxC = getMax(rows, (r) => r.count)} + +
+
+
+
+ + + +
+
+

+ Distribuição de Funcionários por Símbolo +

+

+ Quantidade de funcionários alocados em cada símbolo +

+
+
+
+ + {#if rows.length === 0} + Sem dados + {:else} + {@const maxC = getMax(rows, (r) => r.count)} - - {#each [0,1,2,3,4,5] as t} - {@const val = Math.round((maxC/5) * t)} - {@const y = chartHeight - padding.bottom - scaleY(val, Math.max(1, maxC))} - - {val} - {/each} + + {#each [0, 1, 2, 3, 4, 5] as t (t)} + {@const val = Math.round((maxC / 5) * t)} + {@const y = chartHeight - padding.bottom - scaleY(val, Math.max(1, maxC))} + + {val} + {/each} - - - + + + - - r.count, Math.max(1, maxC))} - fill="url(#gradient-count)" - opacity="0.7" - /> + + r.count, Math.max(1, maxC))} + fill="url(#gradient-count)" + opacity="0.7" + /> - - { - const x = getX(i, rows.length); - const y = chartHeight - padding.bottom - scaleY(r.count, Math.max(1, maxC)); - return `${x},${y}`; - }).join(' ')} - fill="none" - stroke="rgb(236, 72, 153)" - stroke-width="3" - /> + + { + const x = getX(i, rows.length); + const y = chartHeight - padding.bottom - scaleY(r.count, Math.max(1, maxC)); + return `${x},${y}`; + }) + .join(' ')} + fill="none" + stroke="rgb(236, 72, 153)" + stroke-width="3" + /> - - {#each rows as r, i} - {@const x = getX(i, rows.length)} - {@const y = chartHeight - padding.bottom - scaleY(r.count, Math.max(1, maxC))} - - - {r.count} - - {/each} + + {#each rows as r, i (r._id)} + {@const x = getX(i, rows.length)} + {@const y = chartHeight - padding.bottom - scaleY(r.count, Math.max(1, maxC))} + + + {r.count} + + {/each} - - {#each rows as r, i} - {@const x = getX(i, rows.length)} - -
- - {r.nome} - -
- - {/each} + + {#each rows as r, i (r._id)} + {@const x = getX(i, rows.length)} + +
+ + {r.nome} + +
+ + {/each} - - - - - - - - {/if} - -
-
-
+ + + + + + + + {/if} + +
+
+
- -
-
-
-
- - - -
-
-

Tabela Resumo - Símbolos e Funcionários

-

Visão detalhada dos dados apresentados nos gráficos

-
-
+ +
+
+
+
+ + + +
+
+

+ Tabela Resumo - Símbolos e Funcionários +

+

+ Visão detalhada dos dados apresentados nos gráficos +

+
+
-
- - - - - - - - - - - {#if rows.length === 0} - - - - {:else} - {#each rows as row} - - - - - - - {/each} - - - - - - - - {/if} - -
SímboloValor (R$)FuncionáriosTotal (R$)
Nenhum dado disponível
{row.nome} - {row.valor.toLocaleString('pt-BR', { minimumFractionDigits: 2, maximumFractionDigits: 2 })} - - {row.count} - - {(row.valor * row.count).toLocaleString('pt-BR', { minimumFractionDigits: 2, maximumFractionDigits: 2 })} -
TOTAL GERAL - {rows.reduce((sum, r) => sum + r.valor, 0).toLocaleString('pt-BR', { minimumFractionDigits: 2, maximumFractionDigits: 2 })} - - {rows.reduce((sum, r) => sum + r.count, 0)} - - {rows.reduce((sum, r) => sum + (r.valor * r.count), 0).toLocaleString('pt-BR', { minimumFractionDigits: 2, maximumFractionDigits: 2 })} -
-
-
-
-
- {/if} +
+ + + + + + + + + + + {#if rows.length === 0} + + + + {:else} + {#each rows as row (row._id)} + + + + + + + {/each} + + + + + + + + {/if} + +
SímboloValor (R$)FuncionáriosTotal (R$)
Nenhum dado disponível
{row.nome} + {row.valor.toLocaleString('pt-BR', { + minimumFractionDigits: 2, + maximumFractionDigits: 2 + })} + + {row.count} + + {(row.valor * row.count).toLocaleString('pt-BR', { + minimumFractionDigits: 2, + maximumFractionDigits: 2 + })} +
TOTAL GERAL + {rows + .reduce((sum, r) => sum + r.valor, 0) + .toLocaleString('pt-BR', { + minimumFractionDigits: 2, + maximumFractionDigits: 2 + })} + + {rows.reduce((sum, r) => sum + r.count, 0)} + + {rows + .reduce((sum, r) => sum + r.valor * r.count, 0) + .toLocaleString('pt-BR', { + minimumFractionDigits: 2, + maximumFractionDigits: 2 + })} +
+
+
+
+
+ {/if}