empty 样式处理

pages.json

@@ -3,7 +3,7 @@
     {
       "path": "pages/home/home",
       "style": {
-        "navigationBarTitleText": "图书馆"
+        "navigationBarTitleText": "葛店经济技术开发区图书馆"
       }
     },
     {
@@ -21,7 +21,7 @@
     {
       "path": "pages/login/login",
       "style": {
-        "navigationBarTitleText": "登录"
+        "navigationBarTitleText": "绑定读者证"
       }
 	},
 	{

pages/home/home.vue

@@ -114,7 +114,7 @@
         :circular="false"
       >
         <swiper-item  v-for="item in readerCardList" :key="item.id">
-          <view class="card-item"  @click.stop="showQrcode(item.bindValue)">
+          <view class="card-item" :class="{'active': item.bindDefault}"   @click.stop="showQrcode(item.bindValue)">
             <image class="card-left-img" src="@/static/images/card-img2.png" mode="widthFix" />
             <view class="card-right-info">
               <text class="info-title">读者证号</text>
@@ -179,7 +179,7 @@
           <view class="book-title">{{item.name}}</view>
         </view>
       </view>
-      <view class="empty-box" v-if="recommendedBooks.length === 0 && !isLoading">
+      <view class="empty" v-if="recommendedBooks.length === 0 && !isLoading">
         <uni-icons custom-prefix="iconfont" type="icon-kongshuju" size="80"></uni-icons>
 				<text style="margin-top: 20px;">暂无推荐书籍~</text>
 			</view>
@@ -721,15 +721,4 @@ swiper.menu-swiper{
     color: #999 !important;
   }
 }
-
-/* 空状态 */
-.empty-box {
-	display: flex;
-  flex-direction: column;
-	justify-content: center;
-	align-items: center;
-	color: #999;
-	font-size: 15px;
-  padding: 20px;
-}
 </style>

pages/lendCar/lendCar.vue

@@ -38,7 +38,7 @@
 
       <!-- 空状态 -->
       <view class="empty" v-if="bookList.length === 0">
-        <uni-icons custom-prefix="iconfont" type="icon-kongshuju" size="80" color="#ccc"></uni-icons>
+        <uni-icons style="margin-left: 20px;" custom-prefix="iconfont" type="icon-kongshuju" size="80" color="#ccc"></uni-icons>
         <text class="empty-text">暂无借阅图书</text>
       </view>
     </view>
@@ -434,17 +434,12 @@ export default {
 
 /* 空状态 */
 .empty {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
   height: calc(100vh - 140px);
 }
 
 .empty-text {
   margin-top: 20px;
   font-size: 14px;
-  color: #999;
 }
 
 /* 底部占位 */

pages/search/search.vue

@@ -68,8 +68,9 @@
 		</view>
     
     <!-- 空状态 -->
-	  <view class="empty-box" v-if="isSearched && listData.length === 0">
-			<text>没有检索到相关数据</text>
+	  <view class="empty" v-if="isSearched && listData.length === 0">
+      <uni-icons style="margin-left: 20px;" custom-prefix="iconfont" type="icon-kongshuju" size="80" color="#ccc"></uni-icons>
+      <text style="margin-top: 20px;">没有检索到相关数据</text>
 		</view>
 	</view>
 </template>
@@ -321,13 +322,8 @@ export default {
 	font-weight: 400;
 }
 
-.empty-box {
-	display: flex;
-	justify-content: center;
-	align-items: center;
+.empty {
 	height: 50vh;
-	font-size: 14px;
-	color: #999;
   padding-top: 100px;
 }
 </style>

styles/global.scss

@@ -243,6 +243,7 @@
 	align-items: center;
   padding: 20px;
   color: #999;
+  font-size: 15px;
 }
 
 // 覆盖 uni-popup 层级

subpkg/pages/activity-list/activity-list.vue

@@ -45,7 +45,7 @@
 				</view>
 			</view>
 
-			<view class="empty-box" v-if="displayList.length === 0">
+			<view class="empty" v-if="displayList.length === 0">
         <uni-icons custom-prefix="iconfont" type="icon-kongshuju" size="80"></uni-icons>
 				<text style="margin-top: 20px;">暂无{{ currentTab === 0 ? '进行中的活动' : '往期活动' }}~</text>
 			</view>
@@ -304,14 +304,8 @@ scroll-view {
 	height: calc(100vh - 120px);
 }
 
-.empty-box {
-	display: flex;
-  flex-direction: column;
-	justify-content: center;
-	align-items: center;
+.empty {
 	height: calc(100vh - 200px);
-	color: #999;
-	font-size: 15px;
 }
 
 .activity-item {

subpkg/pages/collect-list/collect-list.vue

@@ -95,10 +95,7 @@ export default {
 }
 
 .empty {
-	text-align: center;
 	padding: 60px 0;
-	color: #999;
-	font-size: 14px;
 }
 .no-more {
 	text-align: center;

subpkg/pages/feedback-list/feedback-list.vue

@@ -1,7 +1,7 @@
 <template>
   <view class="feedback-page">
     <view class="feedback-list">
-      <view class="empty-box" v-if="feedbackList.length === 0">
+      <view class="empty" v-if="feedbackList.length === 0">
         <uni-icons style="margin-left: 20px;" custom-prefix="iconfont" type="icon-kongshuju" size="80" color="#ccc"></uni-icons>
         <text style="margin-top: 20px;">暂无留言</text>
       </view>
@@ -79,14 +79,8 @@ export default {
   padding: 10px;
 }
 
-.empty-box {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
+.empty {
   height: calc(100vh - 200px);
-  color: #999;
-  font-size: 15px;
 }
 
 .feedback-item {

subpkg/pages/ranking/ranking.vue

@@ -17,9 +17,9 @@
 
     <view class="ranking-list">
       <!-- 空状态 -->
-      <view class="empty-box" v-if="rankingData.length === 0">
-        <uni-icons type="cube" size="70" color="#ccc"></uni-icons>
-        <text>暂无读者排行数据</text>
+      <view class="empty" v-if="rankingData.length === 0">
+        <uni-icons style="margin-left: 20px;" custom-prefix="iconfont" type="icon-kongshuju" size="80" color="#ccc"></uni-icons>
+        <text style="margin-top: 20px;">暂无读者排行数据</text>
       </view>
 
       <view 
@@ -195,14 +195,8 @@ export default {
 }
 
 /* 空状态 */
-.empty-box {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
+.empty {
   height: 50vh;
-  color: #999;
-  font-size: 15px;
 }
 
 .ranking-item{

subpkg/pages/reader-card/reader-card.vue

@@ -12,7 +12,7 @@
         v-for="(item, index) in cardList" 
         :key="item.id"
         @click="handleSelectItem(item.bindValue)"
-        :class="{ active: selectedValue === item.bindValue }"
+        :class="{ active: selectedValue === item.bindValue || (!isEditMode && item.bindDefault) }"
       >
         <image class="card-left-img" src="@/static/images/card-img2.png" mode="widthFix" />
         <view class="card-right-info">
@@ -365,11 +365,11 @@ export default {
 .card-setting{
   display: flex;
   flex-direction: column;
-  align-items: center;
+  align-items: flex-end;
   justify-content: center;
   button{
     padding: 0 8px !important;
-    margin-bottom: 6px;
+    margin-bottom: 16px;
     font-size: 12px;
   }
   ::v-deep .icon-erweima{