@arco-vue-pro-components/pro-components
Version:
基于@arco-design/web-vue组件的高级组件,包括pro-table
55 lines (54 loc) • 1.71 kB
JavaScript
import { inject, createVNode, isVNode } from "vue";
import { Dropdown } from "@arco-design/web-vue";
import { useI18n } from "../../locale/index.js";
import { proTableInjectionKey } from "../form/context.js";
import MyToolTip from "../my-tool-tip/index.js";
import MyIcon from "../my-icon/index.js";
function _isSlot(s) {
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
}
const DensityIcon = (props) => {
const tableCtx = inject(proTableInjectionKey, {});
const {
icon = createVNode(MyIcon, {
"type": "icon-colum-height"
}, null)
} = props;
const {
getMessage
} = useI18n();
const items = [{
key: "large",
label: getMessage("tableToolBar.densityLarger", "\u9ED8\u8BA4")
}, {
key: "medium",
label: getMessage("tableToolBar.densityMiddle", "\u4E2D\u7B49")
}, {
key: "small",
label: getMessage("tableToolBar.densitySmall", "\u7D27\u51D1")
}];
return createVNode(Dropdown, {
"onSelect": (key) => {
var _a;
(_a = tableCtx == null ? void 0 : tableCtx.setTableSize) == null ? void 0 : _a.call(tableCtx, key);
},
"popupContainer": tableCtx == null ? void 0 : tableCtx.popupContainer,
"trigger": "click"
}, {
default: () => [createVNode(MyToolTip, {
"content": getMessage("tableToolBar.density")
}, _isSlot(icon) ? icon : {
default: () => [icon]
})],
content: () => {
return items.map((item) => createVNode(Dropdown.Option, {
"active": tableCtx.tableSize === item.key,
"value": item.key,
"key": item.key
}, {
default: () => [item.label]
}));
}
});
};
export { DensityIcon as default };