img优化

src/assets/styles/index.scss

@@ -161,11 +161,13 @@
       width: 100%;
       height: 520px;
       border-radius: 4px;
+      overflow: hidden;
     }
     img{
       display: block;
       width: 100%;
-      height: 100%;
+      max-height: 100%;
+      object-fit: contain;
     }
     .book-info{
       padding: 12px 0 0 44px;
@@ -194,10 +196,13 @@
       width: 244px;
       height: 100%;
       margin-right: 20px;
+      overflow: hidden;
     }
     img{
       display: block;
       width: 100%;
+      max-height: calc(100%);
+      object-fit: contain;
     }
     .book-info{
       padding: 20px 10px 0 0;
@@ -229,10 +234,13 @@
       width: 100%;
       height: 240px;
       margin-bottom: 10px;
+      overflow: hidden;
     }
     img{
       display: block;
       width: 100%;
+      max-height: calc(100%);
+      object-fit: contain;
     }
     .book-title{
       margin-bottom: 0;

src/views/digitalResource.vue

@@ -8,7 +8,7 @@
     </div>
     <div class="main">
       <div v-for="(item,index) in srcList" :key="index" class="main-item" @click="jump(item.nrsUrl)">
-        <img :src="'data:image/png;base64,' + item.nrsImages">
+        <img :src="'data:image/png;base64,' + item.nrsImages" />
         <div class="title">
           {{ item.nrsTitle }}
         </div>

src/views/module/bookDetails.vue

@@ -10,17 +10,19 @@
         <div class="book-details-box">
           <div class="book-details">
             <div class="book-cover">
-              <img :src="bookData.srcUrl ? bookData.srcUrl : ''" :onerror="defaultImg">
+              <img :src="bookData.srcUrl ? bookData.srcUrl : ''" :onerror="defaultImg" />
             </div>
             <div class="book-desc">
               <h3>{{ bookData.bookName }}</h3>
               <p class="book-from">作者：{{ bookData.bookAuthor }}</p>
               <p v-if="bookData.Publish" class="book-from">出版社：{{ bookData.Publish }}</p>
-              <p class="book-brief"> 简介：{{ bookData.gist }}</p>
+              <p class="book-brief"> 简介：{{ bookData.gist ? bookData.gist : '暂无简介' }}</p>
             </div>
           </div>
           <div class="book-local">
             <span v-if="bookData.bookPlace">所在位置：{{ bookData.bookPlace }}</span>
+            <!-- 待定：热门图书/新书推荐跳转到 场馆导航操作 -->
+            <span v-else>所在位置</span>
           </div>
         </div>
       </div>
@@ -86,12 +88,17 @@ export default {
     justify-content: space-between;
     padding: 30px 0;
     .book-cover{
+      display: flex;
+      align-items: center;
       width: 318px;
       height: 382px;
       margin-right: 40px;
+      overflow: hidden;
       img{
+        display: block;
         width: 100%;
-        height: 100%;
+        max-height: calc(100%);
+        object-fit: contain;
       }
     }
     .book-desc{

src/views/module/bookList.vue

@@ -15,7 +15,9 @@
     </div>
     <ul class="hotbook-list">
       <li v-for="(item,index) in bookList" :key="index" @click="handleDetails(index+1)">
-        <img :src="item.cover ? item.cover : ''" :onerror="defaultImg">
+        <div class="other-list-img">
+          <img :src="item.cover ? item.cover : ''" :onerror="defaultImg" />
+        </div>
         <p class="book-name">{{ item.nbName || item.hbName }}</p>
       </li>
     </ul>
@@ -89,10 +91,14 @@ export default {
     bottom: 20px;
     width: 318px;
     height: 382px;
+    display: flex;
+    align-items: center;
     overflow: hidden;
     img{
+      display: block;
       width: 100%;
       vertical-align: middle;
+      object-fit: contain;
     }
   }
   .txt{
@@ -124,11 +130,19 @@ export default {
     margin-left: 48px;
     width: 300px;
     overflow: hidden;
-    // text-align: center;
+    .other-list-img{
+      display: flex;
+      align-items: center;
+      width: 100%;
+      height: 360px;
+      overflow: hidden;
+    }
     img{
+      display: block;
       width: 100%;
+      max-height: calc(100%);
       vertical-align: middle;
-      height: 360px;
+      object-fit: contain;
     }
     .book-name{
       width: 100%;

src/views/module/homeListItem.vue

@@ -3,7 +3,7 @@
     <div :class="[isNewBook ? 'list-small' : (isOtherBook ? 'list-middle' : 'list-big') ]">
       <div v-for="(item,index) in listData" :key="item.ranking" class="list-item" @click="handleDetails(index)">
         <div class="book-img">
-          <img :src="item.cover" :onerror="defaultImg">
+          <img :src="item.cover" :onerror="defaultImg" />
         </div>
         <div class="book-info">
           <h4 :class="['book-title', {'title-item': !isOtherBook}]">{{ item.nbName }}</h4>