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

151 lines (146 loc) 5.26 kB
'use strict'; Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } }); const vue = require('vue'); const request = require('../../service/request.js'); const utils = require('../../../utils.js'); const hooks = require('../../utils/hooks.js'); const performance = require('./images/performance.png.js'); const performanceLight = require('./images/performance-light.png.js'); const _hoisted_1 = { class: "dv-ipes-performance-warranty-responsibilities" }; const _hoisted_2 = { class: "baseBox" }; const _hoisted_3 = ["src"]; const _hoisted_4 = { class: "left-responsibilities-box" }; const _hoisted_5 = /* @__PURE__ */ vue.createElementVNode("div", { class: "title" }, " 今日新增履职 ", -1); const _hoisted_6 = { class: "num mgt8" }; const _hoisted_7 = { class: "count mgr6" }; const _hoisted_8 = /* @__PURE__ */ vue.createElementVNode("span", { class: "unit" }, "次", -1); const _hoisted_9 = { class: "pieBox" }; const _hoisted_10 = /* @__PURE__ */ vue.createElementVNode("div", { id: "majorPieChart", class: "pie" }, null, -1); const _hoisted_11 = { class: "right-responsibilities-box" }; const _hoisted_12 = /* @__PURE__ */ vue.createElementVNode("div", { class: "title" }, " 年度履职率 ", -1); const _hoisted_13 = { class: "num mgt8" }; const _hoisted_14 = { class: "count rate mgr6" }; const _hoisted_15 = /* @__PURE__ */ vue.createElementVNode("span", { class: "unit" }, "%", -1); const __default__ = { name: "DvIpesPerformanceWarrantyResponsibilities", title: "包保责任履职" }; const _sfc_main = /* @__PURE__ */ vue.defineComponent({ ...__default__, setup(__props) { const { isDark } = utils.useThemeHook(); const basicInfoData = vue.ref({ dayGuaranteeCount: 0, yearAllGuaranteeCount: 0, yearCompletedGuaranteeCount: 0, performanceRate: "0" }); async function getBasicInfoData() { try { const { data } = await request.default({ method: "get", url: "/ipes-srip-server/api/v3/gis/panel/guarantee/statistics" }); const { dayGuaranteeCount, yearAllGuaranteeCount, yearCompletedGuaranteeCount } = data; let performanceRate = ""; if (yearCompletedGuaranteeCount && yearAllGuaranteeCount) performanceRate = (yearCompletedGuaranteeCount / yearAllGuaranteeCount * 100).toFixed(1); basicInfoData.value = { dayGuaranteeCount, yearAllGuaranteeCount, yearCompletedGuaranteeCount, performanceRate }; drawChart(basicInfoData.value); } catch (error) { console.log(error); } } vue.ref(4); function drawChart(data) { const legendData = [ { name: "已完成", y: data.yearCompletedGuaranteeCount || 0 }, { name: "总数", y: data.yearAllGuaranteeCount || 0 } ]; const seriesData = legendData; const highcharts = window.Highcharts; highcharts.chart("majorPieChart", { chart: { type: "pie", animation: false, // marginTop: 20, backgroundColor: "transparent", // 不显示背景色 options3d: { enabled: true, alpha: 50, beta: 0, depth: 8 } }, credits: { enabled: false }, title: { text: null }, colors: ["#15F3A3", "#8FAFC7", "#fdbd00"], tooltip: { enabled: false }, plotOptions: { pie: { center: ["50%", "50%"], allowPointSelect: true, inactiveOtherPoints: false, cursor: "pointer", depth: 10, innerSize: "0%", size: "40", dataLabels: { enabled: false } } }, series: [ { type: "pie", name: "年度履职率", data: seriesData } ] }); } vue.onMounted(async () => { getBasicInfoData(); }); hooks.setIntervalData(getBasicInfoData, 5 * 60 * 1e3); return (_ctx, _cache) => { return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [ vue.createElementVNode("div", _hoisted_2, [ vue.createElementVNode("img", { class: "icon mgr4", src: vue.unref(isDark) ? vue.unref(performance.default) : vue.unref(performanceLight.default) }, null, 8, _hoisted_3), vue.createElementVNode("div", _hoisted_4, [ _hoisted_5, vue.createElementVNode("div", _hoisted_6, [ vue.createElementVNode("span", _hoisted_7, vue.toDisplayString(basicInfoData.value.dayGuaranteeCount), 1), _hoisted_8 ]) ]) ]), vue.createElementVNode("div", _hoisted_9, [ _hoisted_10, vue.createElementVNode("div", _hoisted_11, [ _hoisted_12, vue.createElementVNode("div", _hoisted_13, [ vue.createElementVNode("span", _hoisted_14, vue.toDisplayString(basicInfoData.value.performanceRate), 1), _hoisted_15 ]) ]) ]) ]); }; } }); exports.default = _sfc_main;