UNPKG

@arco-vue-pro-components/pro-components

Version:
55 lines (54 loc) 1.71 kB
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 };