@ued_fpi/data-visual 1.2.14 → 1.2.19

package/dist/lib/wgms/src/SevenDayKline/index.vue.d.ts

@@ -1,77 +1,46 @@
+import type { SEVEN_DAY_KLINE_API_REQUEST } from './api/types';
 declare const _default: import("vue").DefineComponent<{
-    beginTime: {
-        type: NumberConstructor;
-        default: number;
-    };
-    endTime: {
-        type: NumberConstructor;
-        default: number;
-    };
-    factor: {
-        type: NumberConstructor;
-        default: number;
-    };
-    accessCode: {
-        type: StringConstructor;
-        default: string;
-    };
-    timeType: {
-        type: StringConstructor;
-        default: string;
-    };
-    factorFlag: {
+    params: {
+        type: globalThis.PropType<SEVEN_DAY_KLINE_API_REQUEST.requestParamsTs>;
+        default: () => {
+            accessCode: string;
+            factor: number;
+            factorFlag: boolean;
+            alarmTime: number;
+            timeDiff: number;
+            queryTimeType: string;
+            factorName: string;
+            factorCode: string;
+            factorUnit: string;
+        };
+    };
+    isLazy: {
         type: BooleanConstructor;
         default: boolean;
     };
-    factorName: {
-        type: StringConstructor;
-        default: string;
-    };
-    factorUnit: {
-        type: StringConstructor;
-        default: string;
-    };
-}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    beginTime: {
-        type: NumberConstructor;
-        default: number;
-    };
-    endTime: {
-        type: NumberConstructor;
-        default: number;
-    };
-    factor: {
-        type: NumberConstructor;
-        default: number;
-    };
-    accessCode: {
-        type: StringConstructor;
-        default: string;
-    };
-    timeType: {
-        type: StringConstructor;
-        default: string;
-    };
-    factorFlag: {
+}, {
+    reload: () => Promise<void>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    params: {
+        type: globalThis.PropType<SEVEN_DAY_KLINE_API_REQUEST.requestParamsTs>;
+        default: () => {
+            accessCode: string;
+            factor: number;
+            factorFlag: boolean;
+            alarmTime: number;
+            timeDiff: number;
+            queryTimeType: string;
+            factorName: string;
+            factorCode: string;
+            factorUnit: string;
+        };
+    };
+    isLazy: {
         type: BooleanConstructor;
         default: boolean;
     };
-    factorName: {
-        type: StringConstructor;
-        default: string;
-    };
-    factorUnit: {
-        type: StringConstructor;
-        default: string;
-    };
 }>>, {
-    factor: number;
-    beginTime: number;
-    endTime: number;
-    timeType: string;
-    factorName: string;
-    factorUnit: string;
-    accessCode: string;
-    factorFlag: boolean;
+    params: SEVEN_DAY_KLINE_API_REQUEST.requestParamsTs;
+    isLazy: boolean;
 }, {}>;
 export default _default;

package/dist/lib/wgms/src/SevenDayKline/index.vue.js

@@ -12,42 +12,30 @@ const _hoisted_1 = { class: "dv-wgms-seven-day-kline" };
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "index",
   props: {
-    beginTime: {
-      type: Number,
-      default: dayjs().startOf("year").valueOf()
-    },
-    endTime: {
-      type: Number,
-      default: dayjs().endOf("year").valueOf()
-    },
-    factor: {
-      type: Number,
-      default: 27
-    },
-    accessCode: {
-      type: String,
-      default: "GKA330100_2009"
-    },
-    timeType: {
-      type: String,
-      default: "day"
+    params: {
+      type: Object,
+      default: () => {
+        return {
+          accessCode: "3116008",
+          factor: 2,
+          factorFlag: false,
+          alarmTime: 1700028e6,
+          timeDiff: 7,
+          queryTimeType: "hour",
+          // 下面是因子
+          factorName: "总磷(以 P 计）",
+          factorCode: "w21003",
+          // 监测因子
+          factorUnit: "mg/L"
+        };
+      }
     },
-    factorFlag: {
+    isLazy: {
       type: Boolean,
       default: false
-    },
-    // 因子名称
-    factorName: {
-      type: String,
-      default: "总磷(以 P 计）"
-    },
-    // 因子单位
-    factorUnit: {
-      type: String,
-      default: "mg/L"
     }
   },
-  setup(__props) {
+  setup(__props, { expose: __expose }) {
     const props = __props;
     const chartSevenDayLine = vue.ref();
     const option = vue.ref(void 0);
@@ -58,117 +46,38 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       month: "月",
       year: "年"
     };
-    const data = vue.reactive({
-      title: "",
-      unit: "mg/L",
-      factorName: "总磷(以 P 计）",
-      params: {
-        accessCode: "JMSZSY0007",
-        factor: 27,
-        factorFlag: false,
-        beginTime: 16706016e5,
-        endTime: 1671206399999,
-        queryTimeType: "hour"
+    const getKlineDateParams = (alarmTime, timeDiff) => {
+      let startTime, endTime;
+      if (props.params?.queryTimeType === "hour" || props.params?.queryTimeType === "day") {
+        startTime = dayjs(alarmTime).add(-(timeDiff - 1), "days").startOf("day").format("x");
+        endTime = dayjs(alarmTime).add(1, "days").startOf("day").format("x");
+      } else if (props.params?.queryTimeType === "week") {
+        startTime = dayjs(alarmTime).add(-(timeDiff - 1), "week").startOf("week").format("x");
+        endTime = dayjs(alarmTime).add(1, "week").startOf("week").format("x");
+      } else if (props.params?.queryTimeType === "month") {
+        startTime = dayjs(alarmTime).add(-(timeDiff - 1), "month").startOf("month").format("x");
+        endTime = dayjs(alarmTime).add(1, "month").startOf("month").format("x");
+      } else if (props.params?.queryTimeType === "year") {
+        startTime = dayjs(alarmTime).add(-(timeDiff - 1), "year").startOf("year").format("x");
+        endTime = dayjs(alarmTime).add(1, "year").startOf("year").format("x");
       }
-    });
-    vue.watch(() => [props.beginTime, props.endTime, props.factor, props.accessCode, props.timeType, props.factorFlag], () => {
-      initData();
-    });
-    vue.onMounted(async () => {
-      await vue.nextTick();
-      initData();
-    });
-    const initData = () => {
-      data.params = {
-        accessCode: props?.accessCode,
-        factor: props?.factor,
-        factorFlag: props?.factorFlag,
-        beginTime: props?.beginTime,
-        endTime: props?.endTime,
-        queryTimeType: props?.timeType
+      return {
+        startTime,
+        endTime
       };
-      data.factorName = props?.factorName;
-      data.unit = props?.factorUnit;
-      getData();
-    };
-    const getYearWeek = async (date) => {
-      const checkDate = new Date(date);
-      checkDate.setDate(checkDate.getDate() + 4 - (checkDate.getDay() || 7));
-      const time = checkDate.getTime();
-      checkDate.setMonth(0);
-      checkDate.setDate(1);
-      const week = Math.floor(Math.round((time - checkDate) / 864e5) / 7) + 2;
-      return week;
     };
     const getData = async () => {
-      const res = await index.getKLine(data.params);
-      const isHasData = res && res.data && res.data.length > 0;
-      const mockData = [
-        {
-          time: "1671120000000",
-          value: "0.21",
-          quality: 2,
-          maxValue: "0.25",
-          minValue: "0.2",
-          firstValue: "0.2",
-          lastValue: "0.25"
-        },
-        {
-          time: "1671206400000",
-          value: "0.23",
-          quality: 2,
-          maxValue: "0.28",
-          minValue: "0.19",
-          firstValue: "0.28",
-          lastValue: "0.19"
-        },
-        {
-          time: "1671292800000",
-          value: "0.18",
-          quality: 2,
-          maxValue: "0.19",
-          minValue: "0.17",
-          firstValue: "0.19",
-          lastValue: "0.18"
-        },
-        {
-          time: "1671379200000",
-          value: "0.18",
-          quality: 2,
-          maxValue: "0.19",
-          minValue: "0.18",
-          firstValue: "0.18",
-          lastValue: "0.19"
-        },
-        {
-          time: "1671465600000",
-          value: "0.18",
-          quality: 2,
-          maxValue: "0.2",
-          minValue: "0.16",
-          firstValue: "0.18",
-          lastValue: "0.16"
-        },
-        {
-          time: "1671552000000",
-          value: "0.07",
-          quality: 1,
-          maxValue: "0.17",
-          minValue: "0.02",
-          firstValue: "0.17",
-          lastValue: "0.02"
-        },
-        {
-          time: "1671638400000",
-          value: "0.51",
-          quality: 3,
-          maxValue: "0.02",
-          minValue: "0.02",
-          firstValue: "0.02",
-          lastValue: "0.02"
-        }
-      ];
-      const resData = isHasData ? res?.data : mockData;
+      const { startTime, endTime } = getKlineDateParams(props.params?.alarmTime, props.params?.timeDiff);
+      const params = {
+        accessCode: props.params?.accessCode,
+        factor: props.params?.factor,
+        factorFlag: props.params?.factorFlag,
+        beginTime: startTime,
+        endTime,
+        queryTimeType: props.params?.queryTimeType === "hour" ? "day" : props.params.queryTimeType
+      };
+      const res = await index.getKLine(params);
+      const resData = res?.data || [];
       const klineData = {
         xAxis: [],
         kData: [],
@@ -176,38 +85,45 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         quality: []
       };
       resData.forEach((item) => {
-        item.maxValue = Number(item.maxValue);
-        item.minValue = Number(item.minValue);
-        if (props.timeType === "week")
-          klineData.xAxis.push(`${getYearWeek(+item.time)}周`);
-        else
-          klineData.xAxis.push(dayjs.unix(Number(item.time) / 1e3).format("MM-DD"));
-        klineData.kData.push([item.minValue, item.firstValue, item.value, item.lastValue, item.maxValue]);
-        klineData.values.push(item.value);
-        klineData.quality.push(item.quality);
+        item.maxValue = Number(item.max);
+        item.minValue = Number(item.min);
+        if (props.params?.queryTimeType === "hour" || props.params?.queryTimeType === "day") {
+          klineData.xAxis.push(dayjs(item.time).format("MM-DD"));
+        } else {
+          klineData.xAxis.push(item.time);
+        }
+        klineData.kData.push([
+          item.min,
+          item.first,
+          item.avg,
+          item.last,
+          item.max
+        ]);
+        klineData.values.push(item.avg);
+        klineData.quality.push(item.grade);
       });
       const maxObj = lodashEs.maxBy(resData, "maxValue");
       const minObj = lodashEs.minBy(resData, "minValue");
       vue.nextTick();
-      option.value = await dayKLine(klineData, maxObj?.maxValue, minObj?.minValue, data.factorName, data.unit, timeStrList[props.timeType]);
+      option.value = await dayKLine(klineData, maxObj?.maxValue, minObj?.minValue, props.params?.factorName, props?.params?.factorUnit, timeStrList[props.params?.queryTimeType]);
     };
-    const dayKLine = async (data2, min, max, factorName, unit, timeStr) => {
-      const { xAxis, kData, values, quality } = data2;
+    const dayKLine = async (data, min, max, factorName, unit, timeStr) => {
+      const { xAxis, kData, values, quality } = data;
       const res = await index.waterSurfaceListAll({});
       const gradeList = res?.entries ?? [];
       const option2 = {
         grid: [
           {
-            top: 45,
-            left: 45,
-            right: 22,
-            height: 60
+            left: 40,
+            right: 20,
+            top: 40,
+            height: xAxis.length > 7 ? 70 : 80
           },
           {
-            left: 45,
-            right: 32,
-            top: 140,
-            height: "20%"
+            left: 40,
+            right: 20,
+            top: xAxis.length > 7 ? "68%" : "72%",
+            height: "25%"
           }
         ],
         tooltip: {
@@ -340,23 +256,21 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                   return currData.length ? currData[0].color : "#6D7278";
               }
             },
-            // 等级数字转等级文字信息
-            // data: values
-            data: values.map((item, index) => {
-              const colorList = ["#03A9F4", "#1976D2", "#85C941", "#D9CC4C", "#EE8E00", "#E12234"];
-              return {
-                value: item,
-                itemStyle: {
-                  color: colorList[index]
-                }
-              };
-            })
+            data: values
           }
         ]
       };
       return option2;
     };
-    vue.toRefs(data);
+    vue.onMounted(() => {
+      !props.isLazy && getData();
+    });
+    vue.watch([() => props.params, () => props.isLazy], () => {
+      !props.isLazy && getData();
+    }, { deep: true });
+    __expose({
+      reload: getData
+    });
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
         vue.createElementVNode("div", {

package/dist/lib/wgms/src/SewageOutletsOnlineMonitor/api/types.d.ts

@@ -9,6 +9,10 @@ export declare namespace OUTLETS_ONLINE_RES {
             onlineCount: number;
             percent: number;
             value: number;
+            rate: number | string;
+            itemStyle: {
+                color: string;
+            };
         }[];
         total: number;
     }

package/dist/lib/wgms/src/SewageOutletsOnlineMonitor/index.d.ts

@@ -4,9 +4,11 @@ export declare const DvWgmsSewageOutletsOnlineMonitor: {
         $: import("vue").ComponentInternalInstance;
         $data: {};
         $props: {
+            data?: any;
             params?: {
                 regionCode: string;
             } | undefined;
+            isLazy?: boolean | undefined;
             colorArr?: string[] | undefined;
             key?: string | number | symbol | undefined;
             style?: unknown;
@@ -67,6 +69,30 @@ export declare const DvWgmsSewageOutletsOnlineMonitor: {
         $emit: (event: string, ...args: any[]) => void;
         $el: any;
         $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+            data: {
+                type: globalThis.PropType<any>;
+                required: true;
+            } & {
+                default: () => {
+                    total: number;
+                    0: {
+                        name: string;
+                        value: number;
+                        rate: number;
+                        itemStyle: {
+                            color: string;
+                        };
+                    }[];
+                    1: {
+                        name: string;
+                        value: number;
+                        rate: number;
+                        itemStyle: {
+                            color: string;
+                        };
+                    }[];
+                };
+            };
             params: {
                 type: globalThis.PropType<{
                     regionCode: string;
@@ -77,6 +103,12 @@ export declare const DvWgmsSewageOutletsOnlineMonitor: {
                     regionCode: string;
                 };
             };
+            isLazy: {
+                type: globalThis.PropType<boolean>;
+                required: true;
+            } & {
+                default: boolean;
+            };
             colorArr: {
                 type: globalThis.PropType<string[]>;
                 required: true;
@@ -84,9 +116,11 @@ export declare const DvWgmsSewageOutletsOnlineMonitor: {
                 default: () => string[];
             };
         }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
+            data: any;
             params: {
                 regionCode: string;
             };
+            isLazy: boolean;
             colorArr: string[];
         }, {}, string, {}> & {
             beforeCreate?: ((() => void) | (() => void)[]) | undefined;
@@ -109,6 +143,30 @@ export declare const DvWgmsSewageOutletsOnlineMonitor: {
         $nextTick: typeof import("vue").nextTick;
         $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
     } & Readonly<import("vue").ExtractPropTypes<{
+        data: {
+            type: globalThis.PropType<any>;
+            required: true;
+        } & {
+            default: () => {
+                total: number;
+                0: {
+                    name: string;
+                    value: number;
+                    rate: number;
+                    itemStyle: {
+                        color: string;
+                    };
+                }[];
+                1: {
+                    name: string;
+                    value: number;
+                    rate: number;
+                    itemStyle: {
+                        color: string;
+                    };
+                }[];
+            };
+        };
         params: {
             type: globalThis.PropType<{
                 regionCode: string;
@@ -119,6 +177,12 @@ export declare const DvWgmsSewageOutletsOnlineMonitor: {
                 regionCode: string;
             };
         };
+        isLazy: {
+            type: globalThis.PropType<boolean>;
+            required: true;
+        } & {
+            default: boolean;
+        };
         colorArr: {
             type: globalThis.PropType<string[]>;
             required: true;
@@ -130,6 +194,30 @@ export declare const DvWgmsSewageOutletsOnlineMonitor: {
     __isTeleport?: undefined;
     __isSuspense?: undefined;
 } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+    data: {
+        type: globalThis.PropType<any>;
+        required: true;
+    } & {
+        default: () => {
+            total: number;
+            0: {
+                name: string;
+                value: number;
+                rate: number;
+                itemStyle: {
+                    color: string;
+                };
+            }[];
+            1: {
+                name: string;
+                value: number;
+                rate: number;
+                itemStyle: {
+                    color: string;
+                };
+            }[];
+        };
+    };
     params: {
         type: globalThis.PropType<{
             regionCode: string;
@@ -140,6 +228,12 @@ export declare const DvWgmsSewageOutletsOnlineMonitor: {
             regionCode: string;
         };
     };
+    isLazy: {
+        type: globalThis.PropType<boolean>;
+        required: true;
+    } & {
+        default: boolean;
+    };
     colorArr: {
         type: globalThis.PropType<string[]>;
         required: true;
@@ -147,9 +241,11 @@ export declare const DvWgmsSewageOutletsOnlineMonitor: {
         default: () => string[];
     };
 }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
+    data: any;
     params: {
         regionCode: string;
     };
+    isLazy: boolean;
     colorArr: string[];
 }, {}, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("vue").Plugin<any[]>;
 export default _SewageOutletsOnlineMonitor;

package/dist/lib/wgms/src/SewageOutletsOnlineMonitor/index.vue.d.ts

@@ -4,25 +4,71 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
         regionCode: string;
     };
     colorArr: string[];
+    data: null | any;
+    isLazy: boolean;
 }>, {
     params: () => {
         regionCode: string;
     };
     colorArr: () => string[];
+    data: () => {
+        total: number;
+        0: {
+            name: string;
+            value: number;
+            rate: number;
+            itemStyle: {
+                color: string;
+            };
+        }[];
+        1: {
+            name: string;
+            value: number;
+            rate: number;
+            itemStyle: {
+                color: string;
+            };
+        }[];
+    };
+    isLazy: boolean;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     params: {
         regionCode: string;
     };
     colorArr: string[];
+    data: null | any;
+    isLazy: boolean;
 }>, {
     params: () => {
         regionCode: string;
     };
     colorArr: () => string[];
+    data: () => {
+        total: number;
+        0: {
+            name: string;
+            value: number;
+            rate: number;
+            itemStyle: {
+                color: string;
+            };
+        }[];
+        1: {
+            name: string;
+            value: number;
+            rate: number;
+            itemStyle: {
+                color: string;
+            };
+        }[];
+    };
+    isLazy: boolean;
 }>>>, {
+    data: null | any;
     params: {
         regionCode: string;
     };
+    isLazy: boolean;
     colorArr: string[];
 }, {}>;
 export default _default;