From 21c2a0e3af44468e05b792773073df833380cc94 Mon Sep 17 00:00:00 2001
From: zhaobing <zhao.bing@free-sun.com.cn>
Date: Thu, 10 Aug 2023 20:18:34 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E9=A6=96=E9=A1=B5=E8=BD=AE=E6=92=AD?=
 =?UTF-8?q?=E5=9B=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../quanju/containers/footer/guanli/index.js  | 77 +++++++++----------
 .../containers/footer/operation/style.less    | 25 ++++--
 2 files changed, 55 insertions(+), 47 deletions(-)

diff --git a/web/client/src/sections/quanju/containers/footer/guanli/index.js b/web/client/src/sections/quanju/containers/footer/guanli/index.js
index 5bc518ef..42bfce1e 100644
--- a/web/client/src/sections/quanju/containers/footer/guanli/index.js
+++ b/web/client/src/sections/quanju/containers/footer/guanli/index.js
@@ -136,46 +136,45 @@ const Guanli = (props) => {
    // }
    const renderContent = rightitemlist.map(({ enforcementdate, enforcementreslt, roadname, picfile }, index) => {
       return (
-         <div key={index} style={{ width: '100%', }} className='carCard'>
-            <div style={{ width: '90%', height: '96%', margin: '2% 5%', overflow: 'hidden', display: "flex" }}>
-               {picfile?.length > 0 ? <Carousel autoplay style={{ width: 200, height: 200, margin: "20px 0px 0px 20px" }}>
-                  {picfile?.map(v => <div style={{ width: 200, height: 200 }}>
-                     <img className='picfileimg'
-                        style={{ width: 200, height: 150, display: 'inline-block', }}
-                        // src={`/_file-server/${v.storageUrl}`}
-                        src={v.url}
-                        width={`200px`}
-                     />
-                  </div>)}
-               </Carousel>
-                  : <div style={{
-                     width: 200, height: 200, margin: "20px 0px 0px 20px",
-                  }} />
-               }
-               <div style={{ width: 240, marginLeft: 20, marginTop: 20, display: "flex", flexDirection: "column", justifyContent: "space-around" }}>
-                  <p style={{ whiteSpace: "nowrap", color: "rgba(216,240,255,0.8)", fontSize: "14px", fontFamily: "PingFangSC-Regular, PingFang SC", display: "flex" }}>
-                     执法日期:<span style={{
-                        color: "#EEF4FF", marginLeft: "10px", fontFamily: " PingFangSC-Medium, PingFang SC",
-                        overflow: 'hidden', whiteSpace: "nowrap", textOverflow: "ellipsis"
-                     }}>
-                        {enforcementdate && moment(enforcementdate).format("YYYY-MM-DD") || "--"}
-                     </span></p>
-                  <p style={{ whiteSpace: "nowrap", color: "rgba(216,240,255,0.8)", fontSize: "14px", fontFamily: "PingFangSC-Regular, PingFang SC", display: "flex" }}>
-                     执法道路:<span title={roadname} style={{
-                        color: "#EEF4FF", marginLeft: "10px", fontFamily: " PingFangSC-Medium, PingFang SC",
-                        overflow: 'hidden', whiteSpace: "nowrap", textOverflow: "ellipsis", display: 'inline-block', width: 160
-                     }}>
-                        {roadname}
-                     </span></p>
-                  <p style={{ whiteSpace: "nowrap", color: "rgba(216,240,255,0.8)", fontSize: "14px", fontFamily: "PingFangSC-Regular, PingFang SC", display: "flex" }}>
-                     执法成果:<span title={enforcementreslt} style={{
-                        color: "#EEF4FF", marginLeft: "10px", fontFamily: " PingFangSC-Medium, PingFang SC",
-                        overflow: 'hidden', whiteSpace: "nowrap", textOverflow: "ellipsis", display: 'inline-block', width: 160
-                     }}>
-                        {enforcementreslt}</span></p>
-               </div>
+         <div key={index} style={{}} className='carCardRight'>
+            {picfile?.length > 0 ? <Carousel autoplay style={{ width: 200, height: 200, margin: "20px 10px" }}>
+               {picfile?.map(v => <div style={{ width: 200, height: 200 }}>
+                  <img className='picfileimg'
+                     style={{ width: 200, height: 150, display: 'inline-block', }}
+                     // src={`/_file-server/${v.storageUrl}`}
+                     src={v.url}
+                     width={`200px`}
+                  />
+               </div>)}
+            </Carousel>
+               : <div style={{
+                  width: 200, height: 200, margin: "20px 0px 0px 20px",
+               }} />
+            }
+            <div style={{ width: 240, marginLeft: 10, marginTop: 20, display: "flex", flexDirection: "column", justifyContent: "space-around" }}>
+               <p style={{ whiteSpace: "nowrap", color: "rgba(216,240,255,0.8)", fontSize: "14px", fontFamily: "PingFangSC-Regular, PingFang SC", display: "flex" }}>
+                  执法日期:<span style={{
+                     color: "#EEF4FF", marginLeft: "10px", fontFamily: " PingFangSC-Medium, PingFang SC",
+                     overflow: 'hidden', whiteSpace: "nowrap", textOverflow: "ellipsis"
+                  }}>
+                     {enforcementdate && moment(enforcementdate).format("YYYY-MM-DD") || "--"}
+                  </span></p>
+               <p style={{ whiteSpace: "nowrap", color: "rgba(216,240,255,0.8)", fontSize: "14px", fontFamily: "PingFangSC-Regular, PingFang SC", display: "flex" }}>
+                  执法道路:<span title={roadname} style={{
+                     color: "#EEF4FF", marginLeft: "10px", fontFamily: " PingFangSC-Medium, PingFang SC",
+                     overflow: 'hidden', whiteSpace: "nowrap", textOverflow: "ellipsis", display: 'inline-block', width: 160
+                  }}>
+                     {roadname}
+                  </span></p>
+               <p style={{ whiteSpace: "nowrap", color: "rgba(216,240,255,0.8)", fontSize: "14px", fontFamily: "PingFangSC-Regular, PingFang SC", display: "flex" }}>
+                  执法成果:<span title={enforcementreslt} style={{
+                     color: "#EEF4FF", marginLeft: "10px", fontFamily: " PingFangSC-Medium, PingFang SC",
+                     overflow: 'hidden', whiteSpace: "nowrap", textOverflow: "ellipsis", display: 'inline-block', width: 160
+                  }}>
+                     {enforcementreslt}</span></p>
             </div>
          </div>
+
       )
    })
    const renderLeftContent = () => {
@@ -219,7 +218,7 @@ const Guanli = (props) => {
                   <div style={{ width: '50%', textAlign: "center", }}>执法成果</div>
                </div> */}
                {rightitemlist && rightitemlist.length !== 0 ? <AutoRollComponent content={renderContent}
-                  containerStyle={{ position: "relative", height: "100%", }}
+                  containerStyle={{ position: "relative", height: "100%", margin: "20px" }}
                   divHeight={"100%"} divId={"chart-overview-deviceList"} /> : <NoData style={{ height: "20%" }} />}
 
                {/* {
diff --git a/web/client/src/sections/quanju/containers/footer/operation/style.less b/web/client/src/sections/quanju/containers/footer/operation/style.less
index 0d823550..c78a6f7f 100644
--- a/web/client/src/sections/quanju/containers/footer/operation/style.less
+++ b/web/client/src/sections/quanju/containers/footer/operation/style.less
@@ -15,12 +15,11 @@
         background: none;
         // border: 1px solid rgba(10, 114, 255, 1);
     }
-
 }
 
 .busList::-webkit-scrollbar-track {
     background-color: rgba(3, 60, 158, 0.3);
-    border-radius: 1px
+    border-radius: 1px;
 }
 
 .busList::-webkit-scrollbar {
@@ -29,7 +28,7 @@
 
 .busList::-webkit-scrollbar-thumb {
     background-color: rgba(28, 96, 254, 1);
-    border-radius: 1px
+    border-radius: 1px;
 }
 
 //
@@ -39,6 +38,16 @@
     margin: 12px 0;
     padding: 0 -4px;
 }
+.carCardRight {
+    background-image: url(/assets/images/leadership/beijinglan.png);
+    background-size: 100% 100%;
+    margin: 30px 0;
+    padding: 0 -4px;
+    display: flex;
+    &:first-child {
+        margin-top: 0;
+    }
+}
 
 //车辆视频监控样式
 .busInformation {
@@ -65,10 +74,10 @@
             font-size: 24px;
             list-style: none;
             margin-left: 4%;
-            font-family: "YouSheBiaoTiHei";
+            font-family: 'YouSheBiaoTiHei';
             display: block;
             float: left;
-            text-shadow: 0px 0px 8px #07B9FE;
+            text-shadow: 0px 0px 8px #07b9fe;
         }
 
         h5 {
@@ -77,10 +86,10 @@
             font-size: 20px;
             list-style: none;
             margin-left: 5%;
-            font-family: "YouSheBiaoTiHei";
+            font-family: 'YouSheBiaoTiHei';
             display: block;
             float: left;
-            text-shadow: 0px 0px 8px #07B9FE;
+            text-shadow: 0px 0px 8px #07b9fe;
         }
     }
 }
@@ -89,4 +98,4 @@
     width: 100%;
     overflow: hidden;
     margin-bottom: 2%;
-}
\ No newline at end of file
+}