Skip to content

C
confucius
Commit 03b1af6f authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent e1f4cafc
Hide whitespace changes
Inline Side-by-side
Showing with 86 additions and 50 deletions
src/components/work/bonus.vue
View file @ 03b1af6f
...@@ -47,64 +47,94 @@ ...@@ -47,64 +47,94 @@
<VueApexCharts width="105" height="105" :options="chartOptions4" :series="series4"></VueApexCharts> <VueApexCharts width="105" height="105" :options="chartOptions4" :series="series4"></VueApexCharts>
</div> </div>
</div> </div>
<div class="list-box"> <template v-if="tab==1">
<div class="list flex no-wrap items-center"> <div class="list-box">
<div class="name">名单人数</div> <div class="list flex no-wrap items-center">
<div class="progress"> <span class="cur">{{dataList.GuestNum}}</span>/0</div> <div class="name">名单人数</div>
<div class="progress-charts"> <div class="progress"> <span class="cur">{{dataList.GuestNum}}</span>/{{dataList.EndNum}}</div>
<div> <div class="progress-charts">
{{dataList.NextGoal}}
</div>
<q-linear-progress rounded size="6px" :value="0.8" color="warning" style="width:90px" />
</div>
<div class="grade">{{dataList.CurrentStep}}挡</div>
<div class="num">
+¥{{dataList.CurRewardMoney}}
</div>
</div>
<div class="list flex no-wrap items-center">
<div class="name">开单奖励</div>
<div class="progress"> <span class="cur">{{dataList.OrderCount}}</span>/1</div>
<div class="progress-charts">
<template v-if="dataList.OrderCount-1>=0">
<div>
已完成开单奖励
</div>
</template>
<template v-else>
<div> <div>
距1档还差{{1-dataList.OrderCount}}个 {{dataList.NextGoal}}
</div> </div>
</template> <q-linear-progress rounded size="6px" :value="calcpercentage(dataList.GuestNum,dataList.EndNum)"
<q-linear-progress rounded size="6px" :value="0.8" color="warning" style="width:90px" /> color="warning" style="width:90px" />
</div>
<div class="grade">{{dataList.CurrentStep}}挡</div>
<div class="num">
+¥{{dataList.CurRewardMoney}}
</div>
</div>
<div class="list flex no-wrap items-center">
<div class="name">开单奖励</div>
<div class="progress"> <span class="cur">{{dataList.OrderCount}}</span>/1</div>
<div class="progress-charts">
<template v-if="dataList.OrderCount-1>=0">
<div>
已完成开单奖励
</div>
</template>
<template v-else>
<div>
距1档还差{{1-dataList.OrderCount}}个
</div>
</template>
<q-linear-progress rounded size="6px" :value="calcpercentage(dataList.OrderCount,1)" color="warning"
style="width:90px" />
</div>
<div class="grade">1挡</div>
<div class="num">
+¥{{dataList.OpenBonus}}
</div>
</div> </div>
<div class="grade">1挡</div> <div class="list flex no-wrap items-center">
<div class="num"> <div class="name">线索奖励</div>
+¥{{dataList.OpenBonus}} <div class="progress"> <span class="cur">{{dataList.ClueCount}}</span>/5</div>
<div class="progress-charts">
<template v-if="dataList.ClueCount-5>=0">
<div>
已完成线索奖励
</div>
</template>
<template v-else>
<div>
距1档还差{{5-dataList.ClueCount}}个
</div>
</template>
<q-linear-progress rounded size="6px" :value="calcpercentage(dataList.ClueCount,5)" color="warning"
style="width:90px" />
</div>
<div class="grade">1挡</div>
<div class="num">
+¥{{dataList.ClueNumSalary}}
</div>
</div> </div>
</div> </div>
<div class="list flex no-wrap items-center"> </template>
<div class="name">线索奖励</div> <template v-if="tab==2">
<div class="progress"> <span class="cur">{{dataList.ClueCount}}</span>/5</div> <div class="list-box">
<div class="progress-charts"> <div class="list flex no-wrap items-center">
<template v-if="dataList.ClueCount-5>=0"> <div class="name">总名单人数</div>
<div> <div class="progress"> <span class="cur">{{dataList.GuestNum}}</span></div>
已完成线索奖励 <div class="num">
</div> +¥{{dataList.CurRewardMoney}}
</template> </div>
<template v-else>
<div>
距1档还差{{5-dataList.ClueCount}}个
</div>
</template>
<q-linear-progress rounded size="6px" :value="0.8" color="warning" style="width:90px" />
</div> </div>
<div class="grade">1挡</div> <div class="list flex no-wrap items-center">
<div class="num"> <div class="name">总开单奖励</div>
+¥{{dataList.ClueNumSalary}} <div class="progress"><span class="cur">{{dataList.OrderCount}}</span></div>
<div class="num">
+¥{{dataList.OpenBonus}}
</div>
</div>
<div class="list flex no-wrap items-center">
<div class="name">总线索奖励</div>
<div class="progress"> <span class="cur">{{dataList.ClueCount}}</span></div>
<div class="num">
+¥{{dataList.ClueNumSalary}}
</div>
</div> </div>
</div> </div>
</div> </template>
</div> </div>
</q-card> </q-card>
</div> </div>
...@@ -158,8 +188,14 @@ ...@@ -158,8 +188,14 @@
}, },
mounted() { mounted() {
this.getList(); this.getList();
}, },
methods: { methods: {
//计算百分比
calcpercentage(startNum, totalNum) {
var percent = Number(startNum) / Number(totalNum);
return percent.toFixed(2);
},
//点击切换 //点击切换
checkTab(type) { checkTab(type) {
if (type == 1) { if (type == 1) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment