fix: 类名优化
This commit is contained in:
@@ -1,47 +1,47 @@
|
||||
// 页面容器:纵向 flex,占满高度
|
||||
.container {
|
||||
// 页面布局根容器:筛选区 + 表格区作为直接子元素
|
||||
.containerMain {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
// 页面筛选区域:横向 flex,可换行
|
||||
.filter {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
column-gap: 16px;
|
||||
row-gap: 12px;
|
||||
flex-shrink: 0;
|
||||
padding: 16px;
|
||||
background-color: #fff;
|
||||
border-radius: 10px;
|
||||
}
|
||||
// 页面筛选区域:横向 flex,可换行
|
||||
.filter {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
column-gap: 16px;
|
||||
row-gap: 12px;
|
||||
flex-shrink: 0;
|
||||
padding: 16px;
|
||||
background-color: #fff;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
// 筛选区域操作按钮组
|
||||
.filterActions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
margin-left: 0;
|
||||
}
|
||||
// 筛选区域操作按钮组
|
||||
.filterActions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
// 表格显示区域:纵向 flex,占据剩余高度
|
||||
.table {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
background-color: #fff;
|
||||
min-height: 0;
|
||||
min-width: 0;
|
||||
margin-top: 16px;
|
||||
overflow: hidden;
|
||||
border-radius: 10px;
|
||||
}
|
||||
// 表格显示区域:纵向 flex,占据剩余高度
|
||||
.table {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
background-color: #fff;
|
||||
min-height: 0;
|
||||
min-width: 0;
|
||||
margin-top: 16px;
|
||||
overflow: hidden;
|
||||
border-radius: 10px;
|
||||
|
||||
.pagination {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 14px;
|
||||
.pagination {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -194,7 +194,7 @@ export default defineComponent({
|
||||
];
|
||||
|
||||
return () => (
|
||||
<div class={pageStyles.container}>
|
||||
<div class={pageStyles.containerMain}>
|
||||
{/* ===== 筛选区 ===== */}
|
||||
<div class={pageStyles.filter}>
|
||||
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
|
||||
|
||||
@@ -213,7 +213,7 @@ export default defineComponent({
|
||||
];
|
||||
|
||||
return () => (
|
||||
<div class={pageStyles.container}>
|
||||
<div class={pageStyles.containerMain}>
|
||||
{/* ===== 筛选区 ===== */}
|
||||
<div class={pageStyles.filter}>
|
||||
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
|
||||
|
||||
@@ -136,7 +136,7 @@ export default defineComponent({
|
||||
];
|
||||
|
||||
return () => (
|
||||
<div class={pageStyles.container}>
|
||||
<div class={pageStyles.containerMain}>
|
||||
{/* ===== 筛选区 ===== */}
|
||||
<div class={pageStyles.filter}>
|
||||
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
|
||||
|
||||
@@ -103,7 +103,7 @@ export default defineComponent({
|
||||
];
|
||||
|
||||
return () => (
|
||||
<div class={pageStyles.container}>
|
||||
<div class={pageStyles.containerMain}>
|
||||
{/* ===== 筛选区 ===== */}
|
||||
<div class={pageStyles.filter}>
|
||||
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
|
||||
|
||||
@@ -120,7 +120,7 @@ export default defineComponent({
|
||||
];
|
||||
|
||||
return () => (
|
||||
<div class={pageStyles.container}>
|
||||
<div class={pageStyles.containerMain}>
|
||||
{/* ===== 筛选区 ===== */}
|
||||
<div class={pageStyles.filter}>
|
||||
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
|
||||
|
||||
@@ -118,7 +118,7 @@ export default defineComponent({
|
||||
];
|
||||
|
||||
return () => (
|
||||
<div class={pageStyles.container}>
|
||||
<div class={pageStyles.containerMain}>
|
||||
{/* ===== 筛选区 ===== */}
|
||||
<div class={pageStyles.filter}>
|
||||
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
|
||||
|
||||
Reference in New Issue
Block a user