修改样式

src/global.less

@@ -147,6 +147,14 @@ input[type='reset'] {
   background: #ffffff;
   box-shadow: 0.01rem 0.06rem 0.1rem 0rem rgba(0, 0, 0, 0.1);
 }
+.value-number {
+  font-size: 0.8rem;
+  font-family: PangMenZhengDao-3, PangMenZhengDao-3;
+  font-weight: 400;
+  color: #3b3b3b;
+  line-height: 0.62rem;
+  letter-spacing: 0.06rem;
+}
 
 .content-tab {
   padding-left: 0.05rem;

src/pages/Controller/components/AirConditioner.js

@@ -29,7 +29,7 @@ const Work = (props) => {
             src={require('@/assets/air-conditioner.png')}
           />
           <div>
-            <div className={styles.number}>{data?.pagination?.total}</div>
+            <div className="value-number">{data?.pagination?.total}</div>
             空调数量
           </div>
         </div>

src/pages/DeviceManager/index.js

@@ -239,10 +239,10 @@ const Device = ({ projectId }) => {
   return (
     <div className={`content-tab ${styles.sparePart}`}>
       <Spin spinning={loadingDevice}>
-        <div className={`card-box ${styles.titleContent}`}>
+        <div className={styles.titleContent}>
           <img className={styles.img} src={deviceIcon} />
           <div>
-            <div className={styles.num}>{allData?.total}</div>
+            <div className="value-number">{allData?.total}</div>
             <div className={styles.text}>设备总数（个）</div>
           </div>
         </div>
@@ -346,10 +346,10 @@ const SparePart = ({ projectId }) => {
     <Spin spinning={loading}>
       <div className="content-tab">
         <Space direction="vertical" size={16} className={styles.sparePart}>
-          <div className={`card-box ${styles.titleContent}`}>
+          <div className={styles.titleContent}>
             <img className={styles.img} src={spareIcon} />
             <div>
-              <div className={styles.num}>{data?.on_amount || 0}</div>
+              <div className="value-number">{data?.on_amount || 0}</div>
               <div className={styles.text}>在库数量（个）</div>
             </div>
             <div

src/pages/DeviceManager/index.less

@@ -108,10 +108,13 @@
     }
     .ant-collapse-item {
       margin-bottom: 0.16rem;
-      border-radius: 0.08rem;
-      box-shadow: 0rem 0rem 0.08rem 0.02rem rgba(191, 191, 191, 0.2);
-      border: 0.01rem solid #eee;
-      background: rgb(255, 255, 255);
+      // border-radius: 0.08rem;
+      // box-shadow: 0rem 0rem 0.08rem 0.02rem rgba(191, 191, 191, 0.2);
+      // border: 0.01rem solid #eee;
+      // background: rgb(255, 255, 255);
+      border-radius: 0.4rem 0 0.4rem 0 !important;
+      background: #ffffff;
+      box-shadow: 0.01rem 0.06rem 0.1rem 0rem rgba(0, 0, 0, 0.1);
     }
     .ant-collapse
       > .ant-collapse-item

src/pages/SafetyManagement/index.js

@@ -120,11 +120,11 @@ const Video = ({ data, dataOnline, loading }) => {
     <Spin spinning={loading}>
       <div className="content-tab">
         <Space direction="vertical" size={16} className={styles.sparePart}>
-          <div className={`card-box ${styles.titleContent}`}>
+          <div className={styles.titleContent}>
             <div className={styles.titleLeft}>
               <img className={styles.img} src={videoIcon} />
               <div className={styles.textCon}>
-                <div className={styles.num}>{dataOnline?.total || 0}</div>
+                <div className="value-number">{dataOnline?.total || 0}</div>
                 <div className={styles.text}>在库数量（个）</div>
               </div>
             </div>
@@ -143,12 +143,16 @@ const Video = ({ data, dataOnline, loading }) => {
               </div>
             </div>
           </div>
-
-          {data?.map((item, idx) => (
-            <div key={`video_${idx}`} className="card-box">
-              {renderRed(item)}
-            </div>
-          ))}
+          <div className={styles.listContent}>
+            {data?.map((item, idx) => (
+              <div
+                key={`video_${idx}`}
+                className={`card-box ${styles.listItem}`}
+              >
+                {renderRed(item)}
+              </div>
+            ))}
+          </div>
         </Space>
       </div>
     </Spin>
@@ -177,11 +181,11 @@ const Door = ({ data, dataOver, loading, projectId }) => {
       <div className="content-tab">
         <Space direction="vertical" size={16} className={styles.doorPart}>
           <div className={styles.titleContent}>
-            <div className={`card-box ${styles.cardLeft}`}>
+            <div className={styles.cardLeft}>
               <div className={styles.up}>
                 <img className={styles.img} src={doorIcon} />
                 <div className={styles.textCon}>
-                  <div className={styles.num}>{dataOver?.total}</div>
+                  <div className="value-number">{dataOver?.total}</div>
                   <div className={styles.text}>门禁数量（个）</div>
                 </div>
               </div>
@@ -196,7 +200,7 @@ const Door = ({ data, dataOver, loading, projectId }) => {
                 </div>
               </div>
             </div>
-            <div className={`card-box ${styles.cardRight}`}>
+            <div className={styles.cardRight}>
               <div className={styles.textContent}>
                 <div className={styles.in} />
                 <span className={styles.text}>
@@ -214,11 +218,16 @@ const Door = ({ data, dataOver, loading, projectId }) => {
               </Button>
             </div>
           </div>
-          {data?.map((item, idx) => (
-            <div key={`door_${idx}`} className="card-box">
-              {renderRed(item)}
-            </div>
-          ))}
+          <div className={styles.listContent}>
+            {data?.map((item, idx) => (
+              <div
+                key={`door_${idx}`}
+                className={`card-box ${styles.listItem}`}
+              >
+                {renderRed(item)}
+              </div>
+            ))}
+          </div>
         </Space>
       </div>
     </Spin>

src/pages/SafetyManagement/index.less

@@ -9,16 +9,15 @@
 }
 .num {
   font-size: 0.8rem;
-  font-weight: bold;
-  font-family: DINAlternate-Bold, DINAlternate;
-  line-height: 0.94rem;
-  margin-bottom: 0.16rem;
-  color: #4a90e2;
+  font-family: PangMenZhengDao-3, PangMenZhengDao-3;
+  font-weight: 400;
+  color: #3b3b3b;
+  line-height: 0.62rem;
+  letter-spacing: 0.06rem;
 }
 .point {
   width: 0.2rem;
   height: 0.2rem;
-  border-radius: 0.1rem;
   margin-right: 0.12rem;
 }
 .onlinePoint {
@@ -34,6 +33,15 @@
   right: 0.2rem;
   top: 0.2rem;
 }
+.listContent {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+}
+.listItem {
+  width: 48%;
+  margin: 0.29rem 0;
+}
 .cardItem {
   display: flex;
   padding: 0.4rem 0.44rem 0.32rem;
@@ -57,9 +65,9 @@
   .titleContent {
     position: relative;
     display: flex;
-    // justify-content: space-between;
+    justify-content: space-around;
     align-items: center;
-    padding: 0.48rem 0 0.28rem 1.04rem;
+    padding: 0.48rem 1.8rem 0.28rem 0;
     .titleLeft {
       display: flex;
       margin-right: 0.96rem;
@@ -79,6 +87,10 @@
   .titleContent {
     display: flex;
     justify-content: space-between;
+    font-family: Source Han Sans, Source Han Sans;
+    font-weight: 500;
+    color: #615d5d;
+    font-size: 0.32rem;
     .cardLeft {
       width: 49%;
       .up {