#2 fix(社区):社区主页样式微调

マージされた
duanqianwen 1 年間 前 に 1 件のコミットが Tim_Walker/feature-sq から Tim_Walker/master にマージされました
3 ファイル変更68 行追加34 行削除
  1. 26 13
      package-lock.json
  2. 1 0
      package.json
  3. 41 21
      src/pages/client/tabBar/community/index.vue

+ 26 - 13
package-lock.json

@@ -4169,6 +4169,27 @@
         "whatwg-fetch": "^3.6.2"
       },
       "dependencies": {
+        "@vue/vue-loader-v15": {
+          "version": "npm:vue-loader@15.11.1",
+          "resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-15.11.1.tgz",
+          "integrity": "sha512-0iw4VchYLePqJfJu9s62ACWUXeSqM30SQqlIftbYWM3C+jpPcEHKSPUZBLjSF9au4HTHQ/naF6OGnO3Q/qGR3Q==",
+          "dev": true,
+          "requires": {
+            "@vue/component-compiler-utils": "^3.1.0",
+            "hash-sum": "^1.0.2",
+            "loader-utils": "^1.1.0",
+            "vue-hot-reload-api": "^2.3.0",
+            "vue-style-loader": "^4.1.0"
+          },
+          "dependencies": {
+            "hash-sum": {
+              "version": "1.0.2",
+              "resolved": "https://registry.npmmirror.com/hash-sum/-/hash-sum-1.0.2.tgz",
+              "integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
+              "dev": true
+            }
+          }
+        },
         "acorn": {
           "version": "8.8.2",
           "resolved": "https://registry.npmmirror.com/acorn/-/acorn-8.8.2.tgz",
@@ -4304,19 +4325,6 @@
       "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.4.tgz",
       "integrity": "sha512-abSgiVRhfjfl3JALR/cSuBl74hGJ3SePgf1mKzodf1eMWLwHZbfEGxT2cNJSsNiw44jEgrO7bNkhchaWA7RwNw=="
     },
-    "@vue/vue-loader-v15": {
-      "version": "npm:vue-loader@15.11.1",
-      "resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-15.11.1.tgz",
-      "integrity": "sha512-0iw4VchYLePqJfJu9s62ACWUXeSqM30SQqlIftbYWM3C+jpPcEHKSPUZBLjSF9au4HTHQ/naF6OGnO3Q/qGR3Q==",
-      "dev": true,
-      "requires": {
-        "@vue/component-compiler-utils": "^3.1.0",
-        "hash-sum": "^1.0.2",
-        "loader-utils": "^1.1.0",
-        "vue-hot-reload-api": "^2.3.0",
-        "vue-style-loader": "^4.1.0"
-      }
-    },
     "@vue/web-component-wrapper": {
       "version": "1.3.0",
       "resolved": false,
@@ -12089,6 +12097,11 @@
       "integrity": "sha512-2qHaIQr2VLRFoxe2nASzsV6ef4yOOH+Fi9FBOVH6cqeSgUnoyySPZkxzLuzd+RYOQTRpROA0ztTMqxROKSb/nA==",
       "dev": true
     },
+    "pnpm": {
+      "version": "9.0.6",
+      "resolved": "https://registry.npmmirror.com/pnpm/-/pnpm-9.0.6.tgz",
+      "integrity": "sha512-9thjEwlzIHy3ozbWtDmiQqJqyAaAd99TDWqGBpQZhT3B/+ZAKexZSpxQWjpBDRlkPIcKumd2Mw9c/dzxCpwWFw=="
+    },
     "portfinder": {
       "version": "1.0.32",
       "resolved": false,

+ 1 - 0
package.json

@@ -79,6 +79,7 @@
     "core-js": "^3.35.0",
     "dayjs": "^1.11.7",
     "flyio": "0.6.14",
+    "pnpm": "^9.0.6",
     "uni-read-pages": "^1.0.5",
     "uni-simple-router": "^2.0.8-beta.4",
     "uniapp-axios-adapter": "^0.3.2",

+ 41 - 21
src/pages/client/tabBar/community/index.vue

@@ -20,15 +20,23 @@
       <view class="item-box" v-for="(item,index) of initList" :key='index'>
         <view class="item-top">
           <view class="top-left">
-            <image class="img" :src="item.userDTO.avatar"></image>
+            <!-- <image class="img" :src="" v-if="item.userDTO.avata"></image> -->
+            <u-avatar :src="item.userDTO.avatar" size="45"  />
           </view>
           <view class="top-right">
             <view class="right-title">{{ item.userDTO.nickname }}</view>
-            <view class="right-address">{{ item.distanceTime }} {{ item.location }}</view>
+            <view class="right-address">
+              <view class="marRight-20">
+                {{ item.distanceTime }}
+              </view>
+              <view class="">
+
+               {{ item.location }}
+            </view> </view>
           </view>
         </view>
 
-        <u-line margin='10rpx 0'></u-line>
+        <!-- <u-line margin='10rpx 0'></u-line> -->
 
         <view class="item-center">
           <view class="center-text">
@@ -41,12 +49,13 @@
         <view class="item-bottom">
           <view class="bottom-item">
             <u-icon :name="item.clickStatus == 0 ? 'heart' : 'heart-fill'" :size='iconSize'
-              @click='handlerPraise(item)'></u-icon><span>{{ item.goodNum }}</span>
+              @click='handlerPraise(item)'></u-icon><view class="iconNUm">{{ item.goodNum }}</view>
           </view>
           <view class="bottom-item" @click='handlerRequireComment(item)'>
-            <u-icon name="more-circle" :size='iconSize'></u-icon><span>{{ item.commentNum }}</span>
+            <u-icon name="more-circle" :size='iconSize'></u-icon><view class="iconNUm">{{ item.commentNum }}</view>
           </view>
         </view>
+        <u-line margin='-20rpx 0' v-if="index!=initList.length-1"></u-line>
       </view>
     </view>
 
@@ -224,16 +233,16 @@
     }
 
     .center-box {
-      margin: 30rpx auto 0;
-      width: 95%;
+      // margin: 30rpx auto 0;
+
       font-size: 28rpx;
 
       .item-box {
-        padding: 20rpx;
-        border-radius: 20rpx;
-        box-sizing: border-box;
-        margin-bottom: 20rpx;
-        box-shadow: 0 5rpx 15rpx 0 rgba(0, 0, 0, 0.2);
+        padding: 20rpx 20rpx 30rpx 20rpx;
+        // border-radius: 20rpx;
+        // box-sizing: border-box;
+        // margin-bottom: 20rpx;
+        // box-shadow: 0 5rpx 15rpx 0 rgba(0, 0, 0, 0.2);
         background-color: #fff;
 
         .item-top {
@@ -257,15 +266,21 @@
             }
 
             .right-address {
+              display: flex;
+             .marRight-20{
+               margin-right: 20rpx;
+             }
               color: #959595;
-              font-style: italic;
-              font-weight: bold;
+              // font-style: italic;
+              // font-weight: bold;
               font-size: 24rpx;
             }
           }
         }
 
         .item-center {
+          margin-left: 100rpx;
+          margin-top: 20rpx;
           .center-text {
             font-size: 32rpx;
           }
@@ -275,23 +290,28 @@
             display: grid;
             grid-template-columns: 32% 32% 32%;
             gap: 4% 1%;
-
+            margin-bottom: 10rpx;
             .center-img {
-              width: 200rpx;
-              height: 200rpx;
-			  border-radius: 20rpx;
+              width: 186rpx;
+              height: 186rpx;
+			  border-radius: 6rpx;
             }
           }
         }
 
         .item-bottom {
           display: flex;
-          margin-top: 40rpx;
-
+          // margin-top: 10rpx;
+          margin-bottom: 56rpx;
+          margin-right: 8rpx;
+          justify-content: flex-end;
           .bottom-item {
             display: flex;
             align-items: center;
-            width: 20%;
+            min-width: 100rpx;
+            .iconNUm{
+              margin-left: 7rpx;
+            }
           }
         }
       }