hfn-components 0.6.0 → 0.6.1

package/es/components/chart/src/HtChart.vue.mjs

@@ -1,90 +0,0 @@
-import _sfc_main from './HtChart.vue2.mjs';
-import { openBlock, createElementBlock, Fragment, renderList, normalizeStyle, createCommentVNode, createElementVNode, toDisplayString } from 'vue';
-import _export_sfc from '../../../_virtual/_plugin-vue_export-helper.mjs';
-
-const _hoisted_1 = { class: "echart-box" };
-const _hoisted_2 = {
-  key: 0,
-  class: "echart-lenged"
-};
-const _hoisted_3 = ["onClick", "onMouseover"];
-const _hoisted_4 = ["id"];
-const _hoisted_5 = {
-  key: 1,
-  class: "noData"
-};
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("div", _hoisted_1, [
-    _ctx.showLegend && !$setup.isEmpty ? (openBlock(), createElementBlock("div", _hoisted_2, [
-      (openBlock(true), createElementBlock(
-        Fragment,
-        null,
-        renderList($setup.allLegend, (item, index) => {
-          return openBlock(), createElementBlock("div", {
-            class: "span-box mb10",
-            key: index,
-            onClick: ($event) => $setup.legendStatus(item, index),
-            onMouseover: ($event) => $setup.legendEnter(index),
-            onMouseleave: _cache[0] || (_cache[0] = ($event) => $setup.legendLeave())
-          }, [
-            item.lineType === "line" ? (openBlock(), createElementBlock(
-              "span",
-              {
-                key: 0,
-                class: "bg-span",
-                style: normalizeStyle({ background: item.isShow ? item.color : "#ccc" })
-              },
-              null,
-              4
-              /* STYLE */
-            )) : createCommentVNode("v-if", true),
-            item.lineType === "bar" ? (openBlock(), createElementBlock(
-              "span",
-              {
-                key: 1,
-                class: "bg-span-bar",
-                style: normalizeStyle({ background: item.isShow ? item.color : "#ccc" })
-              },
-              null,
-              4
-              /* STYLE */
-            )) : createCommentVNode("v-if", true),
-            createElementVNode(
-              "span",
-              {
-                style: normalizeStyle({ color: item.isShow ? "#000" : "#ccc" })
-              },
-              toDisplayString(item.name),
-              5
-              /* TEXT, STYLE */
-            ),
-            createCommentVNode(` <span
-          v-if="isLegend"
-          class="returnRatio"
-          :style="{ color: item.isShow ? (item.returnRatio > 0 ? 'red' : item.returnRatio < 0 ? 'green' : '#000') : '#ccc' }"
-        >
-          {{
-            item.name !== '\u57FA\u91D1\u89C4\u6A21' && item.name !== '\u603B\u5E02\u503C' && item.name !== '\u6D41\u901A\u5E02\u503C'
-              ? item.returnRatio === ''
-                ? ''
-                : item.returnRatio.toFixed(2) + (isPercent || specialPercent ? '%' : '')
-              : \`\${item.returnRatio}\${props.tooltipUnit}\`
-          }}
-        </span> `)
-          ], 40, _hoisted_3);
-        }),
-        128
-        /* KEYED_FRAGMENT */
-      ))
-    ])) : createCommentVNode("v-if", true),
-    createElementVNode("div", {
-      class: "echart-content",
-      id: _ctx.chartId
-    }, null, 8, _hoisted_4),
-    createCommentVNode(" \u56FE\u4F8B\u5168\u7F6E\u7070\u76D2\u5B50 "),
-    $setup.noData ? (openBlock(), createElementBlock("div", _hoisted_5, "\u6682\u65E0\u6570\u636E")) : createCommentVNode("v-if", true)
-  ]);
-}
-var chart = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/zhanghang/Documents/project/component-library/packages/components/chart/src/HtChart.vue"]]);
-
-export { chart as default };

package/es/components/chart/src/HtChart.vue2.mjs

