LaptopCardComponent.razor 14 KB

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