UNPKG

@ued_fpi/data-visual

Version:

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

114 lines (109 loc) 3.93 kB
'use strict'; Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } }); const vue = require('vue'); const request = require('../../service/request.js'); const utils = require('../../../utils.js'); const hooks = require('../../utils/hooks.js'); const _hoisted_1 = { class: "dv-ipes-sensing-equipment" }; const _hoisted_2 = { class: "equipment-header" }; const _hoisted_3 = /* @__PURE__ */ vue.createElementVNode("div", { class: "equipment-title" }, " 传感设备 ", -1); const _hoisted_4 = /* @__PURE__ */ vue.createElementVNode("span", { class: "equipment-count" }, "总数", -1); const _hoisted_5 = { class: "equipment-value" }; const _hoisted_6 = { class: "equipment-content" }; const _hoisted_7 = { class: "flex flex-s" }; const _hoisted_8 = { class: "value" }; const __default__ = { name: "DvIpesSensingEquipment", title: "传感设备" }; const _sfc_main = /* @__PURE__ */ vue.defineComponent({ ...__default__, props: { monitorTypes: { default: "" } }, setup(__props) { const props = __props; utils.useThemeHook(); const total = vue.ref(0); const countData = vue.ref({ normal: 0, // 正常 abnormal: 0, // 异常 offline: 0, // 离线 stop_using: 0, // 停用 exceed: 0 // 超标 }); const Infos = vue.ref([ { title: "正常", key: "normal", color: "var(--dv-color-success)" }, { title: "异常", key: "abnormal", color: "var(--abnormal)" }, { title: "离线", key: "offline", color: "var(--offline)" }, { title: "停用", key: "stop_using", color: "var(--dv-color-warning)" }, { title: "超标", key: "exceed", color: "var(--dv-color-danger)" } ]); async function getData() { try { const res = await request.default({ method: "get", url: "/ipes-monitor-server/api/v2/datastatistics/all-run-status-statistics", params: props }); const obj = {}; res?.data.forEach((e) => { const key = e.runStatusCode; obj[key] = e.count; }); const { normal = 0, abnormal = 0, offline = 0, stop_using = 0, exceed = 0 } = obj; total.value = normal + abnormal + offline + stop_using + exceed; countData.value = { normal, abnormal, offline, stop_using, exceed }; } catch (error) { console.log(error); } } function getShowData(value) { return value == null ? "0" : value; } vue.onMounted(() => { getData(); }); hooks.setIntervalData(getData, 5 * 60 * 1e3); return (_ctx, _cache) => { return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [ vue.createElementVNode("div", _hoisted_2, [ _hoisted_3, vue.createElementVNode("div", null, [ _hoisted_4, vue.createElementVNode("span", _hoisted_5, vue.toDisplayString(getShowData(total.value)), 1) ]) ]), vue.createElementVNode("div", _hoisted_6, [ (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(Infos.value, (item) => { return vue.openBlock(), vue.createElementBlock("div", { key: item.key, class: "item" }, [ vue.createElementVNode("div", _hoisted_7, [ vue.createElementVNode("div", { class: "dot", style: vue.normalizeStyle({ backgroundColor: item.color }) }, null, 4), vue.createElementVNode("div", null, vue.toDisplayString(item.title), 1) ]), vue.createElementVNode("div", _hoisted_8, vue.toDisplayString(getShowData(countData.value[item.key])), 1) ]); }), 128)) ]) ]); }; } }); exports.default = _sfc_main;