hfn-components 0.2.8 → 0.3.0

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

@@ -51,6 +51,10 @@ export declare const HtChart: import("hfn-components/es/utils").SFCWithInstall<i
         readonly type: BooleanConstructor;
         readonly default: true;
     };
+    readonly auxiliaryData: {
+        readonly type: ObjectConstructor;
+        readonly default: null;
+    };
     readonly downLoadAutn: {
         readonly type: BooleanConstructor;
         readonly default: false;
@@ -74,6 +78,7 @@ export declare const HtChart: import("hfn-components/es/utils").SFCWithInstall<i
         readonly tooltipUnit: string;
         readonly watchResize: boolean;
         readonly showLegend: boolean;
+        readonly auxiliaryData: Record<string, any>;
         readonly downLoadAutn: boolean;
         readonly lineColor: string[];
     } & {}>;
@@ -142,6 +147,10 @@ export declare const HtChart: import("hfn-components/es/utils").SFCWithInstall<i
         readonly type: BooleanConstructor;
         readonly default: true;
     };
+    readonly auxiliaryData: {
+        readonly type: ObjectConstructor;
+        readonly default: null;
+    };
     readonly downLoadAutn: {
         readonly type: BooleanConstructor;
         readonly default: false;
@@ -164,6 +173,7 @@ export declare const HtChart: import("hfn-components/es/utils").SFCWithInstall<i
     readonly tooltipUnit: string;
     readonly watchResize: boolean;
     readonly showLegend: boolean;
+    readonly auxiliaryData: Record<string, any>;
     readonly downLoadAutn: boolean;
     readonly lineColor: string[];
 }, {}>> & Record<string, any>;

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

@@ -53,6 +53,10 @@ export declare const chartProps: {
         readonly type: BooleanConstructor;
         readonly default: true;
     };
+    readonly auxiliaryData: {
+        readonly type: ObjectConstructor;
+        readonly default: null;
+    };
     readonly downLoadAutn: {
         readonly type: BooleanConstructor;
         readonly default: false;

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

@@ -63,6 +63,11 @@ const chartProps = {
     type: Boolean,
     default: true
   },
+  //堆叠辅助数据
+  auxiliaryData: {
+    type: Object,
+    default: null
+  },
   //数据下载
   downLoadAutn: {
     type: Boolean,

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

@@ -58,6 +58,10 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: BooleanConstructor;
         readonly default: true;
     };
+    readonly auxiliaryData: {
+        readonly type: ObjectConstructor;
+        readonly default: null;
+    };
     readonly downLoadAutn: {
         readonly type: BooleanConstructor;
         readonly default: false;
@@ -81,6 +85,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly tooltipUnit: string;
         readonly watchResize: boolean;
         readonly showLegend: boolean;
+        readonly auxiliaryData: Record<string, any>;
         readonly downLoadAutn: boolean;
         readonly lineColor: string[];
     } & {}>;
@@ -149,6 +154,10 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: BooleanConstructor;
         readonly default: true;
     };
+    readonly auxiliaryData: {
+        readonly type: ObjectConstructor;
+        readonly default: null;
+    };
     readonly downLoadAutn: {
         readonly type: BooleanConstructor;
         readonly default: false;
@@ -171,6 +180,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly tooltipUnit: string;
     readonly watchResize: boolean;
     readonly showLegend: boolean;
+    readonly auxiliaryData: Record<string, any>;
     readonly downLoadAutn: boolean;
     readonly lineColor: string[];
 }, {}>;

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

