@nixweb/nixloc-ui 1.16.0 → 1.17.0

package/src/components/modules/finance/dre/DataCrossTable.vue

@@ -1,448 +0,0 @@
-<template>
-    <div>
-        <Zoom>
-            <div class="title-main">Relatório de Desempenho Financeiro</div>
-            <div class="table-responsive">
-                <table class="custom-table">
-                    <thead>
-                        <tr>
-                            <th v-if="mostrarCentroDeCusto">Centro de Custo</th>
-                            <th v-if="mostrarPlanoDeConta">Plano de Conta</th>
-                            <th v-for="col in colunasSelecionadas" :key="col"
-                                v-if="!anoSelecionado || col.endsWith('/' + anoSelecionado)">
-                                {{ col }}
-                            </th>
-                            <th class="color-total">
-                                <span class="title-total">Total</span>
-                            </th>
-                        </tr>
-                    </thead>
-
-                    <tbody>
-                        <tr v-for="(linha, index) in linhasFiltradas" :key="index">
-                            <td v-if="mostrarCentroDeCusto">{{ linha.centroDeCusto }}</td>
-                            <td v-if="mostrarPlanoDeConta">{{ linha.planoDeConta }}</td>
-                            <td v-for="col in colunasSelecionadas" :key="col"
-                                v-if="!anoSelecionado || col.endsWith('/' + anoSelecionado)">
-                                <span @click="openDetails(linha, col)" class="row-link"
-                                    :class="classeValor(linha.valores[col])">
-                                    {{ formatarMoeda(linha.valores[col] || 0) }}
-                                </span>
-                            </td>
-                            <td class="color-total">
-                                <span class="title-total" :class="classeValor(linha.total)">
-                                    {{ formatarMoeda(linha.total) }}
-                                </span>
-                            </td>
-                        </tr>
-                    </tbody>
-
-                    <tfoot>
-                        <tr>
-                            <td class="color-total" v-if="mostrarCentroDeCusto || mostrarPlanoDeConta"
-                                :colspan="(mostrarCentroDeCusto && mostrarPlanoDeConta) ? 2 : 1">
-                                Total
-                            </td>
-                            <td class="color-total" v-for="col in colunasSelecionadas" :key="col"
-                                v-if="!anoSelecionado || col.endsWith('/' + anoSelecionado)">
-                                <span :class="classeValor(totalPorColuna[col])">
-                                    {{ formatarMoeda(totalPorColuna[col] || 0) }}
-                                </span>
-                            </td>
-                            <td class="color-total">
-                                <span class="title-total " :class="classeValor(totalGeral)">
-                                    {{ formatarMoeda(totalGeral) }}
-                                </span>
-                            </td>
-                        </tr>
-
-                        <tr v-if="mostrarTotalPorAno" v-for="ano in anosSelecionados" :key="'ano-' + ano">
-                            <td class="color-total" v-if="ano == anoSelecionado || anoSelecionado == ''"
-                                :colspan="(mostrarCentroDeCusto && mostrarPlanoDeConta) ? 2 : 1">
-                                <span class="title-total"> Resultado {{ ano }}</span>
-                            </td>
-                            <td class="color-total" v-if="ano == anoSelecionado || anoSelecionado == ''" :colspan="1">
-                                <span class="title-total" :class="classeValor(totalPorAnoSeparado[ano] || 0)">
-                                    {{ formatarMoeda(totalPorAnoSeparado[ano] || 0) }}
-                                </span>
-                            </td>
-                        </tr>
-                    </tfoot>
-                </table>
-                <br>
-            </div>
-        </Zoom>
-        <Modal title="Configuração" :width="600" :height="750" v-if="showModal('config')">
-
-            <Molded>
-                <CheckboxSimple title="Agrupar por Centro de Custo" v-model="agruparPorCentroDeCusto" />
-            </Molded>
-            <br />
-
-            <Molded>
-                <b-row>
-                    <b-col sm="6">
-                        <CheckboxSimple title="Centro de Custo" v-model="mostrarCentroDeCusto" />
-                        <CheckboxSimple title="Plano de Conta" v-model="mostrarPlanoDeConta" />
-                        <CheckboxSimple title="Total por Ano" v-model="mostrarTotalPorAno" />
-                    </b-col>
-                    <b-col sm="6">
-                        <select v-model="anoSelecionado" class="select-modern">
-                            <option value="">Todos os anos</option>
-                            <option v-for="ano in anos" :key="ano" :value="ano">{{ ano }}</option>
-                        </select>
-                    </b-col>
-                </b-row>
-                <hr class="hr">
-
-                <ScrollBar :minHeight="200" :maxHeight="200">
-                    <CheckboxGroup :stacked="true" :options="colunasVisiveis" :initialValue="colunasSelecionadas"
-                        v-model="colunasSelecionadas" :clicked="ordenarPorMesAno" />
-                </ScrollBar>
-            </Molded>
-
-        </Modal>
-    </div>
-</template>
-
-<script>
-import CheckboxGroup from "@nixweb/nixloc-ui/src/component/forms/CheckboxGroup";
-import CheckboxSimple from "@nixweb/nixloc-ui/src/component/forms/CheckboxSimple";
-import Modal from "@nixweb/nixloc-ui/src/component/forms/Modal";
-import Molded from "@nixweb/nixloc-ui/src/component/layout/Molded";
-import ScrollBar from "@nixweb/nixloc-ui/src/component/layout/ScrollBar.vue";
-import Zoom from "@nixweb/nixloc-ui/src/component/layout/Zoom.vue";
-
-import { mapMutations, mapGetters } from "vuex";
-
-export default {
-    props: ['dadosAnos', 'dadosFinanceiros'],
-    components: {
-        CheckboxGroup,
-        CheckboxSimple,
-        Modal,
-        Molded,
-        ScrollBar,
-        Zoom
-    },
-    data() {
-        const meses = [
-            "Janeiro", "Fevereiro", "Março", "Abril", "Maio", "Junho",
-            "Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro"
-        ];
-        const anos = this.dadosAnos;
-        const colunasVisiveis = anos.flatMap(ano => meses.map(mes => `${mes}/${ano}`));
-        return {
-            mostrarCentroDeCusto: true,
-            mostrarPlanoDeConta: true,
-            mostrarTotalPorAno: true,
-            agruparPorCentroDeCusto: false,
-            anoSelecionado: "",
-            colunasSelecionadas: [],
-            anos,
-            colunasVisiveis,
-            ids: [],
-        };
-    },
-    computed: {
-        ...mapGetters("generic", ["event", "showModal"]),
-
-        linhasFiltradas() {
-            let dadosAgrupados = this.dadosFinanceiros;
-
-            if (this.agruparPorCentroDeCusto) {
-                const dadosAgrupadosPorCentro = {};
-
-                for (const linhaAtual of dadosAgrupados) {
-                    const nomeCentroDeCusto = linhaAtual.centroDeCusto;
-
-                    // Verifica se já existe esse centro de custo no agrupamento
-                    const grupoExistente = dadosAgrupadosPorCentro[nomeCentroDeCusto];
-
-                    if (!grupoExistente) {
-                        // Se não existe, adiciona essa linha como o primeiro registro do grupo
-                        dadosAgrupadosPorCentro[nomeCentroDeCusto] = {
-                            ...linhaAtual,
-                            valores: { ...linhaAtual.valores },
-                            total: linhaAtual.total,
-                            idsPorMes: { ...linhaAtual.idsPorMes }
-                        };
-                    } else {
-                        // Se já existe, atualiza o grupo somando os valores
-                        for (const colunaSelecionada of this.colunasSelecionadas) {
-                            const valorAtual = linhaAtual.valores[colunaSelecionada] || 0;
-                            grupoExistente.valores[colunaSelecionada] =
-                                (grupoExistente.valores[colunaSelecionada] || 0) + valorAtual;
-                        }
-
-                        // Soma o total geral do grupo
-                        grupoExistente.total += linhaAtual.total;
-
-
-
-                        // Para cada mês da linha atual
-                        for (const mes in linhaAtual.idsPorMes || {}) {
-
-                            const idsDaLinha = linhaAtual.idsPorMes[mes];
-
-                            // Garante que o mês já existe no grupo
-                            if (!grupoExistente.idsPorMes[mes]) {
-                                grupoExistente.idsPorMes[mes] = [];
-                            }
-
-                            // Adiciona apenas os IDs que ainda não estão no grupo
-                            const idsDoGrupo = grupoExistente.idsPorMes[mes];
-
-                            for (const id of idsDaLinha) {
-                                if (!idsDoGrupo.includes(id)) {
-                                    idsDoGrupo.push(id);
-                                }
-                            }
-                        }
-                    }
-                }
-
-                // Converte o objeto final para array para exibição no relatório
-                dadosAgrupados = Object.values(dadosAgrupadosPorCentro);
-            }
-
-
-
-            return dadosAgrupados.map(linha => {
-                const valoresFiltrados = {};
-                let total = 0;
-                for (const col of this.colunasSelecionadas) {
-                    if (!this.anoSelecionado || col.endsWith("/" + this.anoSelecionado)) {
-                        valoresFiltrados[col] = linha.valores[col] || 0;
-                        total += valoresFiltrados[col];
-                    }
-                }
-                return {
-                    centroDeCusto: linha.centroDeCusto,
-                    planoDeConta: linha.planoDeConta,
-                    valores: valoresFiltrados,
-                    idsPorMes: linha.idsPorMes,
-                    total,
-                };
-            });
-        },
-
-        totalPorColuna() {
-            const linhas = this.linhasFiltradas; // cache
-            const totais = {};
-            for (const col of this.colunasSelecionadas) {
-                if (!this.anoSelecionado || col.endsWith("/" + this.anoSelecionado)) {
-                    totais[col] = linhas.reduce((soma, linha) => soma + (linha.valores[col] || 0), 0);
-                }
-            }
-            return totais;
-        },
-
-        totalGeral() {
-            const linhas = this.linhasFiltradas;
-            return linhas.reduce((soma, linha) => soma + linha.total, 0);
-        },
-
-        anosSelecionados() {
-            return this.anos.filter(ano =>
-                this.colunasSelecionadas.some(col => col.endsWith("/" + ano))
-            );
-        },
-
-        totalPorAnoSeparado() {
-            const linhas = this.linhasFiltradas;
-            const totais = {};
-            for (const ano of this.anosSelecionados) {
-                let totalAno = 0;
-                for (const linha of linhas) {
-                    for (const [col, valor] of Object.entries(linha.valores)) {
-                        if (col.endsWith("/" + ano)) {
-                            totalAno += valor || 0;
-                        }
-                    }
-                }
-                totais[ano] = totalAno;
-            }
-            return totais;
-        }
-    },
-    mounted() {
-        this.colunasSelecionadas = this.colunasVisiveis.filter(col => {
-            const totalCol = this.dadosFinanceiros.reduce((acc, linha) => acc + (linha.valores[col] || 0), 0);
-            return totalCol !== 0;
-        });
-    },
-    methods: {
-        ...mapMutations("generic", ["openModal", "addEvent", "hideModal", "removeLoading"]),
-        formatarMoeda(valor) {
-            return `R$ ${valor.toFixed(2).replace('.', ',').replace(/\B(?=(\d{3})+(?!\d))/g, ".")}`;
-        },
-        classeValor(valor) {
-            if (valor < 0) return "text-danger";
-            if (valor > 0) return "text-primary";
-            return "";
-        },
-        openDetails(linha, col) {
-            var planoDeContaParse = this.agruparPorCentroDeCusto ? " - " : " (" + linha.planoDeConta + ") - ";
-            var title = linha.centroDeCusto + planoDeContaParse + col;
-            var ids = linha.idsPorMes[col] ? linha.idsPorMes[col] : [];
-            this.addEvent({ name: "details", data: { title: title, ids: ids } });
-        },
-        ordenarPorMesAno() {
-            setTimeout(() => {
-                const mesParaNumero = {
-                    "Janeiro": 0, "Fevereiro": 1, "Março": 2, "Abril": 3,
-                    "Maio": 4, "Junho": 5, "Julho": 6, "Agosto": 7,
-                    "Setembro": 8, "Outubro": 9, "Novembro": 10, "Dezembro": 11
-                };
-
-                this.colunasSelecionadas = [...this.colunasSelecionadas].sort((a, b) => {
-                    const [mesA, anoA] = a.split("/");
-                    const [mesB, anoB] = b.split("/");
-                    const dataA = new Date(anoA, mesParaNumero[mesA]);
-                    const dataB = new Date(anoB, mesParaNumero[mesB]);
-                    return dataA - dataB;
-                });
-            }, 0);
-        },
-        exportarCSV() {
-            const colunas = this.colunasSelecionadas.filter(c => !this.anoSelecionado || c.endsWith("/" + this.anoSelecionado));
-            const headers = [
-                this.mostrarCentroDeCusto ? "Centro de Custo" : null,
-                this.mostrarPlanoDeConta ? "Plano de Conta" : null,
-                ...colunas,
-                "Total"
-            ].filter(Boolean);
-
-            let csv = headers.join(";") + "\n";
-
-            // Linhas principais
-            this.linhasFiltradas.forEach(linha => {
-                const dados = [
-                    this.mostrarCentroDeCusto ? linha.centroDeCusto : null,
-                    this.mostrarPlanoDeConta ? linha.planoDeConta : null,
-                    ...colunas.map(mes => (linha.valores[mes] || 0).toFixed(2).replace(".", ",")),
-                    linha.total.toFixed(2).replace(".", ",")
-                ].filter(v => v !== null);
-                csv += dados.join(";") + "\n";
-            });
-
-            // Totais por ano (quando ativado)
-            if (this.mostrarTotalPorAno) {
-                for (const ano of this.anosSelecionados) {
-                    if (this.anoSelecionado && ano !== this.anoSelecionado) continue;
-
-                    const totalAno = this.totalPorAnoSeparado[ano] || 0;
-                    const prefixo = this.mostrarCentroDeCusto || this.mostrarPlanoDeConta ? `Total ${ano}` : "";
-                    const colSpan = this.mostrarCentroDeCusto + this.mostrarPlanoDeConta;
-                    const dados = Array(colSpan).fill("");
-                    if (prefixo) dados[0] = prefixo;
-
-                    const colunasAno = colunas.filter(c => c.endsWith("/" + ano));
-                    const totaisMeses = colunasAno.map(() => ""); // vazio por mês
-                    dados.push(...totaisMeses, totalAno.toFixed(2).replace(".", ","));
-                    csv += dados.join(";") + "\n";
-                }
-            }
-
-            // BOM para acentos no Excel
-            const BOM = "\uFEFF";
-            const blob = new Blob([BOM + csv], { type: "text/csv;charset=utf-8;" });
-
-            const link = document.createElement("a");
-            link.href = URL.createObjectURL(blob);
-            link.setAttribute("download", "Relatório de Desempenho Financeiro.csv");
-            document.body.appendChild(link);
-            link.click();
-            document.body.removeChild(link);
-        }
-    },
-    watch: {
-        event: {
-            handler(event) {
-                if (event.name == "openFields") {
-                    this.openModal('config');
-                    this.removeLoading(["btnOpenFields"]);
-                }
-                if (event.name == "openExcel") {
-                    this.exportarCSV();
-                }
-            },
-            deep: true,
-        },
-        agruparPorCentroDeCusto: {
-            handler(value) {
-                this.mostrarPlanoDeConta = !value;
-            },
-            deep: true,
-        },
-    },
-};
-</script>
-
-<style scoped>
-.custom-table {
-    width: 100%;
-    border-collapse: collapse;
-    font-size: 12px;
-    text-align: center;
-}
-
-.custom-table th,
-.custom-table td {
-    border: 1px solid #ccc;
-    padding: 2px 6px;
-    white-space: nowrap;
-    width: auto;
-}
-
-.custom-table thead th,
-.custom-table tfoot td {
-    text-align: center;
-    font-weight: bold;
-}
-
-
-.title-total {
-    font-weight: bold !important;
-}
-
-.text-danger {
-    color: red !important;
-}
-
-.text-primary {
-    color: #00058B !important;
-}
-
-.select-modern {
-    appearance: none;
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    padding: 7px 14px;
-    width: 250px;
-    font-size: 14px;
-    border: 1px solid #EBEBED;
-    border-radius: 12px;
-    background-color: #fff;
-    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='20,50 70,100 120,50' stroke='%23999' stroke-width='10' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
-    background-repeat: no-repeat;
-    background-position: right 12px center;
-    background-size: 16px;
-    transition: border-color 0.2s, box-shadow 0.2s;
-}
-
-.title-main {
-    font-size: 18px;
-    margin-bottom: 15px;
-}
-
-.color-total {
-    background-color: #FAFAFA !important;
-}
-
-.row-link {
-    cursor: pointer;
-    text-decoration: underline;
-}
-</style>

