📝 【TASK-20240808-01】TASK:APP活动详情静态页面

src/pages.json

@@ -273,6 +273,12 @@
 		"style": {
 			"navigationStyle": "custom"
 		}
+	},
+	{
+		"path": "pages/activity_detail/activity_detail",
+		"style": {
+			"navigationStyle": "custom"
+		}
 	}
   ],
   "globalStyle": {

src/pages/activity_detail/activity_detail.vue

+<template>
+  <view class="activity_detail">
+    <dHeader :title="'活动详情'"></dHeader>
+    <view class="container">
+      <view class="img-box">
+        <image class="img" src="../../static/img/company.png"></image>
+      </view>
+      <view class="container-main">
+        <view class="activity-title">转发领优惠</view>
+        <view class="activity-remark"
+          >活动时间：2020-12-12 12:12:12活动时间：2020-12-12 12:12:12活动时间：2020-12-12
+          12:12:12活动时间：2020-12-12 12:12:12活动时间：2020-12-12 12:12:12活动时间：2020-12-12
+          12:12:12活动时间：2020-12-12 12:12:12活动时间：2020-12-12 12:12:12</view
+        >
+        <view class="activity-cell">
+          <view class="cell-label">积分说明</view>
+          <view class="cell-centent">
+            <image class="cell-image" src="../../static/img/score_b.png"></image>
+            <view class="cell-text">10</view>
+          </view>
+        </view>
+        <view class="activity-cell">
+          <view class="cell-label">累计最高积分</view>
+          <view class="cell-centent">
+            <image class="cell-image" src="../../static/img/score_b.png"></image>
+            <view class="cell-text">100</view>
+          </view>
+        </view>
+        <view class="activity-cell">
+          <view class="cell-label">有效期</view>
+          <view class="cell-centent"> 2024-12-12 12:12:12 </view>
+        </view>
+        <view class="activity-cell">
+          <view class="cell-label">规则说明</view>
+          <view class="cell-centent"> 每转发并邀请1人成功注册并登录获得10积久300 </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import dHeader from '../../components/dHeader/index.vue'
+export default {
+  components: {
+    dHeader
+  }
+}
+</script>
+
+<style lang="scss">
+page {
+  /* #ifdef H5 */
+  padding-top: 140upx;
+  /* #endif */
+  /* #ifdef APP-PLUS */
+  padding-top: calc(var(--status-bar-height) + 100upx);
+  /* #endif */
+  background-color: #d4e5fe;
+}
+.container {
+  padding: 20upx;
+  background-color: #fff;
+  border-radius: 20upx;
+}
+.img-box {
+  width: 100%;
+  height: 400upx;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  .img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+}
+.container-main {
+  padding: 12upx;
+}
+.activity-title {
+  font-size: 28upx;
+  height: 84upx;
+  display: flex;
+  align-items: center;
+  color: var(--c2);
+}
+.activity-remark {
+  font-size: 24upx;
+  color: #7f7f7f;
+}
+.activity-cell {
+  margin-top: 20upx;
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+}
+.cell-label {
+  font-size: 24upx;
+  color: #7f7f7f;
+}
+.cell-centent {
+  max-width: 60%;
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  font-size: 24upx;
+  color: #7f7f7f;
+}
+.cell-image {
+  width: 24upx;
+  height: 24upx;
+}
+.cell-text {
+  margin-left: 6upx;
+  font-weight: 600;
+  font-size: 26upx;
+  color: #000;
+}
+</style>

src/pages/integral/components/gift.vue

@@ -97,11 +97,10 @@ export default {}
   font-size: 24upx;
 }
 .gift-content {
-  overflow-y: auto;
   width: 100%;
   height: calc(100% - 152upx);
   padding: 32upx 32upx;
-  gap: 22upx;
+  gap: 2%;
   display: flex;
   flex-wrap: wrap;
   box-sizing: border-box;
@@ -110,15 +109,15 @@ export default {}
 .gift-item {
   display: flex;
   flex-direction: column;
-  width: 300upx;
-  height: 318upx;
+  width: 49%;
   box-sizing: border-box;
   // background-color: red;
 }
 .gift-image {
   margin: 0;
-  width: 300upx;
-  height: 200upx;
+  width: 100%;
+  height: auto;
+  aspect-ratio: 3 / 2;
 }
 .gift-name {
   margin: 0;

src/pages/integral/components/points.vue

 <template>
   <view class="int">
-    <view class="int-centent" v-for="item in 6" :key="item">
+    <view class="int-centent" v-for="item in 6" :key="item" @click="toDetail">
       <view class="int-centent-left">
         <view class="centent-tag">
           <view class="tag-text">APP注册</view>
@@ -18,7 +18,15 @@
 </template>
 
 <script>
-export default {}
+export default {
+  methods: {
+    toDetail() {
+      uni.navigateTo({
+        url: '/pages/activity_detail/activity_detail'
+      })
+    }
+  }
+}
 </script>
 
 <style lang="scss" scoped>

src/static/css/integral.css

 page {
+  overflow: auto;
+  /* height: 100%; */
   /* #ifdef H5 */
   padding-top: 140upx;
   /* #endif */
   /* #ifdef APP-PLUS */
   padding-top: calc(var(--status-bar-height) + 100upx);
   /* #endif */
-  height: 100%;
 }
 
 .integral {