80 lines
2.7 KiB
TypeScript
80 lines
2.7 KiB
TypeScript
import { type ScheduleArtifact } from "../../services/api";
|
|
import Icon from "../../components/common/Icon";
|
|
import { shortHash } from "./utils";
|
|
|
|
export function ArtifactList({
|
|
artifacts,
|
|
keyword,
|
|
onDrop,
|
|
onDoubleClick,
|
|
onContextMenu,
|
|
onKeywordChange,
|
|
}: {
|
|
artifacts: ScheduleArtifact[];
|
|
keyword: string;
|
|
onDrop: (artifact: ScheduleArtifact, x: number, y: number) => void;
|
|
onDoubleClick: (artifact: ScheduleArtifact) => void;
|
|
onContextMenu: (event: React.MouseEvent, artifact: ScheduleArtifact) => void;
|
|
onKeywordChange: (keyword: string) => void;
|
|
}) {
|
|
const filtered = keyword.trim()
|
|
? artifacts.filter((item) => (
|
|
item.script_name.toLowerCase().includes(keyword.trim().toLowerCase())
|
|
|| item.version_label.toLowerCase().includes(keyword.trim().toLowerCase())
|
|
))
|
|
: artifacts;
|
|
|
|
return (
|
|
<section className="schedule-panel schedule-artifacts-panel">
|
|
<div className="schedule-panel__title">
|
|
<div><strong>稳定版本脚本</strong><span>{artifacts.length}</span></div>
|
|
</div>
|
|
<label className="schedule-search">
|
|
<Icon name="search" size={15} />
|
|
<input
|
|
value={keyword}
|
|
placeholder="搜索稳定版本"
|
|
onChange={(event) => onKeywordChange(event.target.value)}
|
|
/>
|
|
</label>
|
|
<p className="artifact-tip">拖动卡片到画布，节点将保存 versions_id</p>
|
|
<div className="artifact-list">
|
|
{filtered.length ? filtered.map((artifact) => (
|
|
<div
|
|
className="artifact-card"
|
|
draggable
|
|
key={artifact.versions_id}
|
|
onDragStart={(event) => {
|
|
event.dataTransfer.effectAllowed = "copy";
|
|
event.dataTransfer.setData(
|
|
"application/x-model-platform-version",
|
|
artifact.versions_id,
|
|
);
|
|
event.dataTransfer.setData("text/plain", artifact.versions_id);
|
|
}}
|
|
onContextMenu={(event) => onContextMenu(event, artifact)}
|
|
onDoubleClick={() => onDoubleClick(artifact)}
|
|
>
|
|
<span className={`artifact-card__icon artifact-card__icon--${artifact.script_type}`}>
|
|
<Icon
|
|
name={artifact.script_type === "notebook" ? "notebook" : "python"}
|
|
size={17}
|
|
/>
|
|
</span>
|
|
<span>
|
|
<strong>{artifact.script_name}</strong>
|
|
<small>
|
|
{artifact.version_label} · {shortHash(artifact.content_hash)}
|
|
</small>
|
|
</span>
|
|
</div>
|
|
)) : (
|
|
<p className="schedule-empty">
|
|
暂无稳定版本，请先在"构建脚本"中发布
|
|
</p>
|
|
)}
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|