@aplus-frontend/ui
Version:
222 lines (221 loc) • 6.41 kB
JavaScript
import { genSettingTriggerBtnStyle as r } from "../../ap-table/style/index.mjs";
import { multiRows as o, resetScrollbar as d } from "../../style/index.mjs";
import { genComponentStyleHook as p } from "../../utils/cssinjs/index.mjs";
import { aplusApGridIconFont as c } from "./font.mjs";
const g = (e) => {
const { componentCls: i, namespace: t } = e, l = `${i}-vxe-wrapper`, a = `${i}-pagination-wrapper`, n = `.${t}-scroll-bar`;
return [
c,
{
[i]: {
...d(e),
".vxe-table--render-default.size--medium .vxe-body--column.is--padding div.vxe-cell": {
minHeight: "unset !important",
padding: "9px 12px",
fontSize: e.fontSize,
lineHeight: e.lineHeight
},
".vxe-table--render-default.size--mini .vxe-body--column.is--padding div.vxe-cell": {
minHeight: "unset !important",
padding: "6px 9px",
lineHeight: e.lineHeight
},
".vxe-table--render-default.size--medium .vxe-header--column.is--padding div.vxe-cell": {
fontSize: e.fontSize,
lineHeight: "16px",
padding: "0px 12px"
},
".vxe-table--render-default.size--mini .vxe-header--column.is--padding div.vxe-cell": {
lineHeight: "16px",
padding: "0 9px"
},
"&-adaptive": {
height: "100%",
display: "flex",
flexDirection: "column",
[l]: {
minHeight: 0,
flex: 1
}
},
[a]: {
"ul.ant-pagination": {
marginBlock: e.space
}
},
"&-sticky": {
[a]: {
backgroundColor: "#fff",
zIndex: 10,
position: "sticky",
bottom: 0
},
[`&:has(${n})`]: {
[a]: {
"ul.ant-pagination": {
marginBlockStart: 0,
paddingBlockStart: "4px"
}
},
".vxe-table--scroll-x-wrapper": {
opacity: 0
},
".vxe-table .vxe-table--scroll-x-virtual": {
height: "0px !important"
}
},
[`${i}__table-wrapper-card`]: {
paddingBlockEnd: 0
}
},
"&-wrapper": {
padding: e.space,
paddingBlockEnd: e.spaceLG,
backgroundColor: "#fff",
// 如果渲染了分页器，则取消容器的底部边距，防止双重边距
"&:has(ul.ant-pagination)": {
paddingBottom: 0
},
[`&${i}-sticky`]: {
paddingBlockEnd: 0
}
},
[`${i}__search-wrapper`]: {
padding: e.space,
paddingBlockEnd: 0,
backgroundColor: "#fff",
borderRadius: e.borderRadius,
marginBlockEnd: "10px"
},
[`${i}__table-wrapper`]: {
flex: 1,
minHeight: 0,
maxHeight: "100%",
width: "100%",
display: "flex",
flexDirection: "column"
},
[`${i}__table-wrapper-card`]: {
padding: e.space,
paddingBlockEnd: e.spaceLG,
borderRadius: e.borderRadius,
backgroundColor: "#fff",
"&:has(ul.ant-pagination)": {
paddingBottom: 0
}
},
[`${i}-pagination`]: {
marginBlock: e.spaceLG,
display: "flex",
flexWrap: "wrap",
alignItems: "center",
rowGap: "8px",
".ant-pagination-total-text": {
flex: 1,
height: "unset",
lineHeight: e.lineHeight,
display: "flex",
alignItems: "center"
}
},
".vxe-loading.vxe-table--loading": {
position: "absolute",
width: "100%",
height: "100%",
top: 0,
left: 0,
zIndex: 99,
userSelect: "none",
".vxe-loading--wrapper": {
width: "100%",
height: "100%"
}
},
[`${i}__table-loading-wrapper`]: {
height: "100%",
display: "flex",
justifyContent: "center",
alignItems: "center",
backgroundColor: "var(--vxe-ui-loading-background-color)"
},
[`${i}-pagination-count-text`]: {
color: e.textColor1
},
[`${i}-pagination--total-right`]: {
paddingInlineStart: "12px"
},
[`${i}-pagination-total-wrapper`]: {
color: e.textColor2
},
// ApGrid中表格表头的样式
[`${i}-table-header`]: {
"&__title": {
...o(e),
fontWeight: "bold",
"&--single": {
flex: "unset"
}
}
},
...r(e),
// 实现表头不换行排列
"th.vxe-header--column .vxe-cell--wrapper": {
display: "flex",
flexDirection: "row",
flexWrap: "nowrap",
alignItems: "center",
minWidth: "unset",
".vxe-cell--title": {
flexShrink: 1,
flexGrow: 0
}
},
// 浮动表头和浮动页脚为对齐问题
".fixed-left--wrapper, .fixed-right--wrapper": {
".vxe-table--header": {
height: "100%"
},
".vxe-table--footer": {
height: "100%"
}
},
// 树形表格图标
"i.vxe-table-icon-caret-right": {
"&::before": {
content: '"\\f292"'
}
},
"i.vxe-table-icon-caret-right.rotate90": {
transform: "none",
"&::before": {
content: '"\\f293"'
}
},
"i[class*=vxe-table-icon-]": {
fontFamily: "aplusuiiconfont !important;"
},
".vxe-cell--checkbox.is--disabled > .vxe-checkbox--icon": {
backgroundColor: e.tableHeaderBg,
borderRadius: "4px"
},
".vxe-cell--checkbox span.vxe-checkbox--icon": {
verticalAlign: "text-wrap"
},
"div.vxe-cell--tree-btn > i": {
fontSize: e.fontSizeSM,
color: e.textColor1
}
}
}
];
}, m = p(
"ApGrid",
(e) => [g(e)],
{
apGridFixedScrollingBoxShadowColor: "#dae0e7"
}
);
export {
m as default,
g as genApGridStyle
};