pxl/tk-mini-program
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化

Browse Source
This commit is contained in:
pengxiaolong
2025-07-14 13:30:18 +08:00
parent f324bf3bc7
commit 6dec463705
24 changed files with 193 additions and 147 deletions
Download Patch File Download Diff File Expand all files Collapse all files

167
pages/Mine/minecomponents/DetailsPKRecords/DetailsPKRecords.vue
View File

@@ -8,7 +8,11 @@
/>
</view>
<view class="Return" @click="onBack">
<image class="ReturnImg" src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Return.png" mode="scaleToFill" />
<image
class="ReturnImg"
src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Return.png"
mode="scaleToFill"
/>
</view>
<view class="title">PK记录详情</view>
<view class="pkrecords">
@@ -16,24 +20,25 @@
<!-- 主播A -->
<view class="AnchorA">
<view class="Anchor">
<view class="AnchorAImg">
<!-- 头像 -->
<image class="AnchorAImgcss" :src="item.anchorIconA" mode="scaleToFill" />
<view class="AnchorAImg">
<!-- 头像 -->
<image class="AnchorAImgcss" :src="item.anchorIconA" mode="scaleToFill" />
</view>
<!-- 皇冠 -->
<image
class="Crown"
src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Crown.png"
mode="scaleToFill"
v-if="item.winnerAnchorId == item.anchorIdA"
/>
</view>
<!-- 皇冠 -->
<image
class="Crown"
src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Crown.png"
mode="scaleToFill"
v-if="item.winnerAnchorId == item.anchorIdA"
/>
</view>
<view class="AnchorAinfo">
<view class="AnchorAname"> {{ item.anchorIdA }} </view>
<view class="AnchorATime">{{ formatDate(item.pkTime) }}</view>
<view class="AnchorAICon" v-if="item.userACoins!==null">
<!-- <view class="AnchorAICon" v-if="item.userACoins !== null"> -->
<view class="AnchorAICon">
<view class="AnchorAIContext">实际打金币:</view>
<view class="AnchorAIConNum">{{ item.userACoins }}K</view>
<view class="AnchorAIConNum">{{ formatCoinNum(iconNumber) }}</view>
</view>
</view>
</view>
@@ -45,52 +50,63 @@
<!-- 主播B -->
<view class="AnchorB">
<view class="Anchor">
<view class="AnchorAImg">
<!-- 头像 -->
<image class="AnchorBImgcss" :src="item.anchorIconB" mode="scaleToFill" />
<view class="AnchorAImg">
<!-- 头像 -->
<image class="AnchorBImgcss" :src="item.anchorIconB" mode="scaleToFill" />
</view>
<!-- 皇冠 -->
<image
class="Crown"
src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Crown.png"
mode="scaleToFill"
v-if="item.winnerAnchorId == item.anchorIdB"
/>
</view>
<!-- 皇冠 -->
<image
class="Crown"
src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Crown.png"
mode="scaleToFill"
v-if="item.winnerAnchorId == item.anchorIdB"
/>
</view>
<view class="AnchorBinfo">
<view class="AnchorAname">{{ item.anchorIdB }} </view>
<view class="AnchorATime"> {{ formatDate(item.pkTime) }} </view>
<view class="AnchorAICon" v-if="item.userBCoins!==null">
<view class="AnchorAICon" v-if="item.userBCoins !== null">
<view class="AnchorAIContext">实际打金币:</view>
<view class="AnchorAIConNum">{{ item.userBCoins }}K</view>
<view class="AnchorAIConNum">{{ formatCoinNum(item.userBCoins) }}</view>
</view>
</view>
</view>
</view>
<view class="pkrecords-content">
<scroll-view
show-scrollbar="false"
scroll-y="true"
class="scroll"
refresher-enabled="true"
refresher-threshold="40"
@refresherrefresh="onRefresherRefresh"
:refresher-triggered="triggered"
>
<uni-card v-for="(items,index) in coinNumlist" :key="index">
<view class="contentcard">
<view class="contentcard-titleA":style="{'background-color': items.anchorIdA == items.winnerAnchorId ? '#00fbff21' : '#ff000011'}">
<view class="ciontext">金币数量</view>
<view class="cion">{{items.anchorCoinA}}K</view>
</view>
<view class="contentcard-titleB" :style="{'background-color': items.anchorIdB == items.winnerAnchorId ? '#00fbff21' : '#ff000011'}">
<view class="ciontext">金币数量</view>
<view class="cion">{{items.anchorCoinB}}K</view>
</view>
</view>
</uni-card>
</scroll-view>
show-scrollbar="false"
scroll-y="true"
class="scroll"
refresher-enabled="true"
refresher-threshold="40"
@refresherrefresh="onRefresherRefresh"
:refresher-triggered="triggered"
>
<uni-card v-for="(items, index) in coinNumlist" :key="index">
<view class="contentcard">
<view
class="contentcard-titleA"
:style="{
'background-color':
items.anchorIdA == items.winnerAnchorId ? '#00fbff21' : '#ff000011',
}"
>
<view class="ciontext">金币数量</view>
<view class="cion">{{ formatCoinNum(items.anchorCoinA) }}</view>
</view>
<view
class="contentcard-titleB"
:style="{
'background-color':
items.anchorIdB == items.winnerAnchorId ? '#00fbff21' : '#ff000011',
}"
>
<view class="ciontext">金币数量</view>
<view class="cion">{{ formatCoinNum(items.anchorCoinB) }}</view>
</view>
</view>
</uni-card>
</scroll-view>
</view>
</view>
</view>
@@ -103,9 +119,11 @@ export default {
data() {
return {
title: "Hello",
item:{},
coinNumlist:[],
item: {},
coinNumlist: [],
triggered: false,
iconNumber: 123457,
};
},
onLoad(options) {
@@ -114,15 +132,36 @@ export default {
// 监听itemDetail事件
eventChannel.on("itemDetail", (data) => {
this.item = data.item; // 将接收到的数据赋值给item
this.getCoinNum(this.item)
this.getCoinNum(this.item);
});
},
methods: {
//金币数量格式化
formatCoinNum(coin) {
if (coin === null || coin === undefined) {
return "";
}
if (coin < 1000) {
return String(coin);
}
if (coin >= 1000000) {
return "1M+";
}
const kValue = coin / 1000;
const formattedString = kValue.toFixed(2); // 确保至少保留两位小数
const matchResult = formattedString.match(/^\d+\.\d{0,2}/);
if (matchResult === null) {
return kValue.toFixed(2) + "k"; // 确保至少保留两位小数
}
const formatted = matchResult[0];
return `${formatted}k`;
},
// 下拉刷新
onRefresherRefresh(){
onRefresherRefresh() {
this.triggered = true;
this.coinNumlist = [];
this.getCoinNum(this.item)
this.getCoinNum(this.item);
},
// 获取具体金币数量
getCoinNum(item) {
@@ -137,8 +176,8 @@ export default {
if (res.code == 200) {
this.coinNumlist = res.data;
this.triggered = false;
}else{
console.log("获取金币数量失败")
} else {
console.log("获取金币数量失败");
}
});
},
@@ -214,7 +253,7 @@ export default {
align-items: center;
margin-right: 30rpx;
}
.Anchor{
.Anchor {
display: flex;
align-items: center;
}
@@ -318,21 +357,21 @@ export default {
flex-direction: column;
align-items: center;
}
.scroll{
.scroll {
width: 750rpx;
height: 1100rpx;
}
.contentcard{
.contentcard {
width: 694.66rpx;
height: 161.26rpx;
border-radius: 15rpx;
background-color: #ffffff;
display: flex;
margin-left:28.55rpx;
margin-left: 28.55rpx;
margin-top: 25rpx;
border: #5ed8db solid 1rpx;
}
.contentcard-titleA{
.contentcard-titleA {
width: 50%;
height: 100%;
display: flex;
@@ -343,7 +382,7 @@ export default {
border-top-left-radius: 15rpx;
border-bottom-left-radius: 15rpx;
}
.contentcard-titleB{
.contentcard-titleB {
width: 50%;
height: 100%;
display: flex;
@@ -353,11 +392,11 @@ export default {
border-top-right-radius: 15rpx;
border-bottom-right-radius: 15rpx;
}
.ciontext{
.ciontext {
font-size: 28rpx;
color: #a2a2a2;
}
.cion{
.cion {
font-size: 36rpx;
color: #100e0f;
font-weight: bold;