Commit b9b68354793c37276faafd339d097461f5795a10
1 parent
72a8599e
服务页 车场 车主模块
Showing
3 changed files
with
178 additions
and
41 deletions
css/services.css
| @@ -29,6 +29,10 @@ | @@ -29,6 +29,10 @@ | ||
| 29 | .services-content{ | 29 | .services-content{ |
| 30 | background-color: #fff; | 30 | background-color: #fff; |
| 31 | } | 31 | } |
| 32 | +.services_bgF7F8FA{ | ||
| 33 | + background-color: #F7F8FA; | ||
| 34 | + width: 100%; | ||
| 35 | +} | ||
| 32 | /*tab sta */ | 36 | /*tab sta */ |
| 33 | .services-wrap{ | 37 | .services-wrap{ |
| 34 | height: 680px; | 38 | height: 680px; |
| @@ -41,19 +45,22 @@ | @@ -41,19 +45,22 @@ | ||
| 41 | background: url("../images/services_saasIco.png") no-repeat; | 45 | background: url("../images/services_saasIco.png") no-repeat; |
| 42 | width: 542px; | 46 | width: 542px; |
| 43 | height: 494px; | 47 | height: 494px; |
| 44 | - margin-top: 102px; | ||
| 45 | - margin-left: 10px; | 48 | + /*width: 100%;*/ |
| 49 | + margin: 102px auto 0; | ||
| 46 | } | 50 | } |
| 47 | .services-wrap-right-1{ | 51 | .services-wrap-right-1{ |
| 48 | width: 543px; | 52 | width: 543px; |
| 53 | + /*width: 100%;*/ | ||
| 49 | height: 400px; | 54 | height: 400px; |
| 50 | - margin-top: 177px; | ||
| 51 | - margin-left: 78px; | 55 | + margin: 177px auto 0; |
| 56 | + /*margin-left: 20px;*/ | ||
| 57 | + /*margin-left: 78px;*/ | ||
| 52 | } | 58 | } |
| 53 | /*1----tab 右侧 切换部分 sta*/ | 59 | /*1----tab 右侧 切换部分 sta*/ |
| 54 | .services-soft-wrap{ | 60 | .services-soft-wrap{ |
| 55 | height: 168px; | 61 | height: 168px; |
| 56 | - width: 100%; | 62 | + /*width: 100%;*/ |
| 63 | + width: 543px; | ||
| 57 | border-bottom: 2px solid rgba(228,229,229,1);; | 64 | border-bottom: 2px solid rgba(228,229,229,1);; |
| 58 | } | 65 | } |
| 59 | .services-soft-wrap li { | 66 | .services-soft-wrap li { |
| @@ -96,7 +103,7 @@ | @@ -96,7 +103,7 @@ | ||
| 96 | background: url(../images/services_titico3_active.png) no-repeat center 0; | 103 | background: url(../images/services_titico3_active.png) no-repeat center 0; |
| 97 | } | 104 | } |
| 98 | /*1------tab 右侧 cont*/ | 105 | /*1------tab 右侧 cont*/ |
| 99 | -.services-section-wrap,.services-section-user{ | 106 | +.services-section-wrap,.services-section-user,.services-section-park{ |
| 100 | height: 100px; | 107 | height: 100px; |
| 101 | margin-top: 58px; | 108 | margin-top: 58px; |
| 102 | width: 400px; | 109 | width: 400px; |
| @@ -121,27 +128,91 @@ | @@ -121,27 +128,91 @@ | ||
| 121 | } | 128 | } |
| 122 | 129 | ||
| 123 | /*----2------ tab sta*/ | 130 | /*----2------ tab sta*/ |
| 124 | - | 131 | +/*2 tab*/ |
| 132 | +.services-wrap-left-2{ | ||
| 133 | + width: 543px; | ||
| 134 | + /*width: 100%;*/ | ||
| 135 | + height: 400px; | ||
| 136 | + margin: 165px auto 0; | ||
| 137 | + margin-left: 20px; | ||
| 138 | +} | ||
| 139 | +.services-wrap-right-2{ | ||
| 140 | + background: url("../images/services_parkIco.png") no-repeat; | ||
| 141 | + width: 558px; | ||
| 142 | + /*width: 100%;*/ | ||
| 143 | + height: 574px; | ||
| 144 | + margin: 67px auto 0; | ||
| 145 | + /*margin-left: 10px;*/ | ||
| 146 | +} | ||
| 147 | +/*-------2---*/ | ||
| 148 | +.services-park-wrap{ | ||
| 149 | + height: 168px; | ||
| 150 | + width: 543px; | ||
| 151 | + /*width: 100%;*/ | ||
| 152 | + border-bottom: 2px solid rgba(228,229,229,1);; | ||
| 153 | +} | ||
| 154 | +.services-park-wrap li { | ||
| 155 | + color: rgba(6,14,19,.8); | ||
| 156 | + font-size:20px; | ||
| 157 | + cursor: pointer; | ||
| 158 | + height: 168px; | ||
| 159 | + width: 133px; | ||
| 160 | +} | ||
| 161 | +.services-park-wrap li:nth-of-type(1) { | ||
| 162 | + padding-top: 114px; | ||
| 163 | + background: url(../images/services_titico4.png) no-repeat center 0; | ||
| 164 | + margin-right: 72px; | ||
| 165 | +} | ||
| 166 | +.services-park-wrap li:nth-of-type(1).active { | ||
| 167 | + color: #3F9FFE; | ||
| 168 | + padding-bottom: 22px; | ||
| 169 | + border-bottom: 2px solid rgba(63,159,254,1); | ||
| 170 | + background: url(../images/services_titico4_active.png) no-repeat center 0; | ||
| 171 | +} | ||
| 172 | +.services-park-wrap li:nth-of-type(2) { | ||
| 173 | + padding-top: 114px; | ||
| 174 | + background: url(../images/services_titico5.png) no-repeat center 0; | ||
| 175 | + margin-right: 72px; | ||
| 176 | +} | ||
| 177 | +.services-park-wrap li:nth-of-type(2).active { | ||
| 178 | + color: #3F9FFE; | ||
| 179 | + padding-bottom: 22px; | ||
| 180 | + border-bottom: 2px solid rgba(63,159,254,1); | ||
| 181 | + background: url(../images/services_titico5_active.png) no-repeat center 0; | ||
| 182 | +} | ||
| 183 | +.services-park-wrap li:nth-of-type(3) { | ||
| 184 | + padding-top: 114px; | ||
| 185 | + background: url(../images/services_titico6.png) no-repeat center 0; | ||
| 186 | +} | ||
| 187 | +.services-park-wrap li:nth-of-type(3).active { | ||
| 188 | + color: #3F9FFE; | ||
| 189 | + padding-bottom: 22px; | ||
| 190 | + border-bottom: 2px solid rgba(63,159,254,1); | ||
| 191 | + background: url(../images/services_titico6_active.png) no-repeat center 0; | ||
| 192 | +} | ||
| 125 | 193 | ||
| 126 | /*----3------ tab sta*/ | 194 | /*----3------ tab sta*/ |
| 127 | -/*1 tab*/ | 195 | +/*---3 tab*/ |
| 128 | .services-wrap-left-3{ | 196 | .services-wrap-left-3{ |
| 129 | background: url("../images/services_userIco.png") no-repeat; | 197 | background: url("../images/services_userIco.png") no-repeat; |
| 130 | width: 568px; | 198 | width: 568px; |
| 199 | + /*width: 100%;*/ | ||
| 131 | height: 593px; | 200 | height: 593px; |
| 132 | - margin-top: 67px; | ||
| 133 | - margin-left: 10px; | 201 | + margin: 67px auto 0; |
| 202 | + /*margin-left: 10px;*/ | ||
| 134 | } | 203 | } |
| 135 | .services-wrap-right-3{ | 204 | .services-wrap-right-3{ |
| 136 | width: 543px; | 205 | width: 543px; |
| 206 | + /*width: 100%;*/ | ||
| 137 | height: 400px; | 207 | height: 400px; |
| 138 | - margin-top: 165px; | ||
| 139 | - margin-left: 50px; | 208 | + margin: 165px auto 0; |
| 209 | + margin-left: 20px; | ||
| 140 | } | 210 | } |
| 141 | /*-------3---*/ | 211 | /*-------3---*/ |
| 142 | .services-user-wrap{ | 212 | .services-user-wrap{ |
| 143 | height: 168px; | 213 | height: 168px; |
| 144 | - width: 100%; | 214 | + width: 543px; |
| 215 | + /*width: 100%;*/ | ||
| 145 | border-bottom: 2px solid rgba(228,229,229,1);; | 216 | border-bottom: 2px solid rgba(228,229,229,1);; |
| 146 | } | 217 | } |
| 147 | .services-user-wrap li { | 218 | .services-user-wrap li { |
js/services.js
| @@ -6,10 +6,19 @@ $('#services-soft-wrap li').on('click',function () { | @@ -6,10 +6,19 @@ $('#services-soft-wrap li').on('click',function () { | ||
| 6 | $('#services-soft-wrap li').eq(_index).addClass('active').siblings().removeClass('active') | 6 | $('#services-soft-wrap li').eq(_index).addClass('active').siblings().removeClass('active') |
| 7 | $('#services-section-wrap>li').eq(_index).removeClass('displaynone').siblings().addClass('displaynone') | 7 | $('#services-section-wrap>li').eq(_index).removeClass('displaynone').siblings().addClass('displaynone') |
| 8 | }); | 8 | }); |
| 9 | + | ||
| 10 | +//车场 tab 切换 | ||
| 11 | +$('#services-park-wrap li').on('click',function () { | ||
| 12 | + var _index = $(this).index(); | ||
| 13 | + console.log(_index) | ||
| 14 | + $('#services-park-wrap li').eq(_index).addClass('active').siblings().removeClass('active') | ||
| 15 | + $('#services-section-park>li').eq(_index).removeClass('displaynone').siblings().addClass('displaynone') | ||
| 16 | +}); | ||
| 17 | + | ||
| 9 | //车主 tab 切换 | 18 | //车主 tab 切换 |
| 10 | $('#services-user-wrap li').on('click',function () { | 19 | $('#services-user-wrap li').on('click',function () { |
| 11 | var _index = $(this).index(); | 20 | var _index = $(this).index(); |
| 12 | console.log(_index) | 21 | console.log(_index) |
| 13 | $('#services-user-wrap li').eq(_index).addClass('active').siblings().removeClass('active') | 22 | $('#services-user-wrap li').eq(_index).addClass('active').siblings().removeClass('active') |
| 14 | $('#services-section-user>li').eq(_index).removeClass('displaynone').siblings().addClass('displaynone') | 23 | $('#services-section-user>li').eq(_index).removeClass('displaynone').siblings().addClass('displaynone') |
| 15 | -}) | ||
| 16 | \ No newline at end of file | 24 | \ No newline at end of file |
| 25 | +}); | ||
| 17 | \ No newline at end of file | 26 | \ No newline at end of file |
services.html
| @@ -64,60 +64,116 @@ | @@ -64,60 +64,116 @@ | ||
| 64 | </div> | 64 | </div> |
| 65 | <!--banner end--> | 65 | <!--banner end--> |
| 66 | <div class="services-content"> | 66 | <div class="services-content"> |
| 67 | + | ||
| 68 | + <!--集团 sta--> | ||
| 67 | <div class="container"> | 69 | <div class="container"> |
| 68 | - <!--集团 sta--> | ||
| 69 | - <ul class=" services-wrap" > | ||
| 70 | - <li class="text-center float-left services-wrap-left-1"></li> | ||
| 71 | - <li class="text-center float-left services-wrap-right-1"> | ||
| 72 | - <ul class="services-soft-wrap" id="services-soft-wrap"> | 70 | + <ul class="row services-wrap"> |
| 71 | + <li class="text-center col-md-6 services-wrap-left-1"></li> | ||
| 72 | + <li class="text-center col-md-6 services-wrap-right-1"> | ||
| 73 | + <ul class="services-soft-wrap" id="services-soft-wrap"> | ||
| 74 | + <li class="text-center float-left active"> | ||
| 75 | + SAAS平台 | ||
| 76 | + </li> | ||
| 77 | + <li class="text-center float-left"> | ||
| 78 | + 监控中心 | ||
| 79 | + </li> | ||
| 80 | + <li class="text-center float-left"> | ||
| 81 | + 数据互联 | ||
| 82 | + </li> | ||
| 83 | + </ul> | ||
| 84 | + <ul class="services-section-wrap" id="services-section-wrap"> | ||
| 85 | + <li class=""> | ||
| 86 | + <div class="services-soft-bottom-title"> | ||
| 87 | + 集团SAAS云平台 | ||
| 88 | + </div> | ||
| 89 | + <div class="services-soft-bottom-des"> | ||
| 90 | + 跨平台停车管控云平台系统，提供集中数据管理和监控、数据挖掘和分析、资产管理和增值运营等一体化服务。 | ||
| 91 | + </div> | ||
| 92 | + </li> | ||
| 93 | + <li class="displaynone"> | ||
| 94 | + <div class="services-soft-bottom-title"> | ||
| 95 | + 任你停运营监控中心 | ||
| 96 | + </div> | ||
| 97 | + <div class="services-soft-bottom-des"> | ||
| 98 | + 建立综合停车数据资源，搭建基础分析模型，提供新一代的数据分析与商业智能 | ||
| 99 | + BI解决方案，致力于缓解拥堵实现车位运营智能化 | ||
| 100 | + </div> | ||
| 101 | + </li> | ||
| 102 | + <li class="displaynone"> | ||
| 103 | + <div class="services-soft-bottom-title"> | ||
| 104 | + 实时数据信息流互通 | ||
| 105 | + </div> | ||
| 106 | + <div class="services-soft-bottom-des"> | ||
| 107 | + 多端设备互联，商户、车主、平台数据实时精准安全同步云服务，线上线下一体化 | ||
| 108 | + 连接，辅助商业决策分析，打造互联网+智慧停车新生态 | ||
| 109 | + </div> | ||
| 110 | + </li> | ||
| 111 | + </ul> | ||
| 112 | + </li> | ||
| 113 | + </ul> | ||
| 114 | + </div> | ||
| 115 | + <!--集团 end--> | ||
| 116 | + <!--车场 sta--> | ||
| 117 | + <div class="services_bgF7F8FA"> | ||
| 118 | + <div class="container"> | ||
| 119 | + <ul class="row services-wrap"> | ||
| 120 | + <li class="text-center col-md-6 services-wrap-left-2"> | ||
| 121 | + <ul class="services-park-wrap" id="services-park-wrap"> | ||
| 73 | <li class="text-center float-left active"> | 122 | <li class="text-center float-left active"> |
| 74 | - SAAS平台 | 123 | + 车场服务 |
| 75 | </li> | 124 | </li> |
| 76 | <li class="text-center float-left"> | 125 | <li class="text-center float-left"> |
| 77 | - 监控中心 | 126 | + 云平台 |
| 78 | </li> | 127 | </li> |
| 79 | <li class="text-center float-left"> | 128 | <li class="text-center float-left"> |
| 80 | - 数据互联 | 129 | + 政府云 |
| 81 | </li> | 130 | </li> |
| 82 | </ul> | 131 | </ul> |
| 83 | - <ul class="services-section-wrap" id="services-section-wrap"> | 132 | + <ul class="services-section-park" id="services-section-park"> |
| 84 | <li class=""> | 133 | <li class=""> |
| 85 | <div class="services-soft-bottom-title"> | 134 | <div class="services-soft-bottom-title"> |
| 86 | - 集团SAAS云平台 | 135 | + 一站式车场服务平台 |
| 87 | </div> | 136 | </div> |
| 88 | <div class="services-soft-bottom-des"> | 137 | <div class="services-soft-bottom-des"> |
| 89 | - 跨平台停车管控云平台系统，提供集中数据管理和监控、数据挖掘和分析、资产管理和增值运营等一体化服务。 | 138 | + 运用互联网+、物联网、AI开放平台，为车场提供科学专业建设方案，综合车位 |
| 139 | + 引导、视频监控、停车计费、运营监控等运营管理，提供一站式个性化定制， | ||
| 140 | + 推动智慧停车商业运营新生态 | ||
| 90 | </div> | 141 | </div> |
| 91 | </li> | 142 | </li> |
| 92 | <li class="displaynone"> | 143 | <li class="displaynone"> |
| 93 | <div class="services-soft-bottom-title"> | 144 | <div class="services-soft-bottom-title"> |
| 94 | - 任你停运营监控中心 | 145 | + 企业云平台 |
| 95 | </div> | 146 | </div> |
| 96 | <div class="services-soft-bottom-des"> | 147 | <div class="services-soft-bottom-des"> |
| 97 | - 建立综合停车数据资源，搭建基础分析模型，提供新一代的数据分析与商业智能 | ||
| 98 | - BI解决方案，致力于缓解拥堵实现车位运营智能化 | 148 | + 为车场管理者提供财务对账，统计报表，运营监控，收入管理，权限管理，资产 |
| 149 | + 管理、人员排班，车位共享，灵活费率管理等多样化运营服务 | ||
| 99 | </div> | 150 | </div> |
| 100 | </li> | 151 | </li> |
| 101 | <li class="displaynone"> | 152 | <li class="displaynone"> |
| 102 | <div class="services-soft-bottom-title"> | 153 | <div class="services-soft-bottom-title"> |
| 103 | - 实时数据信息流互通 | 154 | + 政府云平台 |
| 104 | </div> | 155 | </div> |
| 105 | <div class="services-soft-bottom-des"> | 156 | <div class="services-soft-bottom-des"> |
| 106 | - 多端设备互联，商户、车主、平台数据实时精准安全同步云服务，线上线下一体化 | ||
| 107 | - 连接，辅助商业决策分析，打造互联网+智慧停车新生态 | 157 | + 对数据进行集成、归类，建立完整的综合停车数据资源目录，深度洞察用户数据， |
| 158 | + 搭建基础分析模型，提供新一代的数据分析与商业智能BI解决方案，致力于缓解 | ||
| 159 | + 拥堵实现车位运营智能化。同时打造“新型智慧城市”解决交通拥堵治理、增进绿 | ||
| 160 | + 色经济发展 | ||
| 108 | </div> | 161 | </div> |
| 109 | </li> | 162 | </li> |
| 110 | </ul> | 163 | </ul> |
| 111 | </li> | 164 | </li> |
| 112 | - </ul> | ||
| 113 | - <!--集团 end--> | ||
| 114 | - <!--车场 sta--> | 165 | + <li class="text-center col-md-6 services-wrap-right-2"> |
| 115 | 166 | ||
| 116 | - <!--车场 end--> | ||
| 117 | - <!--车主 sta--> | ||
| 118 | - <ul class=" services-wrap" > | ||
| 119 | - <li class="text-center float-left services-wrap-left-3"></li> | ||
| 120 | - <li class="text-center float-left services-wrap-right-3"> | 167 | + </li> |
| 168 | + </ul> | ||
| 169 | + </div> | ||
| 170 | + </div> | ||
| 171 | + <!--车场 end--> | ||
| 172 | + <!--车主 sta--> | ||
| 173 | + <div class="container"> | ||
| 174 | + <ul class="row services-wrap"> | ||
| 175 | + <li class="text-center col-md-6 services-wrap-left-3"></li> | ||
| 176 | + <li class="text-center col-md-6 services-wrap-right-3"> | ||
| 121 | <ul class="services-user-wrap" id="services-user-wrap"> | 177 | <ul class="services-user-wrap" id="services-user-wrap"> |
| 122 | <li class="text-center float-left active"> | 178 | <li class="text-center float-left active"> |
| 123 | 车主服务 | 179 | 车主服务 |
| @@ -162,9 +218,10 @@ | @@ -162,9 +218,10 @@ | ||
| 162 | </ul> | 218 | </ul> |
| 163 | </li> | 219 | </li> |
| 164 | </ul> | 220 | </ul> |
| 165 | - <!--车主 end--> | ||
| 166 | - | ||
| 167 | </div> | 221 | </div> |
| 222 | + <!--车主 end--> | ||
| 223 | + | ||
| 224 | + | ||
| 168 | </div> | 225 | </div> |
| 169 | <!--content end--> | 226 | <!--content end--> |
| 170 | <!-- Footer Area --> | 227 | <!-- Footer Area --> |