关于我们调整样式+栏目banner写活

about/index.html

@@ -114,12 +114,13 @@
 
         <!--====== COMMON BREADCRUMB START ======-->
         <section class="common-bradcrumb-section inner-banner">
-            <img src="../assets/img/about/bg.png" alt="">
+            <img :src="columnImage" alt="">
         </section>
         <!--====== COMMON BREADCRUMB END ======-->
 
         <div>
-            <section class="about-introduce-section course-section pt-40 pb-60 about-sec" :id="arr.lmtitle"  v-for="(arr,index) in articalArray" :style="{background:(index % 2 == 1?'#F4F8FD':'#fff')}">
+            <section class="about-introduce-section course-section pt-40 pb-60 about-sec"  v-for="(arr,index) in articalArray" :style="{background:(index % 2 == 1?'#F4F8FD':'#fff')}">
+                <div :id="arr.sortindex"  class="pointOffset" >0</div>
                 <div class="container">
                     <ul  class="aboutTyes" v-if="index==0" >
                         <li v-for="item in articalArray" :key="item.id"><a :href="`#${item.lmtitle}`">{{item.title}}</a></li>
@@ -129,12 +130,25 @@
                         <span class="title-tag">{{arr.title}}</span>
                     </div>
 
-                    <div class="col-md-12 " v-html="arr.content" v-if="arr.content" style="background-color: #ffff;padding:50px">
+                    <!-- 图文混排 -->
+                    <div class="row" v-if="arr.image"  :style="{padding:(index % 2 == 1?'40px 25px':' 40px 25px')}"   style="background-color: #ffff;    box-shadow: 0px 10px 20px 10px rgb(179 202 216 / 20%)">
+                        <div class="col-md-7 pr-40 aboutImg ">
+                            <img :src="arr.image" alt="">
+                        </div>
+                        <div class="col-md-5"  v-html="arr.content">
+                        </div>
+                    </div>
+                    <!-- 只有富文本 -->
+                    <div class=""  v-else :style="{padding:(index % 2 == 1?'40px':'0 ')}"   style="background-color: #ffff;">
+                        <div class=" about-text-image"  v-html="arr.content"  >
+                        </div>
                     </div>
 
-                    <div class="col-md-12" v-if="arr.image" style="background-color: #ffff;">
+                    
+
+                    <!-- <div class="col-md-12 text-center" v-if="arr.image" :style="{padding:(index % 2 == 1?'50px':'0 50px ')}"  style="background-color: #ffff;">
                         <img :src="arr.image" alt="">
-                    </div>
+                    </div> -->
 
                     
                 </div>

assets/css/style.css

@@ -1575,6 +1575,12 @@
             .about-section .about-tile-gallery img {
                 position: absolute;
             }
+            .about-text-image img{
+                /* width:80%;
+                display:block;
+                margin:0 auto; */
+                
+            }
             
             .about-section .about-tile-gallery img.image-one {
                 top: 0;
@@ -5026,15 +5032,16 @@
                 position: relative;
                 left: 150px;
                 max-width: 1270px;
-                
-
-
             }     
             .about-sec .container .aboutTyes{
                 position:absolute;
-                left:-180px;
+                left:-190px;
                 box-shadow: 0px 2px 17px 4px rgba(126, 126, 126, 0.3);
             }
