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

168 lines (163 loc) 7.96 kB
'use strict'; Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } }); const vue = require('vue'); const elementPlusExpand = require('@ued_fpi/element-plus-expand'); const request = require('../../service/request.js'); const hooks = require('../../utils/hooks.js'); const _hoisted_1 = { class: "dv-ipes-enterprise-protection-code" }; const _hoisted_2 = { class: "dv-ipes-env-code-list" }; const _hoisted_3 = { class: "flex" }; const _hoisted_4 = { xmlns: "http://www.w3.org/2000/svg", "xmlns:xlink": "http://www.w3.org/1999/xlink", fill: "none", version: "1.1", width: "50", height: "50", viewBox: "0 0 30 30" }; const _hoisted_5 = /* @__PURE__ */ vue.createElementVNode("defs", null, [ /* @__PURE__ */ vue.createElementVNode("clipPath", { id: "master_svg0_809_2528" }, [ /* @__PURE__ */ vue.createElementVNode("rect", { x: "0", y: "0", width: "40", height: "40", rx: "2" }) ]) ], -1); const _hoisted_6 = { "clip-path": "url(#master_svg0_809_2528)" }; const _hoisted_7 = /* @__PURE__ */ vue.createElementVNode("rect", { x: "0", y: "0", width: "40", height: "40", rx: "2" }, null, -1); const _hoisted_8 = ["fill"]; const _hoisted_9 = { class: "dv-ipes-value" }; const _hoisted_10 = /* @__PURE__ */ vue.createElementVNode("span", { class: "unit" }, "家", -1); const _hoisted_11 = { class: "dv-ipes-rate-num" }; const _hoisted_12 = { class: "dv-ipes-env-list" }; const _hoisted_13 = /* @__PURE__ */ vue.createElementVNode("div", { class: "dv-ipes-env-list-header dv-ipes-flex-bw-c" }, [ /* @__PURE__ */ vue.createElementVNode("div", { class: "dv-ipes-th" }, " 重点问题企业 "), /* @__PURE__ */ vue.createElementVNode("div", { class: "dv-ipes-th" }, " 问题数 ") ], -1); const _hoisted_14 = { class: "dv-ipes-tr dv-ipes-body-name" }; const _hoisted_15 = ["title", "onClick"]; const _hoisted_16 = { class: "dv-ipes-tr dv-ipes-value" }; const _hoisted_17 = { key: 1, class: "dv-ipes-no-data" }; const __default__ = { name: "DvIpesEnterpriseProtectionCode", title: "环保码统计" }; const _sfc_main = /* @__PURE__ */ vue.defineComponent({ ...__default__, emits: ["clickCompany"], setup(__props, { emit: $emit }) { const codeData = vue.ref([ { ruleColorName: "红码", inColor: "#F84439", num: 0, rate: "0" }, { ruleColorName: "黄码", inColor: "#FDBD00", num: 0, rate: "0" }, { ruleColorName: "绿码", inColor: "#15F3A3", num: 0, rate: "0" } ]); const codeList = vue.ref([]); function onClickCompany(item) { $emit("clickCompany", item); } async function getData() { try { const { data } = await request.default({ method: "get", url: "/ipes-company-epcode-server/web/api/v1/thirdcode/getInfo" }); let total = 0; data.colors.forEach((item) => { total += item.num; }); codeData.value = codeData.value.map((item) => { const obj = data.colors.find((e) => e.ruleColorName === item.ruleColorName); const rate = total === 0 ? 0 : `${+(obj.num / total * 100).toFixed(1)}%`; return Object.assign(item, obj, { rate }); }); codeList.value = data?.companys || []; } catch (error) { console.log(error); } } 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, [ vue.createElementVNode("div", _hoisted_3, [ (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(codeData.value, (item, index) => { return vue.openBlock(), vue.createElementBlock("div", { key: index, class: "dv-ipes-code-wrap" }, [ (vue.openBlock(), vue.createElementBlock("svg", _hoisted_4, [ _hoisted_5, vue.createElementVNode("g", _hoisted_6, [ _hoisted_7, vue.createElementVNode("g", null, [ vue.createElementVNode("path", { d: "M25.6667,27.999755859375L25.6667,25.666455859375L28,25.666455859375L28,27.999755859375L25.6667,27.999755859375ZM21,27.999755859375L21,25.666455859375L23.3333,25.666455859375L23.3333,27.999755859375L21,27.999755859375ZM16.6667,27.999755859375L16.6667,16.666455859375L23.3333,16.666455859375L23.3333,18.999755859375L19,18.999755859375L19,27.999755859375L16.6667,27.999755859375ZM4,27.999755859375L4,16.666455859375L15.3333,16.666455859375L15.3333,27.999755859375L4,27.999755859375ZM6.33333,25.666455859375L13,25.666455859375L13,18.999755859375L6.33333,18.999755859375L6.33333,25.666455859375ZM8.5,23.499755859375L8.5,21.166455859375L10.83333,21.166455859375L10.83333,23.499755859375L8.5,23.499755859375ZM21.3333,23.333055859375L21.3333,18.999755859375L28,18.999755859375L28,23.333055859375L21.3333,23.333055859375ZM25.6667,18.999755859375L25.6667,16.666455859375L28,16.666455859375L28,18.999755859375L25.6667,18.999755859375ZM16.6667,15.333055859375L16.6667,3.999755859375L28,3.999755859375L28,15.333055859375L16.6667,15.333055859375ZM19,12.999755859375L25.6667,12.999755859375L25.6667,6.333085859375L19,6.333085859375L19,12.999755859375ZM4,15.333055859375L4,3.999755859375L15.3333,3.999755859375L15.3333,15.333055859375L4,15.333055859375ZM6.33333,12.999755859375L13,12.999755859375L13,6.333085859375L6.33333,6.333085859375L6.33333,12.999755859375ZM21.1667,10.833085859375L21.1667,8.499755859375L23.5,8.499755859375L23.5,10.833085859375L21.1667,10.833085859375ZM8.5,10.833085859375L8.5,8.499755859375L10.83333,8.499755859375L10.83333,10.833085859375L8.5,10.833085859375Z", fill: item.inColor, "fill-opacity": "1" }, null, 8, _hoisted_8) ]) ]) ])), vue.createElementVNode("div", _hoisted_9, [ vue.createElementVNode("span", { class: "num", style: vue.normalizeStyle({ color: item.inColor }) }, vue.toDisplayString(item.num), 5), _hoisted_10 ]), vue.createElementVNode("div", _hoisted_11, vue.toDisplayString(item.rate), 1) ]); }), 128)) ]) ]), vue.createElementVNode("div", _hoisted_12, [ _hoisted_13, codeList.value && codeList.value.length > 0 ? (vue.openBlock(), vue.createBlock(vue.unref(elementPlusExpand.FpiElRolling), { key: 0, class: "dv-ipes-env-list-con", direction: "y", time: 200 }, { default: vue.withCtx(() => [ (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(codeList.value, (item, index) => { return vue.openBlock(), vue.createElementBlock("div", { key: index, class: "dv-ipes-flex-bw-c dv-ipes-body-item" }, [ vue.createElementVNode("div", _hoisted_14, [ vue.createElementVNode("span", { href: "javascript:void(0);", title: item.companyName, onClick: ($event) => onClickCompany(item) }, vue.toDisplayString(item.companyName), 9, _hoisted_15) ]), vue.createElementVNode("div", _hoisted_16, vue.toDisplayString(item.num), 1) ]); }), 128)) ]), _: 1 })) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_17, " 暂无数据 ")) ]) ]); }; } }); exports.default = _sfc_main;