cpms_org/cpms_operation_platform
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feature/0723/ZR #3

Merged
chenzhen merged 12 commits from feature/0723/ZR into release/0.01 2026-07-28 11:20:08 +08:00
Conversation 0 Commits 12 Files Changed 68
+94 -107
13 changed files with 94 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit da1c365957 - Show all commits
src/assets/styles/index.less
-51
View File
@@ -56,57 +56,6 @@ a {
background: transparent;
}
// ===== 页面布局公共类 =====
// 页面容器:纵向 flex,占满高度;筛选区与表格区作为直接子元素
.page-container {
display: flex;
flex-direction: column;
height: 100%;
}
// 页面筛选区域:横向 flex,可换行
.page-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
.page-filter-actions {
display: flex;
align-items: center;
gap: 10px;
margin-left: 0;
}
// 表格显示区域:纵向 flex,占据剩余高度。
// overflow: hidden 防止子元素撑开容器，滚动由 Table 的 scroll.x/y 接管。
// 分页组件作为独立子元素置于 Table 下方，不占用 Table 的 scroll 空间。
.page-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;
}
.page-pagination {
flex-shrink: 0;
display: flex;
justify-content: flex-end;
padding: 14px;
}
// ===== antd 组件覆盖 =====
// Tag 默认 margin-right: 8px，会挤开表格列或卡片内间距，统一去掉
src/components/page/pageLayout.module.less
+47
View File
@@ -0,0 +1,47 @@
// 页面容器：纵向 flex，占满高度
.container {
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;
}
// 筛选区域操作按钮组
.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;
}
.pagination {
flex-shrink: 0;
display: flex;
justify-content: flex-end;
padding: 14px;
}
src/pages/events/banner/index.tsx
+5 -4
View File
@@ -15,6 +15,7 @@ import { useBannerModel, BANNER_STATUS_OPTIONS } from './model/useBannerModel';
import { useContainerSize } from '@/hooks';
import BannerFormModal from './components/BannerFormModal';
import styles from './index.module.less';
import pageStyles from '@/components/page/pageLayout.module.less';
/**
* bodyCell 渲染函数
@@ -193,9 +194,9 @@ export default defineComponent({
];
return () => (
<div class="page-container">
<div class={pageStyles.container}>
{/* ===== 筛选区 ===== */}
<div class="page-filter">
<div class={pageStyles.filter}>
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
<Form.Item label="标题" name="searchTitle">
<Input
@@ -229,7 +230,7 @@ export default defineComponent({
</div>
{/* ===== 表格区 ===== */}
<div class="page-table">
<div class={pageStyles.table}>
<div ref={containerRef} class={styles.tableBody}>
<Table
columns={tableColumns}
@@ -253,7 +254,7 @@ export default defineComponent({
</div>
{/* 独立分页，右下方 */}
<div class="page-pagination">
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
src/pages/events/list/index.tsx
+5 -4
View File
@@ -24,6 +24,7 @@ import { useContainerSize, useState } from '@/hooks';
import EventRegulationModal from './components/EventRegulationModal';
import EventDetailModal from './components/EventDetailModal';
import styles from './index.module.less';
import pageStyles from '@/components/page/pageLayout.module.less';
const { RangePicker } = DatePicker;
@@ -154,9 +155,9 @@ export default defineComponent({
];
return () => (
<div class="page-container">
<div class={pageStyles.container}>
{/* ===== 筛选区 ===== */}
<div class="page-filter">
<div class={pageStyles.filter}>
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
<Form.Item label="创建时间" name="createTimeRange">
<RangePicker
@@ -249,7 +250,7 @@ export default defineComponent({
</div>
{/* ===== 表格区 ===== */}
<div class="page-table">
<div class={pageStyles.table}>
<div ref={containerRef} class={styles.tableBody}>
<Table
columns={tableColumns}
@@ -271,7 +272,7 @@ export default defineComponent({
</div>
{/* 独立分页，右下方 */}
<div class="page-pagination">
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
src/pages/events/orders/index.tsx
+5 -4
View File
@@ -15,6 +15,7 @@ import { useOrderModel, ORDER_STATUS_OPTIONS, REFUND_STATUS_OPTIONS } from './mo
import { useContainerSize, useState } from '@/hooks';
import OrderDetailModal from './components/OrderDetailModal';
import styles from './index.module.less';
import pageStyles from '@/components/page/pageLayout.module.less';
const { RangePicker } = DatePicker;
@@ -135,9 +136,9 @@ export default defineComponent({
];
return () => (
<div class="page-container">
<div class={pageStyles.container}>
{/* ===== 筛选区 ===== */}
<div class="page-filter">
<div class={pageStyles.filter}>
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
<Form.Item label="订单时间" name="orderTimeRange">
<RangePicker
@@ -201,7 +202,7 @@ export default defineComponent({
</div>
{/* ===== 表格区 ===== */}
<div class="page-table">
<div class={pageStyles.table}>
{/* 金额汇总 */}
<div class={styles.summaryBar}>
<span class={styles.summaryItem}>
@@ -238,7 +239,7 @@ export default defineComponent({
</div>
{/* 独立分页，右下方 */}
<div class="page-pagination">
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
src/pages/events/users/index.tsx
+5 -4
View File
@@ -13,6 +13,7 @@ import {
import { useUserModel, USER_STATUS_OPTIONS } from './model/useUserModel';
import { useContainerSize } from '@/hooks';
import styles from './index.module.less';
import pageStyles from '@/components/page/pageLayout.module.less';
/**
* bodyCell 渲染函数
@@ -102,9 +103,9 @@ export default defineComponent({
];
return () => (
<div class="page-container">
<div class={pageStyles.container}>
{/* ===== 筛选区 ===== */}
<div class="page-filter">
<div class={pageStyles.filter}>
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
<Form.Item label="用户昵称" name="searchUserName">
<Input
@@ -143,7 +144,7 @@ export default defineComponent({
</div>
{/* ===== 表格区 ===== */}
<div class="page-table">
<div class={pageStyles.table}>
<div ref={containerRef} class={styles.tableBody}>
<Table
columns={tableColumns}
@@ -163,7 +164,7 @@ export default defineComponent({
</div>
{/* 独立分页，右下方 */}
<div class="page-pagination">
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
src/pages/finance/payments/index.tsx
+5 -4
View File
@@ -3,6 +3,7 @@ import { Button, Input, Table, Form, Space, Pagination, Select, DatePicker } fro
import { usePaymentsModel } from './model/usePaymentsModel';
import { useContainerSize } from '@/hooks';
import styles from './index.module.less';
import pageStyles from '@/components/page/pageLayout.module.less';
const { RangePicker } = DatePicker;
@@ -28,9 +29,9 @@ export default defineComponent({
const { containerRef, height } = useContainerSize({ headerOffset: 55 });
return () => (
<div class="page-container">
<div class={pageStyles.container}>
{/* ===== 筛选区 ===== */}
<div class="page-filter">
<div class={pageStyles.filter}>
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
<Form.Item label="时间" name="timeRange">
<RangePicker
@@ -77,7 +78,7 @@ export default defineComponent({
</div>
{/* ===== 表格区 ===== */}
<div class="page-table">
<div class={pageStyles.table}>
{/* ===== 汇总区（按图片样式：左对齐的两段加粗数字） ===== */}
<div class={styles.summary}>
<span class={styles.summaryItem}>
@@ -101,7 +102,7 @@ export default defineComponent({
</div>
{/* 独立分页，右下方 */}
<div class="page-pagination">
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
src/pages/finance/reports/index.tsx
+2 -1
View File
@@ -3,6 +3,7 @@ import { Select, Table } from 'ant-design-vue';
import * as echarts from 'echarts';
import { useReportsModel } from './model/useReportsModel';
import styles from './index.module.less';
import pageStyles from '@/components/page/pageLayout.module.less';
/**
* 账务报表
@@ -157,7 +158,7 @@ export default defineComponent({
];
return (
<div class={['page-container', styles.pageWrap]}>
<div class={[pageStyles.container, styles.pageWrap]}>
{/* ===== 顶部标题 + 时间范围 ===== */}
<div class={styles.reportHeader}>
<div class={styles.headerLeft}>
src/pages/finance/wallet/index.module.less
-19
View File
@@ -86,22 +86,3 @@
overflow: hidden;
text-overflow: ellipsis;
}
// ===== 下方白卡片：包裹筛选区 + 表格区 =====
.tableSection {
flex: 1;
min-height: 0;
display: flex;
flex-direction: column;
padding: 16px 20px;
background: #fff;
border: 1px solid #f0f0f0;
border-radius: 10px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
overflow: hidden;
// 表格区紧贴筛选区下方，控制间距
:global(.page-table) {
margin-top: 16px;
}
}
src/pages/finance/wallet/index.tsx
+5 -4
View File
@@ -5,6 +5,7 @@ import { useWalletModel } from './model/useWalletModel';
import { useContainerSize } from '@/hooks';
import WalletDetailModal from './components/WalletDetailModal';
import styles from './index.module.less';
import pageStyles from '@/components/page/pageLayout.module.less';
interface StatCardItem {
key: string;
@@ -105,7 +106,7 @@ export default defineComponent({
];
return (
<div class="page-container">
<div class={pageStyles.container}>
{/* ===== 顶部统计卡 ===== */}
<div class={styles.statCards}>
{statCards.map((item) => (
@@ -133,7 +134,7 @@ export default defineComponent({
</div>
{/* ===== 筛选区 ===== */}
<div class="page-filter">
<div class={pageStyles.filter}>
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
<Form.Item label="用户昵称" name="searchUserName">
<Input
@@ -196,7 +197,7 @@ export default defineComponent({
{/* ===== 下方区域：筛选 + 表格（独立白卡片） ===== */}
{/* ===== 表格区 ===== */}
<div class="page-table">
<div class={pageStyles.table}>
<div ref={containerRef} class={styles.tableBody}>
<Table
columns={tableColumns}
@@ -216,7 +217,7 @@ export default defineComponent({
</div>
{/* 独立分页，右下方 */}
<div class="page-pagination">
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
src/pages/finance/withdraw/index.tsx
+5 -4
View File
@@ -4,6 +4,7 @@ import { useWithdrawModel } from './model/useWithdrawModel';
import { useContainerSize } from '@/hooks';
import WithdrawAuditModal from './components/WithdrawAuditModal';
import styles from './index.module.less';
import pageStyles from '@/components/page/pageLayout.module.less';
/**
* bodyCell 渲染函数（操作列：根据审核状态切换"审核 / 查看"按钮）
@@ -78,9 +79,9 @@ export default defineComponent({
];
return () => (
<div class="page-container">
<div class={pageStyles.container}>
{/* ===== 筛选区 ===== */}
<div class="page-filter">
<div class={pageStyles.filter}>
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
<Form.Item label="申请人昵称" name="searchUserName">
<Input
@@ -136,7 +137,7 @@ export default defineComponent({
</div>
{/* ===== 表格区 ===== */}
<div class="page-table">
<div class={pageStyles.table}>
<div ref={containerRef} class={styles.tableBody}>
<Table
columns={tableColumns}
@@ -157,7 +158,7 @@ export default defineComponent({
</div>
{/* 独立分页，右下方 */}
<div class="page-pagination">
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
src/pages/system/roles/index.tsx
+5 -4
View File
@@ -6,6 +6,7 @@ import { useContainerSize } from '@/hooks';
import RoleFormModal from './components/RoleFormModal';
import UserListModal from './components/UserListModal';
import styles from './index.module.less';
import pageStyles from '@/components/page/pageLayout.module.less';
/**
* bodyCell 渲染
@@ -119,9 +120,9 @@ export default defineComponent({
];
return () => (
<div class="page-container">
<div class={pageStyles.container}>
{/* ===== 筛选区 ===== */}
<div class="page-filter">
<div class={pageStyles.filter}>
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
<Form.Item label="角色" name="searchKeyword">
<Input
@@ -146,7 +147,7 @@ export default defineComponent({
</div>
{/* ===== 表格区 ===== */}
<div class="page-table">
<div class={pageStyles.table}>
<div ref={containerRef} class={styles.tableBody}>
<Table
columns={tableColumns}
@@ -168,7 +169,7 @@ export default defineComponent({
</div>
{/* 分页 */}
<div class="page-pagination">
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
src/pages/system/users/index.tsx
+5 -4
View File
@@ -4,6 +4,7 @@ import { useUserModel, USER_ROLE_OPTIONS, USER_STATUS_OPTIONS } from './model/us
import { useContainerSize } from '@/hooks';
import UserFormModal from './components/UserFormModal';
import styles from './index.module.less';
import pageStyles from '@/components/page/pageLayout.module.less';
/**
* bodyCell 渲染函数
@@ -117,9 +118,9 @@ export default defineComponent({
];
return () => (
<div class="page-container">
<div class={pageStyles.container}>
{/* ===== 筛选区 ===== */}
<div class="page-filter">
<div class={pageStyles.filter}>
<Form style={{ rowGap: '10px' }} layout="inline" model={filterForm}>
<Form.Item label="用户" name="searchKeyword">
<Input
@@ -162,7 +163,7 @@ export default defineComponent({
</div>
{/* ===== 表格区 ===== */}
<div class="page-table">
<div class={pageStyles.table}>
<div ref={containerRef} class={styles.tableBody}>
<Table
columns={tableColumns}
@@ -183,7 +184,7 @@ export default defineComponent({
</div>
{/* 独立分页 */}
<div class="page-pagination">
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}