feat(vm-ops): make reinstall/clone/change-password async via DeployTask

Backend:
- Add DeployTask.kind column ('deploy'|'reinstall'|'clone'|'change_password')
  + Migration 23: ALTER TABLE deploy_tasks ADD kind, drop NOT NULL on template_id
- Update DeployTask.to_dict() with kind-aware Russian descriptions
- New backend/app/api/proxmox/async_ops.py with three workers:
    _do_reinstall_sync, _do_clone_sync, _do_change_password_sync
  All run on shared _deploy_executor thread pool from templates.py and
  report progress through _update_deploy_task (DB + WebSocket broadcast)
- Rewrite five vms.py endpoints to return 202 + DeployTaskStartResponse:
    POST /vm/{vmid}/clone, /container/{vmid}/clone,
    POST /vm/{vmid}/reinstall,
    POST /vm/{vmid}/change-password, /container/{vmid}/change-password

Frontend:
- DeployTask: add 'kind' and 'server_id' fields
- useCloneInstance/useReinstallInstance/useChangePassword now return
  AsyncTaskResponse {task_id, status, name}; remove invalidateQueries
- InstanceActionDialogs: each onSuccess pushes task to deploy-tasks-store
  with appropriate kind, shows 'launched in background' toast
- InstancesPage:
  * ghostRows only for kind in {deploy, clone}, deduped by (server_id, vmid)
  * reinstall / change_password tasks shown as inline overlay (badge + ring)
    on the existing VM row's status column
This commit is contained in:
markmorado
2026-04-30 00:08:41 +02:00
parent 89d70654fc
commit 79d6864d43
9 changed files with 578 additions and 207 deletions

View File

