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

102 lines (99 loc) 4.13 kB
import { ElScrollbar, ElEmpty } from 'element-plus/es'; import 'element-plus/es/components/base/style/css'; import 'element-plus/es/components/empty/style/css'; import 'element-plus/es/components/scrollbar/style/css'; import { defineComponent, reactive, watch, openBlock, createElementBlock, createBlock, withCtx, Fragment, renderList, createElementVNode, toDisplayString, createVNode, unref } from 'vue'; import _sfc_main$1 from './components/AppItem.vue.mjs'; import './components/AppItem.vue2.mjs'; import _sfc_main$2 from './components/NumberItem.vue.mjs'; import './components/NumberItem.vue2.mjs'; import _sfc_main$3 from './components/PercentageItem.vue.mjs'; import './components/PercentageItem.vue2.mjs'; import newNoDataSvg from './images/empty.png.mjs'; const _hoisted_1 = { class: "dv-ipes-module-content" }; const _hoisted_2 = { class: "dv-ipes-pre-level" }; const _hoisted_3 = { class: "dv-ipes-energy-top dv-ipes-flex-bw-c" }; const _hoisted_4 = { class: "dv-ipes-energy-bottom" }; const __default__ = { name: "Level3AirDefense", title: "三级防空" }; const _sfc_main = /* @__PURE__ */ defineComponent({ ...__default__, props: { data: { type: Array, default: () => [{ monitorType: "wg", category: "fqpk", level: 3, normal: 23, abnormal: 0, offline: 0, name: "废气排口", rank: 5 }] } }, setup(__props) { const props = __props; const levelList = reactive([]); watch(() => props.data, (newVal, oldVal) => { const level = []; newVal.map((da) => { return level.push(da.level); }); const newLevel = Array.from(new Set(level)); newLevel.forEach((item) => { const newda = []; newVal.forEach((da) => { if (da.level === item) { da.normal = da.normal.toString(); da.offline = da.offline.toString(); da.abnormal = da.abnormal.toString(); newda.push(da); } }); const levelName = item === 1 ? "一级防控" : item === 2 ? "二级防控" : "三级防控"; levelList.push({ level: levelName, list: newda }); }); }, { immediate: true, deep: true }); return (_ctx, _cache) => { const _component_el_scrollbar = ElScrollbar; const _component_el_empty = ElEmpty; return openBlock(), createElementBlock("div", _hoisted_1, [ levelList.length > 0 ? (openBlock(), createBlock(_component_el_scrollbar, { key: 0, style: { "max-height": "282px" } }, { default: withCtx(() => [ (openBlock(true), createElementBlock(Fragment, null, renderList(levelList, (item, index) => { return openBlock(), createElementBlock("div", { key: index, class: "dv-ipes-mgb4" }, [ createElementVNode("div", _hoisted_2, toDisplayString(item.level), 1), (openBlock(true), createElementBlock(Fragment, null, renderList(item.list, (list, index2) => { return openBlock(), createBlock(_sfc_main$1, { key: index2, class: "dv-ipes-item-module dv-ipes-item-common" }, { default: withCtx(() => [ createElementVNode("div", _hoisted_3, [ createElementVNode("span", null, toDisplayString(list.name), 1), createVNode(_sfc_main$2, { value: list }, null, 8, ["value"]) ]), createElementVNode("div", _hoisted_4, [ createVNode(_sfc_main$3, { value: list }, null, 8, ["value"]) ]) ]), _: 2 }, 1024); }), 128)) ]); }), 128)) ]), _: 1 })) : (openBlock(), createBlock(_component_el_empty, { key: 1, class: "empty", "image-size": 180, image: unref(newNoDataSvg), description: "" }, null, 8, ["image"])) ]); }; } }); export { _sfc_main as default };