fix 细节样式修改

hookehuyr
Commit 38818d1398d0dcf68fd47ea2b0148291398cdf9b 38818d13 1 parent 653d1400
Showing 3 changed files with 23 additions and 16 deletions
src/route.js
src/views/solution/detail.vue
src/views/solution/index.vue
--- a/src/route.js
View file @38818d1
+++ b/src/route.js
View file @38818d1
 /*
  * @Date: 2024-08-26 10:42:15
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-11-04 16:51:13
+ * @LastEditTime: 2024-11-29 14:06:03
  * @FilePath: /hager/src/route.js
  * @Description: 文件描述
  */
@@ -37,7 +37,7 @@ export default [{
   name: '解决方案',
   component: () => import('@/views/solution/index'),
   meta: {
-    title: '海格电气',
+    title: '解决方案 | Hager China',
     tag: 'solution'
   },
   children: []
@@ -46,7 +46,7 @@ export default [{
   name: '解决方案详情',
   component: () => import('@/views/solution/detail'),
   meta: {
-    title: '海格电气',
+    title: '解决方案 | Hager China',
     tag: 'solution'
   },
   children: []
@@ -55,7 +55,7 @@ export default [{
   name: '成功案例',
   component: () => import('@/views/solution/case'),
   meta: {
-    title: '海格电气',
+    title: '解决方案 | Hager China',
     tag: 'solution'
   },
   children: []
--- a/src/views/solution/detail.vue
View file @38818d1
+++ b/src/views/solution/detail.vue
View file @38818d1
 <!--
  * @Date: 2024-09-29 15:49:27
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-11-29 11:26:32
+ * @LastEditTime: 2024-12-02 09:56:26
  * @FilePath: /hager/src/views/solution/detail.vue
  * @Description: 文件描述
 -->
@@ -20,13 +20,13 @@
         <el-col :span="12" style="height: 25rem;">
           <el-carousel height="25rem" :interval="8000" style="border-radius: 5px;">
             <el-carousel-item v-for="(item, index) in case_img" :key="index" class="carousel-img">
-              <el-image @click="onClickImg(item)" style="width: 100%; height: 100%;" fit="fill" :src="item"></el-image>
+              <el-image @click="onClickImg(item.value)" style="width: 100%; height: 100%;" fit="cover" :src="item.value"></el-image>
             </el-carousel-item>
           </el-carousel>
         </el-col>
         <el-col :span="12" class="brief-introduction">
           <div class="intro-box">
-            <p style="margin: 2rem 0;" v-html="case_info.category_description"></p>
+            <p v-html="case_info.category_description"></p>
             <!-- <i class="el-icon-right"></i> -->
           </div>
         </el-col>
@@ -36,7 +36,7 @@
       <div style="height: 25rem; margin-top: 2rem;">
         <el-carousel height="25rem" :interval="8000" style="border-radius: 5px;">
           <el-carousel-item v-for="(item, index) in case_img" :key="index" class="carousel-img">
-            <el-image @click="onClickImg(item)" style="width: 100%; height: 100%;" fit="fill" :src="item"></el-image>
+            <el-image @click="onClickImg(item.value)" style="width: 100%; height: 100%;" fit="cover" :src="item.value"></el-image>
           </el-carousel-item>
         </el-carousel>
       </div>
@@ -297,12 +297,19 @@ export default {
   .brief-introduction {
     background-color: #FFF;
     height: 25rem;
+    display: flex;
+    align-items: center;
     &.xs {
       height: auto;
     }
     .intro-box {
-      padding: 3rem;
+      padding: 0 3rem;
-      padding-top: 0;
+      overflow: auto;
+      height: 25rem;
+      box-sizing:border-box;
+      display: flex;
+      // align-items: center;
+      margin-top: 2rem;
       &.xs {
         padding: 2rem;
       }
--- a/src/views/solution/index.vue
View file @38818d1
+++ b/src/views/solution/index.vue
View file @38818d1
@@ -115,8 +115,8 @@ export default {
       },
       activeIndex: 0,
       reach_end: false,
-      solution_box_height: '10rem',
+      solution_box_height: '25rem',
-      solution_mini_height: '10rem',
+      solution_mini_height: '25rem',
     }
   },
   async mounted () {
@@ -126,8 +126,8 @@ export default {
     }
     this.$nextTick(() => {
       // 高度监听
-      this.solution_box_height = $('.hager-solution-top').outerWidth() * 0.3 + 'px';
+      // this.solution_box_height = $('.hager-solution-top').outerWidth() * 0.255 + 'px';
-      this.solution_mini_height = $(window).outerWidth() * 0.55 + 'px';
+      // this.solution_mini_height = $(window).outerWidth() * 0.55 + 'px';
       // 动态计算图片高度
       let img_width = $('.card-image').outerWidth();
       $('.card-image').css('height', img_width * 0.7 + 'px');
@@ -141,8 +141,8 @@ export default {
   methods: {
     handleHeightResize () {
       // 高度监听
-      this.solution_box_height = $('.hager-solution-top').outerWidth() * 0.3 + 'px';
+      // this.solution_box_height = $('.hager-solution-top').outerWidth() * 0.255 + 'px';
-      this.solution_mini_height = $('.hager-solution-top').outerWidth() * 0.6 + 'px';
+      // this.solution_mini_height = $('.hager-solution-top').outerWidth() * 0.6 + 'px';
       // 动态计算图片高度
       let img_width = $('.card-image').outerWidth();
       $('.card-image').css('height', img_width * 0.7 + 'px');