appmax-client-vue3 5.0.3 → 5.0.4

package/dist/OrdersChartDataContent-D0A7inHp.js

@@ -1,221 +0,0 @@
-import { ab as defineComponent, e as computed, g as createElementBlock, h as openBlock, l as unref, i as createVNode, y, w as withCtx, m as createTextVNode, t as toDisplayString, j as createBaseVNode, D as normalizeProps, N as guardReactiveProps, S as normalizeStyle, _ as _export_sfc } from "./main-Cykj4Wra.js";
-import { s as script } from "./index-C-awpmH8.js";
-import { v as v4 } from "./v4-CQle4GE4.js";
-const _hoisted_1$1 = ["id"];
-const _sfc_main$1 = /* @__PURE__ */ defineComponent({
-  __name: "Chart",
-  props: {
-    title: {
-      type: String,
-      default: ""
-    },
-    description: {
-      type: String,
-      default: ""
-    },
-    value: {
-      type: Array,
-      default: () => []
-    },
-    backgroundColor: {
-      type: String,
-      default: "#a7dfc5"
-    },
-    currency: {
-      type: String,
-      default: "BRL"
-    },
-    width: { type: Number, default: 100 },
-    height: { type: Number, default: 300 },
-    toolTipLabel: { type: String, default: "" },
-    xAxisKey: { type: String, default: "date" },
-    yAxisKey: { type: String, default: "amount" },
-    xAxisFontSize: { type: Number, default: 12 },
-    xAxisFontWeight: { type: Number, default: 400 },
-    xAxisFontFamily: { type: String, default: "Sarabun" },
-    xAxisFontColor: { type: String, default: "#535d73" },
-    xLabelCallback: {
-      type: Function,
-      default: (value) => value
-    },
-    yAxisFontSize: { type: Number, default: 12 },
-    yAxisFontWeight: { type: Number, default: 400 },
-    yAxisFontFamily: { type: String, default: "Sarabun" },
-    yAxisFontColor: { type: String, default: "#535d73" },
-    yLabelCallback: {
-      type: Function,
-      default: (value) => value
-    },
-    gridLinesColor: { type: String, default: "#ccd7eb" },
-    chartTitleText: { type: String, default: "" },
-    chartTitleAlign: { type: String, default: "start" },
-    chartTitleColor: { type: String, default: "#B2B2B2" },
-    chartTitleFontSize: { type: Number, default: 16 },
-    chartTitleFontFamily: { type: String, default: "Sarabun" },
-    chartTitleFontWeight: { type: Number, default: 400 }
-  },
-  setup(__props) {
-    const props = __props;
-    const chartId = (props == null ? void 0 : props._id) || `am-chart-${v4()}`;
-    const chartData = computed(() => ({
-      labels: props.value.map((item) => item[props.xAxisKey]),
-      datasets: [
-        {
-          label: props.toolTipLabel,
-          backgroundColor: props.backgroundColor,
-          data: props.value.map((item) => item[props.yAxisKey])
-        }
-      ]
-    }));
-    const chartOptions = computed(() => ({
-      responsive: true,
-      maintainAspectRatio: false,
-      plugins: {
-        title: {
-          display: !!props.chartTitleText,
-          text: props.chartTitleText,
-          color: props.chartTitleColor,
-          align: props.chartTitleAlign,
-          font: {
-            family: props.chartTitleFontFamily,
-            size: props.chartTitleFontSize,
-            weight: props.chartTitleFontWeight
-          },
-          padding: { top: 10, bottom: 20 }
-        },
-        legend: { display: false },
-        tooltip: {
-          displayColors: false,
-          callbacks: {
-            label: (context) => {
-              return new Intl.NumberFormat("pt-BR", {
-                style: "currency",
-                currency: props.currency
-              }).format(context.raw);
-            },
-            title: (context) => context[0].label || ""
-          }
-        }
-      },
-      scales: {
-        x: {
-          ticks: {
-            callback: props.xLabelCallback,
-            font: {
-              family: props.xAxisFontFamily,
-              size: props.xAxisFontSize,
-              weight: props.xAxisFontWeight
-            },
-            color: props.xAxisFontColor
-          },
-          grid: { display: false }
-        },
-        y: {
-          ticks: {
-            callback: props.yLabelCallback,
-            font: {
-              family: props.yAxisFontFamily,
-              size: props.yAxisFontSize,
-              weight: props.yAxisFontWeight
-            },
-            color: props.yAxisFontColor
-          },
-          grid: {
-            color: props.gridLinesColor,
-            drawBorder: false
-          }
-        }
-      }
-    }));
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", { id: unref(chartId) }, [
-        createVNode(unref(y), null, {
-          default: withCtx(() => [
-            createTextVNode(toDisplayString(__props.title), 1)
-          ]),
-          _: 1
-        }),
-        createVNode(unref(y), null, {
-          default: withCtx(() => [
-            createTextVNode(toDisplayString(__props.description), 1)
-          ]),
-          _: 1
-        }),
-        createVNode(unref(script), {
-          type: "bar",
-          data: chartData.value,
-          options: chartOptions.value,
-          width: __props.width,
-          height: __props.height
-        }, null, 8, ["data", "options", "width", "height"])
-      ], 8, _hoisted_1$1);
-    };
-  }
-});
-const _hoisted_1 = ["data-test"];
-const _hoisted_2 = ["data-test"];
-const TEXT_COLOR = "#707070";
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "OrdersChartDataContent",
-  props: {
-    id: {},
-    title: {},
-    currency: {},
-    items: {}
-  },
-  setup(__props) {
-    const props = __props;
-    const minWidth = computed(() => {
-      const total = props.items.length;
-      const WIDTH_BAR = 40;
-      const WIDTH_SPACES = 100;
-      const value = total * WIDTH_BAR + WIDTH_SPACES;
-      return `${value}px`;
-    });
-    const chartData = computed(() => ({
-      chartTitleFontSize: 12,
-      value: props.items,
-      currency: props.currency,
-      height: 235,
-      backgroundColor: "rgba(155, 106, 250, .6)",
-      xAxisKey: "date",
-      xAxisDisplay: true,
-      xAxisFontColor: TEXT_COLOR,
-      xLabelCallback: (index) => {
-        const item = props.items[index];
-        return item.date.replace(/\/\d{4}/, "");
-      },
-      yAxisKey: "amount",
-      yAxisFontSize: 12,
-      yAxisFontWeight: 400,
-      yAxisFontColor: TEXT_COLOR
-    }));
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        class: "dashboard-orders-chart-data-content",
-        "data-test": `${_ctx.id}-content`
-      }, [
-        createBaseVNode("div", {
-          style: normalizeStyle({ minWidth: minWidth.value }),
-          "data-test": `${_ctx.id}-wrapper-content`
-        }, [
-          createVNode(unref(y), {
-            class: "text-muted-color mb-2",
-            isStrong: "",
-            "data-test": `${_ctx.id}-label`
-          }, {
-            default: withCtx(() => [
-              createTextVNode(toDisplayString(_ctx.title), 1)
-            ]),
-            _: 1
-          }, 8, ["data-test"]),
-          createVNode(_sfc_main$1, normalizeProps(guardReactiveProps(chartData.value)), null, 16)
-        ], 12, _hoisted_2)
-      ], 8, _hoisted_1);
-    };
-  }
-});
-const OrdersChartDataContent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-676230ba"]]);
-export {
-  OrdersChartDataContent as default
-};