@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.23 kB
JavaScript
import { defineComponent, ref, onMounted, openBlock, createElementBlock, createElementVNode, toDisplayString, createVNode } from 'vue';
import _imports_0 from './images/icon-percent.png.mjs';
import dayjs from 'dayjs';
import IpesProgressBar from '../common/IpesProgressBar.vue.mjs';
const _hoisted_1 = { class: "DvIpesStreetLightingManagement" };
const _hoisted_2 = { class: "module-title flex" };
const _hoisted_3 = { class: "title" };
const _hoisted_4 = /* @__PURE__ */ createElementVNode("span", null, "设备情况", -1);
const _hoisted_5 = { class: "date-text" };
const _hoisted_6 = { class: "lighting-device" };
const _hoisted_7 = { class: "lighting-device__info" };
const _hoisted_8 = { class: "lighting-device__percent" };
const _hoisted_9 = /* @__PURE__ */ createElementVNode("div", { class: "title" }, " 亮灯率 ", -1);
const _hoisted_10 = { class: "value" };
const _hoisted_11 = { class: "lighting-device__progress" };
const _hoisted_12 = { class: "lighting-device__detail" };
const _hoisted_13 = { class: "left" };
const _hoisted_14 = /* @__PURE__ */ createElementVNode("div", { class: "title" }, [
/* @__PURE__ */ createElementVNode("img", {
class: "icon mgr4",
src: _imports_0
}),
/* @__PURE__ */ createElementVNode("span", null, "设备联网率")
], -1);
const _hoisted_15 = { class: "percent" };
const _hoisted_16 = { class: "right" };
const _hoisted_17 = /* @__PURE__ */ createElementVNode("div", { class: "title" }, " 亮灯/关灯 ", -1);
const _hoisted_18 = { class: "value" };
const _hoisted_19 = { class: "lightBg1" };
const _hoisted_20 = /* @__PURE__ */ createElementVNode("span", { class: "space" }, " / ", -1);
const _hoisted_21 = { class: "lightBg2" };
const __default__ = {
name: "DvIpesStreetLightingManagement",
title: "路灯管理"
};
const _sfc_main = /* @__PURE__ */ defineComponent({
...__default__,
props: {
lightingDevice: { default: () => ({
online: 0,
offline: 0,
onlamp: 20,
offlamp: 100
}) }
},
setup(__props) {
const props = __props;
const year = ref(dayjs().format("YYYY-MM-DD HH:mm"));
const onlinePercent = ref(20);
const percent = ref(0);
onMounted(() => {
getLightingDevice();
});
const getLightingDevice = async () => {
try {
percent.value = (props.lightingDevice?.onlamp || 0) / ((props.lightingDevice?.onlamp || 0) + (props.lightingDevice?.offlamp || 0)) * 100;
onlinePercent.value = (props.lightingDevice?.online || 0) / ((props.lightingDevice?.online || 0) + (props.lightingDevice?.offline || 0)) * 100;
} catch (e) {
console.log(e);
}
};
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1, [
createElementVNode("div", _hoisted_2, [
createElementVNode("div", _hoisted_3, [
_hoisted_4,
createElementVNode("span", _hoisted_5, "（" + toDisplayString(year.value) + "）", 1)
])
]),
createElementVNode("div", _hoisted_6, [
createElementVNode("div", _hoisted_7, [
createElementVNode("div", _hoisted_8, [
_hoisted_9,
createElementVNode("div", _hoisted_10, toDisplayString(percent.value.toFixed(2) || 0) + "% ", 1)
]),
createElementVNode("div", _hoisted_11, [
createVNode(IpesProgressBar, { percent: percent.value }, null, 8, ["percent"])
]),
createElementVNode("div", _hoisted_12, [
createElementVNode("div", _hoisted_13, [
_hoisted_14,
createElementVNode("div", _hoisted_15, toDisplayString(onlinePercent.value || 0) + "% ", 1)
]),
createElementVNode("div", _hoisted_16, [
_hoisted_17,
createElementVNode("div", _hoisted_18, [
createElementVNode("span", _hoisted_19, toDisplayString(_ctx.lightingDevice.onlamp || 0), 1),
_hoisted_20,
createElementVNode("span", _hoisted_21, toDisplayString(_ctx.lightingDevice.offlamp || 0), 1)
])
])
])
])
])
]);
};
}
});
export { _sfc_main as default };