上传我的推广页面

components/post/promotionRecordList.vue

@@ -0,0 +1,109 @@
+<template>
+	<view class="promotionRecordList">
+		<view class="item" v-for="(item, index) in list"
+		@click="$utils.navigateTo('/publish/postDetail?id=123')"
+		:key="index">
+			<image src="/static/image/center/1.png" style="width: 40%"></image>
+			<view class="text">
+		    <view>
+          <view class="title">
+            {{ item.title }}
+          </view>
+          <view class="createBy">
+            <view class="">
+              推广时效：{{ item.createBy }}
+            </view>
+          </view>
+        </view>
+
+        <view>
+          <view class="isPay">
+            <view class="">
+              价格：{{ item.isPay }}
+            </view>
+          </view>
+          <view class="createTime">
+            推广时间：{{ item.createTime }}
+          </view>
+        </view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name:"promotionRecordList",
+		props : ['list'],
+		data() {
+			return {
+
+			};
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.promotionRecordList{
+  width: 90%;
+	.item{
+		height: 220rpx;
+		width: 100%;
+		background-color: #fff;
+		overflow: hidden;
+		border-radius: 10rpx;
+		color: #777;
+		display: flex;
+		font-size: 24rpx;
+		margin: 30rpx 0;
+		image{
+			width: 50%;
+			height: 100%;
+		}
+		.text{
+			display: flex;
+			flex-direction: column;
+      justify-content: space-around;
+			padding: 10rpx 0 10rpx 16rpx;
+			width: 52%;
+			.title{
+				font-size: 30rpx;
+				font-weight: 600;
+				color: #000;
+			}
+			.createBy{
+				display: flex;
+				justify-content: space-between;
+				&>view{
+					display: flex;
+					align-items: center;
+					justify-content: center;
+				}
+			}
+      .isPay{
+        display: flex;
+        color: #7395f4;
+        justify-content: space-between;
+        &>view{
+          display: flex;
+          align-items: center;
+          justify-content: center;
+        }
+      }
+
+      .createTime{
+        display: flex;
+        justify-content: space-between;
+        &>view{
+          display: flex;
+          align-items: center;
+          justify-content: center;
+        }
+      }
+
+
+
+		}
+	}
+}
+</style>

components/post/publishList.vue

@@ -40,6 +40,7 @@
 
 <style lang="scss" scoped>
 .publishList{
+  width: 90%;
 	.item{
 		height: 200rpx;
 		width: 100%;

pages/index/center.vue

@@ -64,7 +64,7 @@
 
         <!--下GridView-->
         <view style="margin-top: 50rpx;">
-          <uv-grid :col="4" >
+          <uv-grid :col="4">
             <uv-grid-item v-for="(item,index) in otherList" :key="index" @click="goToPage(item)">
               <img :src="item.imageUrl" :alt="item.title"
                    :style="{ width: '80rpx', height: '80rpx',marginBottom: '10rpx'}"/>
@@ -99,7 +99,10 @@ export default {
           title: '我的发布',
           gotoPageUrl: '/mine/releaseRecord'
         },
-        {name: 'lock', imageUrl: '/static/image/center/1.png', title: '我的推广'},
+        {
+          name: 'lock', imageUrl: '/static/image/center/1.png', title: '我的推广',
+          gotoPageUrl: '/mine/promotionRecord'
+        },
         {name: 'star', imageUrl: '/static/image/center/1.png', title: '我的银行卡'},
         {name: 'star', imageUrl: '/static/image/center/1.png', title: '我的钱包'},
       ],
@@ -127,10 +130,11 @@ export default {
   margin: 0;
   padding: 0;
 }
-.aaa{
-  background:$uni-linear-gradient-color;
-  -webkit-background-clip: text;/*将设置的背景颜色限制在文字中*/
-  -webkit-text-fill-color: transparent;/*给文字设置成透明*/
+
+.aaa {
+  background: $uni-linear-gradient-color;
+  -webkit-background-clip: text; /*将设置的背景颜色限制在文字中*/
+  -webkit-text-fill-color: transparent; /*给文字设置成透明*/
 }
 
 

pages/mine/promotionRecord.vue

@@ -1,19 +1,146 @@
 <template>
-	<view>
-		我的推广
-	</view>
+  <view class="promotionRecord">
+    <!--顶部导航栏-->
+    <navbar
+        leftClick
+        @leftClick="$utils.navigateBack"
+        title="我的推广"/>
+
+    <!--主页面-->
+    <view class="frame">
+      <!--标题-->
+      <view class="title">
+        <span>推广记录</span>
+      </view>
+
+      <!--搜索条件-->
+      <view class="search" >
+        <!--搜索框-->
+        <view style="width:40%;height:100%">
+          <uv-input placeholder="请输入内容" border="surround" clearable ></uv-input>
+        </view>
+        <!--开始时间-->
+        <view class="dateTimeCls">
+          <view class="date">
+            2023-12-23
+          </view>
+          <view class="image">
+            <image src="/static/image/promotionRecord/2.svg" style="width: 100%;height: 100%"></image>
+          </view>
+        </view>
+        <!--结束时间-->
+        <view class="dateTimeCls">
+          <view class="date">
+            2023-12-23
+          </view>
+          <view class="image">
+            <image src="/static/image/promotionRecord/2.svg" style="width: 100%;height: 100%"></image>
+          </view>
+        </view>
+      </view>
+      <!--发布列表-->
+      <view style="" class="publishListClass">
+        <PromotionRecordList :list="promotionRecordList"/>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			};
-		}
-	}
+import PromotionRecordList from "@/components/post/promotionRecordList.vue";
+
+export default {
+  components: {PromotionRecordList},
+
+  data() {
+    return {
+      promotionRecordList: [
+        {
+          title: "推广记录",
+          createTime: '2024-08-22 09:00:00',
+          createBy: "24小时",
+          isPay: "￥100"
+        },
+        {
+          title: "推广记录",
+          createTime: '2024-08-22 09:00:00',
+          createBy: "24小时",
+          isPay: "￥100"
+        },
+        {
+          title: "推广记录",
+          createTime: '2024-08-22 09:00:00',
+          createBy: "24小时",
+          isPay: "￥100"
+        },
+      ],
+    }
+  },
+  methods: {}
+
+}
 </script>
 
 <style lang="scss" scoped>
