evRateTitle.vue 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. <template>
  2. <div class="count-bottom-title">
  3. <span v-if="tab==1" class="count-bottom-text">
  4. <span class="span1"></span>
  5. <span class="span2 Micbold">室内温度满足率</span>
  6. <span class="span3">{{rate}}%</span>
  7. </span>
  8. <span v-if="tab==2" class="count-bottom-text">
  9. <span class="span1"></span>
  10. <span class="span2 Micbold">节能率</span>
  11. <span class="span4">{{rate}}%</span>
  12. <span class="span5">准确率</span>
  13. <span class="span6">90%</span>
  14. </span>
  15. <span v-if="tab==3" class="count-bottom-text">
  16. <span class="span1"></span>
  17. <span class="span2 Micbold">执行率</span>
  18. <img class="span7" src="../../assets/finish.png" alt />
  19. </span>
  20. </div>
  21. </template>
  22. <script>
  23. export default {
  24. data() {
  25. return {};
  26. },
  27. mounted() {},
  28. props: ["tab", "rate"]
  29. };
  30. </script>
  31. <style lang="scss" scoped>
  32. .count-bottom-title {
  33. display: flex;
  34. .count-bottom-text {
  35. height: 64px;
  36. background: rgba(248, 249, 250, 1);
  37. border-radius: 4px;
  38. border: 1px solid rgba(238, 238, 238, 1);
  39. display: flex;
  40. align-items: center;
  41. padding-right: 24px;
  42. .span1 {
  43. width: 4px;
  44. height: 64px;
  45. background: rgba(0, 145, 255, 1);
  46. border-radius: 4px 0 0 4px;
  47. margin-right: 20px;
  48. }
  49. .span2 {
  50. font-size: 20px;
  51. color: rgba(31, 36, 41, 1);
  52. margin-right: 12px;
  53. }
  54. .span3 {
  55. font-size: 24px;
  56. font-family: Persagy-Bold, Persagy;
  57. font-weight: bold;
  58. color: rgba(31, 36, 41, 1);
  59. }
  60. .span4 {
  61. font-size: 24px;
  62. font-family: Persagy-Bold, Persagy;
  63. font-weight: bold;
  64. color: rgba(31, 36, 41, 1);
  65. margin-right: 32px;
  66. }
  67. .span5 {
  68. font-size: 16px;
  69. font-family: PingFangSC-Regular, PingFang SC;
  70. font-weight: 400;
  71. color: rgba(100, 108, 115, 1);
  72. margin-right: 8px;
  73. }
  74. .span6 {
  75. font-size: 16px;
  76. font-family: Persagy;
  77. color: rgba(100, 108, 115, 1);
  78. }
  79. .span7 {
  80. width: 20px;
  81. height: 20px;
  82. }
  83. }
  84. }
  85. </style>