改-首页样式调整

pages/home/waterfallFlowBody/index.tsx

@@ -7,14 +7,6 @@ import ContentBox from "~/components/contentBox";
 import RotationChart from "./components/rotationChart";
 import Map from "./components/map";
 
-import tubiao from "./assets/tubiao.png";
-import fuwu from "./assets/fuwu.png";
-import xiaoshou from "./assets/xiaoshou.png";
-import baoxian from "./assets/baoxian.png";
-import peixun from "./assets/peixun.png";
-import gongju from "./assets/gongju.png";
-import xwbg from "./assets/xwbg.png";
-const icon = [tubiao, fuwu, xiaoshou, baoxian, peixun, gongju];
 import {
   FilterOptionResp,
   RegionResp,
@@ -114,7 +106,7 @@ export default function WaterfallFlowBody() {
   ];
 
   const [leftDomList, setLeftDomList] = useState(
-    Array<{ element: JSX.Element , type?: string,}>
+    Array<{ element: JSX.Element; type?: string }>
   );
   const [rightTopDomList, setRightTopDomList] = useState<JSX.Element>();
   const [rightBottomDomList, setRightBottomDomList] = useState<JSX.Element>();
@@ -132,11 +124,10 @@ export default function WaterfallFlowBody() {
   ];
   const { IndustryFlightSkills } = flightSkillsApi;
   const flightApiTypeList = ["licenseId", "flightSkillsId"];
-  
+
   const { listAllIndustry, listAllAppType } = jobServicesApi;
   const jobApiTypeList = ["industryId", "appTypeId"];
 
-
   useEffect(() => {
     (async () => {
       // listNewsApi.listNewsPage({ pageNo: 1, pageSize: 5 }).then((res) => {
@@ -211,13 +202,10 @@ export default function WaterfallFlowBody() {
       setMoreEqList(res1.map((item) => item.result).flat());
       setLeftDomList(
         columns.map((item, index) => {
-          
           if (index < 3) {
-            console.log("路由跳转",index);
-            return { element: leftDom(item, index, listValue) , type:"left" };  
+            return { element: leftDom(item, index, listValue), type: "left" };
           }
-          console.log("路由跳转",index);
-          return { element: leftDom(item, index, listValue) , type:"right" };  
+          return { element: leftDom(item, index, listValue), type: "right" };
         })
       );
 
@@ -248,10 +236,9 @@ export default function WaterfallFlowBody() {
       <div key={item.title} className="item">
         <div className="item-title">
           <div className="item-left">
-            {/* <div className="item-left-icon">
-              <Image src={icon[index]} alt="#" />
-            </div> */}
-            <div className="item-left-label" onClick={() => routerPath(index)}>{item.title}</div>
+            <div className="item-left-label" onClick={() => routerPath(index)}>
+              {item.title}
+            </div>
           </div>
           <div>
             <Select
@@ -305,9 +292,6 @@ export default function WaterfallFlowBody() {
                   );
                 })}
           </Space>
-          {/* <div className="item-bottom" onClick={() => routerPath(index)}>
-            全部
-          </div> */}
         </div>
       </div>
     );
@@ -321,8 +305,7 @@ export default function WaterfallFlowBody() {
             className="title-label"
             onClick={() => router.push("/projectInfo")}
           >
-            行业新闻
-            &gt;
+            行业新闻 &gt;
           </div>
         </div>
         <div className="body">
@@ -348,15 +331,13 @@ export default function WaterfallFlowBody() {
   const rightDom2 = (list: Array<NewsTenderType>) => {
     return (
       <div key={1008} className="right-box-item right-item-second">
-        <Image src={xwbg} alt="#" width={384} height={249} />
         <div className="item-box">
           <div className="title">
             <div
               className="title-label"
               onClick={() => router.push("/projectInfo")}
             >
-              招标快讯
-              &gt;
+              招标快讯 &gt;
             </div>
           </div>
           <div className="body">
@@ -367,13 +348,7 @@ export default function WaterfallFlowBody() {
                   <div className="label-bottom">{item.tenderPrice}</div>
                 </div>
                 <div className="item-right">
-                  <Image
-                    src={require("./assets/button.png")}
-                    alt="#"
-                    width={103}
-                    height={22}
-                  />
-                  <div className="left">{item.tenderPrice}W</div>
+                  <div className="left">{`${item.tenderPrice}W`}</div>
                   <div className="right">申请合作</div>
                 </div>
               </div>

pages/home/waterfallFlowBody/styled.tsx

 import styled from "styled-components";
 import button from "./assets/button.png";
+import xwbg from "./assets/xwbg.png";
+
 export default function Style() {
   return <></>;
 }
@@ -37,10 +39,10 @@ export const Box = styled.div`
           font-weight: bold;
           color: #000000;
           line-height: 32px;
-          &:hover{
+          &:hover {
             cursor: pointer;
             color: #ff552d;
-          } 
+          }
         }
       }
       .select-box {
@@ -189,11 +191,7 @@ export const Box = styled.div`
   .right-item-second {
     border-radius: 6px;
     background-color: #fff;
-    position: relative;
-    .item-box {
-      position: absolute;
-      top: 0;
-    }
+    background: url(${xwbg.src}) no-repeat;
     .title {
       display: flex;
       align-items: center;
@@ -276,10 +274,12 @@ export const Box = styled.div`
           text-overflow: ellipsis;
         }
         .item-right {
+          display: flex;
+          justify-content: space-between;
+          padding: 0 5px;
           width: 103px;
           height: 22px;
-          background: url(${button as unknown as string}) no-repeat;
-          position: relative;
+          background: url(${button.src}) no-repeat;
           .left {
             width: 35px;
             height: 22px;
@@ -288,7 +288,6 @@ export const Box = styled.div`
             font-family: PingFangSC-Medium, PingFang SC;
             font-weight: 500;
             color: #ff4500;
-            position: absolute;
             text-align: center;
             left: 4px;
             top: 0;
@@ -300,10 +299,6 @@ export const Box = styled.div`
             font-size: 11px;
             font-family: MicrosoftYaHei;
             color: #ffffff;
-            position: absolute;
-            text-align: center;
-            right: 3px;
-            top: 0;
           }
         }
       }