Sin descripción
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

config_new_1-backup.js 52KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615
  1. // configuration js
  2. let m2DriveMaxQty = 4;
  3. let m2DriveSelectedQty = 0;
  4. let nvmeDrivemaxqty = 4;
  5. let nvmeDriveselectedqty = 0;
  6. let hardDriveMaxQty = 10;
  7. let hardDriveSelectedQty = 0;
  8. // configuration items
  9. if (localStorage.getItem("defaultCurrency") === null) {
  10. localStorage.setItem("defaultCurrency", undefined);
  11. localStorage.setItem("currentCurrency", undefined);
  12. }
  13. // api for getting current location along with currencies
  14. const configCatgories = [
  15. {
  16. id: 1,
  17. title: "barebone",
  18. maxQty: 1,
  19. },
  20. {
  21. id: 2,
  22. title: "processor",
  23. maxQty: 3,
  24. },
  25. {
  26. id: 3,
  27. title: "memory",
  28. maxQty: 1,
  29. },
  30. {
  31. id: 4,
  32. title: "m.2 drive",
  33. maxQty: 4,
  34. },
  35. {
  36. id: 5,
  37. title: "U.2/U.3 NVME DRIVE",
  38. maxQty: 4,
  39. },
  40. {
  41. id: 6,
  42. title: "HARD DRIVE",
  43. maxQty: 10,
  44. },
  45. ];
  46. const bareboneProducts = [
  47. {
  48. id: 1,
  49. title: `Anwi C252 Chipset - 1U - 2x SATA - 1x M.2 - Dual Anwi 1-Gigabit Ethernet (RJ45) - 350W Power Supply`,
  50. qty: 3,
  51. price: 99,
  52. },
  53. ];
  54. const processorProducts = [
  55. {
  56. productcatid: 1,
  57. productcattitle: `Intel<sup>®</sup> Xeon<sup>®</sup> E-2300 Processor Series`,
  58. products: [
  59. {
  60. id: 1,
  61. title: `Quad-Core Intel<sup>®</sup> Xeon<sup>®</sup> E-2314 Processor 2.8GHz 8MB
  62. Cache (65W)`,
  63. qty: 3,
  64. price: 99,
  65. },
  66. {
  67. id: 2,
  68. title: `Quad-Core Intel<sup>®</sup> Xeon<sup>®</sup> E-2334 Processor 3.4GHz 8MB Cache (65W)`,
  69. qty: 3,
  70. price: 99,
  71. },
  72. {
  73. id: 3,
  74. title: `Eight-Core Intel<sup>®</sup> Xeon<sup>®</sup> E-2378 Processor 2.6GHz 16MB Cache (65W)`,
  75. qty: 3,
  76. price: 99,
  77. },
  78. ],
  79. },
  80. {
  81. productcatid: 2,
  82. productcattitle: `Intel<sup>®</sup> Xeon<sup>®</sup> E-2300 Processor Series with Anwi UHD P750 Graphics`,
  83. products: [
  84. {
  85. id: 1,
  86. title: `Quad-Core Intel<sup>®</sup> Xeon<sup>®</sup> E-2324G Processor 3.1GHz
  87. 8MB Cache (65W)`,
  88. qty: 3,
  89. price: 99,
  90. },
  91. {
  92. id: 2,
  93. title: `Quad-Core Intel<sup>®</sup> Xeon<sup>®</sup> E-2374G Processor 3.7GHz 8MB Cache (80W)`,
  94. qty: 2,
  95. price: 99,
  96. },
  97. {
  98. id: 3,
  99. title: `Six-Core Intel<sup>®</sup> Xeon<sup>®</sup> E-2356G Processor 3.2GHz 12MB Cache (80W)`,
  100. qty: 1,
  101. price: 99,
  102. },
  103. {
  104. id: 4,
  105. title: `Six-Core Intel<sup>®</sup> Xeon<sup>®</sup> E-2386G Processor 3.5GHz 12MB Cache (95W)`,
  106. qty: 1,
  107. price: 99,
  108. },
  109. ],
  110. },
  111. ];
  112. const memoryProducts = [
  113. {
  114. id: 1,
  115. title: `16GB PC4-25600 3200MHz DDR4 ECC UDIMM`,
  116. qty: 2,
  117. price: 99,
  118. },
  119. {
  120. id: 2,
  121. title: `32GB PC4-25600 3200MHz DDR4 ECC UDIMM`,
  122. qty: 2,
  123. price: 220,
  124. },
  125. ];
  126. const m2driveProducts = [
  127. {
  128. productcatid: 1,
  129. productcattitle: `Kioxia XG6 M.2 PCIe 3.1 x4 NVMe Solid State Drives`,
  130. products: [
  131. {
  132. id: 1,
  133. title: `256GB Kioxia XG6 M.2 PCIe 3.1 x4 NVMe Solid State
  134. Drive`,
  135. qty: 4,
  136. price: 99,
  137. },
  138. {
  139. id: 2,
  140. title: `512GB Kioxia XG6 M.2 PCIe 3.1 x4 NVMe Solid State Drive`,
  141. qty: 4,
  142. price: 149,
  143. },
  144. {
  145. id: 3,
  146. title: `1.0TB Kioxia XG6 M.2 PCIe 3.1 x4 NVMe Solid State Drive`,
  147. qty: 4,
  148. price: 269,
  149. },
  150. ],
  151. },
  152. {
  153. productcatid: 2,
  154. productcattitle: `Anwi DC P4801X M.2 PCIe 3.0 x4 NVMe Solid State Drives`,
  155. products: [
  156. {
  157. id: 1,
  158. title: `100GB Intel<sup>®</sup> Optane™ SSD DC P4801X Series M.2 PCIe 3.0 x4 NVMe
  159. Solid State Drive`,
  160. qty: 4,
  161. price: 99,
  162. },
  163. {
  164. id: 2,
  165. title: `200GB Intel<sup>®</sup> Optane™ SSD DC P4801X Series M.2 PCIe
  166. 3.0 x4 NVMe Solid State Drive`,
  167. qty: 4,
  168. price: 149,
  169. },
  170. {
  171. id: 3,
  172. title: `1.0TB Kioxia XG6 M.2 PCIe 3.1 x4 NVMe Solid State Drive`,
  173. qty: 4,
  174. price: 269,
  175. },
  176. ],
  177. },
  178. {
  179. productcatid: 3,
  180. productcattitle: `Micron 7400 PRO M.2 PCIe 4.0 x4 NVMe Solid State Drives`,
  181. products: [
  182. {
  183. id: 1,
  184. title: `480GB Micron 7400 PRO Series M.2 22x80 PCIe 4.0 x4 NVMe Solid
  185. State Drive`,
  186. qty: 4,
  187. price: 99,
  188. },
  189. {
  190. id: 2,
  191. title: `960GB Micron 7400 PRO Series M.2 22x80 PCIe 4.0 x4
  192. NVMe Solid State Drive`,
  193. qty: 4,
  194. price: 149,
  195. },
  196. {
  197. id: 3,
  198. title: `1.92TB Micron 7400 PRO Series M.2 22x110 PCIe 4.0 x4 NVMe Solid
  199. State Drive`,
  200. qty: 4,
  201. price: 269,
  202. },
  203. ],
  204. },
  205. ];
  206. const NvmeDriveProducts = [
  207. {
  208. productcatid: 1,
  209. productcattitle: `Anwi P4510 Series PCIe 3.1 x4 NVMe Solid State Drives (1x DWPD)`,
  210. products: [
  211. {
  212. id: 1,
  213. title: `8.0TB Anwi SSD DC P4510 Series U.2 PCIe 3.1 x4 NVMe Solid State Drive`,
  214. qty: 4,
  215. price: 99,
  216. },
  217. ],
  218. },
  219. {
  220. productcatid: 2,
  221. productcattitle: `Anwi P5510 Series PCIe 4.0 x4 NVMe Solid State Drives`,
  222. products: [
  223. {
  224. id: 1,
  225. title: `3.84TB Anwi SSD D7 P5510 Series U.2 PCIe 4.0 x4 NVMe Solid State Drive`,
  226. qty: 4,
  227. price: 99,
  228. },
  229. {
  230. id: 2,
  231. title: `7.68TB Anwi SSD D7 P5510 Series U.2 PCIe 4.0 x4 NVMe Solid State Drive`,
  232. qty: 4,
  233. price: 149,
  234. },
  235. {
  236. id: 3,
  237. title: `1.5TB Intel<sup>®</sup> Optane™ SSD DC P4800X Series U.2 PCIe 3.0 x4 NVMe Solid State Drive`,
  238. qty: 4,
  239. price: 269,
  240. },
  241. ],
  242. },
  243. {
  244. productcatid: 3,
  245. productcattitle: `Intel<sup>®</sup> Optane™ DC P4801X Series PCIe 3.0 x4 NVMe Solid State Drives`,
  246. products: [
  247. {
  248. id: 1,
  249. title: `100GB Intel<sup>®</sup> Optane™ SSD DC P4801X Series U.2 PCIe 3.0 x4 NVMe Solid State Drive`,
  250. qty: 4,
  251. price: 99,
  252. },
  253. ],
  254. },
  255. {
  256. productcatid: 4,
  257. productcattitle: `Micron 7400 PRO Series PCIe 4.0 x4 NVMe Solid State Drives (1x DWPD)`,
  258. products: [
  259. {
  260. id: 1,
  261. title: `960GB Micron 7400 PRO Series U.3 7mm PCIe 4.0 x4 NVMe Solid State Drive`,
  262. qty: 4,
  263. price: 99,
  264. },
  265. {
  266. id: 2,
  267. title: `1.92TB Micron 7400 PRO Series U.3 7mm PCIe 4.0 x4 NVMe Solid State Drive`,
  268. qty: 4,
  269. price: 149,
  270. },
  271. {
  272. id: 3,
  273. title: `3.84TB Micron 7400 PRO Series U.3 7mm PCIe 4.0 x4 NVMe Solid State Drive`,
  274. qty: 4,
  275. price: 269,
  276. },
  277. {
  278. id: 4,
  279. title: `7.68TB Micron 7400 PRO Series U.3 7mm PCIe 4.0 x4 NVMe Solid State Drive`,
  280. qty: 4,
  281. price: 269,
  282. },
  283. ],
  284. },
  285. ];
  286. const HardDriveProducts = [
  287. {
  288. productcatid: 1,
  289. productcattitle: `Seagate Enterprise-Class 6Gb/s SATA 7.2k Hard Drives`,
  290. products: [
  291. {
  292. id: 1,
  293. title: `1.0TB SATA 6.0Gb/s 7200RPM - 2.5" - Seagate Exos 7E2000 Series (512e)`,
  294. qty: 4,
  295. price: 99,
  296. },
  297. {
  298. id: 2,
  299. title: `2.0TB SATA 6.0Gb/s 7200RPM - 2.5" - Seagate Exos 7E2000 Series (512e)`,
  300. qty: 4,
  301. price: 149,
  302. },
  303. ],
  304. },
  305. {
  306. productcatid: 2,
  307. productcattitle: `Seagate Enterprise-Class 12Gb/s SAS 7.2k Hard Drives`,
  308. products: [
  309. {
  310. id: 1,
  311. title: `1.0TB SAS 3.0 12.0Gb/s 7200RPM - 2.5" - Seagate Exos 7E2000 Series (512e)`,
  312. qty: 4,
  313. price: 99,
  314. },
  315. {
  316. id: 2,
  317. title: `2.0TB SAS 3.0 12.0Gb/s 7200RPM - 2.5" - Seagate Exos 7E2000 Series (512e)`,
  318. qty: 4,
  319. price: 149,
  320. },
  321. ],
  322. },
  323. {
  324. productcatid: 3,
  325. productcattitle: `Intel<sup>®</sup> Optane™ DC P4801X Series PCIe 3.0 x4 NVMe Solid State Drives`,
  326. products: [
  327. {
  328. id: 1,
  329. title: `100GB Intel<sup>®</sup> Optane™ SSD DC P4801X Series U.2 PCIe 3.0 x4 NVMe Solid State Drive`,
  330. qty: 4,
  331. price: 99,
  332. },
  333. ],
  334. },
  335. {
  336. productcatid: 4,
  337. productcattitle: `Seagate Enterprise-Class 12Gb/s SAS 10k Hard Drives`,
  338. products: [
  339. {
  340. id: 1,
  341. title: `600GB SAS3 12.0Gb/s 10000RPM - 2.5" - Seagate Exos 10E2400 Series (512e/4Kn)`,
  342. qty: 4,
  343. price: 99,
  344. },
  345. {
  346. id: 2,
  347. title: `1.2TB SAS3 12.0Gb/s 10000RPM - 2.5" - Seagate Exos 10E2400 Series (512e/4Kn)`,
  348. qty: 4,
  349. price: 149,
  350. },
  351. {
  352. id: 3,
  353. title: `1.8TB SAS3 12.0Gb/s 10000RPM - 2.5" - Seagate Exos 10E2400 Series (512e/4Kn)`,
  354. qty: 4,
  355. price: 269,
  356. },
  357. {
  358. id: 4,
  359. title: `2.4TB SAS3 12.0Gb/s 10000RPM - 2.5" - Seagate Exos 10E2400 Series (512e/4Kn)`,
  360. qty: 4,
  361. price: 269,
  362. },
  363. ],
  364. },
  365. {
  366. productcatid: 5,
  367. productcattitle: `Micron 5300 MAX Enterprise-Class SATA Solid State Drives`,
  368. products: [
  369. {
  370. id: 1,
  371. title: `240GB Micron 5300 MAX Series 2.5" SATA 6.0Gb/s Solid State Drive`,
  372. qty: 4,
  373. price: 99,
  374. },
  375. {
  376. id: 2,
  377. title: `480GB Micron 5300 MAX Series 2.5" SATA 6.0Gb/s Solid State Drive`,
  378. qty: 4,
  379. price: 149,
  380. },
  381. {
  382. id: 3,
  383. title: `960GB Micron 5300 MAX Series 2.5" SATA 6.0Gb/s Solid State Drive`,
  384. qty: 4,
  385. price: 269,
  386. },
  387. {
  388. id: 4,
  389. title: `1.92TB Micron 5300 MAX Series 2.5" SATA 6.0Gb/s Solid State Drive`,
  390. qty: 4,
  391. price: 269,
  392. },
  393. {
  394. id: 5,
  395. title: `1.92TB Micron 5300 MAX Series 2.5" SATA 6.0Gb/s Solid State Drive`,
  396. qty: 4,
  397. price: 269,
  398. },
  399. ],
  400. },
  401. ];
  402. //Bind Config Categories
  403. bindConfigurations();
  404. updateItemsCount();
  405. // max quantity-progress-bar
  406. function bindConfigurations() {
  407. let configCatHtml = "";
  408. $.each(configCatgories, function (i, cat) {
  409. const id = cat.id;
  410. let title = cat.title;
  411. let qty = cat.maxQty;
  412. let maxQtyHtml = "";
  413. if (title == "m.2 drive") {
  414. title = "m2-drive";
  415. } else if (title == "U.2/U.3 NVME DRIVE") {
  416. title = "nvme-drive";
  417. } else if (title == "HARD DRIVE") {
  418. title = "hard-drive";
  419. }
  420. if (title == "m2-drive" || title == "processor") {
  421. let quantityHtml = "";
  422. if (title == "m2-drive") {
  423. let qtyProgressBarHtml = "";
  424. for (let i = 0; i < qty; i++) {
  425. qtyProgressBarHtml += `<span class="sms progress-bar progress-bar-${i}"></span>`;
  426. }
  427. quantityHtml = `<span>Quantity:</span><div class="max-qty-wrap ml-15"><div class="d-flex justify-content-between align-items-center"><div class="d-flex flex-column"><div class="qty-progress-bars d-flex align-items-center">${qtyProgressBarHtml}</div><div class="d-flex justify-content-between flex-wrap align-items-center mt-1"><span class="small">Max Quantity: ${qty}</span><div class="small"><span class="selected-qty">0</span>/<span class="max-qty-span">${qty}</span></div></div></div></div></div>`;
  428. }
  429. maxQtyHtml = `<div class="text-white p-3 border-radius-custom flex-wrap float-lg-end d-flex align-items-center config-max-quantity">${quantityHtml}</div>`;
  430. }
  431. if (title == "nvme-drive") {
  432. let quantityHtml = "";
  433. if (title == "nvme-drive") {
  434. let qtyProgressBarHtml = "";
  435. for (let i = 0; i < qty; i++) {
  436. qtyProgressBarHtml += `<span class="nvdrive progress-bar progress-bar-${i}"></span>`;
  437. }
  438. quantityHtml = `<span>Quantity:</span><div class="max-qty-wrap ml-15"><div class="d-flex justify-content-between align-items-center"><div class="d-flex flex-column"><div class="qty-progress-bars nvme d-flex align-items-center">${qtyProgressBarHtml}</div><div class="d-flex justify-content-between flex-wrap align-items-center mt-1"><span class="small">Max Quantity: ${qty}</span><div class="small"><span class="selected-qty">0</span>/<span class="max-qty-span">${qty}</span></div></div></div></div></div>`;
  439. }
  440. maxQtyHtml = `<div class="text-white p-3 border-radius-custom flex-wrap float-lg-end d-flex align-items-center config-max-quantity">${quantityHtml}</div>`;
  441. }
  442. if (title == "hard-drive") {
  443. let quantityHtml = "";
  444. if (title == "hard-drive") {
  445. let qtyProgressBarHtml = "";
  446. for (let i = 0; i < qty; i++) {
  447. qtyProgressBarHtml += `<span class="sms progress-bar progress-bar-${i}"></span>`;
  448. }
  449. quantityHtml = `<span>Quantity:</span><div class="max-qty-wrap ml-15"><div class="d-flex justify-content-between align-items-center"><div class="d-flex flex-column"><div class="qty-progress-bars d-flex align-items-center">${qtyProgressBarHtml}</div><div class="d-flex justify-content-between flex-wrap align-items-center mt-1"><span class="small">Max Quantity: ${qty}</span><div class="small"><span class="selected-qty">0</span>/<span class="max-qty-span">${qty}</span></div></div></div></div></div>`;
  450. }
  451. maxQtyHtml = `<div class="text-white p-3 border-radius-custom flex-wrap float-lg-end d-flex align-items-center config-max-quantity">${quantityHtml}</div>`;
  452. }
  453. configCatHtml += `<div class="product-config-selector accordion mb-20" id="config-${title}" data-maxqty='${qty}'>
  454. <div class="config-heading d-flex justify-content-between flex-wrap align-items-center">
  455. <h5 class="text-white p-3 border-radius-custom text-uppercase">${title}
  456. </h5>
  457. ${maxQtyHtml}
  458. </div>
  459. <div class="config-content p-0"></div>
  460. </div>`;
  461. });
  462. $("#block-content-main").html(configCatHtml);
  463. bindAllConfigProducts();
  464. }
  465. //bindNvmeConfigurations();
  466. updateItemsCount();
  467. // appending&binding -html
  468. function bindAllConfigProducts() {
  469. bindBareboneAndMemoryProducts("barebone");
  470. bindBareboneAndMemoryProducts("memory");
  471. bindProcessorAndM2DriveProducts("processor");
  472. bindProcessorAndM2DriveProducts("m2-drive");
  473. bindNVMEHARDDRIVEAndProducts("nvme-drive");
  474. bindNVMEHARDDRIVEAndProducts("hard-drive");
  475. bindEventListeners();
  476. }
  477. function bindBareboneAndMemoryProducts(cat) {
  478. let productHtml = "";
  479. let productsArr = bareboneProducts;
  480. let name = "radio-btns-barebone";
  481. if (cat == "memory") {
  482. productsArr = memoryProducts;
  483. name = "radio-btn-memory";
  484. }
  485. $.each(productsArr, function (i, product) {
  486. productHtml += `<p class="provide-content product-item">
  487. <div
  488. class="name-of-config card-body row justify-content-between py-1 align-items-center config-product-item" data-id='${product.id}' data-cat='${cat}' data-price='${product.price}'>
  489. <div class="form-check mt-2 col-lg-7" id="form-check">
  490. <input class="form-check-input product-radio-btn" id="${cat}-radio-btn-${product.id}" type="checkbox" data-checked="false" name= "${name}"
  491. value="${product.title}" >
  492. <label class="form-check-label" for="${cat}-radio-btn-${product.id}">
  493. <strong>${product.title}</strong>
  494. </label>
  495. </div>
  496. <div class="btn-group config-quantity-btn text-black col-lg-2">
  497. <select class="form-select fw-bold qty-selector product2" id="product1"> <option value="0">Select</option>`;
  498. for (let i = 1; i <= product.qty; i++) {
  499. productHtml += `<option value="${i}">Qty: ${i}</option>`;
  500. }
  501. if (".product2")
  502. productHtml += `</select>
  503. </div>
  504. <div class="config-pricing col-lg-2">
  505. <span class="config-price-span p-2 border-radius-custom"><span></span><span class="total-price-amount price-wrap d-flex align-items-center"><span class="currency-symbol">&#8377;</span><span class="product-price">${product.price}</span></span></span>
  506. </div>
  507. </div>
  508. </p>`;
  509. });
  510. $(`#config-${cat} .config-content`).html(productHtml);
  511. }
  512. function bindProcessorAndM2DriveProducts(cat) {
  513. let productCatHtml = "";
  514. let productsArr = processorProducts;
  515. let accordion = "processorProductAccordion";
  516. let collapse = "processorProductcollapse";
  517. let lastSelectDataAttr = "";
  518. if (cat == "m2-drive") {
  519. productsArr = m2driveProducts;
  520. accordion = "m2DriveProductAccordion";
  521. collapse = "m2DriveProductcollapse";
  522. lastSelectDataAttr = 'data-lastval="1"';
  523. }
  524. $.each(productsArr, function (i, productcat) {
  525. const productcatid = productcat.productcatid;
  526. const productcattitle = productcat.productcattitle;
  527. productCatHtml += `<div class="accordion sub-section mt-4 border-radius-custom" id="${accordion}-${productcatid}">
  528. <div class="accordion-item">
  529. <h2 class="accordion-header">
  530. <button class="accordion-button" style="color:#4e4c7d; background-color: #e7e9f4;"
  531. type="button" data-bs-toggle="collapse" data-bs-target="#${collapse}-${productcatid}"
  532. aria-expanded="true" aria-controls="${collapse}-${productcatid}">
  533. <strong>${productcattitle}</strong>
  534. </button>
  535. </h2>
  536. <div id="${collapse}-${productcatid}" class="accordion-collapse collapse show" data-bs-parent="#${accordion}-${productcatid}">
  537. <div class="accordion-body">`;
  538. let productHtml = "";
  539. $.each(productcat.products, function (i, product) {
  540. productHtml += `
  541. <div class="name-of-config row justify-content-between py-1 align-items-center config-product-item" data-id='${
  542. product.id
  543. }' data-cat='${cat}' data-price='${
  544. product.price
  545. }' data-productcatid='${productcatid}'>
  546. <div class="form-check mt-2 col-lg-7" id="form-check">
  547. ${appendProcessorAndM2DriveInput(
  548. cat,
  549. product.id,
  550. product.title,
  551. productcatid
  552. )}
  553. </div>
  554. <div class="btn-group config-quantity-btn text-black col-lg-2">
  555. <select class="form-select fw-bold qty-selector product2" ${lastSelectDataAttr}> <option value="0">Select</option>`;
  556. for (let i = 1; i <= product.qty; i++) {
  557. productHtml += `<option value="${i}">Qty: ${i}</option>`;
  558. }
  559. productHtml += `</select>
  560. </div>
  561. <div class="config-pricing col-lg-2">
  562. <span class="config-price-span p-2 border-radius-custom"><span></span><span class="processor-total-price total-price-amount price-wrap d-flex align-items-center"><span class="currency-symbol">&#8377;</span><span class="product-price">${product.price}</span></span> </span>
  563. </div>
  564. </div>`;
  565. });
  566. productCatHtml += productHtml;
  567. productCatHtml += `</div>
  568. </div>
  569. </div>
  570. </div>`;
  571. });
  572. $(`#config-${cat} .config-content`).html(productCatHtml);
  573. }
  574. function bindNVMEHARDDRIVEAndProducts(cat) {
  575. let productCatHtml = "";
  576. // let productsArr = HardDriveProducts;
  577. // let accordion = 'hardwareProductAccordion';
  578. // let collapse = 'hardwareProductcollapse';
  579. let lastSelectDataAttr = "";
  580. if (cat == "nvme-drive") {
  581. productsArr = NvmeDriveProducts;
  582. accordion = "NVMEDRIVEProductAccordion";
  583. collapse = "NVMEDRIVEProductcollapse";
  584. lastSelectDataAttr = 'data-lastval="1"';
  585. }
  586. if (cat == "hard-drive") {
  587. productsArr = HardDriveProducts;
  588. accordion = "hardwareProductAccordion";
  589. collapse = "hardwareProductcollapse";
  590. lastSelectDataAttr = 'data-lastval="1"';
  591. }
  592. $.each(productsArr, function (i, productcat) {
  593. const productcatid = productcat.productcatid;
  594. const productcattitle = productcat.productcattitle;
  595. productCatHtml += `<div class="accordion sub-section mt-4 border-radius-custom" id="${accordion}-${productcatid}">
  596. <div class="accordion-item">
  597. <h2 class="accordion-header">
  598. <button class="accordion-button" style="color:#4e4c7d; background-color: #e7e9f4;"
  599. type="button" data-bs-toggle="collapse" data-bs-target="#${collapse}-${productcatid}"
  600. aria-expanded="true" aria-controls="${collapse}-${productcatid}">
  601. <strong>${productcattitle}</strong>
  602. </button>
  603. </h2>
  604. <div id="${collapse}-${productcatid}" class="accordion-collapse collapse show" data-bs-parent="#${accordion}-${productcatid}">
  605. <div class="accordion-body">`;
  606. let productHtml = "";
  607. $.each(productcat.products, function (i, product) {
  608. productHtml += `
  609. <div class="name-of-config row justify-content-between py-1 align-items-center config-product-item" data-id='${
  610. product.id
  611. }' data-cat='${cat}' data-price='${
  612. product.price
  613. }' data-productcatid='${productcatid}'>
  614. <div class="form-check mt-2 col-lg-7" id="form-check">
  615. ${appendNVMEHARDDRIVEAndProducts(
  616. cat,
  617. product.id,
  618. product.title,
  619. productcatid
  620. )}
  621. </div>
  622. <div class="btn-group config-quantity-btn text-black col-lg-2">
  623. <select class="form-select fw-bold qty-selector product2" ${lastSelectDataAttr}> <option value="0">Select</option>`;
  624. for (let i = 1; i <= product.qty; i++) {
  625. productHtml += `<option value="${i}">Qty: ${i}</option>`;
  626. }
  627. productHtml += `</select>
  628. </div>
  629. <div class="config-pricing col-lg-2">
  630. <span class="config-price-span p-2 border-radius-custom"><span></span><span class="processor-total-price total-price-amount price-wrap d-flex align-items-center"><span class="currency-symbol">&#8377;</span><span class="product-price">${product.price}</span></span> </span>
  631. </div>
  632. </div>`;
  633. });
  634. productCatHtml += productHtml;
  635. productCatHtml += `</div>
  636. </div>
  637. </div>
  638. </div>`;
  639. });
  640. $(`#config-${cat} .config-content`).html(productCatHtml);
  641. }
  642. function appendProcessorAndM2DriveInput(cat, id, title, productcatid = 0) {
  643. if (cat == "m2-drive") {
  644. return `<input class="form-check-input product-check-btn" type="checkbox" name="m2Drive-check-btns"
  645. id="${cat}-check-btn-${productcatid}-${id}" value="${title}" >
  646. <label class="form-check-label" for="${cat}-check-btn-${productcatid}-${id}">
  647. <strong>${title}</strong>
  648. </label>`;
  649. } else {
  650. return `<input class="form-check-input product-radio-btn" type="checkbox" name="processor-radio-btns" data-checked="false"
  651. id="${cat}-radio-btn-${productcatid}-${id}" value="${title}" >
  652. <label class="form-check-label" for="${cat}-radio-btn-${productcatid}-${id}">
  653. <strong>${title}</strong>
  654. </label>`;
  655. }
  656. }
  657. function appendNVMEHARDDRIVEAndProducts(cat, id, title, productcatid = 0) {
  658. if (cat == "nvme-drive") {
  659. return `<input class="form-check-input product-check" type="checkbox" name="nvme-check-btns"
  660. id="${cat}-check-btn-${productcatid}-${id}" value="${title}" >
  661. <label class="form-check-label" for="${cat}-check-btn-${productcatid}-${id}">
  662. <strong>${title}</strong>
  663. </label>`;
  664. } else {
  665. return `<input class="form-check-input product-hard-btn" type="checkbox" name="hardware-radio-btns"
  666. id="${cat}-check-btn-${productcatid}-${id}" value="${title}" >
  667. <label class="form-check-label" for="${cat}-check-btn-${productcatid}-${id}">
  668. <strong>${title}</strong>
  669. </label>`;
  670. }
  671. }
  672. // function removeActiveClassForPrice(DOM) {
  673. // return DOM.removeClass("active");
  674. // }
  675. // select and radio-check-btn-section
  676. function bindEventListeners() {}
  677. //progress-bars active and remove
  678. function m2DriveProgress() {
  679. if (m2DriveSelectedQty <= m2DriveMaxQty) {
  680. $("#config-m2-drive .qty-progress-bars .progress-bar").removeClass(
  681. "active"
  682. );
  683. for (let i = 0; i < m2DriveSelectedQty; i++) {
  684. $("#config-m2-drive .qty-progress-bars .progress-bar")
  685. .eq(i)
  686. .addClass("active");
  687. }
  688. $("#config-m2-drive .max-qty-wrap")
  689. .find(".selected-qty")
  690. .text(m2DriveSelectedQty);
  691. }
  692. if (m2DriveSelectedQty == m2DriveMaxQty) {
  693. disableM2DriveOptions();
  694. } else {
  695. enableM2DriveOptions();
  696. }
  697. }
  698. function enableM2DriveOptions() {
  699. $(".product-check-btn").prop("disabled", false);
  700. $("#config-m2-drive .qty-selector").prop("disabled", false);
  701. }
  702. function disableM2DriveOptions() {
  703. $(".product-check-btn").not(":checked").prop("disabled", true);
  704. $("#config-m2-drive .config-product-item")
  705. .not(".selected")
  706. .find(".qty-selector")
  707. .prop("disabled", true);
  708. }
  709. //nvme progress-bars active and remove
  710. function nvmeDriveProgress() {
  711. if (nvmeDriveselectedqty <= nvmeDrivemaxqty) {
  712. $("#config-nvme-drive .qty-progress-bars .progress-bar").removeClass(
  713. "active"
  714. );
  715. for (let i = 0; i < nvmeDriveselectedqty; i++) {
  716. $("#config-nvme-drive .qty-progress-bars .progress-bar")
  717. .eq(i)
  718. .addClass("active");
  719. }
  720. $("#config-nvme-drive .max-qty-wrap")
  721. .find(".selected-qty")
  722. .text(nvmeDriveselectedqty);
  723. }
  724. if (nvmeDriveselectedqty == nvmeDrivemaxqty) {
  725. disablenvmeDriveOptions();
  726. } else {
  727. enablenvmeDriveOptions();
  728. }
  729. }
  730. function enablenvmeDriveOptions() {
  731. $(".product-check").prop("disabled", false);
  732. $("#config-nvme-drive .qty-selector").prop("disabled", false);
  733. }
  734. function disablenvmeDriveOptions() {
  735. $(".product-check").not(":checked").prop("disabled", true);
  736. $("#config-nvme-drive .config-product-item")
  737. .not(".selected")
  738. .find(".qty-selector")
  739. .prop("disabled", true);
  740. }
  741. //hard-drive progress-bars active and remove
  742. function hardDriveProgress() {
  743. if (hardDriveSelectedQty <= hardDriveMaxQty) {
  744. $("#config-hard-drive .qty-progress-bars .progress-bar").removeClass(
  745. "active"
  746. );
  747. for (let i = 0; i < hardDriveSelectedQty; i++) {
  748. $("#config-hard-drive .qty-progress-bars .progress-bar")
  749. .eq(i)
  750. .addClass("active");
  751. }
  752. $("#config-hard-drive .max-qty-wrap")
  753. .find(".selected-qty")
  754. .text(hardDriveSelectedQty);
  755. }
  756. if (hardDriveSelectedQty == hardDriveMaxQty) {
  757. disablehardDriveOptions();
  758. } else {
  759. enablehardDriveOptions();
  760. }
  761. }
  762. function enablehardDriveOptions() {
  763. $(".product-hard-btn").prop("disabled", false);
  764. $("#config-hard-drive .qty-selector").prop("disabled", false);
  765. }
  766. function disablehardDriveOptions() {
  767. $(".product-hard-btn").not(":checked").prop("disabled", true);
  768. $("#config-hard-drive .config-product-item")
  769. .not(".selected")
  770. .find(".qty-selector")
  771. .prop("disabled", true);
  772. }
  773. // summary section
  774. function bindSelectedProduct(
  775. cat,
  776. val,
  777. qty,
  778. price,
  779. id,
  780. productCatId = "",
  781. ElementId
  782. ) {
  783. console.log(cat, val, "qty", qty, price, id, productCatId, ElementId);
  784. const summaryProductHtml = `<li class="w-100 my-1 d-flex align-items-center cart-product-item ${cat}-cart-product-${id}" data-accordionid="${ElementId}" data-productcatid='${productCatId}'><span class="summary-total-qty"><span class="qty-span">${qty}</span><i class="fa fa-times"></i></span>
  785. <div class="flex-grow-1 d-flex align-items-center justify-content-between"><span class="summary-product-val mr-2">${val}</span>
  786. <span class="price-wrap d-flex align-items-center"><span class="summary-plus-sign"></span><span class="currency-symbol" id="summary-currency-symbol">&#8377;</span><span class="order-price price-span product-price ml-auto">${price}</span></span>
  787. </div>
  788. </li>`;
  789. console.log(
  790. $(`#${cat}-summary .summary-list`).find(`[data-accordionid=${ElementId}]`)
  791. .length
  792. );
  793. if (
  794. $(`#${cat}-summary .summary-list`).find(`[data-accordionid=${ElementId}]`)
  795. .length
  796. ) {
  797. $(`#${cat}-summary .summary-list`)
  798. .find(`[data-accordionid=${ElementId}]`)
  799. .remove();
  800. }
  801. if (cat == "barebone") {
  802. if (qty) {
  803. $(
  804. `.barebone-cart-product-${id}[data-productcatid = "${productCatId}"]`
  805. ).remove();
  806. $(`#${cat}-summary .summary-list`).append(summaryProductHtml);
  807. } else {
  808. $(
  809. `.barebone-cart-product-${id}[data-productcatid = "${productCatId}"]`
  810. ).remove();
  811. }
  812. }
  813. if (cat == "m2-drive") {
  814. if (qty) {
  815. $(
  816. `.m2-drive-cart-product-${id}[data-productcatid = "${productCatId}`
  817. ).remove();
  818. $(`#${cat}-summary .summary-list`).append(summaryProductHtml);
  819. } else {
  820. $(
  821. `.m2-drive-cart-product-${id}[data-productcatid = "${productCatId}`
  822. ).remove();
  823. }
  824. }
  825. if (cat == "processor") {
  826. if (qty) {
  827. $(`.cart-product-item[data-accordionid = "${ElementId}"]`).remove();
  828. $(`#${cat}-summary .summary-list`).append(summaryProductHtml);
  829. } else {
  830. $(`.cart-product-item[data-accordionid = "${ElementId}"]`).remove();
  831. }
  832. }
  833. if (cat == "nvme-drive") {
  834. if (qty) {
  835. $(`.cart-product-item[data-accordionid = "${ElementId}"]`).remove();
  836. $(`#${cat}-summary .summary-list`).append(summaryProductHtml);
  837. } else {
  838. $(`.cart-product-item[data-accordionid = "${ElementId}"]`).remove();
  839. }
  840. }
  841. if (cat == "hard-drive") {
  842. if (qty) {
  843. $(
  844. `.hard-drive-cart-product-${id}[data-productcatid = "${productCatId}"] `
  845. ).remove();
  846. $(`#${cat}-summary .summary-list`).append(summaryProductHtml);
  847. } else {
  848. $(
  849. `.hard-drive-cart-product-${id}[data-productcatid = "${productCatId}"] `
  850. ).remove();
  851. }
  852. }
  853. if (cat == "memory") {
  854. if (qty) {
  855. $(`.cart-product-item[data-accordionid = "${ElementId}"]`).remove();
  856. $(`#${cat}-summary .summary-list`).append(summaryProductHtml);
  857. } else {
  858. $(`.cart-product-item[data-accordionid = "${ElementId}"]`).remove();
  859. }
  860. }
  861. if ($(`#${cat}-summary .summary-list li`).length) {
  862. console.log("display if");
  863. $(`#${cat}-summary`).removeClass("d-none");
  864. } else {
  865. console.log("display else");
  866. $(`#${cat}-summary`).addClass("d-none");
  867. }
  868. return;
  869. }
  870. // items-count
  871. function updateItemsCount() {
  872. const cartProductCount = $("#productOrderSummary .cart-product-item").length;
  873. $(".summary-head #items-count").text(cartProductCount);
  874. if (cartProductCount >= 1) {
  875. $(".your-order-wrap").show();
  876. $(".your-order-wrap-empty").hide();
  877. } else {
  878. $(".your-order-wrap").hide();
  879. $(".your-order-wrap-empty").show();
  880. }
  881. }
  882. // total-cart-price
  883. function updateTotalCartPrice() {
  884. let totalPrice = 0;
  885. $("#productOrderSummary .cart-product-item")
  886. .find(".price-span")
  887. .each(function (i, e) {
  888. totalPrice += Number($(e).text().trim());
  889. });
  890. $("#productOrderSummary #total-amount").text(totalPrice);
  891. }
  892. //currency-converter for pricings:
  893. var rates = {
  894. INR: {
  895. value: 1,
  896. symbol: "₹",
  897. USD: 0.01289,
  898. INR: 1,
  899. GBP: 0.01041,
  900. EUR: 0.01226,
  901. },
  902. USD: {
  903. value: 75,
  904. symbol: "$",
  905. USD: 1,
  906. INR: 77.5624,
  907. GBP: 0.8074,
  908. EUR: 0.951,
  909. },
  910. GBP: {
  911. value: 100,
  912. symbol: "£",
  913. USD: 1.2384,
  914. INR: 96.0576,
  915. GBP: 1,
  916. EUR: 1.1778,
  917. },
  918. EUR: {
  919. value: 81,
  920. symbol: "€",
  921. USD: 1.051428,
  922. INR: 81.551,
  923. GBP: 0.8489,
  924. EUR: 1,
  925. },
  926. };
  927. //currency-converter rates for configurator:
  928. // var rates = {
  929. // INR: {
  930. // value: 1,
  931. // symbol: "₹",
  932. // USD: 0.01311,
  933. // INR: 1,
  934. // GBP: 0.01,
  935. // },
  936. // USD: {
  937. // value: 75,
  938. // symbol: "$",
  939. // USD: 1,
  940. // INR: 76.32,
  941. // GBP: 0.76,
  942. // },
  943. // GBP: {
  944. // value: 100,
  945. // symbol: "£",
  946. // USD: 1.31,
  947. // INR: 100,
  948. // GBP: 1,
  949. // },
  950. // };
  951. // let usercurency;
  952. // if (localStorage.getItem("currentCurrency")) {
  953. // usercurency = localStorage.getItem("currentCurrency");
  954. // }
  955. //else {
  956. // usercurency = "INR";
  957. // }
  958. // $("#custom-selects").val(usercurency.toLowerCase());
  959. function updatePrices(previousCurrency, currentCurrency) {
  960. $(".product-price").each(function (i, el) {
  961. // console.log(currentCurrency);
  962. let val = parseFloat($(el).text());
  963. let con = val * rates[previousCurrency][currentCurrency],
  964. _con;
  965. if (currentCurrency == "INR") {
  966. _con = Math.round(con);
  967. // _con = con;
  968. } else {
  969. _con = con;
  970. }
  971. let curentSymbol = rates[currentCurrency];
  972. $(el).text(_con.toFixed(2));
  973. $(el).siblings(".currency-symbol").text(curentSymbol.symbol);
  974. });
  975. $("[data-price]").each(function (i, e) {
  976. let val = parseFloat($(this).attr("data-price"));
  977. let con = val * rates[previousCurrency][currentCurrency],
  978. _con;
  979. if (currentCurrency == "INR") {
  980. _con = Math.round(con);
  981. // _con = con;
  982. } else {
  983. _con = con;
  984. }
  985. $(this).attr("data-price", _con);
  986. });
  987. let amount = parseFloat($("#total-amount").text()).toFixed(2);
  988. let curentSymbol = rates[currentCurrency];
  989. let conVal = amount * rates[previousCurrency][currentCurrency],
  990. _con;
  991. if (currentCurrency == "INR") {
  992. _con = Math.round(conVal);
  993. // _con = conVal;
  994. } else {
  995. _con = conVal;
  996. }
  997. $("#total-amount").text(parseFloat(_con).toFixed(2));
  998. $(".currency-symbol").text(curentSymbol.symbol);
  999. }
  1000. $("#custom-selects").on("change", function (e) {
  1001. let previousCurrency = localStorage.getItem("currency");
  1002. localStorage.setItem("currency", e.target.value.toUpperCase());
  1003. updatePrices(previousCurrency, e.target.value.toUpperCase());
  1004. });
  1005. $("#searchTheKey").on("keyup", function () {
  1006. // search functionality
  1007. var value = $(this).val().toString(),
  1008. value = value.toUpperCase();
  1009. $(".product-config-selector")
  1010. .find(".config-content strong")
  1011. .each(function () {
  1012. let reportName = $(this).text();
  1013. if (reportName.toUpperCase().indexOf(value) > -1) {
  1014. $(this).parents(".name-of-config ").css("display", "flex");
  1015. $(this)
  1016. .closest(".name-of-config")
  1017. .each(function () {
  1018. let reportName = $(this).text();
  1019. if (reportName.toUpperCase().indexOf(value) > -1) {
  1020. $(this).parents(".name-of-config").css("display", "flex");
  1021. $("#config-processor").css("display", "block");
  1022. $("#config-barebone").css("display", "block");
  1023. $("#config-memory").css("display", "block");
  1024. $("#config-m2-drive").css("display", "block");
  1025. $("#config-nvme-drive").css("display", "block");
  1026. $("#config-hard-drive").css("display", "block");
  1027. } else {
  1028. $(this).parents(".name-of-config").css("display", "none");
  1029. }
  1030. });
  1031. } else {
  1032. $(this).parents(".name-of-config").css("display", "none");
  1033. }
  1034. });
  1035. if ($("#config-processor").find(".name-of-config:visible").length == 0) {
  1036. $("#config-processor").css("display", "none");
  1037. } else {
  1038. $("#config-processor").css("display", "block");
  1039. $("#config-processor")
  1040. .find(".sub-section")
  1041. .each(function () {
  1042. console.log($(this));
  1043. if ($(this).find(".name-of-config:visible").length == 0) {
  1044. $(this).closest(".accordion").css("display", "none");
  1045. }
  1046. });
  1047. }
  1048. if ($("#config-barebone").find(".name-of-config:visible").length == 0) {
  1049. $("#config-barebone").css("display", "none");
  1050. } else {
  1051. $("#config-barebone").css("display", "block");
  1052. }
  1053. if ($("#config-memory").find(".name-of-config:visible").length == 0) {
  1054. $("#config-memory").css("display", "none");
  1055. } else {
  1056. $("#config-memory").css("display", "block");
  1057. }
  1058. if ($("#config-m2-drive").find(".name-of-config:visible").length == 0) {
  1059. $("#config-m2-drive").css("display", "none");
  1060. } else {
  1061. $("#config-m2-drive").css("display", "block");
  1062. $("#config-m2-drive")
  1063. .find(".sub-section")
  1064. .each(function () {
  1065. console.log($(this));
  1066. if ($(this).find(".name-of-config:visible").length == 0) {
  1067. $(this).closest(".accordion").css("display", "none");
  1068. }
  1069. });
  1070. }
  1071. if ($("#config-nvme-drive").find(".name-of-config:visible").length == 0) {
  1072. $("#config-nvme-drive").css("display", "none");
  1073. } else {
  1074. $("#config-nvme-drive").css("display", "block");
  1075. $("#config-nvme-drive")
  1076. .find(".sub-section")
  1077. .each(function () {
  1078. console.log($(this));
  1079. if ($(this).find(".name-of-config:visible").length == 0) {
  1080. $(this).closest(".accordion").css("display", "none");
  1081. }
  1082. });
  1083. }
  1084. if ($("#config-hard-drive").find(".name-of-config:visible").length == 0) {
  1085. $("#config-hard-drive").css("display", "none");
  1086. } else {
  1087. $("#config-hard-drive").css("display", "block");
  1088. $("#config-hard-drive")
  1089. .find(".sub-section")
  1090. .each(function () {
  1091. console.log($(this));
  1092. if ($(this).find(".name-of-config:visible").length == 0) {
  1093. $(this).closest(".accordion").css("display", "none");
  1094. }
  1095. });
  1096. }
  1097. });
  1098. setTimeout(function () {
  1099. //handling check for barebone processor and memory
  1100. const productRadioBtns = document.querySelectorAll(".product-radio-btn");
  1101. // console.log(productRadioBtns);
  1102. for (let i = 0; i < productRadioBtns.length; i++) {
  1103. productRadioBtns[i].addEventListener("click", function () {
  1104. const checkEl = $(this);
  1105. const ElementId = $(this).parents(".accordion").attr("id");
  1106. const parentEl = checkEl.parents(".config-product-item");
  1107. const productCatId = parentEl.attr("data-productcatid");
  1108. const cat = parentEl.attr("data-cat");
  1109. const qtySelectEl = parentEl.find(".qty-selector");
  1110. const id = parentEl.attr("data-id");
  1111. if ($(this).parents(".accordion").length) {
  1112. $(this)
  1113. .closest(".accordion")
  1114. .find(".config-price-span")
  1115. .removeClass("active");
  1116. $(this).closest(".accordion").find(".qty-selector").val(0);
  1117. }
  1118. if (this.checked) {
  1119. console.log("checked");
  1120. $(this).parents(".name-of-config").find(".qty-selector").val("1");
  1121. $(this)
  1122. .parents(".name-of-config")
  1123. .find(".config-price-span")
  1124. .addClass("active");
  1125. $(this)
  1126. .closest(".accordion")
  1127. .find(".product-radio-btn")
  1128. .prop("checked", false);
  1129. $(this).prop("checked", true);
  1130. }
  1131. const qty = parseInt(qtySelectEl.val());
  1132. const price = parentEl.attr("data-price");
  1133. const totalPrice = qty * parseFloat(price).toFixed(2);
  1134. const val = checkEl.val();
  1135. bindSelectedProduct(cat, val, qty, price, id, productCatId, ElementId);
  1136. updateItemsCount();
  1137. updateTotalCartPrice();
  1138. });
  1139. }
  1140. //handling check for m2-drive
  1141. const productCheckBtns = document.querySelectorAll(".product-check-btn");
  1142. for (let i = 0; i < productCheckBtns.length; i++) {
  1143. productCheckBtns[i].addEventListener("click", function () {
  1144. const checkEl = $(this);
  1145. const ElementId = $(this).parents(".accordion").attr("id");
  1146. const parentEl = checkEl.parents(".config-product-item");
  1147. const val = checkEl.val();
  1148. const productCatId = parentEl.attr("data-productcatid");
  1149. const cat = parentEl.attr("data-cat");
  1150. const qtySelectEl = parentEl.find(".qty-selector");
  1151. const price = parentEl.attr("data-price");
  1152. const id = parentEl.attr("data-id");
  1153. if ($(this).parents(".accordion").length) {
  1154. $(this)
  1155. .closest(".accordion")
  1156. .find(".config-price-span")
  1157. .removeClass("active");
  1158. $(this).closest(".accordion").find(".qty-selector").val(0);
  1159. $(this)
  1160. .closest(".accordion")
  1161. .find(".config-product-item")
  1162. .removeClass("selected");
  1163. }
  1164. if (this.checked) {
  1165. // console.log('checked')
  1166. $(this).parents(".name-of-config").find(".qty-selector").val("1");
  1167. $(this)
  1168. .parents(".name-of-config")
  1169. .find(".config-price-span")
  1170. .addClass("active");
  1171. $(this)
  1172. .closest(".accordion")
  1173. .find(".product-check-btn")
  1174. .prop("checked", false);
  1175. $(this).prop("checked", true);
  1176. parentEl.addClass("selected");
  1177. } else {
  1178. parentEl.removeClass("selected");
  1179. }
  1180. const qty = parseInt(qtySelectEl.val());
  1181. const totalPrice = qty * parseFloat(price).toFixed(2);
  1182. let selectedQty = 0;
  1183. parentEl
  1184. .closest(".config-content")
  1185. .find(".qty-selector")
  1186. .each(function () {
  1187. selectedQty = selectedQty + +$(this).val();
  1188. });
  1189. m2DriveSelectedQty = selectedQty;
  1190. if (m2DriveSelectedQty > m2DriveMaxQty) {
  1191. return false;
  1192. } else {
  1193. bindSelectedProduct(
  1194. cat,
  1195. val,
  1196. qty,
  1197. parseFloat(totalPrice).toFixed(2),
  1198. id,
  1199. productCatId,
  1200. ElementId
  1201. );
  1202. updateItemsCount();
  1203. updateTotalCartPrice();
  1204. m2DriveProgress();
  1205. }
  1206. });
  1207. }
  1208. //handling check for nvme-drive
  1209. const productCheckBtns1 = document.querySelectorAll(".product-check");
  1210. for (let i = 0; i < productCheckBtns1.length; i++) {
  1211. productCheckBtns1[i].addEventListener("click", function () {
  1212. const checkEl = $(this);
  1213. const ElementId = $(this).parents(".accordion").attr("id");
  1214. const parentEl = checkEl.parents(".config-product-item");
  1215. const val = checkEl.val();
  1216. const productCatId = parentEl.attr("data-productcatid");
  1217. const cat = parentEl.attr("data-cat");
  1218. const qtySelectEl = parentEl.find(".qty-selector");
  1219. const price = parentEl.attr("data-price");
  1220. const id = parentEl.attr("data-id");
  1221. if ($(this).parents(".accordion").length) {
  1222. $(this)
  1223. .closest(".accordion")
  1224. .find(".config-price-span")
  1225. .removeClass("active");
  1226. $(this).closest(".accordion").find(".qty-selector").val(0);
  1227. $(this)
  1228. .closest(".accordion")
  1229. .find(".config-product-item")
  1230. .removeClass("selected");
  1231. }
  1232. if (this.checked) {
  1233. $(this).parents(".name-of-config").find(".qty-selector").val("1");
  1234. $(this)
  1235. .parents(".name-of-config")
  1236. .find(".config-price-span")
  1237. .addClass("active");
  1238. $(this)
  1239. .closest(".accordion")
  1240. .find(".product-check")
  1241. .prop("checked", false);
  1242. $(this).prop("checked", true);
  1243. parentEl.addClass("selected");
  1244. } else {
  1245. parentEl.removeClass("selected");
  1246. }
  1247. const qty = parseInt(qtySelectEl.val());
  1248. const totalPrice = qty * parseFloat(price).toFixed(2);
  1249. let selectedQty = 0;
  1250. parentEl
  1251. .closest(".config-content")
  1252. .find(".qty-selector")
  1253. .each(function () {
  1254. selectedQty = selectedQty + +$(this).val();
  1255. });
  1256. nvmeDriveselectedqty = selectedQty;
  1257. if (nvmeDriveselectedqty > nvmeDrivemaxqty) {
  1258. return false;
  1259. } else {
  1260. bindSelectedProduct(
  1261. cat,
  1262. val,
  1263. qty,
  1264. parseFloat(totalPrice).toFixed(2),
  1265. id,
  1266. productCatId,
  1267. ElementId
  1268. );
  1269. updateItemsCount();
  1270. updateTotalCartPrice();
  1271. nvmeDriveProgress()();
  1272. }
  1273. });
  1274. }
  1275. //handling check for hard-drive
  1276. const productHardBtns = document.querySelectorAll(".product-hard-btn");
  1277. for (let i = 0; i < productHardBtns.length; i++) {
  1278. productHardBtns[i].addEventListener("click", function () {
  1279. const checkEl = $(this);
  1280. const ElementId = $(this).parents(".accordion").attr("id");
  1281. const parentEl = checkEl.parents(".config-product-item");
  1282. const val = checkEl.val();
  1283. const productCatId = parentEl.attr("data-productcatid");
  1284. const cat = parentEl.attr("data-cat");
  1285. const qtySelectEl = parentEl.find(".qty-selector");
  1286. const price = parentEl.attr("data-price");
  1287. const id = parentEl.attr("data-id");
  1288. if ($(this).parents(".accordion").length) {
  1289. $(this)
  1290. .closest(".accordion")
  1291. .find(".config-price-span")
  1292. .removeClass("active");
  1293. $(this).closest(".accordion").find(".qty-selector").val(0);
  1294. $(this)
  1295. .closest(".accordion")
  1296. .find(".config-product-item")
  1297. .removeClass("selected");
  1298. }
  1299. if (this.checked) {
  1300. $(this).parents(".name-of-config").find(".qty-selector").val("1");
  1301. $(this)
  1302. .parents(".name-of-config")
  1303. .find(".config-price-span")
  1304. .addClass("active");
  1305. $(this)
  1306. .closest(".accordion")
  1307. .find(".product-hard-btn")
  1308. .prop("checked", false);
  1309. $(this).prop("checked", true);
  1310. parentEl.addClass("selected");
  1311. } else {
  1312. parentEl.removeClass("selected");
  1313. }
  1314. const qty = parseInt(qtySelectEl.val());
  1315. const totalPrice = qty * parseFloat(price).toFixed(2);
  1316. let selectedQty = 0;
  1317. parentEl
  1318. .closest(".config-content")
  1319. .find(".qty-selector")
  1320. .each(function () {
  1321. selectedQty = selectedQty + +$(this).val();
  1322. });
  1323. hardDriveSelectedQty = selectedQty;
  1324. if (hardDriveSelectedQty > hardDriveMaxQty) {
  1325. return false;
  1326. } else {
  1327. bindSelectedProduct(
  1328. cat,
  1329. val,
  1330. qty,
  1331. parseFloat(totalPrice).toFixed(2),
  1332. id,
  1333. productCatId,
  1334. ElementId
  1335. );
  1336. updateItemsCount();
  1337. updateTotalCartPrice();
  1338. hardDriveProgress();
  1339. }
  1340. });
  1341. }
  1342. //qunatity selector handlers
  1343. const qtySelectors = document.querySelectorAll(".qty-selector");
  1344. for (let i = 0; i < qtySelectors.length; i++) {
  1345. qtySelectors[i].addEventListener("change", function () {
  1346. const selectEl = $(this);
  1347. const accordionId = $(this).parents(".accordion").attr("id");
  1348. const parentEl = selectEl.parents(".config-product-item");
  1349. let val = parseInt(selectEl.val());
  1350. const lastSelectedVal = parseInt(selectEl.attr("data-lastval"));
  1351. // const price = val * parseFloat(parentEl.attr('data-price')).toFixed(2);
  1352. const cat = parentEl.attr("data-cat");
  1353. const id = parentEl.attr("data-id");
  1354. const productCatId = parentEl.attr("data-productcatid");
  1355. const qtySelectEl = parentEl.find(".qty-selector");
  1356. // const qty = parseInt(qtySelectEl.val());
  1357. $(this)
  1358. .closest(".accordion")
  1359. .find(".config-price-span")
  1360. .removeClass("active");
  1361. $(this).closest(".accordion").find(".qty-selector").val(0);
  1362. if (val) {
  1363. parentEl.find(".qty-selector").val(val);
  1364. parentEl.find(".config-price-span").addClass("active");
  1365. $(this)
  1366. .closest(".accordion")
  1367. .find(".form-check-input")
  1368. .prop("checked", false);
  1369. parentEl.find(".form-check-input").prop("checked", true);
  1370. } else {
  1371. $(this).val(0);
  1372. parentEl.find(".config-price-span").removeClass("active");
  1373. parentEl.find(".form-check-input").prop("checked", false);
  1374. parentEl.removeClass("selected");
  1375. }
  1376. let selectedQty = 0;
  1377. parentEl
  1378. .closest(".config-content")
  1379. .find(".qty-selector")
  1380. .each(function () {
  1381. selectedQty = selectedQty + +$(this).val();
  1382. });
  1383. $(this)
  1384. .closest(".accordion")
  1385. .find(".config-product-item")
  1386. .removeClass("selected");
  1387. const qty = parseInt(qtySelectEl.val());
  1388. const price = parentEl.attr("data-price");
  1389. const totalPrice = qty * parseFloat(price).toFixed(2);
  1390. // const val = checkEl.val();
  1391. parentEl.addClass("selected");
  1392. bindSelectedProduct(
  1393. cat,
  1394. parentEl.find(".form-check-input").val(),
  1395. qty,
  1396. parseFloat(totalPrice).toFixed(2),
  1397. id,
  1398. productCatId,
  1399. accordionId
  1400. );
  1401. updateItemsCount();
  1402. updateTotalCartPrice();
  1403. //handling m2-drive
  1404. if (cat == "m2-drive") {
  1405. if (m2DriveMaxQty >= selectedQty) {
  1406. m2DriveSelectedQty = selectedQty;
  1407. selectEl.attr("data-lastval", val);
  1408. m2DriveProgress();
  1409. parentEl.find(".product-price").text(parseFloat(price).toFixed(2));
  1410. const selecedSummaryProduct = $(
  1411. `.${cat}-cart-product-${id}[data-accordionid="${accordionId}"]`
  1412. );
  1413. selecedSummaryProduct.find(".summary-total-qty .qty-span").text(val);
  1414. selecedSummaryProduct
  1415. .find(".product-price")
  1416. .text(parseFloat(price).toFixed(2));
  1417. updateTotalCartPrice();
  1418. } else {
  1419. //alert('Limit Reached Please Select 4 Only ');
  1420. // m2DriveSelectedQty = m2DriveSelectedQty - lastSelectedVal;
  1421. $('[data-bs-target="#alert-modal"]').click();
  1422. // selectEl.val(lastSelectedVal);
  1423. parentEl.find("input").prop("checked", false);
  1424. parentEl.find(".qty-selector").val(0);
  1425. parentEl.find(".config-price-span").removeClass("active");
  1426. let selectedQty = 0;
  1427. parentEl
  1428. .closest(".config-content")
  1429. .find(".qty-selector")
  1430. .each(function () {
  1431. selectedQty = selectedQty + +$(this).val();
  1432. m2DriveSelectedQty = selectedQty;
  1433. });
  1434. m2DriveProgress();
  1435. return false;
  1436. }
  1437. } else {
  1438. parentEl.find(".product-price").text(parseFloat(price).toFixed(2));
  1439. const selecedSummaryProduct = $(
  1440. `.${cat}-cart-product-${id}[data-accordionid="${accordionId}"]`
  1441. );
  1442. selecedSummaryProduct.find(".summary-total-qty .qty-span").text(val);
  1443. selecedSummaryProduct
  1444. .find(".product-price")
  1445. .text(parseFloat(price).toFixed(2));
  1446. updateTotalCartPrice();
  1447. }
  1448. //mvme-drive
  1449. if (cat == "nvme-drive") {
  1450. if (nvmeDrivemaxqty >= selectedQty) {
  1451. nvmeDriveselectedqty = selectedQty;
  1452. selectEl.attr("data-lastval", val);
  1453. nvmeDriveProgress();
  1454. parentEl.find(".product-price").text(parseFloat(price).toFixed(2));
  1455. const selecedSummaryProduct = $(
  1456. `.${cat}-cart-product-${id}[data-accordionid="${accordionId}"]`
  1457. );
  1458. selecedSummaryProduct.find(".summary-total-qty .qty-span").text(val);
  1459. selecedSummaryProduct
  1460. .find(".product-price")
  1461. .text(parseFloat(price).toFixed(2));
  1462. updateTotalCartPrice();
  1463. } else {
  1464. //alert('Limit Reached Please Select 4 Only ');
  1465. nvmeDriveselectedqty = nvmeDriveselectedqty - lastSelectedVal;
  1466. $('[data-bs-target="#alert-modal"]').click();
  1467. selectEl.val(lastSelectedVal);
  1468. parentEl.find("input").trigger("click");
  1469. return false;
  1470. }
  1471. } else {
  1472. parentEl.find(".product-price").text(parseFloat(price).toFixed(2));
  1473. const selecedSummaryProduct = $(
  1474. `.${cat}-cart-product-${id}[data-accordionid="${accordionId}"]`
  1475. );
  1476. selecedSummaryProduct.find(".summary-total-qty .qty-span").text(val);
  1477. selecedSummaryProduct
  1478. .find(".product-price")
  1479. .text(parseFloat(price).toFixed(2));
  1480. updateTotalCartPrice();
  1481. }
  1482. //hard-drive
  1483. if (cat == "hard-drive") {
  1484. if (hardDriveMaxQty >= selectedQty) {
  1485. hardDriveSelectedQty = selectedQty;
  1486. selectEl.attr("data-lastval", val);
  1487. hardDriveProgress();
  1488. parentEl.find(".product-price").text(parseFloat(price).toFixed(2));
  1489. const selecedSummaryProduct = $(
  1490. `.${cat}-cart-product-${id}[data-accordionid="${accordionId}"]`
  1491. );
  1492. selecedSummaryProduct.find(".summary-total-qty .qty-span").text(val);
  1493. selecedSummaryProduct
  1494. .find(".product-price")
  1495. .text(parseFloat(price).toFixed(2));
  1496. updateTotalCartPrice();
  1497. } else {
  1498. //alert('Limit Reached Please Select 4 Only ');
  1499. $('[data-bs-target="#alert-modal-hard"]').click();
  1500. selectEl.val(lastSelectedVal);
  1501. parentEl.find("input").trigger("click");
  1502. return false;
  1503. }
  1504. } else {
  1505. parentEl.find(".product-price").text(parseFloat(price).toFixed(2));
  1506. const selecedSummaryProduct = $(
  1507. `.${cat}-cart-product-${id}[data-accordionid="${accordionId}"]`
  1508. );
  1509. selecedSummaryProduct.find(".summary-total-qty .qty-span").text(val);
  1510. selecedSummaryProduct
  1511. .find(".product-price")
  1512. .text(parseFloat(price).toFixed(2));
  1513. updateTotalCartPrice();
  1514. }
  1515. });
  1516. }
  1517. }, 250);
  1518. // updatePrices(rates[usercurency]);