LaptopCardComponent.razor 14 KB

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