centerLeft2.vue 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. <template>
  2. <div id="centreLeft1">
  3. <div class="bg-color-black">
  4. <div class="d-flex pt-2 pl-2">
  5. <span style="color:#5cd9e8">
  6. <icon name="chart-pie"></icon>
  7. </span>
  8. <div class="d-flex">
  9. <span class="fs-xl text mx-2">装机容量</span>
  10. <dv-decoration-1 style="width:1.25rem;height:.25rem; position:relative;top:-.0375rem;" />
  11. </div>
  12. </div>
  13. <div class="d-flex jc-center">
  14. <centreLeft2Chart />
  15. </div>
  16. </div>
  17. </div>
  18. </template>
  19. <script>
  20. import centreLeft2Chart from "./echart/centerLeft2/centreLeft2Chart";
  21. export default {
  22. data() {
  23. return {};
  24. },
  25. components: {
  26. centreLeft2Chart
  27. },
  28. mounted() {},
  29. methods: {}
  30. };
  31. </script>
  32. <style lang="scss">
  33. #centreLeft1 {
  34. padding: 0.2rem;
  35. height: 5.125rem;
  36. min-width: 3.75rem;
  37. border-radius: 0.0625rem;
  38. .bg-color-black {
  39. height: 4.8125rem;
  40. border-radius: 0.125rem;
  41. }
  42. .text {
  43. color: #c3cbde;
  44. }
  45. .chart-box {
  46. margin-top: 0.2rem;
  47. width: 2.125rem;
  48. height: 2.125rem;
  49. .active-ring-name {
  50. padding-top: 0.125rem;
  51. }
  52. }
  53. }
  54. </style>