appmax-client-vue3 5.0.2 → 5.0.4

package/dist/RecurringSubscriptionDashView-BZlPz2u1.js

@@ -1,2051 +0,0 @@
-var __defProp = Object.defineProperty;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-import { G as ApiService, e as computed, r as ref, ab as defineComponent, c as useRouter, u as useI18n, d as useBreakpoint, v as createBlock, h as openBlock, w as withCtx, j as createBaseVNode, i as createVNode, a5 as withDirectives, l as unref, y, m as createTextVNode, t as toDisplayString, aD as vShow, $, g as createElementBlock, F as Fragment, _ as _export_sfc, p as _, aE as script, k as createCommentVNode, A as watch, J as script$1, q as renderList, S as normalizeStyle, b as useRoute, aF as useSidebarStore, o as onMounted } from "./main-CgTDKCoi.js";
-import { C } from "./index-DFqHYYbz.js";
-import { H } from "./AmHelper.vue_vue_type_script_setup_true_lang-D2zQmEN--BtclrwNr.js";
-import { A as AmSkeleton } from "./AmSkeleton-BZ4B60xG.js";
-import { A as AmDoughnutChartAdapted } from "./AmDoughnutChartAdapted-J6ecwlfR.js";
-import { A as AmCardV3 } from "./AmCardV3-tEcrQZmS.js";
-import { h as he } from "./index-D1qacMBp.js";
-import { s as script$2 } from "./index-Bq8cu7iX.js";
-import { u as useRecurringTable } from "./useRecurringTable-Crw9mmz1.js";
-const SEASONALITY_API_MAP = {
-  weekly: "semanal",
-  biweekly: "quinzenal",
-  monthly: "mensal",
-  bimonthly: "bimestral",
-  quarterly: "trimestral",
-  semiannual: "semestral",
-  annual: "anual"
-};
-class SubscriptionMetricsService {
-  // 5 minutes
-  constructor(apiService) {
-    __publicField(this, "baseUrl", "/api/subscriptions/metrics");
-    __publicField(this, "cache", /* @__PURE__ */ new Map());
-    __publicField(this, "cacheTimeout", 5 * 60 * 1e3);
-    this.apiService = apiService;
-  }
-  getCacheKey(endpoint, params) {
-    if (!params) return endpoint;
-    const sortedParams = Object.keys(params).sort().reduce((acc, key) => {
-      acc[key] = params[key];
-      return acc;
-    }, {});
-    const normalizedParams = Object.entries(sortedParams).reduce((acc, [key, value]) => {
-      if (Array.isArray(value)) {
-        acc[key] = [...value].sort();
-      } else {
-        acc[key] = value;
-      }
-      return acc;
-    }, {});
-    return `${endpoint}:${JSON.stringify(normalizedParams)}`;
-  }
-  setCache(key, data) {
-    this.cache.set(key, {
-      data,
-      timestamp: Date.now()
-    });
-  }
-  getCache(key) {
-    const cached = this.cache.get(key);
-    if (!cached) {
-      return null;
-    }
-    const isExpired = Date.now() - cached.timestamp > this.cacheTimeout;
-    if (isExpired) {
-      this.cache.delete(key);
-      return null;
-    }
-    return cached.data;
-  }
-  clearCacheByPrefix(prefix) {
-    for (const key of this.cache.keys()) {
-      if (key.startsWith(prefix)) {
-        this.cache.delete(key);
-      }
-    }
-  }
-  clearAllCache() {
-    this.cache.clear();
-  }
-  async getActiveSubscriptions() {
-    const endpoint = `${this.baseUrl}/actives`;
-    const cacheKey = this.getCacheKey(endpoint);
-    const cached = this.getCache(cacheKey);
-    if (cached) return cached;
-    const response = await this.apiService.get(endpoint);
-    const { data } = response;
-    const result = data.data;
-    this.setCache(cacheKey, result);
-    return result;
-  }
-  async getOverdueSubscriptions() {
-    const endpoint = `${this.baseUrl}/recoveries`;
-    const cacheKey = this.getCacheKey(endpoint);
-    const cached = this.getCache(cacheKey);
-    if (cached) return cached;
-    const response = await this.apiService.get(endpoint);
-    const { data } = response;
-    const result = data.data;
-    this.setCache(cacheKey, result);
-    return result;
-  }
-  async getNewActiveSubscriptions() {
-    const endpoint = `${this.baseUrl}/new_actives`;
-    const cacheKey = this.getCacheKey(endpoint);
-    const cached = this.getCache(cacheKey);
-    if (cached) return cached;
-    const response = await this.apiService.get(endpoint);
-    const { data } = response;
-    const result = data.data;
-    this.setCache(cacheKey, result);
-    return result;
-  }
-  async getChurnMetrics() {
-    const endpoint = `${this.baseUrl}/churn`;
-    const cacheKey = this.getCacheKey(endpoint);
-    const cached = this.getCache(cacheKey);
-    if (cached) return cached;
-    const response = await this.apiService.get(endpoint);
-    const { data } = response;
-    const result = data.data;
-    this.setCache(cacheKey, result);
-    return result;
-  }
-  async getGraphicsMetrics(params) {
-    var _a;
-    const endpoint = `${this.baseUrl}/graphics`;
-    const apiParams = {
-      ...params,
-      seasonality: (_a = params.seasonality) == null ? void 0 : _a.map(
-        (type) => SEASONALITY_API_MAP[type]
-      )
-    };
-    const cacheKey = this.getCacheKey(endpoint, apiParams);
-    const cached = this.getCache(cacheKey);
-    if (cached) return cached;
-    const response = await this.apiService.get(endpoint, { params: apiParams });
-    const { data } = response;
-    const result = data.data;
-    this.setCache(cacheKey, result);
-    return result;
-  }
-  // Call this when a subscription is created, updated, or cancelled
-  invalidateMetricsCache() {
-    this.clearCacheByPrefix(this.baseUrl);
-  }
-}
-const subscriptionMetricsService = new SubscriptionMetricsService(ApiService);
-const DEFAULT_SEASONALITY = [
-  "weekly",
-  "biweekly",
-  "monthly",
-  "bimonthly",
-  "quarterly",
-  "semiannual",
-  "annual"
-];
-const sharedState = {
-  data: ref({
-    actives: null,
-    overdues: null,
-    newActives: null,
-    churn: null,
-    graphics: null
-  }),
-  loading: ref({
-    actives: false,
-    overdues: false,
-    newActives: false,
-    churn: false,
-    graphics: false
-  }),
-  error: ref(null),
-  dateRange: ref({
-    start: new Date(Date.now() - 30 * 24 * 60 * 60 * 1e3),
-    // Últimos 30 dias
-    end: /* @__PURE__ */ new Date()
-  }),
-  selectedSeasonality: ref([...DEFAULT_SEASONALITY])
-};
-const isLoaded = computed(() => {
-  return sharedState.data.value.actives !== null && sharedState.data.value.overdues !== null && sharedState.data.value.newActives !== null && sharedState.data.value.churn !== null;
-});
-const hasError = computed(() => sharedState.error.value !== null);
-const formatDate = (date) => {
-  return date.toISOString().split("T")[0];
-};
-const graphicsParams = computed(() => ({
-  date_start: formatDate(sharedState.dateRange.value.start),
-  date_end: formatDate(sharedState.dateRange.value.end),
-  seasonality: sharedState.selectedSeasonality.value
-}));
-const setDateRange = (range) => {
-  sharedState.dateRange.value = range;
-};
-const setSeasonality = (types) => {
-  sharedState.selectedSeasonality.value = types;
-};
-const initialize = async () => {
-  if (isLoaded.value) {
-    return;
-  }
-  Object.keys(sharedState.loading.value).forEach((key) => {
-    if (key !== "graphics") {
-      sharedState.loading.value[key] = true;
-    }
-  });
-  sharedState.error.value = null;
-  try {
-    sharedState.loading.value.actives = true;
-    sharedState.loading.value.overdues = true;
-    sharedState.loading.value.newActives = true;
-    sharedState.loading.value.churn = true;
-    const promises = [
-      // Métricas ativas
-      subscriptionMetricsService.getActiveSubscriptions().then((data) => {
-        sharedState.data.value.actives = data;
-      }).catch((err) => {
-        console.error("Erro ao carregar métricas ativas:", err);
-        throw err;
-      }).finally(() => {
-        sharedState.loading.value.actives = false;
-      }),
-      // Métricas de recuperação
-      subscriptionMetricsService.getOverdueSubscriptions().then((data) => {
-        sharedState.data.value.overdues = data;
-      }).catch((err) => {
-        console.error("Erro ao carregar métricas de recuperação:", err);
-        throw err;
-      }).finally(() => {
-        sharedState.loading.value.overdues = false;
-      }),
-      // Métricas de novas ativas
-      subscriptionMetricsService.getNewActiveSubscriptions().then((data) => {
-        sharedState.data.value.newActives = data;
-      }).catch((err) => {
-        console.error("Erro ao carregar métricas de novas ativas:", err);
-        throw err;
-      }).finally(() => {
-        sharedState.loading.value.newActives = false;
-      }),
-      // Métricas de churn
-      subscriptionMetricsService.getChurnMetrics().then((data) => {
-        sharedState.data.value.churn = data;
-      }).catch((err) => {
-        console.error("Erro ao carregar métricas de churn:", err);
-        throw err;
-      }).finally(() => {
-        sharedState.loading.value.churn = false;
-      })
-    ];
-    await Promise.all(promises);
-  } catch (err) {
-    sharedState.error.value = {
-      message: err instanceof Error ? err.message : "Erro desconhecido ao carregar dados",
-      details: err
-    };
-    console.error("Erro ao carregar dados das métricas:", err);
-  }
-};
-const loadGraphics = async () => {
-  sharedState.loading.value.graphics = true;
-  try {
-    const graphicsData = await subscriptionMetricsService.getGraphicsMetrics(graphicsParams.value);
-    sharedState.data.value.graphics = graphicsData;
-  } catch (err) {
-    sharedState.error.value = {
-      message: err instanceof Error ? err.message : "Erro ao carregar dados dos gráficos",
-      details: err
-    };
-    console.error("Erro ao carregar dados dos gráficos:", err);
-    throw err;
-  } finally {
-    sharedState.loading.value.graphics = false;
-  }
-};
-const clearData = () => {
-  sharedState.data.value = {
-    actives: null,
-    overdues: null,
-    newActives: null,
-    churn: null,
-    graphics: null
-  };
-  sharedState.error.value = null;
-  sharedState.loading.value = {
-    actives: false,
-    overdues: false,
-    newActives: false,
-    churn: false,
-    graphics: false
-  };
-};
-const invalidateCache = () => {
-  subscriptionMetricsService.invalidateMetricsCache();
-};
-function useMetricsData() {
-  const loadingActives = computed(() => sharedState.loading.value.actives);
-  const loadingOverdues = computed(() => sharedState.loading.value.overdues);
-  const loadingNewActives = computed(() => sharedState.loading.value.newActives);
-  const loadingChurn = computed(() => sharedState.loading.value.churn);
-  const loadingGraphics = computed(() => sharedState.loading.value.graphics);
-  const isAnyLoading = computed(
-    () => Object.values(sharedState.loading.value).some((loading) => loading)
-  );
-  return {
-    // Dados
-    data: computed(() => sharedState.data.value),
-    error: computed(() => sharedState.error.value),
-    isLoaded,
-    hasError,
-    // Loadings específicos
-    loadingActives,
-    loadingOverdues,
-    loadingNewActives,
-    loadingChurn,
-    loadingGraphics,
-    isAnyLoading,
-    // Controles de gráficos
-    dateRange: computed(() => sharedState.dateRange.value),
-    selectedSeasonality: computed(() => sharedState.selectedSeasonality.value),
-    setDateRange,
-    setSeasonality,
-    // Ações
-    initialize,
-    loadGraphics,
-    clearData,
-    invalidateCache
-  };
-}
-const _hoisted_1$8 = { class: "card-header" };
-const _hoisted_2$8 = { class: "card-content" };
-const _hoisted_3$8 = { class: "content-data" };
-const _hoisted_4$7 = {
-  key: 0,
-  class: "skeleton-container"
-};
-const _sfc_main$8 = /* @__PURE__ */ defineComponent({
-  __name: "TotalRevenueCard",
-  setup(__props) {
-    const router = useRouter();
-    const { data, loadingActives } = useMetricsData();
-    const { t } = useI18n();
-    const isDesktop = useBreakpoint("desktop");
-    const revenue = computed(() => {
-      var _a, _b;
-      if (!((_b = (_a = data.value) == null ? void 0 : _a.actives) == null ? void 0 : _b.revenue)) return t("totalRevenue.defaultValue");
-      return `R$ ${data.value.actives.revenue.toLocaleString("pt-BR", { minimumFractionDigits: 2 })}`;
-    });
-    const handleClick = () => {
-      router.push({
-        name: "subscription.list",
-        query: { status: "1" }
-      });
-    };
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(C), { class: "revenue-card" }, {
-        default: withCtx(() => [
-          createBaseVNode("div", _hoisted_1$8, [
-            createVNode(unref(y), {
-              variant: "subtitle",
-              isStrong: ""
-            }, {
-              default: withCtx(() => [
-                createTextVNode(toDisplayString(unref(t)("totalRevenue.title")), 1)
-              ]),
-              _: 1
-            }),
-            withDirectives(createVNode(unref(H), {
-              text: unref(t)("totalRevenue.helperText"),
-              size: "sm"
-            }, null, 8, ["text"]), [
-              [vShow, unref(isDesktop)]
-            ]),
-            withDirectives(createVNode(unref($), {
-              icon: "search_insights",
-              size: "small",
-              class: "header-button",
-              disabled: unref(loadingActives),
-              onClick: handleClick
-            }, {
-              default: withCtx(() => [
-                createTextVNode(toDisplayString(unref(t)("totalRevenue.buttonText")), 1)
-              ]),
-              _: 1
-            }, 8, ["disabled"]), [
-              [vShow, unref(isDesktop)]
-            ])
-          ]),
-          createBaseVNode("div", _hoisted_2$8, [
-            createBaseVNode("div", _hoisted_3$8, [
-              unref(loadingActives) ? (openBlock(), createElementBlock("div", _hoisted_4$7, [
-                createVNode(AmSkeleton, {
-                  width: 180,
-                  height: 40,
-                  class: "skeleton-primary"
-                }),
-                createVNode(AmSkeleton, {
-                  width: 220,
-                  height: 16,
-                  class: "skeleton-secondary"
-                })
-              ])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-                createVNode(unref(y), {
-                  variant: "title",
-                  isStrong: ""
-                }, {
-                  default: withCtx(() => [
-                    createTextVNode(toDisplayString(revenue.value), 1)
-                  ]),
-                  _: 1
-                }),
-                createVNode(unref(y), { class: "text-muted-color" }, {
-                  default: withCtx(() => {
-                    var _a, _b;
-                    return [
-                      createTextVNode(toDisplayString(unref(t)("totalRevenue.subtitle", { count: (_b = (_a = unref(data)) == null ? void 0 : _a.actives) == null ? void 0 : _b.quantity })), 1)
-                    ];
-                  }),
-                  _: 1
-                })
-              ], 64))
-            ]),
-            withDirectives(createVNode(unref($), {
-              icon: "search_insights",
-              size: "small",
-              class: "mobile-button",
-              disabled: unref(loadingActives),
-              onClick: handleClick
-            }, {
-              default: withCtx(() => [
-                createTextVNode(toDisplayString(unref(t)("totalRevenue.buttonText")), 1)
-              ]),
-              _: 1
-            }, 8, ["disabled"]), [
-              [vShow, !unref(isDesktop)]
-            ])
-          ])
-        ]),
-        _: 1
-      });
-    };
-  }
-});
-const TotalRevenueCard = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-ae726abd"]]);
-const _hoisted_1$7 = { class: "card-header mb-4" };
-const _hoisted_2$7 = { class: "card-body" };
-const _hoisted_3$7 = { class: "top-section" };
-const _hoisted_4$6 = { class: "content-data" };
-const _hoisted_5$6 = {
-  key: 0,
-  class: "skeleton-container"
-};
-const _hoisted_6$6 = { class: "flex items-center gap-1" };
-const _hoisted_7$5 = { class: "content-data" };
-const _hoisted_8$3 = {
-  key: 0,
-  class: "skeleton-container"
-};
-const _hoisted_9$3 = {
-  key: 0,
-  class: "pb-1.5"
-};
-const _hoisted_10$2 = {
-  key: 1,
-  class: "flex items-center gap-1"
-};
-const _hoisted_11$1 = { class: "bottom-section" };
-const _hoisted_12 = {
-  key: 0,
-  class: "bottom-skeleton-container"
-};
-const _hoisted_13 = {
-  key: 1,
-  class: "flex items-center gap-4"
-};
-const _hoisted_14 = { class: "space-y-1" };
-const recoveryRateText = "Taxa de recuperação e total recuperado nos últimos 30 dias";
-const helperText$1 = "Valores referentes às assinaturas que estão em atraso e entraram em processo de recuperação";
-const buttonText = "Ver detalhes";
-const AI_RECOVERY_DISABLED = true;
-const _sfc_main$7 = /* @__PURE__ */ defineComponent({
-  __name: "SubscriptionRecoveryCard",
-  setup(__props) {
-    const router = useRouter();
-    const { data, loadingOverdues } = useMetricsData();
-    const automatedRecovery = computed(() => {
-      var _a;
-      if (!((_a = data.value) == null ? void 0 : _a.overdues)) return "0%";
-      return `${data.value.overdues.automated_recovery}%`;
-    });
-    const aiRecovery = computed(() => {
-      return "0";
-    });
-    const recoveryRate = computed(() => {
-      var _a;
-      if (!((_a = data.value) == null ? void 0 : _a.overdues)) return 0;
-      return parseFloat(data.value.overdues.average_total_recovered.replace(",", "."));
-    });
-    const totalRecovered = computed(() => {
-      var _a;
-      if (!((_a = data.value) == null ? void 0 : _a.overdues)) return "R$ 0,00";
-      return `R$ ${data.value.overdues.total_recovered}`;
-    });
-    computed(() => {
-      var _a;
-      if (!((_a = data.value) == null ? void 0 : _a.overdues)) return "R$ 0,00";
-      return `R$ ${data.value.overdues.average_total_recovered}`;
-    });
-    const handleClick = () => {
-      router.push({
-        name: "subscription.list",
-        query: { status: "3" }
-        // ID 3 = Em atraso
-      });
-    };
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(C), { class: "recovery-card" }, {
-        default: withCtx(() => [
-          createBaseVNode("div", _hoisted_1$7, [
-            createVNode(unref(y), {
-              variant: "subtitle",
-              isStrong: ""
-            }, {
-              default: withCtx(() => _cache[0] || (_cache[0] = [
-                createTextVNode("Recuperação de assinaturas")
-              ])),
-              _: 1
-            }),
-            createVNode(unref(H), {
-              text: helperText$1,
-              size: "sm"
-            }),
-            createVNode(unref($), {
-              icon: "search_insights",
-              class: "header-button",
-              severity: "secondary",
-              title: buttonText,
-              text: "",
-              onlyIcon: "",
-              onClick: handleClick
-            })
-          ]),
-          createBaseVNode("div", _hoisted_2$7, [
-            createBaseVNode("div", _hoisted_3$7, [
-              createBaseVNode("div", _hoisted_4$6, [
-                unref(loadingOverdues) ? (openBlock(), createElementBlock("div", _hoisted_5$6, [
-                  createVNode(AmSkeleton, {
-                    width: 80,
-                    height: 40,
-                    class: "skeleton-primary"
-                  }),
-                  createVNode(AmSkeleton, {
-                    width: 140,
-                    height: 16,
-                    class: "skeleton-secondary"
-                  }),
-                  createVNode(AmSkeleton, {
-                    width: 120,
-                    height: 16,
-                    class: "skeleton-tertiary"
-                  })
-                ])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-                  createBaseVNode("div", _hoisted_6$6, [
-                    createVNode(unref(_), {
-                      icon: "replay",
-                      class: "replay-icon"
-                    }),
-                    createVNode(unref(y), {
-                      variant: "title",
-                      isStrong: ""
-                    }, {
-                      default: withCtx(() => [
-                        createTextVNode(toDisplayString(automatedRecovery.value), 1)
-                      ]),
-                      _: 1
-                    })
-                  ]),
-                  createVNode(unref(y), { class: "text-muted-color" }, {
-                    default: withCtx(() => _cache[1] || (_cache[1] = [
-                      createTextVNode("Em recuperação "),
-                      createBaseVNode("br", null, null, -1),
-                      createTextVNode("automatizada")
-                    ])),
-                    _: 1
-                  })
-                ], 64))
-              ]),
-              _cache[4] || (_cache[4] = createBaseVNode("div", { class: "divider" }, [
-                createBaseVNode("div", { class: "divider-line" })
-              ], -1)),
-              createBaseVNode("div", _hoisted_7$5, [
-                unref(loadingOverdues) ? (openBlock(), createElementBlock("div", _hoisted_8$3, [
-                  createVNode(AmSkeleton, {
-                    width: 80,
-                    height: 40,
-                    class: "skeleton-primary"
-                  }),
-                  createVNode(AmSkeleton, {
-                    width: 140,
-                    height: 16,
-                    class: "skeleton-secondary"
-                  }),
-                  createVNode(AmSkeleton, {
-                    width: 120,
-                    height: 16,
-                    class: "skeleton-tertiary"
-                  })
-                ])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-                  AI_RECOVERY_DISABLED ? (openBlock(), createElementBlock("div", _hoisted_9$3, [
-                    createVNode(unref(y), {
-                      as: "span",
-                      size: "small",
-                      variant: "caption",
-                      class: "bg-neutral-600 text-white py-1 px-3 rounded-full"
-                    }, {
-                      default: withCtx(() => _cache[2] || (_cache[2] = [
-                        createTextVNode("Em breve")
-                      ])),
-                      _: 1
-                    })
-                  ])) : (openBlock(), createElementBlock("div", _hoisted_10$2, [
-                    createVNode(unref(_), { icon: "flare" }),
-                    createVNode(unref(y), {
-                      variant: "title",
-                      isStrong: ""
-                    }, {
-                      default: withCtx(() => [
-                        createTextVNode(toDisplayString(aiRecovery.value), 1)
-                      ]),
-                      _: 1
-                    })
-                  ])),
-                  createVNode(unref(y), { class: "text-muted-color" }, {
-                    default: withCtx(() => _cache[3] || (_cache[3] = [
-                      createTextVNode("Em recuperação "),
-                      createBaseVNode("br", null, null, -1),
-                      createTextVNode("por IA")
-                    ])),
-                    _: 1
-                  })
-                ], 64))
-              ])
-            ]),
-            createVNode(unref(script)),
-            createBaseVNode("div", _hoisted_11$1, [
-              unref(loadingOverdues) ? (openBlock(), createElementBlock("div", _hoisted_12, [
-                createVNode(AmSkeleton, {
-                  width: 180,
-                  height: 24,
-                  class: "bottom-skeleton-top"
-                }),
-                createVNode(AmSkeleton, {
-                  width: 280,
-                  height: 16,
-                  class: "bottom-skeleton-middle"
-                }),
-                createVNode(AmSkeleton, {
-                  width: 220,
-                  height: 16,
-                  class: "bottom-skeleton-bottom"
-                })
-              ])) : (openBlock(), createElementBlock("div", _hoisted_13, [
-                createBaseVNode("div", null, [
-                  createVNode(AmDoughnutChartAdapted, {
-                    id: "recovery-chart",
-                    label: "",
-                    percentage: recoveryRate.value,
-                    values: [recoveryRate.value, 100]
-                  }, null, 8, ["percentage", "values"])
-                ]),
-                createBaseVNode("div", _hoisted_14, [
-                  createVNode(unref(y), {
-                    variant: "title",
-                    isStrong: ""
-                  }, {
-                    default: withCtx(() => [
-                      createTextVNode(toDisplayString(totalRecovered.value), 1)
-                    ]),
-                    _: 1
-                  }),
-                  createVNode(unref(y), { class: "text-muted-color" }, {
-                    default: withCtx(() => [
-                      createTextVNode(toDisplayString(recoveryRateText))
-                    ]),
-                    _: 1
-                  })
-                ])
-              ]))
-            ])
-          ])
-        ]),
-        _: 1
-      });
-    };
-  }
-});
-const SubscriptionRecoveryCard = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-5ea3cfd2"]]);
-const _hoisted_1$6 = { class: "card-header" };
-const _hoisted_2$6 = { class: "card-content" };
-const _hoisted_3$6 = { class: "content-data" };
-const _hoisted_4$5 = {
-  key: 0,
-  class: "skeleton-container"
-};
-const _hoisted_5$5 = { class: "content-data" };
-const _hoisted_6$5 = {
-  key: 0,
-  class: "skeleton-container"
-};
-const _sfc_main$6 = /* @__PURE__ */ defineComponent({
-  __name: "NewSubscriptionsCard",
-  setup(__props) {
-    const router = useRouter();
-    const { data, loadingNewActives } = useMetricsData();
-    const { t } = useI18n();
-    const handleClick = () => {
-      router.push({
-        name: "subscription.list",
-        query: {
-          status: "1",
-          // ID 1 = Ativo
-          order_direction: "desc"
-          // Mais novas primeiro
-        }
-      });
-    };
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(C), { class: "metric-card" }, {
-        default: withCtx(() => [
-          createBaseVNode("div", _hoisted_1$6, [
-            createVNode(unref(y), {
-              variant: "subtitle",
-              isStrong: ""
-            }, {
-              default: withCtx(() => [
-                createTextVNode(toDisplayString(unref(t)("newSubscriptions.title")), 1)
-              ]),
-              _: 1
-            }),
-            createVNode(unref(H), {
-              text: unref(t)("newSubscriptions.helperText"),
-              size: "sm"
-            }, null, 8, ["text"]),
-            createVNode(unref($), {
-              icon: "search_insights",
-              class: "header-button",
-              severity: "secondary",
-              title: unref(t)("newSubscriptions.buttonText"),
-              text: "",
-              onlyIcon: "",
-              onClick: handleClick
-            }, null, 8, ["title"])
-          ]),
-          createBaseVNode("div", _hoisted_2$6, [
-            createBaseVNode("div", _hoisted_3$6, [
-              unref(loadingNewActives) ? (openBlock(), createElementBlock("div", _hoisted_4$5, [
-                createVNode(AmSkeleton, {
-                  width: 80,
-                  height: 32,
-                  class: "skeleton-primary"
-                }),
-                createVNode(AmSkeleton, {
-                  width: 140,
-                  height: 14,
-                  class: "skeleton-secondary"
-                }),
-                createVNode(AmSkeleton, {
-                  width: 120,
-                  height: 14,
-                  class: "skeleton-tertiary"
-                })
-              ])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-                createVNode(unref(y), {
-                  variant: "title",
-                  isStrong: ""
-                }, {
-                  default: withCtx(() => {
-                    var _a, _b;
-                    return [
-                      createTextVNode(toDisplayString(((_b = (_a = unref(data)) == null ? void 0 : _a.newActives) == null ? void 0 : _b.quantity) || 0), 1)
-                    ];
-                  }),
-                  _: 1
-                }),
-                createVNode(unref(y), { class: "text-muted-color whitespace-pre-line" }, {
-                  default: withCtx(() => [
-                    createTextVNode(toDisplayString(unref(t)("newSubscriptions.last30DaysLabel")), 1)
-                  ]),
-                  _: 1
-                })
-              ], 64))
-            ]),
-            _cache[0] || (_cache[0] = createBaseVNode("div", { class: "divider" }, [
-              createBaseVNode("div", { class: "divider-line" })
-            ], -1)),
-            createBaseVNode("div", _hoisted_5$5, [
-              unref(loadingNewActives) ? (openBlock(), createElementBlock("div", _hoisted_6$5, [
-                createVNode(AmSkeleton, {
-                  width: 80,
-                  height: 32,
-                  class: "skeleton-primary"
-                }),
-                createVNode(AmSkeleton, {
-                  width: 140,
-                  height: 14,
-                  class: "skeleton-secondary"
-                }),
-                createVNode(AmSkeleton, {
-                  width: 120,
-                  height: 14,
-                  class: "skeleton-tertiary"
-                })
-              ])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-                createVNode(unref(y), {
-                  variant: "title",
-                  isStrong: ""
-                }, {
-                  default: withCtx(() => {
-                    var _a, _b;
-                    return [
-                      createTextVNode(toDisplayString(((_b = (_a = unref(data)) == null ? void 0 : _a.newActives) == null ? void 0 : _b.average_last_12_months) || 0), 1)
-                    ];
-                  }),
-                  _: 1
-                }),
-                createVNode(unref(y), { class: "text-muted-color whitespace-pre-line" }, {
-                  default: withCtx(() => [
-                    createTextVNode(toDisplayString(unref(t)("newSubscriptions.average12MonthsLabel")), 1)
-                  ]),
-                  _: 1
-                })
-              ], 64))
-            ])
-          ])
-        ]),
-        _: 1
-      });
-    };
-  }
-});
-const NewSubscriptionsCard = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-f5fdece6"]]);
-const _hoisted_1$5 = { class: "card-header" };
-const _hoisted_2$5 = { class: "header-buttons" };
-const _hoisted_3$5 = { class: "card-content" };
-const _hoisted_4$4 = { class: "content-data" };
-const _hoisted_5$4 = {
-  key: 0,
-  class: "skeleton-container"
-};
-const _hoisted_6$4 = { class: "content-data" };
-const _hoisted_7$4 = {
-  key: 0,
-  class: "skeleton-container"
-};
-const showVisibilityToggle = true;
-const _sfc_main$5 = /* @__PURE__ */ defineComponent({
-  __name: "ChurnCard",
-  setup(__props) {
-    const router = useRouter();
-    const { data, loadingChurn } = useMetricsData();
-    const { t } = useI18n();
-    const isChurnVisible = ref(true);
-    const toggleVisibility = () => {
-      isChurnVisible.value = !isChurnVisible.value;
-    };
-    const handleClick = () => {
-      router.push({
-        name: "subscription.list",
-        query: { status: "2" }
-        // ID 2 = Cancelado
-      });
-    };
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(C), { class: "metric-card" }, {
-        default: withCtx(() => [
-          createBaseVNode("div", _hoisted_1$5, [
-            createVNode(unref(y), {
-              variant: "subtitle",
-              isStrong: ""
-            }, {
-              default: withCtx(() => [
-                createTextVNode(toDisplayString(unref(t)("churn.title")), 1)
-              ]),
-              _: 1
-            }),
-            createVNode(unref(H), {
-              text: unref(t)("churn.helperText"),
-              size: "sm"
-            }, null, 8, ["text"]),
-            createBaseVNode("div", _hoisted_2$5, [
-              showVisibilityToggle ? (openBlock(), createBlock(unref($), {
-                key: 0,
-                icon: isChurnVisible.value ? "visibility" : "visibility_off",
-                severity: "secondary",
-                title: unref(t)("churn.toggleVisibility"),
-                onClick: toggleVisibility,
-                text: "",
-                onlyIcon: ""
-              }, null, 8, ["icon", "title"])) : createCommentVNode("", true),
-              createVNode(unref($), {
-                icon: "search_insights",
-                severity: "secondary",
-                title: unref(t)("churn.buttonText"),
-                text: "",
-                onlyIcon: "",
-                onClick: handleClick
-              }, null, 8, ["title"])
-            ])
-          ]),
-          createBaseVNode("div", _hoisted_3$5, [
-            createBaseVNode("div", _hoisted_4$4, [
-              unref(loadingChurn) ? (openBlock(), createElementBlock("div", _hoisted_5$4, [
-                createVNode(AmSkeleton, {
-                  width: 80,
-                  height: 32,
-                  class: "skeleton-primary"
-                }),
-                createVNode(AmSkeleton, {
-                  width: 140,
-                  height: 14,
-                  class: "skeleton-secondary"
-                }),
-                createVNode(AmSkeleton, {
-                  width: 120,
-                  height: 14,
-                  class: "skeleton-tertiary"
-                })
-              ])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-                createVNode(unref(y), {
-                  variant: "title",
-                  isStrong: ""
-                }, {
-                  default: withCtx(() => {
-                    var _a, _b;
-                    return [
-                      createTextVNode(toDisplayString(isChurnVisible.value ? `${((_b = (_a = unref(data)) == null ? void 0 : _a.churn) == null ? void 0 : _b.average) || 0}%` : "****"), 1)
-                    ];
-                  }),
-                  _: 1
-                }),
-                createVNode(unref(y), { class: "text-muted-color whitespace-pre-line" }, {
-                  default: withCtx(() => [
-                    createTextVNode(toDisplayString(unref(t)("churn.last30DaysLabel")), 1)
-                  ]),
-                  _: 1
-                })
-              ], 64))
-            ]),
-            _cache[0] || (_cache[0] = createBaseVNode("div", { class: "divider" }, [
-              createBaseVNode("div", { class: "divider-line" })
-            ], -1)),
-            createBaseVNode("div", _hoisted_6$4, [
-              unref(loadingChurn) ? (openBlock(), createElementBlock("div", _hoisted_7$4, [
-                createVNode(AmSkeleton, {
-                  width: 80,
-                  height: 32,
-                  class: "skeleton-primary"
-                }),
-                createVNode(AmSkeleton, {
-                  width: 140,
-                  height: 14,
-                  class: "skeleton-secondary"
-                }),
-                createVNode(AmSkeleton, {
-                  width: 120,
-                  height: 14,
-                  class: "skeleton-tertiary"
-                })
-              ])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-                createVNode(unref(y), {
-                  variant: "title",
-                  isStrong: ""
-                }, {
-                  default: withCtx(() => {
-                    var _a, _b;
-                    return [
-                      createTextVNode(toDisplayString(isChurnVisible.value ? `${((_b = (_a = unref(data)) == null ? void 0 : _a.churn) == null ? void 0 : _b.average_last_12_months) || 0}%` : "****"), 1)
-                    ];
-                  }),
-                  _: 1
-                }),
-                createVNode(unref(y), { class: "text-muted-color whitespace-pre-line" }, {
-                  default: withCtx(() => [
-                    createTextVNode(toDisplayString(unref(t)("churn.average12MonthsLabel")), 1)
-                  ]),
-                  _: 1
-                })
-              ], 64))
-            ])
-          ])
-        ]),
-        _: 1
-      });
-    };
-  }
-});
-const ChurnCard = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-be3d5a46"]]);
-const _hoisted_1$4 = { class: "col-span-12 grid grid-cols-1 lg:grid-cols-2 gap-4 items-center" };
-const _hoisted_2$4 = { class: "flex items-center gap-2" };
-const _hoisted_3$4 = {
-  id: "date-filter",
-  class: "flex-1 !p-0 h-10"
-};
-const _sfc_main$4 = /* @__PURE__ */ defineComponent({
-  __name: "FilterBar",
-  props: {
-    seasonalityOptions: { default: () => [
-      { label: "Todos", value: 0 },
-      { label: "Anual", value: 1 },
-      { label: "Semestral", value: 2 },
-      { label: "Trimestral", value: 3 },
-      { label: "Bimestral", value: 7 },
-      { label: "Mensal", value: 4 },
-      { label: "Quinzenal", value: 5 },
-      { label: "Semanal", value: 6 }
-    ] },
-    seasonalityPlaceholder: { default: "Filtrar por sazonalidade" },
-    selectedSeasonalityTypes: { default: () => [] },
-    onSeasonalityChange: {},
-    onDateChange: {}
-  },
-  emits: ["seasonalityChange", "dateChange"],
-  setup(__props, { emit: __emit }) {
-    const props = __props;
-    const seasonalityTypeToValue = {
-      annual: 1,
-      semiannual: 2,
-      quarterly: 3,
-      bimonthly: 7,
-      monthly: 4,
-      biweekly: 5,
-      weekly: 6
-    };
-    const getDefault30Days = () => {
-      const today = /* @__PURE__ */ new Date();
-      today.setHours(0, 0, 0, 0);
-      const start = new Date(today);
-      start.setDate(today.getDate() - 29);
-      start.setHours(0, 0, 0, 0);
-      return [start.toISOString(), today.toISOString()];
-    };
-    const selectedSeasonality = ref(null);
-    const selectedDates = ref(getDefault30Days());
-    let isUserChanging = false;
-    const syncSelectedValue = () => {
-      if (isUserChanging) return;
-      const types = props.selectedSeasonalityTypes || [];
-      if (types.length === 0) {
-        if (selectedSeasonality.value !== 0) {
-          selectedSeasonality.value = 0;
-        }
-        return;
-      }
-      if (types.length === 7) {
-        const allTypes = ["weekly", "biweekly", "monthly", "bimonthly", "quarterly", "semiannual", "annual"];
-        const hasAllTypes = allTypes.every((type) => types.includes(type));
-        if (hasAllTypes) {
-          if (selectedSeasonality.value !== 0) {
-            selectedSeasonality.value = 0;
-          }
-          return;
-        }
-      }
-      const firstType = types[0];
-      const mappedValue = seasonalityTypeToValue[firstType];
-      if (mappedValue !== void 0 && selectedSeasonality.value !== mappedValue) {
-        selectedSeasonality.value = mappedValue;
-      }
-    };
-    watch(() => props.selectedSeasonalityTypes, syncSelectedValue, { immediate: true, deep: true });
-    const dateRangeConfigs = {
-      "30D": () => {
-        const today = /* @__PURE__ */ new Date();
-        const start = new Date(today);
-        start.setDate(today.getDate() - 29);
-        return [start, today];
-      },
-      "60D": () => {
-        const today = /* @__PURE__ */ new Date();
-        const start = new Date(today);
-        start.setDate(today.getDate() - 59);
-        return [start, today];
-      },
-      "90D": () => {
-        const today = /* @__PURE__ */ new Date();
-        const start = new Date(today);
-        start.setDate(today.getDate() - 89);
-        return [start, today];
-      },
-      "365D": () => {
-        const today = /* @__PURE__ */ new Date();
-        const start = new Date(today);
-        start.setDate(today.getDate() - 364);
-        return [start, today];
-      }
-    };
-    const emit = __emit;
-    let isInitialized = false;
-    setTimeout(() => {
-      isInitialized = true;
-      emit("dateChange", selectedDates.value);
-      if (props.onDateChange) {
-        props.onDateChange(selectedDates.value);
-      }
-    }, 0);
-    const handleSeasonalityChange = (value) => {
-      const nextValue = Array.isArray(value) ? value.length ? value[value.length - 1] : null : value;
-      isUserChanging = true;
-      selectedSeasonality.value = nextValue;
-      if (isInitialized) {
-        emit("seasonalityChange", nextValue);
-        if (props.onSeasonalityChange) {
-          props.onSeasonalityChange(nextValue);
-        }
-      }
-      setTimeout(() => {
-        isUserChanging = false;
-      }, 100);
-    };
-    const handleDateChange = (dates) => {
-      selectedDates.value = dates;
-      if (isInitialized) {
-        emit("dateChange", dates);
-        if (props.onDateChange) {
-          props.onDateChange(dates);
-        }
-      }
-    };
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$4, [
-        createBaseVNode("div", _hoisted_2$4, [
-          createVNode(unref(_), { icon: "filter_list" }),
-          createVNode(unref(y), {
-            variant: "subtitle",
-            isStrong: ""
-          }, {
-            default: withCtx(() => _cache[2] || (_cache[2] = [
-              createTextVNode("Filtrar dados:")
-            ])),
-            _: 1
-          }),
-          createVNode(AmCardV3, { class: "flex-1 !p-0 h-9 flex items-center" }, {
-            default: withCtx(() => [
-              createVNode(unref(script$1), {
-                options: _ctx.seasonalityOptions,
-                placeholder: _ctx.seasonalityPlaceholder,
-                optionLabel: "label",
-                optionValue: "value",
-                class: "w-full custom-select",
-                size: "small",
-                multiple: false,
-                modelValue: selectedSeasonality.value,
-                "onUpdate:modelValue": [
-                  _cache[0] || (_cache[0] = ($event) => selectedSeasonality.value = $event),
-                  handleSeasonalityChange
-                ]
-              }, null, 8, ["options", "placeholder", "modelValue"])
-            ]),
-            _: 1
-          })
-        ]),
-        createBaseVNode("div", _hoisted_3$4, [
-          createVNode(unref(he), {
-            modelValue: selectedDates.value,
-            "onUpdate:modelValue": [
-              _cache[1] || (_cache[1] = ($event) => selectedDates.value = $event),
-              handleDateChange
-            ],
-            dateRangeConfigs
-          }, null, 8, ["modelValue"])
-        ])
-      ]);
-    };
-  }
-});
-const FilterBar = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-d428539d"]]);
-const ALL_SEASONALITY = [
-  "weekly",
-  "biweekly",
-  "monthly",
-  "bimonthly",
-  "quarterly",
-  "semiannual",
-  "annual"
-];
-function useSubscriptionGraphics() {
-  const { loadGraphics: loadGraphics2, setDateRange: setDateRange2, setSeasonality: setSeasonality2, data, loadingGraphics, error } = useMetricsData();
-  const seasonalityMap = {
-    1: "annual",
-    2: "semiannual",
-    3: "quarterly",
-    4: "monthly",
-    5: "biweekly",
-    6: "weekly",
-    7: "bimonthly"
-  };
-  let isInitializing = false;
-  let debounceTimeout = null;
-  const debouncedLoadGraphics = () => {
-    if (debounceTimeout) {
-      clearTimeout(debounceTimeout);
-    }
-    debounceTimeout = setTimeout(async () => {
-      await loadGraphics2();
-    }, 100);
-  };
-  const handleDateChange = async (dates) => {
-    if (isInitializing || !dates.length) return;
-    if (dates.length === 2) {
-      setDateRange2({
-        start: new Date(dates[0]),
-        end: new Date(dates[1])
-      });
-      debouncedLoadGraphics();
-    }
-  };
-  const handleSeasonalityChange = async (values) => {
-    if (isInitializing) return;
-    if (values === 0) {
-      setSeasonality2([...ALL_SEASONALITY]);
-      debouncedLoadGraphics();
-      return;
-    }
-    const normalized = Array.isArray(values) ? values : values === null || values === void 0 ? [] : [values];
-    console.log("Seasonality change handler called:", normalized);
-    const seasonality = normalized.map((value) => seasonalityMap[value]);
-    setSeasonality2(seasonality);
-    debouncedLoadGraphics();
-  };
-  const graphicsData = computed(() => {
-    var _a, _b, _c, _d, _e, _f, _g, _h;
-    return {
-      seasonality: ((_b = (_a = data.value) == null ? void 0 : _a.graphics) == null ? void 0 : _b.seasonality) || null,
-      activeClients: ((_d = (_c = data.value) == null ? void 0 : _c.graphics) == null ? void 0 : _d.active_clients) || null,
-      topSubscriptions: ((_f = (_e = data.value) == null ? void 0 : _e.graphics) == null ? void 0 : _f.top_subscriptions) || [],
-      revenueChart: ((_h = (_g = data.value) == null ? void 0 : _g.graphics) == null ? void 0 : _h.revenue_chart) || []
-    };
-  });
-  const loadInitialData = async () => {
-    try {
-      isInitializing = true;
-      await loadGraphics2();
-    } catch (error2) {
-      console.error("Error loading graphics data:", error2);
-    } finally {
-      isInitializing = false;
-    }
-  };
-  return {
-    // Estado
-    graphicsData,
-    loading: computed(() => loadingGraphics.value),
-    error: computed(() => error.value),
-    // Handlers
-    handleDateChange,
-    handleSeasonalityChange,
-    loadInitialData,
-    // Configurações
-    seasonalityOptions: [
-      { label: "Todos", value: 0 },
-      { label: "Anual", value: 1 },
-      { label: "Semestral", value: 2 },
-      { label: "Trimestral", value: 3 },
-      { label: "Bimestral", value: 7 },
-      { label: "Mensal", value: 4 },
-      { label: "Quinzenal", value: 5 },
-      { label: "Semanal", value: 6 }
-    ]
-  };
-}
-const _hoisted_1$3 = { class: "flex items-center gap-2" };
-const _hoisted_2$3 = {
-  key: 0,
-  class: "skeleton-container"
-};
-const _hoisted_3$3 = {
-  key: 1,
-  class: "flex items-center gap-4 lg:gap-16 flex-1"
-};
-const _hoisted_4$3 = { class: "relative w-48 h-48 lg:w-64 lg:h-64 flex-shrink-0 chart-container" };
-const _hoisted_5$3 = { class: "chart-wrapper" };
-const _hoisted_6$3 = { class: "chart-center-text" };
-const _hoisted_7$3 = { class: "flex flex-col justify-center space-y-3 flex-1" };
-const _hoisted_8$2 = { key: 0 };
-const _hoisted_9$2 = {
-  key: 0,
-  class: "flex items-center gap-2 text-sm"
-};
-const _hoisted_10$1 = {
-  key: 1,
-  class: "empty-legend"
-};
-const _hoisted_11 = { class: "flex items-center gap-2 text-sm" };
-const helperText = "Distribuição das assinaturas ativas por tipo de sazonalidade com a quantidade e valor total.";
-const title = "Assinaturas por sazonalidade";
-const _sfc_main$3 = /* @__PURE__ */ defineComponent({
-  __name: "SeasonalityCard",
-  setup(__props) {
-    const { graphicsData, loading: loadingGraphics } = useSubscriptionGraphics();
-    const { selectedSeasonality } = useMetricsData();
-    const seasonalityColors = {
-      annual: "#9B6AFA",
-      semiannual: "#33C1A0",
-      quarterly: "#4E5AF0",
-      bimonthly: "#FF6B6B",
-      monthly: "#F66DFF",
-      biweekly: "#6A9CFA",
-      weekly: "#F5B041"
-    };
-    const allSeasonalityData = computed(() => {
-      var _a;
-      if (!((_a = graphicsData.value) == null ? void 0 : _a.seasonality)) return [];
-      const { breakdown } = graphicsData.value.seasonality;
-      const getSeasonalityValue = (type) => {
-        const item = breakdown[type];
-        return {
-          count: (item == null ? void 0 : item.count) ?? 0,
-          total: (item == null ? void 0 : item.total) ?? "0,00"
-        };
-      };
-      const weekly = getSeasonalityValue("weekly");
-      const biweekly = getSeasonalityValue("biweekly");
-      const monthly = getSeasonalityValue("monthly");
-      const bimonthly = getSeasonalityValue("bimonthly");
-      const quarterly = getSeasonalityValue("quarterly");
-      const semiannual = getSeasonalityValue("semiannual");
-      const annual = getSeasonalityValue("annual");
-      return [
-        {
-          name: "Semanal",
-          type: "weekly",
-          hex: seasonalityColors.weekly,
-          quantity: weekly.count,
-          value: `R$ ${weekly.total}`
-        },
-        {
-          name: "Quinzenal",
-          type: "biweekly",
-          hex: seasonalityColors.biweekly,
-          quantity: biweekly.count,
-          value: `R$ ${biweekly.total}`
-        },
-        {
-          name: "Mensal",
-          type: "monthly",
-          hex: seasonalityColors.monthly,
-          quantity: monthly.count,
-          value: `R$ ${monthly.total}`
-        },
-        {
-          name: "Bimestral",
-          type: "bimonthly",
-          hex: seasonalityColors.bimonthly,
-          quantity: bimonthly.count,
-          value: `R$ ${bimonthly.total}`
-        },
-        {
-          name: "Trimestral",
-          type: "quarterly",
-          hex: seasonalityColors.quarterly,
-          quantity: quarterly.count,
-          value: `R$ ${quarterly.total}`
-        },
-        {
-          name: "Semestral",
-          type: "semiannual",
-          hex: seasonalityColors.semiannual,
-          quantity: semiannual.count,
-          value: `R$ ${semiannual.total}`
-        },
-        {
-          name: "Anual",
-          type: "annual",
-          hex: seasonalityColors.annual,
-          quantity: annual.count,
-          value: `R$ ${annual.total}`
-        }
-      ];
-    });
-    const seasonalityData = computed(() => {
-      if (!selectedSeasonality.value || selectedSeasonality.value.length === 0) {
-        return allSeasonalityData.value;
-      }
-      return allSeasonalityData.value.filter(
-        (item) => selectedSeasonality.value.includes(item.type)
-      );
-    });
-    const total = computed(() => {
-      return seasonalityData.value.reduce((sum, item) => sum + item.quantity, 0);
-    });
-    const hasData = computed(() => total.value > 0);
-    const colors = computed(() => seasonalityData.value.map((item) => item.hex));
-    const emptyDoughnutData = computed(() => ({
-      labels: ["Sem dados"],
-      datasets: [
-        {
-          data: [1],
-          backgroundColor: ["#E0E0E0"],
-          hoverBackgroundColor: ["#E0E0E0"],
-          borderWidth: 0
-        }
-      ]
-    }));
-    const doughnutData = computed(() => {
-      if (!hasData.value) {
-        return emptyDoughnutData.value;
-      }
-      return {
-        labels: seasonalityData.value.map((item) => item.name),
-        datasets: [
-          {
-            data: seasonalityData.value.map((item) => item.quantity),
-            backgroundColor: colors.value,
-            hoverBackgroundColor: colors.value,
-            borderWidth: 0
-          }
-        ]
-      };
-    });
-    const doughnutOptions = {
-      responsive: true,
-      maintainAspectRatio: false,
-      cutout: "80%",
-      plugins: {
-        legend: { display: false },
-        tooltip: { enabled: false }
-      },
-      animation: { animateRotate: true }
-    };
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(C), {
-        class: "space-y-8 h-full flex flex-col w-full",
-        style: { "min-height": "301px" }
-      }, {
-        default: withCtx(() => [
-          createBaseVNode("div", _hoisted_1$3, [
-            createVNode(unref(y), {
-              variant: "subtitle",
-              isStrong: ""
-            }, {
-              default: withCtx(() => [
-                createTextVNode(toDisplayString(title))
-              ]),
-              _: 1
-            }),
-            createVNode(unref(H), {
-              text: helperText,
-              size: "sm"
-            })
-          ]),
-          unref(loadingGraphics) ? (openBlock(), createElementBlock("div", _hoisted_2$3, [
-            createVNode(AmSkeleton, {
-              width: 280,
-              height: 20,
-              class: "skeleton-item skeleton-1"
-            }),
-            createVNode(AmSkeleton, {
-              width: 220,
-              height: 20,
-              class: "skeleton-item skeleton-2"
-            }),
-            createVNode(AmSkeleton, {
-              width: 160,
-              height: 20,
-              class: "skeleton-item skeleton-3"
-            }),
-            createVNode(AmSkeleton, {
-              width: 240,
-              height: 20,
-              class: "skeleton-item skeleton-4"
-            })
-          ])) : (openBlock(), createElementBlock("div", _hoisted_3$3, [
-            createBaseVNode("div", _hoisted_4$3, [
-              createBaseVNode("div", _hoisted_5$3, [
-                createVNode(unref(script$2), {
-                  type: "doughnut",
-                  data: doughnutData.value,
-                  options: doughnutOptions,
-                  class: "chart-canvas"
-                }, null, 8, ["data"])
-              ]),
-              createBaseVNode("div", _hoisted_6$3, [
-                hasData.value ? (openBlock(), createBlock(unref(y), {
-                  key: 0,
-                  variant: "title",
-                  isStrong: ""
-                }, {
-                  default: withCtx(() => [
-                    createTextVNode(toDisplayString(total.value), 1)
-                  ]),
-                  _: 1
-                })) : (openBlock(), createBlock(unref(y), {
-                  key: 1,
-                  class: "empty-state-text text-center"
-                }, {
-                  default: withCtx(() => _cache[0] || (_cache[0] = [
-                    createTextVNode(" Sem assinaturas"),
-                    createBaseVNode("br", null, null, -1),
-                    createTextVNode("no período ")
-                  ])),
-                  _: 1
-                }))
-              ])
-            ]),
-            createBaseVNode("div", _hoisted_7$3, [
-              hasData.value ? (openBlock(), createElementBlock("div", _hoisted_8$2, [
-                (openBlock(true), createElementBlock(Fragment, null, renderList(seasonalityData.value, (item) => {
-                  return openBlock(), createElementBlock(Fragment, {
-                    key: item.name
-                  }, [
-                    item.quantity > 0 ? (openBlock(), createElementBlock("div", _hoisted_9$2, [
-                      createBaseVNode("div", {
-                        class: "w-4 h-4 rounded",
-                        style: normalizeStyle(`background-color: ${item.hex}`)
-                      }, null, 4),
-                      createVNode(unref(y), null, {
-                        default: withCtx(() => [
-                          createTextVNode(toDisplayString(item.name) + " (" + toDisplayString(item.quantity) + ") ", 1),
-                          createBaseVNode("strong", null, toDisplayString(item.value), 1)
-                        ]),
-                        _: 2
-                      }, 1024)
-                    ])) : createCommentVNode("", true)
-                  ], 64);
-                }), 128))
-              ])) : (openBlock(), createElementBlock("div", _hoisted_10$1, [
-                createBaseVNode("div", _hoisted_11, [
-                  _cache[2] || (_cache[2] = createBaseVNode("div", {
-                    class: "w-4 h-4 rounded",
-                    style: { "background-color": "#E0E0E0" }
-                  }, null, -1)),
-                  createVNode(unref(y), { class: "text-muted-color" }, {
-                    default: withCtx(() => _cache[1] || (_cache[1] = [
-                      createTextVNode("Sem assinaturas no período")
-                    ])),
-                    _: 1
-                  })
-                ])
-              ]))
-            ])
-          ]))
-        ]),
-        _: 1
-      });
-    };
-  }
-});
-const SeasonalityCard = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-54613e4a"]]);
-const _hoisted_1$2 = { class: "space-y-1 p-8 pt-2 border-r border-surface-200 border-solid" };
-const _hoisted_2$2 = {
-  key: 0,
-  class: "skeleton-container"
-};
-const _hoisted_3$2 = { class: "space-y-1 p-8 pt-2" };
-const _hoisted_4$2 = {
-  key: 0,
-  class: "skeleton-container"
-};
-const _hoisted_5$2 = { class: "col-span-2 space-y-1 p-8 pb-2 border-t border-surface-200 border-solid" };
-const _hoisted_6$2 = {
-  key: 0,
-  class: "bottom-skeleton-container"
-};
-const _hoisted_7$2 = {
-  key: 0,
-  class: "empty-state-container"
-};
-const activeClientsLabel = "Quantidade de clientes ativos";
-const averageTicketLabel = "Ticket médio por cliente";
-const topSubscriptionsLabel = "Top 3 assinaturas mais vendidas";
-const _sfc_main$2 = /* @__PURE__ */ defineComponent({
-  __name: "ActiveClientsCard",
-  setup(__props) {
-    const { graphicsData, loading } = useSubscriptionGraphics();
-    const activeClients = computed(() => {
-      var _a, _b;
-      return ((_b = (_a = graphicsData.value) == null ? void 0 : _a.activeClients) == null ? void 0 : _b.count) || 0;
-    });
-    const formattedAverageTicket = computed(() => {
-      var _a, _b;
-      const avgTicket = ((_b = (_a = graphicsData.value) == null ? void 0 : _a.activeClients) == null ? void 0 : _b.avg_ticket) || "0,00";
-      const numericValue = parseFloat(avgTicket.replace(",", "."));
-      return new Intl.NumberFormat("pt-BR", {
-        style: "currency",
-        currency: "BRL",
-        minimumFractionDigits: 2
-      }).format(numericValue);
-    });
-    const topSubscriptions = computed(() => {
-      var _a;
-      return ((_a = graphicsData.value) == null ? void 0 : _a.topSubscriptions) || [];
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(C), {
-        class: "grid grid-cols-2 text-center h-full w-full",
-        style: { "min-height": "301px" }
-      }, {
-        default: withCtx(() => [
-          createBaseVNode("div", _hoisted_1$2, [
-            unref(loading) ? (openBlock(), createElementBlock("div", _hoisted_2$2, [
-              createVNode(AmSkeleton, {
-                width: 80,
-                height: 40,
-                class: "skeleton-primary"
-              }),
-              createVNode(AmSkeleton, {
-                width: 140,
-                height: 16,
-                class: "skeleton-secondary"
-              }),
-              createVNode(AmSkeleton, {
-                width: 120,
-                height: 16,
-                class: "skeleton-tertiary"
-              })
-            ])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-              createVNode(unref(y), {
-                variant: "title",
-                isStrong: ""
-              }, {
-                default: withCtx(() => [
-                  createTextVNode(toDisplayString(activeClients.value), 1)
-                ]),
-                _: 1
-              }),
-              createVNode(unref(y), { class: "text-muted-color" }, {
-                default: withCtx(() => [
-                  createTextVNode(toDisplayString(activeClientsLabel))
-                ]),
-                _: 1
-              })
-            ], 64))
-          ]),
-          createBaseVNode("div", _hoisted_3$2, [
-            unref(loading) ? (openBlock(), createElementBlock("div", _hoisted_4$2, [
-              createVNode(AmSkeleton, {
-                width: 80,
-                height: 40,
-                class: "skeleton-primary"
-              }),
-              createVNode(AmSkeleton, {
-                width: 140,
-                height: 16,
-                class: "skeleton-secondary"
-              }),
-              createVNode(AmSkeleton, {
-                width: 120,
-                height: 16,
-                class: "skeleton-tertiary"
-              })
-            ])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-              createVNode(unref(y), {
-                variant: "title",
-                isStrong: ""
-              }, {
-                default: withCtx(() => [
-                  createTextVNode(toDisplayString(formattedAverageTicket.value), 1)
-                ]),
-                _: 1
-              }),
-              createVNode(unref(y), { class: "text-muted-color" }, {
-                default: withCtx(() => [
-                  createTextVNode(toDisplayString(averageTicketLabel))
-                ]),
-                _: 1
-              })
-            ], 64))
-          ]),
-          createBaseVNode("div", _hoisted_5$2, [
-            createVNode(unref(y), { isStrong: "" }, {
-              default: withCtx(() => [
-                createTextVNode(toDisplayString(topSubscriptionsLabel))
-              ]),
-              _: 1
-            }),
-            unref(loading) ? (openBlock(), createElementBlock("div", _hoisted_6$2, [
-              createVNode(AmSkeleton, {
-                width: 280,
-                height: 20,
-                class: "bottom-skeleton-top"
-              }),
-              createVNode(AmSkeleton, {
-                width: 220,
-                height: 20,
-                class: "bottom-skeleton-2"
-              }),
-              createVNode(AmSkeleton, {
-                width: 160,
-                height: 20,
-                class: "bottom-skeleton-3"
-              }),
-              createVNode(AmSkeleton, {
-                width: 240,
-                height: 20,
-                class: "bottom-skeleton-bottom"
-              })
-            ])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-              topSubscriptions.value.length === 0 ? (openBlock(), createElementBlock("div", _hoisted_7$2, [
-                createVNode(unref(y), { class: "text-muted-color" }, {
-                  default: withCtx(() => _cache[0] || (_cache[0] = [
-                    createTextVNode("Não há dados a exibir")
-                  ])),
-                  _: 1
-                })
-              ])) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(topSubscriptions.value, (subscription) => {
-                return openBlock(), createBlock(unref(y), {
-                  key: subscription,
-                  class: "text-muted-color"
-                }, {
-                  default: withCtx(() => [
-                    createTextVNode(toDisplayString(subscription), 1)
-                  ]),
-                  _: 2
-                }, 1024);
-              }), 128))
-            ], 64))
-          ])
-        ]),
-        _: 1
-      });
-    };
-  }
-});
-const ActiveClientsCard = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-9b5091aa"]]);
-const _hoisted_1$1 = { class: "w-full" };
-const _hoisted_2$1 = {
-  key: 0,
-  class: "w-full"
-};
-const _hoisted_3$1 = {
-  key: 1,
-  class: "w-full"
-};
-const _hoisted_4$1 = { class: "chart-wrapper w-full" };
-const _hoisted_5$1 = {
-  key: 0,
-  class: "chart-skeleton-container"
-};
-const _hoisted_6$1 = {
-  key: 1,
-  class: "empty-chart-container"
-};
-const _hoisted_7$1 = { class: "empty-chart-overlay" };
-const _hoisted_8$1 = { class: "empty-chart-label" };
-const _hoisted_9$1 = {
-  key: 2,
-  class: "chart-container"
-};
-const _hoisted_10 = {
-  key: 0,
-  class: "flex gap-4 items-center justify-start flex-wrap"
-};
-const _sfc_main$1 = /* @__PURE__ */ defineComponent({
-  __name: "LineChartCard",
-  setup(__props) {
-    const { graphicsData, loading } = useSubscriptionGraphics();
-    const chartFilterOptions = [
-      { label: "Receita por assinaturas + Assinaturas canceladas", value: "both" },
-      { label: "Apenas receita por assinaturas", value: "revenue" },
-      { label: "Apenas assinaturas canceladas", value: "canceled" }
-    ];
-    const selectedFilter = ref("both");
-    const hasData = computed(() => {
-      var _a;
-      return ((_a = graphicsData.value) == null ? void 0 : _a.revenueChart) && Array.isArray(graphicsData.value.revenueChart) && graphicsData.value.revenueChart.length > 0 && graphicsData.value.revenueChart.some((point) => point.revenue > 0 || point.canceled > 0);
-    });
-    const chartData = computed(() => {
-      var _a;
-      if (!((_a = graphicsData.value) == null ? void 0 : _a.revenueChart) || !Array.isArray(graphicsData.value.revenueChart) || graphicsData.value.revenueChart.length === 0) {
-        return {
-          labels: [],
-          datasets: []
-        };
-      }
-      const chartDataPoints = graphicsData.value.revenueChart;
-      return {
-        labels: chartDataPoints.map((point) => point.label),
-        datasets: [
-          {
-            label: "Receita por assinaturas",
-            data: chartDataPoints.map((point) => point.revenue),
-            borderColor: "#9B6AFA",
-            tension: 0.4,
-            yAxisID: "y"
-          },
-          {
-            label: "Assinaturas canceladas",
-            data: chartDataPoints.map((point) => point.canceled),
-            borderColor: "#D38913",
-            tension: 0.4,
-            yAxisID: "y1"
-          }
-        ]
-      };
-    });
-    const filteredChartData = computed(() => {
-      if (!chartData.value.datasets.length) {
-        return {
-          labels: [],
-          datasets: []
-        };
-      }
-      let datasetsToShow = [];
-      if (selectedFilter.value === "revenue") {
-        datasetsToShow = [chartData.value.datasets[0]];
-      } else if (selectedFilter.value === "canceled") {
-        datasetsToShow = [chartData.value.datasets[1]];
-      } else {
-        datasetsToShow = chartData.value.datasets;
-      }
-      return {
-        labels: chartData.value.labels,
-        datasets: datasetsToShow
-      };
-    });
-    const chartOptions = computed(() => {
-      selectedFilter.value === "both";
-      selectedFilter.value === "canceled";
-      return {
-        maintainAspectRatio: false,
-        aspectRatio: 0.6,
-        layout: {
-          padding: {
-            right: 0
-            // Remove padding à direita
-          }
-        },
-        plugins: {
-          legend: {
-            display: false
-          },
-          tooltip: {
-            callbacks: {
-              label: function(context) {
-                const datasetLabel = context.dataset.label || "";
-                const value = context.parsed.y;
-                if (context.dataset.yAxisID === "y") {
-                  return `${datasetLabel}: R$ ${value.toLocaleString("pt-BR", {
-                    minimumFractionDigits: 2
-                  })}`;
-                }
-                return `${datasetLabel}: ${value}`;
-              }
-            }
-          }
-        },
-        scales: {
-          x: {
-            ticks: { color: "#666" },
-            grid: { color: "#eee" }
-          },
-          y: {
-            type: "linear",
-            display: true,
-            // Sempre mostra o eixo esquerdo
-            position: "left",
-            ticks: {
-              color: "#666",
-              callback: function(value) {
-                return `R$ ${value.toLocaleString("pt-BR", { minimumFractionDigits: 2 })}`;
-              }
-            },
-            grid: { color: "#eee" }
-          },
-          y1: {
-            type: "linear",
-            display: false,
-            // Desabilita o eixo direito
-            position: "right",
-            ticks: {
-              color: "#666"
-            },
-            grid: {
-              drawOnChartArea: false,
-              color: "#eee"
-            }
-          }
-        }
-      };
-    });
-    const handleFilterChange = (value) => {
-      selectedFilter.value = value;
-    };
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(C), { class: "col-span-12 space-y-4" }, {
-        default: withCtx(() => [
-          createBaseVNode("div", _hoisted_1$1, [
-            unref(loading) ? (openBlock(), createElementBlock("div", _hoisted_2$1, [
-              createVNode(AmSkeleton, {
-                width: 250,
-                height: 40
-              })
-            ])) : (openBlock(), createElementBlock("div", _hoisted_3$1, [
-              createVNode(unref(script$1), {
-                options: chartFilterOptions,
-                optionLabel: "label",
-                optionValue: "value",
-                modelValue: selectedFilter.value,
-                "onUpdate:modelValue": [
-                  _cache[0] || (_cache[0] = ($event) => selectedFilter.value = $event),
-                  handleFilterChange
-                ],
-                size: "small",
-                class: "w-full"
-              }, null, 8, ["modelValue"])
-            ]))
-          ]),
-          createBaseVNode("div", _hoisted_4$1, [
-            unref(loading) ? (openBlock(), createElementBlock("div", _hoisted_5$1, [
-              createVNode(AmSkeleton, {
-                width: 200,
-                height: 20,
-                class: "chart-skeleton-item chart-skeleton-1"
-              }),
-              createVNode(AmSkeleton, {
-                width: 240,
-                height: 20,
-                class: "chart-skeleton-item chart-skeleton-2"
-              }),
-              createVNode(AmSkeleton, {
-                width: 320,
-                height: 20,
-                class: "chart-skeleton-item chart-skeleton-3"
-              })
-            ])) : !hasData.value ? (openBlock(), createElementBlock("div", _hoisted_6$1, [
-              createVNode(unref(script$2), {
-                type: "line",
-                data: { labels: [], datasets: [] },
-                options: chartOptions.value
-              }, null, 8, ["options"]),
-              createBaseVNode("div", _hoisted_7$1, [
-                createBaseVNode("div", _hoisted_8$1, [
-                  _cache[2] || (_cache[2] = createBaseVNode("div", { class: "empty-chart-bullet" }, null, -1)),
-                  createVNode(unref(y), { class: "empty-chart-text" }, {
-                    default: withCtx(() => _cache[1] || (_cache[1] = [
-                      createTextVNode("Nenhum dado a ser exibido")
-                    ])),
-                    _: 1
-                  })
-                ])
-              ])
-            ])) : (openBlock(), createElementBlock("div", _hoisted_9$1, [
-              createVNode(unref(script$2), {
-                type: "line",
-                data: filteredChartData.value,
-                options: chartOptions.value
-              }, null, 8, ["data", "options"])
-            ]))
-          ]),
-          !unref(loading) && hasData.value && filteredChartData.value.datasets.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_10, [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(filteredChartData.value.datasets, (dataset) => {
-              return openBlock(), createElementBlock("div", {
-                key: dataset.label,
-                class: "flex items-center gap-2"
-              }, [
-                createBaseVNode("div", {
-                  class: "w-3 h-3 rounded-full",
-                  style: normalizeStyle(`background-color: ${dataset.borderColor}`)
-                }, null, 4),
-                createVNode(unref(y), { class: "text-sm" }, {
-                  default: withCtx(() => [
-                    createTextVNode(toDisplayString(dataset.label), 1)
-                  ]),
-                  _: 2
-                }, 1024)
-              ]);
-            }), 128))
-          ])) : createCommentVNode("", true)
-        ]),
-        _: 1
-      });
-    };
-  }
-});
-const LineChartCard = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-d8551ddc"]]);
-const _hoisted_1 = { class: "dashboard-container" };
-const _hoisted_2 = { class: "dashboard-grid" };
-const _hoisted_3 = { class: "metrics-section" };
-const _hoisted_4 = { class: "recovery-section" };
-const _hoisted_5 = { class: "filters-section" };
-const _hoisted_6 = { class: "cards-row-section" };
-const _hoisted_7 = { class: "seasonality-section" };
-const _hoisted_8 = { class: "clients-section" };
-const _hoisted_9 = { class: "chart-section" };
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "RecurringSubscriptionDashView",
-  setup(__props) {
-    const route = useRoute();
-    const sidebar = useSidebarStore();
-    const { initialize: initialize2, selectedSeasonality } = useMetricsData();
-    const {
-      handleDateChange,
-      handleSeasonalityChange,
-      seasonalityOptions,
-      loadInitialData
-    } = useSubscriptionGraphics();
-    const { isEmpty, totalRecords, loading, fetchSubscriptions } = useRecurringTable();
-    const showSubscriptionModal = computed(() => {
-      const hasSubscriptionMenuItem = sidebar.items.value.find(
-        (item) => item.href.includes("/v2/client/integration/subscriptions")
-      );
-      const isSubscriptionRoute = route.name === "subscription.dashboard";
-      const isTableEmpty = isEmpty.value || totalRecords.value === 0;
-      return hasSubscriptionMenuItem && isSubscriptionRoute && isTableEmpty && !loading.value;
-    });
-    onMounted(async () => {
-      try {
-        await Promise.all([
-          initialize2(),
-          loadInitialData(),
-          fetchSubscriptions()
-        ]);
-      } catch (error) {
-        console.error("Error during initialization:", error);
-      }
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1, [
-        createBaseVNode("div", _hoisted_2, [
-          createBaseVNode("div", _hoisted_3, [
-            createVNode(TotalRevenueCard),
-            createVNode(NewSubscriptionsCard),
-            createVNode(ChurnCard)
-          ]),
-          createBaseVNode("div", _hoisted_4, [
-            createVNode(SubscriptionRecoveryCard)
-          ]),
-          !showSubscriptionModal.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-            createBaseVNode("div", _hoisted_5, [
-              createVNode(FilterBar, {
-                "seasonality-options": unref(seasonalityOptions),
-                "selected-seasonality-types": unref(selectedSeasonality),
-                onDateChange: unref(handleDateChange),
-                onSeasonalityChange: unref(handleSeasonalityChange)
-              }, null, 8, ["seasonality-options", "selected-seasonality-types", "onDateChange", "onSeasonalityChange"])
-            ]),
-            createBaseVNode("div", _hoisted_6, [
-              createBaseVNode("div", _hoisted_7, [
-                createVNode(SeasonalityCard)
-              ]),
-              createBaseVNode("div", _hoisted_8, [
-                createVNode(ActiveClientsCard)
-              ])
-            ]),
-            createBaseVNode("div", _hoisted_9, [
-              createVNode(LineChartCard)
-            ])
-          ], 64)) : createCommentVNode("", true)
-        ])
-      ]);
-    };
-  }
-});
-const RecurringSubscriptionDashView = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-d7f2f23e"]]);
-export {
-  RecurringSubscriptionDashView as default
-};