@ued_fpi/data-visual 1.1.4 → 1.1.5

package/dist/lib/wgms/src/NPTrendChange/index.vue2.js

@@ -2,196 +2,6 @@
 
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
 
-const vue = require('vue');
-const index$2 = require('../../utils/echarts/index.js');
-const index = require('../../api/FactorTrendComparison/index.js');
-const index$1 = require('../../api/NPTrendChange/index.js');
+/* unplugin-vue-components disabled */const index_vue_vue_type_style_index_0_lang = '';
 
-const _hoisted_1 = { class: "n-p-trend-change" };
-const _sfc_main = /* @__PURE__ */ vue.defineComponent({
-  __name: "index",
-  props: {
-    isHandle: {
-      default: true,
-      type: Boolean
-    },
-    // 是否是手工数据
-    siteCode: {
-      default: "",
-      // 23239
-      type: String
-    },
-    beginTime: {
-      type: String,
-      required: true
-      // 1660752000000
-    },
-    endTime: {
-      type: String,
-      required: true
-      // 1663344000000
-    },
-    data: {
-      type: Array,
-      default: () => []
-    }
-    // 传入数据
-  },
-  setup(__props) {
-    const props = __props;
-    const state = {
-      factorMap: [],
-      seriesData: [],
-      chartRef: null
-      // 图表实例
-    };
-    const { chartRef } = vue.toRefs(state);
-    vue.watch([() => props.isHandle, () => props.siteCode, () => props.beginTime, () => props.endTime, () => props.data], async () => {
-      if (props.data.length) {
-        await vue.nextTick(() => {
-          initChart();
-        });
-        return;
-      }
-      const groupCode = props.isHandle ? "algae" : "algaeAutomatic";
-      const list = await index.getFactorGroupList({ code: groupCode });
-      state.factorMap = list[0]?.factors || [];
-      state.factorMap.forEach((item) => {
-        const obj = {
-          name: item.factorIndexName,
-          type: "line",
-          symbolSize: 0,
-          yAxisIndex: item.id === "75" ? 1 : item.id === "23" ? 2 : 0,
-          data: []
-        };
-        state.seriesData.push(obj);
-      });
-      await vue.nextTick(() => {
-        initChart();
-      });
-    }, { immediate: true });
-    async function initChart() {
-      const params = {
-        startTime: props.beginTime,
-        endTime: props.endTime,
-        siteCode: props.siteCode,
-        timeType: props.isHandle ? "day" : ""
-      };
-      const res = await index$1.getNPTrendChange(params);
-      console.log(res, "res");
-      const timeList = res?.data?.timeList ?? [];
-      const preList = res?.data?.preList ?? [];
-      const xData = timeList.map((item) => item && item.substr(5));
-      const NPList = preList.map((item) => item && item * 100);
-      const chart = index$2.default.init(chartRef.value);
-      const options = getChartOptions(xData, NPList, index$2.default);
-      chart.setOption(options);
-    }
-    const getChartOptions = (xData, data, echarts2) => {
-      return {
-        title: {
-          show: true,
-          text: "N/P（100%）",
-          textAlign: "left",
-          left: 10,
-          top: 14,
-          textStyle: {
-            color: "rgba(255,255,255,0.6)",
-            fontSize: 14,
-            fontFamily: "TRENDS"
-          }
-        },
-        tooltip: {
-          trigger: "axis",
-          axisPointer: {
-            type: "line"
-            // 默认为直线，可选为：'line' | 'shadow'
-          }
-        },
-        grid: {
-          top: 50,
-          left: 10,
-          right: "1%",
-          bottom: 10,
-          containLabel: true
-        },
-        xAxis: [
-          {
-            type: "category",
-            data: xData,
-            axisLine: {
-              show: false
-            },
-            axisLabel: {
-              textStyle: {
-                fontFamily: "TRENDS",
-                fontSize: "16",
-                color: "rgba(255,255,255,0.6)"
-              }
-            },
-            axisTick: {
-              show: false,
-              interval: 24
-            }
-          }
-        ],
-        yAxis: [
-          {
-            type: "value",
-            name: "",
-            axisLabel: {
-              textStyle: {
-                fontFamily: "TRENDS",
-                fontSize: 16,
-                color: "rgba(255,255,255,0.6)"
-              }
-            },
-            axisLine: {
-              show: false
-            },
-            splitArea: {
-              show: true,
-              areaStyle: {
-                color: ["rgba(255, 255, 255, 0.05)", "transparent"]
-              }
-            },
-            splitLine: { show: false },
-            axisTick: { show: false }
-          }
-        ],
-        series: [
-          {
-            name: "氮磷比趋势变化",
-            type: "line",
-            symbolSize: 0,
-            smooth: true,
-            lineStyle: {
-              color: "#47E5E5"
-            },
-            areaStyle: {
-              normal: {
-                color: new echarts2.graphic.LinearGradient(0, 0, 0, 1, [
-                  { offset: 0, color: "#47E5E5 " },
-                  { offset: 1, color: "rgba(71,229,229,0.06)" }
-                ])
-              }
-            },
-            data
-          }
-        ]
-      };
-    };
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
-        vue.createElementVNode("div", {
-          id: "chart",
-          ref_key: "chartRef",
-          ref: chartRef,
-          class: "chart"
-        }, null, 512)
-      ]);
-    };
-  }
-});
-
-exports.default = _sfc_main;
+exports.default = index_vue_vue_type_style_index_0_lang;

