hfn-components 0.2.7 → 0.2.8

package/dist/index.css

@@ -0,0 +1 @@
+.echart-box{display:flex;flex-direction:column;height:100%;position:relative;width:100%}.echart-content{flex:auto}.echart-lenged{box-sizing:border-box;display:flex;flex-wrap:wrap;font-size:12px;height:auto;margin-top:6px;padding-right:22px;position:relative;width:100%;z-index:999}.bg-span{height:2px;width:14px}.bg-span,.bg-span-bar{display:inline-block;margin-right:6px}.bg-span-bar{border-radius:2px;height:10px;width:16px}.span-box{cursor:pointer;margin-left:5px;margin-right:6px}.noData,.span-box{align-items:center;display:flex}.noData{bottom:0;color:#ccc;font-size:16px;justify-content:center;position:absolute}._100,.noData{height:100%;width:100%}

package/es/_virtual/_plugin-vue_export-helper.mjs

@@ -0,0 +1,9 @@
+var _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+
+export { _export_sfc as default };

package/es/component.d.ts

@@ -0,0 +1,3 @@
+import type { Plugin } from 'vue';
+declare const _default: Plugin[];
+export default _default;

package/es/component.mjs

@@ -0,0 +1,12 @@
+import { HtElTable } from './components/elTable/index.mjs';
+import { HtChart } from './components/chart/index.mjs';
+import { HtPieChart } from './components/pieChart/index.mjs';
+
+var Components = [
+  // HtTable,
+  HtChart,
+  HtElTable,
+  HtPieChart
+];
+
+export { Components as default };

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

@@ -0,0 +1,171 @@
+export declare const HtChart: import("hfn-components/es/utils").SFCWithInstall<import("vue").DefineComponent<{
+    readonly chartData: {
+        readonly type: import("vue").PropType<any[]>;
+        readonly default: () => never[];
+    };
+    readonly chartId: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly chartType: {
+        readonly type: import("vue").PropType<import("hfn-components/es/utils").chartType>;
+        readonly default: "";
+    };
+    readonly xAxisData: {
+        readonly type: import("vue").PropType<string[]>;
+        readonly default: readonly [];
+    };
+    readonly collation: {
+        readonly type: StringConstructor;
+        readonly default: "des";
+    };
+    readonly isReturn: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly isPercent: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly floatNumber: {
+        readonly type: NumberConstructor;
+        readonly default: 4;
+    };
+    readonly titleText: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly yAxisUnit: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly tooltipUnit: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly watchResize: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly showLegend: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly downLoadAutn: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly lineColor: {
+        readonly type: import("vue").PropType<string[]>;
+        readonly default: readonly [];
+    };
+}, {
+    props: import("@vue/shared").LooseRequired<{
+        readonly chartData: any[];
+        readonly chartId: string;
+        readonly chartType: import("hfn-components/es/utils").chartType;
+        readonly xAxisData: string[];
+        readonly collation: string;
+        readonly isReturn: boolean;
+        readonly isPercent: boolean;
+        readonly floatNumber: number;
+        readonly titleText: string;
+        readonly yAxisUnit: string;
+        readonly tooltipUnit: string;
+        readonly watchResize: boolean;
+        readonly showLegend: boolean;
+        readonly downLoadAutn: boolean;
+        readonly lineColor: string[];
+    } & {}>;
+    myChart: import("vue").ShallowRef<any>;
+    isEmpty: import("vue").Ref<boolean>;
+    echartOptions: any;
+    drawGraph: () => void;
+    lengedDeal: () => void;
+    echartInit: () => void;
+    chartResize: () => void;
+    allLegend: import("vue").Ref<import("./src/HtChart.vue").Legend[]>;
+    noData: import("vue").Ref<boolean>;
+    legendStatus: (item: import("./src/HtChart.vue").Legend, index: number) => void;
+    legendEnter: (index: number) => void;
+    legendLeave: () => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly chartData: {
+        readonly type: import("vue").PropType<any[]>;
+        readonly default: () => never[];
+    };
+    readonly chartId: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly chartType: {
+        readonly type: import("vue").PropType<import("hfn-components/es/utils").chartType>;
+        readonly default: "";
+    };
+    readonly xAxisData: {
+        readonly type: import("vue").PropType<string[]>;
+        readonly default: readonly [];
+    };
+    readonly collation: {
+        readonly type: StringConstructor;
+        readonly default: "des";
+    };
+    readonly isReturn: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly isPercent: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly floatNumber: {
+        readonly type: NumberConstructor;
+        readonly default: 4;
+    };
+    readonly titleText: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly yAxisUnit: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly tooltipUnit: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly watchResize: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly showLegend: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly downLoadAutn: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly lineColor: {
+        readonly type: import("vue").PropType<string[]>;
+        readonly default: readonly [];
+    };
+}>>, {
+    readonly chartData: any[];
+    readonly chartId: string;
+    readonly chartType: import("hfn-components/es/utils").chartType;
+    readonly xAxisData: string[];
+    readonly collation: string;
+    readonly isReturn: boolean;
+    readonly isPercent: boolean;
+    readonly floatNumber: number;
+    readonly titleText: string;
+    readonly yAxisUnit: string;
+    readonly tooltipUnit: string;
+    readonly watchResize: boolean;
+    readonly showLegend: boolean;
+    readonly downLoadAutn: boolean;
+    readonly lineColor: string[];
+}, {}>> & Record<string, any>;
+export default HtChart;
+export * from './src/HtChart';

package/es/components/chart/index.mjs

@@ -0,0 +1,7 @@
+import chart from './src/HtChart.vue.mjs';
+import { withInstall } from '../../utils/common.mjs';
+export { chartProps } from './src/HtChart.mjs';
+
+const HtChart = withInstall(chart);
+
+export { HtChart, HtChart as default };

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

@@ -0,0 +1,65 @@
+import { PropType, ExtractPropTypes } from 'vue';
+import type { chartType } from 'hfn-components/es/utils';
+export declare const chartProps: {
+    readonly chartData: {
+        readonly type: PropType<any[]>;
+        readonly default: () => never[];
+    };
+    readonly chartId: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly chartType: {
+        readonly type: PropType<chartType>;
+        readonly default: "";
+    };
+    readonly xAxisData: {
+        readonly type: PropType<string[]>;
+        readonly default: readonly [];
+    };
+    readonly collation: {
+        readonly type: StringConstructor;
+        readonly default: "des";
+    };
+    readonly isReturn: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly isPercent: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly floatNumber: {
+        readonly type: NumberConstructor;
+        readonly default: 4;
+    };
+    readonly titleText: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly yAxisUnit: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly tooltipUnit: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly watchResize: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly showLegend: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly downLoadAutn: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly lineColor: {
+        readonly type: PropType<string[]>;
+        readonly default: readonly [];
+    };
+};
+export type chartProp = ExtractPropTypes<typeof chartProps>;

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

@@ -0,0 +1,77 @@
+const chartProps = {
+  //图表数据
+  chartData: {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    type: Array,
+    default: () => []
+  },
+  //图表id
+  chartId: {
+    type: String,
+    default: ""
+  },
+  //图表类型
+  chartType: {
+    type: String,
+    default: ""
+  },
+  //是类目轴时x轴数据
+  xAxisData: {
+    type: Array,
+    default: []
+  },
+  collation: {
+    type: String,
+    default: "des"
+  },
+  //是否为收益率
+  isReturn: {
+    type: Boolean,
+    default: false
+  },
+  //是否有百分比
+  isPercent: {
+    type: Boolean,
+    default: false
+  },
+  //保留几位小数
+  floatNumber: {
+    type: Number,
+    default: 4
+  },
+  //y轴文本
+  titleText: {
+    type: String,
+    default: ""
+  },
+  //Y轴单位
+  yAxisUnit: {
+    type: String,
+    default: ""
+  },
+  //tooltip单位
+  tooltipUnit: {
+    type: String,
+    default: ""
+  },
+  //图表重新加载
+  watchResize: {
+    type: Boolean,
+    default: false
+  },
+  showLegend: {
+    type: Boolean,
+    default: true
+  },
+  //数据下载
+  downLoadAutn: {
+    type: Boolean,
+    default: false
+  },
+  lineColor: {
+    type: Array,
+    default: []
+  }
+};
+
+export { chartProps };

package/es/components/chart/src/HtChart.vue.d.ts

@@ -0,0 +1,177 @@
+import type { Ref } from 'vue';
+export interface Legend {
+    name: string;
+    lineType: string;
+    isShow: boolean;
+    color: string;
+}
+declare const _default: import("vue").DefineComponent<{
+    readonly chartData: {
+        readonly type: import("vue").PropType<any[]>;
+        readonly default: () => never[];
+    };
+    readonly chartId: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly chartType: {
+        readonly type: import("vue").PropType<import("hfn-components/es/utils").chartType>;
+        readonly default: "";
+    };
+    readonly xAxisData: {
+        readonly type: import("vue").PropType<string[]>;
+        readonly default: readonly [];
+    };
+    readonly collation: {
+        readonly type: StringConstructor;
+        readonly default: "des";
+    };
+    readonly isReturn: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly isPercent: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly floatNumber: {
+        readonly type: NumberConstructor;
+        readonly default: 4;
+    };
+    readonly titleText: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly yAxisUnit: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly tooltipUnit: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly watchResize: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly showLegend: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly downLoadAutn: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly lineColor: {
+        readonly type: import("vue").PropType<string[]>;
+        readonly default: readonly [];
+    };
+}, {
+    props: import("@vue/shared").LooseRequired<{
+        readonly chartData: any[];
+        readonly chartId: string;
+        readonly chartType: import("hfn-components/es/utils").chartType;
+        readonly xAxisData: string[];
+        readonly collation: string;
+        readonly isReturn: boolean;
+        readonly isPercent: boolean;
+        readonly floatNumber: number;
+        readonly titleText: string;
+        readonly yAxisUnit: string;
+        readonly tooltipUnit: string;
+        readonly watchResize: boolean;
+        readonly showLegend: boolean;
+        readonly downLoadAutn: boolean;
+        readonly lineColor: string[];
+    } & {}>;
+    myChart: import("vue").ShallowRef<any>;
+    isEmpty: Ref<boolean>;
+    echartOptions: any;
+    drawGraph: () => void;
+    lengedDeal: () => void;
+    echartInit: () => void;
+    chartResize: () => void;
+    allLegend: Ref<Legend[]>;
+    noData: Ref<boolean>;
+    legendStatus: (item: Legend, index: number) => void;
+    legendEnter: (index: number) => void;
+    legendLeave: () => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly chartData: {
+        readonly type: import("vue").PropType<any[]>;
+        readonly default: () => never[];
+    };
+    readonly chartId: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly chartType: {
+        readonly type: import("vue").PropType<import("hfn-components/es/utils").chartType>;
+        readonly default: "";
+    };
+    readonly xAxisData: {
+        readonly type: import("vue").PropType<string[]>;
+        readonly default: readonly [];
+    };
+    readonly collation: {
+        readonly type: StringConstructor;
+        readonly default: "des";
+    };
+    readonly isReturn: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly isPercent: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly floatNumber: {
+        readonly type: NumberConstructor;
+        readonly default: 4;
+    };
+    readonly titleText: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly yAxisUnit: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly tooltipUnit: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly watchResize: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly showLegend: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly downLoadAutn: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly lineColor: {
+        readonly type: import("vue").PropType<string[]>;
+        readonly default: readonly [];
+    };
+}>>, {
+    readonly chartData: any[];
+    readonly chartId: string;
+    readonly chartType: import("hfn-components/es/utils").chartType;
+    readonly xAxisData: string[];
+    readonly collation: string;
+    readonly isReturn: boolean;
+    readonly isPercent: boolean;
+    readonly floatNumber: number;
+    readonly titleText: string;
+    readonly yAxisUnit: string;
+    readonly tooltipUnit: string;
+    readonly watchResize: boolean;
+    readonly showLegend: boolean;
+    readonly downLoadAutn: boolean;
+    readonly lineColor: string[];
+}, {}>;
+export default _default;

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

@@ -0,0 +1,90 @@
+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/libiluo/Desktop/company/component-library/packages/components/chart/src/HtChart.vue"]]);
+
+export { chart as default };