@@ -31,6 +31,7 @@ import {
useVMConfig,
} from '@/hooks/use-instances';
import { toast } from 'sonner';
import { useDeployTasksStore } from '@/stores/deploy-tasks-store';
export type InstanceAction =
| 'clone'
@@ -75,6 +76,7 @@ function CloneDialog({ open, onClose, serverId, vmid, type, node, name }: Omit<P
const [newName, setNewName] = useState('');
const [full, setFull] = useState(true);
const clone = useCloneInstance(serverId, vmid, type, node);
const addDeployTask = useDeployTasksStore((s) => s.addTask);
const submit = () => {
if (!newName.trim()) return;
@@ -82,7 +84,19 @@ function CloneDialog({ open, onClose, serverId, vmid, type, node, name }: Omit<P
{ new_name: newName.trim(), full },
{
onSuccess: (data) => {
toast.success(`Cloned to VM #${data.new_vmid}`);
addDeployTask({
id: data.task_id,
name: data.name,
status: 'pending',
step: 'В очереди...',
progress: 0,
vmid: null,
node,
error_message: null,
kind: 'clone',
server_id: serverId,
});
toast.success('Клонирование запущено в фоне');
setNewName('');
onClose();
},
@@ -125,14 +139,27 @@ function CloneDialog({ open, onClose, serverId, vmid, type, node, name }: Omit<P
function ReinstallDialog({ open, onClose, serverId, vmid, node, name, type }: Omit<Props, 'open' | 'onOpenChange'> & { open: boolean; onClose: () => void }) {
const [confirm, setConfirm] = useState('');
const reinstall = useReinstallInstance(serverId, vmid, node);
const addDeployTask = useDeployTasksStore((s) => s.addTask);
const expected = name || String(vmid);
// Reinstall via this endpoint currently supports only saved-template instances.
const submit = () => {
if (confirm !== expected) return;
reinstall.mutate(undefined, {
onSuccess: () => {
toast.success(`Reinstall queued for ${expected}`);
onSuccess: (data) => {
addDeployTask({
id: data.task_id,
name: data.name || expected,
status: 'pending',
step: 'В очереди...',
progress: 0,
vmid,
node,
error_message: null,
kind: 'reinstall',
server_id: serverId,
});
toast.success('Переустановка запущена в фоне');
setConfirm('');
onClose();
},
@@ -172,12 +199,13 @@ function ReinstallDialog({ open, onClose, serverId, vmid, node, name, type }: Om
// ==================== Change Password ====================
function ChangePasswordDialog({ open, onClose, serverId, vmid, type, node }: Omit<Props, 'open' | 'onOpenChange'> & { open: boolean; onClose: () => void }) {
function ChangePasswordDialog({ open, onClose, serverId, vmid, type, node, name }: Omit<Props, 'open' | 'onOpenChange'> & { open: boolean; onClose: () => void }) {
const { t } = useTranslation();
const [username, setUsername] = useState('root');
const [password, setPassword] = useState('');
const [show, setShow] = useState(false);
const mut = useChangePassword(serverId, vmid, type, node);
const addDeployTask = useDeployTasksStore((s) => s.addTask);
const submit = () => {
if (!password || password.length < 4) {
@@ -187,8 +215,20 @@ function ChangePasswordDialog({ open, onClose, serverId, vmid, type, node }: Omi
mut.mutate(
{ username, password },
{
onSuccess: () => {
toast.success('Password changed');
onSuccess: (data) => {
addDeployTask({
id: data.task_id,
name: data.name || (name || `#${vmid}`),
status: 'pending',
step: 'В очереди...',
progress: 0,
vmid,
node,
error_message: null,
kind: 'change_password',
server_id: serverId,
});
toast.success('Смена пароля запущена в фоне');
setPassword('');
onClose();
},

View File

@@ -261,10 +261,19 @@ export default function InstancesPage() {
});
}, [vms, typeTab, statusFilter, nodeFilter, search]);
// Ghost rows from active deploy tasks (prepended before real VMs)
// Ghost rows from active deploy/clone tasks (prepended before real VMs).
// - reinstall / change_password tasks are NOT shown as ghosts (they live as overlays on real rows)
// - clone/deploy tasks whose vmid is already present in real list are skipped (de-dupe)
const ghostRows = useMemo<VMInstance[]>(() => {
const realKey = new Set((vms ?? []).map((v) => `${v.server_id}:${v.vmid}`));
return deployTasks
.filter((t) => t.status === 'pending' || t.status === 'running')
.filter((t) => {
const k = t.kind ?? 'deploy';
if (k !== 'deploy' && k !== 'clone') return false;
if (t.vmid && t.server_id && realKey.has(`${t.server_id}:${t.vmid}`)) return false;
return true;
})
.map((t) => ({
vmid: t.vmid ?? 0,
name: t.name,
@@ -274,6 +283,19 @@ export default function InstancesPage() {
server_id: undefined,
_deployTaskId: t.id,
}));
}, [deployTasks, vms]);
// Map (server_id:vmid) -> active reinstall/change_password task (for inline overlay)
const overlayByVm = useMemo(() => {
const m = new Map<string, typeof deployTasks[number]>();
for (const t of deployTasks) {
if (t.status !== 'pending' && t.status !== 'running') continue;
const k = t.kind ?? 'deploy';
if (k !== 'reinstall' && k !== 'change_password') continue;
if (!t.vmid || !t.server_id) continue;
m.set(`${t.server_id}:${t.vmid}`, t);
}
return m;
}, [deployTasks]);
const allRows = useMemo<VMInstance[]>(() => [...ghostRows, ...filteredVMs], [ghostRows, filteredVMs]);
@@ -416,6 +438,20 @@ export default function InstancesPage() {
);
}
const status = vm.status;
const overlay = vm.server_id != null ? overlayByVm.get(`${vm.server_id}:${vm.vmid}`) : undefined;
if (overlay) {
const label = overlay.kind === 'reinstall'
? t('instances.status_reinstalling', 'Reinstalling')
: t('instances.status_changing_password', 'Changing password');
return (
<div className="flex items-center gap-2">
<CircularProgress value={overlay.progress ?? 0} />
<Badge variant="secondary" className="bg-amber-500/10 text-amber-600 text-[10px]">
{label}{(overlay.progress ?? 0) > 0 ? ` ${overlay.progress}%` : ''}
</Badge>
</div>
);
}
return (
<Badge
variant="secondary"