317 lines
5.8 KiB
Vue
317 lines
5.8 KiB
Vue
<template>
|
|
<view class="">
|
|
<view class="content-detail">
|
|
<view class="content-detail-one">
|
|
<view class="title">
|
|
<view class="titlea">
|
|
</view>
|
|
<view class="titleb">绩效考核</view>
|
|
</view>
|
|
|
|
<view class="detail-con">
|
|
<view class="detail-cona">
|
|
<view class="cona">1000</view>
|
|
<view class="conb">绩效考核</view>
|
|
</view>
|
|
<view class="detail-conb">-</view>
|
|
<view class="detail-conc">
|
|
<view class="cona">0</view>
|
|
<view class="conb">延期任务扣除</view>
|
|
|
|
</view>
|
|
<view class="detail-cond">*</view>
|
|
<view class="detail-cone">
|
|
<view class="cona">0</view>
|
|
<view class="conb">任务完成率</view>
|
|
</view>
|
|
<view class="detail-conf">=</view>
|
|
<view class="detail-cong">
|
|
<view class="cona" style="color:#3274F9 !important">100</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="detail-botm">
|
|
<view class="title">扣除详情:</view>
|
|
<view class="detail">无</view>
|
|
</view>
|
|
</view>
|
|
<view class="content-detail-two">
|
|
<view class="title">
|
|
<view class="titlea">
|
|
</view>
|
|
<view class="titleb">部门奖金</view>
|
|
</view>
|
|
|
|
<view class="detail-con">
|
|
<view class="detail-cona">
|
|
<view class="cona">1000</view>
|
|
<view class="conb">部门奖金</view>
|
|
</view>
|
|
<view class="detail-conb">-</view>
|
|
<view class="detail-conc">
|
|
<view class="cona">100%</view>
|
|
<view class="conb">项目完成率</view>
|
|
|
|
</view>
|
|
<view class="detail-conf">=</view>
|
|
<view class="detail-cong">
|
|
<view class="cona" style="color:#3274F9 !important">100</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="detail-botm">
|
|
<view class="title">部门计划完成率必须大于50%</view>
|
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
<view class="content-detail-three">
|
|
<view class="title">
|
|
<view class="titlea">
|
|
</view>
|
|
<view class="titleb">公司奖金</view>
|
|
</view>
|
|
<view class="detail">
|
|
0
|
|
</view>
|
|
<view class="botm">
|
|
公司目标低于百分之百无公司奖金
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.content-detail {
|
|
|
|
|
|
.content-detail-one {
|
|
background-color: #fff;
|
|
padding-top: 18rpx;
|
|
padding-left: 20rpx;
|
|
padding-right: 20rpx;
|
|
height: 335rpx;
|
|
|
|
.title {
|
|
display: flex;
|
|
line-height: 32rpx;
|
|
|
|
|
|
.titlea {
|
|
width: 4rpx;
|
|
height: 33rpx;
|
|
background: #3274F9;
|
|
margin-right: 10rpx;
|
|
}
|
|
|
|
.titleb {
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
}
|
|
}
|
|
|
|
.detail-con {
|
|
display: flex;
|
|
margin-top: 60rpx;
|
|
|
|
.cona {
|
|
width: 148rpx;
|
|
height: 81rpx;
|
|
line-height: 81rpx;
|
|
text-align: center;
|
|
background: #F3F4F8;
|
|
margin-bottom: 30rpx;
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
}
|
|
|
|
.conb {
|
|
font-size: 25rpx;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #666666;
|
|
width: 148rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.detail-conb {
|
|
font-size: 32px;
|
|
margin-top: -10rpx;
|
|
|
|
}
|
|
|
|
|
|
.detail-cond {
|
|
font-size: 32px;
|
|
margin-top: 10rpx;
|
|
|
|
}
|
|
|
|
.detail-conf {
|
|
font-size: 32px;
|
|
margin-top: -10rpx;
|
|
}
|
|
}
|
|
|
|
.detail-botm {
|
|
display: flex;
|
|
margin-top: 32rpx;
|
|
|
|
.title {
|
|
width: 158rpx;
|
|
height: 44px;
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
}
|
|
|
|
.detail {
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #333333;
|
|
}
|
|
}
|
|
}
|
|
|
|
.content-detail-two {
|
|
background-color: #fff;
|
|
margin-top: 30rpx;
|
|
padding-top: 18rpx;
|
|
padding-left: 20rpx;
|
|
padding-right: 20rpx;
|
|
height: 335rpx;
|
|
|
|
.title {
|
|
display: flex;
|
|
line-height: 32rpx;
|
|
|
|
|
|
.titlea {
|
|
width: 4rpx;
|
|
height: 33rpx;
|
|
background: #3274F9;
|
|
margin-right: 10rpx;
|
|
}
|
|
|
|
.titleb {
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
}
|
|
}
|
|
|
|
.detail-con {
|
|
display: flex;
|
|
margin-top: 60rpx;
|
|
|
|
.cona {
|
|
width: 212rpx;
|
|
height: 81rpx;
|
|
line-height: 81rpx;
|
|
text-align: center;
|
|
background: #F3F4F8;
|
|
margin-bottom: 30rpx;
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
}
|
|
|
|
.conb {
|
|
font-size: 25rpx;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #666666;
|
|
width: 212rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.detail-conb {
|
|
font-size: 32px;
|
|
margin-top: -10rpx;
|
|
|
|
}
|
|
|
|
|
|
.detail-cond {
|
|
font-size: 32px;
|
|
margin-top: 10rpx;
|
|
|
|
}
|
|
|
|
.detail-conf {
|
|
font-size: 32px;
|
|
margin-top: -10rpx;
|
|
}
|
|
}
|
|
|
|
.detail-botm {
|
|
display: flex;
|
|
margin-top: 32rpx;
|
|
|
|
.title {
|
|
|
|
height: 44px;
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
}
|
|
|
|
|
|
}
|
|
}
|
|
|
|
.content-detail-three {
|
|
background-color: #fff;
|
|
margin-top: 30rpx;
|
|
padding-top: 18rpx;
|
|
padding-left: 20rpx;
|
|
padding-right: 20rpx;
|
|
height: 280rpx;
|
|
|
|
.title {
|
|
display: flex;
|
|
line-height: 32rpx;
|
|
|
|
|
|
.titlea {
|
|
width: 4rpx;
|
|
height: 33rpx;
|
|
background: #3274F9;
|
|
margin-right: 10rpx;
|
|
}
|
|
|
|
.titleb {
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
}
|
|
}
|
|
.detail{
|
|
width: 674rpx;
|
|
height: 81rpx;
|
|
line-height:81rpx;
|
|
margin-top: 60rpx;
|
|
margin-bottom: 30rpx;
|
|
padding-left: 30rpx;
|
|
background: #F3F4F8;
|
|
border-radius: 7px 7px 7px 7px;
|
|
}
|
|
}
|
|
}
|
|
</style> |