+            .about-sec .pointOffset{
+                position:relative;height:1px;opacity:0;top:-100px
+
+            }
             .about-sec .container .aboutTyes li a{
                 padding:17px 50px;
                 border-bottom:1px solid rgba(0,0,0,.05);

assets/js/commonVue.js

@@ -32,6 +32,7 @@ var app = new Vue({
     articalArray: [], //详情数组
     articalArrayRelated: [], //相关新闻
     columnTypes: [], //栏目类型
+    columnImage:'',//栏目图片
 
     
 
@@ -146,6 +147,9 @@ var app = new Vue({
         for (let i = 0; i < res.data.length; i++) {
           // console.log(res.data[i].sname)
           // console.log(window.location.pathname)
+
+        
+
           
 
           if (res.data[i].categoryName == '首页' && window.location.pathname == '/index.html') {
@@ -161,6 +165,7 @@ var app = new Vue({
           }
           if (res.data[i].categoryName == '产品服务' && window.location.pathname == '/product/read.html') {
             _this.currentPath = '/product/index.html' //产品详情时栏目高亮
+            _this.columnImage=res.data[i].imagePath;  //栏目图片获取
             setTimeout(()=>{
               _this.requestParams.title=''
               _this.getArticalData( _this.requestParams,1)
@@ -169,6 +174,8 @@ var app = new Vue({
           }
           if (res.data[i].categoryName == '解决方案' && window.location.pathname == '/solution/read.html') {
             _this.currentPath = '/solution/index.html' //产品详情时栏目高亮
+            _this.columnImage=res.data[i].imagePath;  //栏目图片获取
+           
             //获取相关新闻数据
             setTimeout(()=>{
               _this.requestParams.title=''
@@ -178,11 +185,13 @@ var app = new Vue({
           }
           if (res.data[i].categoryName == '解决方案') {
             _this.dialogDataArray=(res.data[i].children)
-            _this.ruleForm.platName= _this.dialogDataArray[0].categoryName
+            _this.ruleForm.platName= _this.dialogDataArray[0].categoryName;
+            _this.columnImage=res.data[i].imagePath;  //栏目图片获取
           }
 
           if (res.data[i].categoryName == '新闻动态' && window.location.pathname == '/news/read.html') {
             _this.currentPath = '/news/index.html' //新闻详情时栏目高亮
+            _this.columnImage=res.data[i].imagePath;  //栏目图片获取
 
             //获取相关新闻数据
             setTimeout(()=>{
@@ -222,6 +231,7 @@ var app = new Vue({
             _this.requestParams.categoryid=_this.getQuery('id') 
             console.log(_this.requestParams)
             _this.getArticalData(_this.requestParams)
+            _this.columnImage=res.data[i].imagePath;  //栏目图片获取
 
             //关于永天旧
             $.ajax({
@@ -259,6 +269,7 @@ var app = new Vue({
               _this.columnTypes = res.data[i].children
               _this.requestParams.categoryid = (_this.getQuery('isUrlId') == 1) ? _this.getQuery('id') : _this.columnTypes[0].id;
               _this.getArticalData(_this.requestParams)
+              _this.columnImage=res.data[i].imagePath;  //栏目图片获取
 
 
             }
@@ -266,6 +277,7 @@ var app = new Vue({
               _this.columnTypes = res.data[i].children
               _this.requestParams.categoryid = (_this.getQuery('isUrlId') == 1) ? _this.getQuery('id') : _this.columnTypes[0].id;
               _this.getArticalData(_this.requestParams)
+              _this.columnImage=res.data[i].imagePath;  //栏目图片获取
             }
           }
         }

news/index.html

@@ -111,7 +111,7 @@
 
         <!--====== NEWS BREADCRUMB START ======-->
         <section class="common-bradcrumb-section">
-            <img src="../assets/img/news/news-banner.png" alt="">
+            <img :src="columnImage" alt="">
         </section>
         <!--====== NEWS BREADCRUMB END ======-->
 

news/read.html

@@ -110,7 +110,7 @@
 
         <!--====== NEWS BREADCRUMB START ======-->
         <section class="common-bradcrumb-section">
-            <img src="../assets/img/news/read-banner.png" alt="">
+            <img :src="columnImage" alt="">
         </section>
         <!--====== NEWS BREADCRUMB END ======-->
 

product/index.html

@@ -141,8 +141,7 @@
 
         <!--====== COMMON BREADCRUMB START ======-->
         <section class="common-bradcrumb-section">
-            <!-- <img :src="banner" alt=""> -->
-            <img src="../assets/img/product/bg.jpg" alt="">
+            <img :src="columnImage" alt="">
         </section>
         <!--====== COMMON BREADCRUMB END ======-->
 

product/read.html

@@ -111,7 +111,7 @@
 
         <!--====== PRODUCT BREADCRUMB START ======-->
         <section class="common-bradcrumb-section">
-            <img src="../assets/img/product/bg.jpg" alt="">
+            <img :src="columnImage" alt="">
         </section>
         
 

solution/index.html

@@ -113,7 +113,8 @@
 
         <!--====== COMMON BREADCRUMB START ======-->
         <section class="common-bradcrumb-section inner-banner">
-            <img src="../assets/img/solution/solution-banner1.jpg" alt="">
+            <!-- <div style="position:absolute;top:0; right:0; bottom:0;left:0;background:rgba(0,0,0,.3)"></div> -->
+            <img :src="columnImage" alt="">
         </section>
         <!--====== COMMON BREADCRUMB END ======-->
 

solution/read.html

@@ -111,7 +111,7 @@
 
         <!--====== PRODUCT BREADCRUMB START ======-->
         <section class="common-bradcrumb-section">
-            <img src="../assets/img/product/bg.jpg" alt="">
+            <img :src="columnImage" alt="">
         </section>
         
 
@@ -149,9 +149,9 @@
                            
                         </div>
 
-                        <!-- 相关解决方案 start -->
+                        <!-- 相关推荐 start -->
                         <div v-if="articalArrayRelated.length>0">
-                            <div class="title-tag2 pt-60">相关解决方案</div>
+                            <div class="title-tag2 pt-60">相关推荐</div>
                             <div class="relNewBox container ">
 
                                 <a class="ustify-content-between d-flex relNewsList" :href="'./read.html?id='+item.categoryid+'&title='+item.title+'&isUrlId=1'" v-for="item in articalArrayRelated" :key="item.id">
@@ -166,7 +166,7 @@
                                 </a> -->
                             </div>
                         </div>
-                        <!-- 相关解决方案end -->
+                        <!-- 相关推荐end -->
 
                     </div>
                 </div>