@@ -1,109 +0,0 @@
-import { defineComponent, shallowRef, ref, reactive, watch } from 'vue';
-import { BASIC_CHART_CONFIG } from '../../../constants/chartConfig.mjs';
-import { chartProps } from './HtChart.mjs';
-import cloneDeep from 'lodash.clonedeep';
-import { setEchartTitle, setEchartXAxis, setEchartYAxis, setEchartTooltip, legendEnterOperate, legendLeaveOperate } from '../../../utils/chart.mjs';
-import * as echarts from 'echarts/core';
-
-var _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "HtChart",
-  props: chartProps,
-  setup(__props, { expose: __expose }) {
-    __expose();
-    const props = __props;
-    const myChart = shallowRef();
-    const isEmpty = ref(false);
-    const echartOptions = reactive(cloneDeep(BASIC_CHART_CONFIG));
-    watch(
-      () => props.chartData,
-      (val) => {
-        echartOptions.series = cloneDeep(val);
-        drawGraph();
-      },
-      {
-        deep: true
-      }
-    );
-    watch(
-      () => props.watchResize,
-      () => {
-        chartResize();
-      }
-    );
-    watch(
-      () => props.lineColor,
-      (val) => {
-        if (val && val.length > 0) {
-          echartOptions.color = props.lineColor;
-          if (myChart.value) {
-            echartInit();
-          }
-        }
-      },
-      { deep: true, immediate: true }
-    );
-    const drawGraph = () => {
-      if (props.lineColor && props.lineColor.length > 0) {
-        echartOptions.color = props.lineColor;
-      }
-      setEchartTitle(echartOptions, props);
-      setEchartXAxis(echartOptions, props.chartType, props.xAxisData);
-      setEchartYAxis(echartOptions, props);
-      setEchartTooltip(echartOptions, props);
-      lengedDeal();
-      echartInit();
-    };
-    const lengedDeal = () => {
-      allLegend.value = [];
-      props.chartData.forEach((item, index) => {
-        const data = {
-          name: item.name,
-          isShow: true,
-          lineType: item.type,
-          color: echartOptions.color[index % echartOptions.color.length]
-        };
-        allLegend.value.push(data);
-      });
-    };
-    const echartInit = () => {
-      setTimeout(() => {
-        if (!myChart.value) {
-          const ele = document.getElementById(props.chartId);
-          myChart.value = echarts.init(ele, null, { devicePixelRatio: 2, locale: "ZH" });
-        }
-        myChart.value.setOption(echartOptions, true);
-      }, 200);
-    };
-    const chartResize = () => {
-      myChart.value.resize();
-    };
-    const allLegend = ref([]);
-    const noData = ref(false);
-    const legendStatus = (item, index) => {
-      const status = !item.isShow;
-      allLegend.value[index].isShow = status;
-      if (allLegend.value.every((item2) => item2.isShow === false)) {
-        noData.value = true;
-      } else {
-        noData.value = false;
-      }
-      myChart.value.dispatchAction({
-        type: "legendToggleSelect",
-        name: item.name
-      });
-    };
-    const legendEnter = (index) => {
-      legendEnterOperate(echartOptions, allLegend.value[index].name);
-      myChart.value.setOption(echartOptions);
-    };
-    const legendLeave = () => {
-      legendLeaveOperate(echartOptions);
-      myChart.value.setOption(echartOptions);
-    };
-    const __returned__ = { props, myChart, isEmpty, echartOptions, drawGraph, lengedDeal, echartInit, chartResize, allLegend, noData, legendStatus, legendEnter, legendLeave };
-    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
-    return __returned__;
-  }
-});
-
-export { _sfc_main as default };

package/es/components/chart/src/chartConfig.d.ts

@@ -1,7 +0,0 @@
-import * as echarts from 'echarts/core';
-import type { BarSeriesOption, LineSeriesOption } from 'echarts/charts';
-import type { TitleComponentOption, TooltipComponentOption, GridComponentOption, DatasetComponentOption } from 'echarts/components';
-import type { ComposeOption } from 'echarts/core';
-export type ECOption = ComposeOption<BarSeriesOption | LineSeriesOption | TitleComponentOption | TooltipComponentOption | GridComponentOption | DatasetComponentOption>;
-export default echarts;
-export declare const BASIC_CHART_CONFIG: any;

package/es/components/chart/src/chartConfig.mjs

@@ -1,88 +0,0 @@
-import * as echarts from 'echarts/core';
-export { echarts as default };
-import { BarChart, LineChart } from 'echarts/charts';
-import { TitleComponent, TooltipComponent, GridComponent, LegendComponent, DatasetComponent, TransformComponent } from 'echarts/components';
-import { LabelLayout, UniversalTransition } from 'echarts/features';
-import { CanvasRenderer } from 'echarts/renderers';
-
-echarts.use([
-  TitleComponent,
-  TooltipComponent,
-  GridComponent,
-  LegendComponent,
-  DatasetComponent,
-  TransformComponent,
-  BarChart,
-  LineChart,
-  LabelLayout,
-  UniversalTransition,
-  CanvasRenderer
-]);
-const BASIC_CHART_CONFIG = {
-  title: {
-    text: "",
-    // top: '5%',
-    left: "0%",
-    textStyle: {
-      fontSize: 12,
-      color: "rgba(0,0,0,0.7)",
-      fontWeight: "normal"
-    }
-  },
-  // 图例
-  legend: {
-    left: "0%",
-    show: false
-  },
-  xAxis: {},
-  yAxis: {},
-  grid: {
-    // top: '12%',
-    top: "8%",
-    left: "3%",
-    right: "3%",
-    bottom: "1%",
-    containLabel: true
-  },
-  // 线条颜色
-  color: [
-    "#C13431",
-    "#1E85D2",
-    "#FD984F",
-    "#63B9BB",
-    "#BBB162",
-    "#AE76C1",
-    "#5E92F6",
-    "#F5BC32",
-    "#DA8484",
-    "#41982E",
-    "#437095",
-    "#8060A7",
-    "#7D0A0D",
-    "#572AFF",
-    "#2BE8F8",
-    "#FF1493",
-    "#E066FF",
-    "#27408B",
-    "#5191A3",
-    "#D5634C",
-    "#92d6fd",
-    "#b92e2d",
-    "#187bc9",
-    "#90bae0",
-    "#187bc9",
-    "#0070C9",
-    "#5470c6",
-    "#91cc75",
-    "#fac858",
-    "#ee6666",
-    "#73c0de",
-    "#3ba272",
-    "#fc8452",
-    "#9a60b4",
-    "#ea7ccc"
-  ],
-  series: []
-};
-
-export { BASIC_CHART_CONFIG };

package/es/components/chart/style/index.d.ts

@@ -1 +0,0 @@
-import 'hfn-components/theme-chalk/src/chart.scss';

package/es/components/chart/style/index.mjs

@@ -1 +0,0 @@
-import 'hfn-components/theme-chalk/src/chart.scss';