package/dist/lib/wgms/src/NPTrendChange/index.vue3.js

@@ -2,6 +2,9 @@
 
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
 
-/* unplugin-vue-components disabled */const index_vue_vue_type_style_index_0_scoped_0b0ae947_lang = '';
+const index_vue_vue_type_script_setup_true_lang = require('./index.vue.js');
+require('./index.vue2.js');
 
-exports.default = index_vue_vue_type_style_index_0_scoped_0b0ae947_lang;
+
+
+exports.default = index_vue_vue_type_script_setup_true_lang.default;

package/dist/lib/wgms/src/PollutionSourceControl/index.js

@@ -3,9 +3,10 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
 
 const tools = require('../../utils/tools.js');
-const index = require('./index.vue.js');
+const index_vue_vue_type_script_setup_true_lang = require('./index.vue.js');
+require('./index.vue2.js');
 
-const DvWgmsPollutionSourceControl = tools.install(index.default);
+const DvWgmsPollutionSourceControl = tools.install(index_vue_vue_type_script_setup_true_lang.default);
 
-exports.default = index.default;
+exports.default = index_vue_vue_type_script_setup_true_lang.default;
 exports.DvWgmsPollutionSourceControl = DvWgmsPollutionSourceControl;

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

@@ -2,10 +2,349 @@
 
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
 
-const index_vue_vue_type_script_setup_true_lang = require('./index.vue2.js');
-require('./index.vue3.js');
-const _pluginVue_exportHelper = require('../../../_virtual/_plugin-vue_export-helper.js');
+const es = require('element-plus/es');
+require('element-plus/es/components/base/style/css');
+require('element-plus/es/components/scrollbar/style/css');
+const vue = require('vue');
+const lodashEs = require('lodash-es');
+const dayjs = require('dayjs');
+const echartsOptions = require('../../utils/echarts/echartsOptions.js');
+const index$1 = require('../../utils/echarts/index.js');
+const ProgressBar_vue_vue_type_script_setup_true_lang = require('../common/ProgressBar.vue.js');
+require('../common/ProgressBar.vue2.js');
+const selectPanel_vue_vue_type_script_setup_true_name_SelectPanel_lang = require('../common/select-panel.vue.js');
+require('../common/select-panel.vue2.js');
+const index = require('./api/index.js');
 
