54 lines
1.8 KiB
TypeScript
54 lines
1.8 KiB
TypeScript
export function RpgCreationRoleAssetStudioFooter(props: {
|
|
isSavingToRole: boolean;
|
|
saveStatus: string | null;
|
|
syncBusy: boolean;
|
|
workingRoleGeneratedVisualAssetId?: string;
|
|
workingRoleImageSrc?: string;
|
|
onSaveToRole: () => void;
|
|
}) {
|
|
const {
|
|
isSavingToRole,
|
|
saveStatus,
|
|
syncBusy,
|
|
workingRoleGeneratedVisualAssetId,
|
|
workingRoleImageSrc,
|
|
onSaveToRole,
|
|
} = props;
|
|
|
|
return (
|
|
<div className="platform-role-studio__footer sticky bottom-0 z-10 -mx-4 px-4 pb-[calc(env(safe-area-inset-bottom,0px)+0.35rem)] pt-3 sm:mx-0 sm:rounded-3xl sm:border sm:border-[var(--platform-subpanel-border)] sm:px-4">
|
|
<div className="space-y-3">
|
|
{saveStatus ? (
|
|
<div className="rounded-2xl border border-white/10 bg-black/20 px-4 py-3 text-sm text-zinc-300">
|
|
{saveStatus}
|
|
</div>
|
|
) : null}
|
|
<div className="flex flex-col-reverse gap-3 sm:flex-row sm:justify-end">
|
|
<button
|
|
type="button"
|
|
onClick={onSaveToRole}
|
|
disabled={
|
|
isSavingToRole ||
|
|
syncBusy ||
|
|
!workingRoleImageSrc ||
|
|
!workingRoleGeneratedVisualAssetId
|
|
}
|
|
className={`rounded-full border border-emerald-400/30 bg-emerald-500/10 px-5 py-2 text-sm font-semibold text-emerald-100 transition-colors hover:bg-emerald-500/20 ${
|
|
isSavingToRole ||
|
|
syncBusy ||
|
|
!workingRoleImageSrc ||
|
|
!workingRoleGeneratedVisualAssetId
|
|
? 'cursor-not-allowed opacity-45'
|
|
: ''
|
|
}`}
|
|
>
|
|
{isSavingToRole || syncBusy ? '保存中...' : '保存到当前角色'}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default RpgCreationRoleAssetStudioFooter;
|