package/src/components/modules/finance/new-payable-receivable/PayableReceivableConfig.vue

@@ -1,35 +0,0 @@
-<template>
-    <div>
-        <CheckboxGroup :stacked="true" :initialValue="initialValue" :options="options" v-model="optionsSelected"
-            :changed="onChanged" />
-    </div>
-</template>
-
-<script>
-import CheckboxGroup from "@nixweb/nixloc-ui/src/component/forms/CheckboxGroup";
-import RadioGroup from "@nixweb/nixloc-ui/src/component/forms/RadioGroup";
-
-export default {
-    name: "PayableReceivableConfig",
-    components: { CheckboxGroup, RadioGroup },
-    data() {
-        return {
-            options: [
-                { text: "Mostrar baixadas", value: "showClosed" },
-                { text: "Mostrar saldo diário", value: "showBalance" },
-                { text: "Mostrar resumo financeiro", value: "showSummary" },
-                { text: "Vencimento (mais recente primeiro)", value: "sortDueDateDesc" },
-            ],
-            initialValue: ["showClosed", "showBalance", "showSummary", "sortDueDateDesc"],
-            optionsSelected: [],
-        };
-    },
-    methods: {
-        onChanged() {
-            console.log(JSON.stringify(this.optionsSelected));
-            //JSON.parse(str);
-
-        },
-    },
-};
-</script>