ServerCardComponent.razor 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625
  1. @using RackPeek.Domain.Resources.Hardware.Servers
  2. @using RackPeek.Domain.Resources.Hardware.Servers.Cpus
  3. @using RackPeek.Domain.Resources.Hardware.Servers.Drives
  4. @using RackPeek.Domain.Resources.Hardware.Servers.Gpus
  5. @using RackPeek.Domain.Resources.Hardware.Servers.Nics
  6. @using RackPeek.Domain.Resources.Models
  7. @inject AddCpuUseCase AddCpuUseCase
  8. @inject RemoveCpuUseCase RemoveCpuUseCase
  9. @inject UpdateCpuUseCase UpdateCpuUseCase
  10. @inject AddDrivesUseCase AddDriveUseCase
  11. @inject RemoveDriveUseCase RemoveDriveUseCase
  12. @inject UpdateDriveUseCase UpdateDriveUseCase
  13. @inject AddNicUseCase AddNicUseCase
  14. @inject UpdateNicUseCase UpdateNicUseCase
  15. @inject RemoveNicUseCase RemoveNicUseCase
  16. @inject AddGpuUseCase AddGpuUseCase
  17. @inject UpdateGpuUseCase UpdateGpuUseCase
  18. @inject RemoveGpuUseCase RemoveGpuUseCase
  19. @inject GetServerUseCase GetServerUseCase
  20. @inject UpdateServerUseCase UpdateServerUseCase
  21. @inject DeleteServerUseCase DeleteServerUseCase
  22. @inject CloneServerUseCase CloneUseCase
  23. @inject RenameServerUseCase RenameServerUseCase
  24. @inject NavigationManager Nav
  25. <div class="border border-zinc-800 rounded p-4 bg-zinc-900">
  26. <div class="flex justify-between items-center mb-3">
  27. <div class="text-zinc-100 hover:text-emerald-300">
  28. <NavLink href="@($"resources/hardware/{Server.Name}")" class="block">
  29. @Server.Name
  30. </NavLink>
  31. </div>
  32. <div class="flex justify-between items-center mb-3">
  33. <div class="flex items-center gap-2">
  34. <button class="text-xs text-blue-400 hover:text-blue-300 transition"
  35. title="Rename service"
  36. @onclick="OpenRename">
  37. Rename
  38. </button>
  39. <button
  40. class="text-xs text-emerald-400 hover:text-emerald-300 transition"
  41. title="Clone service"
  42. @onclick="OpenClone">
  43. Clone
  44. </button>
  45. <button
  46. class="text-xs text-red-400 hover:text-red-300 transition"
  47. title="Delete server"
  48. @onclick="ConfirmDelete">
  49. Delete
  50. </button>
  51. </div>
  52. </div>
  53. </div>
  54. <div class="grid grid-cols-1 md:grid-cols-2 gap-3 text-sm">
  55. <div>
  56. <div class="flex items-center justify-between mb-1 group">
  57. <div class="text-zinc-400">CPU
  58. <button
  59. class="hover:text-emerald-400 group-hover:opacity-100 transition"
  60. title="Add CPU"
  61. @onclick="OpenAddCpu">
  62. +
  63. </button>
  64. </div>
  65. </div>
  66. @if (Server.Cpus?.Any() == true)
  67. {
  68. <!-- CPU rows -->
  69. @foreach (var cpu in Server.Cpus)
  70. {
  71. <div
  72. class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
  73. <div class="flex gap-2 group-hover:opacity-100 transition">
  74. <button
  75. class="hover:text-emerald-400"
  76. title="Edit CPU"
  77. @onclick="() => OpenEditCpu(cpu)">
  78. @cpu.Model — @cpu.Cores cores / @cpu.Threads threads
  79. </button>
  80. </div>
  81. </div>
  82. }
  83. }
  84. </div>
  85. <div>
  86. <div class="text-zinc-400 mb-1">RAM
  87. @if (Server.Ram is null)
  88. {
  89. <button
  90. class="hover:text-emerald-400 group-hover:opacity-100 transition"
  91. title="Add RAM"
  92. @onclick="EditRam">
  93. +
  94. </button>
  95. }
  96. </div>
  97. @if (Server.Ram is not null)
  98. {
  99. <div
  100. class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
  101. <div class="flex gap-2 group-hover:opacity-100 transition">
  102. <button
  103. class="hover:text-emerald-400"
  104. title="Edit RAM"
  105. @onclick="EditRam">
  106. @($"{Server.Ram.Size} GB {Server.Ram.Mts} MT/s")
  107. </button>
  108. </div>
  109. </div>
  110. }
  111. </div>
  112. <div>
  113. <div class="flex items-center justify-between mb-1 group">
  114. <div class="text-zinc-400">Drives
  115. <button
  116. class="hover:text-emerald-400 group-hover:opacity-100 transition"
  117. title="Add Drive"
  118. @onclick="OpenAddDrive">
  119. +
  120. </button>
  121. </div>
  122. </div>
  123. @if (Server.Drives?.Any() == true)
  124. {
  125. @foreach (var drive in Server.Drives)
  126. {
  127. <div
  128. class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
  129. <div class="flex gap-2 group-hover:opacity-100 transition">
  130. <button
  131. class="hover:text-emerald-400"
  132. title="Edit Drive"
  133. @onclick="() => OpenEditDrives(drive)">
  134. @drive.Type — @drive.Size GB
  135. </button>
  136. </div>
  137. </div>
  138. }
  139. }
  140. </div>
  141. <div>
  142. <div class="flex items-center justify-between mb-1 group">
  143. <div class="text-zinc-400">
  144. NICs
  145. <button
  146. class="hover:text-emerald-400 group-hover:opacity-100 transition"
  147. title="Add NIC"
  148. @onclick="OpenAddNic">
  149. +
  150. </button>
  151. </div>
  152. </div>
  153. @if (Server.Nics?.Any() == true)
  154. {
  155. @foreach (var nic in Server.Nics)
  156. {
  157. <div
  158. class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
  159. <button
  160. class="hover:text-emerald-400"
  161. title="Edit NIC"
  162. @onclick="() => OpenEditNic(nic)">
  163. @nic.Type — @nic.Speed Gbps (@nic.Ports ports)
  164. </button>
  165. </div>
  166. }
  167. }
  168. </div>
  169. <div>
  170. <div class="flex items-center justify-between mb-1 group">
  171. <div class="text-zinc-400">
  172. GPUs
  173. <button
  174. class="hover:text-emerald-400 group-hover:opacity-100 transition"
  175. title="Add GPU"
  176. @onclick="OpenAddGpu">
  177. +
  178. </button>
  179. </div>
  180. </div>
  181. @if (Server.Gpus?.Any() == true)
  182. {
  183. @foreach (var gpu in Server.Gpus)
  184. {
  185. <div
  186. class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
  187. <button
  188. class="hover:text-emerald-400"
  189. title="Edit GPU"
  190. @onclick="() => OpenEditGpu(gpu)">
  191. @gpu.Model — @gpu.Vram GB VRAM
  192. </button>
  193. </div>
  194. }
  195. }
  196. </div>
  197. </div>
  198. <div class="md:col-span-2">
  199. <div class="text-zinc-400 mb-1">Notes</div>
  200. @if (!_editingNotes)
  201. {
  202. <MarkdownViewer
  203. Value="@Server.Notes"
  204. ShowEditButton="true"
  205. OnEdit="BeginNotesEdit" />
  206. }
  207. else
  208. {
  209. <MarkdownEditor
  210. @bind-Value="_notesDraft"
  211. ShowActionButtons="true"
  212. OnSave="SaveNotes"
  213. OnCancel="CancelNotesEdit" />
  214. }
  215. </div>
  216. </div>
  217. <CpuModal
  218. IsOpen="@_cpuModalOpen"
  219. IsOpenChanged="v => _cpuModalOpen = v"
  220. Value="@_editingCpu"
  221. OnSubmit="HandleCpuSubmit"
  222. OnDelete="HandleCpuDelete"/>
  223. <RamModal
  224. IsOpen="@_isRamModalOpen"
  225. IsOpenChanged="v => _isRamModalOpen = v"
  226. Value="@Server.Ram"
  227. OnSubmit="HandleRamSubmit"/>
  228. <DriveModal
  229. IsOpen="@_driveModalOpen"
  230. IsOpenChanged="v => _driveModalOpen = v"
  231. Value="@_editingDrive"
  232. OnSubmit="HandleDriveSubmit"
  233. OnDelete="HandleDriveDelete"/>
  234. <NicModal
  235. IsOpen="@_nicModalOpen"
  236. IsOpenChanged="v => _nicModalOpen = v"
  237. Value="@_editingNic"
  238. OnSubmit="HandleNicSubmit"
  239. OnDelete="HandleNicDelete"/>
  240. <GpuModal
  241. IsOpen="@_gpuModalOpen"
  242. IsOpenChanged="v => _gpuModalOpen = v"
  243. Value="@_editingGpu"
  244. OnSubmit="HandleGpuSubmit"
  245. OnDelete="HandleGpuDelete"/>
  246. <ConfirmModal
  247. IsOpen="_confirmDeleteOpen"
  248. IsOpenChanged="v => _confirmDeleteOpen = v"
  249. Title="Delete server"
  250. ConfirmText="Delete"
  251. ConfirmClass="bg-red-600 hover:bg-red-500"
  252. OnConfirm="DeleteServer">
  253. Are you sure you want to delete <strong>@Server.Name</strong>?
  254. <br/>
  255. This will detach all dependent systems.
  256. </ConfirmModal>
  257. <StringValueModal
  258. IsOpen="_renameOpen"
  259. IsOpenChanged="v => _renameOpen = v"
  260. Title="Rename server"
  261. Description="Enter a new name for this server"
  262. Label="New server name"
  263. Value="@Server.Name"
  264. OnSubmit="HandleRenameSubmit" />
  265. <StringValueModal
  266. IsOpen="_cloneOpen"
  267. IsOpenChanged="v => _cloneOpen = v"
  268. Title="Clone resource"
  269. Description="Enter a name for the cloned resource"
  270. Label="New resource name"
  271. Value="@($"{Server.Name}-copy")"
  272. OnSubmit="HandleCloneSubmit" />
  273. @code {
  274. [Parameter] [EditorRequired] public Server Server { get; set; } = default!;
  275. #region RAM
  276. private bool _isRamModalOpen;
  277. private void EditRam()
  278. {
  279. _isRamModalOpen = true;
  280. }
  281. private async Task HandleRamSubmit(Ram value)
  282. {
  283. _isRamModalOpen = false;
  284. await UpdateServerUseCase.ExecuteAsync(Server.Name, value.Size, value.Mts, Server.Ipmi);
  285. Server = await GetServerUseCase.ExecuteAsync(Server.Name);
  286. }
  287. #endregion
  288. #region CPU
  289. bool _cpuModalOpen;
  290. int _editingCpuIndex;
  291. Cpu? _editingCpu;
  292. void OpenAddCpu()
  293. {
  294. _editingCpuIndex = -1;
  295. _editingCpu = null;
  296. _cpuModalOpen = true;
  297. }
  298. void OpenEditCpu(Cpu cpu)
  299. {
  300. _editingCpu = cpu;
  301. Server.Cpus ??= new List<Cpu>();
  302. _editingCpuIndex = Server.Cpus.IndexOf(cpu);
  303. ;
  304. _cpuModalOpen = true;
  305. }
  306. async Task HandleCpuSubmit(Cpu cpu)
  307. {
  308. Server.Cpus ??= new List<Cpu>();
  309. if (_editingCpuIndex < 0)
  310. {
  311. await AddCpuUseCase.ExecuteAsync(Server.Name, cpu.Model, cpu.Cores, cpu.Threads);
  312. }
  313. else
  314. {
  315. await UpdateCpuUseCase.ExecuteAsync(Server.Name, _editingCpuIndex, cpu.Model, cpu.Cores, cpu.Threads);
  316. }
  317. Server = await GetServerUseCase.ExecuteAsync(Server.Name);
  318. }
  319. async Task HandleCpuDelete(Cpu cpu)
  320. {
  321. await RemoveCpuUseCase.ExecuteAsync(Server.Name, _editingCpuIndex);
  322. Server = await GetServerUseCase.ExecuteAsync(Server.Name);
  323. }
  324. #endregion
  325. #region Drives
  326. bool _driveModalOpen;
  327. int _editingDriveIndex;
  328. Drive? _editingDrive;
  329. void OpenAddDrive()
  330. {
  331. _editingDriveIndex = -1;
  332. _editingDrive = null;
  333. _driveModalOpen = true;
  334. }
  335. void OpenEditDrives(Drive drive)
  336. {
  337. _editingDrive = drive;
  338. Server.Drives ??= new List<Drive>();
  339. _editingDriveIndex = Server.Drives.IndexOf(drive);
  340. ;
  341. _driveModalOpen = true;
  342. }
  343. async Task HandleDriveSubmit(Drive drive)
  344. {
  345. Server.Drives ??= new List<Drive>();
  346. if (_editingDriveIndex < 0)
  347. {
  348. await AddDriveUseCase.ExecuteAsync(Server.Name, drive.Type, drive.Size);
  349. }
  350. else
  351. {
  352. await UpdateDriveUseCase.ExecuteAsync(Server.Name, _editingDriveIndex, drive.Type, drive.Size);
  353. }
  354. Server = await GetServerUseCase.ExecuteAsync(Server.Name);
  355. StateHasChanged();
  356. }
  357. async Task HandleDriveDelete(Drive drive)
  358. {
  359. await RemoveDriveUseCase.ExecuteAsync(Server.Name, _editingDriveIndex);
  360. Server = await GetServerUseCase.ExecuteAsync(Server.Name);
  361. StateHasChanged();
  362. }
  363. #endregion
  364. #region NICs
  365. bool _nicModalOpen;
  366. int _editingNicIndex;
  367. Nic? _editingNic;
  368. void OpenAddNic()
  369. {
  370. _editingNicIndex = -1;
  371. _editingNic = null;
  372. _nicModalOpen = true;
  373. }
  374. void OpenEditNic(Nic nic)
  375. {
  376. Server.Nics ??= new List<Nic>();
  377. _editingNicIndex = Server.Nics.IndexOf(nic);
  378. _editingNic = nic;
  379. _nicModalOpen = true;
  380. }
  381. async Task HandleNicSubmit(Nic nic)
  382. {
  383. Server.Nics ??= new List<Nic>();
  384. if (_editingNicIndex < 0)
  385. {
  386. await AddNicUseCase.ExecuteAsync(
  387. Server.Name,
  388. nic.Type,
  389. nic.Speed,
  390. nic.Ports);
  391. }
  392. else
  393. {
  394. await UpdateNicUseCase.ExecuteAsync(
  395. Server.Name,
  396. _editingNicIndex,
  397. nic.Type,
  398. nic.Speed,
  399. nic.Ports);
  400. }
  401. Server = await GetServerUseCase.ExecuteAsync(Server.Name);
  402. }
  403. async Task HandleNicDelete(Nic nic)
  404. {
  405. await RemoveNicUseCase.ExecuteAsync(Server.Name, _editingNicIndex);
  406. Server = await GetServerUseCase.ExecuteAsync(Server.Name);
  407. }
  408. #endregion
  409. #region GPUs
  410. bool _gpuModalOpen;
  411. int _editingGpuIndex;
  412. Gpu? _editingGpu;
  413. void OpenAddGpu()
  414. {
  415. _editingGpuIndex = -1;
  416. _editingGpu = null;
  417. _gpuModalOpen = true;
  418. }
  419. void OpenEditGpu(Gpu gpu)
  420. {
  421. Server.Gpus ??= new List<Gpu>();
  422. _editingGpuIndex = Server.Gpus.IndexOf(gpu);
  423. _editingGpu = gpu;
  424. _gpuModalOpen = true;
  425. }
  426. async Task HandleGpuSubmit(Gpu gpu)
  427. {
  428. Server.Gpus ??= new List<Gpu>();
  429. if (_editingGpuIndex < 0)
  430. {
  431. await AddGpuUseCase.ExecuteAsync(
  432. Server.Name,
  433. gpu.Model,
  434. gpu.Vram);
  435. }
  436. else
  437. {
  438. await UpdateGpuUseCase.ExecuteAsync(
  439. Server.Name,
  440. _editingGpuIndex,
  441. gpu.Model,
  442. gpu.Vram);
  443. }
  444. Server = await GetServerUseCase.ExecuteAsync(Server.Name);
  445. }
  446. async Task HandleGpuDelete(Gpu gpu)
  447. {
  448. await RemoveGpuUseCase.ExecuteAsync(Server.Name, _editingGpuIndex);
  449. Server = await GetServerUseCase.ExecuteAsync(Server.Name);
  450. }
  451. #endregion
  452. }
  453. @code {
  454. private bool _confirmDeleteOpen;
  455. [Parameter] public EventCallback<string> OnDeleted { get; set; }
  456. void ConfirmDelete()
  457. {
  458. _confirmDeleteOpen = true;
  459. }
  460. async Task DeleteServer()
  461. {
  462. _confirmDeleteOpen = false;
  463. await DeleteServerUseCase.ExecuteAsync(Server.Name);
  464. if (OnDeleted.HasDelegate)
  465. await OnDeleted.InvokeAsync(Server.Name);
  466. }
  467. }
  468. @code
  469. {
  470. bool _renameOpen;
  471. void OpenRename()
  472. {
  473. _renameOpen = true;
  474. }
  475. async Task HandleRenameSubmit(string newName)
  476. {
  477. await RenameServerUseCase.ExecuteAsync(Server.Name, newName);
  478. Nav.NavigateTo($"resources/hardware/{newName}");
  479. }
  480. }
  481. @code
  482. {
  483. bool _cloneOpen;
  484. void OpenClone()
  485. {
  486. _cloneOpen = true;
  487. }
  488. async Task HandleCloneSubmit(string newName)
  489. {
  490. await CloneUseCase.ExecuteAsync(Server.Name, newName);
  491. Nav.NavigateTo($"resources/hardware/{newName}");
  492. }
  493. }
  494. @code
  495. {
  496. bool _editingNotes;
  497. string? _notesDraft;
  498. void BeginNotesEdit()
  499. {
  500. _editingNotes = true;
  501. _notesDraft = Server.Notes; // draft buffer
  502. }
  503. void CancelNotesEdit()
  504. {
  505. _editingNotes = false;
  506. _notesDraft = null; // discard
  507. }
  508. async Task SaveNotes()
  509. {
  510. _editingNotes = false;
  511. await UpdateServerUseCase.ExecuteAsync(
  512. Server.Name,
  513. Server.Ram?.Size,
  514. Server.Ram?.Mts,
  515. Server.Ipmi,
  516. _notesDraft);
  517. Server = await GetServerUseCase.ExecuteAsync(Server.Name);
  518. _notesDraft = null;
  519. }
  520. }