改-设备租赁-图片缩放自适应

改-设备租赁-详情-图片缩放自适应
改-作业服务-图片缩放自适应

pages/equipmentLeasing/detail/[id].page.tsx

@@ -8,6 +8,7 @@ import Image from 'next/image';
 import errImg from "~/assets/errImg";
 import api,{GetWebDeviceDetailResult,GetWebDeviceWareSkuById} from './api';
 import { UserContext } from "~/lib/userProvider";
+import flowPat from './assets/flow-path.png'
 
 const { CheckableTag } = Tag
 
@@ -176,7 +177,7 @@ export default function EquipmentLeasingDetail() {
           </div>
         </div>
         <div className='flow-path'>
-              <Image className='image' src={require("./assets/flow-path.png")} alt="" />
+              <Image className='image' fill src={flowPat.src} alt="" />
         </div>
         <div className='prompt'>
           更多租金规则请前往【云享飞】微信小程序查

pages/equipmentLeasing/detail/styled.tsx

@@ -120,6 +120,7 @@ export const Box = styled.div`
         height: 192px;
         text-align: center;
         margin-top: 72px;
+        position: relative;
         .image{
             margin: 0 auto;
         }

pages/equipmentLeasing/index.page.tsx

@@ -59,7 +59,7 @@ export default function EquipmentLeasing(props: Props) {
   const rightDom = (item: Advertisement) => {
     return (
       <div key={item.id} className="right-box-item right-item">
-        <Image src={item.imageUrl} alt="error" width={180} height={295} />
+        <Image src={item.imageUrl} alt="error" fill />
       </div>
     );
   };

pages/equipmentLeasing/styled.tsx

@@ -71,6 +71,7 @@ export const Box = styled.div`
     background: #d8d8d8;
     border-radius: 6px;
     overflow: hidden;
+    position: relative;
   }
   .pagination-page {
     text-align: right;

pages/jobServices/detail/[id].page.tsx

@@ -23,9 +23,9 @@ export default function JobServicesDetail() {
     {
       key: '1',
       label: `团队介绍`,
-      children: <div>
+      children: <div className='teamIntroduction'>
         {/* <Image width={1100} height={800} src={detail?.teamPoster ? detail?.teamPoster : ''} alt='error'/> */}
-        <img src={detail?.teamPoster ? detail?.teamPoster : ''} alt="error" />
+        <img style={{width:"100%"}} src={detail?.teamPoster ? detail?.teamPoster : ''} alt="error" />
       </div>,
     },
     {
@@ -57,7 +57,7 @@ export default function JobServicesDetail() {
       <Box>
         <div className='top'>
           <div className="top-image">
-          <Image width={300} height={300} src={detail?.pictureUrl ? detail?.pictureUrl : ''} alt='error'/>
+           <Image fill src={detail?.pictureUrl ? detail?.pictureUrl : ''} alt='error'/>
           </div>
           <div className='top-right'>
               <div className='right-top'>

pages/jobServices/detail/styled.tsx

@@ -20,6 +20,7 @@ export const Box = styled.div`
             background-color: #F4F5F7;
             border-radius: 6px;
             margin-right: 32px;
+            position: relative;
         }
         &-right{
             display: flex;
@@ -106,5 +107,8 @@ export const Box = styled.div`
     .tabs{
         padding: 0 24px;
         margin-top: 69px;
+        .teamIntroduction{
+            width: 100%;
+        }
     }
 `
\ No newline at end of file