feat: implement packaging routes and enhance table configuration UI

- Added a new `packagingRoutes.ts` file to manage packaging and loading information APIs, with authentication middleware applied.
- Enhanced the `TableListConfigPanel` and `ColumnsConfigPanel` components to include editable column locking functionality, allowing users to toggle editability with visual feedback.
- Improved user experience by providing clear indications of column editability status through lock/unlock icons.

Made-with: Cursor
This commit is contained in:
kjs 2026-03-11 16:56:36 +09:00
parent 7cb0be14ab
commit d890155354
3 changed files with 74 additions and 2 deletions

View File

@ -0,0 +1,10 @@
import { Router } from "express";
import { authenticateToken } from "../middleware/authMiddleware";
const router = Router();
router.use(authenticateToken);
// TODO: 포장/적재정보 관리 API 구현 예정
export default router;

View File

@ -1508,7 +1508,38 @@ export const TableListConfigPanel: React.FC<TableListConfigPanelProps> = ({
/>
<Link2 className="h-3 w-3 flex-shrink-0 text-primary" />
<span className="truncate text-xs">{column.columnLabel}</span>
<span className="ml-auto text-[10px] text-primary/80">
{isAlreadyAdded && (
<button
type="button"
title={
config.columns?.find((c) => c.columnName === matchingJoinColumn.joinAlias)?.editable === false
? "편집 잠금 (클릭하여 해제)"
: "편집 가능 (클릭하여 잠금)"
}
className={cn(
"ml-auto flex-shrink-0 rounded p-0.5 transition-colors",
config.columns?.find((c) => c.columnName === matchingJoinColumn.joinAlias)?.editable === false
? "text-destructive hover:bg-destructive/10"
: "text-muted-foreground hover:bg-muted",
)}
onClick={(e) => {
e.stopPropagation();
const currentCol = config.columns?.find((c) => c.columnName === matchingJoinColumn.joinAlias);
if (currentCol) {
updateColumn(matchingJoinColumn.joinAlias, {
editable: currentCol.editable === false ? undefined : false,
});
}
}}
>
{config.columns?.find((c) => c.columnName === matchingJoinColumn.joinAlias)?.editable === false ? (
<Lock className="h-3 w-3" />
) : (
<Unlock className="h-3 w-3" />
)}
</button>
)}
<span className={cn("text-[10px] text-primary/80", !isAlreadyAdded && "ml-auto")}>
{column.inputType || column.dataType}
</span>
</div>

View File

@ -457,7 +457,38 @@ export const ColumnsConfigPanel: React.FC<ColumnsConfigPanelProps> = ({
/>
<Link2 className="h-3 w-3 flex-shrink-0 text-primary" />
<span className="truncate text-xs">{column.columnLabel}</span>
<span className="ml-auto text-[10px] text-primary/80">
{isAlreadyAdded && (
<button
type="button"
title={
config.columns?.find((c: ColumnConfig) => c.columnName === matchingJoinColumn.joinAlias)?.editable === false
? "편집 잠금 (클릭하여 해제)"
: "편집 가능 (클릭하여 잠금)"
}
className={cn(
"ml-auto flex-shrink-0 rounded p-0.5 transition-colors",
config.columns?.find((c: ColumnConfig) => c.columnName === matchingJoinColumn.joinAlias)?.editable === false
? "text-destructive hover:bg-destructive/10"
: "text-muted-foreground hover:bg-muted",
)}
onClick={(e) => {
e.stopPropagation();
const currentCol = config.columns?.find((c: ColumnConfig) => c.columnName === matchingJoinColumn.joinAlias);
if (currentCol) {
onUpdateColumn(matchingJoinColumn.joinAlias, {
editable: currentCol.editable === false ? undefined : false,
});
}
}}
>
{config.columns?.find((c: ColumnConfig) => c.columnName === matchingJoinColumn.joinAlias)?.editable === false ? (
<Lock className="h-3 w-3" />
) : (
<Unlock className="h-3 w-3" />
)}
</button>
)}
<span className={cn("text-[10px] text-primary/80", !isAlreadyAdded && "ml-auto")}>
{column.inputType || column.dataType}
</span>
</div>