@ued_fpi/data-visual 1.2.15 → 1.2.20

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/index.vue.js

@@ -3,6 +3,7 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
 
 const vue = require('vue');
+const lodashEs = require('lodash-es');
 require('echarts-gl');
 const index$1 = require('../../utils/echarts/index.js');
 const _3dChartOptions = require('../../utils/echarts/3dChartOptions.js');
@@ -33,6 +34,57 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     colorArr: { default: () => {
       return ["#F84439", "#FDBD00", "#15F3A3", "#00DEFF", "#1976D2", "#F2BE32", "#00E87E"];
     } },
+    data: { default: () => {
+      return {
+        total: 80,
+        0: [
+          {
+            name: "雨水排口",
+            value: 10,
+            rate: 20,
+            itemStyle: { color: "#F84439" }
+          },
+          {
+            name: "工业排污口",
+            value: 20,
+            rate: 40,
+            itemStyle: { color: "#FAAD14" }
+          },
+          {
+            name: "城镇污水处理厂排污口",
+            value: 10,
+            rate: 20,
+            itemStyle: { color: "#00E87E" }
+          },
+          {
+            name: "其他排口",
+            value: 10,
+            rate: 20,
+            itemStyle: { color: "#00DEFF" }
+          }
+        ],
+        1: [
+          {
+            name: "入海排口",
+            value: 30,
+            rate: 50,
+            itemStyle: { color: "#F84439" }
+          },
+          {
+            name: "工业排污口",
+            value: 20,
+            rate: 33.33,
+            itemStyle: { color: "#FAAD14" }
+          },
+          {
+            name: "其他排口",
+            value: 10,
+            rate: 16.67,
+            itemStyle: { color: "#00DEFF" }
+          }
+        ]
+      };
+    } },
     isLazy: { type: Boolean, default: false }
   },
   setup(__props) {
@@ -50,10 +102,19 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     vue.onMounted(async () => {
       !props.isLazy && getResData();
     });
-    vue.watch([() => props.params, () => props.isLazy], () => {
+    vue.watch([() => props.params, () => props.data, () => props.isLazy], () => {
       !props.isLazy && getResData();
     }, { deep: true });
     const getResData = async () => {
+      if (props.data && Reflect.ownKeys(props.data).length) {
+        wgmsData.optionData = props.data[wgmsData.activeIndex];
+        wgmsData.total = lodashEs.sumBy(wgmsData.optionData, (o) => {
+          return o.value;
+        });
+        await vue.nextTick();
+        initChart();
+        return;
+      }
       const { data: res } = await index.getOutletsOnlineData({
         ...props.params,
         outletType: wgmsData.toggleList[wgmsData.activeIndex].value
@@ -61,10 +122,14 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       if (res) {
         wgmsData.total = res.total;
         if (res.outletOnlineDetailList && res.outletOnlineDetailList.length) {
-          wgmsData.optionData = res.outletOnlineDetailList.map((item) => {
+          wgmsData.optionData = res.outletOnlineDetailList.map((item, index) => {
             return {
               ...item,
-              value: item.onlineCount
+              rate: res.total ? (item.onlineCount / res.total * 100).toFixed(2) : 0,
+              value: item.onlineCount,
+              itemStyle: {
+                color: props.colorArr[index]
+              }
             };
           });
           await vue.nextTick();
@@ -73,7 +138,14 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       }
     };
     const initChart = () => {
-      const options = _3dChartOptions.getPie3D(wgmsData.optionData, props.colorArr, 0.6, 185, 38, 15, 0.5);
+      const pieData = wgmsData.optionData.map((item) => {
+        return {
+          name: item.name,
+          value: item.rate === "--" ? 0 : Number(item.rate),
+          itemStyle: item.itemStyle
+        };
+      });
+      const options = _3dChartOptions.getPie3D(pieData, 0.6, 185, 38, 16, 1);
       index$1.default.draw(pieChart.value, options);
     };
     const changeList = (index) => {
@@ -118,14 +190,14 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                 vue.createElementVNode("div", _hoisted_9, [
                   vue.createElementVNode("div", {
                     class: "circle",
-                    style: vue.normalizeStyle({ background: _ctx.colorArr[index] })
+                    style: vue.normalizeStyle({ background: item.itemStyle.color })
                   }, null, 4),
                   vue.createElementVNode("div", _hoisted_10, vue.toDisplayString(item.name), 1)
                 ]),
                 vue.createElementVNode("div", _hoisted_11, [
                   vue.createElementVNode("div", _hoisted_12, vue.toDisplayString(item.value), 1),
                   _hoisted_13,
-                  vue.createElementVNode("div", _hoisted_14, vue.toDisplayString((item.value / vue.unref(total) * 100).toFixed(2)) + "% ", 1)
+                  vue.createElementVNode("div", _hoisted_14, vue.toDisplayString(item.rate) + "% ", 1)
                 ])
               ]);
             }), 128))

package/dist/lib/wgms/src/SurroundingPollution/api/index.js

@@ -12,6 +12,13 @@ const queryFactorGroup = (params) => {
   });
 };
 const pomsAlarm = (params) => {
+  return request.default({
+    url: "/api/v3.0/analyse/alarm-stat",
+    server: "wgmsSewageDataServer",
+    params
+  });
+};
+const pomsAnalysis = (params) => {
   return request.default({
     url: "/api/v3.0/analyse/poms-analyse",
     server: "wgmsSewageDataServer",
@@ -27,7 +34,16 @@ const countEventStatusByTimePoint = (data, option = {}) => {
     ...option
   });
 };
+const overflowPort = (params) => {
+  return request.default({
+    url: "/api/v3.0/analyse/result/poms",
+    server: "wgmsSewageDataServer",
+    params
+  });
+};
 
 exports.countEventStatusByTimePoint = countEventStatusByTimePoint;
+exports.overflowPort = overflowPort;
 exports.pomsAlarm = pomsAlarm;
+exports.pomsAnalysis = pomsAnalysis;
 exports.queryFactorGroup = queryFactorGroup;