From e568325a419830f6a4cc214bfaddb29c183c104f Mon Sep 17 00:00:00 2001
From: al <al@cdhncy.com>
Date: Wed, 7 Aug 2024 20:46:16 +0800
Subject: [PATCH] =?UTF-8?q?=E6=94=B9=E5=96=84=E8=AF=B7=E6=B1=82=E6=AC=A1?=
 =?UTF-8?q?=E6=95=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/page.js                  |   1 -
 components/Photos/index.js   | 102 +++++++++++++++++------------------
 components/PostItem/index.js |   2 +-
 3 files changed, 52 insertions(+), 53 deletions(-)

diff --git a/app/page.js b/app/page.js
index 2c0850e..2296711 100644
--- a/app/page.js
+++ b/app/page.js
@@ -139,7 +139,6 @@ const RecommPostList = forwardRef(({ scrollHeight }, ref) => {
     setHasMore(true);
   }
   async function loadMore() {
-    debugger;
     const list = await getRecommPostList(!commenPostList.length?2:0);
     if (list.length == 0) {
       setHasMore(false);
diff --git a/components/Photos/index.js b/components/Photos/index.js
index d1c6cf3..1e644e3 100644
--- a/components/Photos/index.js
+++ b/components/Photos/index.js
@@ -8,7 +8,7 @@ import { useRouter } from "next/navigation";
 import baseRequest from "@/utils/baseRequest";
 import { handleShowVideo } from "@/utils/tools/handleFuns";
 // import dynamic from 'next/dynamic'
-import ImagesMask from "@/components/ImagesMask";
+// import ImagesMask from "@/components/ImagesMask";
 // const ImagesMask = dynamic(() =>
 // import('@/components/ImagesMask'), { ssr: false }
 // )
@@ -113,59 +113,59 @@ export default function Photos({
     // });
     // btns.append(btnL, btnR);
     // handleShowImages(index, photos, btns,interval);
-    // handleShowImages(index, photos, interval);
+    handleShowImages(index, photos, interval);
 
     // setVisible(true)
-    console.log(imagesMaskRef.current);
-    imagesMaskRef.current.show(
-      photos.map((item) => item?.url),
-      index
-    );
+    // console.log(imagesMaskRef.current);
+    // imagesMaskRef.current.show(
+    //   photos.map((item) => item?.url),
+    //   index
+    // );
   };
-  // const handleShowImages = (index, photos, interval) => {
-  //   const mediaDom = document.createElement("div");
-  //   mediaDom.style.width = "100vw";
-  //   document.body.appendChild(mediaDom);
-  //   mediaDom.className = `${
-  //     photos[index]?.type == "hid" ? "mediaDom photos-body" : "mediaDom"
-  //   }`;
-  //   // mediaDom.appendChild(btns);
-  //   ImageViewer.clear();
-  //   ImageViewer.Multi.show({
-  //     images: photos.map((item) => item?.url),
-  //     defaultIndex: index,
-  //     renderFooter: (image, index) => {
-  //       return renderFooter(photos[index]?.type == "hid", mediaDom);
-  //     },
+  const handleShowImages = (index, photos, interval) => {
+    const mediaDom = document.createElement("div");
+    mediaDom.style.width = "100vw";
+    document.body.appendChild(mediaDom);
+    mediaDom.className = `${
+      photos[index]?.type == "hid" ? "mediaDom photos-body" : "mediaDom"
+    }`;
+    // mediaDom.appendChild(btns);
+    ImageViewer.clear();
+    ImageViewer.Multi.show({
+      images: photos.map((item) => item?.url),
+      defaultIndex: index,
+      renderFooter: (image, index) => {
+        return renderFooter(photos[index]?.type == "hid", mediaDom);
+      },
 
-  //     getContainer: mediaDom,
-  //     onIndexChange: (index) => {
-  //       currentIndex.current = index;
-  //       mediaDom.className = `${
-  //         photos[index]?.type == "hid" ? "mediaDom photos-body" : "mediaDom"
-  //       }`;
-  //       const leftBtn = document.getElementsByClassName("imagesBtnsControllerLeft")[0]
-  //       const rightBtn = document.getElementsByClassName("imagesBtnsControllerRight")[0]
-  //       if(leftBtn && rightBtn){
-  //         if(!index){
-  //           leftBtn.style.opacity=0.5
-  //           rightBtn.style.opacity=1
-  //         }else if(index==currentPhotos.length-1){
-  //           leftBtn.style.opacity=1
-  //           rightBtn.style.opacity=0.5
-  //         }else{
-  //           leftBtn.style.opacity=1
-  //           rightBtn.style.opacity=1
-  //         }
-  //       }
-  //     },
-  //     afterClose: () => {
-  //       mediaDom.remove();
-  //       clearInterval(interval);
-  //     },
-  //     classNames: { body: "photos-bodyBox" },
-  //   });
-  // };
+      getContainer: mediaDom,
+      onIndexChange: (index) => {
+        currentIndex.current = index;
+        mediaDom.className = `${
+          photos[index]?.type == "hid" ? "mediaDom photos-body" : "mediaDom"
+        }`;
+        const leftBtn = document.getElementsByClassName("imagesBtnsControllerLeft")[0]
+        const rightBtn = document.getElementsByClassName("imagesBtnsControllerRight")[0]
+        if(leftBtn && rightBtn){
+          if(!index){
+            leftBtn.style.opacity=0.5
+            rightBtn.style.opacity=1
+          }else if(index==currentPhotos.length-1){
+            leftBtn.style.opacity=1
+            rightBtn.style.opacity=0.5
+          }else{
+            leftBtn.style.opacity=1
+            rightBtn.style.opacity=1
+          }
+        }
+      },
+      afterClose: () => {
+        mediaDom.remove();
+        clearInterval(interval);
+      },
+      classNames: { body: "photos-bodyBox" },
+    });
+  };
   const handleSeeAllPhotos = (e) => {
     e.stopPropagation();
     e.preventDefault();
@@ -304,7 +304,7 @@ export default function Photos({
           );
         })}
       </div>
-      <ImagesMask ref={imagesMaskRef} />
+      {/* <ImagesMask ref={imagesMaskRef} /> */}
       {/* <Viewer
       visible={visible}
       onClose={() => { setVisible(false); } }
diff --git a/components/PostItem/index.js b/components/PostItem/index.js
index 54450e4..499d2d5 100644
--- a/components/PostItem/index.js
+++ b/components/PostItem/index.js
@@ -163,7 +163,7 @@ export default function PostItem({
                 </div>
               )}
           </div>
-          <div className="mr-8 min-h-24 bg-[#ffffff1a] rounded-md">
+          <div className="mr-8 min-h-24 rounded-md">
             {data.media_component && (
               <Photos
                 data={data}