优化页面

2025-05-30 22:04:45 +08:00
parent c747f9625c
commit 050ceedd59
66 changed files with 1215 additions and 190 deletions
--- a/pages/Mine/minecomponents/pkRecord.vue
+++ b/pages/Mine/minecomponents/pkRecord.vue
@@ -0,0 +1,125 @@
+<template>
+    <view class="pkRecord">
+        <view>返回</view>
+        <view>pk记录</view>
+        <view></view>
+    </view>
+    <view class="Navigation">
+            <view class="PkPosted">我发布的PK</view>
+            <view>我邀请的PK</view>
+            </view>
+    <scroll-view
+    scroll-y="true"
+    class="scroll"
+    refresher-enabled="true"
+    refresher-threshold="40"
+    @refresherrefresh="onRefresherRefresh"
+    lower-threshold="100"
+    @scrolltolower="onScrollToLower"
+  > 
+  <uni-card v-for="(item, index) in list">
+    <view class="content">
+        <view class="Anchor">
+            <view class="avatar">主播1头像(赢方头像框王冠)</view>
+            <view class="AnchorInfo">
+                <view>主播昵称</view>
+                <view>pk时间</view>
+                <view>实际打了多少金币</view>
+            </view>
+        </view>
+        <view>
+            VS
+        </view>
+        <view class="Anchor">
+            <view class="AnchorInfo">
+                <view>主播昵称</view>
+                <view>pk时间</view>
+                <view>实际打了多少金币</view>
+            </view>
+            <view class="avatar">主播1头像</view>
+        </view>
+
+    </view>
+  </uni-card>
+  </scroll-view>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+                list: [
+                    {},
+                    {},
+                    {}, 
+                    {}, 
+                    {},      
+                    {}, 
+                    {}, 
+                    {}, 
+                ]
+            }
+        },
+        onLoad() {
+            // 页面加载时执行
+        },
+        methods: {
+            // 方法定义
+        }
+    }
+</script>
+
+<style scoped>
+    .pkRecord{
+        width: 100vw;
+        height: 200rpx;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        background-color: #ffffff;
+        padding-top: 40rpx;
+        border-bottom: 1px solid #000000;
+    }
+   .content{
+        width: 100vw;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: 10px;
+        border-bottom: 1px solid #eee;
+    }
+    .avatar{
+        width: 50px;
+        height: 50px;
+        border-radius: 50%;
+        font-size: 20rpx;
+        background-color: aqua;
+    }
+    .Anchor{
+        display: flex;
+    }
+   .AnchorInfo{
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        margin-left: 10rpx;
+        font-size: 20rpx;
+   }
+   .PkPosted{
+        text-align: center;
+        font-size: 30rpx;
+        height: 100rpx;
+        line-height: 100rpx;
+        width: 45%;
+        border-right: 1px solid #000000;
+    }
+    .Navigation{
+        width: 100vw;
+        display: flex;
+        justify-content: space-around;
+        align-items: center;
+        height: 100rpx;
+        background-color: #ffffff;
+        border-bottom: 1px solid #000000;
+    }
+</style>