<import src="index.skeleton.wxml" />
<template is="skeleton" wx:if="{{loading}}" />
<view class="chart">

	<view class="item" wx:for="{{statistics}}" style="color: {{item.color}} !important;">
		<view class="circle" style="box-shadow: inset 0 0 0 8rpx  {{item.color}};">
			<view class="circle_left ab" style="{{render.leftRate(item.achievingRate)}}" />
			<view class="circle_right ab" style="{{render.rightRate(item.achievingRate,item.color)}}" />
			<view class="circle_text">
				{{item.achievingRate}}%
			</view>
		</view>

		<view class="s-label">
			{{item.label}}
		</view>
		<view class="s-fulfill line-1">
			{{item.fulfill}}万
		</view>
		<view class="s-row line-1">
			目标:{{item.target}}万
		</view>
		<view class="s-row line-1">
			差额:{{item.distance}}万
		</view>
	</view>

</view>

<view class="table">
	<view class="label">
		<text class="text" />
		业绩明细
	</view>
	<view class="row-label">
		<view class="line-1">
			月/季/年
		</view>
		<view class="line-1">
			达成金额(万)
		</view>
		<view class="line-1">
			目标金额(万)
		</view>
		<view class="line-1">
			达成率
		</view>
	</view>
	<view>
		<view class="row" wx:for="{{table}}">
			<view class="line-1">
				{{item.label}}
			</view>
			<view class="line-1">
				{{item.fulfill}}
			</view>
			<view class="line-1">
				{{item.target}}
			</view>
			<view class="line-1">
				{{item.achievingRate}}
			</view>
		</view>
	</view>
</view>

<My_empty wx:if="{{list.length==0}}" />
<view style="height: 30px;"></view>
<wxs module="render">
	module.exports = {
		rightRate: function (rate, color) {
			if (rate - 0 < 50) {
				return 'transform: rotate(' + 3.6 * (rate - 0) + 'deg);';
			} else {
				return "transform: rotate(0);border-color:" + color + ";";
			}
		},
		leftRate: function (rate) {
			if (rate - 0 >= 50) {
				if (rate - 0 >= 100) rate = 100;
				return 'transform: rotate(' + 3.6 * (rate - 50) + 'deg);';
			}
		}
	}
</wxs>