index.vue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. <template>
  2. <div class="dashboard-editor-container">
  3. <panel-group/>
  4. <el-row>
  5. <el-col :xs="32" :sm="32" :lg="12">
  6. <div class="chart-wrapper">
  7. <pie-chart/>
  8. </div>
  9. </el-col>
  10. <el-col :xs="32" :sm="32" :lg="12">
  11. <div class="chart-wrapper">
  12. <notice-chart />
  13. </div>
  14. </el-col>
  15. </el-row>
  16. </div>
  17. </template>
  18. <script>
  19. import PanelGroup from './dashboard/PanelGroup'
  20. import LineChart from './dashboard/LineChart'
  21. import RaddarChart from './dashboard/RaddarChart'
  22. import PieChart from './dashboard/PieChart'
  23. import BarChart from './dashboard/BarChart'
  24. import NoticeChart from "./dashboard/NoticeChart.vue";
  25. export default {
  26. name: 'Index',
  27. components: {
  28. NoticeChart,
  29. PanelGroup,
  30. LineChart,
  31. RaddarChart,
  32. PieChart,
  33. BarChart
  34. },
  35. data() {
  36. return {
  37. }
  38. },
  39. methods: {
  40. }
  41. }
  42. </script>
  43. <style lang="scss" scoped>
  44. .dashboard-editor-container {
  45. padding: 32px;
  46. background-color: rgb(240, 242, 245);
  47. position: relative;
  48. .chart-wrapper {
  49. background: #fff;
  50. padding: 16px 16px 0;
  51. margin-bottom: 15px;
  52. }
  53. }
  54. /*
  55. @media (max-width: 1024px) {
  56. .chart-wrapper {
  57. padding: 8px;
  58. }
  59. }*/
  60. </style>