处理图片比例

components/Photos/index.js

@@ -35,13 +35,17 @@ export default function Photos({
       let imgArr = media.images.map((item) => ({
         type: "img",
         url: item.urls?.[0],
-        fullwidth:item.w>item.h
+        // fullwidth:item.w>item.h，
+        w:item.w,
+        h:item.h,
       }));
       let videoArr = media.videos.map((item) => ({
         type: "video",
         url: item.cover_urls?.[0],
         mp4: item.urls?.[0],
-        fullwidth:item.cover_w>item.cover_h
+        w:item.cover_w,
+        h:item.cover_h,
+        // fullwidth:item.cover_w>item.cover_h
       }));
       let arr = [...imgArr, ...videoArr];
       let newPhotos = [...arr];
@@ -217,8 +221,8 @@ export default function Photos({
         {currentPhotos.map((item, index) => {
           return (
             <div
-              className={`relative w-max ${currentPhotos.length > 1 ? "h-[24vw]" : ""} `}
-              style={{ maxWidth: "calc(100vw - 72px)" }}
+              className={`relative`}
+              // style={{ width:  }}
               key={index}
               onClick={() => {
                 if (item?.type == "video") {
@@ -242,8 +246,8 @@ export default function Photos({
             >
               {
                 <div
-                  className={`overflow-hidden inline-block rounded h-full max-h-80 ${
-                    currentPhotos.length > 1 ? "h-[24vw]" : "auto"
+                  className={`overflow-hidden rounded h-full ${
+                    currentPhotos.length > 1 ? "h-[24vw]" : ""
                   }`}
                 >
                   <Image
@@ -251,8 +255,8 @@ export default function Photos({
                     placeholder={
                       <div className="w-full min-h-[24vw] bg-[#1d1d1d] rounded"></div>
                     }
-                    width={currentPhotos.length > 1 ? "24vw" : item.fullwidth?"100%":"46vw"}
-                    height={currentPhotos.length > 1 ? "24vw" : "100%"}
+                    width={currentPhotos.length > 1 ? "24vw" : item.w>item.h?`calc(100vw - 72px  - 2rem)`:`calc(46vw * ${item.w/item.h})`}
+                    height={currentPhotos.length > 1 ? "24vw" : item.w>item.h? `calc((100vw - 72px  - 2rem) * ${item.h/item.w})`:"46vw"}
                     className={`rounded max-w-full ${
                       item?.type == "hid" && type == "space" ? "imageBlur" : ""
                     }`}

components/PostItem/index.js

@@ -78,7 +78,6 @@ export default function PostItem({
           src={process.env.NEXT_PUBLIC_WEB_ASSETS_URL + "/images/top_post.png"}
           width={76}
           className="mb-2"
-          
         />
       )}
       <div className="flex">
@@ -113,13 +112,14 @@ export default function PostItem({
           )}
           {data?.status === 3 && (
             <p className="py-1 px-2 inline-block bg-[#F53030] rounded">
-              <span className="text-white text-sm">审核未通过，请前往APP编辑。</span>
+              <span className="text-white text-sm">
+                审核未通过，请前往APP编辑。
+              </span>
             </p>
           )}
           <div>
             {!data?.is_zone_moment_unlocked ? (
-              <span>
-                <div
+              <span
                 dangerouslySetInnerHTML={{
                   __html: findLinksInText(data.text),
                 }}
@@ -129,12 +129,10 @@ export default function PostItem({
                 // style={{
                 //   WebkitLineClamp: data?.text_visible_range < 999?data?.text_visible_range:7,
                 // }}
-                ></div>
-              </span>
+              ></span>
             ) : (
               <div>
-                <span>
-                  <div
+                <span
                   className={`mb-2 mt-2 whitespace-pre-wrap ${
                     !isOpenText ? "text-ellipsis-7" : ""
                   } ${inter.className}`}
@@ -147,8 +145,7 @@ export default function PostItem({
                         ? data?.text_visible_range
                         : 7,
                   }}
-                  ></div>
-                </span>
+                ></span>
               </div>
             )}
             {!(
@@ -219,7 +216,8 @@ export default function PostItem({
                               "天前"
                         }有更新`}
                         空间 */}
-                    空间{formatZoneUpdateTime(
+                      空间
+                      {formatZoneUpdateTime(
                         data?.streamer_ext
                           ?.days_elapsed_since_the_last_zones_update
                       )}