Commit c2e61bb04de62afde29e508bf3d8b50a14f19023
1 parent
9d9289d6
Exists in
dev
feat: 产品与服务添加码头作业区模块
Showing
5 changed files
with
23 additions
and
5 deletions
Show diff stats
platform/src/main/webapp/template/web/home/product.html
| @@ -118,6 +118,11 @@ var bodyContent = { | @@ -118,6 +118,11 @@ var bodyContent = { | ||
| 118 | <img src="${ctx}template/web/static/image/service_icon4_active.png" class="image-active"> | 118 | <img src="${ctx}template/web/static/image/service_icon4_active.png" class="image-active"> |
| 119 | <span>船舶修造</span> | 119 | <span>船舶修造</span> |
| 120 | </div> | 120 | </div> |
| 121 | + <div id="tab5" class="tab" onclick="changeTab(5)"> | ||
| 122 | + <img src="${ctx}template/web/static/image/service_icon5.png" class="image"> | ||
| 123 | + <img src="${ctx}template/web/static/image/service_icon5_active.png" class="image-active"> | ||
| 124 | + <span>码头作业区</span> | ||
| 125 | + </div> | ||
| 121 | </div> | 126 | </div> |
| 122 | <div class="service-content"> | 127 | <div class="service-content"> |
| 123 | <div id="content1" class="content content-active"> | 128 | <div id="content1" class="content content-active"> |
| @@ -189,6 +194,21 @@ var bodyContent = { | @@ -189,6 +194,21 @@ var bodyContent = { | ||
| 189 | </div> | 194 | </div> |
| 190 | </div> | 195 | </div> |
| 191 | </div> | 196 | </div> |
| 197 | + | ||
| 198 | + <div id="content5" class="content"> | ||
| 199 | + <div class="left"> | ||
| 200 | + <img src="${ctx}template/web/static/image/service_card5.png" class="title-right"> | ||
| 201 | + </div> | ||
| 202 | + <div class="right"> | ||
| 203 | + <div class="title"> | ||
| 204 | + 码头作业区 | ||
| 205 | + </div> | ||
| 206 | + <div class="desc"> | ||
| 207 | + 南阳港务集团所合作的码头作业区有：宁波北仑港、重庆维扬码头作业区、江苏镇江码头作业区、湖北沙洋新港码头作业区、 | ||
| 208 | + 唐河新港码头作业区。同时整合内河航运企业，为工业、农业、商业提供低成本运输服务，拉动内循环，带动双循环提速中国经济。 | ||
| 209 | + </div> | ||
| 210 | + </div> | ||
| 211 | + </div> | ||
| 192 | </div> | 212 | </div> |
| 193 | </div> | 213 | </div> |
| 194 | </div> | 214 | </div> |
| @@ -364,7 +384,7 @@ var bodyContent = { | @@ -364,7 +384,7 @@ var bodyContent = { | ||
| 364 | <script> | 384 | <script> |
| 365 | function changeTab(index) { | 385 | function changeTab(index) { |
| 366 | console.log('changeTab', index) | 386 | console.log('changeTab', index) |
| 367 | - for(var i = 1; i <= 4; i++) { | 387 | + for(var i = 1; i <= 5; i++) { |
| 368 | if (i === index) { | 388 | if (i === index) { |
| 369 | $('#tab'+ i).addClass('tab-active'); | 389 | $('#tab'+ i).addClass('tab-active'); |
| 370 | $('#content'+ i).addClass('content-active'); | 390 | $('#content'+ i).addClass('content-active'); |
platform/src/main/webapp/template/web/static/css/product.css
| @@ -9,8 +9,8 @@ | @@ -9,8 +9,8 @@ | ||
| 9 | } | 9 | } |
| 10 | 10 | ||
| 11 | .service-tab .tab { | 11 | .service-tab .tab { |
| 12 | - width: 284px; | ||
| 13 | - height: 168px; | 12 | + width: 224px; |
| 13 | + height: 156px; | ||
| 14 | border: 1px solid #E0E0E0; | 14 | border: 1px solid #E0E0E0; |
| 15 | display: flex; | 15 | display: flex; |
| 16 | flex-direction: column; | 16 | flex-direction: column; |
| @@ -164,7 +164,6 @@ | @@ -164,7 +164,6 @@ | ||
| 164 | left: 14px; | 164 | left: 14px; |
| 165 | top: 0; | 165 | top: 0; |
| 166 | width: calc(100% - 28px); | 166 | width: calc(100% - 28px); |
| 167 | - height: 100%; | ||
| 168 | height: 0; | 167 | height: 0; |
| 169 | overflow: hidden; | 168 | overflow: hidden; |
| 170 | display: flex; | 169 | display: flex; |
| @@ -174,7 +173,6 @@ | @@ -174,7 +173,6 @@ | ||
| 174 | } | 173 | } |
| 175 | 174 | ||
| 176 | .advantage-item .info div { | 175 | .advantage-item .info div { |
| 177 | - transform: skewX(-5deg); | ||
| 178 | position: absolute; | 176 | position: absolute; |
| 179 | left: 50%; | 177 | left: 50%; |
| 180 | top: 50%; | 178 | top: 50%; |
453 KB
4.21 KB
platform/src/main/webapp/template/web/static/image/service_icon5_active.png
0 → 100644
4.04 KB