fix: 处理样式冗余问题

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
@@ -38,7 +38,7 @@
}
.uploadIcon {
font-size: 32px;
font-size: 24px;
color: #999;
font-weight: 300;
line-height: 1;
@@ -13,6 +13,7 @@ import {
} from 'ant-design-vue';
import { JUMP_TYPE_OPTIONS, EVENT_OPTIONS, REGION_OPTIONS } from '../model/useBannerModel';
import { ImageCropper } from '@yp-component/root';
import { FileImageOutlined } from '@ant-design/icons-vue';
import { uploadFile, OssUploadType } from '@/utils/oss';
import dayjs from 'dayjs';
import styles from './BannerFormModal.module.less';
@@ -317,7 +318,9 @@ export default defineComponent({
}`}
onClick={triggerFilePicker}
>
<span class={styles.uploadIcon}>+</span>
<span class={styles.uploadIcon}>
<FileImageOutlined />
</span>
<span class={styles.uploadHint}></span>
<span class={styles.uploadTip}>
1053*351
-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%;
}
}
}
}
+32 -35
View File
@@ -14,7 +14,6 @@ import {
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 '@/assets/styles/pageLayout.module.less';
/**
@@ -231,41 +230,39 @@ export default defineComponent({
{/* ===== 表格区 ===== */}
<div class={pageStyles.table}>
<div class={styles.eventBannerMain}>
<div ref={containerRef} class={styles.tableBody}>
<Table
columns={tableColumns}
dataSource={dataSource.value}
loading={loading.value}
scroll={{ x: 'max-content', y: height.value }}
pagination={false}
>
{{
bodyCell: (args: any) =>
renderBodyCell({
...args,
renderJumpType,
renderStatus,
onEdit: handleEdit,
onToggleStatus: confirmToggleStatus,
onDelete: confirmDelete,
}),
}}
</Table>
</div>
<div ref={containerRef} class={pageStyles.tableBody}>
<Table
columns={tableColumns}
dataSource={dataSource.value}
loading={loading.value}
scroll={{ x: 'max-content', y: height.value }}
pagination={false}
>
{{
bodyCell: (args: any) =>
renderBodyCell({
...args,
renderJumpType,
renderStatus,
onEdit: handleEdit,
onToggleStatus: confirmToggleStatus,
onDelete: confirmDelete,
}),
}}
</Table>
</div>
{/* 独立分页,右下方 */}
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
total={pagination.value.total}
showSizeChanger
showTotal={(total: number) => `${total}`}
onChange={handlePageChange}
onShowSizeChange={handlePageChange}
/>
</div>
{/* 独立分页,右下方 */}
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
total={pagination.value.total}
showSizeChanger
showTotal={(total: number) => `${total}`}
onChange={handlePageChange}
onShowSizeChange={handlePageChange}
/>
</div>
</div>
-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%;
}
}
}
}
+31 -34
View File
@@ -25,7 +25,6 @@ import { useContainerSize, useState } from '@/hooks';
import EventRegulationModal from './components/EventRegulationModal';
import EventDetailModal from './components/EventDetailModal';
import EventAuditModal from './components/EventAuditModal';
import styles from './index.module.less';
import pageStyles from '@/assets/styles/pageLayout.module.less';
const { RangePicker } = DatePicker;
@@ -245,7 +244,7 @@ export default defineComponent({
<Select
value={filterForm.status}
options={EVENT_STATUS_OPTIONS as any}
style={{ width: '110px' }}
style={{ width: '150px' }}
allowClear
onUpdate:value={(val: any) => (filterForm.status = val || '')}
/>
@@ -301,39 +300,37 @@ export default defineComponent({
{/* ===== 表格区 ===== */}
<div class={pageStyles.table}>
<div class={styles.eventListMain}>
<div ref={containerRef} class={styles.tableBody}>
<Table
columns={tableColumns}
dataSource={dataSource.value}
loading={loading.value}
scroll={{ x: 'max-content', y: height.value }}
pagination={false}
>
{{
bodyCell: (args: any) =>
renderBodyCell({
...args,
onView: handleView,
onAudit: handleAudit,
onToggleShelf: handleToggleShelf,
}),
}}
</Table>
</div>
<div ref={containerRef} class={pageStyles.tableBody}>
<Table
columns={tableColumns}
dataSource={dataSource.value}
loading={loading.value}
scroll={{ x: 'max-content', y: height.value }}
pagination={false}
>
{{
bodyCell: (args: any) =>
renderBodyCell({
...args,
onView: handleView,
onAudit: handleAudit,
onToggleShelf: handleToggleShelf,
}),
}}
</Table>
</div>
{/* 独立分页,右下方 */}
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
total={pagination.value.total}
showSizeChanger
showTotal={(total: number) => `${total}`}
onChange={handlePageChange}
onShowSizeChange={handlePageChange}
/>
</div>
{/* 独立分页,右下方 */}
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
total={pagination.value.total}
showSizeChanger
showTotal={(total: number) => `${total}`}
onChange={handlePageChange}
onShowSizeChange={handlePageChange}
/>
</div>
</div>
-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%;
}
}
}
}
+46 -43
View File
@@ -14,7 +14,6 @@ import {
import { useOrderModel, ORDER_STATUS_OPTIONS, REFUND_STATUS_OPTIONS } from './model/useOrderModel';
import { useContainerSize, useState } from '@/hooks';
import OrderDetailModal from './components/OrderDetailModal';
import styles from './index.module.less';
import pageStyles from '@/assets/styles/pageLayout.module.less';
const { RangePicker } = DatePicker;
@@ -176,7 +175,7 @@ export default defineComponent({
<Select
value={filterForm.orderStatus}
options={ORDER_STATUS_OPTIONS as any}
style={{ width: '120px' }}
style={{ width: '140px' }}
allowClear
onUpdate:value={(val: any) => (filterForm.orderStatus = val || '')}
/>
@@ -185,7 +184,7 @@ export default defineComponent({
<Select
value={filterForm.refundStatus}
options={REFUND_STATUS_OPTIONS as any}
style={{ width: '120px' }}
style={{ width: '140px' }}
allowClear
onUpdate:value={(val: any) => (filterForm.refundStatus = val || '')}
/>
@@ -203,54 +202,58 @@ export default defineComponent({
{/* ===== 表格区 ===== */}
<div class={pageStyles.table}>
<div class={styles.eventOrdersMain}>
{/* 金额汇总 */}
<div class={styles.summaryBar}>
<span class={styles.summaryItem}>
<span class={styles.summaryLabel}></span>
{/* 金额汇总 */}
<div class={pageStyles.summary}>
<span class={pageStyles.summaryItem}>
<span class={pageStyles.summaryLabel}></span>
<span class={pageStyles.summaryValue}>
{summary.value.totalOrderAmount.toFixed(2)}
</span>
<span class={styles.summaryItem}>
<span class={styles.summaryLabel}></span>
</span>
<span class={pageStyles.summaryItem}>
<span class={pageStyles.summaryLabel}></span>
<span class={pageStyles.summaryValue}>
{summary.value.totalPaidAmount.toFixed(2)}
</span>
<span class={styles.summaryItem}>
<span class={styles.summaryLabel}>退</span>
</span>
<span class={pageStyles.summaryItem}>
<span class={pageStyles.summaryLabel}>退</span>
<span class={pageStyles.summaryValue}>
{summary.value.totalRefundAmount.toFixed(2)}
</span>
</div>
</span>
</div>
<div ref={containerRef} class={styles.tableBody}>
<Table
columns={tableColumns}
dataSource={dataSource.value}
loading={loading.value}
scroll={{ x: 'max-content', y: height.value }}
pagination={false}
>
{{
bodyCell: (args: any) =>
renderBodyCell({
...args,
onView: handleView,
onReRefund: handleReRefund,
}),
}}
</Table>
</div>
<div ref={containerRef} class={pageStyles.tableBody}>
<Table
columns={tableColumns}
dataSource={dataSource.value}
loading={loading.value}
scroll={{ x: 'max-content', y: height.value }}
pagination={false}
>
{{
bodyCell: (args: any) =>
renderBodyCell({
...args,
onView: handleView,
onReRefund: handleReRefund,
}),
}}
</Table>
</div>
{/* 独立分页,右下方 */}
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
total={pagination.value.total}
showSizeChanger
showTotal={(total: number) => `${total}`}
onChange={handlePageChange}
onShowSizeChange={handlePageChange}
/>
</div>
{/* 独立分页,右下方 */}
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
total={pagination.value.total}
showSizeChanger
showTotal={(total: number) => `${total}`}
onChange={handlePageChange}
onShowSizeChange={handlePageChange}
/>
</div>
</div>
-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%;
}
}
}
}
+28 -31
View File
@@ -12,7 +12,6 @@ import {
} from 'ant-design-vue';
import { useUserModel, USER_STATUS_OPTIONS } from './model/useUserModel';
import { useContainerSize } from '@/hooks';
import styles from './index.module.less';
import pageStyles from '@/assets/styles/pageLayout.module.less';
/**
@@ -145,37 +144,35 @@ export default defineComponent({
{/* ===== 表格区 ===== */}
<div class={pageStyles.table}>
<div class={styles.eventUsersMain}>
<div ref={containerRef} class={styles.tableBody}>
<Table
columns={tableColumns}
dataSource={dataSource.value}
loading={loading.value}
scroll={{ x: 'max-content', y: height.value }}
pagination={false}
>
{{
bodyCell: (args: any) =>
renderBodyCell({
...args,
onToggleStatus: handleToggleStatus,
}),
}}
</Table>
</div>
<div ref={containerRef} class={pageStyles.tableBody}>
<Table
columns={tableColumns}
dataSource={dataSource.value}
loading={loading.value}
scroll={{ x: 'max-content', y: height.value }}
pagination={false}
>
{{
bodyCell: (args: any) =>
renderBodyCell({
...args,
onToggleStatus: handleToggleStatus,
}),
}}
</Table>
</div>
{/* 独立分页,右下方 */}
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
total={pagination.value.total}
showSizeChanger
showTotal={(total: number) => `${total}`}
onChange={handlePageChange}
onShowSizeChange={handlePageChange}
/>
</div>
{/* 独立分页,右下方 */}
<div class={pageStyles.pagination}>
<Pagination
current={pagination.value.current}
pageSize={pagination.value.pageSize}
total={pagination.value.total}
showSizeChanger
showTotal={(total: number) => `${total}`}
onChange={handlePageChange}
onShowSizeChange={handlePageChange}
/>
</div>
</div>
</div>