style(supply-chain): 移除多处页面标题/说明块与冗余计数文本(工具条保持右对齐)
This commit is contained in:
parent
5b8e1945af
commit
62f693223f
@ -4213,21 +4213,24 @@ export default function OaBoardClient({
|
||||
</section>
|
||||
) : null}
|
||||
|
||||
<header className="flex h-8 shrink-0 items-center justify-between px-1">
|
||||
<h1 className="text-sm font-apple-semibold text-apple-label-primary">{activeTabLabel}</h1>
|
||||
<span className="inline-flex items-center gap-2 text-[11px] text-apple-label-secondary">
|
||||
<LoaderCircle className={`h-3.5 w-3.5 ${isPending ? 'animate-spin' : ''}`} />
|
||||
{activeTab === 'summary'
|
||||
? `${overviewItems.length} 条流程`
|
||||
: showingDailyReport && dailyReport
|
||||
? `${dailyReport.reportDate} 日报`
|
||||
: showingMonthlyReport && monthlyReport
|
||||
? `${monthlyReport.reportMonth} 月度分析`
|
||||
: activeTab === 'brand-planning'
|
||||
? 'SKU 维度'
|
||||
: `${items.length} 条命中`}
|
||||
</span>
|
||||
</header>
|
||||
{/* 供应链中心内嵌页(embeddedTab)不需要这行标题/统计条;独立的新品流程看板页保持原样 */}
|
||||
{embeddedTab ? null : (
|
||||
<header className="flex h-8 shrink-0 items-center justify-between px-1">
|
||||
<h1 className="text-sm font-apple-semibold text-apple-label-primary">{activeTabLabel}</h1>
|
||||
<span className="inline-flex items-center gap-2 text-[11px] text-apple-label-secondary">
|
||||
<LoaderCircle className={`h-3.5 w-3.5 ${isPending ? 'animate-spin' : ''}`} />
|
||||
{activeTab === 'summary'
|
||||
? `${overviewItems.length} 条流程`
|
||||
: showingDailyReport && dailyReport
|
||||
? `${dailyReport.reportDate} 日报`
|
||||
: showingMonthlyReport && monthlyReport
|
||||
? `${monthlyReport.reportMonth} 月度分析`
|
||||
: activeTab === 'brand-planning'
|
||||
? 'SKU 维度'
|
||||
: `${items.length} 条命中`}
|
||||
</span>
|
||||
</header>
|
||||
)}
|
||||
|
||||
{showingDailyReport && dailyReport ? (
|
||||
<DailyReportPanel report={dailyReport} onReportDateChange={changeReportDate} />
|
||||
|
||||
@ -263,7 +263,28 @@ export function CategoryConfigPanel({ canEdit }: { canEdit: boolean }) {
|
||||
return (
|
||||
<div className="category-config-table-page">
|
||||
<div className="category-table-actions">
|
||||
<span className="category-table-meta">共 {pageInfo.total} 行</span>
|
||||
<form className="category-table-filters" onSubmit={submitSearch}>
|
||||
<label className="category-table-search">
|
||||
<Search size={15} />
|
||||
<input value={searchInput} onChange={(event) => setSearchInput(event.target.value)} placeholder="搜索一级/二级类目、分类或规模标签" />
|
||||
</label>
|
||||
<select value={groupFilter} onChange={(event) => { setPage(1); setGroupFilter(event.target.value) }} aria-label="分类筛选">
|
||||
<option value="ALL">全部分类</option>
|
||||
<option value="NONE">未分类</option>
|
||||
{groups.map((group) => <option key={group} value={group}>{group}</option>)}
|
||||
</select>
|
||||
<select value={labelFilter} onChange={(event) => { setPage(1); setLabelFilter(event.target.value) }} aria-label="规模标签筛选">
|
||||
<option value="ALL">全部规模标签</option>
|
||||
{CATEGORY_GROUP_SCALE_LABELS.map((label) => <option key={label} value={label}>{label}</option>)}
|
||||
</select>
|
||||
<button type="submit" className="category-table-button">搜索</button>
|
||||
<button type="button" className="category-table-button" title="清空搜索、分类、规模标签筛选" onClick={resetFilters}>
|
||||
重置
|
||||
</button>
|
||||
<button type="button" className="category-table-icon-button" title="刷新" aria-label="刷新" onClick={() => void load()}>
|
||||
<RefreshCw size={15} />
|
||||
</button>
|
||||
</form>
|
||||
{canEdit ? (
|
||||
<>
|
||||
<button type="button" className="category-table-button" onClick={() => void downloadTemplate()}>
|
||||
@ -298,29 +319,6 @@ export function CategoryConfigPanel({ canEdit }: { canEdit: boolean }) {
|
||||
) : null}
|
||||
</div>
|
||||
|
||||
<form className="category-table-filters" onSubmit={submitSearch}>
|
||||
<label className="category-table-search">
|
||||
<Search size={15} />
|
||||
<input value={searchInput} onChange={(event) => setSearchInput(event.target.value)} placeholder="搜索一级/二级类目、分类或规模标签" />
|
||||
</label>
|
||||
<select value={groupFilter} onChange={(event) => { setPage(1); setGroupFilter(event.target.value) }} aria-label="分类筛选">
|
||||
<option value="ALL">全部分类</option>
|
||||
<option value="NONE">未分类</option>
|
||||
{groups.map((group) => <option key={group} value={group}>{group}</option>)}
|
||||
</select>
|
||||
<select value={labelFilter} onChange={(event) => { setPage(1); setLabelFilter(event.target.value) }} aria-label="规模标签筛选">
|
||||
<option value="ALL">全部规模标签</option>
|
||||
{CATEGORY_GROUP_SCALE_LABELS.map((label) => <option key={label} value={label}>{label}</option>)}
|
||||
</select>
|
||||
<button type="submit" className="category-table-button">搜索</button>
|
||||
<button type="button" className="category-table-button" title="清空搜索、分类、规模标签筛选" onClick={resetFilters}>
|
||||
重置
|
||||
</button>
|
||||
<button type="button" className="category-table-icon-button" title="刷新" aria-label="刷新" onClick={() => void load()}>
|
||||
<RefreshCw size={15} />
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<div className="category-table-wrap">
|
||||
<table className="category-table">
|
||||
<thead>
|
||||
@ -422,9 +420,10 @@ export function CategoryConfigPanel({ canEdit }: { canEdit: boolean }) {
|
||||
|
||||
<style jsx>{`
|
||||
.category-config-table-page { position: relative; display: flex; flex: 1; min-height: 0; flex-direction: column; }
|
||||
.category-table-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 12px 28px 0; flex-wrap: wrap; }
|
||||
.category-table-meta { margin-right: auto; color: #71717a; font-size: 12px; white-space: nowrap; }
|
||||
.category-table-filters { display: flex; align-items: center; gap: 8px; padding: 12px 28px; flex-wrap: wrap; }
|
||||
/* 筛选/按钮条与表头之间加灰色分割线,避免与 #f4f4f5 表头糊在一起 */
|
||||
.category-table-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 12px 28px; border-bottom: 1px solid #e4e4e7; flex-wrap: wrap; }
|
||||
/* 筛选组靠左、右侧按钮组保持原间距整体靠右(margin-right:auto 把筛选推到最左) */
|
||||
.category-table-filters { display: flex; align-items: center; gap: 8px; margin-right: auto; padding: 0; flex-wrap: wrap; }
|
||||
.category-table-search { display: flex; height: 34px; width: min(340px, 36vw); align-items: center; gap: 8px; padding: 0 10px; border: 1px solid #d4d4d8; border-radius: 5px; color: #71717a; background: #fff; }
|
||||
.category-table-search input { width: 100%; border: 0; outline: 0; color: #27272a; font-size: 13px; background: transparent; }
|
||||
select { height: 34px; padding: 0 28px 0 10px; border: 1px solid #d4d4d8; border-radius: 5px; background: #fff; color: #3f3f46; font-size: 13px; }
|
||||
@ -478,7 +477,7 @@ export function CategoryConfigPanel({ canEdit }: { canEdit: boolean }) {
|
||||
.category-table-modal-actions button { height: 34px; padding: 0 13px; border: 1px solid #d4d4d8; border-radius: 5px; background: #fff; color: #52525b; cursor: pointer; }
|
||||
.category-table-modal-actions button.primary { border-color: #27272a; background: #27272a; color: #fff; }
|
||||
.category-table-modal-actions button:disabled { opacity: .55; cursor: wait; }
|
||||
@media (max-width: 760px) { .category-table-actions { padding: 12px 18px 0; } .category-table-filters { padding: 12px 18px; } .category-table-search { width: 100%; } .category-table-wrap { padding: 0 18px 72px; } .category-table-pagination { bottom: 12px; gap: 6px; padding: 7px 10px; overflow-x: auto; } .category-table-page-total { display: none; } .category-table-modal-grid { grid-template-columns: 1fr; } }
|
||||
@media (max-width: 760px) { .category-table-actions { padding: 12px 18px; } .category-table-search { width: 100%; } .category-table-wrap { padding: 0 18px 72px; } .category-table-pagination { bottom: 12px; gap: 6px; padding: 7px 10px; overflow-x: auto; } .category-table-page-total { display: none; } .category-table-modal-grid { grid-template-columns: 1fr; } }
|
||||
`}</style>
|
||||
</div>
|
||||
)
|
||||
|
||||
@ -6,15 +6,9 @@ import { CategoryConfigPanel } from './CategoryConfigPanel'
|
||||
export function CategoryConfigView({ canEdit }: { canEdit: boolean }) {
|
||||
return (
|
||||
<div className="category-config-page">
|
||||
<header className="category-config-toolbar">
|
||||
<h1>产品全量档案-类目配置</h1>
|
||||
</header>
|
||||
<CategoryConfigPanel canEdit={canEdit} />
|
||||
<style jsx>{`
|
||||
.category-config-page { position: relative; display: flex; flex: 1; min-height: 0; flex-direction: column; background: #fafafa; color: #27272a; }
|
||||
.category-config-toolbar { display: flex; align-items: center; padding: 18px 28px 14px; border-bottom: 1px solid #e4e4e7; background: #fff; }
|
||||
h1 { margin: 0; font-size: 20px; font-weight: 650; letter-spacing: 0; }
|
||||
@media (max-width: 760px) { .category-config-toolbar { padding: 16px 18px 12px; } }
|
||||
`}</style>
|
||||
<SupplyChainConfigThemeStyles />
|
||||
</div>
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -17,18 +17,6 @@
|
||||
background: var(--sc-surface);
|
||||
}
|
||||
|
||||
.filterTitle {
|
||||
display: flex;
|
||||
flex: 0 0 auto;
|
||||
height: 34px;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
padding-right: 8px;
|
||||
color: var(--sc-muted);
|
||||
font-size: 12px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.filters label {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Filter, RefreshCw, Search } from 'lucide-react'
|
||||
import { RefreshCw, Search } from 'lucide-react'
|
||||
import { redirect } from 'next/navigation'
|
||||
import { requireSession } from '@/lib/server-session'
|
||||
import { supplyChainPermissionSettingsService } from '@/server/services/supply-chain-permission-settings.service'
|
||||
@ -117,10 +117,6 @@ export default async function DropshipIssuesPage({
|
||||
{selectedCreators.length > 0 && (
|
||||
<input type="hidden" name="creators" value={selectedCreators.join(',')} />
|
||||
)}
|
||||
<div className={styles.filterTitle}>
|
||||
<Filter size={15} />
|
||||
<span>筛选</span>
|
||||
</div>
|
||||
<label className={styles.selectField}>
|
||||
<span>业绩范围</span>
|
||||
<select
|
||||
@ -132,7 +128,6 @@ export default async function DropshipIssuesPage({
|
||||
</select>
|
||||
</label>
|
||||
<label className={styles.keywordField}>
|
||||
<span>商品检索</span>
|
||||
<input
|
||||
name="keyword"
|
||||
type="search"
|
||||
|
||||
@ -173,7 +173,6 @@ export function FinishedProductProgressClient({ initialData, currentUserName, ca
|
||||
|
||||
return <main className="finished-product-page">
|
||||
<header className="finished-product-toolbar">
|
||||
<div><h1>成品进度明细</h1><p>维护采购成品订单交期、送货数量、在途数量、备注和当前节点</p></div>
|
||||
<div className="finished-product-actions">
|
||||
<FinishedProductColumnSettings visibleKeys={columns.visibleKeySet} hiddenCount={columns.hiddenCount} onToggle={columns.toggle} onShowAll={columns.showAll} onHideAll={columns.hideAll} onReorder={columns.reorder} onResetDefault={columns.resetToDefault} />
|
||||
{canEdit && <button type="button" disabled={selectedIds.size === 0} onClick={openContractGroupEditor} className="finished-control-button" title="批量修改已勾选的明细"><Layers3 size={15} />批量修改</button>}
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
export const finishedProductProgressStyles = String.raw`
|
||||
.finished-product-page{height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden;background:#f5f6f6;color:#27272a}
|
||||
.finished-product-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px;border-bottom:1px solid #e4e4e7;background:#fff}
|
||||
.finished-product-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:16px;padding:18px 24px;border-bottom:1px solid #e4e4e7;background:#fff}
|
||||
.finished-product-toolbar h1{margin:0;font-size:18px;font-weight:750;letter-spacing:0}.finished-product-toolbar p{margin:4px 0 0;color:#71717a;font-size:12px}
|
||||
.finished-product-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}
|
||||
.finished-control-button,.finished-primary-button,.finished-secondary-button,.finished-page-button,.finished-row-button,.finished-icon-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid #d4d4d8;border-radius:5px;background:#fff;color:#3f3f46;font-size:12px;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
|
||||
|
||||
@ -80,10 +80,6 @@ export function SupplierInformationView({
|
||||
return (
|
||||
<main className="supplier-information-page">
|
||||
<header className="supplier-toolbar">
|
||||
<div className="supplier-title-wrap">
|
||||
<h1>供应商信息</h1>
|
||||
<span>共 {pageInfo.total} 条</span>
|
||||
</div>
|
||||
<div className="supplier-toolbar-actions">
|
||||
<a href="/api/supply-chain/supplier-information/template">
|
||||
<Download size={14} /> 下载模板
|
||||
@ -211,18 +207,11 @@ export function SupplierInformationView({
|
||||
display: flex;
|
||||
min-height: 54px;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
justify-content: flex-end;
|
||||
padding: 9px 18px;
|
||||
border-bottom: 1px solid var(--sc-border);
|
||||
background: var(--sc-surface);
|
||||
}
|
||||
.supplier-title-wrap {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
gap: 10px;
|
||||
}
|
||||
.supplier-title-wrap h1 { margin: 0; font-size: 17px; font-weight: 700; }
|
||||
.supplier-title-wrap span { color: var(--sc-subtle); font-size: 12px; }
|
||||
.supplier-toolbar-actions { display: flex; align-items: center; gap: 8px; }
|
||||
.supplier-toolbar-actions a,
|
||||
.supplier-toolbar-actions button { display: inline-flex; height: 34px; align-items: center; gap: 5px; border: 1px solid var(--sc-border); border-radius: 5px; padding: 0 11px; background: var(--sc-surface); color: var(--sc-muted); font-size: 12px; text-decoration: none; cursor: pointer; }
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user