@zhsz/cool-design-dv
Version:
119 lines (118 loc) • 3.74 kB
JavaScript
import { defineComponent, inject, getCurrentInstance, computed, onMounted, onBeforeUnmount, openBlock, createBlock, unref, mergeProps, withCtx } from "vue";
import Loading from "../dv-loading/index.mjs";
import { merge } from "lodash-es";
import { dvPageSymbols } from "../../symbols/index.mjs";
import { useChart } from "../../hooks/useChart.mjs";
import { addResizeListener, removeResizeListener } from "../../utils/resize-event.mjs";
import Box from "../dv-box/index.mjs";
import "../chart/chart-my/index.mjs";
import "../chart/chart-bar/index.mjs";
import MyChartLine from "../chart/chart-line/index.mjs";
const __default__ = defineComponent({
name: "DvBar",
inheritAttrs: false
});
const _sfc_main = /* @__PURE__ */ defineComponent({
...__default__,
props: {
columns: Array,
rows: Array,
loader: Function,
settings: Object,
extend: {
type: [Object, Function]
},
debug: Boolean,
area: Boolean,
rotate: Boolean,
cross: Boolean,
gradient: Boolean,
legend: Boolean
},
emits: ["resize"],
setup(__props, { emit: __emit }) {
var _a;
const props = __props;
const page = inject(dvPageSymbols, null);
const instance = (_a = getCurrentInstance()) == null ? void 0 : _a.proxy;
const mergeExtend = computed(() => {
const extend = typeof props.extend === "function" ? props.extend() : props.extend;
return Object.freeze(
merge(
{
legend: props.legend ? {
top: 20,
right: 20,
itemWidth: 10,
itemHeight: 10,
icon: "rect"
} : {
show: false
},
grid: {
top: props.legend ? 50 : 30,
right: 30,
bottom: 50,
left: 60
},
series: {
barCategoryGap: "40%",
areaStyle: props.area ? { opacity: 0.2 } : void 0
},
xAxis: {
axisLabel: {
interval: 0,
rotate: props.rotate ? 45 : 0
}
},
tooltip: {
axisPointer: {
type: props.cross ? "cross" : "item"
}
}
},
extend
)
);
});
const emits = __emit;
const { resize, width, height, loading, theme, chartData } = useChart(
emits,
props,
page
);
onMounted(() => {
resize(instance == null ? void 0 : instance.$el);
addResizeListener(instance == null ? void 0 : instance.$el, () => resize(instance == null ? void 0 : instance.$el));
});
onBeforeUnmount(() => {
removeResizeListener(instance == null ? void 0 : instance.$el, () => resize(instance == null ? void 0 : instance.$el));
});
return (_ctx, _cache) => {
return openBlock(), createBlock(unref(Box), mergeProps({
class: "my-dv-chart my-dv-line",
"default-width": "600px",
"default-height": "400px"
}, _ctx.$attrs), {
default: withCtx(() => [
unref(loading) ? (openBlock(), createBlock(unref(Loading), {
key: 0,
zoom: 0.6
})) : (openBlock(), createBlock(unref(MyChartLine), mergeProps({ key: 1 }, _ctx.$attrs, {
debug: __props.debug,
theme: unref(theme),
settings: __props.settings,
extend: mergeExtend.value,
width: `${unref(width)}px`,
height: `${unref(height)}px`,
data: unref(chartData)
}), null, 16, ["debug", "theme", "settings", "extend", "width", "height", "data"]))
]),
_: 1
}, 16);
};
}
});
export {
_sfc_main as default
};