@ued_fpi/data-visual 1.0.5 → 1.0.6

package/dist/es/wgms/src/SevenDayKline/index.mjs

@@ -0,0 +1,397 @@
+import { i as install } from '../../utils/tools.mjs';
+import { defineComponent, ref, reactive, watch, onMounted, nextTick, toRefs, openBlock, createElementBlock, createElementVNode } from 'vue';
+import { d as dayjs } from '../../../vendor/dayjs@1.11.9.mjs';
+import { e as echarts } from '../../utils/echarts/index.mjs';
+import { m as maxBy, e as minBy } from '../../../vendor/lodash-es@4.17.21.mjs';
+import { _ as _export_sfc } from '../../../aims/src/AirQualityCalendar/index.mjs';
+
+const _hoisted_1 = { class: "seven-day-kline" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "index",
+  props: {
+    startTime: {
+      type: Number,
+      default: dayjs().startOf("year").valueOf()
+    },
+    endTime: {
+      type: Number,
+      default: dayjs().endOf("year").valueOf()
+    },
+    factorCode: {
+      type: String,
+      default: ""
+    },
+    siteCode: {
+      type: String,
+      default: ""
+    },
+    timeType: {
+      type: String,
+      default: "hour"
+    },
+    // 因子名称
+    factorName: {
+      type: String,
+      default: "总磷(以 P 计）"
+    },
+    // 因子单位
+    factorUnit: {
+      type: String,
+      default: "mg/L"
+    },
+    // 站点名称
+    siteName: {
+      type: String,
+      default: ""
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const chartSevenDayLine = ref();
+    const timeStrList = {
+      hour: "小时",
+      day: "日",
+      week: "周",
+      month: "月",
+      year: "年"
+    };
+    const data = reactive({
+      title: "",
+      unit: "mg/L",
+      factorName: "总磷(以 P 计）",
+      siteName: "",
+      params: {
+        startTime: 16706016e5,
+        endTime: 1671206399999,
+        factorCode: "w21011",
+        siteCode: "JMSZSY0007",
+        timeType: "day"
+      }
+    });
+    watch(() => [props.startTime, props.endTime, props.factorCode, props.siteCode, props.timeType], () => {
+      initData();
+    });
+    onMounted(async () => {
+      await nextTick();
+      initData();
+    });
+    const initData = () => {
+      data.params = {
+        startTime: props?.startTime,
+        endTime: props?.endTime,
+        factorCode: props?.factorCode,
+        siteCode: props?.siteCode,
+        timeType: props?.timeType
+      };
+      data.factorName = props?.factorName;
+      data.unit = props?.factorUnit;
+      data.siteName = props?.siteName || "";
+      data.title = `最近7天${data.siteName}${data.factorName}K线与日变化趋势图`;
+      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 resData = [
+        {
+          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 klineData = {
+        xAxis: [],
+        kData: [],
+        values: [],
+        quality: []
+      };
+      resData.forEach((item) => {
+        item.maxValue = Number(item.maxValue);
+        item.minValue = Number(item.minValue);
+        if (data.params.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);
+      });
+      const maxObj = maxBy(resData, "maxValue");
+      const minObj = minBy(resData, "minValue");
+      nextTick();
+      const lineOptions = await dayKLine(klineData, maxObj.maxValue, minObj.minValue, data.factorName, data.unit, timeStrList[data.params.timeType]);
+      echarts.draw(chartSevenDayLine.value, lineOptions);
+    };
+    const dayKLine = async (data2, min, max, factorName, unit, timeStr) => {
+      const { xAxis, kData, values, quality } = data2;
+      const gradeList = [];
+      const option = {
+        grid: [
+          {
+            top: 45,
+            left: 45,
+            right: 22,
+            height: 60
+          },
+          {
+            left: 45,
+            right: 32,
+            top: 140,
+            height: "20%"
+          }
+        ],
+        tooltip: {
+          link: { xAxisIndex: "all" },
+          trigger: "axis",
+          axisPointer: {
+            type: "shadow"
+          },
+          textStyle: {
+            color: "#b9cfe2",
+            fontFamily: "PingFang SC"
+          },
+          formatter(param) {
+            param = param[0];
+            if (param.axisIndex === 0) {
+              return [`${param.marker + param.seriesName} ${param.name}`, `最大值 ${param.data[5]}`, `最后一个值: ${param.data[4]}`, `平均值: ${param.data[3]}`, `第一个值: ${param.data[2]}`, `最小值: ${param.data[1]}`].join("<br/>");
+            } else {
+              const level = !quality[param.dataIndex] && quality[param.dataIndex] !== 0 ? "--" : gradeList.find((item) => {
+                return item.level === (quality[param.dataIndex] || 1);
+              })?.name ?? "";
+              const value_ = !param.value ? "--" : param.value;
+              return [`${param.marker + param.seriesName} ${param.name}`, `${factorName}：${value_}${unit}`, `水质等级：${level}`].join("<br/>");
+            }
+          }
+        },
+        xAxis: [
+          {
+            type: "category",
+            boundaryGap: true,
+            axisLine: {
+              show: false,
+              lineStyle: {
+                color: "rgba(255,255,255,0.5)"
+              }
+            },
+            axisLabel: {
+              show: true,
+              textStyle: {
+                fontFamily: "Oswald",
+                fontSize: "12",
+                color: "rgba(255,255,255,1)"
+              }
+            },
+            axisTick: {
+              show: false
+            },
+            data: xAxis
+          },
+          {
+            type: "category",
+            show: false,
+            gridIndex: 1,
+            boundaryGap: true,
+            axisLine: {
+              show: true,
+              lineStyle: {
+                color: "rgba(255,255,255,0.5)"
+              }
+            },
+            axisTick: {
+              show: false
+            },
+            data: xAxis
+          }
+        ],
+        yAxis: [
+          {
+            // k线
+            type: "value",
+            name: unit,
+            nameTextStyle: {
+              align: "right",
+              color: "rgba(255,255,255,1)"
+            },
+            axisLabel: {
+              formatter: "{value}",
+              textStyle: {
+                fontFamily: "Bebas Neue",
+                fontSize: "12",
+                fontWeight: "normal"
+              }
+            },
+            axisLine: {
+              show: false,
+              lineStyle: {
+                color: "rgba(255,255,255,0.5)"
+              }
+            },
+            axisPointer: {
+              snap: true
+            },
+            splitArea: {
+              show: true,
+              areaStyle: {
+                color: ["transparent", "rgba(255, 255, 255, 0.05)"]
+              }
+            },
+            splitLine: { show: false },
+            axisTick: { show: false },
+            max,
+            min
+          },
+          {
+            // 日变化柱状图
+            type: "value",
+            gridIndex: 1,
+            axisLabel: {
+              show: false
+            },
+            axisLine: {
+              show: false,
+              lineStyle: {
+                color: "rgba(255,255,255,0.5)"
+              }
+            },
+            axisPointer: {
+              snap: true
+            },
+            splitLine: { show: false },
+            axisTick: { show: false }
+          }
+        ],
+        series: [
+          {
+            name: "K线",
+            type: "boxplot",
+            yAxisIndex: 0,
+            itemStyle: {
+              color: "transparent",
+              borderColor: "#00fff5"
+            },
+            data: kData
+          },
+          {
+            name: `${timeStr}变化`,
+            type: "bar",
+            xAxisIndex: 1,
+            yAxisIndex: 1,
+            barWidth: 20,
+            // label: {
+            //     show: true,
+            //     position: 'top',
+            //     fontFamily: 'Bebas Neue',
+            //     fontSize: '12',
+            //     color: 'rgba(255,255,255,0.6)'
+            // },
+            itemStyle: {
+              color: (params) => {
+                const level = quality[params.dataIndex];
+                const currData = gradeList.filter((item) => {
+                  return level ? Number(item.level) === Number(level.toString()) : false;
+                });
+                if (level != null)
+                  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]
+                }
+              };
+            })
+          }
+        ]
+      };
+      return option;
+    };
+    toRefs(data);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", {
+          ref_key: "chartSevenDayLine",
+          ref: chartSevenDayLine,
+          class: "chart"
+        }, null, 512)
+      ]);
+    };
+  }
+});
+
+/* unplugin-vue-components disabled */const index_vue_vue_type_style_index_0_scoped_b702feec_lang = '';
+
+const _SevenDayKline = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-b702feec"]]);
+
+const SevenDayKline = install(_SevenDayKline);
+
+export { SevenDayKline as S };

