<template>
	<view>
		<view class="cu-form-group " style="margin:  10upx;">
			<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: 250000,
						sjMoney: 265500,
						difference: "超额15500",
						ratio: "106.20%"
					},
					{
						date: "2021-02",
						mbMoney: 150000,
						sjMoney: 138650,
						difference: "11350",
						ratio: "92.43%"
					},
					{
						date: "2021-03",
						mbMoney: 250000,
						sjMoney: 289500,
						difference: "超额39500",
						ratio: "115.80%"
					},
					{
						date: "2021-04",
						mbMoney: 250000,
						sjMoney: 250603,
						difference: "超额603",
						ratio: "100.24%"
					},
				]
			}
		},
		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>