@@ -17,6 +17,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     watch(
       () => props.chartData,
       (val) => {
+        console.log(val);
         echartOptions.series = cloneDeep(val);
         drawGraph();
       },
@@ -35,7 +36,6 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       (val) => {
         if (val && val.length > 0) {
           echartOptions.color = props.lineColor;
-          console.log(props.lineColor);
           if (myChart.value) {
             echartInit();
           }

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

@@ -15,10 +15,6 @@ export declare const HtPieChart: import("hfn-components/es/utils").SFCWithInstal
         readonly type: StringConstructor;
         readonly default: "";
     };
-    readonly customizePercentage: {
-        readonly type: BooleanConstructor;
-        readonly default: false;
-    };
     readonly floatNumber: {
         readonly type: NumberConstructor;
         readonly default: 2;
@@ -44,7 +40,6 @@ export declare const HtPieChart: import("hfn-components/es/utils").SFCWithInstal
         readonly lineColor: string[];
         readonly legendData: Record<string, any>;
         readonly legendType: string;
-        readonly customizePercentage: boolean;
         readonly legendFormatter: Function;
     } & {}>;
     myChart: import("vue").ShallowRef<any>;
@@ -72,10 +67,6 @@ export declare const HtPieChart: import("hfn-components/es/utils").SFCWithInstal
         readonly type: StringConstructor;
         readonly default: "";
     };
-    readonly customizePercentage: {
-        readonly type: BooleanConstructor;
-        readonly default: false;
-    };
     readonly floatNumber: {
         readonly type: NumberConstructor;
         readonly default: 2;
@@ -100,7 +91,6 @@ export declare const HtPieChart: import("hfn-components/es/utils").SFCWithInstal
     readonly lineColor: string[];
     readonly legendData: Record<string, any>;
     readonly legendType: string;
-    readonly customizePercentage: boolean;
     readonly legendFormatter: Function;
 }, {}>> & Record<string, any>;
 export default HtPieChart;

package/es/components/pieChart/src/HtPieChart.d.ts

@@ -16,10 +16,6 @@ export declare const pieProps: {
         readonly type: StringConstructor;
         readonly default: "";
     };
-    readonly customizePercentage: {
-        readonly type: BooleanConstructor;
-        readonly default: false;
-    };
     readonly floatNumber: {
         readonly type: NumberConstructor;
         readonly default: 2;

package/es/components/pieChart/src/HtPieChart.mjs

@@ -19,11 +19,6 @@ const pieProps = {
     type: String,
     default: ""
   },
-  //是否自定义百分比
-  customizePercentage: {
-    type: Boolean,
-    default: false
-  },
   //保留几位小数
   floatNumber: {
     type: Number,

package/es/components/pieChart/src/HtPieChart.vue.d.ts

@@ -15,10 +15,6 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: StringConstructor;
         readonly default: "";
     };
-    readonly customizePercentage: {
-        readonly type: BooleanConstructor;
-        readonly default: false;
-    };
     readonly floatNumber: {
         readonly type: NumberConstructor;
         readonly default: 2;
@@ -44,7 +40,6 @@ declare const _default: import("vue").DefineComponent<{
         readonly lineColor: string[];
         readonly legendData: Record<string, any>;
         readonly legendType: string;
-        readonly customizePercentage: boolean;
         readonly legendFormatter: Function;
     } & {}>;
     myChart: import("vue").ShallowRef<any>;
@@ -72,10 +67,6 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: StringConstructor;
         readonly default: "";
     };
-    readonly customizePercentage: {
-        readonly type: BooleanConstructor;
-        readonly default: false;
-    };
     readonly floatNumber: {
         readonly type: NumberConstructor;
         readonly default: 2;
@@ -100,7 +91,6 @@ declare const _default: import("vue").DefineComponent<{
     readonly lineColor: string[];
     readonly legendData: Record<string, any>;
     readonly legendType: string;
-    readonly customizePercentage: boolean;
     readonly legendFormatter: Function;
 }, {}>;
 export default _default;

package/es/components/pieChart/src/HtPieChart.vue2.mjs

@@ -26,6 +26,18 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         chartResize();
       }
     );
+    watch(
+      () => props.lineColor,
+      (val) => {
+        if (val && val.length > 0) {
+          echartOptions.color = props.lineColor;
+          if (myChart.value) {
+            echartInit();
+          }
+        }
+      },
+      { deep: true, immediate: true }
+    );
     const chartResize = () => {
       myChart.value.resize();
     };
@@ -60,7 +72,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
           let html;
           html = `<div>${params.seriesName}</div>`;
           html += `<span> ${params.name}: 
-            ${props.customizePercentage ? params.data.value : params.percent.toFixed(props.floatNumber)}%<span>`;
+            ${params.data.percent ? (params.data.percent * 100).toFixed(props.floatNumber) : params.percent.toFixed(props.floatNumber)}%<span>`;
           return html;
         }
       };

package/es/constants/chartConfig.mjs

@@ -95,8 +95,7 @@ const BASIC_PIE_CONFIG = {
       label: {
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         formatter: function(params) {
-          console.log(params);
-          const val = params.percent.toFixed(2);
+          const val = params.data.percent ? (params.data.percent * 100).toFixed(2) : params.percent.toFixed(2);
           return ` ${params.name}: ${val}%`;
         },
         fontWeight: "bolder",

package/es/utils/chart.mjs

@@ -66,6 +66,7 @@ const setEchartXAxis = (options, type, xAxisData) => {
     options.xAxis = {
       type,
       data: xAxis,
+      boundaryGap: false,
       axisTick: {
         alignWithLabel: true
       }
@@ -138,6 +139,11 @@ const setEchartTooltip = (options, props) => {
                 html += `<span style='color:${params[i].color}'>
                         ${params[i].seriesName}</span>\uFF1A${params[i].value[1].toFixed(2)}%
                       `;
+              } else if (props.chartType === "category") {
+                console.log(props.auxiliaryData);
+                html += `<span style='color:${params[i].color}'>
+                ${params[i].seriesName}</span>\uFF1A${props.auxiliaryData[params[i].seriesName][params[0].name]}(${params[i].value || params[i].value === 0 ? Number(params[i].value).toFixed(props.floatNumber) : ""}%)
+              `;
               } else {
                 html += `<span style='color:${params[i].color}'>${params[i].seriesName}</span>\uFF1A${params[i].value[2]?.toFixed(props.floatNumber)}\uFF08${params[i].value[1] > 0 ? "+" : ""}${params[i].value[1]}%\uFF09`;
               }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hfn-components",
-  "version": "0.2.8",
+  "version": "0.3.0",
   "description": "",
   "main": "index.ts",
   "module": "es/index.mjs",