monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by xwx
Commit 1c66ccb2d1ff46d98f45c3d2d275142d21cd732d 2 parents 01b2dd90 7ff4fff4 wangfeng-mj ... master-500-dev master-500-dev-0327 master-500-dev-joke master-500-dev-lzc master-500-dev-xwx master-500-dev-yuanjinpeng master-500-dev-ztq1 master-mj master-mj-610 master-mj-joke master-mj-yuanjinpeng master-mj-ztq wangfeng-500-dev

Merge branch 'master-500-dev' of http://113.200.75.45:82/monitor_v3/hg-monitor-w… 

…eb into master-500-dev-xwx
Inline Side-by-side
Showing 185 changed files with 1075 additions and 188 deletions
@@ -26,7 +26,7 @@ @@ -26,7 +26,7 @@
26 Start Global CSS 26 Start Global CSS
27 ==================================================================== 27 ====================================================================
28 ***/ 28 ***/
29 -@font-face { 29 +/*@font-face {
30 font-family: 'PingFang SC'; 30 font-family: 'PingFang SC';
31 font-style: normal; 31 font-style: normal;
32 font-weight: normal; 32 font-weight: normal;
@@ -67,7 +67,7 @@ @@ -67,7 +67,7 @@
67 font-style: normal; 67 font-style: normal;
68 font-weight: normal; 68 font-weight: normal;
69 src:url('../fonts/MI_LANTING_REGULAR.TTF'); 69 src:url('../fonts/MI_LANTING_REGULAR.TTF');
70 -} 70 +}*/
71 * { 71 * {
72 margin: 0px; 72 margin: 0px;
73 padding: 0px; 73 padding: 0px;
@@ -381,7 +381,7 @@ textarea:placeholder, @@ -381,7 +381,7 @@ textarea:placeholder,
381 } 381 }
382 .concat-concat { 382 .concat-concat {
383 position: relative; 383 position: relative;
384 - background: url('../img/concat/bg.png'); 384 + background: url('../img/concat/bg.jpg');
385 background-position: center bottom; 385 background-position: center bottom;
386 background-size: cover; 386 background-size: cover;
387 padding: 200px; 387 padding: 200px;
@@ -393,7 +393,7 @@ textarea:placeholder, @@ -393,7 +393,7 @@ textarea:placeholder,
393 } 393 }
394 .concat-service { 394 .concat-service {
395 position: relative; 395 position: relative;
396 - background: url('../img/services/service-bg.png'); 396 + background: url('../img/services/service-bg.jpg');
397 background-position: center bottom; 397 background-position: center bottom;
398 background-size: cover; 398 background-size: cover;
399 padding: 200px; 399 padding: 200px;
@@ -406,7 +406,7 @@ textarea:placeholder, @@ -406,7 +406,7 @@ textarea:placeholder,
406 406
407 .concat-about { 407 .concat-about {
408 position: relative; 408 position: relative;
409 - background: url('../img/about/about-bg.png'); 409 + background: url('../img/about/about-bg.jpg');
410 background-position: center bottom; 410 background-position: center bottom;
411 background-size: cover; 411 background-size: cover;
412 padding: 200px; 412 padding: 200px;
@@ -454,6 +454,7 @@ textarea:placeholder, @@ -454,6 +454,7 @@ textarea:placeholder,
454 font-size: 42px; 454 font-size: 42px;
455 margin-top: 75px; 455 margin-top: 75px;
456 text-align: center; 456 text-align: center;
  457 + color:#333;
457 } 458 }
458 459
459 .breadcrumb { 460 .breadcrumb {
@@ -2035,6 +2036,9 @@ blockquote:before { @@ -2035,6 +2036,9 @@ blockquote:before {
2035 .info-value{ 2036 .info-value{
2036 position: relative; 2037 position: relative;
2037 } 2038 }
  2039 +.info-value-center{
  2040 + text-align: center;
  2041 +}
2038 .info-value-title{ 2042 .info-value-title{
2039 position: absolute; 2043 position: absolute;
2040 top: 0; 2044 top: 0;
@@ -2043,7 +2047,8 @@ blockquote:before { @@ -2043,7 +2047,8 @@ blockquote:before {
2043 flex-flow: column; 2047 flex-flow: column;
2044 justify-content: center; 2048 justify-content: center;
2045 padding: 30px; 2049 padding: 30px;
2046 - 2050 + left:0;
  2051 + right:0;
2047 } 2052 }
2048 .max-width-600{ 2053 .max-width-600{
2049 max-width: 600px; 2054 max-width: 600px;
@@ -2110,17 +2115,36 @@ blockquote:before { @@ -2110,17 +2115,36 @@ blockquote:before {
2110 display: flex; 2115 display: flex;
2111 align-items: center; 2116 align-items: center;
2112 padding-bottom: 30px; 2117 padding-bottom: 30px;
  2118 + width: 100%;
  2119 + margin:0;
2113 } 2120 }
2114 2121
2115 .dot-item{ 2122 .dot-item{
2116 - padding:20px; 2123 + padding:10px;
2117 cursor: pointer; 2124 cursor: pointer;
  2125 + display: flex;
  2126 + align-items: center;
2118 } 2127 }
2119 -.dot-item-active,.dot-item:hover{  
2120 - background-color:#e43730; 2128 +.dot-item-title{
  2129 + font-size: 18px;
  2130 + font-weight: bold;
  2131 + flex:1;
  2132 + background-color: #e9eaef;
2121 border-radius: 5px; 2133 border-radius: 5px;
  2134 + padding:10px 20px;
  2135 + height: 100%;
  2136 + display: flex;
  2137 + align-items: center;
  2138 + min-height: 80px;
  2139 +}
  2140 +
  2141 +.dot-item-active .dot-item-title,.dot-item:hover .dot-item-title{
  2142 + background-color:#e43730;
2122 color:#ffffff; 2143 color:#ffffff;
2123 } 2144 }
  2145 +.dot-container{
  2146 + margin:0;
  2147 +}
2124 @media (min-width: 992px){ 2148 @media (min-width: 992px){
2125 .dot-container{ 2149 .dot-container{
2126 flex: 1; 2150 flex: 1;
@@ -2137,6 +2161,7 @@ blockquote:before { @@ -2137,6 +2161,7 @@ blockquote:before {
2137 } 2161 }
2138 .row-top{ 2162 .row-top{
2139 width:100%; 2163 width:100%;
  2164 + margin:0;
2140 } 2165 }
2141 .value-char{ 2166 .value-char{
2142 display: flex; 2167 display: flex;
@@ -2188,7 +2213,7 @@ blockquote:before { @@ -2188,7 +2213,7 @@ blockquote:before {
2188 align-items: center; 2213 align-items: center;
2189 } 2214 }
2190 .pro-advantage{ 2215 .pro-advantage{
2191 - background: url("../img/serviceSecond/maintenance/advantage-bg.png"); 2216 + background: url("../img/serviceSecond/maintenance/advantage-bg.jpg");
2192 background-size: cover; 2217 background-size: cover;
2193 position: absolute; 2218 position: absolute;
2194 height: 100%; 2219 height: 100%;
@@ -2236,11 +2261,6 @@ blockquote:before { @@ -2236,11 +2261,6 @@ blockquote:before {
2236 .footer-widget h4{ 2261 .footer-widget h4{
2237 color:#fff; 2262 color:#fff;
2238 } 2263 }
2239 -.dot-item-title{  
2240 - font-size: 14px;  
2241 -  
2242 - font-weight: bold;  
2243 -}  
2244 .cursor-pointer{ 2264 .cursor-pointer{
2245 cursor: pointer; 2265 cursor: pointer;
2246 } 2266 }
@@ -2271,7 +2291,7 @@ blockquote:before { @@ -2271,7 +2291,7 @@ blockquote:before {
2271 height: 100%; 2291 height: 100%;
2272 } 2292 }
2273 .tab-item-li{ 2293 .tab-item-li{
2274 - margin-right:80px; 2294 + margin-right:55px;
2275 } 2295 }
2276 @media (min-width: 992px){ 2296 @media (min-width: 992px){
2277 .intro-tab-container{ 2297 .intro-tab-container{
@@ -2353,6 +2373,9 @@ blockquote:before { @@ -2353,6 +2373,9 @@ blockquote:before {
2353 .container { 2373 .container {
2354 max-width: 1380px; 2374 max-width: 1380px;
2355 } 2375 }
  2376 + .tab-item-li{
  2377 + margin-right:80px;
  2378 + }
2356 } 2379 }
2357 .title-style-top{ 2380 .title-style-top{
2358 font-size: 42px; 2381 font-size: 42px;
@@ -2392,11 +2415,19 @@ blockquote:before { @@ -2392,11 +2415,19 @@ blockquote:before {
2392 left: 0; 2415 left: 0;
2393 top: 0; 2416 top: 0;
2394 z-index: -1; 2417 z-index: -1;
2395 - background: url('../img/index/step-route.png'); 2418 + background: url('../img/index/step-route.jpg');
2396 background-size: cover; 2419 background-size: cover;
  2420 + display: none;
  2421 +}
  2422 +.route-section{
  2423 + /*height: calc(100vh);*/
  2424 + position: relative;
  2425 +}
  2426 +.route-con,.step-route-bg-sm{
  2427 + display: none;
2397 } 2428 }
2398 .route-title{ 2429 .route-title{
2399 - color:#ffffff; 2430 + /*color:#ffffff;*/
2400 } 2431 }
2401 .step-route-item{ 2432 .step-route-item{
2402 font-size: 18px; 2433 font-size: 18px;
@@ -2420,7 +2451,7 @@ blockquote:before { @@ -2420,7 +2451,7 @@ blockquote:before {
2420 left: 0; 2451 left: 0;
2421 top: 0; 2452 top: 0;
2422 z-index: -1; 2453 z-index: -1;
2423 - background: url('../img/index/compatible-bg.png'); 2454 + background: url('../img/index/compatible-bg.jpg');
2424 background-size: cover; 2455 background-size: cover;
2425 } 2456 }
2426 .home-banner-section .owl-carousel .owl-item img{ 2457 .home-banner-section .owl-carousel .owl-item img{
@@ -2563,6 +2594,9 @@ blockquote:before { @@ -2563,6 +2594,9 @@ blockquote:before {
2563 background-repeat: no-repeat; 2594 background-repeat: no-repeat;
2564 background-position: center; 2595 background-position: center;
2565 } 2596 }
  2597 +.culturalValues-bg-sm{
  2598 + display: none;
  2599 +}
2566 .all-height{ 2600 .all-height{
2567 height:calc(100vh); 2601 height:calc(100vh);
2568 } 2602 }
@@ -2779,6 +2813,9 @@ blockquote:before { @@ -2779,6 +2813,9 @@ blockquote:before {
2779 .qualification-section .team-carousel .owl-nav button.owl-prev:hover,.qualification-section .team-carousel .owl-nav button.owl-next:hover{ 2813 .qualification-section .team-carousel .owl-nav button.owl-prev:hover,.qualification-section .team-carousel .owl-nav button.owl-next:hover{
2780 box-shadow:0 1px 10px 8px rgba(0, 0, 0, 0.3) ; 2814 box-shadow:0 1px 10px 8px rgba(0, 0, 0, 0.3) ;
2781 } 2815 }
  2816 +.owl-carousel.owl-loaded.team-carousel-sm{
  2817 + display: none;
  2818 +}
2782 .wrap{ 2819 .wrap{
2783 overflow: hidden; 2820 overflow: hidden;
2784 height: calc(100vh); 2821 height: calc(100vh);
@@ -2798,10 +2835,20 @@ blockquote:before { @@ -2798,10 +2835,20 @@ blockquote:before {
2798 align-items: center; 2835 align-items: center;
2799 justify-content: center; 2836 justify-content: center;
2800 } 2837 }
  2838 +.about-process-container{
  2839 + flex:0.6;
  2840 + display: flex;
  2841 + flex-flow: column;
  2842 +}
  2843 +.about-process{
  2844 + flex:1;
  2845 + display: flex;
  2846 + align-items: center;
  2847 +}
2801 .about-concat{ 2848 .about-concat{
2802 position: relative; 2849 position: relative;
2803 width: 100%; 2850 width: 100%;
2804 - flex: 1; 2851 + flex: 0.4;
2805 display: flex; 2852 display: flex;
2806 align-items: center; 2853 align-items: center;
2807 justify-content: center; 2854 justify-content: center;
@@ -2834,6 +2881,12 @@ blockquote:before { @@ -2834,6 +2881,12 @@ blockquote:before {
2834 background:rgba(255,255,255,.18); 2881 background:rgba(255,255,255,.18);
2835 2882
2836 } 2883 }
  2884 +.about-concat-btn a{
  2885 + color:#fff;
  2886 +}
  2887 +.about-concat-btn a:hover{
  2888 + color:#e43730;
  2889 +}
2837 .about-concat-con{ 2890 .about-concat-con{
2838 position: relative; 2891 position: relative;
2839 display: flex; 2892 display: flex;
@@ -2842,9 +2895,22 @@ blockquote:before { @@ -2842,9 +2895,22 @@ blockquote:before {
2842 align-items: center; 2895 align-items: center;
2843 } 2896 }
2844 /*lsq 加入我们样式调整*/ 2897 /*lsq 加入我们样式调整*/
2845 -.title-style.color-white,.title-intro.color-white{ 2898 +.title-style.color-white{
2846 color:#fff; 2899 color:#fff;
2847 } 2900 }
  2901 +.about-content-intro{
  2902 + display: none;
  2903 +}
  2904 +.about-intro-title{
  2905 + font-weight: bold;
  2906 +}
  2907 +.about-intro{
  2908 + tab-index: 36px;
  2909 +}
  2910 +.about-intro .about-intro-img{
  2911 + text-align: center;
  2912 +}
  2913 +
2848 .concat-concat .title-style{ 2914 .concat-concat .title-style{
2849 font-size:42px; 2915 font-size:42px;
2850 } 2916 }
@@ -3050,7 +3116,7 @@ blockquote:before { @@ -3050,7 +3116,7 @@ blockquote:before {
3050 width: 100%; 3116 width: 100%;
3051 top: 0; 3117 top: 0;
3052 z-index: -2; 3118 z-index: -2;
3053 - background-size: contain; 3119 + background-size: cover;
3054 background-image: url("../img/serviceSecond/Aview/ability-bg.png"); 3120 background-image: url("../img/serviceSecond/Aview/ability-bg.png");
3055 background-repeat: no-repeat; 3121 background-repeat: no-repeat;
3056 background-position: center; 3122 background-position: center;
@@ -3113,7 +3179,7 @@ blockquote:before { @@ -3113,7 +3179,7 @@ blockquote:before {
3113 cursor: pointer; 3179 cursor: pointer;
3114 } 3180 }
3115 .info-characterP .info-characterP-bg{ 3181 .info-characterP .info-characterP-bg{
3116 - background:url("../img/serviceSecond/Aview/characterP-bg.png"); 3182 + background:url("../img/serviceSecond/Aview/characterP-bg.jpg");
3117 position: absolute; 3183 position: absolute;
3118 height: 100%; 3184 height: 100%;
3119 width: 100%; 3185 width: 100%;
@@ -3124,7 +3190,10 @@ blockquote:before { @@ -3124,7 +3190,10 @@ blockquote:before {
3124 background-position: center; 3190 background-position: center;
3125 } 3191 }
3126 .info-characterP:hover .info-characterP-bg{ 3192 .info-characterP:hover .info-characterP-bg{
3127 - background:url("../img/serviceSecond/Aview/characterP-bg-active.png"); 3193 + background:url("../img/serviceSecond/Aview/characterP-bg-active.jpg");
  3194 + background-size: contain;
  3195 + background-repeat: no-repeat;
  3196 + background-position: center;
3128 3197
3129 } 3198 }
3130 .info-character.info-characterP{ 3199 .info-character.info-characterP{
@@ -3155,7 +3224,7 @@ blockquote:before { @@ -3155,7 +3224,7 @@ blockquote:before {
3155 color:#fff; 3224 color:#fff;
3156 } 3225 }
3157 .Aview-advantage-bg{ 3226 .Aview-advantage-bg{
3158 - background: url("../img/serviceSecond/Aview/advantage-bg.png"); 3227 + background: url("../img/serviceSecond/Aview/advantage-bg.jpg");
3159 background-size: cover; 3228 background-size: cover;
3160 position: absolute; 3229 position: absolute;
3161 height: 100%; 3230 height: 100%;
@@ -3368,6 +3437,7 @@ blockquote:before { @@ -3368,6 +3437,7 @@ blockquote:before {
3368 display: flex; 3437 display: flex;
3369 align-items: center; 3438 align-items: center;
3370 justify-content: space-between; 3439 justify-content: space-between;
  3440 + flex-wrap: wrap;
3371 } 3441 }
3372 .lifeCycle-item:nth-child(2){ 3442 .lifeCycle-item:nth-child(2){
3373 padding: 30px; 3443 padding: 30px;
@@ -3402,7 +3472,7 @@ blockquote:before { @@ -3402,7 +3472,7 @@ blockquote:before {
3402 padding-right:0; 3472 padding-right:0;
3403 } 3473 }
3404 .app-advantage-bg{ 3474 .app-advantage-bg{
3405 - background: url("../img/serviceSecond/cmdb/advantage-bg.png"); 3475 + background: url("../img/serviceSecond/cmdb/advantage-bg.jpg");
3406 background-size: cover; 3476 background-size: cover;
3407 position: absolute; 3477 position: absolute;
3408 height: 100%; 3478 height: 100%;
@@ -3450,8 +3520,11 @@ blockquote:before { @@ -3450,8 +3520,11 @@ blockquote:before {
3450 .kpi-item{ 3520 .kpi-item{
3451 max-width: 170px; 3521 max-width: 170px;
3452 padding:0; 3522 padding:0;
  3523 + padding-right:6px;
  3524 +}
  3525 +.kpi-item:last-child{
  3526 + padding:0;
3453 } 3527 }
3454 -  
3455 .com-item-title{ 3528 .com-item-title{
3456 font-size: 21px; 3529 font-size: 21px;
3457 color:#333333; 3530 color:#333333;
@@ -3473,6 +3546,10 @@ blockquote:before { @@ -3473,6 +3546,10 @@ blockquote:before {
3473 } 3546 }
3474 .com-item-con{ 3547 .com-item-con{
3475 border:1px solid #999; 3548 border:1px solid #999;
  3549 + border-right: none;
  3550 +}
  3551 +.com-item-con:last-child{
  3552 + border:1px solid #999;
3476 } 3553 }
3477 .row-com{ 3554 .row-com{
3478 box-shadow: 0 0 8px rgba(0,0,0,.2); 3555 box-shadow: 0 0 8px rgba(0,0,0,.2);
@@ -3485,7 +3562,7 @@ blockquote:before { @@ -3485,7 +3562,7 @@ blockquote:before {
3485 padding:0; 3562 padding:0;
3486 } 3563 }
3487 .recruit-bg{ 3564 .recruit-bg{
3488 - background: url("../img/concatSecond/banner-con.png"); 3565 + background: url("../img/concatSecond/banner-con.jpg");
3489 background-size: cover; 3566 background-size: cover;
3490 position: absolute; 3567 position: absolute;
3491 height: 100%; 3568 height: 100%;
@@ -3514,7 +3591,7 @@ blockquote:before { @@ -3514,7 +3591,7 @@ blockquote:before {
3514 transition: transform .85s cubic-bezier(0.88, 0.06, 0.64, 0.99); 3591 transition: transform .85s cubic-bezier(0.88, 0.06, 0.64, 0.99);
3515 background:#fff; 3592 background:#fff;
3516 width: 100%; 3593 width: 100%;
3517 - z-index: 2; 3594 + z-index: 3;
3518 } 3595 }
3519 .copyright-a{ 3596 .copyright-a{
3520 color:#848484; 3597 color:#848484;
@@ -3528,30 +3605,156 @@ blockquote:before { @@ -3528,30 +3605,156 @@ blockquote:before {
3528 .home-banner-section .owl-item{ 3605 .home-banner-section .owl-item{
3529 background-size:cover !important; 3606 background-size:cover !important;
3530 } 3607 }
3531 -.about-content .title-style{  
3532 - color:#e43730; 3608 +.about-content-intro .title-style{
  3609 + /*color:#e43730;*/
  3610 + color:#333;
3533 padding-top:140px; 3611 padding-top:140px;
3534 } 3612 }
3535 .about-container{ 3613 .about-container{
3536 height:100%; 3614 height:100%;
3537 } 3615 }
3538 -@media (min-width: 992px){  
3539 - .about-content .title-style{  
3540 - padding-top:180px; 3616 +.about-content .title-style{
  3617 + padding-top:50px;
  3618 +}
  3619 +.office-info li a{
  3620 + color:#FFFFFF;
  3621 +}
  3622 +.office-info li a:hover{
  3623 + color:#e43730;
  3624 +}
  3625 +
  3626 +@media only screen and (max-width:1200px){
  3627 + .info-character.info-characterP{
  3628 + padding:15px;
3541 } 3629 }
  3630 + .characterP-con .info-character-intro{
  3631 + padding-top:10px;
  3632 + }
  3633 +}
  3634 +.recruit-Hot-xl{
  3635 + display:none;
  3636 + margin-bottom: 20px;
  3637 +}
  3638 +.home-bg-1{
  3639 + background: url(../img/index/1.jpg);
  3640 +}
  3641 +.home-bg-2{
  3642 + background: url(../img/index/2.jpg);
3542 } 3643 }
3543 -@media (min-width: 1200px){  
3544 - .about-content .title-style{  
3545 - padding-top:160px; 3644 +.home-bg-3{
  3645 + background: url(../img/index/3.jpg);
  3646 +}
  3647 +.hzlc-sm{
  3648 + display: none;
  3649 +}
  3650 +.footer-title-none{
  3651 + font-weight: 600;
  3652 + position: relative;
  3653 + margin-bottom: 40px;
  3654 + text-transform: capitalize;
  3655 +}
  3656 +@media only screen and (max-width: 1400px){
  3657 + .intro-tab-scroll{
  3658 + transform: translateY(75px);
3546 } 3659 }
3547 } 3660 }
3548 -@media (min-width: 1400px){  
3549 - .about-content .title-style{  
3550 - padding-top:140px; 3661 +@media only screen and (max-width: 1200px){
  3662 + .Aview .tab-item-li {
  3663 + margin-right: 40px;
  3664 + }
  3665 +
  3666 + .dataAbility-con{
  3667 + margin-top:60px;
  3668 + flex-flow: column;
  3669 + max-height: inherit;
  3670 + flex:none;
  3671 + }
  3672 + .dataAbility-bg{
  3673 + /*background-image: url("../img/serviceSecond/Aview/ability-bg-sm.png");*/
  3674 + background-image: none;
  3675 + }
  3676 + .dataAbility-bg-logo{
  3677 + display: none;
  3678 + }
  3679 + .dataAbility-col{
  3680 + max-width: 100%;
  3681 + }
  3682 + .dataAbility-col:nth-child(3) .dataAbility-item .dataAbility-item-intro-item:first-child{
  3683 + max-width: 100%;
  3684 + }
  3685 + .dataAbility-col:nth-child(2n) .dataAbility-item{
  3686 + margin-left:0;
  3687 + }
  3688 + .dataAbility-item{
  3689 + padding: 15px;
  3690 + background: #1E9FFF;
  3691 + margin: 8px 0;
  3692 + border-radius: 3px;
  3693 + }
  3694 + .dataAbility-item-intro-item{
  3695 + min-height: auto;
  3696 + }
  3697 + .dataAbility-item-intro{
  3698 + padding-top:10px;
  3699 + }
  3700 + .info-characterP .info-characterP-bg{
  3701 + background-image:none;
  3702 + background-color:#ffffff;
  3703 + border-radius: 3px;
  3704 + }
  3705 + .info-characterP:hover .info-characterP-bg{
  3706 + background-image:none;
  3707 + background-color:#1E9FFF;
  3708 + border-radius: 3px;
  3709 + }
  3710 + .tab-item-li{
  3711 + margin-right:25px;
3551 } 3712 }
  3713 + .func-bg img{
  3714 + height: 100%;
  3715 + }
  3716 + .func-bottom-con-right{
  3717 + height: 20px;
  3718 + }
  3719 +
3552 } 3720 }
  3721 +
3553 /*992以下的一些样式*/ 3722 /*992以下的一些样式*/
3554 @media only screen and (max-width: 991px){ 3723 @media only screen and (max-width: 991px){
  3724 + .main-menu .navbar-collapse > .navigation{
  3725 + margin-top: 13px;
  3726 + }
  3727 + .dataAbility-con{
  3728 + margin-top:20px;
  3729 + }
  3730 + .tab-item-li,.Aview .tab-item-li{
  3731 + margin-right:30px;
  3732 + }
  3733 + .hzlc-sm{
  3734 + display: block;
  3735 + }
  3736 + .hzlc{
  3737 + display: none;
  3738 + }
  3739 + .recruit-Hot-lg{
  3740 + display:none;
  3741 + }
  3742 + .recruit-Hot-xl{
  3743 + display:block;
  3744 + }
  3745 + .w-70{
  3746 + width: calc(100%) !important;
  3747 + }
  3748 + .m-1em{
  3749 + display: flex;
  3750 + flex-wrap: wrap;
  3751 + }
  3752 + .m-1em li{
  3753 + margin-right:10px;
  3754 + }
  3755 + .hot-recruit-box .hotList>a{
  3756 + text-decoration: underline;
  3757 + }
3555 .home-banner-section{ 3758 .home-banner-section{
3556 padding-top: 0; 3759 padding-top: 0;
3557 } 3760 }
@@ -3567,7 +3770,477 @@ blockquote:before { @@ -3567,7 +3770,477 @@ blockquote:before {
3567 .cultural-item-l img{ 3770 .cultural-item-l img{
3568 max-width: 225px; 3771 max-width: 225px;
3569 } 3772 }
3570 - .info-character-log{ 3773 + .info-character-log,.info-character-busi{
3571 padding:0 15px; 3774 padding:0 15px;
3572 } 3775 }
  3776 + .info-character.info-characterP{
  3777 + padding:50px;
  3778 + }
  3779 + .func-bottom{
  3780 + margin:0;
  3781 + padding-top:0;
  3782 + }
  3783 + .func-bottom-intro{
  3784 + padding:0 15px;
  3785 + flex:1;
  3786 + /*background: #d95447;*/
  3787 + }
  3788 + .func-bottom-title{
  3789 + /*flex:1;*/
  3790 + height:50%;
  3791 + }
  3792 + .func-l-p.func-bottom-intro{
  3793 + padding: 0;
  3794 + }
  3795 + .func-bottom-con-right{
  3796 + height:0;
  3797 + }
  3798 + .func-l-1{
  3799 + /*flex:inherit;*/
  3800 + }
  3801 + .funcIntro-span{
  3802 + padding-right:20px;
  3803 + }
  3804 + .app-bg,.alarm-system{
  3805 + margin-bottom: 20px;
  3806 + }
  3807 + .cloud-content{
  3808 + margin-bottom: 20px;
  3809 + }
  3810 + .concat-concat{
  3811 + padding:20px;
  3812 + }
  3813 + .principle-item{
  3814 + padding:15px;
  3815 + }
  3816 + .owl-item-content{
  3817 + width:100%;
  3818 + left:0;
  3819 + padding:15px;
  3820 + }
  3821 + .count-text{
  3822 + /*原48px*/
  3823 + font-size: 30px;
  3824 + }
  3825 + .success-box i{
  3826 + /*原40px*/
  3827 + font-size:26px;
  3828 + margin-right:0;
  3829 + }
  3830 + .app-advantage-style{
  3831 + padding-top:30px;
  3832 + }
  3833 + .maintenance-advantage-num{
  3834 + font-size: 60px;
  3835 + padding:30px 0;
  3836 + }
  3837 + .info-character.col-md-3{
  3838 + max-width:25%;
  3839 + }
  3840 + .row-top{
  3841 + /*flex:1;*/
  3842 + /*padding:15px;*/
  3843 + }
  3844 + .value-char{
  3845 + flex-flow: column;
  3846 + align-items: flex-start;
  3847 + }
  3848 +
  3849 + .font-size-42,.title-style-top,.page-title,.concat-concat .title-style{
  3850 + /*原42px*/
  3851 + font-size: 28px;
  3852 + }
  3853 + .title-style,.product-title,.func-bottom-title{
  3854 + /*原36px*/
  3855 + font-size: 26px;
  3856 + }
  3857 + .info-title
  3858 + {
  3859 + /*原30px*/
  3860 + font-size: 24px;
  3861 + }
  3862 + .principle-item-title,.compatible-item .title-style,.concat-title,.intro-title{
  3863 + /*原28px*/
  3864 + font-size: 22px;
  3865 + }
  3866 + .concat-btn,.font-size-24,.cloud-c-title,.app-title,.advantage-title-Aview{
  3867 + /*原24px*/
  3868 + font-size: 20px;
  3869 + }
  3870 + .title-intro-top,.product-intro-li,.count-wrap p,.func-top-item,.info-container h4,.con-title-21,.info-child-title,.dataAbility-item-title{
  3871 + /*原21px*/
  3872 + font-size: 18px;
  3873 + }
  3874 + .title-intro,.product-intro,.concat-intro,.list-style-li,.func-bottom-intro,.info-app-intro,
  3875 + .advantage-intro-Aview,.info-child-intro,.dataAbility-item-intro,.dot-item-title{
  3876 + /*原18px*/ /*原16px*/
  3877 + font-size: 14px;
  3878 + }
  3879 + .dot-item-title{
  3880 + min-height: auto;
  3881 + }
  3882 + .pd-40{
  3883 + padding:10px;
  3884 + }
  3885 + .func-bottom-title{
  3886 + flex-flow: column;
  3887 + }
  3888 + .func-top-item{
  3889 + max-width: 50%;
  3890 + padding:3px 5px;
  3891 + text-align: center;
  3892 + }
  3893 + .func-top{
  3894 + flex:1;
  3895 + margin: 0;
  3896 + }
  3897 + .num-icon{
  3898 + width:20px;
  3899 + height:20px;
  3900 + }
  3901 + .wrap section.pt-135{
  3902 + padding-top:20px;
  3903 + }
  3904 + .flaticon-section .col-md-6{
  3905 + max-width: 50%;
  3906 + padding:30px 0 0;
  3907 + }
  3908 + .video-section{
  3909 + padding-top:50px;
  3910 + }
  3911 + .col-lg-service-3{
  3912 + max-width: 33.3%;
  3913 + }
  3914 + .dataAbility-col{
  3915 + /*max-width: 50%;*/
  3916 + }
  3917 + .maintenance-title{
  3918 + padding-top:20px;
  3919 + }
  3920 + .concat-about{
  3921 + background-image: url("../img/about/about-bg-sm.jpg");
  3922 + height: calc(100vh);
  3923 + }
  3924 + .know-intro-bg{
  3925 + background-image: url("../img/about/know-intro-img-sm.jpg");
  3926 + }
  3927 + .partner-img-bg{
  3928 + background-image: url("../img/about/partner-bg-img-sm.png");
  3929 +
  3930 + }
  3931 + .culturalValues-bg{
  3932 + display: none;
  3933 + }
  3934 + .culturalValues-bg-sm{
  3935 + display: block;
  3936 + }
  3937 + .about-concat-bg{
  3938 + background-image: url("../img/about/about-concat-bg-sm.png");
  3939 +
  3940 + }
  3941 +
  3942 + .about-section .container{
  3943 + flex:1;
  3944 + }
  3945 + .about-content-intro .title-style{
  3946 + padding-top:60px;
  3947 + }
  3948 + .home-bg-3{
  3949 + background: url(../img/index/3-sm.png);
  3950 + }
  3951 +
  3952 + .func-bg{
  3953 + display: none;
  3954 + }
  3955 +
  3956 + .func-bg-1{
  3957 + background-image: url("../img/serviceSecond/cmdb/func-1-sm.png");
  3958 + background-size: cover;
  3959 + background-repeat: no-repeat;
  3960 + flex-flow: column;
  3961 + }
  3962 + .func-bg-2{
  3963 + background-image: url("../img/serviceSecond/cmdb/func-2-sm.png");
  3964 + background-size: cover;
  3965 + background-repeat: no-repeat;
  3966 + flex-flow: column;
  3967 + }
  3968 + .func-bg-3{
  3969 + background-image: url("../img/serviceSecond/cmdb/func-3-sm.png");
  3970 + background-size: cover;
  3971 + background-repeat: no-repeat;
  3972 + flex-flow: column;
  3973 + }
  3974 + .func-bg-4{
  3975 + background-image: url("../img/serviceSecond/cmdb/func-4-sm.png");
  3976 + background-size: cover;
  3977 + background-repeat: no-repeat;
  3978 + flex-flow: column;
  3979 + }
  3980 + .func-bg-5{
  3981 + background-image: url("../img/serviceSecond/cmdb/func-5-sm.png");
  3982 + background-size: cover;
  3983 + background-repeat: no-repeat;
  3984 + flex-flow: column;
  3985 + }
  3986 + .func-symbol{
  3987 + font-size: 50px;
  3988 + line-height: 20px;
  3989 + }
  3990 +
  3991 + .funcIntro-span{
  3992 + padding-top:5px;
  3993 + }
  3994 + .dataAbility-bg-logo img{
  3995 + max-width: 60px;
  3996 + }
  3997 + .logo-title{
  3998 + display: none;
  3999 + }
  4000 +
  4001 + .info-container-ability{
  4002 + padding-top:20px;
  4003 + }
  4004 + .info-container-ability.all-height{
  4005 + height:calc(100vh + 60px);
  4006 + }
  4007 + .info-container-system,.info-container-service{
  4008 + margin-bottom: 20px;
  4009 + }
  4010 + .height-50{
  4011 + font-size: 14px;
  4012 + }
  4013 +}
  4014 +.tech-introCon-sm{
  4015 + display: none;
  4016 +}
  4017 +.section-item-sm-icon{
  4018 + display: none;
  4019 +}
  4020 +.footer-mr-35{
  4021 + margin-right: 35px;
  4022 +}
  4023 +@media only screen and (max-width: 768px){
  4024 + .section-item-sm-icon{
  4025 + display: block;
  4026 + color: #333;
  4027 + }
  4028 + .compatible-section{
  4029 + padding:30px 0;
  4030 + }
  4031 + .principle-section,.principle,.route-about-section{
  4032 + padding-top:0;
  4033 + }
  4034 + .principle-section-item{
  4035 + padding-top:10px;
  4036 + }
  4037 + .principle-section-item .mb-35{
  4038 + margin-bottom: 0;
  4039 + }
  4040 + .section-item-sm{
  4041 + display: flex;
  4042 + flex: 1;
  4043 + justify-content: space-between;
  4044 + }
  4045 + .section-item-sm-icon.section-item-active{
  4046 + color:#e43730;
  4047 + }
  4048 + .team-item-left{
  4049 + padding:20px;
  4050 + }
  4051 + .compatible-item{
  4052 + padding:10px 0;
  4053 + }
  4054 + .title-icon{
  4055 + padding:0;
  4056 + }
  4057 + .section-item{
  4058 + display: none;
  4059 + }
  4060 + .tech-item{
  4061 + max-width: 50%;
  4062 + }
  4063 + .tech-title-sm{
  4064 + color:#e43730;
  4065 + padding:10px 0;
  4066 + font-size: 18px;
  4067 + text-align: center;
  4068 + font-weight: bold;
  4069 + }
  4070 + .tech-intro-sm{
  4071 + font-size: 14px;
  4072 + text-align: left;
  4073 + }
  4074 + .tech-item:last-child{
  4075 + max-width: 100%;
  4076 + }
  4077 + .tech-item:last-child .tech-img-con,.tech-item:last-child .tech-introCon-sm{
  4078 + width: 50%;
  4079 + }
  4080 + .tech-item:last-child .tech-img-con{
  4081 + padding-right:15px;
  4082 + }
  4083 + .tech-item:last-child .tech-introCon-sm{
  4084 + padding-left:15px;
  4085 + }
  4086 + .tech-item:last-child .service-icon{
  4087 + flex-flow: row;
  4088 + }
  4089 + .tech-title-num,.tech-title,.service-icon .tooltip{
  4090 + display: none;
  4091 + }
  4092 + .single-service-box{
  4093 + box-shadow: none;
  4094 + }
  4095 + .tech-img{
  4096 + background:#f9f9fb;
  4097 + }
  4098 + .owl-carousel.owl-loaded.team-carousel-sm,.tech-introCon-sm{
  4099 + display: block;
  4100 + }
  4101 + .owl-carousel.team-carousel-sm button.owl-dot{
  4102 + background:#f3f5f8;
  4103 + width: 30px;
  4104 + height: 4px;
  4105 + border-radius: 3px;
  4106 + margin:0 6px;
  4107 + }
  4108 + .owl-carousel.team-carousel-sm button.owl-dot.active{
  4109 + background:#e43730;
  4110 + }
  4111 + .qualification-bg,.owl-carousel.owl-loaded.team-carousel{
  4112 + display: none;
  4113 + }
  4114 + .qualification-con{
  4115 + left:0;
  4116 + }
  4117 + .qualification-section .owl-carousel .owl-item img{
  4118 + max-height: 200px;
  4119 + }
  4120 + .qualification-con .qualification-item .item-con{
  4121 + border:none;
  4122 + }
  4123 + .qualification-con .qualification-item{
  4124 + height: 300px;
  4125 + padding:10px;
  4126 + background:#f3f5f8;
  4127 + flex-flow: column;
  4128 + justify-content: center;
  4129 + opacity: .6;
  4130 + }
  4131 + .owl-carousel.team-carousel-sm .owl-item.active.center .qualification-item{
  4132 + opacity: 1;
  4133 + }
  4134 + .qualification-con .qualification-item .item-name{
  4135 + padding-top:10px;
  4136 + font-size: 12px;
  4137 + }
  4138 + .about-concat{
  4139 + margin-top: 0;
  4140 + top:0;
  4141 + }
  4142 + .about-content-intro{
  4143 + display: block;
  4144 + }
  4145 + .about-content-intro .mb-35{
  4146 + margin-bottom: 20px;
  4147 + }
  4148 + .step-route-bg-sm{
  4149 + display: block;
  4150 + }
  4151 + .step-route-bg,.know-intro-bg,.about-process-container{
  4152 + display: none;
  4153 + }
  4154 + .rmb-50{
  4155 + margin-bottom: 20px;
  4156 + }
  4157 + .principle-con{
  4158 + align-items: flex-start;
  4159 + }
  4160 + .principle-item{
  4161 + padding:15px 40px;
  4162 + }
  4163 + .wrap{
  4164 + height: auto;
  4165 + overflow-y: auto;
  4166 + }
  4167 + .wrap section{
  4168 + height: auto;
  4169 + }
  4170 + .wrap section:nth-child(1),.wrap section:nth-child(3),.wrap section:nth-child(5){
  4171 + min-height: 400px;
  4172 + }
  4173 + .footer-widget{
  4174 + text-align: center;
  4175 + }
  4176 + .footer-title-none{
  4177 + margin-bottom: 0;
  4178 + }
  4179 + .office-info li{
  4180 + justify-content: center;
  4181 + }
  4182 + .about-concat .about-concat-title{
  4183 + padding:20px 0 0;
  4184 + }
  4185 + .about-concat-con{
  4186 + padding-bottom: 20px;
  4187 + }
  4188 + .culturalValues-container .pt-60,.partner-section{
  4189 + padding-top:0;
  4190 + }
  4191 + .partner-section,.qualification-section{
  4192 + padding-bottom: 20px;
  4193 + }
  4194 + .about-content-intro .title-style{
  4195 + padding-top:30px;
  4196 + }
  4197 + .info-character.info-characterP{
  4198 + padding:15px;
  4199 + }
  4200 + .product .pt-60{
  4201 + padding-top:30px;
  4202 + }
  4203 + .rel.text-left{
  4204 + padding-top:0;
  4205 + }
  4206 + .intro-tab{
  4207 + display: none;
  4208 + }
  4209 + .cloud-icon-item{
  4210 + max-width: 33.3%;
  4211 + }
  4212 + .kpi-row{
  4213 + margin:0;
  4214 + }
  4215 + .kpi-item{
  4216 + padding:10px 6px;
  4217 + }
  4218 + .kpi-item:last-child{
  4219 + padding:10px 6px;
  4220 + }
  4221 + .com-item{
  4222 + padding:0 10px;
  4223 + }
  4224 + .row-bottom{
  4225 + /*display: none;*/
  4226 + }
  4227 + .lifeCycle-item:nth-child(2) .lifeCycle-intro-item{
  4228 + width:50%;
  4229 + }
  4230 + .hero-section{
  4231 + padding-top:70px;
  4232 + }
  4233 + .main-header{
  4234 + top:0;
  4235 + }
  4236 + .header-inner{
  4237 + padding:0!important;
  4238 + }
  4239 + .footer-mr-35{
  4240 + margin-right: 0;
  4241 + }
  4242 + .wrap .concat-about{
  4243 + height: calc(100vh);
  4244 + }
  4245 +
3573 } 4246 }

249 KB | W: | H:

186 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
  1 +export function introDatas() {
  2 + let res = [
  3 + {
  4 + img:'assets/img/about/intro-1.jpg',
  5 + title:'',
  6 + intro:'北京鸿果科技公司于2014年成立，位于中关村核心区域，致力于提供“4S”（Software-软件，Service-服务，Solution-解决方案，Sale-销售）信息化解决方案。公司专注于软件解决方案和整体服务交付，已成为政府、央企等重要行业“IT智能监控”+“数字化业务智能监控”领域的领先者。'
  7 + },
  8 + {
  9 + img:'',
  10 + title:'北京总部和西安技术中心',
  11 + intro:'目前在北京、西安拥有技术研发团队和服务基地，组建了专业的智能监控和软件服务团队，为公司带来专业化的研发和服务能力。'
  12 + },
  13 + {
  14 + img:'',
  15 + title:'精研“AI+大数据”软件产品线',
  16 + intro:'北京鸿果科技拥有自主研发力量和“政府”行业服务交付经验，率先把握“互联网+智能化AI+行业场景应用”的变革时机，充分发挥AI时代的业务大数据处理能力，运用智能化、运维大数据思维，引入AI算法+大数据+行业场景化对业务的深度应用，共同打造AI+大数据生态圈以及可落地的解决方案。'
  17 + },
  18 + {
  19 + img:'assets/img/about/intro-2.jpg',
  20 + title:'专业服务与高客户满意度',
  21 + intro:'公司高度重视客户服务工作，以“高客户满意度”为经营宗旨，践行AI+大数据体系强落地能力，同时具备完整的一线、二线技术支持体系，可覆盖全国营销和售后服务网络，使北京鸿果科技能够为政府及更多重大行业的用户提供全方位、专业化的自研软件产品及端到端的优质服务。'
  22 + }
  23 + ]
  24 + return res;
  25 +}
1 export function culturalValuesDatas() { 26 export function culturalValuesDatas() {
2 let res = [ 27 let res = [
3 { 28 {
@@ -41,24 +66,28 @@ export function culturalDatas() { @@ -41,24 +66,28 @@ export function culturalDatas() {
41 } 66 }
42 export function imgsDatas() { 67 export function imgsDatas() {
43 let res = [{ 68 let res = [{
44 - name:'质量管理体系认证证书', 69 + name:'北京市“专精特新”中小企业',
45 path:'assets/img/about/certificate/1.png' 70 path:'assets/img/about/certificate/1.png'
46 },{ 71 },{
47 - name:'技术服务管理体系认证证书', 72 + name:'信息技术服务标准符合性证书',
48 path:'assets/img/about/certificate/2.png' 73 path:'assets/img/about/certificate/2.png'
49 },{ 74 },{
50 - name:'连续性管理体系认证证书', 75 + name:'软件成熟度认证',
51 path:'assets/img/about/certificate/3.png' 76 path:'assets/img/about/certificate/3.png'
52 },{ 77 },{
53 - name:'信息安全管理体系认证证书', 78 + name:'信息安全服务资质认证证书',
54 path:'assets/img/about/certificate/4.png' 79 path:'assets/img/about/certificate/4.png'
55 },{ 80 },{
  81 + name:'信息安全管理体系认证证书',
56 path:'assets/img/about/certificate/5.png' 82 path:'assets/img/about/certificate/5.png'
57 },{ 83 },{
  84 + name:'业务连续性管理体系认证证书',
58 path:'assets/img/about/certificate/6.png' 85 path:'assets/img/about/certificate/6.png'
59 },{ 86 },{
  87 + name:'信息技术服务管理体系认证证书',
60 path:'assets/img/about/certificate/7.png' 88 path:'assets/img/about/certificate/7.png'
61 },{ 89 },{
  90 + name:'质量管理体系认证证书',
62 path:'assets/img/about/certificate/8.png' 91 path:'assets/img/about/certificate/8.png'
63 }] 92 }]
64 return res; 93 return res;
1 export function homeDatas() { 1 export function homeDatas() {
2 let res=[ 2 let res=[
3 - {  
4 - title:'“魔镜智能”全面完成国产化兼容适配认证',  
5 - introduction:'鸿果科技旗下“魔镜智能”完成对主流国产服务器、数据库、操作系统、中间件等兼容适配，并取得一系列兼容性认证',  
6 - isService:false,  
7 - isConcat:false,  
8 - }, 3 +
9 { 4 {
10 title:'不仅仅是智能化运维,', 5 title:'不仅仅是智能化运维,',
11 title1:'提供一站式的IT运维管理平台', 6 title1:'提供一站式的IT运维管理平台',
@@ -15,10 +10,16 @@ export function homeDatas() { @@ -15,10 +10,16 @@ export function homeDatas() {
15 }, 10 },
16 { 11 {
17 title:'运维数字化道路，鸿果与您同行', 12 title:'运维数字化道路，鸿果与您同行',
18 - introTitle:'鸿果自研的产品——魔镜智能运维',  
19 - introduction:'数据是智能运维的基石，算法是挖掘数据价值的关键，技术是实现智能运维的手段', 13 + introTitle:'鸿果自研产品—魔镜智能运维',
  14 + introduction:'“大数据”是智能运维的基石，“算法”是关联分析数据价值的引擎，“场景”是实现智能运维的深度应用。',
20 isService:true, 15 isService:true,
21 isConcat:true, 16 isConcat:true,
  17 + },
  18 + {
  19 + title:'“魔镜智能”全面完成国产化兼容适配认证',
  20 + introduction:'鸿果科技旗下“魔镜智能”完成对主流国产服务器、数据库、操作系统、中间件等兼容适配，并取得一系列兼容性认证',
  21 + isService:false,
  22 + isConcat:false,
22 } 23 }
23 ] 24 ]
24 return res 25 return res
@@ -137,30 +138,35 @@ export function logoDatas(){ @@ -137,30 +138,35 @@ export function logoDatas(){
137 id:'1', 138 id:'1',
138 logoUrl:'logo-dong-default', 139 logoUrl:'logo-dong-default',
139 logoUrlTip:'logo-dong', 140 logoUrlTip:'logo-dong',
  141 + name:'东方通',
140 active:true 142 active:true
141 }, 143 },
142 { 144 {
143 id:'2', 145 id:'2',
144 logoUrl:'logo-da-default', 146 logoUrl:'logo-da-default',
145 logoUrlTip:'logo-da', 147 logoUrlTip:'logo-da',
  148 + name:'达梦数据库',
146 active:false 149 active:false
147 }, 150 },
148 { 151 {
149 id:'3', 152 id:'3',
150 logoUrl:'logo-nan-default', 153 logoUrl:'logo-nan-default',
151 logoUrlTip:'logo-nan', 154 logoUrlTip:'logo-nan',
  155 + name:'南大通用',
152 active:false 156 active:false
153 }, 157 },
154 { 158 {
155 id:'4', 159 id:'4',
156 logoUrl:'logo-ren-default', 160 logoUrl:'logo-ren-default',
157 logoUrlTip:'logo-ren', 161 logoUrlTip:'logo-ren',
  162 + name:'人大金仓',
158 active:false 163 active:false
159 }, 164 },
160 { 165 {
161 id:'5', 166 id:'5',
162 logoUrl:'logo-tong-default', 167 logoUrl:'logo-tong-default',
163 logoUrlTip:'logo-tong', 168 logoUrlTip:'logo-tong',
  169 + name:'统信UOS',
164 active:false 170 active:false
165 } 171 }
166 ] 172 ]
@@ -3,7 +3,7 @@ export function productDatas(){ @@ -3,7 +3,7 @@ export function productDatas(){
3 { 3 {
4 title:'综合告警智能算法平台', 4 title:'综合告警智能算法平台',
5 introduction:'能快速接入各类告警信息，通过告警算法自动去重、规则压缩、算法降噪，实现告警降噪，避免告警风暴，更快响应告警，提升告警管理能力', 5 introduction:'能快速接入各类告警信息，通过告警算法自动去重、规则压缩、算法降噪，实现告警降噪，避免告警风暴，更快响应告警，提升告警管理能力',
6 - introData:['基于业务的告警统一管理','基于算法的智能合并降噪','支持固定阈值、同环比，预测性异常检测','兼容并包，开放告警'], 6 + introData:['基于“专业分散”业务的告警统一管理','基于算法的智能合并降噪','可实现预测性异常检测和趋势分析','兼容并包，开放告警'],
7 type:'alarm' 7 type:'alarm'
8 }, 8 },
9 { 9 {
@@ -13,7 +13,7 @@ export function productDatas(){ @@ -13,7 +13,7 @@ export function productDatas(){
13 type:'Aview' 13 type:'Aview'
14 }, 14 },
15 { 15 {
16 - title:'CMDB资产管理', 16 + title:'面向应用的CMDB资产管理',
17 introduction:'建立以应用为中心的资源管理模型，促进资产到资源的转变', 17 introduction:'建立以应用为中心的资源管理模型，促进资产到资源的转变',
18 introData:['随需而动的资源管理模型','独有的双模自动发现能力','面向业务的关联分析','丰富多样的服务化API'], 18 introData:['随需而动的资源管理模型','独有的双模自动发现能力','面向业务的关联分析','丰富多样的服务化API'],
19 type:'cmdb' 19 type:'cmdb'
@@ -44,7 +44,7 @@ export function productDatas(){ @@ -44,7 +44,7 @@ export function productDatas(){
44 }, 44 },
45 { 45 {
46 title:'魔镜智能多云运维平台', 46 title:'魔镜智能多云运维平台',
47 - introduction:'支持了国内外所有主流云厂商，包含混合云、多云环境下对云资源统一管理和调度，提供系统映像、通过既定策略优化工作负载，系统运行状态，以及任务执行过程的可视化监控，并提供丰富的告警机制帮助客户进行快速处理。对复杂的多云异构环境实现统一管理（虚拟化平台、超融合、私有云、专有云、公有云、混合云中任意组合）提供便捷的管理操作，从基础设施到应用实现全栈管理', 47 + introduction:'对复杂的多云异构环境实现统一管理（虚拟化平台、超融合、私有云、专有云、公有云、混合云中任意组合）提供便捷的管理操作，从基础设施到应用实现全栈管理。',
48 introData:['多云资源统一管理','多云环境自动化编排','多云资源统一运维和监控','多维数据可视化'], 48 introData:['多云资源统一管理','多云环境自动化编排','多云资源统一运维和监控','多维数据可视化'],
49 type:'cloud' 49 type:'cloud'
50 } 50 }
@@ -34,7 +34,7 @@ export function Information() { @@ -34,7 +34,7 @@ export function Information() {
34 { 34 {
35 title:'系统框架', 35 title:'系统框架',
36 introduction:'安全运维服务流程的系统架构', 36 introduction:'安全运维服务流程的系统架构',
37 - img:'assets/img/serviceSecond/information/system.png', 37 + img:'assets/img/serviceSecond/information/system.jpg',
38 type:'system' 38 type:'system'
39 }, 39 },
40 { 40 {
@@ -45,25 +45,25 @@ export function Information() { @@ -45,25 +45,25 @@ export function Information() {
45 icon:'assets/img/serviceSecond/information/advantage-1.png', 45 icon:'assets/img/serviceSecond/information/advantage-1.png',
46 title: '“护网”“等保”各规章变成“流程”强制性管控', 46 title: '“护网”“等保”各规章变成“流程”强制性管控',
47 introduction:'特点：规章落地 提前约束 流程强制 全程留痕', 47 introduction:'特点：规章落地 提前约束 流程强制 全程留痕',
48 - img:'assets/img/serviceSecond/information/advantageImg-1.png' 48 + img:'assets/img/serviceSecond/information/advantageImg-1.jpg'
49 }, 49 },
50 { 50 {
51 icon:'assets/img/serviceSecond/information/advantage-2.png', 51 icon:'assets/img/serviceSecond/information/advantage-2.png',
52 title:'通过'+"“安全流程”"+'提前管控日常操作、留痕', 52 title:'通过'+"“安全流程”"+'提前管控日常操作、留痕',
53 introduction:'', 53 introduction:'',
54 - img:'assets/img/serviceSecond/information/advantageImg-2.png' 54 + img:'assets/img/serviceSecond/information/advantageImg-2.jpg'
55 }, 55 },
56 { 56 {
57 icon:'assets/img/serviceSecond/information/advantage-3.png', 57 icon:'assets/img/serviceSecond/information/advantage-3.png',
58 title:'税务局业务流程目录、展示、流程的分类管理', 58 title:'税务局业务流程目录、展示、流程的分类管理',
59 introduction:'', 59 introduction:'',
60 - img:'assets/img/serviceSecond/information/advantageImg-3.png' 60 + img:'assets/img/serviceSecond/information/advantageImg-3.jpg'
61 }, 61 },
62 { 62 {
63 icon:'assets/img/serviceSecond/information/advantage-4.png', 63 icon:'assets/img/serviceSecond/information/advantage-4.png',
64 title:'工作组、用户权限的灵活配置', 64 title:'工作组、用户权限的灵活配置',
65 introduction:'', 65 introduction:'',
66 - img:'assets/img/serviceSecond/information/advantageImg-4.png' 66 + img:'assets/img/serviceSecond/information/advantageImg-4.jpg'
67 } 67 }
68 ], 68 ],
69 type:'advantage' 69 type:'advantage'
@@ -75,17 +75,17 @@ export function Information() { @@ -75,17 +75,17 @@ export function Information() {
75 { 75 {
76 title:'标准化', 76 title:'标准化',
77 introduction:'信息、流程、时间全面统一，高效协同', 77 introduction:'信息、流程、时间全面统一，高效协同',
78 - img:'assets/img/serviceSecond/information/value-bg.png' 78 + img:'assets/img/serviceSecond/information/value-bg.jpg'
79 }, 79 },
80 { 80 {
81 title:'规范化', 81 title:'规范化',
82 introduction:'理清流程、制度落地，业务按标准执行', 82 introduction:'理清流程、制度落地，业务按标准执行',
83 - img:'assets/img/serviceSecond/information/value-bg.png' 83 + img:'assets/img/serviceSecond/information/value-bg.jpg'
84 }, 84 },
85 { 85 {
86 title:'透明化', 86 title:'透明化',
87 introduction:'流程申请、流程进度、流程审批全程可观', 87 introduction:'流程申请、流程进度、流程审批全程可观',
88 - img:'assets/img/serviceSecond/information/value-bg.png' 88 + img:'assets/img/serviceSecond/information/value-bg.jpg'
89 } 89 }
90 ], 90 ],
91 type:'value' 91 type:'value'
@@ -117,19 +117,19 @@ export function securityLog() { @@ -117,19 +117,19 @@ export function securityLog() {
117 introduction:'', 117 introduction:'',
118 dataFour:[ 118 dataFour:[
119 { 119 {
120 - img:'assets/img/serviceSecond/securityLog/advantageImg-1.png', 120 + img:'assets/img/serviceSecond/securityLog/advantageImg-1.jpg',
121 title:'高效数据处理能力', 121 title:'高效数据处理能力',
122 introduction:'日志综合智能分析平台采用大数据架构进行数据的采集、存储、分析和检索。日志采集综合处理均值20000条/秒。数据采用高压缩存储算法，压缩比达到10：1。数据检索采用专业化日志查询引擎，百亿级日志量查询速率只需秒级。直观展示安全事件发生时间、访问源、危险等级及影响范围的分布情况。', 122 introduction:'日志综合智能分析平台采用大数据架构进行数据的采集、存储、分析和检索。日志采集综合处理均值20000条/秒。数据采用高压缩存储算法，压缩比达到10：1。数据检索采用专业化日志查询引擎，百亿级日志量查询速率只需秒级。直观展示安全事件发生时间、访问源、危险等级及影响范围的分布情况。',
123 isDisplay:true 123 isDisplay:true
124 }, 124 },
125 { 125 {
126 - img:'assets/img/serviceSecond/securityLog/advantageImg-2.png', 126 + img:'assets/img/serviceSecond/securityLog/advantageImg-2.jpg',
127 title:'基于策略分析的安全事件响应', 127 title:'基于策略分析的安全事件响应',
128 introduction:'日志综合智能分析平台基于状态分析的安全事件规则能够帮助用户对全网安全事件进行全方位定位，快速发现可疑行为、违规事件和攻击行为。基于时间线性的回溯分析能够帮助用户轻松了解到违规事件的时间、发生源、违规操作设备、操作行为，通过图形化还原违规行为现场，作为事后追溯的有力证据。', 128 introduction:'日志综合智能分析平台基于状态分析的安全事件规则能够帮助用户对全网安全事件进行全方位定位，快速发现可疑行为、违规事件和攻击行为。基于时间线性的回溯分析能够帮助用户轻松了解到违规事件的时间、发生源、违规操作设备、操作行为，通过图形化还原违规行为现场，作为事后追溯的有力证据。',
129 isDisplay:true 129 isDisplay:true
130 }, 130 },
131 { 131 {
132 - img:'assets/img/serviceSecond/securityLog/advantageImg-3.png', 132 + img:'assets/img/serviceSecond/securityLog/advantageImg-3.jpg',
133 title:'可视化日志展示', 133 title:'可视化日志展示',
134 introduction:'日志综合智能分析支持对日志查询结果进行在线快速自动分析，提供事件计数统计、时间分段环比统计、数值分段统计、字段值分类统计、字段数值统计、累计百分比统计、地理统计等统计功能，并以直观形象的统计图表（饼型图、直方图、堆积图、折线图等）来展现日志数据统计结果，并可将统计图表保存到自定义仪表盘上，方便用户随时查看。', 134 introduction:'日志综合智能分析支持对日志查询结果进行在线快速自动分析，提供事件计数统计、时间分段环比统计、数值分段统计、字段值分类统计、字段数值统计、累计百分比统计、地理统计等统计功能，并以直观形象的统计图表（饼型图、直方图、堆积图、折线图等）来展现日志数据统计结果，并可将统计图表保存到自定义仪表盘上，方便用户随时查看。',
135 isDisplay:true 135 isDisplay:true
@@ -190,7 +190,7 @@ export function businessApp () { @@ -190,7 +190,7 @@ export function businessApp () {
190 subTitle:'随时掌握应用性能对业务的影响', 190 subTitle:'随时掌握应用性能对业务的影响',
191 introduction:'魔镜APM基于实时的多语言应用探针全量采集技术，全方位 保障系统的可用性与性能表现，帮助企业有效地降低MTTR、 提升开发运维效率、改善用户体验。', 191 introduction:'魔镜APM基于实时的多语言应用探针全量采集技术，全方位 保障系统的可用性与性能表现，帮助企业有效地降低MTTR、 提升开发运维效率、改善用户体验。',
192 type:'info', 192 type:'info',
193 - subImg:'assets/img/serviceSecond/businessApp/info.png', 193 + subImg:'assets/img/serviceSecond/businessApp/info.jpg',
194 dataIcon:[ 194 dataIcon:[
195 {icon:'assets/img/serviceSecond/businessApp/info-icon-1.png'}, 195 {icon:'assets/img/serviceSecond/businessApp/info-icon-1.png'},
196 {icon:'assets/img/serviceSecond/businessApp/info-icon-2.png'}, 196 {icon:'assets/img/serviceSecond/businessApp/info-icon-2.png'},
@@ -204,28 +204,28 @@ export function businessApp () { @@ -204,28 +204,28 @@ export function businessApp () {
204 introduction:'', 204 introduction:'',
205 dataApm:[ 205 dataApm:[
206 { 206 {
207 - img:'assets/img/serviceSecond/businessApp/apm-1.png', 207 + img:'assets/img/serviceSecond/businessApp/apm-1.jpg',
208 title:'智能分析', 208 title:'智能分析',
209 introData:[ 209 introData:[
210 '基于AIOps技术智能分析事务问题根因','基于异常检则算法和动态基线进行智能警报','异常和错误支持根因分析','指标相关性分析帮助缩小排查范围' 210 '基于AIOps技术智能分析事务问题根因','基于异常检则算法和动态基线进行智能警报','异常和错误支持根因分析','指标相关性分析帮助缩小排查范围'
211 ] 211 ]
212 }, 212 },
213 { 213 {
214 - img:'assets/img/serviceSecond/businessApp/apm-2.png', 214 + img:'assets/img/serviceSecond/businessApp/apm-2.jpg',
215 title:'代码级诊断', 215 title:'代码级诊断',
216 introData:[ 216 introData:[
217 '深入代码到每一行，缩短性能问题定位流 程，节省宝贵的开发时间','提供详细的代码堆栈','自动化的实时诊断，同时支持自定义嵌码' 217 '深入代码到每一行，缩短性能问题定位流 程，节省宝贵的开发时间','提供详细的代码堆栈','自动化的实时诊断，同时支持自定义嵌码'
218 ] 218 ]
219 }, 219 },
220 { 220 {
221 - img:'assets/img/serviceSecond/businessApp/apm-3.png', 221 + img:'assets/img/serviceSecond/businessApp/apm-3.jpg',
222 title:'调用链追踪', 222 title:'调用链追踪',
223 introData:[ 223 introData:[
224 '无限层级追踪调用链','快速定位性能瓶颈','丰富的追踪上下文信息','支持异步调用追踪' 224 '无限层级追踪调用链','快速定位性能瓶颈','丰富的追踪上下文信息','支持异步调用追踪'
225 ] 225 ]
226 }, 226 },
227 { 227 {
228 - img:'assets/img/serviceSecond/businessApp/apm-4.png', 228 + img:'assets/img/serviceSecond/businessApp/apm-4.jpg',
229 title:'微服务治理', 229 title:'微服务治理',
230 introData:[ 230 introData:[
231 '梳理微服务依赖关系','跨平台、多语言、多协议、多框架','实时监控业务的健康度','批量部署，自动发现' 231 '梳理微服务依赖关系','跨平台、多语言、多协议、多框架','实时监控业务的健康度','批量部署，自动发现'
@@ -347,49 +347,49 @@ export function maintenance() { @@ -347,49 +347,49 @@ export function maintenance() {
347 introduction:'', 347 introduction:'',
348 dataFour:[ 348 dataFour:[
349 { 349 {
350 - img:'assets/img/serviceSecond/maintenance/character-1.png', 350 + img:'assets/img/serviceSecond/maintenance/character-1.jpg',
351 title:'动态关联IT与业务', 351 title:'动态关联IT与业务',
352 introduction:'从业务视角出发，将不同维度的IT资源关联整合，以简洁易懂的界面呈现业务与资源的关联关系。广泛的资源监控能力，任何影响业务的因素都及时体现，使IT运维效率得到大幅提升。', 352 introduction:'从业务视角出发，将不同维度的IT资源关联整合，以简洁易懂的界面呈现业务与资源的关联关系。广泛的资源监控能力，任何影响业务的因素都及时体现，使IT运维效率得到大幅提升。',
353 isDisplay:true 353 isDisplay:true
354 }, 354 },
355 { 355 {
356 - img:'assets/img/serviceSecond/maintenance/character-2.png', 356 + img:'assets/img/serviceSecond/maintenance/character-2.jpg',
357 title:'业务健康随时掌控', 357 title:'业务健康随时掌控',
358 introduction:'预置业务运维综合评价机制，基于“繁忙度”“健康度”“可用性”等多维度的业务性能监控指标，以业务运维状态卡片的方式直观展现业务状态，确保业务的正常运行。', 358 introduction:'预置业务运维综合评价机制，基于“繁忙度”“健康度”“可用性”等多维度的业务性能监控指标，以业务运维状态卡片的方式直观展现业务状态，确保业务的正常运行。',
359 isDisplay:true 359 isDisplay:true
360 }, 360 },
361 { 361 {
362 - img:'assets/img/serviceSecond/maintenance/character-3.png', 362 + img:'assets/img/serviceSecond/maintenance/character-3.jpg',
363 title:'故障根因分析溯源', 363 title:'故障根因分析溯源',
364 introduction:'业务系统出现故障时，根据实际业务服务模型，通过业务视图与IT资源间的关联性，实时映射基础设施监控（IM）中影响服务的告警事件，准确定位故障根源、快速恢复业务，并可设置优先级。', 364 introduction:'业务系统出现故障时，根据实际业务服务模型，通过业务视图与IT资源间的关联性，实时映射基础设施监控（IM）中影响服务的告警事件，准确定位故障根源、快速恢复业务，并可设置优先级。',
365 isDisplay:true 365 isDisplay:true
366 }, 366 },
367 { 367 {
368 - img:'assets/img/serviceSecond/maintenance/character-4.png', 368 + img:'assets/img/serviceSecond/maintenance/character-4.jpg',
369 title:'智能告警中心', 369 title:'智能告警中心',
370 introduction:'实现现有的多种告警源的通知方式及工单系统进行联动，实现统一接入、分级展示、告警降噪、告警处理、告警推送、告警关闭这一系列告警事件的闭环管理，支持告警升/降级，根据故障影响范围和终端用户判定处理优先级。', 370 introduction:'实现现有的多种告警源的通知方式及工单系统进行联动，实现统一接入、分级展示、告警降噪、告警处理、告警推送、告警关闭这一系列告警事件的闭环管理，支持告警升/降级，根据故障影响范围和终端用户判定处理优先级。',
371 isDisplay:true 371 isDisplay:true
372 }, 372 },
373 { 373 {
374 - img:'assets/img/serviceSecond/maintenance/character-5.png', 374 + img:'assets/img/serviceSecond/maintenance/character-5.jpg',
375 title:'提供IT规划参考依据', 375 title:'提供IT规划参考依据',
376 introduction:'提供的业务负载情况及增长趋势曲线，可以对IT资源与业务情况进行评估，定位系统性能瓶颈和容量预警，为管理者提供扩容建议和参考，为IT投资提供量化依据。', 376 introduction:'提供的业务负载情况及增长趋势曲线，可以对IT资源与业务情况进行评估，定位系统性能瓶颈和容量预警，为管理者提供扩容建议和参考，为IT投资提供量化依据。',
377 isDisplay:true 377 isDisplay:true
378 }, 378 },
379 { 379 {
380 - img:'assets/img/serviceSecond/maintenance/character-6.png', 380 + img:'assets/img/serviceSecond/maintenance/character-6.jpg',
381 title:'低代码开发技术设计，实现可视化服务编排', 381 title:'低代码开发技术设计，实现可视化服务编排',
382 introduction:'提供低代码开发、降低使用门槛，运维人员不必重新构建基础工具，利用平台能力随需进行快速轻量级开发。支持多语言框架，包括但不限于Python、Java、shell、perl等语言，提供可拖拽式前端开发工具，实现前端布局可视化。提供自动化编译、构建、部署、执行等操作，实现自动部署，集成统一登录、WEB 安全防护模块、功能组件模块等通用模块。', 382 introduction:'提供低代码开发、降低使用门槛，运维人员不必重新构建基础工具，利用平台能力随需进行快速轻量级开发。支持多语言框架，包括但不限于Python、Java、shell、perl等语言，提供可拖拽式前端开发工具，实现前端布局可视化。提供自动化编译、构建、部署、执行等操作，实现自动部署，集成统一登录、WEB 安全防护模块、功能组件模块等通用模块。',
383 isDisplay:true 383 isDisplay:true
384 }, 384 },
385 { 385 {
386 - img:'assets/img/serviceSecond/maintenance/character-7.png', 386 + img:'assets/img/serviceSecond/maintenance/character-7.jpg',
387 title:'形成以面向业务场景为驱动的服务型CMDB', 387 title:'形成以面向业务场景为驱动的服务型CMDB',
388 introduction:'构建符合云架构、智能监控、自动化运维的轻量级CMDB，并形成数据中心枢纽，支持多种业务场景，比如资产管理、资源可视化、运维监控、自动化运维、多云管理等等。', 388 introduction:'构建符合云架构、智能监控、自动化运维的轻量级CMDB，并形成数据中心枢纽，支持多种业务场景，比如资产管理、资源可视化、运维监控、自动化运维、多云管理等等。',
389 isDisplay:true 389 isDisplay:true
390 }, 390 },
391 { 391 {
392 - img:'assets/img/serviceSecond/maintenance/character-8.png', 392 + img:'assets/img/serviceSecond/maintenance/character-8.jpg',
393 title:'丰富的分析算法 拖拽式算法模型 对运维数据应用提供了无限可能', 393 title:'丰富的分析算法 拖拽式算法模型 对运维数据应用提供了无限可能',
394 introduction:'提供AI算法涵盖聚类、分类、回归、自然语言处理、时间序列、关联、综合评价、推荐等8大类机器学习算法。用户基干这些算法构建模型，从而开展深度数据分析，发掘蕴藏在业务数据中价值。算法分析提供了拖拽式可视化的建模功能，让用户可以通过拖拽的方式搭建机器学习实验。根据算法的不同特点选用Spark、Python等不同框架进行实现，真正做到成熟、稳定、简单、易用。', 394 introduction:'提供AI算法涵盖聚类、分类、回归、自然语言处理、时间序列、关联、综合评价、推荐等8大类机器学习算法。用户基干这些算法构建模型，从而开展深度数据分析，发掘蕴藏在业务数据中价值。算法分析提供了拖拽式可视化的建模功能，让用户可以通过拖拽的方式搭建机器学习实验。根据算法的不同特点选用Spark、Python等不同框架进行实现，真正做到成熟、稳定、简单、易用。',
395 isDisplay:true 395 isDisplay:true
@@ -429,7 +429,7 @@ export function alarm() { @@ -429,7 +429,7 @@ export function alarm() {
429 data:[ 429 data:[
430 { 430 {
431 title:'产品信息', 431 title:'产品信息',
432 - introduction:'接入各个监控平台的告警与事件，通讨智能算法关联压缩告警数据，帮助识别告警根源，通过自动去重，规则压缩，算法降噪，实现告警降噪，帮助运维团队减少告警，避免告警风暴;同时通过分派、排班、通知等功能，快速实现告警流程化管理，帮助运维团队更快响应告警，以多种方式通知告警到相关人员，全面提升告警管理能力', 432 + introduction:'接入各个监控平台的告警与事件，通过智能算法关联压缩告警数据，帮助识别告警根源，通过自动去重、规则压缩、算法降噪，实现告警降噪，帮助运维团队减少告警，避免告警风暴；同时通过分派、排班、通知等功能，快速实现告警流程化管理，帮助运维团队更快响应告警，以多种方式通知告警到相关人员，全面提升告警管理能力。',
433 type:'info' 433 type:'info'
434 }, 434 },
435 { 435 {
@@ -440,17 +440,17 @@ export function alarm() { @@ -440,17 +440,17 @@ export function alarm() {
440 { 440 {
441 icon:'assets/img/serviceSecond/alarm/system-icon-1.png', 441 icon:'assets/img/serviceSecond/alarm/system-icon-1.png',
442 title:'告警监控', 442 title:'告警监控',
443 - introduction:'依托于本身强大的存储和查询分析能力，我们可以支持海量数据的实时查询分析、异构数据的协同分析、跨账号跨地域的协同监控等能力' 443 + introduction:'依托于本身强大的存储和查询分析能力，我们可以支持海量数据的实时查询分析、异构数据的协同分析、跨账号跨地域的协同监控等能力。'
444 }, 444 },
445 { 445 {
446 icon:'assets/img/serviceSecond/alarm/system-icon-2.png', 446 icon:'assets/img/serviceSecond/alarm/system-icon-2.png',
447 title:'告警管理', 447 title:'告警管理',
448 - introduction:'提供了多种告警降噪能力，包括去重、合并、抑制、静默等' 448 + introduction:'提供了多种告警降噪能力，包括去重、合并、抑制、静默等。'
449 }, 449 },
450 { 450 {
451 icon:'assets/img/serviceSecond/alarm/system-icon-3.png', 451 icon:'assets/img/serviceSecond/alarm/system-icon-3.png',
452 title:'行动管理', 452 title:'行动管理',
453 - introduction:'对接了十多种通知渠道，可以快速配置使用，并且提供了非常灵活且强大的动态分派能力' 453 + introduction:'对接了十多种通知渠道，可以快速配置使用，并且提供了非常灵活且强大的动态分派能力。'
454 }, 454 },
455 { 455 {
456 icon:'assets/img/serviceSecond/alarm/system-icon-4.png', 456 icon:'assets/img/serviceSecond/alarm/system-icon-4.png',
@@ -463,11 +463,11 @@ export function alarm() { @@ -463,11 +463,11 @@ export function alarm() {
463 { 463 {
464 title:'告警的全生命周期', 464 title:'告警的全生命周期',
465 introduction:'', 465 introduction:'',
466 - img:'assets/img/serviceSecond/alarm/lifeCycle.png', 466 + img:'assets/img/serviceSecond/alarm/lifeCycle.jpg',
467 type:'lifeCycle' 467 type:'lifeCycle'
468 }, 468 },
469 { 469 {
470 - title:'基于业务的告警统一管理', 470 + title:'基于“专业分散”业务的告警统一管理',
471 introduction:'能够根据业务单元为粒度，统一进行告警的管理以及态势的统计分析。因此我们提供了告警管理中心，以业务为中心进行告警的统一管理每个业务都包含从资源层到事务管理的完整链路。', 471 introduction:'能够根据业务单元为粒度，统一进行告警的管理以及态势的统计分析。因此我们提供了告警管理中心，以业务为中心进行告警的统一管理每个业务都包含从资源层到事务管理的完整链路。',
472 img:'assets/img/serviceSecond/alarm/alarmManage.png', 472 img:'assets/img/serviceSecond/alarm/alarmManage.png',
473 type:'alarmManage' 473 type:'alarmManage'
@@ -499,7 +499,7 @@ export function Aview() { @@ -499,7 +499,7 @@ export function Aview() {
499 data:[ 499 data:[
500 { 500 {
501 title:'产品信息', 501 title:'产品信息',
502 - introduction:'建立智能IT运维监控平台， 对网络、硬件、安全设备、操作系统、数据库、中间件、应用系统等资源实时监控采集，能够自动地收集信息系统中各类IT资源设备运行状态、数据库状态、中间件运行状态和网络状态等，发现各类IT资源运行过程中的异常。依据业务视角和设备视角分析发现已发生和潜在的各类资源问题，及时通知相关责任人和启动相关运维流程。', 502 + introduction:'建立智能IT运维监控平台， 对网络、服务器、安全设备、操作系统、数据库、中间件、应用系统等资源实时监控采集，能够自动地收集信息系统中各类IT资源设备运行状态、数据库状态、中间件运行状态和网络状态等，发现各类IT资源运行过程中的异常。依据业务视角和设备视角分析发现已发生和潜在的各类资源问题，及时通知相关责任人和启动相关运维流程。',
503 type:'info' 503 type:'info'
504 }, 504 },
505 /* { 505 /* {
@@ -529,27 +529,27 @@ export function Aview() { @@ -529,27 +529,27 @@ export function Aview() {
529 introduction:'', 529 introduction:'',
530 data:[ 530 data:[
531 { 531 {
532 - icon:'assets/img/serviceSecond/Aview/service-1.png', 532 + icon:'assets/img/serviceSecond/Aview/service-1.jpg',
533 title:'前瞻性', 533 title:'前瞻性',
534 introData:['业务前瞻、模式前瞻','架构前瞻'] 534 introData:['业务前瞻、模式前瞻','架构前瞻']
535 }, 535 },
536 { 536 {
537 - icon:'assets/img/serviceSecond/Aview/service-2.png', 537 + icon:'assets/img/serviceSecond/Aview/service-2.jpg',
538 title:'一站式', 538 title:'一站式',
539 introData:['全生命周期','全IT领域'] 539 introData:['全生命周期','全IT领域']
540 }, 540 },
541 { 541 {
542 - icon:'assets/img/serviceSecond/Aview/service-3.png', 542 + icon:'assets/img/serviceSecond/Aview/service-3.jpg',
543 title:'敏捷性', 543 title:'敏捷性',
544 introData:['支持业务更快速','更高质量的发布'] 544 introData:['支持业务更快速','更高质量的发布']
545 }, 545 },
546 { 546 {
547 - icon:'assets/img/serviceSecond/Aview/service-4.png', 547 + icon:'assets/img/serviceSecond/Aview/service-4.jpg',
548 title:'场景化', 548 title:'场景化',
549 introData:['不同的业务场景','提供差异化服务'] 549 introData:['不同的业务场景','提供差异化服务']
550 }, 550 },
551 { 551 {
552 - icon:'assets/img/serviceSecond/Aview/service-5.png', 552 + icon:'assets/img/serviceSecond/Aview/service-5.jpg',
553 title:'智能化', 553 title:'智能化',
554 introData:['通过智能分析和','自动化提高运营效率'] 554 introData:['通过智能分析和','自动化提高运营效率']
555 } 555 }
@@ -657,11 +657,11 @@ export function Aview() { @@ -657,11 +657,11 @@ export function Aview() {
657 657
658 return res 658 return res
659 } 659 }
660 -//CMDB资产管理 660 +//面向应用的CMDB资产管理
661 export function cmdb() { 661 export function cmdb() {
662 let res={ 662 let res={
663 - title:'CMDB资产管理',  
664 - introduction:'建立以应用为中心的资源 管理模型，促进资产到资源的转变。', 663 + title:'面向应用的CMDB资产管理',
  664 + introduction:'建立以应用为中心的资源管理模型，促进资产到资源的转变。',
665 data:[ 665 data:[
666 { 666 {
667 title:'产品信息', 667 title:'产品信息',
@@ -720,27 +720,32 @@ export function cmdb() { @@ -720,27 +720,32 @@ export function cmdb() {
720 { 720 {
721 title:'数据模型管理', 721 title:'数据模型管理',
722 introduction:'提供配置类别、配置项模型和配置关系的自定义。提供图形化界面定义CMDB的数据结构，包括CI类型、每个CI类型包含的属性、对应的CI状态取值、允许的关系类型、CI实例唯一性判断规则，定义每个CI属性字段的数据类型、合法性校验规则、数据调和规则。', 722 introduction:'提供配置类别、配置项模型和配置关系的自定义。提供图形化界面定义CMDB的数据结构，包括CI类型、每个CI类型包含的属性、对应的CI状态取值、允许的关系类型、CI实例唯一性判断规则，定义每个CI属性字段的数据类型、合法性校验规则、数据调和规则。',
723 - img:'assets/img/serviceSecond/cmdb/func-1.png' 723 + img:'assets/img/serviceSecond/cmdb/func-1.jpg',
  724 + imgSm:'assets/img/serviceSecond/cmdb/func-1-sm.png'
724 }, 725 },
725 { 726 {
726 title:'配置数据收集', 727 title:'配置数据收集',
727 introduction:'提供企业级配置自动化发现模块，实现对IT环境中各类环境设施、IT基础架构、应用系统和业务服务信息的收集。 ', 728 introduction:'提供企业级配置自动化发现模块，实现对IT环境中各类环境设施、IT基础架构、应用系统和业务服务信息的收集。 ',
728 - img:'assets/img/serviceSecond/cmdb/func-2.png' 729 + img:'assets/img/serviceSecond/cmdb/func-2.jpg',
  730 + imgSm:'assets/img/serviceSecond/cmdb/func-2-sm.png'
729 }, 731 },
730 { 732 {
731 title:'配置数据管理', 733 title:'配置数据管理',
732 introduction:'采用非结构化数据库技术，完成对海量CMDB信息的管理，包括维护模型、配置项、关系映射的版本，对采集获取的管理对象数据进行模型化和实例化，并将配置项实例映射到应用服务和业务服务。', 734 introduction:'采用非结构化数据库技术，完成对海量CMDB信息的管理，包括维护模型、配置项、关系映射的版本，对采集获取的管理对象数据进行模型化和实例化，并将配置项实例映射到应用服务和业务服务。',
733 - img:'assets/img/serviceSecond/cmdb/func-3.png' 735 + img:'assets/img/serviceSecond/cmdb/func-3.jpg',
  736 + imgSm:'assets/img/serviceSecond/cmdb/func-3-sm.png'
734 }, 737 },
735 { 738 {
736 title:'数据消费服务', 739 title:'数据消费服务',
737 introduction:'提供可视化拓扑展现、报表、访问权限控制等功能。同时为外部运维场景消费CMDB中存储的各类资源配置数据提供标准Restful API接口。', 740 introduction:'提供可视化拓扑展现、报表、访问权限控制等功能。同时为外部运维场景消费CMDB中存储的各类资源配置数据提供标准Restful API接口。',
738 - img:'assets/img/serviceSecond/cmdb/func-4.png' 741 + img:'assets/img/serviceSecond/cmdb/func-4.jpg',
  742 + imgSm:'assets/img/serviceSecond/cmdb/func-4-sm.png'
739 }, 743 },
740 { 744 {
741 title:'关系可视化展现', 745 title:'关系可视化展现',
742 introduction:'提供从应用视角、网络环境视角、业务逻辑视角等可视化展现IT设备之间、IT设备和业务之间、业务和业务之间的关联关系，使IT管理人员对信息的理解和应用关联一目了然。', 746 introduction:'提供从应用视角、网络环境视角、业务逻辑视角等可视化展现IT设备之间、IT设备和业务之间、业务和业务之间的关联关系，使IT管理人员对信息的理解和应用关联一目了然。',
743 - img:'assets/img/serviceSecond/cmdb/func-5.png' 747 + img:'assets/img/serviceSecond/cmdb/func-5.jpg',
  748 + imgSm:'assets/img/serviceSecond/cmdb/func-5-sm.png'
744 } 749 }
745 ], 750 ],
746 type:'func' 751 type:'func'
@@ -748,11 +753,11 @@ export function cmdb() { @@ -748,11 +753,11 @@ export function cmdb() {
748 { 753 {
749 title: 'IT资产生命周期流程化管理', 754 title: 'IT资产生命周期流程化管理',
750 introduction: '', 755 introduction: '',
751 - icon:'assets/img/serviceSecond/cmdb/lifeCycle.png', 756 + icon:'assets/img/serviceSecond/cmdb/lifeCycle.jpg',
752 dataLife:[ 757 dataLife:[
753 { 758 {
754 title:'', 759 title:'',
755 - introData:['CMDB是数据管道、ITSM是流程管道”，CMDB支持ITSM流程的运转，并于流程所经之处在CMDB留痕，对IT资产的生命周期内业务相关流程进行管理，从而实现全生命周期的信息记录和审计'] 760 + introData:['CMDB是数据管道、ITSM是流程管道，CMDB支持ITSM流程的运转，并于流程所经之处在CMDB留痕，对IT资产的生命周期内业务相关流程进行管理，从而实现全生命周期的信息记录和审计']
756 }, 761 },
757 { 762 {
758 title:'资产续保', 763 title:'资产续保',
@@ -831,7 +836,7 @@ export function cloud() { @@ -831,7 +836,7 @@ export function cloud() {
831 title:'产品信息', 836 title:'产品信息',
832 introduction:'支持了国内外所有主流云厂商，包含混合云、多云环境下对计算资源的集中管理，自动化运维、监控、合规审计、多云纳管、云资源全生命周期等多个维度提供统一运维管控，提供系统映像、通过既定策略优化工作负载，系统运行状态，以及任务执行过程的可视化监控，并提供丰富的告警机制帮助客户进行快速处理，从而进行灵活的资源管理与运维。', 837 introduction:'支持了国内外所有主流云厂商，包含混合云、多云环境下对计算资源的集中管理，自动化运维、监控、合规审计、多云纳管、云资源全生命周期等多个维度提供统一运维管控，提供系统映像、通过既定策略优化工作负载，系统运行状态，以及任务执行过程的可视化监控，并提供丰富的告警机制帮助客户进行快速处理，从而进行灵活的资源管理与运维。',
833 type:'info', 838 type:'info',
834 - img:'assets/img/serviceSecond/cloud/info.png', 839 + img:'assets/img/serviceSecond/cloud/info.jpg',
835 }, 840 },
836 { 841 {
837 title: '', 842 title: '',
@@ -912,28 +917,28 @@ export function cloud() { @@ -912,28 +917,28 @@ export function cloud() {
912 introduction:'', 917 introduction:'',
913 dataC:[ 918 dataC:[
914 { 919 {
915 - img:'assets/img/serviceSecond/cloud/character-1.png', 920 + img:'assets/img/serviceSecond/cloud/character-1.jpg',
916 title:'多云资源统一管理', 921 title:'多云资源统一管理',
917 introData:[ 922 introData:[
918 '可纳管多家主流私有云、公有云的计算、存储、网络等资源，实现资源台账可视化、资源操作便捷化以及多租户多层级的资源配额管理和数据分权。' 923 '可纳管多家主流私有云、公有云的计算、存储、网络等资源，实现资源台账可视化、资源操作便捷化以及多租户多层级的资源配额管理和数据分权。'
919 ] 924 ]
920 }, 925 },
921 { 926 {
922 - img:'assets/img/serviceSecond/cloud/character-2.png', 927 + img:'assets/img/serviceSecond/cloud/character-2.jpg',
923 title:'多云环境自动化编排', 928 title:'多云环境自动化编排',
924 introData:[ 929 introData:[
925 '通过对云资源的蓝图设计、服务发布、服务申请、工单管理以及资源回收等，帮助客户实现资源的自动化运维和全生命周期管理。' 930 '通过对云资源的蓝图设计、服务发布、服务申请、工单管理以及资源回收等，帮助客户实现资源的自动化运维和全生命周期管理。'
926 ] 931 ]
927 }, 932 },
928 { 933 {
929 - img:'assets/img/serviceSecond/cloud/character-3.png', 934 + img:'assets/img/serviceSecond/cloud/character-3.jpg',
930 title:'多云资源统一运维和监控', 935 title:'多云资源统一运维和监控',
931 introData:[ 936 introData:[
932 '提供灵活可配的告警策略管理、微信邮件等多种方式的告警通知、资源性能指标和健康状态的统一分析等，帮助用户实时掌握全局资源的运行状态。' 937 '提供灵活可配的告警策略管理、微信邮件等多种方式的告警通知、资源性能指标和健康状态的统一分析等，帮助用户实时掌握全局资源的运行状态。'
933 ] 938 ]
934 }, 939 },
935 { 940 {
936 - img:'assets/img/serviceSecond/cloud/character-4.png', 941 + img:'assets/img/serviceSecond/cloud/character-4.jpg',
937 title:'多维数据可视化', 942 title:'多维数据可视化',
938 introData:[ 943 introData:[
939 '通过自定义仪表盘实现资源用量的数据可视化分析;以资源池、集群、租户、主机等维度分析多云资源使用情况与变化趋势' 944 '通过自定义仪表盘实现资源用量的数据可视化分析;以资源池、集群、租户、主机等维度分析多云资源使用情况与变化趋势'

125 KB | W: | H:

135 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

86.9 KB | W: | H:

167 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

167 KB | W: | H:

37.2 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

46.9 KB | W: | H:

17.2 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

46.3 KB | W: | H:

19.8 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

42.6 KB | W: | H:

16.9 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

74.6 KB | W: | H:

28.8 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

99.9 KB | W: | H:

88.1 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

93.7 KB | W: | H:

34.5 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

73.1 KB | W: | H:

27.5 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

193 KB | W: | H:

51.1 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
@@ -37,8 +37,35 @@ @@ -37,8 +37,35 @@
37 $('.logo-outer .hg-logo').attr('src','assets/img/logo-footer.png'); 37 $('.logo-outer .hg-logo').attr('src','assets/img/logo-footer.png');
38 $('.navigation').addClass('navigation-white'); 38 $('.navigation').addClass('navigation-white');
39 } 39 }
  40 + }
40 41
  42 + //产品二级页面滚动后二级导航
  43 + if(windowpos >= 250){
  44 + if($(window).width()>991){
  45 + $('.intro-tab').addClass('intro-tab-scroll');
  46 + //当前可视区域的高度
  47 + let winH=$(window).height();
  48 + let dataTypeEle=$("[data-type]");
  49 + if(dataTypeEle && dataTypeEle.length>0){
  50 + dataTypeEle.map((index,item)=>{
  51 + //每一个锚点距离顶部的高度
  52 + let itemH=$(item).offset().top;
  53 + if(windowpos<itemH){
  54 + if(windowpos+winH>=itemH){
  55 + $('.tab-item-li .tab-item').removeClass('tab-item-active');
  56 + let type=$(item).data('type');
  57 + $('.tab-item-li [data-target="[data-type='+type+']"]').addClass('tab-item-active');
  58 + }
  59 + }
  60 + })
  61 + }
41 } 62 }
  63 + }else{
  64 + $('.intro-tab').removeClass('intro-tab-scroll');
  65 + $('.tab-item-li .tab-item').removeClass('tab-item-active');
  66 + $('.tab-item-li:first-child .tab-item').addClass('tab-item-active');
  67 + }
  68 +
42 } 69 }
43 } 70 }
44 71
@@ -114,7 +114,7 @@ @@ -114,7 +114,7 @@
114 114
115 <!--Footer Column--> 115 <!--Footer Column-->
116 <div class="col-sm-4"> 116 <div class="col-sm-4">
117 - <div class="footer-widget logo-widget mr-35"> 117 + <div class="footer-widget logo-widget footer-mr-35">
118 <div class="footer-logo"> 118 <div class="footer-logo">
119 <router-link to="/"><img class="logo-footer-img" src="assets/img/logo-footer.png" alt="" title=""></router-link> 119 <router-link to="/"><img class="logo-footer-img" src="assets/img/logo-footer.png" alt="" title=""></router-link>
120 </div> 120 </div>
@@ -134,7 +134,7 @@ @@ -134,7 +134,7 @@
134 <ul> 134 <ul>
135 <li><router-link to="/services/alarm">综合告警智能算法平台</router-link></li> 135 <li><router-link to="/services/alarm">综合告警智能算法平台</router-link></li>
136 <li><router-link to="/services/Aview">综合监控管理A-view</router-link></li> 136 <li><router-link to="/services/Aview">综合监控管理A-view</router-link></li>
137 - <li><router-link to="/services/cmdb">CMDB资产管理</router-link></li> 137 + <li><router-link to="/services/cmdb">面向应用的CMDB资产管理</router-link></li>
138 <li><router-link to="/services/businessApp">业务及应用综合分析平台</router-link></li> 138 <li><router-link to="/services/businessApp">业务及应用综合分析平台</router-link></li>
139 </ul> 139 </ul>
140 </div> 140 </div>
@@ -143,7 +143,7 @@ @@ -143,7 +143,7 @@
143 143
144 <div class="col-sm-4"> 144 <div class="col-sm-4">
145 <div class="footer-widget links-widget"> 145 <div class="footer-widget links-widget">
146 - <h4 style=" font-weight: 600;position: relative;margin-bottom: 40px;text-transform: capitalize;">&nbsp;</h4> 146 + <h4 class="footer-title-none">&nbsp;</h4>
147 <div class="widget-content"> 147 <div class="widget-content">
148 <ul> 148 <ul>
149 <li><router-link to="/services/securityLog">日志综合智能分析平台</router-link></li> 149 <li><router-link to="/services/securityLog">日志综合智能分析平台</router-link></li>
@@ -169,7 +169,7 @@ @@ -169,7 +169,7 @@
169 <li> 169 <li>
170 <router-link to="/about/1" data-id="1">公司简介</router-link> 170 <router-link to="/about/1" data-id="1">公司简介</router-link>
171 </li> 171 </li>
172 - <li><router-link to="/about/6" data-id="6">合作流程</router-link></li> 172 +<!-- <li><router-link to="/about/6" data-id="6">合作流程</router-link></li>-->
173 </ul> 173 </ul>
174 </div> 174 </div>
175 </div> 175 </div>
@@ -181,10 +181,9 @@ @@ -181,10 +181,9 @@
181 <h4 class="footer-title">联系我们</h4> 181 <h4 class="footer-title">联系我们</h4>
182 <div class="office-info"> 182 <div class="office-info">
183 <ul> 183 <ul>
184 - <li>北京电话:010-51726651</li>  
185 - <li>西安电话:029-89194260</li>  
186 - <li>地址:北京市海淀区中关村南大街2号数码大厦B座11层</li>  
187 - <li>地址:陕西省西安市雁塔区金桥国际18层</li> 184 + <li>邮箱: <a href="mailto:hr@honggroup.com.cn">hr@honggroup.com.cn</a></li>
  185 + <li>地址:北京市海淀区中关村南大街2号数码大厦B座</li>
  186 + <li>地址:陕西省西安市雁塔区金桥国际C座</li>
188 </ul> 187 </ul>
189 </div> 188 </div>
190 </div> 189 </div>
@@ -196,13 +195,13 @@ @@ -196,13 +195,13 @@
196 </div> 195 </div>
197 <!--Copyright--> 196 <!--Copyright-->
198 <div class="footer-bottom"> 197 <div class="footer-bottom">
199 - <div class="copyright">北京鸿果秋实科技有限公司@2016-2022.com版权所有 198 + <div class="copyright">北京鸿果秋实科技有限公司
200 <a class="copyright-a" href="https://beian.miit.gov.cn/"> 199 <a class="copyright-a" href="https://beian.miit.gov.cn/">
201 京ICP备16044493号-1 200 京ICP备16044493号-1
202 </a> 201 </a>
203 - <a class="copyright-a" href="http://www.beian.gov.cn/portal/registerSystemInfo?domainname=honggroup.com.cn"> 202 + <a class="copyright-a" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802040581">
204 <img src="assets/img/beian.png" alt="" title=""> 203 <img src="assets/img/beian.png" alt="" title="">
205 - 京公网安备honggroup.com.cn号 204 + 京公网安备11010802040581号
206 </a> 205 </a>
207 206
208 </div> 207 </div>
@@ -218,7 +218,39 @@ export default { @@ -218,7 +218,39 @@ export default {
218 } 218 }
219 }); 219 });
220 } 220 }
221 - 221 + if ($('.team-carousel-sm').length) {
  222 + $('.team-carousel-sm').owlCarousel({
  223 + loop: true,
  224 + items: 2,
  225 + margin: 20,
  226 + center:true,
  227 + nav: false,
  228 + dots: true,
  229 + active: true,
  230 + dotsEach: 2,
  231 + smartSpeed: 1000,
  232 + // autoplay: 5000,
  233 + navText:'',
  234 + // navText: ['<span class="flaticon-left-arrow"></span>', '<span class="flaticon-right-arrow"></span>'],
  235 + /*responsive: {
  236 + 0: {
  237 + items: 3,
  238 + },
  239 + 575: {
  240 + items: 3,
  241 + },
  242 + 768: {
  243 + items: 3,
  244 + },
  245 + 992: {
  246 + items: 3,
  247 + },
  248 + 1200: {
  249 + items: 3,
  250 + }
  251 + }*/
  252 + });
  253 + }
222 254
223 // Scroll to a Specific Div 255 // Scroll to a Specific Div
224 if ($('.scroll-to-target').length) { 256 if ($('.scroll-to-target').length) {
@@ -227,7 +259,7 @@ export default { @@ -227,7 +259,7 @@ export default {
227 //lsq 产品二级页面的二级导航锚点 2022-09-19 259 //lsq 产品二级页面的二级导航锚点 2022-09-19
228 let top=$(target).offset().top 260 let top=$(target).offset().top
229 if($(this).hasClass('tab-item') || $(this).hasClass('scroll-item')){ 261 if($(this).hasClass('tab-item') || $(this).hasClass('scroll-item')){
230 - top-=100; 262 + top-=150;
231 } 263 }
232 // animate 264 // animate
233 $('html, body').animate({ 265 $('html, body').animate({
@@ -20,7 +20,7 @@ const routes = [ @@ -20,7 +20,7 @@ const routes = [
20 component: () => myImport('views/concat/index'), 20 component: () => myImport('views/concat/index'),
21 }, 21 },
22 { 22 {
23 - path:"/recruit/:job", 23 + path:"/concat/recruit/:job",
24 name:"Recruit", 24 name:"Recruit",
25 component: () => myImport('views/serviceSecond/recruit/index') 25 component: () => myImport('views/serviceSecond/recruit/index')
26 }, 26 },
@@ -60,7 +60,7 @@ const routes = [ @@ -60,7 +60,7 @@ const routes = [
60 name: 'Aview', 60 name: 'Aview',
61 component: () => myImport('views/serviceSecond/Aview/index') 61 component: () => myImport('views/serviceSecond/Aview/index')
62 }, 62 },
63 - //CMDB资产管理 63 + //面向应用的CMDB资产管理
64 { 64 {
65 path: '/services/cmdb', 65 path: '/services/cmdb',
66 name: 'cmdb', 66 name: 'cmdb',
@@ -103,7 +103,7 @@ router.beforeEach(async (to, from, next) => { @@ -103,7 +103,7 @@ router.beforeEach(async (to, from, next) => {
103 $('html, body').animate({ 103 $('html, body').animate({
104 scrollTop: 0 104 scrollTop: 0
105 }, 100); 105 }, 100);
106 - 106 + $('.collapse').removeClass('show');
107 next(); 107 next();
108 }) 108 })
109 109
@@ -9,18 +9,25 @@ @@ -9,18 +9,25 @@
9 <img src="assets/img/shapes/shape3.png" alt="Shape"> 9 <img src="assets/img/shapes/shape3.png" alt="Shape">
10 </div> 10 </div>
11 </section> 11 </section>
12 -<div class="wrap" @Mousewheel="MousewheelFun"> 12 +<div class="wrap" @Mousewheel="MousewheelFun" @touchmove="touchFun" @touchstart="touchFunStart">
13 <div class="wrap-container"> 13 <div class="wrap-container">
14 <section class="concat-about rel rpt-150 pb-130 rpb-0 text-left "> 14 <section class="concat-about rel rpt-150 pb-130 rpb-0 text-left ">
15 </section> 15 </section>
16 16
17 <section class="about-section rel all-height"> 17 <section class="about-section rel all-height">
18 <div class="container about-container"> 18 <div class="container about-container">
19 - <div class="about-content mr-20 rmr-0 rmb-50 wow customFadeInRight delay-0-2s slow"> 19 + <div class="about-content about-content-intro mr-20 rmr-0 rmb-50 wow customFadeInRight delay-0-2s slow">
20 <div class="section-title mb-35"> 20 <div class="section-title mb-35">
21 <span class="title-style">公司简介</span> 21 <span class="title-style">公司简介</span>
22 </div> 22 </div>
23 <!-- <div class="title-intro color-white">北京鸿果秋实科技有限公司2012年成立，定位于提供4S信息化解决方案的高科技公司：（Software-软件，Service-服务，Solution-解决方案，Sale-销售），公司专注于软件解决方案和整体服务交付领域，已陆续成为税务、社保、财政、通信运营商等行业，IT运维领域的领先者。北京鸿果科技依托“金税三期” 、“互联网+智能化AI+行业应用”的变革时机，充分运用智能化、运维大数据思维，引入AI、算法和业务深度理解，共同打造AIOps生态圈。公司基于多年政府行业的市场、销售、技术、产品经验积累，先后在多省市政府、央企承建了“综合监控管理平台（A-view V1.0）、自动化巡检平台、智能告警算法平台、数据安全运维管理平台、一体化运维大数据管理应用平台（D-viewV1.0）”等，陆续承建了浙江省、新疆、陕西、贵州、天津、吉林、辽宁、内蒙古、宁夏等税务局“金三”重大信息化项目。 目前公司拥有《国家高新企业》《中国信息安全服务集成资质》、《中国信息安全运维资质》、 《软件企业》资质、多项自主的软件著作权，评选为“优秀信息化软件企业合作伙伴”、“专精特新”企业。</div>--> 23 <!-- <div class="title-intro color-white">北京鸿果秋实科技有限公司2012年成立，定位于提供4S信息化解决方案的高科技公司：（Software-软件，Service-服务，Solution-解决方案，Sale-销售），公司专注于软件解决方案和整体服务交付领域，已陆续成为税务、社保、财政、通信运营商等行业，IT运维领域的领先者。北京鸿果科技依托“金税三期” 、“互联网+智能化AI+行业应用”的变革时机，充分运用智能化、运维大数据思维，引入AI、算法和业务深度理解，共同打造AIOps生态圈。公司基于多年政府行业的市场、销售、技术、产品经验积累，先后在多省市政府、央企承建了“综合监控管理平台（A-view V1.0）、自动化巡检平台、智能告警算法平台、数据安全运维管理平台、一体化运维大数据管理应用平台（D-viewV1.0）”等，陆续承建了浙江省、新疆、陕西、贵州、天津、吉林、辽宁、内蒙古、宁夏等税务局“金三”重大信息化项目。 目前公司拥有《国家高新企业》《中国信息安全服务集成资质》、《中国信息安全运维资质》、 《软件企业》资质、多项自主的软件著作权，评选为“优秀信息化软件企业合作伙伴”、“专精特新”企业。</div>-->
  24 + <div class="about-intro" v-for="itemI in introData">
  25 + <div class="title-intro about-intro-title pb-10 pt-10" v-if="itemI.title">{{itemI.title}}</div>
  26 + <div class="title-intro" v-if="itemI.intro">{{itemI.intro}}</div>
  27 + <div class="about-intro-img">
  28 + <img :src="itemI.img" class="pb-10 pt-10" alt="" v-if="itemI.img">
  29 + </div>
  30 + </div>
24 </div> 31 </div>
25 </div> 32 </div>
26 <!-- <div class="know-intro"></div>--> 33 <!-- <div class="know-intro"></div>-->
@@ -35,7 +42,7 @@ @@ -35,7 +42,7 @@
35 </section> 42 </section>
36 43
37 <section class="about-section rel text-center"> 44 <section class="about-section rel text-center">
38 - <div class="container about-container"> 45 + <div class="container about-container culturalValues-container">
39 <div class="row wow customFadeInRight delay-0-1s slow"> 46 <div class="row wow customFadeInRight delay-0-1s slow">
40 <div class="col-lg-12 col-md-12 pt-60"> 47 <div class="col-lg-12 col-md-12 pt-60">
41 <div class="title-style">鸿果文化价值观及企业目标</div> 48 <div class="title-style">鸿果文化价值观及企业目标</div>
@@ -64,6 +71,9 @@ @@ -64,6 +71,9 @@
64 </div>--> 71 </div>-->
65 </div> 72 </div>
66 <div class="culturalValues-bg wow customFadeInRight delay-0-1s slow"></div> 73 <div class="culturalValues-bg wow customFadeInRight delay-0-1s slow"></div>
  74 + <div class="culturalValues-bg-sm wow customFadeInRight delay-0-1s slow">
  75 + <img src="assets/img/about/cultural-img-sm.jpg" alt="">
  76 + </div>
67 77
68 <div class="shape shapeAnimationOne l-10 t-0"> 78 <div class="shape shapeAnimationOne l-10 t-0">
69 <img src="assets/img/shapes/shape3.png" alt="Shape"> 79 <img src="assets/img/shapes/shape3.png" alt="Shape">
@@ -72,7 +82,7 @@ @@ -72,7 +82,7 @@
72 <img src="assets/img/shapes/shape1.png" alt="Shape"> 82 <img src="assets/img/shapes/shape1.png" alt="Shape">
73 </div> 83 </div>
74 </section> 84 </section>
75 - <section class="success-section pt-135 pb-20"> 85 + <section class="success-section flaticon-section pt-135 pb-20">
76 <div class="container"> 86 <div class="container">
77 <div class="row"> 87 <div class="row">
78 <div class="col-lg-3 col-md-6"> 88 <div class="col-lg-3 col-md-6">
@@ -173,6 +183,17 @@ @@ -173,6 +183,17 @@
173 </div> 183 </div>
174 184
175 </div> 185 </div>
  186 + <div class="team-carousel-sm owl-carousel text-center qualification-con owl-dots">
  187 + <div class="qualification-item" v-for="item in imgs">
  188 + <div class="item-con">
  189 + <img :src="item.path" alt="资质&证书">
  190 + </div>
  191 + <div class="item-name">
  192 + {{item.name}}
  193 + </div>
  194 + </div>
  195 +
  196 + </div>
176 </div> 197 </div>
177 <div class="qualification-bg"></div> 198 <div class="qualification-bg"></div>
178 <div class="shape shapeAnimationFour l-10 t-100"> 199 <div class="shape shapeAnimationFour l-10 t-100">
@@ -183,7 +204,7 @@ @@ -183,7 +204,7 @@
183 </div> 204 </div>
184 </section> 205 </section>
185 <section class="about-section rel text-center"> 206 <section class="about-section rel text-center">
186 - <div class="container"> 207 + <div class="container about-process-container">
187 <div class="row wow customFadeInRight delay-0-1s slow"> 208 <div class="row wow customFadeInRight delay-0-1s slow">
188 <div class="col-lg-12 col-md-12"> 209 <div class="col-lg-12 col-md-12">
189 <div class="title-style pt-20">合作流程</div> 210 <div class="title-style pt-20">合作流程</div>
@@ -191,7 +212,8 @@ @@ -191,7 +212,8 @@
191 </div> 212 </div>
192 </div> 213 </div>
193 <div class="about-process pt-60"> 214 <div class="about-process pt-60">
194 - <img src="assets/img/about/hzlc.png"> 215 + <img class="hzlc" src="assets/img/about/hzlc.png">
  216 + <img class="hzlc-sm" src="assets/img/about/hzlc-sm.png">
195 </div> 217 </div>
196 </div> 218 </div>
197 <div class="about-concat mt-10"> 219 <div class="about-concat mt-10">
@@ -199,7 +221,7 @@ @@ -199,7 +221,7 @@
199 <div class="about-concat-con"> 221 <div class="about-concat-con">
200 <div class="about-concat-btn" @click="isConcat=!isConcat"> 222 <div class="about-concat-btn" @click="isConcat=!isConcat">
201 <span v-if="!isConcat">联系咨询我们</span> 223 <span v-if="!isConcat">联系咨询我们</span>
202 - <span v-if="isConcat">010-51726651</span> 224 + <a href="tel:010-51726651" v-if="isConcat">010-51726651</a>
203 </div> 225 </div>
204 </div> 226 </div>
205 <div class="about-concat-bg"></div> 227 <div class="about-concat-bg"></div>
1 import pageInit from "../../minixs/pageInit.js"; 1 import pageInit from "../../minixs/pageInit.js";
2 -import {culturalValuesDatas,culturalDatas,imgsDatas} from "../../../../assets/img/data/aboutData.js"; 2 +import {culturalValuesDatas,culturalDatas,imgsDatas,introDatas} from "../../../../assets/img/data/aboutData.js";
3 export default { 3 export default {
4 name: 'home', 4 name: 'home',
5 template: '', 5 template: '',
@@ -10,19 +10,20 @@ export default { @@ -10,19 +10,20 @@ export default {
10 const {proxy} = Vue.getCurrentInstance(); 10 const {proxy} = Vue.getCurrentInstance();
11 let culturalValuesData=Vue.ref(culturalValuesDatas()); 11 let culturalValuesData=Vue.ref(culturalValuesDatas());
12 let culturalData=Vue.ref(culturalDatas()); 12 let culturalData=Vue.ref(culturalDatas());
13 - 13 + let introData=Vue.ref(introDatas());
14 var imgs = Vue.ref(imgsDatas()); 14 var imgs = Vue.ref(imgsDatas());
15 let flag =Vue.ref(true); 15 let flag =Vue.ref(true);
16 let i=Vue.ref(0); 16 let i=Vue.ref(0);
17 - let MousewheelFun=(e)=>{ 17 + let setWrap = (Y,type) =>{
18 let hei=$('.wrap-container>section').first().outerHeight(); 18 let hei=$('.wrap-container>section').first().outerHeight();
19 let heiF=$('.footer-section-con').outerHeight(); 19 let heiF=$('.footer-section-con').outerHeight();
20 let sectionLength=$('.wrap-container>section').length; 20 let sectionLength=$('.wrap-container>section').length;
21 $('.wrap-container section:nth-child('+(i.value+1)+') .wow').removeAttr('style'); 21 $('.wrap-container section:nth-child('+(i.value+1)+') .wow').removeAttr('style');
22 // 控制滑动一次 22 // 控制滑动一次
23 if(flag.value){ 23 if(flag.value){
  24 + if(type == 'mouse'){
24 // 上滑 25 // 上滑
25 - if(e.deltaY<0){ 26 + if(Y<0){
26 // 不能上滑了 27 // 不能上滑了
27 if(i.value>0){ 28 if(i.value>0){
28 i.value--; 29 i.value--;
@@ -46,6 +47,34 @@ export default { @@ -46,6 +47,34 @@ export default {
46 }) 47 })
47 } 48 }
48 } 49 }
  50 + }else if(type=='touchDown'){
  51 + // 这个if让它不能让下继续滑动
  52 + if(i.value<7){
  53 + i.value++;
  54 + flag.value = false;
  55 + let top=-i.value*hei;
  56 + if(i.value+1==sectionLength){
  57 + top=-i.value*hei+(hei-heiF);
  58 + }
  59 + $('.wrap-container').animate({top:top},1000,function(){
  60 + flag.value=true;
  61 + })
  62 + }
  63 + }else if(type=='touchUp'){
  64 + if(i.value>0){
  65 + i.value--;
  66 + flag.value = false;
  67 + $('.wrap-container').animate({top:-i.value*hei},1000,function(){
  68 + flag.value=true;
  69 + })
  70 + }
  71 + }
  72 +
  73 + }
  74 + }
  75 + let MousewheelFun=(e)=>{
  76 + if($(window).width()>767){
  77 + setWrap(e.deltaY,'mouse')
49 } 78 }
50 setTimeout(function (){ 79 setTimeout(function (){
51 setNavStyle(); 80 setNavStyle();
@@ -63,6 +92,33 @@ export default { @@ -63,6 +92,33 @@ export default {
63 92
64 } 93 }
65 } 94 }
  95 + //移动端滑动
  96 + let startX=Vue.ref(0);
  97 + let startY=Vue.ref(0);
  98 + let endX=Vue.ref(0);
  99 + let endY=Vue.ref(0)
  100 + let touchFunStart =(e)=>{
  101 + startX.value=e.touches[0].pageX;
  102 + startY.value=e.touches[0].pageY;
  103 + }
  104 + let touchFun =(e)=>{
  105 + if($(window).width()>767){
  106 + endX.value=e.changedTouches[0].pageX;
  107 + endY.value=e.changedTouches[0].pageY;
  108 + let X=endX.value-startX.value;
  109 + let Y=endY.value-startY.value;
  110 + if(Math.abs(Y) > Math.abs(X) && Y>0){
  111 + //向下
  112 + setWrap(e.deltaY,'touchUp')
  113 +
  114 + }else if(Math.abs(Y) > Math.abs(X) && Y<0){
  115 + //向上
  116 + setWrap(e.deltaY,'touchDown')
  117 +
  118 + }
  119 + }
  120 +
  121 + }
66 //联系方式是否出现 122 //联系方式是否出现
67 let isConcat=Vue.ref(false); 123 let isConcat=Vue.ref(false);
68 //设置从footer进入页面的显示位置 124 //设置从footer进入页面的显示位置
@@ -103,7 +159,14 @@ export default { @@ -103,7 +159,14 @@ export default {
103 i, 159 i,
104 isConcat, 160 isConcat,
105 setNavStyle, 161 setNavStyle,
106 - setFormFooter 162 + setFormFooter,
  163 + touchFun,
  164 + touchFunStart,
  165 + startX,
  166 + startY,
  167 + endX,
  168 + endY,
  169 + introData
107 } 170 }
108 171
109 } 172 }
@@ -13,8 +13,8 @@ @@ -13,8 +13,8 @@
13 13
14 <section class="concat-concat rel rpt-150 pb-130 rpb-0 text-left "> 14 <section class="concat-concat rel rpt-150 pb-130 rpb-0 text-left ">
15 <div class="color-white mb-2 title-style font-size-42">加入鸿果，成为您想成为的人</div> 15 <div class="color-white mb-2 title-style font-size-42">加入鸿果，成为您想成为的人</div>
16 - <div class="color-white mb-2 pt-20 font-size-24">齐心协力、积极乐观、共同发展、团队共赢！</div>  
17 - <div class="color-white mb-2 title-intro pt-20">具备足够的勇气及长远的眼光，大家携手一起，齐心协力，积极乐观，朝共同的目标前进实现共同发展及利益最大化</div> 16 + <div class="color-white mb-2 pt-20 font-size-24">我们的价值观：担当、拼搏、共赢！ </div>
  17 +<!-- <div class="color-white mb-2 title-intro pt-20">具备足够的勇气及长远的眼光，大家携手一起，齐心协力，积极乐观，朝共同的目标前进实现共同发展及利益最大化</div>-->
18 <div class="concat-btn mt-50" @click="routerPath('sale')"> 18 <div class="concat-btn mt-50" @click="routerPath('sale')">
19 <span class="mr-15">招贤纳士</span> <img src="assets/img/concat/arrow-right.png" alt=""> 19 <span class="mr-15">招贤纳士</span> <img src="assets/img/concat/arrow-right.png" alt="">
20 </div> 20 </div>
@@ -34,7 +34,7 @@ @@ -34,7 +34,7 @@
34 </div> 34 </div>
35 <div class="col-lg-6"> 35 <div class="col-lg-6">
36 <div class="service-left-image wow customFadeInLeft delay-0-1s slow"> 36 <div class="service-left-image wow customFadeInLeft delay-0-1s slow">
37 - <img style="border-radius: 25px" src="assets/img/concat/s1.png" alt="Service image"> 37 + <img style="border-radius: 25px" src="assets/img/concat/s1.jpg" alt="Service image">
38 </div> 38 </div>
39 </div> 39 </div>
40 </div> 40 </div>
@@ -55,7 +55,7 @@ @@ -55,7 +55,7 @@
55 </div> 55 </div>
56 <div class="col-lg-6"> 56 <div class="col-lg-6">
57 <div class="service-right-image wow customFadeInRight delay-0-1s slow"> 57 <div class="service-right-image wow customFadeInRight delay-0-1s slow">
58 - <img style="border-radius: 25px" src="assets/img/concat/s2.png" alt="Service image"> 58 + <img style="border-radius: 25px" src="assets/img/concat/s2.jpg" alt="Service image">
59 </div> 59 </div>
60 </div> 60 </div>
61 </div> 61 </div>
@@ -78,7 +78,7 @@ @@ -78,7 +78,7 @@
78 </div> 78 </div>
79 <div class="col-lg-6"> 79 <div class="col-lg-6">
80 <div class="service-left-image wow customFadeInLeft delay-0-1s slow"> 80 <div class="service-left-image wow customFadeInLeft delay-0-1s slow">
81 - <img style="border-radius: 25px" src="assets/img/concat/s3.png" alt="Service image"> 81 + <img style="border-radius: 25px" src="assets/img/concat/s3.jpg" alt="Service image">
82 </div> 82 </div>
83 </div> 83 </div>
84 </div> 84 </div>
@@ -12,7 +12,7 @@ export default { @@ -12,7 +12,7 @@ export default {
12 recruitHot.value = recruit().hot; 12 recruitHot.value = recruit().hot;
13 13
14 let routerPath=(val)=>{ 14 let routerPath=(val)=>{
15 - proxy.$router.push('/recruit/'+val) 15 + proxy.$router.push('/concat/recruit/'+val)
16 } 16 }
17 return{ 17 return{
18 recruitHot, 18 recruitHot,
@@ -14,15 +14,15 @@ @@ -14,15 +14,15 @@
14 <div class="owl-carousel owl-theme owl-loaded all-height"> 14 <div class="owl-carousel owl-theme owl-loaded all-height">
15 <div class="owl-stage-outer owl-height all-height"> 15 <div class="owl-stage-outer owl-height all-height">
16 <div class="owl-stage all-height"> 16 <div class="owl-stage all-height">
17 - <div :class="['owl-item', 'all-height',{'scroll-to-target':index==0,'cursor-pointer':index==0,'scroll-item':index==0}] " data-target=".team-section" v-for="(item,index) in homeData"  
18 - :style="'background: url(assets/img/index/' + (index+1) + '.png);'"> 17 + <div :class="['owl-item','home-bg-'+(index+1), 'all-height',{'scroll-to-target':index==2,'cursor-pointer':index==2,'scroll-item':index==2}] " data-target=".team-section" v-for="(item,index) in homeData"
  18 + >
19 <!-- <img :src="'assets/img/index/' + (index+1) + '.png'" class="d-block w-100 h-75">--> 19 <!-- <img :src="'assets/img/index/' + (index+1) + '.png'" class="d-block w-100 h-75">-->
20 <div :class="['owl-item-content']"> 20 <div :class="['owl-item-content']">
21 - <div :class="['owl-item-title', 'font-size-42',{'text-align-center':index==2}]">{{item.title}}</div> 21 + <div :class="['owl-item-title', 'font-size-42',{'text-align-center':index==1}]">{{item.title}}</div>
22 <div class="owl-item-title font-size-42" v-if="item.title1">{{item.title1}}</div> 22 <div class="owl-item-title font-size-42" v-if="item.title1">{{item.title1}}</div>
23 <div class="pt-30 title-intro-top text-align-center" v-if="item.introTitle">{{item.introTitle}}</div> 23 <div class="pt-30 title-intro-top text-align-center" v-if="item.introTitle">{{item.introTitle}}</div>
24 - <div :class="['owl-item-intro', 'title-intro-top', {'pt-10':item.introTitle,'pt-30':!item.introTitle,'text-align-center':index==2,'max-width-6':index!=2}]">{{item.introduction}}</div>  
25 - <div :class="['owl-item-button', 'pt-30',{'text-align-center':index==2}]" > 24 + <div :class="['owl-item-intro', 'title-intro-top', {'pt-10':item.introTitle,'pt-30':!item.introTitle,'text-align-center':index==1,'max-width-6':index!=1}]">{{item.introduction}}</div>
  25 + <div :class="['owl-item-button', 'pt-30',{'text-align-center':index==1}]" >
26 <span class="home-button btn-service" v-if="item.isService" @click="jumpSecond('services')">查看产品</span> 26 <span class="home-button btn-service" v-if="item.isService" @click="jumpSecond('services')">查看产品</span>
27 <span class="home-button btn-concat" v-if="item.isConcat" @click="jumpSecond('concat')">联系我们</span> 27 <span class="home-button btn-concat" v-if="item.isConcat" @click="jumpSecond('concat')">联系我们</span>
28 </div> 28 </div>
@@ -39,19 +39,26 @@ @@ -39,19 +39,26 @@
39 <div class="title-style">技术优势</div> 39 <div class="title-style">技术优势</div>
40 <div class="title-intro pt-20">以AI激活运维数据智慧，助力客户数字化运维</div> 40 <div class="title-intro pt-20">以AI激活运维数据智慧，助力客户数字化运维</div>
41 <div class="row pt-30"> 41 <div class="row pt-30">
42 - <div v-for="(item,index) in techData" :key="item" class="col-lg-3 col-md-6 col-lg-3-self"> 42 + <div v-for="(item,index) in techData" :key="item" class="col-lg-3 col-md-6 tech-item col-lg-3-self">
43 <div class="single-service-box style-three"> 43 <div class="single-service-box style-three">
44 <div class="service-icon" data-toggle="tooltip" @mouseenter="tooltipHover(item.id)" 44 <div class="service-icon" data-toggle="tooltip" @mouseenter="tooltipHover(item.id)"
45 @mouseleave="tooltipLeave"> 45 @mouseleave="tooltipLeave">
46 - <div> 46 + <div class="tech-img-con">
  47 + <div class="tech-img">
47 <img :src="'assets/img/technology/technology-'+item.id+'.png'" alt="Service Icon"> 48 <img :src="'assets/img/technology/technology-'+item.id+'.png'" alt="Service Icon">
48 </div> 49 </div>
  50 + </div>
  51 +
49 <div class="tech-title-num">{{index+1}}</div> 52 <div class="tech-title-num">{{index+1}}</div>
50 <div class="tech-title pt-30 pb-30">{{item.title}}</div> 53 <div class="tech-title pt-30 pb-30">{{item.title}}</div>
51 <div :class="[ 'tooltip', 'tooltip-self','flex-column-center',{'opacity1':item.isHover,'opacity0':!item.isHover}]"> 54 <div :class="[ 'tooltip', 'tooltip-self','flex-column-center',{'opacity1':item.isHover,'opacity0':!item.isHover}]">
52 <div>{{item.title}}</div> 55 <div>{{item.title}}</div>
53 <div>{{item.tipIntro}}</div> 56 <div>{{item.tipIntro}}</div>
54 </div> 57 </div>
  58 + <div class="tech-introCon-sm">
  59 + <div class="tech-title-sm">{{item.title}}</div>
  60 + <div class="tech-intro-sm">{{item.tipIntro}}</div>
  61 + </div>
55 </div> 62 </div>
56 </div> 63 </div>
57 </div> 64 </div>
@@ -66,11 +73,11 @@ @@ -66,11 +73,11 @@
66 <img src="assets/img/shapes/shape1.png" alt="Shape"> 73 <img src="assets/img/shapes/shape1.png" alt="Shape">
67 </div> 74 </div>
68 </section> 75 </section>
69 -<section class="rel text-center pt-30 pb-30"> 76 +<section class="rel text-center pt-30 pb-30 principle-section">
70 <div class="container"> 77 <div class="container">
71 - <div class="row align-items-center pt-30"> 78 + <div class="row align-items-center pt-30 principle-section-item">
72 <div class="col-lg-12"> 79 <div class="col-lg-12">
73 - <div class="about-content mr-20 rmr-0 rmb-50 wow customFadeInRight delay-0-1s slow text-center"> 80 + <div class=" mr-20 rmr-0 rmb-50 text-center">
74 <div class="mb-35"> 81 <div class="mb-35">
75 <div class="title-style">魔镜智能运维建设三大原则</div> 82 <div class="title-style">魔镜智能运维建设三大原则</div>
76 </div> 83 </div>
@@ -110,18 +117,18 @@ @@ -110,18 +117,18 @@
110 117
111 </div> 118 </div>
112 </section> 119 </section>
113 -<section class="about-section rel pt-60 pb-70"> 120 +<section class="about-section rel pt-60 route-about-section">
114 <div class="container"> 121 <div class="container">
115 <div class="row align-items-center"> 122 <div class="row align-items-center">
116 <div class="col-lg-12"> 123 <div class="col-lg-12">
117 - <div class="about-content mr-20 rmr-0 rmb-50 wow customFadeInRight delay-0-1s slow text-center">  
118 - <div class="section-title mb-35"> 124 + <div class=" mr-20 rmr-0 rmb-50 text-center">
  125 + <div class=" mb-35">
119 <div class="title-style route-title">魔镜智能运维建设六步走路线</div> 126 <div class="title-style route-title">魔镜智能运维建设六步走路线</div>
120 </div> 127 </div>
121 </div> 128 </div>
122 </div> 129 </div>
123 </div> 130 </div>
124 - <div class="color-white"> 131 + <div class="color-white route-con">
125 <div :class="['step-route-item',{'step-route-item-active':stepActive==index}]" v-for="(item,index) in stepRoute" @mouseenter="showHover(index)" @mouseleave="hideHover"> 132 <div :class="['step-route-item',{'step-route-item-active':stepActive==index}]" v-for="(item,index) in stepRoute" @mouseenter="showHover(index)" @mouseleave="hideHover">
126 {{item}} 133 {{item}}
127 </div> 134 </div>
@@ -135,8 +142,16 @@ @@ -135,8 +142,16 @@
135 <img src="assets/img/shapes/shape2.png" alt="Shape"> 142 <img src="assets/img/shapes/shape2.png" alt="Shape">
136 </div> 143 </div>
137 </section> 144 </section>
  145 +<section class="about-section route-section">
  146 + <div class="step-route-bg">
  147 + <img src="assets/img/index/step-route-bg.jpg" alt="">
  148 + </div>
  149 + <div class="step-route-bg-sm">
  150 + <img src="assets/img/index/step-route-bg-sm.jpg" alt="">
  151 + </div>
138 152
139 -<section class="team-section rel pt-80 pb-80"> 153 +</section>
  154 +<section class="team-section rel pt-80 pb-80 compatible-section">
140 <div class="container"> 155 <div class="container">
141 <div class="mb-35 pr-65 align-items-center flex-column-center"> 156 <div class="mb-35 pr-65 align-items-center flex-column-center">
142 <div class="title-style">“魔镜智能”全面完成国产化兼容适配认证</div> 157 <div class="title-style">“魔镜智能”全面完成国产化兼容适配认证</div>
@@ -147,6 +162,9 @@ @@ -147,6 +162,9 @@
147 <img v-if="compatibleActive+1!=item.id" :src="'assets/img/index/'+item.logoUrl+'.png'" alt=""> 162 <img v-if="compatibleActive+1!=item.id" :src="'assets/img/index/'+item.logoUrl+'.png'" alt="">
148 <img v-if="compatibleActive+1==item.id" :src="'assets/img/index/'+item.logoUrlTip+'.png'" alt=""> 163 <img v-if="compatibleActive+1==item.id" :src="'assets/img/index/'+item.logoUrlTip+'.png'" alt="">
149 </div> 164 </div>
  165 + <div class="section-item-sm">
  166 + <div :class="['section-item-sm-icon',{'section-item-active':compatibleActive==index}]" @mouseenter="showHoverCompatible(index)" @mouseleave="hideHoverCompatible()" v-for="(item,index) in logoData">{{item.name}}</div>
  167 + </div>
150 </div> 168 </div>
151 <!-- <div class="team-carousel owl-carousel text-center" ref="teamCarousel">--> 169 <!-- <div class="team-carousel owl-carousel text-center" ref="teamCarousel">-->
152 <div class="compatible-carousel text-center" > 170 <div class="compatible-carousel text-center" >
@@ -51,7 +51,7 @@ @@ -51,7 +51,7 @@
51 <img :src="item.img" alt=""> 51 <img :src="item.img" alt="">
52 </div> 52 </div>
53 <div class="row mt-60 dataAbility-con" v-if="item.dataAbility && item.dataAbility.length>0"> 53 <div class="row mt-60 dataAbility-con" v-if="item.dataAbility && item.dataAbility.length>0">
54 - <div class="col-md-6 dataAbility-col" v-for="(itemD,indexD) in item.dataAbility"> 54 + <div class="col-lg-6 dataAbility-col" v-for="(itemD,indexD) in item.dataAbility">
55 <div class="dataAbility-item"> 55 <div class="dataAbility-item">
56 <div class="dataAbility-item-title">{{itemD.title}}</div> 56 <div class="dataAbility-item-title">{{itemD.title}}</div>
57 <div class="dataAbility-item-intro pt-20"> 57 <div class="dataAbility-item-intro pt-20">
@@ -36,7 +36,7 @@ @@ -36,7 +36,7 @@
36 <img :src="item.img" alt=""> 36 <img :src="item.img" alt="">
37 </div> 37 </div>
38 <div class="row pt-50" v-if="item.data && item.data.length>0"> 38 <div class="row pt-50" v-if="item.data && item.data.length>0">
39 - <div class="col-md-3 flex-start-column " v-for="(itemC,indexC) in item.data"> 39 + <div class="col-lg-3 col-md-6 flex-start-column alarm-system" v-for="(itemC,indexC) in item.data">
40 <div class="system-bg pd-20"> 40 <div class="system-bg pd-20">
41 <img class="" :src="itemC.icon" alt=""> 41 <img class="" :src="itemC.icon" alt="">
42 <h4 class="pt-30">{{itemC.title}}</h4> 42 <h4 class="pt-30">{{itemC.title}}</h4>
@@ -83,7 +83,7 @@ @@ -83,7 +83,7 @@
83 </div> 83 </div>
84 <div class="row pt-30 pb-30" v-if="item.dataFive && item.dataFive.length>0"> 84 <div class="row pt-30 pb-30" v-if="item.dataFive && item.dataFive.length>0">
85 <div class="row-top row pt-50"> 85 <div class="row-top row pt-50">
86 - <div class="col-lg-3 info-character" @mouseover="showHover(indexV)" v-for="(itemV,indexV) in item.dataFive"> 86 + <div class="col-md-3 col-lg-3 info-character info-character-busi" @mouseover="showHover(indexV)" v-for="(itemV,indexV) in item.dataFive">
87 <img v-if="valueIndex!=indexV" class="" :src="itemV.icon" alt=""> 87 <img v-if="valueIndex!=indexV" class="" :src="itemV.icon" alt="">
88 <img v-if="valueIndex==indexV" class="" :src="itemV.iconA" alt=""> 88 <img v-if="valueIndex==indexV" class="" :src="itemV.iconA" alt="">
89 <div class="pt-30"> 89 <div class="pt-30">
@@ -101,12 +101,12 @@ @@ -101,12 +101,12 @@
101 </div> 101 </div>
102 </div> 102 </div>
103 <div class="row pt-60 pb-30 kpi-row" v-if="item.dataKpi && item.dataKpi.length>0"> 103 <div class="row pt-60 pb-30 kpi-row" v-if="item.dataKpi && item.dataKpi.length>0">
104 - <div class="col-2 kpi-item" v-for="itemK in item.dataKpi"> 104 + <div class="col-md-2 kpi-item" v-for="itemK in item.dataKpi">
105 <div class="kpi-con">{{itemK}}</div> 105 <div class="kpi-con">{{itemK}}</div>
106 </div> 106 </div>
107 </div> 107 </div>
108 <div class="row mt-60 row-com" v-if="item.dataCom && item.dataCom.length>0"> 108 <div class="row mt-60 row-com" v-if="item.dataCom && item.dataCom.length>0">
109 - <div class="col-3 col-lg-3-self com-item" v-for="itemC in item.dataCom"> 109 + <div class="col-md-4 col-lg-3 col-lg-3-self com-item" v-for="itemC in item.dataCom">
110 <div class="com-item-con"> 110 <div class="com-item-con">
111 <div class="com-item-title">{{itemC.title}}</div> 111 <div class="com-item-title">{{itemC.title}}</div>
112 <div class="com-item-ul"> 112 <div class="com-item-ul">
@@ -36,7 +36,7 @@ @@ -36,7 +36,7 @@
36 <div class="info-intro-item" v-for="itemI in item.introData">{{itemI}}</div> 36 <div class="info-intro-item" v-for="itemI in item.introData">{{itemI}}</div>
37 </div> 37 </div>
38 <div class="row pt-30" v-if="item.data && item.data.length>0"> 38 <div class="row pt-30" v-if="item.data && item.data.length>0">
39 - <div class="col-md-3 flex-start-column " v-for="(itemC,indexC) in item.data"> 39 + <div class="col-lg-3 col-md-6 flex-start-column " v-for="(itemC,indexC) in item.data">
40 <div class="app-bg pd-25"> 40 <div class="app-bg pd-25">
41 <img class="" :src="itemC.icon" alt=""> 41 <img class="" :src="itemC.icon" alt="">
42 <div class="pt-30 app-title">{{itemC.title}}</div> 42 <div class="pt-30 app-title">{{itemC.title}}</div>
@@ -60,13 +60,13 @@ @@ -60,13 +60,13 @@
60 </div> 60 </div>
61 <div class="row mt-40 pb-30" v-if="item.dataFunc && item.dataFunc.length>0"> 61 <div class="row mt-40 pb-30" v-if="item.dataFunc && item.dataFunc.length>0">
62 <div class="func-top row"> 62 <div class="func-top row">
63 - <div @click="changeFunc(indexF)" :class="['col-lg-2', 'func-top-item',{'func-item-active':funcActive==indexF}]" v-for="(itemF,indexF) in item.dataFunc"> 63 + <div @click="changeFunc(indexF)" :class="['col-lg-2','col-md-4', 'func-top-item',{'func-item-active':funcActive==indexF}]" v-for="(itemF,indexF) in item.dataFunc">
64 {{itemF.title}} 64 {{itemF.title}}
65 </div> 65 </div>
66 </div> 66 </div>
67 - <div class="func-bottom row pt-30"> 67 + <div :class="'func-bottom row pt-30 func-bg-'+(funcActive+1)">
68 <div class="col-lg-6 func-bottom-title"><span></span><span>{{funcTitle}}</span></div> 68 <div class="col-lg-6 func-bottom-title"><span></span><span>{{funcTitle}}</span></div>
69 - <div :class="['col-lg-6', 'func-bottom-intro','flex-column-center',{'func-l-p':funcActive==1}]"> 69 + <div :class="['col-lg-6', 'func-bottom-intro','flex-column-center',{'func-l-p':funcActive==1,'func-l-1':funcActive==0}]">
70 <div class="func-bottom-con "> 70 <div class="func-bottom-con ">
71 <span class="func-symbol">“</span> 71 <span class="func-symbol">“</span>
72 <span class="funcIntro-span">{{funcIntro}}</span> 72 <span class="funcIntro-span">{{funcIntro}}</span>
@@ -58,7 +58,7 @@ @@ -58,7 +58,7 @@
58 </div> 58 </div>
59 <div class="row pt-30" v-if="item.dataThird && item.dataThird.length>0"> 59 <div class="row pt-30" v-if="item.dataThird && item.dataThird.length>0">
60 <div class="col-lg-4" v-for="(itemV,indexV) in item.dataThird"> 60 <div class="col-lg-4" v-for="(itemV,indexV) in item.dataThird">
61 - <div class="info-value" > 61 + <div class="info-value info-value-center" >
62 <img class="" :src="itemV.img" alt=""> 62 <img class="" :src="itemV.img" alt="">
63 <div :class="['info-value-title']"> 63 <div :class="['info-value-title']">
64 <h3>{{itemV.title}}</h3> 64 <h3>{{itemV.title}}</h3>
@@ -52,22 +52,22 @@ @@ -52,22 +52,22 @@
52 </div> 52 </div>
53 </div> 53 </div>
54 <div :class="[{'pro-advantage':item.type=='advantage'}]"></div> 54 <div :class="[{'pro-advantage':item.type=='advantage'}]"></div>
55 - <div class="row pt-30" v-if="item.dataFour && item.dataFour.length>0"> 55 + <div class="pt-30" v-if="item.dataFour && item.dataFour.length>0">
56 <div class="row-top row" v-for="(itemC,indexC) in item.dataFour" > 56 <div class="row-top row" v-for="(itemC,indexC) in item.dataFour" >
57 <div class="col-lg-6" v-if="indexC==characterActive"> 57 <div class="col-lg-6" v-if="indexC==characterActive">
58 <img class="" :src="itemC.img" alt=""> 58 <img class="" :src="itemC.img" alt="">
59 </div> 59 </div>
60 <div class="col-lg-6 flex-column-center " v-if="indexC==characterActive"> 60 <div class="col-lg-6 flex-column-center " v-if="indexC==characterActive">
61 - <h3>{{itemC.title}}</h3> 61 + <h3 class="maintenance-title">{{itemC.title}}</h3>
62 <div class="pt-30">{{itemC.introduction}}</div> 62 <div class="pt-30">{{itemC.introduction}}</div>
63 </div> 63 </div>
64 </div> 64 </div>
65 <div class="row-bottom row pt-30"> 65 <div class="row-bottom row pt-30">
66 <i class="iconCharacter icon-left" @click="prev(item.dataFour.length)"></i> 66 <i class="iconCharacter icon-left" @click="prev(item.dataFour.length)"></i>
67 <div class="dot-container row"> 67 <div class="dot-container row">
68 - <div @click="changeCharacter(indexC)" :class="['dot-item', 'col-lg-4', {'dot-item-active':indexC==characterActive,'div-hide':!itemC.isDisplay}]" v-for="(itemC,indexC) in item.dataFour"> 68 + <div @click="changeCharacter(indexC)" :class="['dot-item', 'col-lg-3', {'dot-item-active':indexC==characterActive,'div-hide':!itemC.isDisplay}]" v-for="(itemC,indexC) in item.dataFour">
69 <div class="dot-item-title" v-if="itemC.isDisplay">{{itemC.title}}</div> 69 <div class="dot-item-title" v-if="itemC.isDisplay">{{itemC.title}}</div>
70 - <div class="dot-item-intro" v-if="itemC.isDisplay">{{itemC.introduction}}</div> 70 +<!-- <div class="dot-item-intro" v-if="itemC.isDisplay">{{itemC.introduction}}</div>-->
71 </div> 71 </div>
72 </div> 72 </div>
73 <i class="iconCharacter icon-right" @click="next(item.dataFour.length)"></i> 73 <i class="iconCharacter icon-right" @click="next(item.dataFour.length)"></i>
@@ -32,7 +32,7 @@ export default { @@ -32,7 +32,7 @@ export default {
32 characterActive.value-- 32 characterActive.value--
33 if(characterActive.value == 0 || characterActive.value+1==dataLength-6){ 33 if(characterActive.value == 0 || characterActive.value+1==dataLength-6){
34 setDisplay(); 34 setDisplay();
35 - }else if(characterActive.value+1==dataLength-3 ){ 35 + }else if(characterActive.value+1==dataLength-4 ){
36 changeDot(dataLength,2); 36 changeDot(dataLength,2);
37 } 37 }
38 }else if(characterActive.value == 0){ 38 }else if(characterActive.value == 0){
@@ -54,11 +54,11 @@ export default { @@ -54,11 +54,11 @@ export default {
54 //特点左右点击切换 54 //特点左右点击切换
55 let changeDot=(dataLength,flag)=>{ 55 let changeDot=(dataLength,flag)=>{
56 if(flag==1){ 56 if(flag==1){
57 - //当前为第一个时向前点击 57 + //当前为第一个时，向前点击
58 maintenanceData.data.map((item,index)=>{ 58 maintenanceData.data.map((item,index)=>{
59 if(item.type == 'character'){ 59 if(item.type == 'character'){
60 item.dataFour.map((v,i)=>{ 60 item.dataFour.map((v,i)=>{
61 - if(i>characterActive.value-3){ 61 + if(i>characterActive.value-4){
62 v.isDisplay=true; 62 v.isDisplay=true;
63 }else{ 63 }else{
64 v.isDisplay=false; 64 v.isDisplay=false;
@@ -71,7 +71,7 @@ export default { @@ -71,7 +71,7 @@ export default {
71 maintenanceData.data.map((item,index)=>{ 71 maintenanceData.data.map((item,index)=>{
72 if(item.type == 'character'){ 72 if(item.type == 'character'){
73 item.dataFour.map((v,i)=>{ 73 item.dataFour.map((v,i)=>{
74 - if(i>characterActive.value-3 && i<=characterActive.value){ 74 + if(i>characterActive.value-4 && i<=characterActive.value){
75 v.isDisplay=true; 75 v.isDisplay=true;
76 }else{ 76 }else{
77 v.isDisplay=false; 77 v.isDisplay=false;
@@ -80,13 +80,13 @@ export default { @@ -80,13 +80,13 @@ export default {
80 } 80 }
81 }) 81 })
82 }else{ 82 }else{
83 - if(characterActive.value>2 && characterActive.value<dataLength){ 83 + if(characterActive.value>3 && characterActive.value<dataLength){
84 if(maintenanceData.data && maintenanceData.data.length>0){ 84 if(maintenanceData.data && maintenanceData.data.length>0){
85 maintenanceData.data.map((item,index)=>{ 85 maintenanceData.data.map((item,index)=>{
86 if(item.type == 'character'){ 86 if(item.type == 'character'){
87 - if(characterActive.value>2 && characterActive.value<6){ 87 + if(characterActive.value>3 && characterActive.value<maintenanceData.data.length){
88 item.dataFour.map((v,i)=>{ 88 item.dataFour.map((v,i)=>{
89 - if(i>2 && i<6){ 89 + if(i>3 && i<=7){
90 v.isDisplay=true; 90 v.isDisplay=true;
91 }else{ 91 }else{
92 v.isDisplay=false; 92 v.isDisplay=false;
@@ -94,7 +94,7 @@ export default { @@ -94,7 +94,7 @@ export default {
94 }) 94 })
95 }else{ 95 }else{
96 item.dataFour.map((v,i)=>{ 96 item.dataFour.map((v,i)=>{
97 - if(i>=dataLength-3){ 97 + if(i>=dataLength-4){
98 v.isDisplay=true; 98 v.isDisplay=true;
99 }else{ 99 }else{
100 v.isDisplay=false; 100 v.isDisplay=false;
@@ -13,6 +13,19 @@ @@ -13,6 +13,19 @@
13 </div> 13 </div>
14 <div class="container clearfix recruit-container" > 14 <div class="container clearfix recruit-container" >
15 <!-- <div style="margin: 0 auto;" class="clearfix">--> 15 <!-- <div style="margin: 0 auto;" class="clearfix">-->
  16 + <div class="bg-white border p-10 recruit-Hot-xl" v-if="recruitHot.data && recruitHot.data.length>1">
  17 + <div class="hot-recruit-box">
  18 + <div class="header">
  19 + <i></i>
  20 + <span class="font-size-18">{{recruitHot.head}}</span>
  21 + </div>
  22 + <ul class="m-1em">
  23 + <li class="mt-25 hotList" v-for="(item,index) in recruitHot.data">
  24 + <router-link :to=`/concat/recruit/${item.url}`>{{item.text}}</router-link>
  25 + </li>
  26 + </ul>
  27 + </div>
  28 + </div>
16 <div :class="['mr-10', 'bg-white border', 'p-10', {'recruit-width':recruitHot.data && recruitHot.data.length<=1,'w-70 float-left':recruitHot.data && recruitHot.data.length>1}]"> 29 <div :class="['mr-10', 'bg-white border', 'p-10', {'recruit-width':recruitHot.data && recruitHot.data.length<=1,'w-70 float-left':recruitHot.data && recruitHot.data.length>1}]">
17 <div class="recruit-box"> 30 <div class="recruit-box">
18 <div class="header"> 31 <div class="header">
@@ -50,7 +63,7 @@ @@ -50,7 +63,7 @@
50 <!-- <span class="btn btn-danger mt-25 mb-25 ml-15 d-inline-block min-width-100">现在申请</span>--> 63 <!-- <span class="btn btn-danger mt-25 mb-25 ml-15 d-inline-block min-width-100">现在申请</span>-->
51 </div> 64 </div>
52 </div> 65 </div>
53 - <div class="bg-white border float-left p-10 w-30" v-if="recruitHot.data && recruitHot.data.length>1"> 66 + <div class="bg-white border float-left p-10 w-30 recruit-Hot-lg" v-if="recruitHot.data && recruitHot.data.length>1">
54 <div class="hot-recruit-box"> 67 <div class="hot-recruit-box">
55 <div class="header"> 68 <div class="header">
56 <i></i> 69 <i></i>
@@ -58,7 +71,7 @@ @@ -58,7 +71,7 @@
58 </div> 71 </div>
59 <ul class="m-1em"> 72 <ul class="m-1em">
60 <li class="mt-25 hotList" v-for="(item,index) in recruitHot.data"> 73 <li class="mt-25 hotList" v-for="(item,index) in recruitHot.data">
61 - <router-link :to=`/recruit/${item.url}`>{{item.text}}</router-link> 74 + <router-link :to=`/concat/recruit/${item.url}`>{{item.text}}</router-link>
62 </li> 75 </li>
63 </ul> 76 </ul>
64 </div> 77 </div>
@@ -53,14 +53,14 @@ @@ -53,14 +53,14 @@
53 </div> 53 </div>
54 </div> 54 </div>
55 <div class="row-bottom row pt-30"> 55 <div class="row-bottom row pt-30">
56 - <i class="iconCharacter icon-left" @click="prev(item.dataFour.length)"></i> 56 +<!-- <i class="iconCharacter icon-left" @click="prev(item.dataFour.length)"></i>-->
57 <div class="dot-container row"> 57 <div class="dot-container row">
58 - <div @click="changeCharacter(indexC)" :class="['dot-item', 'col-lg-4', {'dot-item-active':indexC==characterActive,'div-hide':!itemC.isDisplay}]" v-for="(itemC,indexC) in item.dataFour"> 58 + <div @click="changeCharacter(indexC)" :class="['dot-item', 'col-lg-3', {'dot-item-active':indexC==characterActive,'div-hide':!itemC.isDisplay}]" v-for="(itemC,indexC) in item.dataFour">
59 <div class="dot-item-title" v-if="itemC.isDisplay">{{itemC.title}}</div> 59 <div class="dot-item-title" v-if="itemC.isDisplay">{{itemC.title}}</div>
60 - <div class="dot-item-intro" v-if="itemC.isDisplay">{{itemC.introduction}}</div> 60 +<!-- <div class="dot-item-intro" v-if="itemC.isDisplay">{{itemC.introduction}}</div>-->
61 </div> 61 </div>
62 </div> 62 </div>
63 - <i class="iconCharacter icon-right" @click="next(item.dataFour.length)"></i> 63 +<!-- <i class="iconCharacter icon-right" @click="next(item.dataFour.length)"></i>-->
64 </div> 64 </div>
65 </div> 65 </div>
66 <div class="row pt-30" v-if="item.dataFive && item.dataFive.length>0"> 66 <div class="row pt-30" v-if="item.dataFive && item.dataFive.length>0">
@@ -13,14 +13,14 @@ @@ -13,14 +13,14 @@
13 13
14 <section class="concat-service rel rpt-150 pb-130 rpb-0 text-left "> 14 <section class="concat-service rel rpt-150 pb-130 rpb-0 text-left ">
15 <div class="mb-2 title-style-top">运维数字化道路，鸿果与您同行</div> 15 <div class="mb-2 title-style-top">运维数字化道路，鸿果与您同行</div>
16 - <div class="mb-2 pt-30 title-intro-top">鸿果自研的产品--魔镜智能运维</div>  
17 - <div class="mb-2 title-intro-top pt-10">数据是智能运维的基石，算法是挖掘数据价值的关键，技术是实现智能运维的手段</div> 16 + <div class="mb-2 pt-30 title-intro-top">鸿果自研产品—魔镜智能运维</div>
  17 + <div class="mb-2 title-intro-top pt-10">“大数据”是智能运维的基石，“算法”是关联分析数据价值的引擎，“场景”是实现智能运维的深度应用。</div>
18 </section> 18 </section>
19 19
20 20
21 <section class=" rel" style="height: 100px"> 21 <section class=" rel" style="height: 100px">
22 <div class="container"> 22 <div class="container">
23 - <h2 class="page-title">产品中心</h2> 23 + <div class="page-title">“魔镜智能”产品中心</div>
24 </div> 24 </div>
25 </section> 25 </section>
26 26
@@ -42,7 +42,7 @@ @@ -42,7 +42,7 @@
42 </div> 42 </div>
43 <div class="col-lg-6 product-item" @click="jumpSecond(item.type)"> 43 <div class="col-lg-6 product-item" @click="jumpSecond(item.type)">
44 <div :class="[{'service-left-image':(index+1)%2==1,'service-right-image':(index+1)%2==0}, 'wow', {'customFadeInLeft':(index+1)%2==1,'customFadeInRight':(index+1)%2==0}, 'delay-0-1s', 'slow']"> 44 <div :class="[{'service-left-image':(index+1)%2==1,'service-right-image':(index+1)%2==0}, 'wow', {'customFadeInLeft':(index+1)%2==1,'customFadeInRight':(index+1)%2==0}, 'delay-0-1s', 'slow']">
45 - <img :src="'assets/img/services/p'+(index+1)+'.png'" style="border-radius: 10px;"> 45 + <img :src="'assets/img/services/p'+(index+1)+'.jpg'" style="border-radius: 10px;">
46 </div> 46 </div>
47 </div> 47 </div>
48 </div> 48 </div>