@ued_fpi/data-visual/dist/es/ipes/src/HarmfulMonitoring/index.vue.mjs

<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" />

import { defineComponent, computed, ref, onMounted, openBlock, createElementBlock, createElementVNode, toDisplayString } from 'vue';

const _hoisted_1 = { class: "dv-ipes-env-manage" };
const _hoisted_2 = { class: "harm-list" };
const _hoisted_3 = { class: "harm-list__column harm-list__column--primary" };
const _hoisted_4 = { class: "harm-list__column__value" };
const _hoisted_5 = /* @__PURE__ */ createElementVNode("div", { class: "harm-list__column__label" }, " 正常 ", -1);
const _hoisted_6 = { class: "harm-list__column harm-list__column--error" };
const _hoisted_7 = { class: "harm-list__column__value" };
const _hoisted_8 = /* @__PURE__ */ createElementVNode("div", { class: "harm-list__column__label" }, " 异常 ", -1);
const _hoisted_9 = { class: "harm-list__column harm-list__column--warning" };
const _hoisted_10 = { class: "harm-list__column__value" };
const _hoisted_11 = /* @__PURE__ */ createElementVNode("div", { class: "harm-list__column__label" }, " 离线 ", -1);
const __default__ = {
  name: "DvIpesHarmfulMonitoring",
  title: "有毒有害监控"
};
const _sfc_main = /* @__PURE__ */ defineComponent({
  ...__default__,
  props: {
    factorList: { default: () => ({
      wg: [
        // {
        //     factorName: '甲烷',
        //     factorValue: 89.32,
        //     targetValue: 500,
        //     percent: 0.179,
        // },
        // {
        //     factorName: '乙醇',
        //     factorValue: 0.84,
        //     targetValue: 200,
        //     percent: 0.004,
        // },
      ],
      ww: [
        // {
        //     factorName: '非甲烷总烃总量',
        //     factorValue: 89.32,
        //     targetValue: 500,
        //     percent: 0.179,
        // },
        // {
        //     factorName: 'SO2总量',
        //     factorValue: 0.84,
        //     targetValue: 200,
        //     percent: 0.004,
        // },
      ]
    }) },
    statusMap: { default: () => ({
      normal: "",
      abnormal: "",
      offline: ""
    }) },
    switchTime: { default: 1e4 },
    width: { default: "100%" },
    height: { default: 96 }
  },
  setup(__props) {
    const props = __props;
    computed(() => {
      return props.factorList;
    });
    const statusMap = computed(() => {
      return props.statusMap;
    });
    computed(() => {
      return props.width;
    });
    computed(() => {
      return props.height;
    });
    const harmIndex = ref(0);
    const autoSwitchTimer = ref(null);
    const autoSwitch = () => {
      autoSwitchTimer.value = setInterval(() => {
        harmIndex.value = harmIndex.value === 1 ? 0 : 1;
      }, props.switchTime);
    };
    onMounted(() => {
      autoSwitch();
    });
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1, [
        createElementVNode("div", _hoisted_2, [
          createElementVNode("div", _hoisted_3, [
            createElementVNode("div", _hoisted_4, toDisplayString(parseInt(statusMap.value.normal) || 0), 1),
            _hoisted_5
          ]),
          createElementVNode("div", _hoisted_6, [
            createElementVNode("div", _hoisted_7, toDisplayString(parseInt(statusMap.value.abnormal) || 0), 1),
            _hoisted_8
          ]),
          createElementVNode("div", _hoisted_9, [
            createElementVNode("div", _hoisted_10, toDisplayString(parseInt(statusMap.value.offline) || 0), 1),
            _hoisted_11
          ])
        ])
      ]);
    };
  }
});

export { _sfc_main as default };