@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" />
158 lines (155 loc) • 6.83 kB
JavaScript
import { ElOption, ElSelect } from 'element-plus/es';
import 'element-plus/es/components/base/style/css';
import 'element-plus/es/components/select/style/css';
import 'element-plus/es/components/option/style/css';
import { defineComponent, mergeDefaults, ref, computed, openBlock, createElementBlock, createElementVNode, toDisplayString, createVNode, withCtx, Fragment, renderList, createBlock, normalizeClass } from 'vue';
import dayjs from 'dayjs';
import { defaultProps } from './types/index.mjs';
const _hoisted_1 = { class: "dv-ipes-sealing-manage" };
const _hoisted_2 = { class: "sealing-row" };
const _hoisted_3 = { class: "sealing-header" };
const _hoisted_4 = { class: "sealing-header__title" };
const _hoisted_5 = /* @__PURE__ */ createElementVNode("span", null, "车辆出入园统计", -1);
const _hoisted_6 = { class: "sealing-header__title--sub" };
const _hoisted_7 = { class: "sealing-header__extra" };
const _hoisted_8 = { class: "access-statistics" };
const _hoisted_9 = { class: "access-statistics-item__total" };
const _hoisted_10 = { class: "access-statistics-item__type" };
const _hoisted_11 = { class: "sealing-row" };
const _hoisted_12 = { class: "sealing-header" };
const _hoisted_13 = /* @__PURE__ */ createElementVNode("div", { class: "sealing-header__title" }, [
/* @__PURE__ */ createElementVNode("span", null, "园内危化品车辆")
], -1);
const _hoisted_14 = { class: "sealing-header__extra" };
const _hoisted_15 = { class: "hazardous-statistics" };
const _hoisted_16 = { class: "hazardous-statistics-item" };
const _hoisted_17 = { class: "hazardous-statistics-item__type" };
const _hoisted_18 = { class: "hazardous-statistics-item__total" };
const _hoisted_19 = { class: "hazardous-statistics-item" };
const _hoisted_20 = { class: "hazardous-statistics-item__type" };
const _hoisted_21 = { class: "hazardous-statistics-item__total" };
const __default__ = {
name: "DvIpesSealingManage",
title: "封闭化管理"
};
const _sfc_main = /* @__PURE__ */ defineComponent({
...__default__,
props: mergeDefaults({
hazardousCar: {},
accessStatistic: {},
timeType: {},
timeTypeOptions: {},
parkOptions: {}
}, {
...defaultProps
}),
emits: {
onTimeTypeChange: (value) => value,
onParkTypeChange: (value) => value
},
setup(__props, { emit }) {
const props = __props;
const _timeType = ref(props.timeType);
const parkType = ref("");
const timeLabel = computed(() => {
let format;
((format2) => {
format2["year"] = "YYYY";
format2["month"] = "YYYY-MM";
format2["day"] = "YYYY-MM-DD";
})(format || (format = {}));
return dayjs().format(format[_timeType.value]);
});
const handleTimeTypeChange = (value) => {
emit("onTimeTypeChange", value);
};
const onParkTypeChange = (value) => {
emit("onParkTypeChange", value);
};
return (_ctx, _cache) => {
const _component_el_option = ElOption;
const _component_el_select = ElSelect;
return openBlock(), createElementBlock("div", _hoisted_1, [
createElementVNode("div", _hoisted_2, [
createElementVNode("div", _hoisted_3, [
createElementVNode("div", _hoisted_4, [
_hoisted_5,
createElementVNode("span", _hoisted_6, "(" + toDisplayString(timeLabel.value) + ")", 1)
]),
createElementVNode("div", _hoisted_7, [
createVNode(_component_el_select, {
modelValue: _timeType.value,
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _timeType.value = $event),
"popper-append-to-body": false,
class: "fpi-select",
onChange: handleTimeTypeChange
}, {
default: withCtx(() => [
(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.timeTypeOptions, (item) => {
return openBlock(), createBlock(_component_el_option, {
key: item.value,
value: item.value,
label: item.label
}, null, 8, ["value", "label"]);
}), 128))
]),
_: 1
}, 8, ["modelValue"])
])
]),
createElementVNode("div", _hoisted_8, [
(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.accessStatistic, (item, idx) => {
return openBlock(), createElementBlock("div", {
key: idx,
class: normalizeClass(["access-statistics-item", `access-statistics-item--${item.type}`])
}, [
createElementVNode("div", _hoisted_9, toDisplayString(item.value), 1),
createElementVNode("div", _hoisted_10, toDisplayString(item.label), 1)
], 2);
}), 128))
])
]),
createElementVNode("div", _hoisted_11, [
createElementVNode("div", _hoisted_12, [
_hoisted_13,
createElementVNode("div", _hoisted_14, [
createVNode(_component_el_select, {
modelValue: parkType.value,
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => parkType.value = $event),
"popper-append-to-body": false,
class: "fpi-select",
onChange: onParkTypeChange
}, {
default: withCtx(() => [
(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.parkOptions, (item) => {
return openBlock(), createBlock(_component_el_option, {
key: item.value,
value: item.value,
label: item.label
}, null, 8, ["value", "label"]);
}), 128))
]),
_: 1
}, 8, ["modelValue"])
])
]),
createElementVNode("div", _hoisted_15, [
createElementVNode("div", _hoisted_16, [
createElementVNode("div", _hoisted_17, toDisplayString(_ctx.hazardousCar.ynCountTitle), 1),
createElementVNode("div", _hoisted_18, [
createElementVNode("span", null, toDisplayString(_ctx.hazardousCar.ynCount), 1)
])
]),
createElementVNode("div", _hoisted_19, [
createElementVNode("div", _hoisted_20, toDisplayString(_ctx.hazardousCar.zxPercentTitle), 1),
createElementVNode("div", _hoisted_21, [
createElementVNode("span", null, toDisplayString(_ctx.hazardousCar.zxPercent.toFixed(1)) + "%", 1)
])
])
])
])
]);
};
}
});
export { _sfc_main as default };