DesktopCardComponent.razor 17 KB

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