You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
111 lines
2.4 KiB
Vue
111 lines
2.4 KiB
Vue
<template>
|
|
<view>
|
|
<view class="cu-form-group " >
|
|
<view style="width: 21%;">
|
|
</view>
|
|
<view >
|
|
2021 年
|
|
</view>
|
|
<button class="cu-btn bg-green shadow">上一年</button>
|
|
</view>
|
|
<view style="padding: 10upx;">
|
|
<view style="margin: 10upx auto;"
|
|
class="bg-red flex solid-bottom padding justify-start text-white text-center">
|
|
<view class="text-header" style="width:15%">
|
|
<text>日期</text>
|
|
</view>
|
|
<view class="text-header" style="width:20%">
|
|
<text>目标业绩</text>
|
|
</view>
|
|
<view class="text-header" style="width:20%">
|
|
<text>实际业绩</text>
|
|
</view>
|
|
<view class="text-header" style="width:20%">
|
|
<text>差额</text>
|
|
</view>
|
|
<view class="text-header" style="width:20%">
|
|
<text>达成率</text>
|
|
</view>
|
|
</view>
|
|
<view v-if="targetList.length==0">
|
|
<view class='empty cuIcon-info'></view>
|
|
<view class='empty-text text-gray'>暂无数据</view>
|
|
</view>
|
|
<view class=" light flex justify-start text-black text-center text-main"
|
|
style="padding-left: 10upx;" v-for="(item,index) in targetList" :key='index'>
|
|
<view class="text-header" style="width:15%">
|
|
<text>{{item.date}}</text>
|
|
</view>
|
|
<view class="text-header" style="width:20%">
|
|
<text>{{item.mbMoney}}</text>
|
|
</view>
|
|
<view class="text-header" style="width:20%">
|
|
<text>{{item.sjMoney}}</text>
|
|
</view>
|
|
<view class="text-header " style="width:20%;">
|
|
<text>{{item.difference}}</text>
|
|
</view>
|
|
<view class="text-header " style="width:20%;">
|
|
<text>{{item.ratio}}</text>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
targetList: [{
|
|
date: "2021-01",
|
|
mbMoney: 40000,
|
|
sjMoney: 48500,
|
|
difference: "超额8500",
|
|
ratio: "121.25%"
|
|
},
|
|
{
|
|
date: "2021-02",
|
|
mbMoney: 15000,
|
|
sjMoney: 14500,
|
|
difference: "500",
|
|
ratio: "96.67%"
|
|
},
|
|
{
|
|
date: "2021-03",
|
|
mbMoney: 50000,
|
|
sjMoney: 52150,
|
|
difference: "超额2150",
|
|
ratio: "104.30%"
|
|
},
|
|
{
|
|
date: "2021-04",
|
|
mbMoney: 50000,
|
|
sjMoney: 45600,
|
|
difference: "4400",
|
|
ratio: "91.20%"
|
|
},
|
|
]
|
|
}
|
|
},
|
|
methods: {
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.text-main {
|
|
font-size: 28upx;
|
|
height: 80upx;
|
|
width: 100%;
|
|
line-height: 80upx;
|
|
margin-top: 15upx;
|
|
color: #000000;
|
|
border-bottom: #e6e6e6 1upx solid;
|
|
text-align: center;
|
|
}
|
|
</style>
|