@ued_fpi/data-visual/dist/lib/ipes/src/EnvironmentalProtection/index.vue.js

<br /> <br /> <div style="text-align:center"> <b style="font-size:30px">@ued_fpi/data-visual</b> <p>基于Vite4+TypeScript的Vue3大屏组件库开发框架</p> <img style="display:inline" src="https://img.shields.io/npm/v/@ued_fpi/data-visual" />

'use strict';

Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });

const vue = require('vue');
const request = require('../../service/request.js');

const _hoisted_1 = { class: "dv-ipes-risk-emergency-manage" };
const _hoisted_2 = /* @__PURE__ */ vue.createElementVNode("div", { class: "module-title" }, [
  /* @__PURE__ */ vue.createElementVNode("div", { class: "title" }, [
    /* @__PURE__ */ vue.createElementVNode("span", null, "企业环境风险分级")
  ])
], -1);
const _hoisted_3 = { class: "risk_body" };
const _hoisted_4 = { class: "pie-card" };
const _hoisted_5 = /* @__PURE__ */ vue.createElementVNode("div", { class: "top" }, null, -1);
const _hoisted_6 = /* @__PURE__ */ vue.createElementVNode("div", { class: "bottom" }, null, -1);
const _hoisted_7 = { class: "label" };
const _hoisted_8 = /* @__PURE__ */ vue.createElementVNode("div", { class: "title" }, " 企业总数 ", -1);
const _hoisted_9 = { class: "total mgt8" };
const _hoisted_10 = { class: "legend" };
const _hoisted_11 = { class: "typename" };
const _hoisted_12 = { class: "value" };
const _hoisted_13 = { class: "footer" };
const _hoisted_14 = /* @__PURE__ */ vue.createElementVNode("span", { class: "mgr16" }, "环境风险单元总数", -1);
const _hoisted_15 = { class: "total" };
const _hoisted_16 = /* @__PURE__ */ vue.createElementVNode("span", { class: "unit" }, "个", -1);
const __default__ = {
  name: "DvIpesEnvironmentalProtection",
  title: "环境风险应急管理"
};
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  ...__default__,
  emits: ["openPopup"],
  setup(__props, { emit }) {
    const colors = ["var(--dv-color-danger)", "var(--dv-color-warning)", "var(--dv-color-index)", "var(--dv-color-success)"];
    const totalCount = vue.ref(0);
    const companyTotal = vue.ref(0);
    const legendData = vue.ref([]);
    const pieChart = vue.ref();
    function drawChart(data) {
      const Highcharts = window.Highcharts;
      Highcharts && Highcharts.chart(pieChart.value, {
        chart: {
          type: "pie",
          margin: 0,
          backgroundColor: "transparent",
          options3d: {
            enabled: true,
            alpha: 68,
            beta: 0
          }
        },
        credits: { enabled: false },
        title: {
          text: null
        },
        colors,
        tooltip: {
          enabled: false
        },
        plotOptions: {
          pie: {
            center: ["50%", "60%"],
            animation: false,
            enableMouseTracking: false,
            cursor: "pointer",
            depth: 15,
            innerSize: "80%",
            size: "135%",
            dataLabels: {
              enabled: false
            }
          }
        },
        series: [
          {
            type: "pie",
            name: "企业总数",
            data
          }
        ],
        legend: {
          enabled: false
        }
      });
    }
    const fetchData = async () => {
      try {
        const result = await request.default({
          method: "get",
          url: "/bmp-company-manager-server/api/v1/company/management/statistics/envRiskLevel"
        });
        const { totalRiskUnitCount, ...companyData } = result;
        const list = Object.values(companyData).reverse();
        let totla = 0;
        const seriesData = [];
        list.forEach((item) => {
          totla += item.count;
          seriesData.push([item.name, item.count]);
        });
        legendData.value = list;
        companyTotal.value = totla;
        totalCount.value = totalRiskUnitCount;
        drawChart(seriesData);
      } catch (error) {
        console.log(error);
      }
    };
    vue.onMounted(async () => {
      await vue.nextTick();
      fetchData();
    });
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
        _hoisted_2,
        vue.createElementVNode("div", _hoisted_3, [
          vue.createElementVNode("div", _hoisted_4, [
            vue.createElementVNode("div", {
              ref_key: "pieChart",
              ref: pieChart,
              class: "pie"
            }, null, 512),
            _hoisted_5,
            _hoisted_6,
            vue.createElementVNode("div", _hoisted_7, [
              _hoisted_8,
              vue.createElementVNode("div", _hoisted_9, vue.toDisplayString(companyTotal.value), 1)
            ])
          ]),
          vue.createElementVNode("div", _hoisted_10, [
            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(legendData.value, (item, index) => {
              return vue.openBlock(), vue.createElementBlock("div", {
                key: index,
                class: "legend-item"
              }, [
                vue.createElementVNode("div", {
                  class: "circle",
                  style: vue.normalizeStyle({ background: colors[index] })
                }, null, 4),
                vue.createElementVNode("div", _hoisted_11, vue.toDisplayString(item.name), 1),
                vue.createElementVNode("div", _hoisted_12, vue.toDisplayString(item.count || 0), 1)
              ]);
            }), 128))
          ])
        ]),
        vue.createElementVNode("div", _hoisted_13, [
          _hoisted_14,
          vue.createElementVNode("div", _hoisted_15, vue.toDisplayString(totalCount.value), 1),
          _hoisted_16
        ])
      ]);
    };
  }
});

exports.default = _sfc_main;