commit

frontend/src/pages/index/index.vue

@@ -32,41 +32,81 @@
         </view>
         <view class="menu-text">项目报名</view>
       </view>
-      <view class="menu-item" @click="navigateTo('/pages/activity/dynamic/index')">
-        <view class="menu-icon-wrapper blue-bg">
-          <view class="menu-icon star-icon"></view>
-        </view>
-        <view class="menu-text">精彩瞬间</view>
-      </view>
+<!--      <view class="menu-item" @click="navigateTo('/pages/activity/dynamic/index')">-->
+<!--        <view class="menu-icon-wrapper blue-bg">-->
+<!--          <view class="menu-icon star-icon"></view>-->
+<!--        </view>-->
+<!--        <view class="menu-text">精彩瞬间</view>-->
+<!--      </view>-->
     </view>
 
     <!-- 精选内容区 -->
     <view class="content-section">
       <view class="section-header">
-        <view class="section-title">精选活动</view>
-        <view class="section-more" @click="navigateTo('/pages/activity/index')">更多</view>
+        <view class="section-title">近期活动</view>
+        <view class="section-more" @click="navigateTo('/pages/activity/list/index')">更多</view>
+      </view>
+
+      <t-swiper
+        :autoplay="actList.length > 1"
+        :navigation="{ type: 'fraction', paginationPosition: 'bottom-right', showControls: true }"
+      >
+        <t-swiper-item v-for="(item, index) in actList" :key="index" style="height: 192px">
+          <view class="activity-list" @click="navigateTo('/pages/activity/detail/index?id=' + item.id)">
+            <view class="activity-item">
+              <image class="activity-image"
+                     :src="item.cover"
+                     mode="widthFix"></image>
+              <view class="activity-info">
+                <view class="activity-title">{{ item.title }}</view>
+                <view class="activity-meta">
+                  <text class="activity-time">{{ moment(item.startTime).format('M月DD日') + '-' + moment(item.endTime).format('DD日') }}</text>
+                  <text class="activity-location">{{ item.address }}</text>
+                </view>
+              </view>
+            </view>
+          </view>
+        </t-swiper-item>
+      </t-swiper>
+
+    </view>
+
+    <view class="content-section">
+      <view class="section-header">
+        <view class="section-title">精彩瞬间</view>
       </view>
 
       <view class="activity-list">
-        <view class="activity-item" @click="navigateTo('/pages/process/index')">
-          <image class="activity-image"
-                 src="https://erp-bucket.pek3b.qingstor.com/assistant/746c37d6-018d-4c64-8a98-ea9ec8b0b3b5.png"
+        <view class="moment-item" v-for="item in wonderfulMomentList" :key="item.id"
+              @click="handleWonderfulMoment(item)">
+          <image class="moment-image"
+                 src="https://erp-bucket.pek3b.qingstor.com/assistant/89c4b573-c54f-467a-b703-0bc44679ab08.png"
                  mode="widthFix"></image>
-          <view class="activity-info">
-            <view class="activity-title">一分钟了解运动会流程</view>
-            <view class="activity-meta">
-              <text class="activity-time">6月15日-20日</text>
-              <text class="activity-location">江苏省体育中心</text>
+          <view class="moment-content">
+            <view class="moment-title">{{ item.title }}</view>
+            <view class="moment-sub-content">
+              <view style="float: right;">{{ item.time }}</view>
+              <view>阅读 {{ item.readCount }}</view>
             </view>
           </view>
         </view>
       </view>
+
     </view>
+
   </view>
 </template>
 
 <script setup>
-import {onMounted} from "vue";
+import {onMounted, ref} from "vue";
+import {Toast} from "tdesign-mobile-vue";
+import {useRequest} from "@/utils/request";
+import moment from "moment";
+
+const request = useRequest()
+
+const actList = ref([])
+const wonderfulMomentList = ref([])
 
 function navigateTo(url) {
   uni.navigateTo({
@@ -74,8 +114,39 @@ function navigateTo(url) {
   })
 }
 
+function getActivity() {
+  request.post('/platform/activity/manage/getActivity').then(res=>{
+    if(res.code === 0){
+      actList.value = res.data
+    }else{
+      Toast({message: res.msg, theme: 'error'});
+    }
+  })
+}
+
+function getWonderfulMoment() {
+  request.post('/platform/activity/wonderfulMoment/getWonderfulMoment').then(res=>{
+    if(res.code === 0){
+      wonderfulMomentList.value = res.data
+    }else{
+      Toast({message: res.msg, theme: 'error'});
+    }
+  })
+}
+function handleWonderfulMoment(row) {
+  request.post('/platform/activity/wonderfulMoment/handleWonderfulMoment/' + row.id).then(res=>{
+    if(res.code === 0){
+      getWonderfulMoment()
+      navigateTo('/pages/activity/wonderfulMoment/index?id=' + row.id)
+    }else{
+      Toast({message: res.msg, theme: 'error'});
+    }
+  })
+}
+
 onMounted(() => {
-  console.log('...........')
+  getActivity()
+  getWonderfulMoment()
   uni.showToast({
     title: '欢迎使用',
     icon: 'none',
@@ -87,6 +158,9 @@ onMounted(() => {
 </script>
 
 <style lang="less" scoped>
+uni-page-body {
+  height: auto;
+}
 // 头部区域样式
 .header {
   position: relative;
@@ -272,4 +346,27 @@ onMounted(() => {
 .activity-time {
   margin-right: 15px;
 }
+.moment-image {
+  width: 180px;
+  height: 160px;
+  margin-right: 8px;
+}
+.moment-item {
+  width: 100%;
+  display: flex;
+  margin-bottom: 16px;
+}
+.moment-title {
+  font-weight: bold;
+}
+.moment-content {
+  display: flex;
+  width: 100%;
+  justify-content: space-between;
+  flex-direction: column;
+}
+.moment-sub-content {
+  font-size: 12px;
+  color: grey;
+}
 </style>