慧治理定制应用

src/project/huizhili/AppEnteringCommunity/AppEnteringCommunity.vue

@@ -65,6 +65,43 @@
         </div>
       </div>
     </tempalte>
+    <div class="title-wrap" v-if="activityList.length">
+      <span class="title">居民活动</span>
+      <div class="right">
+        <span class="title-more" @click="$linkTo('/mods/AppVillageActivity/AppVillageActivity')">更多活动</span>
+        <u-icon name="arrow-right" size="28" color="#999999"></u-icon>
+      </div>
+    </div>
+    <scroll-view :scroll-x="true" style="width: 100%" class="scroll-wrap" v-if="activityList.length">
+      <div
+          class="scroll-card"
+          @click="$linkTo('/mods/AppVillageActivity/ActivityDetail?id=' + item.id)"
+          hover-class="text-hover"
+          v-for="(item, index) in activityList"
+          :key="index">
+        <image :src="item.url" mode="aspectFill"/>
+        <div class="text">
+          <span>{{ item.title }}</span>
+        </div>
+      </div>
+      <AiEmpty v-if="!activityList.length"></AiEmpty>
+    </scroll-view>
+    <div class="title-wrap">
+      <span class="title">乡村相册</span>
+    </div>
+    <div class="album-list">
+      <div
+          class="album"
+          v-for="(item, index) in albumList"
+          hover-class="text-hover"
+          :key="index"
+          @click="$linkTo('./AppPhotoAlbum?type=' + item.type + '&name=' + item.name + '&url=' + item.coverImg)">
+        <image :src="item.coverImg"/>
+        <div class="total">共{{ item.total }}张</div>
+        <div class="desc">{{ item.name }}</div>
+      </div>
+      <AiEmpty style="width: 100%" v-if="!albumList.length"></AiEmpty>
+    </div>
     <AiLogin ref="login"/>
   </div>
 </template>
@@ -83,6 +120,8 @@ export default {
       areaName: '',
       areaId: '',
       $areaId: '',
+      albumList: [],
+      activityList: [],
       publicList: [],
       moduleId: "",
       isInit: false
@@ -96,8 +135,14 @@ export default {
     this.autoLogin()
 
     this.$nextTick(() => {
+      this.getAlbumList()
+      this.getActiveList()
       this.getName()
     })
+
+    uni.$on('update', () => {
+      this.getAlbumList()
+    })
   },
 
   computed: {
@@ -198,11 +243,45 @@ export default {
       this.newsList = []
 
       this.$nextTick(() => {
+        this.getActiveList()
+        this.getAlbumList()
         this.getPublicList()
         uni.setStorageSync('areaId', this.areaId)
         uni.setStorageSync('areaName', this.areaName)
       })
     },
+
+    getAlbumList() {
+      this.$instance.post(`/app/appvillagepicturealbum/queryAlbumMenu?areaId=${this.areaId}`).then(res => {
+        if (res.code == 0) {
+          this.albumList = res.data.map(v => {
+            return {
+              ...v,
+              coverImg: `${this.$cdn}/dvcp/album/album${v.type}.png`
+            }
+          })
+        }
+      })
+    },
+
+    getActiveList() {
+      this.$instance.post(`/app/appvillageactivityinfo/listUp`, null, {
+        params: {
+          current: 1,
+          size: 6,
+          areaId: this.areaId
+        }
+      }).then(res => {
+        if (res.code == 0) {
+          this.activityList = res.data.records.map(v => {
+            return {
+              ...v,
+              url: v.url ? JSON.parse(v.url)[0].url : ''
+            }
+          })
+        }
+      })
+    }
   },
 
   onShareAppMessage() {
@@ -507,6 +586,67 @@ export default {
     }
   }
 
+  .album-list {
+    box-sizing: border-box;
+    padding: 0 32px 32px;
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 16px;
+
+    .album {
+      position: relative;
+      width: 218px;
+      height: 240px;
+      background: #FFFFFF;
+      box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.02);
+      border-radius: 16px;
+      overflow: hidden;
+
+      image {
+        position: absolute;
+        left: 0;
+        top: 0;
+        z-index: 1;
+        width: 100%;
+        height: 100%;
+      }
+
+      .total {
+        display: flex;
+        position: absolute;
+        align-items: center;
+        justify-content: center;
+        right: 8px;
+        top: 8px;
+        z-index: 2;
+        width: 74px;
+        height: 40px;
+        background: rgba(0, 0, 0, .6);
+        border-radius: 8px;
+        font-size: 22px;
+        font-weight: 400;
+        color: #FFFFFF;
+      }
+
+      .desc {
+        position: absolute;
+        bottom: 16px;
+        left: 0;
+        z-index: 2;
+        width: 100%;
+        height: 40px;
+        line-height: 40px;
+        padding: 0 12px;
+        font-size: 32px;
+        text-align: center;
+        color: #FFFFFF;
+        font-weight: 600;
+        box-sizing: border-box;
+      }
+    }
+  }
+
   ::v-deep .AiArea {
     padding-top: 64px;
     height: 88px;