图片调整

src/components/card/CardProj.tsx

@@ -156,11 +156,12 @@ export default function CardProj(props: any) {
                         <div className='cpb-left-img'>
                             <Carousel autoplay dots={false}>
 
-                                <div>
+                                <div className='cpb-left-imgX'>
                                     <img src={downloadUrl(data.loginpage.loginpagePreviewImgs)} height={'143px'} alt="" />
 
                                 </div>
-                                <div>
+                                <div className='cpb-left-imgX'>
+
                                     <img src={downloadUrl(data.codeTypePage.previewImgs)} height={'143px'} alt="" />
 
                                 </div>
@@ -488,9 +489,9 @@ export default function CardProj(props: any) {
                         {renderOption()}
                     </ConfigProvider>
                 </div> */}
-            </div>
+            </div >
             {/* 第四步 设置 */}
-            <Modal open={loginPageOpne}
+            < Modal open={loginPageOpne}
                 title="登陆页面设置"
                 width={1700}
                 destroyOnClose={true}
@@ -498,14 +499,15 @@ export default function CardProj(props: any) {
                 onCancel={() => {
                     setLoginPageOpne(false);
                     // window.location.reload(); // 在取消时刷新页面
-                }}
+                }
+                }
 
                 footer={null}
             >
                 <LoginPage projId={projId} closeModal={() => { setLoginPageOpne(false) }}></LoginPage>
-            </Modal>
+            </ Modal>
             {/* 第四步 查看 */}
-            <Modal open={loginPageShowOpne}
+            < Modal open={loginPageShowOpne}
                 title="登陆页面查看"
                 width={1700}
                 destroyOnClose={true}
@@ -518,9 +520,9 @@ export default function CardProj(props: any) {
                 footer={null}
             >
                 <LoginPageShow projId={projId}></LoginPageShow>
-            </Modal>
+            </Modal >
             {/* 第五步 设置 */}
-            <Modal open={softwareManagementOpen}
+            < Modal open={softwareManagementOpen}
                 title="软件功能管理设置"
                 width={1500}
                 destroyOnClose={true}
@@ -534,9 +536,9 @@ export default function CardProj(props: any) {
                 footer={null}
             >
                 <SoftwareManagement projId={projId}></SoftwareManagement>
-            </Modal>
+            </Modal >
             {/* 第五步 查看 */}
-            <Modal open={softwareManagementShowOpen}
+            < Modal open={softwareManagementShowOpen}
                 title="软件功能管理查看"
                 width={1500}
                 destroyOnClose={true}
@@ -547,9 +549,9 @@ export default function CardProj(props: any) {
                 footer={null}
             >
                 <SoftwareManagementShow projId={projId}></SoftwareManagementShow>
-            </Modal>
+            </Modal >
             {/* 第六步 设置 */}
-            <Modal open={displayOrderOpen}
+            < Modal open={displayOrderOpen}
                 title="设置功能列表显示顺序"
                 width={1500}
                 destroyOnClose={true}
@@ -561,9 +563,9 @@ export default function CardProj(props: any) {
                 footer={null}
             >
                 <DisplayOrder projId={projId}></DisplayOrder>
-            </Modal>
+            </Modal >
             {/* 第六步 查看 */}
-            <Modal open={displayOrderShowOpen}
+            < Modal open={displayOrderShowOpen}
                 title="查看功能列表显示顺序"
                 width={1500}
                 destroyOnClose={true}
@@ -574,7 +576,7 @@ export default function CardProj(props: any) {
                 footer={null}
             >
                 <DisplayOrderShow projId={projId}></DisplayOrderShow>
-            </Modal>
+            </Modal >
             {messageContext}
         </>
     )

src/components/card/card-proj.css

@@ -127,14 +127,27 @@
     height: 143px;
     background: #F5F5F5;
     border-radius: 6px;
-    overflow: hidden;
+   
+
+}
+.cpb-left-imgX {
+    /* width: 249px; */
+    width: 290px;
+    height: 143px;
+    background: #F5F5F5;
+    border-radius: 6px;
+   
+
 }
 .cpb-left-img img {
-    width: 100%; /* 使图片宽度等于容器宽度 */
+    width: 100%; /* 使图片宽度等于父元素宽度 */
-    height: 100%; /* 使图片高度等于容器高度 */
+    height: 100%; /* 使图片高度等于父元素高度 */
-    object-fit: cover; /* 图片等比例缩放并裁剪超出部分 */
+    object-fit: cover; /* 使图片等比例缩放并裁剪超出部分 */
-    object-position: center; /* 图片居中显示 */
+    object-position: center ; /* 确保图片在容器内居中显示 */
-    display: block; /* 去掉图片底部的空隙 */
+    
+     /* 去掉图片底部的空隙 */
+    display: block;
+  
 }
 
 .cpbl-right {

src/components/payment/Payment.tsx

@@ -187,6 +187,11 @@ export default function Payment(props: IPaymentProps) {
                         setIsRechargeMoneyEdit(false);
                         getPay()
                     }}>确定</Button>
+                    <span style={{ color: '#1677ff', cursor: 'pointer' }}
+                        onClick={() => {
+                            setIsRechargeMoneyEdit(false)
+                        }}
+                    >取消</span>
                 </div>
             )
         }
@@ -361,7 +366,12 @@ export default function Payment(props: IPaymentProps) {
         }
         return <>
             <Flex gap="middle" align="center" justify="center" vertical>
-                <div className="qr-code">
+                <div className="qr-code" style={{ position: 'relative' }}>
+                    <div style={{ position: 'absolute', top: 0, left: 0, width: '100%', height: '100%', background: "rgba(0,0,0,0.6)",backdropFilter: 'blur(10px)', zIndex: 99 ,display:isRechargeMoneyEdit?'block':'none'}}>
+                        <div style={{color:'#fff', width: '100%', height: '100%',fontSize:30,display:'flex',alignItems:'center',justifyContent:'center'}}>
+                            正在修改,请稍后...
+                        </div>
+                    </div>
                     <Image src={thirdPartyPayUrl} fallback={errorImage} preview={false} />
                     {/* {
                         isCountdownTimeout ? (
@@ -383,11 +393,11 @@ export default function Payment(props: IPaymentProps) {
         <div style={{ position: 'relative' }}>
             <div style={{ position: 'absolute', width: '100%', height: '100%', top: 0, left: 0, background: 'rgba(0,0,0,0.6)', zIndex: 99, display: mask ? 'block' : 'none' }}>
                 <div style={{ color: '#FFF', fontSize: 16, width: '100%', height: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center' }} >
-                    <div style={{cursor: 'pointer',display: 'flex',flexDirection:'column', alignItems: 'center', justifyContent: 'center' }} onClick={() => {
+                    <div style={{ cursor: 'pointer', display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center' }} onClick={() => {
                         setMask(false)
                         setRefreshQrCodeCount(refreshQrCodeCount + 1);
                     }}>
-                        <div style={{fontSize:70}}><ReloadOutlined /></div>
+                        <div style={{ fontSize: 70 }}><ReloadOutlined /></div>
                         已失效,点击刷新
                     </div>
                 </div>