package/dist/es/wgms/src/SewageOutletsOnlineMonitor/index.mjs

@@ -0,0 +1,126 @@
+import { i as install } from '../../utils/tools.mjs';
+import { defineComponent, reactive, ref, onMounted, nextTick, toRefs, openBlock, createElementBlock, createElementVNode, Fragment, renderList, normalizeClass, unref, toDisplayString, normalizeStyle, pushScopeId, popScopeId } from 'vue';
+import { e as echarts } from '../../utils/echarts/index.mjs';
+import '../../../vendor/echarts-gl@2.0.9_echarts@5.4.2.mjs';
+import { g as getPie3D } from '../../utils/echarts/3dChartOptions.mjs';
+import { _ as _export_sfc } from '../../../aims/src/AirQualityCalendar/index.mjs';
+
+const _withScopeId = (n) => (pushScopeId("data-v-5f4ec60b"), n = n(), popScopeId(), n);
+const _hoisted_1 = { class: "outlet-online" };
+const _hoisted_2 = { class: "toggle-list flex-between-center" };
+const _hoisted_3 = ["onClick"];
+const _hoisted_4 = { class: "chart-content flex-between-center" };
+const _hoisted_5 = { class: "left" };
+const _hoisted_6 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("div", { class: "total" }, [
+  /* @__PURE__ */ createElementVNode("span", null, "总数："),
+  /* @__PURE__ */ createElementVNode("span", null, "982")
+], -1));
+const _hoisted_7 = { class: "legend" };
+const _hoisted_8 = { class: "left-c flex-left-center" };
+const _hoisted_9 = { class: "name" };
+const _hoisted_10 = { class: "righ-c flex-left-center" };
+const _hoisted_11 = { class: "num" };
+const _hoisted_12 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("div", { class: "split" }, " / ", -1));
+const _hoisted_13 = { class: "rate" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "index",
+  setup(__props) {
+    const toggleList = [
+      { label: "入河排污口", value: "0" },
+      { label: "入海排污口", value: "1" }
+    ];
+    const data = reactive({
+      activeIndex: 0,
+      colorArr: ["#F84439", "#FDBD00", "#15F3A3", "#00DEFF"],
+      total: 982,
+      optionData: [
+        {
+          name: "雨水排口",
+          value: 47
+        },
+        {
+          name: "工业排污口",
+          value: 91
+        },
+        {
+          name: "城镇污水处理厂排污口",
+          value: 12
+        },
+        {
+          name: "其他排口",
+          value: 832
+        }
+      ]
+    });
+    const pieChart = ref();
+    onMounted(async () => {
+      await nextTick();
+      initChart();
+    });
+    const initChart = () => {
+      const options = getPie3D(data.optionData, data.colorArr, 0.6, 185, 38, 15, 0.5);
+      echarts.draw(pieChart.value, options);
+    };
+    const changeList = (index) => {
+      data.activeIndex = index;
+    };
+    const {
+      activeIndex,
+      total,
+      optionData,
+      colorArr
+    } = toRefs(data);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_2, [
+          (openBlock(), createElementBlock(Fragment, null, renderList(toggleList, (item, index) => {
+            return createElementVNode("div", {
+              key: index,
+              class: normalizeClass([unref(activeIndex) === index ? "active" : "", "list-one flex-center-center"]),
+              onClick: ($event) => changeList(index)
+            }, toDisplayString(item.label), 11, _hoisted_3);
+          }), 64))
+        ]),
+        createElementVNode("div", _hoisted_4, [
+          createElementVNode("div", _hoisted_5, [
+            _hoisted_6,
+            createElementVNode("div", {
+              ref_key: "pieChart",
+              ref: pieChart,
+              class: "pie-chart"
+            }, null, 512)
+          ]),
+          createElementVNode("div", _hoisted_7, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(unref(optionData), (item, index) => {
+              return openBlock(), createElementBlock("div", {
+                key: index,
+                class: "legend-one flex-between-center"
+              }, [
+                createElementVNode("div", _hoisted_8, [
+                  createElementVNode("div", {
+                    class: "circle",
+                    style: normalizeStyle({ background: unref(colorArr)[index] })
+                  }, null, 4),
+                  createElementVNode("div", _hoisted_9, toDisplayString(item.name), 1)
+                ]),
+                createElementVNode("div", _hoisted_10, [
+                  createElementVNode("div", _hoisted_11, toDisplayString(item.value), 1),
+                  _hoisted_12,
+                  createElementVNode("div", _hoisted_13, toDisplayString((item.value / unref(total) * 100).toFixed(2)) + "% ", 1)
+                ])
+              ]);
+            }), 128))
+          ])
+        ])
+      ]);
+    };
+  }
+});
+
+/* unplugin-vue-components disabled */const index_vue_vue_type_style_index_0_scoped_5f4ec60b_lang = '';
+
+const _SewageOutletsOnlineMonitor = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-5f4ec60b"]]);
+
+const SewageOutletsOnlineMonitor = install(_SewageOutletsOnlineMonitor);
+
+export { SewageOutletsOnlineMonitor as S };

