fix: intake 所有工作区表格表头 sticky 固定
- 所有 workspace 表格 thead 添加 sticky top-0 z-10,滚动时表头固定 - 外层容器 overflow-hidden 改为 overflow-auto,配合滚动生效 - 基础信息 SKU 表格合并双层 div 为单层,添加 max-h-[60vh] 高度约束 - BOM 表格同步添加 sticky thead
This commit is contained in:
parent
e7d2c8626c
commit
e1b78d602e
@ -124,7 +124,7 @@ export function FinishedSampleShipmentWorkspace({
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="min-h-0 min-w-0 flex-1 overflow-hidden p-3">
|
||||
<div className="min-h-0 min-w-0 flex-1 overflow-auto p-3">
|
||||
{allRows.length === 0 ? (
|
||||
<div className="flex min-h-[260px] items-center justify-center rounded-apple-xl border border-dashed border-apple-separator text-sm text-apple-label-secondary">
|
||||
当前还没有 SKU 信息,先维护 SKU 后再进行成品寄样。
|
||||
@ -134,9 +134,9 @@ export function FinishedSampleShipmentWorkspace({
|
||||
当前批次还没有 SKU 信息。
|
||||
</div>
|
||||
) : (
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll h-full max-w-full rounded-apple-lg border border-apple-separator">
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll h-full max-w-full rounded-apple-lg border border-apple-separator" style={{ overflowY: 'visible' }}>
|
||||
<table className="min-w-[1760px] w-full border-collapse text-xs">
|
||||
<thead className="bg-apple-bg-secondary/40 text-apple-label-secondary">
|
||||
<thead className="sticky top-0 z-10 bg-apple-bg-primary text-apple-label-secondary">
|
||||
<tr>
|
||||
{[
|
||||
"寄样",
|
||||
|
||||
@ -89,7 +89,7 @@ export function FirstQualityWorkspace({
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="min-h-0 min-w-0 flex-1 overflow-hidden p-3">
|
||||
<div className="min-h-0 min-w-0 flex-1 overflow-auto p-3">
|
||||
{allRows.length === 0 ? (
|
||||
<div className="flex min-h-[260px] items-center justify-center rounded-apple-xl border border-dashed border-apple-separator text-sm text-apple-label-secondary">
|
||||
当前还没有 SKU 信息,先维护 SKU 后再进行首批质检。
|
||||
@ -99,9 +99,9 @@ export function FirstQualityWorkspace({
|
||||
当前批次还没有 SKU 信息。
|
||||
</div>
|
||||
) : (
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll h-full max-w-full rounded-apple-lg border border-apple-separator">
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll h-full max-w-full rounded-apple-lg border border-apple-separator" style={{ overflowY: 'visible' }}>
|
||||
<table className="min-w-[2120px] w-full border-collapse text-xs">
|
||||
<thead className="bg-apple-bg-secondary/40 text-apple-label-secondary">
|
||||
<thead className="sticky top-0 z-10 bg-apple-bg-primary text-apple-label-secondary">
|
||||
<tr>
|
||||
{[
|
||||
"批次",
|
||||
|
||||
@ -96,7 +96,7 @@ export function ProductLimitWorkspace({
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="min-h-0 min-w-0 flex-1 overflow-hidden p-3">
|
||||
<div className="min-h-0 min-w-0 flex-1 overflow-auto p-3">
|
||||
{allRows.length === 0 ? (
|
||||
<div className="flex min-h-[260px] items-center justify-center rounded-apple-xl border border-dashed border-apple-separator text-sm text-apple-label-secondary">
|
||||
当前还没有 SKU 信息,先维护 SKU 后再填写产品限价。
|
||||
@ -106,9 +106,9 @@ export function ProductLimitWorkspace({
|
||||
当前批次还没有 SKU 信息。
|
||||
</div>
|
||||
) : (
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll h-full max-w-full rounded-apple-lg border border-apple-separator">
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll h-full max-w-full rounded-apple-lg border border-apple-separator" style={{ overflowY: 'visible' }}>
|
||||
<table className="min-w-[1480px] w-full border-collapse text-xs">
|
||||
<thead className="bg-apple-bg-secondary/40 text-apple-label-secondary">
|
||||
<thead className="sticky top-0 z-10 bg-apple-bg-primary text-apple-label-secondary">
|
||||
<tr>
|
||||
{[
|
||||
"产品图片",
|
||||
|
||||
@ -113,7 +113,7 @@ export function ProductPricingWorkspace({
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="min-h-0 min-w-0 flex-1 overflow-hidden p-3">
|
||||
<div className="min-h-0 min-w-0 flex-1 overflow-auto p-3">
|
||||
{allRows.length === 0 ? (
|
||||
<div className="flex min-h-[260px] items-center justify-center rounded-apple-xl border border-dashed border-apple-separator text-sm text-apple-label-secondary">
|
||||
当前还没有 SKU 信息,先维护 SKU 后再核价。
|
||||
@ -123,9 +123,9 @@ export function ProductPricingWorkspace({
|
||||
当前批次还没有 SKU 信息。
|
||||
</div>
|
||||
) : (
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll h-full max-w-full rounded-apple-lg border border-apple-separator">
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll h-full max-w-full rounded-apple-lg border border-apple-separator" style={{ overflowY: 'visible' }}>
|
||||
<table className="min-w-[1280px] w-full border-collapse text-xs">
|
||||
<thead className="bg-apple-bg-secondary/40 text-apple-label-secondary">
|
||||
<thead className="sticky top-0 z-10 bg-apple-bg-primary text-apple-label-secondary">
|
||||
<tr>
|
||||
{[
|
||||
"型号",
|
||||
|
||||
@ -85,7 +85,7 @@ export function SampleMeasurementWorkspace({
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="min-h-0 min-w-0 flex-1 overflow-hidden p-3">
|
||||
<div className="min-h-0 min-w-0 flex-1 overflow-auto p-3">
|
||||
{allRows.length === 0 ? (
|
||||
<div className="flex min-h-[260px] items-center justify-center rounded-apple-xl border border-dashed border-apple-separator text-sm text-apple-label-secondary">
|
||||
当前还没有 SKU 信息,先维护 SKU 后再进行样包测量。
|
||||
@ -95,9 +95,9 @@ export function SampleMeasurementWorkspace({
|
||||
当前批次还没有 SKU 信息。
|
||||
</div>
|
||||
) : (
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll h-full max-w-full rounded-apple-lg border border-apple-separator">
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll h-full max-w-full rounded-apple-lg border border-apple-separator" style={{ overflowY: 'visible' }}>
|
||||
<table className="min-w-[2120px] w-full border-collapse text-xs">
|
||||
<thead className="bg-apple-bg-secondary/40 text-apple-label-secondary">
|
||||
<thead className="sticky top-0 z-10 bg-apple-bg-primary text-apple-label-secondary">
|
||||
<tr>
|
||||
{[
|
||||
"型号",
|
||||
|
||||
@ -67,10 +67,9 @@ export function ComponentSkuTable({
|
||||
onSelectComponentCode: (code: string) => void;
|
||||
}) {
|
||||
return (
|
||||
<div className="overflow-hidden rounded-apple-lg border border-apple-separator">
|
||||
<div className="non-integrated-table-scroll overflow-x-auto">
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll max-h-[60vh] max-w-full rounded-apple-lg border border-apple-separator">
|
||||
<table className="min-w-[1660px] w-full text-left text-xs">
|
||||
<thead className="bg-apple-bg-secondary/60 text-apple-label-secondary">
|
||||
<thead className="sticky top-0 z-10 bg-apple-bg-primary text-apple-label-secondary">
|
||||
<tr>
|
||||
{COMPONENT_SKU_TABLE_HEADERS.map((label) => (
|
||||
<th
|
||||
@ -165,7 +164,6 @@ export function ComponentSkuTable({
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@ -50,14 +50,13 @@ export function SkuInfoTableShell({
|
||||
(showActionColumn ? 1 : 0);
|
||||
|
||||
return (
|
||||
<div className="overflow-hidden rounded-apple-lg border border-apple-separator">
|
||||
<div className="non-integrated-table-scroll overflow-x-auto">
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll max-h-[60vh] max-w-full rounded-apple-lg border border-apple-separator">
|
||||
<table
|
||||
className={`${
|
||||
isSeriesComponentDetailProduct ? "min-w-[2260px]" : "min-w-[2180px]"
|
||||
} w-full text-left text-xs`}
|
||||
>
|
||||
<thead className="bg-apple-bg-secondary/60 text-apple-label-secondary">
|
||||
<thead className="sticky top-0 z-10 bg-apple-bg-primary text-apple-label-secondary">
|
||||
<tr>
|
||||
{headers.map((label) => (
|
||||
<th
|
||||
@ -83,7 +82,6 @@ export function SkuInfoTableShell({
|
||||
{children}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@ -28,7 +28,7 @@ export function BomRowsTableShell({
|
||||
className="w-full min-w-full text-left text-xs"
|
||||
style={{ minWidth: `${tableMinWidth}px` }}
|
||||
>
|
||||
<thead className="bg-apple-bg-secondary/60 text-apple-label-secondary">
|
||||
<thead className="sticky top-0 z-10 bg-apple-bg-primary text-apple-label-secondary">
|
||||
<tr>
|
||||
{columns.map((column) => (
|
||||
<th
|
||||
|
||||
@ -96,9 +96,9 @@ export function ProductFactoryInfoTable({
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll h-full max-w-full rounded-apple-lg border border-apple-separator">
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll h-full max-w-full rounded-apple-lg border border-apple-separator" style={{ overflowY: 'visible' }}>
|
||||
<table className="min-w-[2160px] w-full border-collapse text-xs">
|
||||
<thead className="bg-apple-bg-secondary/40 text-apple-label-secondary">
|
||||
<thead className="sticky top-0 z-10 bg-apple-bg-primary text-apple-label-secondary">
|
||||
<tr>
|
||||
{[
|
||||
"定厂",
|
||||
|
||||
@ -8,9 +8,9 @@ export function ProductFactorySkuInfoTable({
|
||||
rows: NonIntegratedFactoryRow[];
|
||||
}) {
|
||||
return (
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll h-full max-w-full rounded-apple-lg border border-apple-separator">
|
||||
<div className="non-integrated-table-scroll non-integrated-workspace-table-scroll h-full max-w-full rounded-apple-lg border border-apple-separator" style={{ overflowY: 'visible' }}>
|
||||
<table className="min-w-[980px] w-full border-collapse text-xs">
|
||||
<thead className="bg-apple-bg-secondary/40 text-apple-label-secondary">
|
||||
<thead className="sticky top-0 z-10 bg-apple-bg-primary text-apple-label-secondary">
|
||||
<tr>
|
||||
{[
|
||||
"定厂",
|
||||
|
||||
@ -91,7 +91,7 @@ export function ProductFactoryWorkspace({
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="min-h-0 min-w-0 flex-1 overflow-hidden p-3">
|
||||
<div className="min-h-0 min-w-0 flex-1 overflow-auto p-3">
|
||||
{allRows.length === 0 ? (
|
||||
<div className="flex min-h-[260px] items-center justify-center rounded-apple-xl border border-dashed border-apple-separator text-sm text-apple-label-secondary">
|
||||
当前还没有 SKU 信息,先维护 SKU 后再定厂。
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user