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

201 lines (198 loc) 7.21 kB
import { ElInfiniteScroll } from 'element-plus/es'; import 'element-plus/es/components/base/style/css'; import 'element-plus/es/components/infinite-scroll/style/css'; import { defineComponent, ref, computed, openBlock, createElementBlock, createElementVNode, createTextVNode, toDisplayString, createVNode, withDirectives, Fragment, renderList, createBlock, createCommentVNode } from 'vue'; import requestControl from '../../service/request.mjs'; import _sfc_main$3 from '../common/NoData.vue.mjs'; import '../common/NoData.vue2.mjs'; import { setIntervalData } from '../../utils/hooks.mjs'; import _sfc_main$1 from './components/Tabs.vue.mjs'; import './components/Tabs.vue2.mjs'; import _sfc_main$2 from './components/ListItem.vue.mjs'; import './components/ListItem.vue2.mjs'; const _hoisted_1 = { class: "dv-ipes-event-tracking" }; const _hoisted_2 = { class: "totalCount" }; const _hoisted_3 = { class: "num" }; const _hoisted_4 = { key: 0, class: "infinite-list-wrapper" }; const _hoisted_5 = ["infinite-scroll-disabled"]; const _hoisted_6 = { key: 0 }; const _hoisted_7 = { key: 1, class: "last-data" }; const __default__ = { name: "DvIpesGeneralManagement", title: "事件跟踪" }; const _sfc_main = /* @__PURE__ */ defineComponent({ ...__default__, props: { isAccessPermission: { type: Boolean, default: false } }, emits: ["clickItem"], setup(__props, { emit }) { const props = __props; const activeTab = ref(""); const tabList = ref([]); const cardData = ref([]); const totalCount = ref(0); const getCountByStatusForPark = async () => { try { const result = await requestControl({ method: "POST", url: "/bmp-mission-center-server/api/v1/parkStatistics/countByStatusForPark", data: { alarmTypeCodeList: ["automonitor_over", "automonitor_minute_over"], // 过滤预警事件 isAccessPermission: props.isAccessPermission, missionTypeCodeList: ["alarm"] // startTime: dayjs().startOf('day').valueOf(), // endTime: dayjs().endOf('day').valueOf() } }); const data = result.data; totalCount.value = data.doingCount + data.undoneCount; } catch (error) { console.log(error); } }; const getTaskLevelStatistics = async () => { try { const result = await requestControl({ method: "POST", url: "/bmp-mission-center-server/api/v1/parkStatistics/countByMissionLevel", data: { alarmTypeCodeList: ["automonitor_over", "automonitor_minute_over"], // 过滤预警事件 missionTypeCodeList: ["alarm"], missionStatusList: [0, 1], isAccessPermission: props.isAccessPermission // startTime: dayjs().startOf('day').valueOf(), // endTime: dayjs().endOf('day').valueOf() } }); const data = result.data || []; tabList.value = data; activeTab.value = data[0].missionLevelCode; page = 1; count.value = 0; listTotalCount.value = 0; cardData.value = []; getEventList(); } catch (error) { console.log(error); } }; const limit = 10; let page = 1; const count = ref(0); const listTotalCount = ref(0); const getEventList = async () => { try { const result = await requestControl({ method: "POST", url: "/bmp-mission-center-server/api/v1/missionRecord/pc/queryMissionRecordInfoPage", data: { alarmTypeCodeList: ["automonitor_over", "automonitor_minute_over"], // 过滤预警事件 missionTypeCodeList: ["alarm"], missionStatusList: [0, 1], missionLevelCodeList: [activeTab.value], limit, page, isAccessPermission: props.isAccessPermission } }); loading.value = false; const data = result.data || []; const d = data.map((item) => { return { id: item.id, missionLevelCode: item.missionLevelCode, missionLevelName: item.missionLevelName, startTimeStr: item.startTimeStr, missionSuperviseStatus: item.missionSuperviseStatus, description: item.description, isAccessPermission: props.isAccessPermission }; }); cardData.value.push(...d); count.value = result.count; listTotalCount.value = result.totalCount; } catch (error) { console.log(error); } }; getCountByStatusForPark(); getTaskLevelStatistics(); const changeTab = (value) => { activeTab.value = value; page = 1; count.value = 0; listTotalCount.value = 0; cardData.value = []; getEventList(); }; const loading = ref(false); const noMore = computed(() => (page - 1) * limit + count.value >= listTotalCount.value); const disabled = computed(() => loading.value || noMore.value); const load = () => { loading.value = true; page++; getEventList(); }; const onClick = (item) => { emit("clickItem", item); }; setIntervalData(() => { getCountByStatusForPark(); getTaskLevelStatistics(); }, 5 * 60 * 1e3); return (_ctx, _cache) => { const _directive_infinite_scroll = ElInfiniteScroll; return openBlock(), createElementBlock("div", _hoisted_1, [ createElementVNode("div", _hoisted_2, [ createTextVNode(" 未办结事件 "), createElementVNode("span", _hoisted_3, toDisplayString(totalCount.value), 1) ]), createVNode(_sfc_main$1, { class: "dv-ipes-tab", data: tabList.value, "model-value": activeTab.value, onChange: changeTab }, null, 8, ["data", "model-value"]), cardData.value.length ? (openBlock(), createElementBlock("div", _hoisted_4, [ withDirectives((openBlock(), createElementBlock("div", { class: "card-list", "infinite-scroll-distance": "30", "infinite-scroll-disabled": disabled.value }, [ (openBlock(true), createElementBlock(Fragment, null, renderList(cardData.value, (item) => { return openBlock(), createBlock(_sfc_main$2, { key: item.missionLevelCode, class: "dv-ipes-list", data: item, onClick: ($event) => onClick(item) }, null, 8, ["data", "onClick"]); }), 128)), loading.value ? (openBlock(), createElementBlock("p", _hoisted_6, " Loading... ")) : createCommentVNode("", true), noMore.value ? (openBlock(), createElementBlock("p", _hoisted_7, " 到底啦~ ")) : createCommentVNode("", true) ], 8, _hoisted_5)), [ [_directive_infinite_scroll, load] ]) ])) : (openBlock(), createBlock(_sfc_main$3, { key: 1, class: "infinite-list-wrapper", type: "noDataTime2" })) ]); }; } }); export { _sfc_main as default };