From 93497123e62a8591b1c94d6b05964d12cee1fb93 Mon Sep 17 00:00:00 2001
From: master1lan <278457198@qq.com>
Date: Sun, 19 Feb 2023 18:03:41 +0800
Subject: [PATCH] =?UTF-8?q?:zap:=20feat(custom):=20=E5=9B=BE=E7=89=87?=
 =?UTF-8?q?=E8=AF=A6=E6=83=85=E6=B7=BB=E5=8A=A0=E8=B7=B3=E8=BD=AC=E5=88=B0?=
 =?UTF-8?q?=E5=8A=A8=E6=80=81=E9=A1=B5=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/routers/photo/item/index.tsx         |  2 +-
 src/routers/photo/item/modal.tsx         | 21 ++++++++++++++++++++-
 src/routers/photo/item/photo.module.less | 11 +++++++++++
 3 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/src/routers/photo/item/index.tsx b/src/routers/photo/item/index.tsx
index d535e40..b507919 100644
--- a/src/routers/photo/item/index.tsx
+++ b/src/routers/photo/item/index.tsx
@@ -15,7 +15,7 @@ export default function PhotoCard(props: CardType) {
   const { images, dynamic_id, ...resPorps } = props.data;
   const [open, set] = useState(false),
     handlerChangeOpen = () => set((open) => !open);
-  const modalPorps = { open, images, onClose: handlerChangeOpen };
+  const modalPorps = { open, images, onClose: handlerChangeOpen, dynamic_id };
   return (
     <div className={style["card"]}>
       <ImageBasic
diff --git a/src/routers/photo/item/modal.tsx b/src/routers/photo/item/modal.tsx
index ac12fef..1c35d7f 100644
--- a/src/routers/photo/item/modal.tsx
+++ b/src/routers/photo/item/modal.tsx
@@ -2,16 +2,20 @@ import { basicImageType } from "../phototype";
 import { PhotoSlider } from "react-photo-view";
 import "react-photo-view/dist/react-photo-view.css";
 import { useEffect } from "react";
+import CallMadeIcon from "@mui/icons-material/CallMade";
+import ShortcutIcon from "@mui/icons-material/Shortcut";
 import { useLocation } from "react-router-dom";
 import { useBodyScrollHide } from "@utils/hooks/match";
+import { Link, styled } from "@mui/material";
 type ModalType = {
   images: basicImageType[];
   open: boolean;
   onClose: () => void;
+  dynamic_id: number | string;
 };
 
 export default function ImgModals(props: ModalType) {
-  const { open, onClose, images } = props;
+  const { open, onClose, images, dynamic_id } = props;
   const location = useLocation();
   useEffect(() => {
     let flag = false;
@@ -36,6 +40,21 @@ export default function ImgModals(props: ModalType) {
       images={images.map((item, index) => ({ src: item.src, key: index }))}
       visible={open}
       onClose={onClose}
+      toolbarRender={() => (
+        <Link
+          href={`https://t.bilibili.com/${dynamic_id}`}
+          target='_blank'
+          underline='hover'
+          sx={{
+            marginRight: "auto",
+            marginLeft: "1rem",
+          }}
+        >
+          <ShortcutIcon fontSize='inherit' />
+          去对应动态
+        </Link>
+      )}
+      // overlayRender={() => <PhotoSliderLink />}
     />
   );
 }
diff --git a/src/routers/photo/item/photo.module.less b/src/routers/photo/item/photo.module.less
index 06a560e..eaddacc 100644
--- a/src/routers/photo/item/photo.module.less
+++ b/src/routers/photo/item/photo.module.less
@@ -5,4 +5,15 @@
     .show-img {
         min-height: 150px;
     }
+}
+
+:global {
+    .PhotoView-Slider__BannerRight {
+        flex: 1;
+        justify-content: end;
+    }
+
+    .PhotoView-Slider__BannerWrap {
+        align-items: baseline;
+    }
 }
\ No newline at end of file