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

115 lines (110 loc) 4.2 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/scrollbar/style/css'); const vue = require('vue'); const index = require('./api/index.js'); const _hoisted_1 = { class: "dv-bmp-event-list" }; const _hoisted_2 = { class: "custom-table" }; const _hoisted_3 = { class: "custom-table-header" }; const _hoisted_4 = /* @__PURE__ */ vue.createElementVNode("div", { style: { "width": "46px" }, class: "fixed-width" }, " 序号 ", -1); const _hoisted_5 = { class: "custom-table-cell fixed-width", style: { "width": "46px" } }; const _sfc_main = /* @__PURE__ */ vue.defineComponent({ __name: "index", props: { siteCodeList: Array, envTypeCodeList: Array, centerLatitude: String, centerLongitude: String, timeStamp: [Number, String], // 是否使用内置接口进行数据查询 isUseBuiltInApi: { type: Boolean, default: true }, // 不使用内部接口查询时,组件使用的数据 data: Array }, setup(__props) { const props = __props; const tableData = vue.ref({}); const tableProps = vue.ref([ { label: "事件名称", prop: "eventName" }, { label: "状态", prop: "currentDisposalStatusName", width: "72px" }, { label: "距离", prop: "distance", width: "80px" } ]); const getData = async () => { const params = { siteCodeList: props.siteCodeList, envTypeCodeList: props.envTypeCodeList, centerLatitude: props.centerLongitude, centerLongitude: props.centerLongitude, timeStamp: props.timeStamp }; const res = await index.queryEventDataByTimePoint(params); return res?.data; }; vue.onMounted(async () => { if (props.isUseBuiltInApi) tableData.value = await getData(); else tableData.value = props.data || []; }); return (_ctx, _cache) => { const _component_el_scrollbar = es.ElScrollbar; return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [ vue.createElementVNode("div", _hoisted_2, [ vue.createElementVNode("div", _hoisted_3, [ _hoisted_4, (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(tableProps.value, (item) => { return vue.openBlock(), vue.createElementBlock("div", { key: item.prop, class: vue.normalizeClass(item.width ? "fixed-width" : "auto-width"), style: vue.normalizeStyle({ width: item.width }) }, vue.toDisplayString(item.label), 7); }), 128)) ]), vue.createVNode(_component_el_scrollbar, { class: "custom-table-body" }, { default: vue.withCtx(() => [ (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(tableData.value, (item, index) => { return vue.openBlock(), vue.createElementBlock("div", { key: item.id, class: "custom-table-row" }, [ vue.createElementVNode("div", _hoisted_5, vue.toDisplayString(index + 1), 1), (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(tableProps.value, (prop) => { return vue.openBlock(), vue.createElementBlock("div", { key: prop.prop, class: vue.normalizeClass(["custom-table-cell", [prop.width ? "fixed-width" : "auto-width", prop.prop === "currentDisposalStatusName" ? item[prop.prop] === 0 ? "undisposed" : item[prop.prop] === 1 ? "handing" : "disposed" : ""]]), style: vue.normalizeStyle({ width: prop.width }) }, vue.toDisplayString(item[prop.prop]), 7); }), 128)) ]); }), 128)) ]), _: 1 }) ]) ]); }; } }); exports.default = _sfc_main;