列表显示内容长短优化

hookehuyr
Commit 26f4ff451d7f323a1520eeee26e446d7e3103a76 26f4ff45 1 parent d7493f67
Showing 4 changed files with 22 additions and 18 deletions
src/components/BookCard/index.vue
src/components/RankingItem/index.vue
src/views/client/donateList.vue
src/views/client/rankList.vue
--- a/src/components/BookCard/index.vue
View file @26f4ff4
+++ b/src/components/BookCard/index.vue
View file @26f4ff4
@@ -49,14 +49,14 @@ const handle = () => {
 // 上传视频
 const show = ref(false);
 const onUpload = (v) => {
-  show.value = true;
+  // show.value = true;
   // x_field_1是金数据表单传入的参数，老师上传的格式为：user_id-book_id-perf_id，perf_id 为 0
   let str = `${props.user_id}-${v.id}-0`;
   location.href = `${JSJ_FORM_B}?x_field_1=${str}`;
   // BUG: 关闭loading临时处理
-  setTimeout(() => {
+  // setTimeout(() => {
-    show.value = false;
+  //   show.value = false;
-  }, 2000);
+  // }, 2000);
 }
 onBeforeRouteLeave(() => {
--- a/src/components/RankingItem/index.vue
View file @26f4ff4
+++ b/src/components/RankingItem/index.vue
View file @26f4ff4
@@ -2,7 +2,7 @@
  * @Author: hookehuyr hookehuyr@gmail.com
  * @Date: 2022-05-30 10:20:34
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2022-06-02 11:08:29
+ * @LastEditTime: 2022-06-02 16:34:53
  * @FilePath: /tswj/src/components/RankingList/index.vue
 -->
 <template>
@@ -16,7 +16,7 @@
         </div>
         <div v-else class="text">{{ indexKey + 1 }}</div>
       </van-col>
-      <van-col span="17" style="padding: 1rem 0.5rem 1rem 0;">
+      <van-col span="18" style="padding: 1rem 0.5rem 1rem 0;">
         <div :class="[rankInfo.multi_name ? 'height6rem' : 'height3rem', 'kg-name']" @click="go('/client/chooseBook', { kg_id: rankInfo.id })">
           <van-row align="center" justify="center" style="position: relative; top: 50%; transform: translateY(-50%);">
             <van-col span="4">
@@ -34,7 +34,7 @@
           </van-row>
         </div>
       </van-col>
-      <van-col span="5">
+      <van-col>
         <div class="flower" @click="go('/client/donateList', { kg_id: rankInfo.id })">
           <van-icon :name="icon_flower" color="#c5c5c5" size="1.25rem" style="vertical-align: bottom;" />&nbsp;{{ rankInfo.qty }}
         </div>
@@ -102,7 +102,11 @@ if (rankInfo.value.name.indexOf(' ') > -1) {
     }
   }
   .flower {
-    text-align: center; position: absolute; top: 40%; color: #713610;
+    text-align: center; 
+    position: absolute; 
+    top: 40%; 
+    right: 0.5rem;
+    color: #713610;
   }
   .kg-name {
--- a/src/views/client/donateList.vue
View file @26f4ff4
+++ b/src/views/client/donateList.vue
View file @26f4ff4
@@ -2,18 +2,18 @@
  * @Author: hookehuyr hookehuyr@gmail.com
  * @Date: 2022-05-30 13:51:47
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2022-06-01 15:40:42
+ * @LastEditTime: 2022-06-02 16:33:56
  * @FilePath: /tswj/src/views/client/donateList.vue
  * @Description: 幼儿园捐赠人捐赠金额排行榜
 -->
 <template>
   <div class="wrapper">
     <van-row>
-      <van-col span="18" style="padding: 1rem 0.5rem 1rem 0;">
+      <van-col span="20" style="padding: 1rem 0.5rem 1rem 0;">
         <div :class="[kgInfo.multi_name ? 'heightHigh' : 'heightLow', 'kg-name']">
           <van-row align="center" justify="center" style="position: relative; top: 50%; transform: translateY(-50%);">
             <van-col span="4">
-              <van-image round width="4rem" height="4rem" :src="kgInfo.kg_logo ? kgInfo.kg_logo : icon_logo" style="vertical-align: text-bottom;" />
+              <van-image round width="3.5rem" height="3.5rem" :src="kgInfo.kg_logo ? kgInfo.kg_logo : icon_logo" style="vertical-align: text-bottom;" />
             </van-col>
             <van-col span="20">
               <div v-if="kgInfo.multi_name" style="margin-left: 1.5rem;">
@@ -27,9 +27,9 @@
           </van-row>
         </div>
       </van-col>
-      <van-col span="6">
+      <van-col>
         <div class="flower">
-          <van-icon :name="icon_flower" color="#c5c5c5" size="1.5rem" style="vertical-align: bottom;" />&nbsp;{{ kgInfo.kg_total }}
+          <van-icon :name="icon_flower" color="#c5c5c5" size="1.25rem" style="vertical-align: bottom;" />&nbsp;{{ kgInfo.kg_total }}
         </div>
       </van-col>
     </van-row>
@@ -114,7 +114,7 @@ const onLoad = async () => {
 <style lang="less" scoped>
 .wrapper {
   padding-left: 0.5rem;
-  padding-right: 1rem;
+  padding-right: 0.5rem;
   background-color: #F7F7F7;
   position: relative;
@@ -139,7 +139,7 @@ const onLoad = async () => {
     text-align: center;
     position: absolute;
     top: 40%;
-    right: 1rem;
+    right: 0.5rem;
     color: #713610;
     font-size: 1.25rem;
   }
--- a/src/views/client/rankList.vue
View file @26f4ff4
+++ b/src/views/client/rankList.vue
View file @26f4ff4
@@ -2,14 +2,14 @@
  * @Author: hookehuyr hookehuyr@gmail.com
  * @Date: 2022-05-30 13:51:47
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2022-06-02 16:24:30
+ * @LastEditTime: 2022-06-02 16:42:09
  * @FilePath: /tswj/src/views/client/donateList.vue
  * @Description: 幼儿园儿童捐赠金额排行榜
 -->
 <template>
   <div class="wrapper">
     <van-row>
-      <van-col span="19" style="padding: 1rem 0.5rem 1rem 0;">
+      <van-col span="20" style="padding: 1rem 0.5rem 1rem 0;">
         <div :class="[kgInfo.multi_name ? 'heightHigh' : 'heightLow', 'kg-name']">
           <van-row align="center" justify="center" style="position: relative; top: 50%; transform: translateY(-50%);">
             <van-col span="4">
@@ -27,7 +27,7 @@
           </van-row>
         </div>
       </van-col>
-      <van-col span="5">
+      <van-col>
         <div class="flower">
           <van-icon :name="icon_flower" color="#c5c5c5" size="1.25rem" style="vertical-align: bottom;" />&nbsp;{{ kgInfo.kg_total }}
         </div>