暫無描述
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.

index.js 5.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178
  1. function indexInit(){
  2. function init(){
  3. initData();
  4. }
  5. async function initData(){
  6. const ids = await getProductIdService();
  7. if(!ids) return;
  8. let dataAcc = [];
  9. for(let i=0;i<ids.length;i++){
  10. let currId = ids[i];
  11. let {productid} = currId;
  12. let resData =await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/itemtagscombination/productid/${productid}`,true);
  13. if(resData.isError){
  14. alert(resData.errorMsg.message);
  15. return;
  16. }
  17. let res = resData.response;
  18. res = JSON.parse(res.result);
  19. dataAcc = [...dataAcc,...res.slice(0, 4)];
  20. }
  21. shuffleArray(dataAcc);
  22. console.log(dataAcc);
  23. let html = '';
  24. for(let i=0;i<dataAcc.length;i++){
  25. html += getCardHTML({...dataAcc[i],img:dataAcc[i].itemimageurl})
  26. }
  27. $('.slider-hero').html(html);
  28. console.log(ids);
  29. initSlider();
  30. $('.topproductbtn').click(function (e){
  31. let productid = $(e.target).data('productid');
  32. let itemid = $(e.target).data('itemid');
  33. let name = $(e.target).data('name');
  34. debugger;
  35. window.location.href = `/productdetails.html?productId=${productid}#itemid=${itemid}`;
  36. });
  37. }
  38. function initSlider(){
  39. $('.slider-hero').slick({
  40. dots: false,
  41. lazyLoad: 'ondemand',
  42. // autoplay: true,
  43. // autoplaySpeed: 1000,
  44. slidesToShow: 4,
  45. slidesToScroll: 1,
  46. responsive: [
  47. {
  48. breakpoint: 1024,
  49. settings: {
  50. slidesToShow: 3,
  51. slidesToScroll: 3,
  52. infinite: true,
  53. }
  54. },
  55. {
  56. breakpoint: 600,
  57. settings: {
  58. slidesToShow: 2,
  59. slidesToScroll: 2
  60. }
  61. },
  62. {
  63. breakpoint: 480,
  64. settings: {
  65. slidesToShow: 1,
  66. slidesToScroll: 1
  67. }
  68. },
  69. {
  70. breakpoint: 1199,
  71. settings: {
  72. slidesToShow: 5,
  73. slidesToScroll: 1,
  74. }
  75. },
  76. {
  77. breakpoint: 991,
  78. settings: {
  79. slidesToShow: 3,
  80. slidesToScroll: 1,
  81. }
  82. },
  83. {
  84. breakpoint: 767,
  85. settings: {
  86. slidesToShow: 3,
  87. slidesToScroll: 1,
  88. }
  89. },
  90. {
  91. breakpoint: 575,
  92. settings: {
  93. autoplay: true,
  94. slidesToShow: 3,
  95. }
  96. }
  97. // You can unslick at a given breakpoint now by adding:
  98. // settings: "unslick"
  99. // instead of a settings object
  100. ]
  101. });
  102. $(".slick-prev").addClass("btn text-white");
  103. $(".slick-next").addClass("btn text-white");
  104. $(".slick-prev").html("←");
  105. $(".slick-next").html("→")
  106. }
  107. function getCardHTML({itemname,img,sku,itemid,productid}){
  108. let defaultImg = img ? imgServerNameBuild(img): `./dist/assets/imgs/nophoto.png`;
  109. return ` <div class="card h-100 mx-1 text-center bg-gray-4 border-0">
  110. <div class="card-body h-100">
  111. <div class="d-flex flex-column h-100 justify-content-between">
  112. <img src="${defaultImg}" class="w-100"/>
  113. <p class="mb-0 fs-7 py-2">${itemname}</p>
  114. <p class="fw-600 text-primary mb-0 topproductbtn" data-name="${itemname}" data-sku="${sku}" data-productid="${productid}" data-itemid="${itemid}">Buy Now</p>
  115. </div>
  116. </div>
  117. </div>`;
  118. return ` <div class="card h-100 mx-1 text-center bg-gray-4 border-0 top_sell">
  119. <div class="card-body">
  120. <img src="${defaultImg}" class="w-100"/>
  121. <p class="mb-0 fs-7 py-2">${itemname}</p>
  122. <p class="fw-600 text-primary mb-0" data-sku="${sku}" data-productid="${productid}" data-itemid="${itemid}">Buy Now</p>
  123. </div>
  124. </div>`;
  125. }
  126. function getProductIdService(){
  127. return new Promise(async (reslove,reject)=>{
  128. let resData =await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/getallproducts`,true);
  129. if(resData.isError){
  130. alert(resData.errorMsg.message);
  131. return;
  132. }
  133. let res = resData.response;
  134. res = JSON.parse(res.result);
  135. let resultItem = [];
  136. for(let i=0;i<res.length;i++){
  137. if(resultItem.length == 2) break;
  138. if(res[i].productname.includes('RAM ORA')||res[i].productname.includes('SSD ORA')){
  139. resultItem.push(res[i]);
  140. }
  141. }
  142. return reslove(resultItem)
  143. });
  144. }
  145. init();
  146. }
  147. indexInit();