-const _PollutionSourceControl = /* @__PURE__ */ _pluginVue_exportHelper.default(index_vue_vue_type_script_setup_true_lang.default, [["__scopeId", "data-v-d0e026be"]]);
+const _hoisted_1 = { class: "dv-wgms-pollution-source" };
+const _hoisted_2 = { class: "dv-wgms-key-source" };
+const _hoisted_3 = { class: "dv-wgms-title-text" };
+const _hoisted_4 = /* @__PURE__ */ vue.createElementVNode("div", { class: "dv-wgms-text" }, " 重点源超标前三 ", -1);
+const _hoisted_5 = { class: "dv-wgms-select" };
+const _hoisted_6 = { class: "dv-wgms-top" };
+const _hoisted_7 = { class: "dv-wgms-left" };
+const _hoisted_8 = { class: "dv-wgms-right" };
+const _hoisted_9 = { class: "dv-wgms-bar" };
+const _hoisted_10 = { class: "dv-wgms-statistic-content" };
+const _hoisted_11 = { class: "dv-wgms-statistic-box" };
+const _hoisted_12 = /* @__PURE__ */ vue.createElementVNode("div", { class: "dv-wgms-text" }, " 重点源超标统计 ", -1);
+const _hoisted_13 = { class: "dv-wgms-total-content" };
+const _hoisted_14 = /* @__PURE__ */ vue.createElementVNode("div", { class: "dv-wgms-left" }, " 总数 ", -1);
+const _hoisted_15 = { class: "dv-wgms-right" };
+const _hoisted_16 = { class: "dv-wgms-num" };
+const _hoisted_17 = { class: "dv-wgms-legend" };
+const _hoisted_18 = { class: "dv-wgms-left" };
+const _hoisted_19 = { class: "dv-wgms-name" };
+const _hoisted_20 = { class: "dv-wgms-right" };
+const _hoisted_21 = /* @__PURE__ */ vue.createElementVNode("span", null, "/", -1);
+const _hoisted_22 = { class: "dv-wgms-statistic-box" };
+const _hoisted_23 = /* @__PURE__ */ vue.createElementVNode("div", { class: "dv-wgms-text" }, " 入河排污口 ", -1);
+const _hoisted_24 = { class: "dv-wgms-port-list" };
+const _hoisted_25 = { class: "dv-wgms-port-one" };
+const _hoisted_26 = /* @__PURE__ */ vue.createElementVNode("div", { class: "dv-wgms-name" }, " 氮超标 ", -1);
+const _hoisted_27 = { class: "dv-wgms-value" };
+const _hoisted_28 = /* @__PURE__ */ vue.createElementVNode("span", null, "个", -1);
+const _hoisted_29 = { class: "dv-wgms-port-one" };
+const _hoisted_30 = /* @__PURE__ */ vue.createElementVNode("div", { class: "dv-wgms-name" }, " 磷超标 ", -1);
+const _hoisted_31 = { class: "dv-wgms-value" };
+const _hoisted_32 = /* @__PURE__ */ vue.createElementVNode("span", null, "个", -1);
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "index",
+  props: {
+    factorList: {
+      type: Array,
+      default: () => []
+    },
+    beginTime: {
+      type: Number,
+      default: dayjs().startOf("year").valueOf()
+    },
+    endTime: {
+      type: Number,
+      default: dayjs().endOf("year").valueOf()
+    },
+    factorCodes: {
+      type: String,
+      default: ""
+    },
+    distance: {
+      type: Number,
+      default: 3e3
+    },
+    siteCode: {
+      type: [Number, String],
+      default: "zaoleishougong"
+    },
+    longitude: {
+      type: Number,
+      default: 120.011044
+    },
+    latitude: {
+      type: Number,
+      default: 30.284025
+    },
+    timeType: {
+      type: String,
+      default: "day"
+    },
+    isHandle: {
+      type: Boolean,
+      default: false
+    },
+    isLazy: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ["factorChange"],
+  setup(__props, { expose: __expose, emit: emits }) {
+    const props = __props;
+    const data = vue.reactive({
+      keySelectList: [],
+      companyList: [],
+      curSelectFactor: props.factorCodes,
+      defaultValue: props.factorCodes,
+      alarmMax: 0,
+      keySourseData: [
+        { factorIndexCode: "w21003", standardUnitName: null, factorName: "氮超标", rank: 1, total: 0, proportion: 0 },
+        { factorIndexCode: "w21011", standardUnitName: null, factorName: "磷超标", rank: 2, total: 0, proportion: 0 },
+        { factorIndexCode: "w01009", standardUnitName: null, factorName: "其他 ", rank: 3, total: 0, proportion: 0 }
+      ],
+      chartDetail: [],
+      colorList: ["#F84439", "#0062FF", "#2AC94F"],
+      nh3OverNum: 0,
+      tpOverNum: 0,
+      totalCount: 0
+    });
+    const statChart = vue.ref(null);
+    vue.watch([() => props.beginTime, () => props.endTime, () => props.distance, () => props.siteCode, () => props.factorCodes], () => {
+      data.defaultValue = props.factorCodes;
+      data.curSelectFactor = props.factorCodes;
+      if (props.isLazy)
+        return;
+      keyPollutionData();
+    });
+    vue.watch([() => props.beginTime, () => props.endTime, () => props.distance, () => props.longitude, () => props.latitude], () => {
+      if (props.isLazy)
+        return;
+      getPortData();
+    });
+    vue.watch([() => props.beginTime, () => props.endTime, () => props.distance, () => props.timeType, () => props.siteCode], () => {
+      if (props.isLazy)
+        return;
+      keyPollutionStatistic();
+    });
+    const keyFactorsCheck = (item, index) => {
+      if (data.curSelectFactor === item.code)
+        return;
+      data.curSelectFactor = item.code;
+      emits("factorChange", item.code);
+      keyPollutionData();
+    };
+    vue.onMounted(() => {
+      if (props.isLazy)
+        return;
+      keyPollutionData();
+      getPortData();
+      keyPollutionStatistic();
+    });
+    const keyPollutionData = async () => {
+      data.keySelectList = [
+        { label: "所有因子", value: "" },
+        ...props.factorList
+      ];
+      const res = await index.pomsAlarm({
+        startTime: props.beginTime,
+        endTime: props.endTime,
+        distance: props.distance,
+        siteCode: props.siteCode,
+        factorCodes: data.curSelectFactor
+      });
+      if (res.data?.length) {
+        data.companyList = res.data.slice(0, 3);
+        data.companyList.forEach((item) => {
+          item.alarmNum = Number(item.alarmNum);
+        });
+        const maxObj = lodashEs.maxBy(data.companyList, "alarmNum");
+        data.alarmMax = maxObj.alarmNum;
+      } else {
+        data.companyList = [];
+      }
+    };
+    const getPortData = async () => {
+      const res = await index.portToRiver({
+        longitude: props.longitude,
+        latitude: props.latitude,
+        startTime: props.beginTime,
+        endTime: props.endTime,
+        distance: props.distance
+      });
+      data.nh3OverNum = res.data?.nh3OverNum ?? 0;
+      data.tpOverNum = res.data?.tpOverNum ?? 0;
+    };
+    const keyPollutionStatistic = async () => {
+      const res = await (props.isHandle ? index.pomsFactorAlarmHandle : index.pomsFactorAlarmAuto)({
+        timeType: props.timeType,
+        startTime: props.beginTime,
+        endTime: props.endTime,
+        distance: props.distance,
+        siteCode: props.siteCode
+      });
+      const total = res.data?.total ?? 0;
+      data.totalCount = total;
+      const dataList = res?.data?.data ?? [];
+      let N = 0;
+      let P = 0;
+      dataList.forEach((item) => {
+        if (item.w21003)
+          N = item.w21003;
+        else if (item.w21011)
+          P = item.w21011;
+      });
+      data.keySourseData.forEach((item) => {
+        if (item.factorIndexCode === "w21003") {
+          item.proportion = N;
+          item.total = total === 0 ? "" : (100 * N / total).toFixed(1);
+        } else if (item.factorIndexCode === "w21011") {
+          item.proportion = P;
+          item.total = total === 0 ? "" : (100 * P / total).toFixed(1);
+        } else {
+          item.proportion = total - P - N;
+          item.total = total === 0 ? "" : (100 * (total - P - N) / total).toFixed(1);
+        }
+      });
+      let otherCount = 0;
+      const colors = ["#35aded", "#ff9902", "#00fc83"];
+      const details = [];
+      data.keySourseData.forEach((item, index) => {
+        otherCount -= item.proportion;
+        details.push({
+          value: item.proportion,
+          rate: item.total,
+          name: item.factorName,
+          itemStyle: { color: colors[index] }
+        });
+      });
+      data.chartDetail = details;
+      const seriesData = [
+        ...data.chartDetail,
+        {
+          value: otherCount,
+          rate: otherCount,
+          name: "其他",
+          itemStyle: { color: "#00fc83" }
+        }
+      ];
+      const chart = index$1.default.init(statChart.value);
+      const lineOptions = echartsOptions.pollutionSourcePieOptions(seriesData);
+      chart.setOption(lineOptions);
+    };
+    const { keySelectList, companyList, colorList, nh3OverNum, tpOverNum, totalCount, chartDetail, alarmMax, defaultValue } = vue.toRefs(data);
+    __expose({
+      keyPollutionData,
+      getPortData,
+      keyPollutionStatistic
+    });
+    return (_ctx, _cache) => {
+      const _component_el_scrollbar = es.ElScrollbar;
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        vue.createElementVNode("div", _hoisted_2, [
+          vue.createElementVNode("div", _hoisted_3, [
+            _hoisted_4,
+            vue.createElementVNode("div", _hoisted_5, [
+              vue.createVNode(selectPanel_vue_vue_type_script_setup_true_name_SelectPanel_lang.default, {
+                option: vue.unref(keySelectList),
+                "default-value": vue.unref(defaultValue),
+                onChange: keyFactorsCheck
+              }, null, 8, ["option", "default-value"])
+            ])
+          ]),
+          vue.createVNode(_component_el_scrollbar, { class: "dv-wgms-key-list" }, {
+            default: vue.withCtx(() => [
+              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(companyList), (item, index) => {
+                return vue.openBlock(), vue.createElementBlock("div", {
+                  key: index,
+                  class: "dv-wgms-key-one"
+                }, [
+                  vue.createElementVNode("div", _hoisted_6, [
+                    vue.createElementVNode("div", _hoisted_7, [
+                      vue.createElementVNode("span", null, vue.toDisplayString(item.rank), 1),
+                      vue.createElementVNode("span", null, vue.toDisplayString(item.siteName), 1)
+                    ]),
+                    vue.createElementVNode("div", _hoisted_8, vue.toDisplayString(item.alarmNum), 1)
+                  ]),
+                  vue.createElementVNode("div", _hoisted_9, [
+                    vue.createVNode(ProgressBar_vue_vue_type_script_setup_true_lang.default, {
+                      "active-color": "linear-gradient(270deg, #F84439 0%, rgba(248,68,57,0.35) 100%)",
+                      "handle-style": { background: "#F84439" },
+                      percentage: item.alarmNum / vue.unref(alarmMax) * 100
+                    }, null, 8, ["percentage"])
+                  ])
+                ]);
+              }), 128))
+            ]),
+            _: 1
+          })
+        ]),
+        vue.createElementVNode("div", _hoisted_10, [
+          vue.createElementVNode("div", _hoisted_11, [
+            _hoisted_12,
+            vue.createElementVNode("div", _hoisted_13, [
+              _hoisted_14,
+              vue.createElementVNode("div", _hoisted_15, [
+                vue.createElementVNode("div", _hoisted_16, vue.toDisplayString(vue.unref(totalCount)), 1),
+                vue.createElementVNode("div", {
+                  ref_key: "statChart",
+                  ref: statChart,
+                  class: "dv-wgms-chart"
+                }, null, 512)
+              ])
+            ]),
+            vue.createElementVNode("div", _hoisted_17, [
+              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(chartDetail), (item, index) => {
+                return vue.openBlock(), vue.createElementBlock("div", {
+                  key: index,
+                  class: "dv-wgms-legend-one"
+                }, [
+                  vue.createElementVNode("div", _hoisted_18, [
+                    vue.createElementVNode("div", {
+                      class: "dv-wgms-circle",
+                      style: vue.normalizeStyle({ background: vue.unref(colorList)[index] })
+                    }, null, 4),
+                    vue.createElementVNode("div", _hoisted_19, vue.toDisplayString(item.name || "--"), 1)
+                  ]),
+                  vue.createElementVNode("div", _hoisted_20, [
+                    vue.createElementVNode("span", null, vue.toDisplayString(item.value || "--"), 1),
+                    _hoisted_21,
+                    vue.createElementVNode("span", null, vue.toDisplayString(item.rate || "--") + "%", 1)
+                  ])
+                ]);
+              }), 128))
+            ])
+          ]),
+          vue.createElementVNode("div", _hoisted_22, [
+            _hoisted_23,
+            vue.createElementVNode("div", _hoisted_24, [
+              vue.createElementVNode("div", _hoisted_25, [
+                _hoisted_26,
+                vue.createElementVNode("div", _hoisted_27, [
+                  vue.createElementVNode("span", null, vue.toDisplayString(vue.unref(nh3OverNum)), 1),
+                  _hoisted_28
+                ])
+              ]),
+              vue.createElementVNode("div", _hoisted_29, [
+                _hoisted_30,
+                vue.createElementVNode("div", _hoisted_31, [
+                  vue.createElementVNode("span", null, vue.toDisplayString(vue.unref(tpOverNum)), 1),
+                  _hoisted_32
+                ])
+              ])
+            ])
+          ])
+        ])
+      ]);
+    };
+  }
+});
 
-exports.default = _PollutionSourceControl;
+exports.default = _sfc_main;