产出效率

This commit is contained in:
唐明明
2022-06-10 18:16:25 +08:00
parent ec2a426261
commit 33e1352965
7 changed files with 2518 additions and 898 deletions

168
pages/life/capacity.vue Normal file
View File

@@ -0,0 +1,168 @@
<template>
<view class="capacity">
<view class="capacity-title">共力分总产率/小时<text>0.04GLF/h</text></view>
<view class="capacity-sbutitle">总产率=角色产率+团队产率+共建产率+共力值产率</view>
<view class="capacity-block">
<view class="capacity-block-title">我的角色</view>
<view class="capacity-block-glf">普通用户:0.04GLF/h</view>
</view>
<view class="capacity-block">
<view class="capacity-block-title">
<view class="title">成员产率<text>0GLF/h</text></view>
<view class="more" @click="onInvitation">邀请更多好友</view>
</view>
<view class="capacity-block-table">
<view class="header">
<view class="flex-item">家族成员产率</view>
</view>
<view class="flex">
<view class="flex-item">0人在线(会员)</view>
<view class="flex-item">-</view>
</view>
<view class="flex">
<view class="flex-item">0人在线(会员)</view>
<view class="flex-item">-</view>
</view>
</view>
<view class="capacity-block-table">
<view class="header">
<view class="flex-item">伙伴成员</view>
</view>
<view class="flex">
<view class="flex-item">0人在线(会员)</view>
<view class="flex-item">-</view>
</view>
<view class="flex">
<view class="flex-item">0人在线(会员)</view>
<view class="flex-item">-</view>
</view>
</view>
</view>
<view class="capacity-block">
<view class="capacity-block-title">
<view class="title">共建产率<text>0GLF/h</text></view>
<view class="subtitle">0/1200</view>
</view>
<view class="capacity-block-text">产品当日设置的</view>
</view>
<view class="capacity-block">
<view class="capacity-block-title">
<view class="title">共力值产率<text>0GLF/h</text></view>
<view class="subtitle">0/1200</view>
</view>
<view class="capacity-block-text">产品当日设置的</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
};
},
methods: {
onInvitation(){
this.$Router.push({name: 'Invitation'})
}
}
}
</script>
<style lang="scss">
.capacity{
background: $window-color;
min-height: 100vh;
padding: $padding;
box-sizing: border-box;
&-title{
font-size: 38rpx;
font-weight: bold;
line-height: 60rpx;
text{
margin-left: 10rpx;
color: $main-color;
}
}
&-sbutitle{
font-size: 26rpx;
line-height: 40rpx;
}
&-block{
background: white;
margin-top: $margin;
border-radius: $radius;
padding: $padding;
&-glf{
color: $main-color;
font-size: 30rpx;
}
&-title{
font-weight: bold;
font-size: 34rpx;
padding-bottom: 30rpx;
line-height: 60rpx;
display: flex;
justify-content: space-between;
.title{
text{
color: $main-color;
font-weight: normal;
padding-left: 10rpx;
}
}
.more{
background: $main-color;
color: white;
font-weight: bold;
font-size: 28rpx;
border-radius: 25rpx;
line-height: 60rpx;
width: 230rpx;
text-align: center;
}
.subtitle{
font-weight: normal;
font-size: 24rpx;
color: $main-color;
}
}
&-text{
font-size: 28rpx;
color: gray;
line-height: 40rpx;
}
&-table{
border:solid 1px $border-color;
margin-bottom: 20rpx;
&:last-child{
margin-top: 0;
}
.header{
background: $border-color;
line-height: 50rpx;
padding: 0 15rpx;
font-size: 26rpx;
color: gray;
}
.flex{
display: flex;
border-top: solid 1rpx $border-color;
color: gray;
.flex-item{
width: 50%;
box-sizing: border-box;
line-height: 50rpx;
padding: 0 15rpx;
font-size: 24rpx;
&:first-child{
border-right: solid 1rpx $border-color;
}
}
}
}
}
}
</style>