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

112 lines (109 loc) 4.13 kB
import { defineComponent, ref, computed, onMounted, openBlock, createElementBlock, createElementVNode, Fragment, renderList, normalizeClass, toDisplayString, normalizeStyle, createCommentVNode } from 'vue'; import requestControl from '../../service/request.mjs'; import { setIntervalData } from '../../utils/hooks.mjs'; const _hoisted_1 = { class: "type-box" }; const _hoisted_2 = { class: "value" }; const _hoisted_3 = { class: "title" }; const _hoisted_4 = { class: "done" }; const _hoisted_5 = { class: "done-header" }; const _hoisted_6 = /* @__PURE__ */ createElementVNode("span", null, "上周排查任务完成率", -1); const _hoisted_7 = { class: "doneRateNumber" }; const _hoisted_8 = { key: 0, class: "progress" }; const _hoisted_9 = { class: "progress-inner" }; const _hoisted_10 = /* @__PURE__ */ createElementVNode("div", { class: "progress-end" }, null, -1); const __default__ = { name: "DvIpesHiddenDangerInvestigation", title: "隐患排查" }; const _sfc_main = /* @__PURE__ */ defineComponent({ ...__default__, props: { url: { type: String, default: "/ipes-srip-server/api/v3/gis/panel/hidden-trouble" }, url2: { type: String, default: "/ipes-srip-server/api/v3/gis/hidden-trouble/mission/statistics/percent" } }, setup(__props) { const props = __props; const data = ref({ general: null, major: null, ratio: null }); const typeInfos = ref([ { title: "一般隐患", key: "general" }, { title: "重大隐患", key: "major" }, { title: "整改率", key: "ratio", unit: "%" } ]); const doneRate = ref(null); const componentBox = ref(""); const copies = computed(() => { const offsetWidth = componentBox.value?.offsetWidth || 0; return offsetWidth > 0 ? (offsetWidth - 24 - 2) / 3 : 0; }); async function getData() { try { const [res, res1] = await Promise.all([ requestControl({ url: props.url }), requestControl({ url: props.url2 }) ]); data.value = res.data; doneRate.value = res1.data?.missionCompletedPercent || 0; } catch (error) { console.log(error); } } function getShowData(value) { return value == null || isNaN(+value) ? "--" : value; } onMounted(() => { getData(); }); setIntervalData(getData, 5 * 60 * 1e3); return (_ctx, _cache) => { return openBlock(), createElementBlock("div", { ref_key: "componentBox", ref: componentBox, class: "dv-ipes-hidden-danger" }, [ createElementVNode("div", _hoisted_1, [ (openBlock(true), createElementBlock(Fragment, null, renderList(typeInfos.value, (item) => { return openBlock(), createElementBlock("div", { key: item.key, class: normalizeClass(["type-box-item", item.key]) }, [ createElementVNode("div", _hoisted_2, toDisplayString(getShowData(data.value[item.key]) + (item.unit || "")), 1), createElementVNode("div", _hoisted_3, toDisplayString(item.title), 1) ], 2); }), 128)) ]), createElementVNode("div", _hoisted_4, [ createElementVNode("div", _hoisted_5, [ _hoisted_6, createElementVNode("span", _hoisted_7, toDisplayString(`${doneRate.value}%`), 1) ]), !isNaN(doneRate.value) ? (openBlock(), createElementBlock("div", _hoisted_8, [ createElementVNode("div", _hoisted_9, [ (openBlock(true), createElementBlock(Fragment, null, renderList(Math.round(doneRate.value * (copies.value / 100)), (item) => { return openBlock(), createElementBlock("div", { key: item, class: "bar", style: normalizeStyle({ flex: `0 0 calc((100% - ${copies.value}px) / ${copies.value})` }) }, null, 4); }), 128)) ]), _hoisted_10 ])) : createCommentVNode("", true) ]) ], 512); }; } }); export { _sfc_main as default };