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

105 lines (100 loc) 3.99 kB
'use strict'; Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } }); const es = require('element-plus/es'); require('element-plus/es/components/base/style/css'); require('element-plus/es/components/tooltip/style/css'); const vue = require('vue'); const LottieAnimation_vue_vue_type_script_setup_true_lang = require('./LottieAnimation.vue.js'); const cloud = require('./lottie/cloud.json.js'); const _hoisted_1 = { class: "dv-ipes-real-time-air" }; const _hoisted_2 = { class: "number-wrap" }; const _hoisted_3 = { class: "pollute-flex" }; const _hoisted_4 = /* @__PURE__ */ vue.createElementVNode("span", { class: "factor-name" }, "AQI", -1); const _hoisted_5 = { class: "pollution-wrap" }; const _hoisted_6 = { class: "real-time" }; const _hoisted_7 = { class: "first-pollute-flex" }; const _hoisted_8 = /* @__PURE__ */ vue.createElementVNode("span", { class: "first-pollute" }, "首要污染物", -1); const _hoisted_9 = { class: "other-factore" }; const _hoisted_10 = { class: "text" }; const __default__ = { name: "DvIpesRealTimeAir", title: "实时空气质量" }; const _sfc_main = /* @__PURE__ */ vue.defineComponent({ ...__default__, props: { width: { default: "100%", type: String }, height: { default: 72, type: Number }, lottieAnimationUrl: { default: "", type: String }, airQualityObj: { default: () => ({}), type: Object } }, setup(__props) { const props = __props; const cloudData = vue.markRaw(cloud.default); const cloudUrl = vue.computed(() => { return props.lottieAnimationUrl; }); return (_ctx, _cache) => { const _component_el_tooltip = es.ElTooltip; return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [ vue.createElementVNode("div", { class: vue.normalizeClass(["pollute-div", { "value-length": String(__props.airQualityObj.aqiValue).length >= 3 }]) }, [ vue.createElementVNode("div", _hoisted_2, [ vue.createElementVNode("span", { class: "real-number", style: vue.normalizeStyle({ color: `${__props.airQualityObj.aqiColor}` }) }, vue.toDisplayString(__props.airQualityObj.aqiValue), 5), vue.createElementVNode("div", _hoisted_3, [ _hoisted_4, vue.createElementVNode("span", { class: "factor-status", style: vue.normalizeStyle({ color: `${__props.airQualityObj.aqiColor}` }) }, vue.toDisplayString(__props.airQualityObj.aqiLevel || "--"), 5) ]) ]), vue.createElementVNode("div", _hoisted_5, [ vue.createElementVNode("span", _hoisted_6, vue.toDisplayString(__props.airQualityObj.time), 1), vue.createElementVNode("div", _hoisted_7, [ _hoisted_8, vue.createElementVNode("div", _hoisted_9, [ vue.createVNode(_component_el_tooltip, { class: "item", effect: "dark", content: __props.airQualityObj.mainPolluter, disabled: String(__props.airQualityObj.mainPolluter).length <= 5, placement: "top" }, { default: vue.withCtx(() => [ vue.createElementVNode("div", _hoisted_10, vue.toDisplayString(__props.airQualityObj.mainPolluter), 1) ]), _: 1 }, 8, ["content", "disabled"]) ]) ]) ]) ], 2), vue.createVNode(LottieAnimation_vue_vue_type_script_setup_true_lang.default, { class: "canvas-class", width: __props.width, height: __props.height, data: vue.unref(cloudData), url: vue.unref(cloudUrl) }, null, 8, ["width", "height", "data", "url"]) ]); }; } }); exports.default = _sfc_main;