+* {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+.frame {
+  width: 100%;
+  height: calc(100vh - 220rpx);
+  border: 1px solid red;
+  padding: 28rpx 28rpx 0 28rpx;
+
+  .title {
+    font-size: 34rpx;
+    color: #333;
+    font-weight: 700
+  }
+
+  .search {
+    display: flex;
+    align-items: center;
+    gap: 10rpx;
+    width: 100%;
+    height: 80rpx;
+    margin-top: 20rpx;
+
+
+    .dateTimeCls {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      width: 25%;
+      height: 80%;
+      border: 1px solid #b0b2b3;
+      padding: 5rpx;
+      border-radius: 20rpx;
+
+      .date {
+        font-size: 28rpx;
+        display: flex;
+        align-items: center;
+        width: 80%;
+        height: 100%;
+        color: #b0b2b3;
+      }
+
+      .image {
+        width: 20%;
+        height: 100%;
+      }
+    }
+  }
+
 
+  .publishListClass {
+    margin-top: 30rpx;
+    height: calc(100vh - 200rpx);
+    overflow: auto;
+    width: 100%;
+  }
+}
 </style>

pages/mine/releaseRecord.vue

@@ -6,7 +6,7 @@
         @leftClick="$utils.navigateBack"
         title="我的发布"/>
 
-    <!--发布记录列表-->
+    <!--主页面-->
     <view class="frame">
       <!--标题-->
       <view class="title">
@@ -111,11 +111,10 @@ export default {
 .frame {
   width: 100%;
   height: calc(100vh - 220rpx);
-  border: 1px solid red;
-  padding: 28rpx 0 0 50rpx;
+  padding: 28rpx 28rpx 0 28rpx;
 
   .title {
-    font-size: 38rpx;
+    font-size: 34rpx;
     color: #333;
     font-weight: 700
   }
@@ -146,6 +145,7 @@ export default {
     margin-top: 10rpx;
     height: calc(100vh - 200rpx);
     overflow: auto;
+    width: 100%;
   }
 }
 </style>

static/image/promotionRecord/2.svg

@@ -0,0 +1 @@
+<svg t="1724496486273" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4383" width="32" height="32"><path d="M512 128c-211.744 0-384 172.256-384 384s172.256 384 384 384 384-172.256 384-384-172.256-384-384-384z m0 704c-176.448 0-320-143.552-320-320s143.552-320 320-320 320 143.552 320 320-143.552 320-320 320z" fill="#bfbfbf" p-id="4384"></path><path d="M660.736 606.112L528 529.344V320c0-17.664-14.336-32-32-32s-32 14.336-32 32v224c0 11.872 14.752 21.824 24.352 27.328 2.656 4 9.952 7.616 14.4 10.176l132 80c15.296 8.832 31.872 3.584 40.704-11.712s0.608-34.848-14.72-43.68z" fill="#bfbfbf" p-id="4385"></path></svg>