Merge branch 'dev' of https://gitea.anxinyun.cn/gao.zhiyuan/Highways4Good into dev

weapp/src/app.config.js

@@ -4,6 +4,12 @@ export default {
     'pages/user/index',
     'pages/auth/login/login'
   ],
+  subPackages: [{
+    'root': 'packages/',
+    'pages': [
+      'patrol/index',
+    ]
+  }],
   permission: {
     "scope.userLocation": {
       "desc": '需要获取您的地理位置'
@@ -23,7 +29,7 @@ export default {
         'pagePath': 'pages/home/index',
         'iconPath': 'static/img/tabbar/shouye.png',
         'selectedIconPath': 'static/img/tabbar/shouye-active.png',
-        'text': '首页'
+        'text': '巡查'
       },
       {
         'pagePath': 'pages/user/index',

weapp/src/packages/patrol/index.jsx

@@ -0,0 +1,10 @@
+import React from 'react'
+import { View } from '@tarojs/components';
+
+const Index = () => {
+  return (
+    <View>巡查养护</View>
+  )
+}
+
+export default Index

weapp/src/pages/auth/login/login.config.js

@@ -1,4 +1,5 @@
 export default {
     navigationBarTitleText: '登录',
     disableScroll: true,
+    navigationStyle: 'custom'
 }

weapp/src/pages/auth/login/login.jsx

@@ -1,10 +1,13 @@
 import React, { useState } from 'react';
 import Taro from '@tarojs/taro';
 import { View, Button, Input, Form, Image } from '@tarojs/components';
+import { AtDivider } from 'taro-ui';
 import { login } from '@/actions/auth';
 import { getLoginUrl } from '@/services/api';
 import cfg from '../../../config';
 import LoginBg from '../../../static/img/login/bg.png';
+import PhoneIcon from '../../../static/img/login/phone.png';
+import PswdIcon from '../../../static/img/login/pswd.png';
 import './login.scss'
 
 const { pcode } = cfg;
@@ -36,36 +39,37 @@ const LoginPage = (props) => {
 
       <View className='login'>
         <View className='head'>
-          <View className='label'>欢迎使用</View>
+          <View className='title'>南 昌 县 智 慧 交 通</View>
-          <View className='title'>公路监管系统</View>
         </View>
+
         <View className='form'>
           <Form
             onSubmit={doLogin}
           >
             <View className='form-item'>
-              <View className='form-label'>账号</View>
+              <View className='form-label'>登录</View>
               <View className='form-input'>
+                <Image className='icon-phone' src={PhoneIcon}></Image>
                 <Input name='username' value={username} placeholder='请输入账号' onInput={handleUsernameChange} />
               </View>
             </View>
             <View className='form-item'>
-              <View className='form-label'>密码</View>
               <View className='form-input'>
+                <Image className='icon-pswd' src={PswdIcon}></Image>
                 <Input name='password' value={password} type='password' placeholder='请输入密码' onInput={handlePasswordChange} />
               </View>
             </View>
-
-
             <View style='padding: 40rpx 30rpx' >
               <Button type='primary' className='btn' formType='submit'>登录</Button>
             </View>
           </Form>
+
+          <View className='footer'>
+            <AtDivider content='忘记密码？请联系系统管理员' fontColor='#eee' lineColor='#fff' />
           </View>
         </View>
 
-
+      </View>
-
     </View>
   );
 }

weapp/src/pages/auth/login/login.scss

@@ -1,3 +1,5 @@
+@import "~taro-ui/dist/style/components/divider.scss";
+
 .page {
   height: 100vh;
   background: #fff;
@@ -16,24 +18,19 @@
 
 .head {
   width: 100%;
-  margin: 0 auto;
+  height: 300px;
-  padding: 0 5vw;
+  display: flex;
-
+  align-items: center;
-  .label {
+  justify-content: center;
-    color: #EFF3FE;
-    margin: 8px 0;
-    font-size: 44px;
-  }
 
   .title {
     color: #fff;
-    font-size: 46px;
+    font-size: 48px;
   }
 }
 
 .form {
   height: 100vh;
-  background: #fff;
   border-radius: 26px;
   padding: 20px 8vw;
   box-sizing: border-box;
@@ -49,6 +46,8 @@
 
   .form-label {
     font-weight: 600;
+    font-size: 36px;
+    color: #eee;
   }
 
   .form-input {
@@ -56,12 +55,45 @@
     margin: 18rpx 0;
     border-bottom: 1px solid #EEEEEE;
     padding: 8rpx 0px;
+    display: flex;
+    justify-content: left;
+    align-items: center;
+    color: #fff;
+
+    .icon-phone {
+      width: 24px;
+      height: 36px;
+      margin-left: 6px;
+      margin-right: 6px + 20px;
+    }
+    .icon-pswd {
+      width: 36px;
+      height: 36px;
+      margin-right: 20px;
+    }
+
+    .input-placeholder {
+      color: #ddd;
+    }
   }
 
   .btn {
-    background: #2C66F3;
+    background: #4797e4;
     font-size: 28px;
     padding: 8px 0;
+    border: solid 1px #fff;
     border-radius: 50px;
   }
+
+  .footer {
+    position: fixed;
+    width: 84%;
+    bottom: 100px;
+
+    .at-divider__content {
+      background: #499be7;
+      font-size: 24rpx;
+    }
   }
+}
+

weapp/src/pages/home/index.jsx

@@ -1,18 +1,24 @@
 import React, { useEffect, useState } from 'react';
 import Taro from '@tarojs/taro';
-import { View, Map, CoverView, CoverImage, Picker } from '@tarojs/components';
+import { View } from '@tarojs/components';
 import { useIndustry } from '@/actions/business';
 import './index.scss';
 
 
-
-
 const Index = () => {
-    // const { data: industryData } = useIndustry()
+
+  function toPatrol() {
+    Taro.navigateTo({
+      url: '/packages/patrol/index'
+    })
+  }
 
   return (
     <View className='page'>
-            首页
+      <View className='fill'>
+        <View className='title'>巡 查 养 护</View>
+        <View className='btn' onClick={toPatrol}>填报</View>
+      </View>
     </View>
   );
 }

weapp/src/pages/home/index.scss

@@ -1,111 +1,29 @@
 .page {
-    .top {
-        height: 16vh;
-        background: #EFF4FF;
-        color: #575F71;
-        font-size: 30px;
     display: flex;
     flex-direction: column;
-        justify-content: center;
-
-        .select {
-            display: flex;
     align-items: center;
-            margin: 12px auto;
-            width: 90vw;
-
-            .label {
-                margin-right: 20px;
-                white-space: nowrap;
-            }
-
-            .content {
-                width: 70vw;
-                border: 1px solid #3288FF;
-                border-radius: 5px;
-                padding: 10px 8px;
-
-                .custom-picker {
-                    display: flex;
-                    align-items: center;
-                    justify-content: space-between;
-
-                    .text {}
 
+    .fill {
+        margin-top: 30px;
+        padding: 10px;
+        width: 94%;
+        height: 360px;
+        background: url('../../static/img/patrol//fill-bg.svg') no-repeat;
+        background-size:100% 100%;
     }
-            }
-        }
-    }
-
-    .map {
-        width: 100vw;
-
-        .cover-wrap {
-            position: absolute;
-            bottom: 10px;
-            width: 96%;
-            left: 2%;
-            margin: 0 auto;
-            box-sizing: border-box;
-
-            .tablist {
-                width: 100%;
-                margin: 0 auto;
-                box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.22);
-                border-radius: 11px;
-                background: #fff;
-                display: flex;
-                justify-content: space-around;
-                padding: 20px 0;
-
-                .tab {
-                    width: 25%;
-                    display: flex;
-                    flex-direction: column;
-                    justify-content: center;
-                    align-items: center;
-                    font-size: 28px;
 
-                    .img {
+    .title {
-                        width: 42px;
+        margin: 50px 0 0 48px;
-                        height: 42px;
+        color: #fff;
-                        margin-bottom: 4px;
+        font-size: 48px;
-                    }
-                }
     }
-        }
-
-        .cover-left {
-            position: absolute;
-            bottom: 24vh;
-            left: 12px;
-            margin: 0 auto;
-            box-sizing: border-box;
 
-            .list {
+    .btn {
-                margin: 0 auto;
+        margin: 20px 0 0 50px;
-                box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.22);
+        color: #fff;
-                border-radius: 11px;
+        text-align: center;
-                background: #fff;
+        width: 200px;
-                display: flex;
+        border: solid 1px #fff;
-                flex-direction: column;
+        border-radius: 10px;
-                justify-content: space-around;
-                padding: 20px 8px;
-                box-sizing: border-box;
-
-                .cell {
-                    font-size: 26px;
-                    display: flex;
-                    align-items: center;
-                    margin: 10px 0;
-
-                    .img {
-                        width: 36px;
-                        height: 36px;
-                        margin-right: 8px;
-                    }
-                }
-            }
-        }
     }
 }

weapp/src/static/img/patrol/fill-bg.svg

@@ -0,0 +1,126 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="355px" height="180px" viewBox="0 0 355 180" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>椭圆形</title>
+    <defs>
+        <linearGradient x1="117.957428%" y1="31.1434704%" x2="53.120471%" y2="55.6260502%" id="linearGradient-1">
+            <stop stop-color="#346FC2" offset="0%"></stop>
+            <stop stop-color="#50A9F3" offset="100%"></stop>
+            <stop stop-color="#50A9F3" offset="100%"></stop>
+        </linearGradient>
+        <rect id="path-2" x="0" y="0" width="345" height="170" rx="8"></rect>
+        <filter x="-2.5%" y="-3.8%" width="104.9%" height="110.0%" filterUnits="objectBoundingBox" id="filter-4">
+            <feOffset dx="0" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="2.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0.898039216   0 0 0 0 0.898039216   0 0 0 0 0.898039216  0 0 0 1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+        </filter>
+        <radialGradient cx="41.0959558%" cy="36.7313023%" fx="41.0959558%" fy="36.7313023%" r="109.268488%" gradientTransform="translate(0.410960,0.367313),scale(0.456675,1.000000),rotate(135.284157),translate(-0.410960,-0.367313)" id="radialGradient-5">
+            <stop stop-color="#FFFFFF" stop-opacity="0.330364948" offset="0%"></stop>
+            <stop stop-color="#FFFFFF" stop-opacity="0.219542177" offset="2.71252185%"></stop>
+            <stop stop-color="#E6F3FF" stop-opacity="0.181763549" offset="100%"></stop>
+        </radialGradient>
+        <rect id="path-6" x="229.454545" y="120" width="94.5454545" height="130" rx="8"></rect>
+        <filter x="-1.6%" y="-1.2%" width="103.2%" height="102.3%" filterUnits="objectBoundingBox" id="filter-7">
+            <feGaussianBlur stdDeviation="1.5" in="SourceAlpha" result="shadowBlurInner1"></feGaussianBlur>
+            <feOffset dx="0" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
+            <feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
+            <feColorMatrix values="0 0 0 0 1   0 0 0 0 1   0 0 0 0 1  0 0 0 0.5 0" type="matrix" in="shadowInnerInner1"></feColorMatrix>
+        </filter>
+        <linearGradient x1="31.5358789%" y1="8.10997596%" x2="73.1923474%" y2="92.0883413%" id="linearGradient-8">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#FFFFFF" stop-opacity="0" offset="100%"></stop>
+        </linearGradient>
+        <rect id="path-9" x="217.454545" y="67" width="94.5454545" height="130" rx="8"></rect>
+        <filter x="-1.6%" y="-1.2%" width="103.2%" height="102.3%" filterUnits="objectBoundingBox" id="filter-10">
+            <feGaussianBlur stdDeviation="1.5" in="SourceAlpha" result="shadowBlurInner1"></feGaussianBlur>
+            <feOffset dx="0" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
+            <feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
+            <feColorMatrix values="0 0 0 0 1   0 0 0 0 1   0 0 0 0 1  0 0 0 0.5 0" type="matrix" in="shadowInnerInner1"></feColorMatrix>
+        </filter>
+        <linearGradient x1="32.2783656%" y1="8.10997596%" x2="72.2597274%" y2="92.0883413%" id="linearGradient-11">
+            <stop stop-color="#FFFFFF" offset="0%"></stop>
+            <stop stop-color="#FFFFFF" stop-opacity="0.232845947" offset="46.0445203%"></stop>
+            <stop stop-color="#FFFFFF" offset="100%"></stop>
+        </linearGradient>
+        <rect id="path-12" x="236.454545" y="81" width="57" height="80" rx="8"></rect>
+        <filter x="-4.4%" y="-3.1%" width="112.3%" height="108.8%" filterUnits="objectBoundingBox" id="filter-13">
+            <feOffset dx="1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="1" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feComposite in="shadowBlurOuter1" in2="SourceAlpha" operator="out" result="shadowBlurOuter1"></feComposite>
+            <feColorMatrix values="0 0 0 0 0.309803922   0 0 0 0 0.650980392   0 0 0 0 0.941176471  0 0 0 0.465444712 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+        </filter>
+        <filter x="-4.4%" y="-3.1%" width="112.3%" height="108.8%" filterUnits="objectBoundingBox" id="filter-14">
+            <feGaussianBlur stdDeviation="1.5" in="SourceAlpha" result="shadowBlurInner1"></feGaussianBlur>
+            <feOffset dx="0" dy="0" in="shadowBlurInner1" result="shadowOffsetInner1"></feOffset>
+            <feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
+            <feColorMatrix values="0 0 0 0 1   0 0 0 0 1   0 0 0 0 1  0 0 0 0.5 0" type="matrix" in="shadowInnerInner1"></feColorMatrix>
+        </filter>
+        <linearGradient x1="0%" y1="50%" x2="100%" y2="50%" id="linearGradient-15">
+            <stop stop-color="#F0F8FF" offset="0%"></stop>
+            <stop stop-color="#BFE2FF" offset="100%"></stop>
+        </linearGradient>
+        <rect id="path-16" x="242.376623" y="95.0344828" width="45.2380952" height="4.13793103" rx="2.06896552"></rect>
+        <filter x="-12.2%" y="-132.9%" width="128.7%" height="414.2%" filterUnits="objectBoundingBox" id="filter-17">
+            <feOffset dx="1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="2" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0.466666667   0 0 0 0 0.71372549   0 0 0 0 0.945098039  0 0 0 1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+        </filter>
+        <linearGradient x1="0%" y1="50%" x2="100%" y2="50%" id="linearGradient-18">
+            <stop stop-color="#F0F8FF" offset="0%"></stop>
+            <stop stop-color="#BFE2FF" offset="100%"></stop>
+        </linearGradient>
+        <rect id="path-19" x="242.376623" y="104.965517" width="28.047619" height="4.13793103" rx="2.06896552"></rect>
+        <filter x="-19.6%" y="-132.9%" width="146.3%" height="414.2%" filterUnits="objectBoundingBox" id="filter-20">
+            <feOffset dx="1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="2" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0.466666667   0 0 0 0 0.71372549   0 0 0 0 0.945098039  0 0 0 1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+        </filter>
+        <rect id="path-21" x="242.376623" y="114.068966" width="28.047619" height="4.13793103" rx="2.06896552"></rect>
+        <filter x="-19.6%" y="-132.9%" width="146.3%" height="414.2%" filterUnits="objectBoundingBox" id="filter-22">
+            <feOffset dx="1" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="2" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0.466666667   0 0 0 0 0.71372549   0 0 0 0 0.945098039  0 0 0 1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+        </filter>
+    </defs>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="首页_巡查（第三方）" transform="translate(-10.000000, -83.000000)">
+            <g id="椭圆形" transform="translate(15.000000, 86.000000)">
+                <mask id="mask-3" fill="white">
+                    <use xlink:href="#path-2"></use>
+                </mask>
+                <g id="蒙版">
+                    <use fill="black" fill-opacity="1" filter="url(#filter-4)" xlink:href="#path-2"></use>
+                    <use fill="url(#linearGradient-1)" fill-rule="evenodd" xlink:href="#path-2"></use>
+                </g>
+                <path d="M-25.1264086,44.3554348 C-22.8540945,43.4604524 -19.9720573,43.2618945 -16.3915335,43.8308467 C-9.45771541,44.9326439 0.0397231269,48.9019168 12.7510815,56.3907566 C85.2689971,99.1143615 101.526273,100.285815 157.01895,104.299238 C160.528313,104.553047 164.194848,104.818224 168.042785,105.106029 C251.195069,111.325385 298.21739,119.468187 324.522292,128.949845 C339.379312,134.305089 347.591516,140.069255 351.945866,146.174029 C357.803157,154.38592 356.636977,163.182122 355.47544,172.269858 C354.983672,176.117388 354.486328,180.019081 354.486328,183.955078 C354.486328,190.565127 350.969335,195.802414 344.574971,199.974635 C337.534232,204.568606 327.032087,207.873856 313.817887,210.266705 C281.200306,216.17315 232.117876,216.485999 177.575934,216.499454 L174.195339,216.499951 L174.195339,216.499951 L172.5,216.5 C151.619296,216.5 132.49809,217.669332 115.119764,218.732312 C78.6988427,220.960071 49.9497981,222.750964 28.7363653,212.203464 C11.9160687,203.840268 -0.120527505,187.690127 -7.5147057,157.879628 C-10.5366892,145.696146 -14.4375121,132.807586 -18.2424469,120.236626 C-27.4467917,89.8267865 -36.1911016,61.2508546 -30.2724922,49.2327272 C-29.1448998,46.9430764 -27.4674175,45.2774736 -25.1264086,44.3554348 Z" stroke-opacity="0.262647509" stroke="#FFFFFF" fill="url(#radialGradient-5)" opacity="0.34030878" mask="url(#mask-3)"></path>
+                <g id="矩形" mask="url(#mask-3)" transform="translate(276.727273, 185.000000) rotate(22.000000) translate(-276.727273, -185.000000) ">
+                    <use fill-opacity="0.234074519" fill="#FFFFFF" fill-rule="evenodd" xlink:href="#path-6"></use>
+                    <use fill="black" fill-opacity="1" filter="url(#filter-7)" xlink:href="#path-6"></use>
+                    <rect stroke="" stroke-width="1" stroke-linejoin="square" x="229.954545" y="120.5" width="93.5454545" height="129" rx="8"></rect>
+                </g>
+                <g id="矩形" mask="url(#mask-3)">
+                    <use fill-opacity="0.2" fill="url(#linearGradient-8)" fill-rule="evenodd" xlink:href="#path-9"></use>
+                    <use fill="black" fill-opacity="1" filter="url(#filter-10)" xlink:href="#path-9"></use>
+                    <rect stroke="" stroke-width="1" stroke-linejoin="square" x="217.954545" y="67.5" width="93.5454545" height="129" rx="8"></rect>
+                </g>
+                <g id="矩形" mask="url(#mask-3)">
+                    <use fill="black" fill-opacity="1" filter="url(#filter-13)" xlink:href="#path-12"></use>
+                    <use fill-opacity="0.2" fill="url(#linearGradient-11)" fill-rule="evenodd" xlink:href="#path-12"></use>
+                    <use fill="black" fill-opacity="1" filter="url(#filter-14)" xlink:href="#path-12"></use>
+                    <rect stroke="" stroke-width="1" stroke-linejoin="square" x="236.954545" y="81.5" width="56" height="79" rx="8"></rect>
+                </g>
+                <g id="矩形" opacity="0.782156808" mask="url(#mask-3)">
+                    <use fill="black" fill-opacity="1" filter="url(#filter-17)" xlink:href="#path-16"></use>
+                    <use fill="url(#linearGradient-15)" fill-rule="evenodd" xlink:href="#path-16"></use>
+                </g>
+                <g id="矩形备份" opacity="0.782156808" mask="url(#mask-3)">
+                    <use fill="black" fill-opacity="1" filter="url(#filter-20)" xlink:href="#path-19"></use>
+                    <use fill="url(#linearGradient-18)" fill-rule="evenodd" xlink:href="#path-19"></use>
+                </g>
+                <g id="矩形备份-2" opacity="0.782156808" mask="url(#mask-3)">
+                    <use fill="black" fill-opacity="1" filter="url(#filter-22)" xlink:href="#path-21"></use>
+                    <use fill="url(#linearGradient-18)" fill-rule="evenodd" xlink:href="#path-21"></use>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

web/client/src/sections/quanju/containers/footer/build/index.js

@@ -1,10 +1,11 @@
 import React from 'react'
-import LeftTop from './Lefttop'
+// import LeftTop from './Lefttop'
-import LeftCenter from './Leftcenter'
+// import LeftCenter from './Leftcenter'
-import LeftBottom from './Leftbottom'
+// import LeftBottom from './Leftbottom'
-import RightTop from './Righttop'
+// import RightTop from './Righttop'
-import Rightcenter from './Rightcenter'
+// import Rightcenter from './Rightcenter'
-import Rightbottom from './Rightbottom'
+// import Rightbottom from './Rightbottom'
+import { Carousel } from 'antd'
 import Module from '../../public/module'
 import './style.less'
 const Build = () => {
@@ -14,13 +15,87 @@ const Build = () => {
             <Module title={"各种状态公路数量统计"} style={{ width: "100%",
             height:" 33%"
             }}>
+               <div className='build-left-top'>
+                    <div className='build-left-top-item'>
                     <div>
-                    在建公路数量
+                            {/* <i>&#9658;</i> */}
+                            <span/>
+                            <span>在建公路数量</span> 
+                        </div>
+                        <div>6200</div>
+                    </div>
+                    <img src='/assets/images/quanju/zhuangtaigonglui.png' className='build-left-top-center'/>
+                    <div className='build-left-top-item'>
+                        <div>
+                            {/* <i>&#9658;</i> */}
+                            <span/>
+                            <span>已建公路数量</span> 
+                        </div>
+                        <div>6200</div>
+                    </div>
                </div>
             </Module>
             <Module title={"各乡镇道路占比统计"} style={{ width: "100%",
             height:" 33%",marginTop:'3%'
-            }}></Module>
+            }}>
+                <div className='build-left-center'>
+                    <div className='build-left-center-top'>
+                        <div>
+                            <img src='/assets/images/quanju/gonglugongli.png'></img>
+                            <div>
+                                <span>公路公里数/公里</span>
+                                <span>1234,123</span>
+                            </div>
+                        </div>
+                        <div>
+                            <img src='/assets/images/quanju/gongluzong.png'></img>
+                            <div>
+                                <span>公路公里数/公里</span>
+                                <span>1234,123</span>
+                            </div>
+                        </div>
+                    </div>
+                    <div className='build-left-center-titile'>
+                        <span>乡镇名称</span>
+                        <span>公路数量/条</span>
+                        <span>公里</span>
+                    </div>
+                    <div className='build-left-center-content'>
+                        <Carousel dotPosition='left' autoplay={true} dots={false}>
+                    <div className='build-left-center-item'>
+                        <span>乡镇名称</span>
+                        <span>公路数量/条</span>
+                        <span>公里</span>
+                    </div>
+                    <div className='build-left-center-item'>
+                        <span>乡镇名称</span>
+                        <span>公路数量/条</span>
+                        <span>公里</span>
+                    </div>
+                    <div className='build-left-center-item'>
+                        <span>乡镇名称</span>
+                        <span>公路数量/条</span>
+                        <span>公里</span>
+                    </div>
+                    <div className='build-left-center-item'>
+                        <span>乡镇名称</span>
+                        <span>公路数量/条</span>
+                        <span>公里</span>
+                    </div>
+                    <div className='build-left-center-item'>
+                        <span>乡镇名称</span>
+                        <span>公路数量/条</span>
+                        <span>公里</span>
+                    </div>
+                    <div className='build-left-center-item'>
+                        <span>乡镇名称</span>
+                        <span>公路数量/条</span>
+                        <span>公里</span>
+                    </div>
+                        </Carousel>
+                    </div>
+                </div>
+            </Module>
             <Module title={"道路统计"} style={{ width: "100%",
             height:" 30%",marginTop:'3%'
             }}></Module>
@@ -29,7 +104,12 @@ const Build = () => {
         <div className='bgbuild-right'>
         <Module title={"宣传栏"} style={{ width: "100%",
             height:" 33%"
-            }}></Module>
+            }}>
+               <div className='build-right-top'>
+               <img src='/assets/images/quanju/xuanchuanlan.jpg'></img>
+               <h2>全面建设好农村公路，切实发挥先行官作用</h2>
+               </div>
+            </Module>
         <Module title={"各乡镇在建公路工程"} style={{ width: "100%",
             height:" 33%",marginTop:'3%'
             }}></Module>

web/client/src/sections/quanju/containers/footer/build/style.less

@@ -9,21 +9,154 @@
         width: 25%;
         height: 100%;
         .build-left-top{
+            height: 100%;
             width: 100%;
-            height: 33%;
+            display: flex;
-            background-color: pink;
+            justify-content: center;
-            margin-bottom: 3%;
+            align-items: center;
+            .build-left-top-center{
+                width: 174px;
+                height: 146px;
+                margin: 0 10px;
+            }
+            .build-left-top-item{
+                width: 25%;
+                height: 50%;
+                background-image: url('/assets/images/quanju/zhuangtaigognlubiankuang.png');
+                background-size: 95%;
+                background-repeat: no-repeat;
+                display: flex;
+                flex-direction: column;
+                justify-content: center;
+                align-items: center;
+                // text-align: center;
+                div{
+                    &:nth-child(1){
+                        display: flex;
+                    justify-content: center;
+                    align-items: center;
+                    span{
+                        &:nth-child(1){
+                            width: 8px;
+                            height: 8px;
+                            margin-right: 5px;
+                            background: #07B9FE;
+                            clip-path: polygon(0 0, 100% 0, 0 100%, 0 0);
+                            transform: rotate(134deg);
+                        }
+                        &:nth-child(2){
+                            font-size: 16px;
+                            font-family: PingFangSC-Regular, PingFang SC;
+                            font-weight: 400;
+                            color: #E9F7FF;
+                            line-height: 22px;
+                        }
+                       
+                    }
+                    }
+                    &:nth-child(2){
+                        // width: 80%;
+                        // height: 100%;
+                        // margin: 1% auto 0;
+                        font-size: 38px;
+                        font-family: YouSheBiaoTiHei;
+                        color: #FFFFFF;
+                        text-align: center;
+                        // line-height: 49px;
+                        text-shadow: 0px 2px 4px #1C60FE;
+                        
+                    }
+                }
+            }
         }
         .build-left-center{
             width: 100%;
-            height: 33%;
+            height: 100%;
-            background-color: pink;
+            
-            margin-bottom: 3%;
+            .build-left-center-top{
+                width: 100%;
+                height: 30%;
+                display: flex;
+                justify-content: space-between;
+                div{
+                    width: 50%;
+                    height: 100%;
+                    display: flex;
+                    justify-content: center;
+                    align-items: center;
+                    img{
+                        height: 50px;
+                        width: 78px;
+
+                    }
+                    div{
+                        display: flex;
+                        flex-direction: column;
+                        align-items: start;
+                        justify-content: center;
+                        margin-left: 10px;
+                        span{
+                            &:nth-child(1){
+                                font-size: 12px;
+                                font-family: PingFangSC-Medium, PingFang SC;
+                                font-weight: 500;
+                                color: #C2EEFF;
+                                letter-spacing: 1px;
+                            }
+                            &:nth-child(2){
+                                font-size: 28px;
+                            font-family: YouSheBiaoTiHei;
+                            color: #FFFFFF;
+                            line-height: 36px;
+                            text-shadow: 0px 0px 4px #07B9FE;
+                            }
+                        }
+                        
+                    }
+                }
+                // background-color: pink;
+            }
+            .build-left-center-titile{
+                display: flex;
+                margin-bottom: 10px;
+                span{
+                    flex:1;
+                    text-align: center;
+                    font-size: 12px;
+                    font-family: PingFangSC-Medium, PingFang SC;
+                    font-weight: 500;
+                    color: #FFFFFF;
+                    line-height: 16px;
+                }
+            }
+            .build-left-center-content{
+                width: 100%;
+                height: 100px!important;
+                .build-left-center-item{
+                    display: flex !important;
+                    width: 100%!important;
+                    height: 28px!important;
+                    span{
+                        flex:1;
+                        text-align: center;
+                        font-size: 12px;
+                        font-family: PingFangSC-Medium, PingFang SC;
+                        font-weight: 500;
+                        color: #FFFFFF;
+                        line-height: 16px;
+                    }
+                }
+                .slick-list{ 
+                    height: 128px !important;
+                }
+            }
+            
+           
         }
         .build-left-bottom{
             width: 100%;
             height: 30%;
-            background-color: pink;
+            background-color: rgba(0,33,98,0.8);
         
         }
     }
@@ -31,10 +164,32 @@
         width: 25%;
         height: 100%;
         .build-right-top{
+            
             width: 100%;
-            height: 33%;
+           height: 100%;
-            background-color: pink;
+           padding: 0 10px 10px;
-            margin-bottom: 3%;
+           img{
+            width: 100%;
+            height: 65%;
+            margin-bottom: 5%;
+ 
+           }
+           h2{
+            height: 30%;
+            width: 100%;
+            padding-left: 15px;
+            font-size: 24px;
+            font-family: YouSheBiaoTiHei;
+            color: #FFFFFF;
+            display: flex;
+            align-items: center;
+            line-height: 31px;
+            background-image: url('/assets/images/quanju/bgxuanchuanlan.png');
+            background-size: 100% 100%;
+            
+        
+
+           }
         }
         .build-right-center{
             width: 100%;