LaptopCardComponent.razor 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523
  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. <ResourceTagEditor Resource="Laptop" />
  167. <div class="md:col-span-2">
  168. <div class="text-zinc-400 mb-1">Notes</div>
  169. @if (!_editingNotes)
  170. {
  171. <MarkdownViewer
  172. Value="@Laptop.Notes"
  173. ShowEditButton="true"
  174. OnEdit="BeginNotesEdit" />
  175. }
  176. else
  177. {
  178. <MarkdownEditor
  179. @bind-Value="_notesDraft"
  180. ShowActionButtons="true"
  181. OnSave="SaveNotes"
  182. OnCancel="CancelNotesEdit" />
  183. }
  184. </div>
  185. </div>
  186. <CpuModal
  187. IsOpen="@_cpuModalOpen"
  188. IsOpenChanged="v => _cpuModalOpen = v"
  189. Value="@_editingCpu"
  190. OnSubmit="HandleCpuSubmit"
  191. OnDelete="HandleCpuDelete"/>
  192. <RamModal
  193. IsOpen="@_isRamModalOpen"
  194. IsOpenChanged="v => _isRamModalOpen = v"
  195. Value="@Laptop.Ram"
  196. OnSubmit="HandleRamSubmit"/>
  197. <DriveModal
  198. IsOpen="@_driveModalOpen"
  199. IsOpenChanged="v => _driveModalOpen = v"
  200. Value="@_editingDrive"
  201. OnSubmit="HandleDriveSubmit"
  202. OnDelete="HandleDriveDelete"/>
  203. <GpuModal
  204. IsOpen="@_gpuModalOpen"
  205. IsOpenChanged="v => _gpuModalOpen = v"
  206. Value="@_editingGpu"
  207. OnSubmit="HandleGpuSubmit"
  208. OnDelete="HandleGpuDelete"/>
  209. <ConfirmModal
  210. IsOpen="_confirmDeleteOpen"
  211. IsOpenChanged="v => _confirmDeleteOpen = v"
  212. Title="Delete server"
  213. ConfirmText="Delete"
  214. ConfirmClass="bg-red-600 hover:bg-red-500"
  215. OnConfirm="DeleteServer">
  216. Are you sure you want to delete <strong>@Laptop.Name</strong>?
  217. <br/>
  218. This will detach all dependent systems.
  219. </ConfirmModal>
  220. <StringValueModal
  221. IsOpen="_renameOpen"
  222. IsOpenChanged="v => _renameOpen = v"
  223. Title="Rename laptop"
  224. Description="Enter a new name for this laptop"
  225. Label="New laptop name"
  226. Value="@Laptop.Name"
  227. OnSubmit="HandleRenameSubmit" />
  228. <StringValueModal
  229. IsOpen="_cloneOpen"
  230. IsOpenChanged="v => _cloneOpen = v"
  231. Title="Clone resource"
  232. Description="Enter a name for the cloned resource"
  233. Label="New resource name"
  234. Value="@($"{Laptop.Name}-copy")"
  235. OnSubmit="HandleCloneSubmit" />
  236. @code {
  237. [Parameter] [EditorRequired] public Laptop Laptop { get; set; } = default!;
  238. #region RAM
  239. private bool _isRamModalOpen;
  240. private void EditRam()
  241. {
  242. _isRamModalOpen = true;
  243. }
  244. private async Task HandleRamSubmit(Ram value)
  245. {
  246. _isRamModalOpen = false;
  247. await UpdateLaptopUseCase.ExecuteAsync(Laptop.Name, Laptop.Model, value.Size, value.Mts, Laptop.Notes);
  248. Laptop = await GetLaptopUseCase.ExecuteAsync(Laptop.Name);
  249. }
  250. #endregion
  251. #region CPU
  252. bool _cpuModalOpen;
  253. int _editingCpuIndex;
  254. Cpu? _editingCpu;
  255. void OpenAddCpu()
  256. {
  257. _editingCpuIndex = -1;
  258. _editingCpu = null;
  259. _cpuModalOpen = true;
  260. }
  261. void OpenEditCpu(Cpu cpu)
  262. {
  263. _editingCpu = cpu;
  264. Laptop.Cpus ??= new List<Cpu>();
  265. _editingCpuIndex = Laptop.Cpus.IndexOf(cpu);
  266. ;
  267. _cpuModalOpen = true;
  268. }
  269. async Task HandleCpuSubmit(Cpu cpu)
  270. {
  271. Laptop.Cpus ??= new List<Cpu>();
  272. if (_editingCpuIndex < 0)
  273. {
  274. await AddCpuUseCase.ExecuteAsync(Laptop.Name, cpu.Model, cpu.Cores, cpu.Threads);
  275. }
  276. else
  277. {
  278. await UpdateCpuUseCase.ExecuteAsync(Laptop.Name, _editingCpuIndex, cpu.Model, cpu.Cores, cpu.Threads);
  279. }
  280. Laptop = await GetLaptopUseCase.ExecuteAsync(Laptop.Name);
  281. }
  282. async Task HandleCpuDelete(Cpu cpu)
  283. {
  284. await RemoveCpuUseCase.ExecuteAsync(Laptop.Name, _editingCpuIndex);
  285. Laptop = await GetLaptopUseCase.ExecuteAsync(Laptop.Name);
  286. }
  287. #endregion
  288. #region Drives
  289. bool _driveModalOpen;
  290. int _editingDriveIndex;
  291. Drive? _editingDrive;
  292. void OpenAddDrive()
  293. {
  294. _editingDriveIndex = -1;
  295. _editingDrive = null;
  296. _driveModalOpen = true;
  297. }
  298. void OpenEditDrive(Drive drive)
  299. {
  300. _editingDrive = drive;
  301. Laptop.Drives ??= new List<Drive>();
  302. _editingDriveIndex = Laptop.Drives.IndexOf(drive);
  303. ;
  304. _driveModalOpen = true;
  305. }
  306. async Task HandleDriveSubmit(Drive drive)
  307. {
  308. Laptop.Drives ??= new List<Drive>();
  309. if (_editingDriveIndex < 0)
  310. {
  311. await AddDriveUseCase.ExecuteAsync(Laptop.Name, drive.Type, drive.Size);
  312. }
  313. else
  314. {
  315. await UpdateDriveUseCase.ExecuteAsync(Laptop.Name, _editingDriveIndex, drive.Type, drive.Size);
  316. }
  317. Laptop = await GetLaptopUseCase.ExecuteAsync(Laptop.Name);
  318. StateHasChanged();
  319. }
  320. async Task HandleDriveDelete(Drive drive)
  321. {
  322. await RemoveDriveUseCase.ExecuteAsync(Laptop.Name, _editingDriveIndex);
  323. Laptop = await GetLaptopUseCase.ExecuteAsync(Laptop.Name);
  324. StateHasChanged();
  325. }
  326. #endregion
  327. #region GPUs
  328. bool _gpuModalOpen;
  329. int _editingGpuIndex;
  330. Gpu? _editingGpu;
  331. void OpenAddGpu()
  332. {
  333. _editingGpuIndex = -1;
  334. _editingGpu = null;
  335. _gpuModalOpen = true;
  336. }
  337. void OpenEditGpu(Gpu gpu)
  338. {
  339. Laptop.Gpus ??= new List<Gpu>();
  340. _editingGpuIndex = Laptop.Gpus.IndexOf(gpu);
  341. _editingGpu = gpu;
  342. _gpuModalOpen = true;
  343. }
  344. async Task HandleGpuSubmit(Gpu gpu)
  345. {
  346. Laptop.Gpus ??= new List<Gpu>();
  347. if (_editingGpuIndex < 0)
  348. {
  349. await AddGpuUseCase.ExecuteAsync(
  350. Laptop.Name,
  351. gpu.Model,
  352. gpu.Vram);
  353. }
  354. else
  355. {
  356. await UpdateGpuUseCase.ExecuteAsync(
  357. Laptop.Name,
  358. _editingGpuIndex,
  359. gpu.Model,
  360. gpu.Vram);
  361. }
  362. Laptop = await GetLaptopUseCase.ExecuteAsync(Laptop.Name);
  363. }
  364. async Task HandleGpuDelete(Gpu gpu)
  365. {
  366. await RemoveGpuUseCase.ExecuteAsync(Laptop.Name, _editingGpuIndex);
  367. Laptop = await GetLaptopUseCase.ExecuteAsync(Laptop.Name);
  368. }
  369. #endregion
  370. }
  371. @code {
  372. private bool _confirmDeleteOpen;
  373. [Parameter] public EventCallback<string> OnDeleted { get; set; }
  374. void ConfirmDelete()
  375. {
  376. _confirmDeleteOpen = true;
  377. }
  378. async Task DeleteServer()
  379. {
  380. _confirmDeleteOpen = false;
  381. await DeleteLaptopUseCase.ExecuteAsync(Laptop.Name);
  382. if (OnDeleted.HasDelegate)
  383. await OnDeleted.InvokeAsync(Laptop.Name);
  384. }
  385. }
  386. @code
  387. {
  388. bool _renameOpen;
  389. void OpenRename()
  390. {
  391. _renameOpen = true;
  392. }
  393. async Task HandleRenameSubmit(string newName)
  394. {
  395. await RenameUseCase.ExecuteAsync(Laptop.Name, newName);
  396. Nav.NavigateTo($"resources/hardware/{newName}");
  397. }
  398. }
  399. @code
  400. {
  401. bool _cloneOpen;
  402. void OpenClone()
  403. {
  404. _cloneOpen = true;
  405. }
  406. async Task HandleCloneSubmit(string newName)
  407. {
  408. await CloneUseCase.ExecuteAsync(Laptop.Name, newName);
  409. Nav.NavigateTo($"resources/hardware/{newName}");
  410. }
  411. }
  412. @code
  413. {
  414. bool _editingNotes;
  415. string? _notesDraft;
  416. void BeginNotesEdit()
  417. {
  418. _editingNotes = true;
  419. _notesDraft = Laptop.Notes; // draft buffer
  420. }
  421. void CancelNotesEdit()
  422. {
  423. _editingNotes = false;
  424. _notesDraft = null; // discard
  425. }
  426. async Task SaveNotes()
  427. {
  428. _editingNotes = false;
  429. await UpdateLaptopUseCase.ExecuteAsync(
  430. Laptop.Name,
  431. Laptop.Model,
  432. Laptop.Ram?.Size,
  433. Laptop.Ram?.Mts,
  434. _notesDraft);
  435. Laptop = await GetLaptopUseCase.ExecuteAsync(Laptop.Name);
  436. _notesDraft = null;
  437. }
  438. }