package/dist/es/wgms/src/SubordinateRanking/api/index.mjs

@@ -0,0 +1,11 @@
+import { r as requestControl } from '../../../service/request.mjs';
+
+const waterSubordinateRanking = (params) => {
+  return requestControl({
+    url: "/api/v1/surface-water-screen/subordinate-ranking",
+    server: "prjNbWgmsScreenServer",
+    params
+  });
+};
+
+export { waterSubordinateRanking as w };

package/dist/es/wgms/src/SubordinateRanking/index.d.ts

@@ -1,9 +1,14 @@
 import _SubordinateRanking from './index.vue';
-export declare const SubordinateRanking: {
+export declare const DvWgmsSubordinateRanking: {
     new (...args: any[]): {
         $: import("vue").ComponentInternalInstance;
         $data: {};
         $props: {
+            data?: {
+                rankNo: string | number;
+                regionName: string;
+                percent?: string | number | undefined;
+            }[] | undefined;
             beginTime?: number | undefined;
             endTime?: number | undefined;
             factorGroupId?: string | number | undefined;
@@ -11,6 +16,7 @@ export declare const SubordinateRanking: {
             treeType?: number | undefined;
             queryTimeType?: string | undefined;
             controlLevel?: string | undefined;
+            isLazy?: boolean | undefined;
             key?: string | number | symbol | undefined;
             style?: unknown;
             ref?: import("vue").VNodeRef | undefined;
@@ -98,7 +104,26 @@ export declare const SubordinateRanking: {
                 type: StringConstructor;
                 default: string;
             };
-        }>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
+            isLazy: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            data: {
+                type: globalThis.PropType<{
+                    rankNo: string | number;
+                    regionName: string;
+                    percent?: string | number | undefined;
+                }[]>;
+                default: () => never[];
+            };
+        }>>, {
+            reload: () => void;
+        }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
+            data: {
+                rankNo: string | number;
+                regionName: string;
+                percent?: string | number | undefined;
+            }[];
             beginTime: number;
             endTime: number;
             factorGroupId: string | number;
@@ -106,6 +131,7 @@ export declare const SubordinateRanking: {
             treeType: number;
             queryTimeType: string;
             controlLevel: string;
+            isLazy: boolean;
         }, {}, string, {}> & {
             beforeCreate?: ((() => void) | (() => void)[]) | undefined;
             created?: ((() => void) | (() => void)[]) | undefined;
@@ -155,7 +181,21 @@ export declare const SubordinateRanking: {
             type: StringConstructor;
             default: string;
         };
-    }>> & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties & {};
+        isLazy: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        data: {
+            type: globalThis.PropType<{
+                rankNo: string | number;
+                regionName: string;
+                percent?: string | number | undefined;
+            }[]>;
+            default: () => never[];
+        };
+    }>> & import("vue").ShallowUnwrapRef<{
+        reload: () => void;
+    }> & {} & import("vue").ComponentCustomProperties & {};
     __isFragment?: undefined;
     __isTeleport?: undefined;
     __isSuspense?: undefined;
@@ -188,7 +228,26 @@ export declare const SubordinateRanking: {
         type: StringConstructor;
         default: string;
     };
-}>>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
+    isLazy: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    data: {
+        type: globalThis.PropType<{
+            rankNo: string | number;
+            regionName: string;
+            percent?: string | number | undefined;
+        }[]>;
+        default: () => never[];
+    };
+}>>, {
+    reload: () => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
+    data: {
+        rankNo: string | number;
+        regionName: string;
+        percent?: string | number | undefined;
+    }[];
     beginTime: number;
     endTime: number;
     factorGroupId: string | number;
@@ -196,5 +255,6 @@ export declare const SubordinateRanking: {
     treeType: number;
     queryTimeType: string;
     controlLevel: string;
+    isLazy: boolean;
 }, {}, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("vue").Plugin<any[]>;
 export default _SubordinateRanking;