feat(mine): 添加奖衔距离相关文案
This commit is contained in:
parent
16d41c4857
commit
113e5e61ff
|
@ -13,7 +13,7 @@ module.exports = (vm) => {
|
|||
|
||||
//#ifdef DEV_SERVER
|
||||
console.log('DEV_SERVER')
|
||||
config.baseURL = '/prod-api';
|
||||
config.baseURL = 'http://192.168.0.103:8080';
|
||||
//#endif
|
||||
|
||||
//#ifdef QA_SERVER
|
||||
|
|
|
@ -59,7 +59,7 @@
|
|||
|
||||
|
||||
<view class="ju_grade" v-if="!ifSpecial">
|
||||
<view v-if="tarAwardsName" class="awards-progress-summary" style="text-align: center;">
|
||||
<view v-if="awards.tarAwardsName" class="awards-progress-summary" style="text-align: center;">
|
||||
<span class="descriptive-text">当前距离</span>
|
||||
<span class="highlight-name">
|
||||
{{ awards.tarAwardsName }}
|
||||
|
@ -67,7 +67,7 @@
|
|||
<span class="descriptive-text">奖衔,小区仅需</span>
|
||||
<span class="highlight-pv">
|
||||
{{
|
||||
awards.targetPv
|
||||
awards.sumRealPv
|
||||
}}</span>
|
||||
</view>
|
||||
|
||||
|
@ -116,6 +116,18 @@
|
|||
>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="awards.tarAwardsName" class="yestDay">
|
||||
<view class="yes_t">奖衔冲刺</view>
|
||||
<view class="ju_left_bottom sprint-progress-container">
|
||||
<view
|
||||
class="sprint-current-progress"
|
||||
:style="{ width: sprintProgress.percentageString }"
|
||||
></view>
|
||||
<view class="cha sprint-progress-text">
|
||||
已完成 {{ sprintProgress.achieved }} / 目标 {{ sprintProgress.target }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
@ -459,6 +471,45 @@ export default {
|
|||
this.getUserAwardss();
|
||||
},
|
||||
|
||||
computed: {
|
||||
sprintProgress() {
|
||||
const targetPvStr = this.awards.targetPv;
|
||||
const sumRealPvStr = this.awards.sumRealPv; // 这是"小区仅需"的量,即差距
|
||||
|
||||
const targetPv = parseFloat(targetPvStr);
|
||||
const sumRealPv = parseFloat(sumRealPvStr);
|
||||
|
||||
let achievedPv = 0;
|
||||
let percentage = 0;
|
||||
let displayTargetPv = (isNaN(targetPv) ? 0 : targetPv).toFixed(2);
|
||||
|
||||
if (!isNaN(targetPv) && targetPv > 0) {
|
||||
// sumRealPv 是差距,所以已完成的是 targetPv - sumRealPv
|
||||
achievedPv = targetPv - (isNaN(sumRealPv) ? 0 : sumRealPv);
|
||||
|
||||
// 确保 achievedPv 不会小于0(如果 sumRealPv > targetPv,理论上不应发生)
|
||||
// 且不会大于 targetPv (如果 sumRealPv 是负数,表示已超额)
|
||||
achievedPv = Math.max(0, Math.min(achievedPv, targetPv));
|
||||
|
||||
percentage = (achievedPv / targetPv) * 100;
|
||||
} else if (!isNaN(targetPv) && targetPv === 0 && !isNaN(sumRealPv) && sumRealPv <=0) {
|
||||
// 如果目标是0,且差距也是0或负数(表示已满足或超越0目标),则认为是100%
|
||||
achievedPv = 0;
|
||||
percentage = 100;
|
||||
}
|
||||
|
||||
|
||||
const clampedPercentage = Math.min(100, Math.max(0, percentage));
|
||||
|
||||
return {
|
||||
percentageString: `${clampedPercentage.toFixed(0)}%`,
|
||||
achieved: achievedPv.toFixed(2),
|
||||
target: displayTargetPv,
|
||||
rawPercentage: clampedPercentage
|
||||
};
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
goYear(){
|
||||
uni.navigateTo({
|
||||
|
@ -1223,4 +1274,64 @@ export default {
|
|||
margin-top: 30rpx;
|
||||
padding: 20rpx 22rpx 150rpx 22rpx;
|
||||
}
|
||||
|
||||
.sprint-progress-container {
|
||||
flex: 1;
|
||||
height: 34rpx;
|
||||
background: #eeeeee;
|
||||
border-radius: 20rpx;
|
||||
margin: 10rpx;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.sprint-current-progress {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
border-radius: 20rpx;
|
||||
background: linear-gradient(135deg, #ED9A38 0%, #FDD05F 50%, #E68A2E 100%);
|
||||
transition: width 0.6s ease-in-out;
|
||||
box-shadow: none;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.sprint-current-progress::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: linear-gradient(
|
||||
100deg,
|
||||
rgba(255, 255, 255, 0) 20%,
|
||||
rgba(255, 255, 255, 0.4) 50%,
|
||||
rgba(255, 255, 255, 0) 80%
|
||||
);
|
||||
transform: translateX(-100%);
|
||||
animation: premium_shimmer_animation 2.5s infinite linear;
|
||||
}
|
||||
|
||||
@keyframes premium_shimmer_animation {
|
||||
0% {
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
100% {
|
||||
transform: translateX(100%);
|
||||
}
|
||||
}
|
||||
|
||||
.sprint-progress-text {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 60%;
|
||||
left: 0;
|
||||
transform: translate(0%, -55%);
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in New Issue