index.wxml 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. <import src="index.skeleton.wxml" />
  2. <template is="skeleton" wx:if="{{loading}}" />
  3. <view class="chart">
  4. <view class="item" wx:for="{{statistics}}" style="color: {{item.color}} !important;">
  5. <view class="circle" style="box-shadow: inset 0 0 0 8rpx {{item.color}};">
  6. <view class="circle_left ab" style="{{render.leftRate(item.achievingRate)}}" />
  7. <view class="circle_right ab" style="{{render.rightRate(item.achievingRate,item.color)}}" />
  8. <view class="circle_text">
  9. {{item.achievingRate}}%
  10. </view>
  11. </view>
  12. <view class="s-label">
  13. {{item.label}}
  14. </view>
  15. <view class="s-fulfill line-1">
  16. {{item.fulfill}}万
  17. </view>
  18. <view class="s-row line-1">
  19. 目标:{{item.target}}万
  20. </view>
  21. <view class="s-row line-1">
  22. 差额:{{item.distance}}万
  23. </view>
  24. </view>
  25. </view>
  26. <view class="table">
  27. <view class="label">
  28. <text class="text" />
  29. 业绩明细
  30. </view>
  31. <view class="row-label">
  32. <view class="line-1">
  33. 月/季/年
  34. </view>
  35. <view class="line-1">
  36. 达成金额(万)
  37. </view>
  38. <view class="line-1">
  39. 目标金额(万)
  40. </view>
  41. <view class="line-1">
  42. 达成率
  43. </view>
  44. </view>
  45. <view>
  46. <view class="row" wx:for="{{table}}">
  47. <view class="line-1">
  48. {{item.label}}
  49. </view>
  50. <view class="line-1">
  51. {{item.fulfill}}
  52. </view>
  53. <view class="line-1">
  54. {{item.target}}
  55. </view>
  56. <view class="line-1">
  57. {{item.achievingRate}}
  58. </view>
  59. </view>
  60. </view>
  61. </view>
  62. <My_empty wx:if="{{list.length==0}}" />
  63. <view style="height: 30px;"></view>
  64. <wxs module="render">
  65. module.exports = {
  66. rightRate: function (rate, color) {
  67. if (rate - 0 < 50) {
  68. return 'transform: rotate(' + 3.6 * (rate - 0) + 'deg);';
  69. } else {
  70. return "transform: rotate(0);border-color:" + color + ";";
  71. }
  72. },
  73. leftRate: function (rate) {
  74. if (rate - 0 >= 50) {
  75. if (rate - 0 >= 100) rate = 100;
  76. return 'transform: rotate(' + 3.6 * (rate - 50) + 'deg);';
  77. }
  78. }
  79. }
  80. </wxs>