feat: 留言相册效果优化

app/code/Joshine/Review/view/frontend/templates/product/view/list.phtml

@@ -104,9 +104,7 @@ $imagesBlock = $helper->getReviewImagesBlock(15, $block->getProductId());
                         <div class="joshine-review-nickname joshine-font-c-deepin joshine-font-size-default joshine-font-w-bolder ">
                         <div class="joshine-review-nickname joshine-font-c-deepin joshine-font-size-default joshine-font-w-bolder ">
                             <?= $block->escapeHtml($review->getNickname()) ?>
                             <?= $block->escapeHtml($review->getNickname()) ?>
                         </div>
                         </div>
-                        <div class="joshine-review-product">
-
-                        </div>
+                        <input type="hidden" id="modal-current-review-id">
                         <div class="joshine-review-date joshine-font-c-darkgray joshine-font-mini-plus">
                         <div class="joshine-review-date joshine-font-c-darkgray joshine-font-mini-plus">
                             <?= $block->escapeHtml($block->formatDate($review->getCreatedAt(), $format)) ?>
                             <?= $block->escapeHtml($block->formatDate($review->getCreatedAt(), $format)) ?>
                         </div>
                         </div>
@@ -581,6 +579,49 @@ $imagesBlock = $helper->getReviewImagesBlock(15, $block->getProductId());
         var swiper_wrapper = $('.swiper-wrapper');
         var swiper_wrapper = $('.swiper-wrapper');
         var reviewList;
         var reviewList;
 
 
+        function processReview(review) {
+            $('[data-review-js="nickname"]').html(review.nickname);
+            $('[data-review-js="title"]').html(review.title);
+            $('[data-review-js="detail"]').html(review.detail);
+            $('[data-review-js="date"]').html(review.created_at);
+            let fits_text = fitsTranslate(review.size_fits);
+            $('[data-review-js="fits"]').html(fits_text);
+            $('[data-review-js="rating"]').width(review.rating + '%');
+            $('#modal-current-review-id').val(review.review_id);
+        }
+
+        function fitsTranslate(fits) {
+            var fits_words = 'default';
+            if (fits === '1') {
+                fits_words = 'Small';
+            }
+            if (fits === '2') {
+                fits_words = 'Ture Size';
+            }
+            if (fits === '3') {
+                fits_words = 'Large';
+            }
+            return fits_words;
+        }
+
+        function pullIdx(id)
+        {
+            img_idx = findIdxByImgId(id);
+            swiper_wrapper.css({"transform" : 'translateX(' + -536 * img_idx + 'px)'});
+            dealIndex(img_idx);
+        }
+
+        function findIdxByImgId(imgId)
+        {
+            let res = 0;
+            $(".image-thumbs-list-item").each(function (index, ele) {
+                if ($(ele).data('image-id') == imgId) {
+                    res = $(ele).data('img-index');
+                }
+            });
+            return res;
+        }
+        
         $(".joshine-review-pic-item").on('click', function () {
         $(".joshine-review-pic-item").on('click', function () {
             var reviewId  = $(this).data('reviews-id');
             var reviewId  = $(this).data('reviews-id');
             var productId = $(this).data('product-id');
             var productId = $(this).data('product-id');
@@ -644,47 +685,7 @@ $imagesBlock = $helper->getReviewImagesBlock(15, $block->getProductId());
                 $('.image-full-wrapper').html(html);
                 $('.image-full-wrapper').html(html);
             }
             }
 
 
-            function processReview(review) {
-                $('[data-review-js="nickname"]').html(review.nickname);
-                $('[data-review-js="title"]').html(review.title);
-                $('[data-review-js="detail"]').html(review.detail);
-                $('[data-review-js="date"]').html(review.created_at);
-                let fits_text = fitsTranslate(review.size_fits);
-                $('[data-review-js="fits"]').html(fits_text);
-                $('[data-review-js="rating"]').width(review.rating + '%');
-            }
-
-            function fitsTranslate(fits) {
-                var fits_words = 'default';
-                if (fits === '1') {
-                    fits_words = 'Small';
-                }
-                if (fits === '2') {
-                    fits_words = 'Ture Size';
-                }
-                if (fits === '3') {
-                    fits_words = 'Large';
-                }
-                return fits_words;
-            }
 
 
-            function pullIdx(id)
-            {
-                img_idx = findIdxByImgId(id);
-                swiper_wrapper.css({"transform" : 'translateX(' + -536 * img_idx + 'px)'});
-                dealIndex(img_idx);
-            }
-            
-            function findIdxByImgId(imgId)
-            {
-                let res = 0;
-                $(".image-thumbs-list-item").each(function (index, ele) {
-                    if ($(ele).data('image-id') == imgId) {
-                        res = $(ele).data('img-index');
-                    }
-                });
-                return res;
-            }
         });
         });
 
 
         $(".joshine-close").on('click', function () {
         $(".joshine-close").on('click', function () {
@@ -712,7 +713,7 @@ $imagesBlock = $helper->getReviewImagesBlock(15, $block->getProductId());
             // 开锁，动画结束之后开锁
             // 开锁，动画结束之后开锁
 
 
             dealIndex(img_idx);
             dealIndex(img_idx);
-
+            processReviewDetail(img_idx);
             setTimeout(function () {
             setTimeout(function () {
                 lock = true;
                 lock = true;
             }, 500);
             }, 500);
@@ -731,14 +732,38 @@ $imagesBlock = $helper->getReviewImagesBlock(15, $block->getProductId());
             img_idx--;
             img_idx--;
             swiper_wrapper.css({"transform" : 'translateX(' + -536 * img_idx  + 'px)'});
             swiper_wrapper.css({"transform" : 'translateX(' + -536 * img_idx  + 'px)'});
             dealIndex(img_idx);
             dealIndex(img_idx);
+            processReviewDetail(img_idx);
             setTimeout(function () {
             setTimeout(function () {
                 lock = true;
                 lock = true;
             }, 500);
             }, 500);
         });
         });
 
 
-        function getReviewInfo(reviewId)
+        function processReviewDetail(img_idx)
         {
         {
+            var shouldReviewId;
+            $(".image-thumbs-list-item").each(function (index, ele) {
+                if ($(ele).data('img-index') == img_idx) {
+                    shouldReviewId = $(ele).data('review-id');
+                }
+            });
+            let curReviewId = $('#modal-current-review-id').val();
 
 
+            if (shouldReviewId != curReviewId) {
+                let review = findReviewById(shouldReviewId);
+                processReview(review);
+            }
+        }
+
+        function findReviewById(reviewId)
+        {
+            let review = '';
+            for(let i = 0; i < reviewList.length; i++) {
+                if (reviewList[i].review_id == reviewId) {
+                    review = reviewList[i];
+                    break;
+                }
+            }
+            return review;
         }
         }
 
 
     });
     });