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

fix: 处理样式冗余问题

Browse Source
This commit is contained in:
ZhuRui
2026-07-28 16:14:20 +08:00
parent 49dbde11e0
commit 28e339a048
15 changed files with 254 additions and 423 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/styles/pageLayout.module.less
+37
View File
@@ -88,3 +88,40 @@
} }
} }
} }
// ===== 二次确认弹窗 =====
.confirmContent {
padding: 4px 0;
font-size: 14px;
color: rgba(0, 0, 0, 0.85);
strong {
margin: 0 4px;
font-weight: 600;
}
}
.confirmTip {
margin-top: 8px;
font-size: 12px;
color: rgba(0, 0, 0, 0.45);
line-height: 1.5;
}
.tabularLink {
font-variant-numeric: tabular-nums;
cursor: pointer;
}
:global(.toggleConfirmModal) {
.ant-modal-confirm-body {
padding: 24px !important;
}
}
:global(.deleteConfirmModal) {
.ant-modal-confirm-body {
padding: 24px !important;
}
}
src/pages/events/banner/components/BannerFormModal.module.less
+1 -1
View File
@@ -38,7 +38,7 @@
} }
.uploadIcon { .uploadIcon {
font-size: 32px; font-size: 24px;
color: #999; color: #999;
font-weight: 300; font-weight: 300;
line-height: 1; line-height: 1;
src/pages/events/banner/components/BannerFormModal.tsx
+4 -1
View File
@@ -13,6 +13,7 @@ import {
} from 'ant-design-vue'; } from 'ant-design-vue';
import { JUMP_TYPE_OPTIONS, EVENT_OPTIONS, REGION_OPTIONS } from '../model/useBannerModel'; import { JUMP_TYPE_OPTIONS, EVENT_OPTIONS, REGION_OPTIONS } from '../model/useBannerModel';
import { ImageCropper } from '@yp-component/root'; import { ImageCropper } from '@yp-component/root';
import { FileImageOutlined } from '@ant-design/icons-vue';
import { uploadFile, OssUploadType } from '@/utils/oss'; import { uploadFile, OssUploadType } from '@/utils/oss';
import dayjs from 'dayjs'; import dayjs from 'dayjs';
import styles from './BannerFormModal.module.less'; import styles from './BannerFormModal.module.less';
@@ -317,7 +318,9 @@ export default defineComponent({
}`} }`}
onClick={triggerFilePicker} onClick={triggerFilePicker}
> >
<span class={styles.uploadIcon}>+</span> <span class={styles.uploadIcon}>
<FileImageOutlined />
</span>
<span class={styles.uploadHint}>点击上传</span> <span class={styles.uploadHint}>点击上传</span>
<span class={styles.uploadTip}> <span class={styles.uploadTip}>
建议尺寸 1053*351 像素 建议尺寸 1053*351 像素
src/pages/events/banner/index.module.less
-21
View File
@@ -1,21 +0,0 @@
.eventBannerMain {
flex: 1;
min-height: 0;
display: flex;
flex-direction: column;
.tableBody {
flex: 1;
min-height: 0;
overflow: hidden;
:global {
.ant-spin-nested-loading,
.ant-spin-container,
.ant-table,
.ant-table-container {
height: 100%;
}
}
}
}
src/pages/events/banner/index.tsx
+32 -35
View File
@@ -14,7 +14,6 @@ import {
import { useBannerModel, BANNER_STATUS_OPTIONS } from './model/useBannerModel'; import { useBannerModel, BANNER_STATUS_OPTIONS } from './model/useBannerModel';
import { useContainerSize } from '@/hooks'; import { useContainerSize } from '@/hooks';
import BannerFormModal from './components/BannerFormModal'; import BannerFormModal from './components/BannerFormModal';
import styles from './index.module.less';
import pageStyles from '@/assets/styles/pageLayout.module.less'; import pageStyles from '@/assets/styles/pageLayout.module.less';
/** /**
@@ -231,41 +230,39 @@ export default defineComponent({
{/* ===== 表格区 ===== */} {/* ===== 表格区 ===== */}
<div class={pageStyles.table}> <div class={pageStyles.table}>
<div class={styles.eventBannerMain}> <div ref={containerRef} class={pageStyles.tableBody}>
<div ref={containerRef} class={styles.tableBody}> <Table
<Table columns={tableColumns}
columns={tableColumns} dataSource={dataSource.value}
dataSource={dataSource.value} loading={loading.value}
loading={loading.value} scroll={{ x: 'max-content', y: height.value }}
scroll={{ x: 'max-content', y: height.value }} pagination={false}
pagination={false} >
> {{
{{ bodyCell: (args: any) =>
bodyCell: (args: any) => renderBodyCell({
renderBodyCell({ ...args,
...args, renderJumpType,
renderJumpType, renderStatus,
renderStatus, onEdit: handleEdit,
onEdit: handleEdit, onToggleStatus: confirmToggleStatus,
onToggleStatus: confirmToggleStatus, onDelete: confirmDelete,
onDelete: confirmDelete, }),
}), }}
}} </Table>
</Table> </div>
</div>
{/* 独立分页，右下方 */} {/* 独立分页，右下方 */}
<div class={pageStyles.pagination}> <div class={pageStyles.pagination}>
<Pagination <Pagination
current={pagination.value.current} current={pagination.value.current}
pageSize={pagination.value.pageSize} pageSize={pagination.value.pageSize}
total={pagination.value.total} total={pagination.value.total}
showSizeChanger showSizeChanger
showTotal={(total: number) => `共 ${total} 条`} showTotal={(total: number) => `共 ${total} 条`}
onChange={handlePageChange} onChange={handlePageChange}
onShowSizeChange={handlePageChange} onShowSizeChange={handlePageChange}
/> />
</div>
</div> </div>
</div> </div>
src/pages/events/list/index.module.less
-21
View File
@@ -1,21 +0,0 @@
.eventListMain {
flex: 1;
min-height: 0;
display: flex;
flex-direction: column;
.tableBody {
flex: 1;
min-height: 0;
overflow: hidden;
:global {
.ant-spin-nested-loading,
.ant-spin-container,
.ant-table,
.ant-table-container {
height: 100%;
}
}
}
}
src/pages/events/list/index.tsx
+31 -34
View File
@@ -25,7 +25,6 @@ import { useContainerSize, useState } from '@/hooks';
import EventRegulationModal from './components/EventRegulationModal'; import EventRegulationModal from './components/EventRegulationModal';
import EventDetailModal from './components/EventDetailModal'; import EventDetailModal from './components/EventDetailModal';
import EventAuditModal from './components/EventAuditModal'; import EventAuditModal from './components/EventAuditModal';
import styles from './index.module.less';
import pageStyles from '@/assets/styles/pageLayout.module.less'; import pageStyles from '@/assets/styles/pageLayout.module.less';
const { RangePicker } = DatePicker; const { RangePicker } = DatePicker;
@@ -245,7 +244,7 @@ export default defineComponent({
<Select <Select
value={filterForm.status} value={filterForm.status}
options={EVENT_STATUS_OPTIONS as any} options={EVENT_STATUS_OPTIONS as any}
style={{ width: '110px' }} style={{ width: '150px' }}
allowClear allowClear
onUpdate:value={(val: any) => (filterForm.status = val || '')} onUpdate:value={(val: any) => (filterForm.status = val || '')}
/> />
@@ -301,39 +300,37 @@ export default defineComponent({
{/* ===== 表格区 ===== */} {/* ===== 表格区 ===== */}
<div class={pageStyles.table}> <div class={pageStyles.table}>
<div class={styles.eventListMain}> <div ref={containerRef} class={pageStyles.tableBody}>
<div ref={containerRef} class={styles.tableBody}> <Table
<Table columns={tableColumns}
columns={tableColumns} dataSource={dataSource.value}
dataSource={dataSource.value} loading={loading.value}
loading={loading.value} scroll={{ x: 'max-content', y: height.value }}
scroll={{ x: 'max-content', y: height.value }} pagination={false}
pagination={false} >
> {{
{{ bodyCell: (args: any) =>
bodyCell: (args: any) => renderBodyCell({
renderBodyCell({ ...args,
...args, onView: handleView,
onView: handleView, onAudit: handleAudit,
onAudit: handleAudit, onToggleShelf: handleToggleShelf,
onToggleShelf: handleToggleShelf, }),
}), }}
}} </Table>
</Table> </div>
</div>
{/* 独立分页，右下方 */} {/* 独立分页，右下方 */}
<div class={pageStyles.pagination}> <div class={pageStyles.pagination}>
<Pagination <Pagination
current={pagination.value.current} current={pagination.value.current}
pageSize={pagination.value.pageSize} pageSize={pagination.value.pageSize}
total={pagination.value.total} total={pagination.value.total}
showSizeChanger showSizeChanger
showTotal={(total: number) => `共 ${total} 条`} showTotal={(total: number) => `共 ${total} 条`}
onChange={handlePageChange} onChange={handlePageChange}
onShowSizeChange={handlePageChange} onShowSizeChange={handlePageChange}
/> />
</div>
</div> </div>
</div> </div>
src/pages/events/orders/index.module.less
-40
View File
@@ -1,40 +0,0 @@
.eventOrdersMain {
flex: 1;
min-height: 0;
display: flex;
flex-direction: column;
.summaryBar {
flex-shrink: 0;
display: flex;
align-items: center;
gap: 20px;
padding: 12px 16px;
font-size: 14px;
color: #1a1a1a;
.summaryItem {
font-weight: 500;
.summaryLabel {
color: #666;
font-weight: 400;
}
}
}
.tableBody {
flex: 1;
min-height: 0;
overflow: hidden;
:global {
.ant-spin-nested-loading,
.ant-spin-container,
.ant-table,
.ant-table-container {
height: 100%;
}
}
}
}
src/pages/events/orders/index.tsx
+46 -43
View File
@@ -14,7 +14,6 @@ import {
import { useOrderModel, ORDER_STATUS_OPTIONS, REFUND_STATUS_OPTIONS } from './model/useOrderModel'; import { useOrderModel, ORDER_STATUS_OPTIONS, REFUND_STATUS_OPTIONS } from './model/useOrderModel';
import { useContainerSize, useState } from '@/hooks'; import { useContainerSize, useState } from '@/hooks';
import OrderDetailModal from './components/OrderDetailModal'; import OrderDetailModal from './components/OrderDetailModal';
import styles from './index.module.less';
import pageStyles from '@/assets/styles/pageLayout.module.less'; import pageStyles from '@/assets/styles/pageLayout.module.less';
const { RangePicker } = DatePicker; const { RangePicker } = DatePicker;
@@ -176,7 +175,7 @@ export default defineComponent({
<Select <Select
value={filterForm.orderStatus} value={filterForm.orderStatus}
options={ORDER_STATUS_OPTIONS as any} options={ORDER_STATUS_OPTIONS as any}
style={{ width: '120px' }} style={{ width: '140px' }}
allowClear allowClear
onUpdate:value={(val: any) => (filterForm.orderStatus = val || '')} onUpdate:value={(val: any) => (filterForm.orderStatus = val || '')}
/> />
@@ -185,7 +184,7 @@ export default defineComponent({
<Select <Select
value={filterForm.refundStatus} value={filterForm.refundStatus}
options={REFUND_STATUS_OPTIONS as any} options={REFUND_STATUS_OPTIONS as any}
style={{ width: '120px' }} style={{ width: '140px' }}
allowClear allowClear
onUpdate:value={(val: any) => (filterForm.refundStatus = val || '')} onUpdate:value={(val: any) => (filterForm.refundStatus = val || '')}
/> />
@@ -203,54 +202,58 @@ export default defineComponent({
{/* ===== 表格区 ===== */} {/* ===== 表格区 ===== */}
<div class={pageStyles.table}> <div class={pageStyles.table}>
<div class={styles.eventOrdersMain}> {/* 金额汇总 */}
{/* 金额汇总 */} <div class={pageStyles.summary}>
<div class={styles.summaryBar}> <span class={pageStyles.summaryItem}>
<span class={styles.summaryItem}> <span class={pageStyles.summaryLabel}>总订单金额（已支付）：</span>
<span class={styles.summaryLabel}>总订单金额（已支付）：</span> <span class={pageStyles.summaryValue}>
{summary.value.totalOrderAmount.toFixed(2)}元 {summary.value.totalOrderAmount.toFixed(2)}元
</span> </span>
<span class={styles.summaryItem}> </span>
<span class={styles.summaryLabel}>总实付金额：</span> <span class={pageStyles.summaryItem}>
<span class={pageStyles.summaryLabel}>总实付金额：</span>
<span class={pageStyles.summaryValue}>
{summary.value.totalPaidAmount.toFixed(2)}元 {summary.value.totalPaidAmount.toFixed(2)}元
</span> </span>
<span class={styles.summaryItem}> </span>
<span class={styles.summaryLabel}>总退款金额：</span> <span class={pageStyles.summaryItem}>
<span class={pageStyles.summaryLabel}>总退款金额：</span>
<span class={pageStyles.summaryValue}>
{summary.value.totalRefundAmount.toFixed(2)}元 {summary.value.totalRefundAmount.toFixed(2)}元
</span> </span>
</div> </span>
</div>
<div ref={containerRef} class={styles.tableBody}> <div ref={containerRef} class={pageStyles.tableBody}>
<Table <Table
columns={tableColumns} columns={tableColumns}
dataSource={dataSource.value} dataSource={dataSource.value}
loading={loading.value} loading={loading.value}
scroll={{ x: 'max-content', y: height.value }} scroll={{ x: 'max-content', y: height.value }}
pagination={false} pagination={false}
> >
{{ {{
bodyCell: (args: any) => bodyCell: (args: any) =>
renderBodyCell({ renderBodyCell({
...args, ...args,
onView: handleView, onView: handleView,
onReRefund: handleReRefund, onReRefund: handleReRefund,
}), }),
}} }}
</Table> </Table>
</div> </div>
{/* 独立分页，右下方 */} {/* 独立分页，右下方 */}
<div class={pageStyles.pagination}> <div class={pageStyles.pagination}>
<Pagination <Pagination
current={pagination.value.current} current={pagination.value.current}
pageSize={pagination.value.pageSize} pageSize={pagination.value.pageSize}
total={pagination.value.total} total={pagination.value.total}
showSizeChanger showSizeChanger
showTotal={(total: number) => `共 ${total} 条`} showTotal={(total: number) => `共 ${total} 条`}
onChange={handlePageChange} onChange={handlePageChange}
onShowSizeChange={handlePageChange} onShowSizeChange={handlePageChange}
/> />
</div>
</div> </div>
</div> </div>
src/pages/events/users/index.module.less
-21
View File
@@ -1,21 +0,0 @@
.eventUsersMain {
flex: 1;
min-height: 0;
display: flex;
flex-direction: column;
.tableBody {
flex: 1;
min-height: 0;
overflow: hidden;
:global {
.ant-spin-nested-loading,
.ant-spin-container,
.ant-table,
.ant-table-container {
height: 100%;
}
}
}
}
src/pages/events/users/index.tsx
+28 -31
View File
@@ -12,7 +12,6 @@ import {
} from 'ant-design-vue'; } from 'ant-design-vue';
import { useUserModel, USER_STATUS_OPTIONS } from './model/useUserModel'; import { useUserModel, USER_STATUS_OPTIONS } from './model/useUserModel';
import { useContainerSize } from '@/hooks'; import { useContainerSize } from '@/hooks';
import styles from './index.module.less';
import pageStyles from '@/assets/styles/pageLayout.module.less'; import pageStyles from '@/assets/styles/pageLayout.module.less';
/** /**
@@ -145,37 +144,35 @@ export default defineComponent({
{/* ===== 表格区 ===== */} {/* ===== 表格区 ===== */}
<div class={pageStyles.table}> <div class={pageStyles.table}>
<div class={styles.eventUsersMain}> <div ref={containerRef} class={pageStyles.tableBody}>
<div ref={containerRef} class={styles.tableBody}> <Table
<Table columns={tableColumns}
columns={tableColumns} dataSource={dataSource.value}
dataSource={dataSource.value} loading={loading.value}
loading={loading.value} scroll={{ x: 'max-content', y: height.value }}
scroll={{ x: 'max-content', y: height.value }} pagination={false}
pagination={false} >
> {{
{{ bodyCell: (args: any) =>
bodyCell: (args: any) => renderBodyCell({
renderBodyCell({ ...args,
...args, onToggleStatus: handleToggleStatus,
onToggleStatus: handleToggleStatus, }),
}), }}
}} </Table>
</Table> </div>
</div>
{/* 独立分页，右下方 */} {/* 独立分页，右下方 */}
<div class={pageStyles.pagination}> <div class={pageStyles.pagination}>
<Pagination <Pagination
current={pagination.value.current} current={pagination.value.current}
pageSize={pagination.value.pageSize} pageSize={pagination.value.pageSize}
total={pagination.value.total} total={pagination.value.total}
showSizeChanger showSizeChanger
showTotal={(total: number) => `共 ${total} 条`} showTotal={(total: number) => `共 ${total} 条`}
onChange={handlePageChange} onChange={handlePageChange}
onShowSizeChange={handlePageChange} onShowSizeChange={handlePageChange}
/> />
</div>
</div> </div>
</div> </div>
</div> </div>
src/pages/system/roles/index.module.less
-49
View File
@@ -1,49 +0,0 @@
.systemRolesMain {
flex: 1;
min-height: 0;
display: flex;
flex-direction: column;
.tableBody {
flex: 1;
min-height: 0;
overflow: hidden;
:global {
.ant-spin-nested-loading,
.ant-spin-container,
.ant-table,
.ant-table-container {
height: 100%;
}
}
}
.userCountLink {
font-variant-numeric: tabular-nums;
}
.confirmContent {
padding: 4px 24px;
font-size: 14px;
color: rgba(0, 0, 0, 0.85);
strong {
margin: 0 4px;
font-weight: 600;
}
}
.confirmTip {
margin-top: 8px;
font-size: 12px;
color: rgba(0, 0, 0, 0.45);
line-height: 1.5;
}
}
:global(.deleteConfirmModal) {
.ant-modal-confirm-body {
padding: 24px !important;
}
}
src/pages/system/roles/index.tsx
+39 -44
View File
@@ -5,7 +5,6 @@ import { useRoleModel } from './model/useRoleModel';
import { useContainerSize } from '@/hooks'; import { useContainerSize } from '@/hooks';
import RoleFormModal from './components/RoleFormModal'; import RoleFormModal from './components/RoleFormModal';
import UserListModal from './components/UserListModal'; import UserListModal from './components/UserListModal';
import styles from './index.module.less';
import pageStyles from '@/assets/styles/pageLayout.module.less'; import pageStyles from '@/assets/styles/pageLayout.module.less';
/** /**
@@ -27,7 +26,7 @@ function renderBodyCell({
}) { }) {
if (column.dataIndex === 'userCount') { if (column.dataIndex === 'userCount') {
return ( return (
<a class={styles.userCountLink} onClick={() => onViewUsers(record)}> <a class={pageStyles.tabularLink} onClick={() => onViewUsers(record)}>
{record.userCount}人 {record.userCount}人
</a> </a>
); );
@@ -55,18 +54,16 @@ function confirmDelete({ record, onOk }: { record: any; onOk: (record: any) => v
Modal.confirm({ Modal.confirm({
title: '确认删除', title: '确认删除',
icon: null, icon: null,
class: styles.deleteConfirmModal, class: 'deleteConfirmModal',
content: ( content: (
<div class={styles.systemRolesMain}> <>
<div class={styles.confirmContent}> <div class={pageStyles.confirmContent}>
<div> <span>确定要删除角色</span>
<span>确定要删除角色</span> <strong>{record.roleName}</strong>
<strong>{record.roleName}</strong> <span>吗？</span>
<span>吗？</span>
</div>
<div class={styles.confirmTip}>删除后该角色下的用户将失去对应的权限，请谨慎操作。</div>
</div> </div>
</div> <div class={pageStyles.confirmTip}>删除后该角色下的用户将失去对应的权限，请谨慎操作。</div>
</>
), ),
okText: '确认', okText: '确认',
cancelText: '取消', cancelText: '取消',
@@ -150,39 +147,37 @@ export default defineComponent({
{/* ===== 表格区 ===== */} {/* ===== 表格区 ===== */}
<div class={pageStyles.table}> <div class={pageStyles.table}>
<div class={styles.systemRolesMain}> <div ref={containerRef} class={pageStyles.tableBody}>
<div ref={containerRef} class={styles.tableBody}> <Table
<Table columns={tableColumns}
columns={tableColumns} dataSource={dataSource.value}
dataSource={dataSource.value} loading={loading.value}
loading={loading.value} scroll={{ x: 'max-content', y: height.value }}
scroll={{ x: 'max-content', y: height.value }} pagination={false}
pagination={false} >
> {{
{{ bodyCell: (args: any) =>
bodyCell: (args: any) => renderBodyCell({
renderBodyCell({ ...args,
...args, onViewUsers: handleViewUsers,
onViewUsers: handleViewUsers, onEdit: handleEdit,
onEdit: handleEdit, onDelete: triggerDelete,
onDelete: triggerDelete, }),
}), }}
}} </Table>
</Table> </div>
</div>
{/* 分页 */} {/* 分页 */}
<div class={pageStyles.pagination}> <div class={pageStyles.pagination}>
<Pagination <Pagination
current={pagination.value.current} current={pagination.value.current}
pageSize={pagination.value.pageSize} pageSize={pagination.value.pageSize}
total={pagination.value.total} total={pagination.value.total}
showSizeChanger showSizeChanger
showTotal={(total: number) => `共 ${total} 条`} showTotal={(total: number) => `共 ${total} 条`}
onChange={handlePageChange} onChange={handlePageChange}
onShowSizeChange={handlePageChange} onShowSizeChange={handlePageChange}
/> />
</div>
</div> </div>
</div> </div>
src/pages/system/users/index.module.less
-41
View File
@@ -1,41 +0,0 @@
.systemUsersMain {
flex: 1;
min-height: 0;
display: flex;
flex-direction: column;
.tableBody {
flex: 1;
min-height: 0;
overflow: hidden;
:global {
.ant-spin-nested-loading,
.ant-spin-container,
.ant-table,
.ant-table-container {
height: 100%;
}
}
}
.confirmContent {
display: flex;
align-items: center;
flex-wrap: wrap;
padding: 4px 0;
font-size: 14px;
color: rgba(0, 0, 0, 0.85);
strong {
margin: 0 4px;
font-weight: 600;
}
}
}
:global(.toggleConfirmModal) {
.ant-modal-confirm-body {
padding: 24px !important;
}
}
src/pages/system/users/index.tsx
+36 -41
View File
@@ -3,7 +3,6 @@ import { Button, Input, Table, Form, Space, Select, Modal, Pagination } from 'an
import { useUserModel, USER_ROLE_OPTIONS, USER_STATUS_OPTIONS } from './model/useUserModel'; import { useUserModel, USER_ROLE_OPTIONS, USER_STATUS_OPTIONS } from './model/useUserModel';
import { useContainerSize } from '@/hooks'; import { useContainerSize } from '@/hooks';
import UserFormModal from './components/UserFormModal'; import UserFormModal from './components/UserFormModal';
import styles from './index.module.less';
import pageStyles from '@/assets/styles/pageLayout.module.less'; import pageStyles from '@/assets/styles/pageLayout.module.less';
/** /**
@@ -52,14 +51,12 @@ function confirmToggleStatus({ record, onOk }: { record: any; onOk: (record: any
const actionText = isActive ? '禁用' : '启用'; const actionText = isActive ? '禁用' : '启用';
Modal.confirm({ Modal.confirm({
title: `确认${actionText}`, title: `确认${actionText}`,
class: styles.toggleConfirmModal, class: 'toggleConfirmModal',
content: ( content: (
<div class={styles.systemUsersMain}> <div class={pageStyles.confirmContent}>
<div class={styles.confirmContent}> <span>确定要{actionText}用户</span>
<span>确定要{actionText}用户</span> <strong>{record.realName}</strong>
<strong>{record.realName}</strong> <span>吗？</span>
<span>吗？</span>
</div>
</div> </div>
), ),
okText: '确认', okText: '确认',
@@ -136,7 +133,7 @@ export default defineComponent({
<Select <Select
value={filterForm.role} value={filterForm.role}
options={USER_ROLE_OPTIONS as any} options={USER_ROLE_OPTIONS as any}
style={{ width: '120px' }} style={{ width: '140px' }}
allowClear allowClear
onUpdate:value={(val: any) => (filterForm.role = val || '')} onUpdate:value={(val: any) => (filterForm.role = val || '')}
/> />
@@ -145,7 +142,7 @@ export default defineComponent({
<Select <Select
value={filterForm.status} value={filterForm.status}
options={USER_STATUS_OPTIONS as any} options={USER_STATUS_OPTIONS as any}
style={{ width: '120px' }} style={{ width: '140px' }}
allowClear allowClear
onUpdate:value={(val: any) => (filterForm.status = val || '')} onUpdate:value={(val: any) => (filterForm.status = val || '')}
/> />
@@ -166,38 +163,36 @@ export default defineComponent({
{/* ===== 表格区 ===== */} {/* ===== 表格区 ===== */}
<div class={pageStyles.table}> <div class={pageStyles.table}>
<div class={styles.systemUsersMain}> <div ref={containerRef} class={pageStyles.tableBody}>
<div ref={containerRef} class={styles.tableBody}> <Table
<Table columns={tableColumns}
columns={tableColumns} dataSource={dataSource.value}
dataSource={dataSource.value} loading={loading.value}
loading={loading.value} scroll={{ x: 'max-content', y: height.value }}
scroll={{ x: 'max-content', y: height.value }} pagination={false}
pagination={false} >
> {{
{{ bodyCell: (args: any) =>
bodyCell: (args: any) => renderBodyCell({
renderBodyCell({ ...args,
...args, onEdit: triggerEdit,
onEdit: triggerEdit, onToggleStatus: triggerToggle,
onToggleStatus: triggerToggle, }),
}), }}
}} </Table>
</Table> </div>
</div>
{/* 独立分页 */} {/* 独立分页 */}
<div class={pageStyles.pagination}> <div class={pageStyles.pagination}>
<Pagination <Pagination
current={pagination.value.current} current={pagination.value.current}
pageSize={pagination.value.pageSize} pageSize={pagination.value.pageSize}
total={pagination.value.total} total={pagination.value.total}
showSizeChanger showSizeChanger
showTotal={(total: number) => `共 ${total} 条`} showTotal={(total: number) => `共 ${total} 条`}
onChange={handlePageChange} onChange={handlePageChange}
onShowSizeChange={handlePageChange} onShowSizeChange={handlePageChange}
/> />
</div>
</div> </div>
</div> </div>