tsj: 统览大屏故障--1、大屏切换按钮样式和逻辑；2、右侧的rightBack按钮样式

src/components/ModeSwitch/index.css

 .container {
   width: 257px;
-  height: 40px;
-  border-radius: 25px;
+  border-radius: 29px;
+  height: 58px;
   background: #123D66;
   position: relative;
   cursor: pointer;
@@ -10,8 +10,8 @@
 .container .slider {
   position: absolute;
   width: 131px;
-  height: 40px;
-  border-radius: 25px;
+  border-radius: 29px;
+  height: 58px;
   background: linear-gradient(180deg, #1cc0ff, #5294ff 100%);
   transition: transform 0.3s ease;
   transform: translateX(0);
@@ -32,7 +32,7 @@
   width: 80px;
   font-size: 20px;
   font-family: '钉钉进步体';
-  font-weight: 400;
+  font-weight: 700;
   line-height: 24px;
   text-align: center;
   transition: color 0.3s ease;

src/components/ModeSwitch/index.less

 .container {
   width: 257px;
-  height: 40px;
-  border-radius: 25px;
+  border-radius: 29px;
+  height: 58px;
+  // height: 40px;
+  // border-radius: 25px;
   background: #123D66;
   position: relative;
   cursor: pointer;
@@ -10,8 +12,10 @@
   .slider {
     position: absolute;
     width: 131px;
-    height: 40px;
-    border-radius: 25px;
+    border-radius: 29px;
+    height: 58px;
+    // height: 40px;
+    // border-radius: 25px;
     background: linear-gradient(180deg, rgb(28, 192, 255), rgb(82, 148, 255) 100%);
     transition: transform 0.3s ease;
     transform: translateX(0);
@@ -34,7 +38,7 @@
       width: 80px;
       font-size: 20px;
       font-family: '钉钉进步体';
-      font-weight: 400;
+      font-weight: 700;
       line-height: 24px;
       text-align: center;
       transition: color 0.3s ease;

src/components/ModeSwitch/index.tsx

@@ -10,10 +10,10 @@ interface ModeSwitchProps {
 const ModeSwitch: React.FC<ModeSwitchProps> = ({ checked, onChange }) => {
   return (
     <div className={styles.container} onClick={() => onChange(!checked)}>
-      <div className={classNames(styles.slider, {[styles.checked]: checked})} />
+      <div className={classNames(styles.slider, {[styles.checked]: !checked})} />
       <div className={styles.textWrapper}>
-        <span className={classNames({[styles.active]: checked})}>专题模式</span>
-        <span className={classNames({[styles.active]: !checked})}>统览模式</span>
+        <span className={classNames({[styles.active]: checked})}>统览模式</span>
+        <span className={classNames({[styles.active]: !checked})}>专题模式</span>
       </div>
     </div>
   );

src/layouts/Header/index.css

@@ -66,14 +66,3 @@
 .container .rightCard:active {
   transform: scale(0.95);
 }
-.container .modeSwitch {
-  min-width: 100px;
-  height: 32px;
-}
-.container .modeSwitch .ant-switch-inner {
-  font-size: 20px;
-  font-weight: 700;
-}
-.container .modeSwitch.ant-switch-checked {
-  background: #1890ff;
-}

src/layouts/Header/index.less

@@ -85,19 +85,4 @@
     }
   }
 
-  .modeSwitch {
-    min-width: 100px;
-    height: 32px;
-    
-    // :global {
-      .ant-switch-inner {        
-        font-size: 20px;
-        font-weight: 700;
-      }
-      
-      &.ant-switch-checked {
-        background: #1890ff;
-      }
-    // }
-  }
 }

src/pages/NewHome/NewRightContent/IndustryOperationNew/components/Card/index.tsx

-import { RightOutlined } from '@ant-design/icons';
+// import { RightOutlined } from '@ant-design/icons';
+import rightBack from '@/assets/images/newMain/rightBack.png';
 import { ConfigProvider, Flex, Popover } from 'antd';
 import classNames from 'classnames';
 import React, { PropsWithChildren } from 'react';
@@ -53,7 +54,8 @@ const Card: React.FC<PropsWithChildren<PropsType>> = (props) => {
                 [styles.bindClick]: !Boolean(jumpSystem?.length),
               })}
             >
-              <RightOutlined style={{ color: '#fff', fontSize: 14 }} />
+              <img src={rightBack} alt="" />
+              {/* <RightOutlined style={{ color: '#fff', fontSize: 14 }} /> */}
             </div>
           </Popover>
         </ConfigProvider>

src/pages/NewHome/NewRightContent/ResourceElements/components/Card/index.css

@@ -43,16 +43,16 @@
 .container .rightBtn:active {
   opacity: 0.6;
 }
-.container .otherSystem {
+.otherSystem {
   display: flex;
   flex-direction: column;
   gap: 10px;
   padding: 10px;
 }
-.container .otherSystem span {
+.otherSystem span {
   color: #fff;
   cursor: pointer;
 }
-.container .otherSystem span:hover {
-  color: #1CC0FF;
+.otherSystem span:hover {
+  color: #1cc0ff;
 }

src/pages/NewHome/NewRightContent/ResourceElements/components/Card/index.less

@@ -55,21 +55,6 @@
       opacity: 0.6;
     }
   }
-  // .rightBtn {
-  //   width: 24px;
-  //   height: 24px;
-  //   border-radius: 12px;
-  //   background: linear-gradient(180deg, #1CC0FF 0%, #5294FF 100%);
-  //   display: flex;
-  //   align-items: center;
-  //   justify-content: center;
-  //   cursor: pointer;
-  //   opacity: 0.2;
-
-  //   &:not(.bindClick) {
-  //     opacity: 1;
-  //   }
-  // }
 }
 .otherSystem {
   display: flex;

src/pages/NewHome/NewRightContent/ResourceElements/components/Card/index.tsx

-import { RightOutlined } from '@ant-design/icons';
+// import { RightOutlined } from '@ant-design/icons';
 import { ConfigProvider, Flex, Popover } from 'antd';
 import classNames from 'classnames';
 import React, { PropsWithChildren } from 'react';
 import styles from './index.less';
+import rightBack from '@/assets/images/newMain/rightBack.png';
 
 interface PropsType {
   title: string;
@@ -55,7 +56,7 @@ const Card: React.FC<PropsWithChildren<PropsType>> = (props) => {
                 [styles.bindClick]: !Boolean(jumpSystem?.length),
               })}
             >
-              <RightOutlined style={{ color: '#fff', fontSize: 14 }} />
+              <img src={rightBack} alt="" />
             </div>
           </Popover>
         </ConfigProvider>