数据可视化大屏
Du kan inte välja fler än 25 ämnen Ämnen måste starta med en bokstav eller siffra, kan innehålla bindestreck ('-') och vara max 35 tecken långa.

76 lines
3.1KB

  1. <div nz-row [nzGutter]="[12, 12]" style="display: flex; justify-content: space-between">
  2. <div style="display: flex; flex-direction: column; width: 23%">
  3. <app-data-v-lj-dashboard title="系统状态" style="width: 100%" />
  4. <lj-app-ag-grid-component style="width: 100%" title="运行信息" [defaultColDef]="defaultColDef" [rowData]="rowData"
  5. [columnDefs]="colDefs1" [gridThemeClass]="gridThemedClass" />
  6. <lj-app-ag-grid-component style="width: 100%" title="系统报警信息" [defaultColDef]="defaultColDef" [rowData]="rowData"
  7. [columnDefs]="colDefs1" [gridThemeClass]="gridThemedClass" />
  8. </div>
  9. <div style="display: flex; flex-direction: column; width: 43%">
  10. <!-- button-component.component.html -->
  11. <div class="button-container">
  12. <button class="lock-button">
  13. <img class="logo" src="./assets/lock.svg" />
  14. </button>
  15. <button class="standard-button">操作</button>
  16. <button class="standard-button">校磅</button>
  17. <button class="standard-button">防作弊</button>
  18. </div>
  19. <div class="car-status-container">
  20. <div nz-row [nzGutter]="12">
  21. <div nz-col class="gutter-row" [nzSpan]="6" style="text-align: center;">
  22. <div class="card-content-title">
  23. <div class="card-content-l">{{ '抬杆监控' }}</div>
  24. </div>
  25. </div>
  26. <div nz-col class="gutter-row" [nzSpan]="12" style="text-align: center;">
  27. <div class="card-content-title">
  28. <div class="card-content-l">{{ '3D监控' }}</div>
  29. </div>
  30. </div>
  31. <div nz-col class="gutter-row" [nzSpan]="6" style="text-align: center;">
  32. <div class="card-content-title">
  33. <div class="card-content-l">{{ '落杆监控' }}</div>
  34. </div>
  35. </div>
  36. </div>
  37. <div class="row" *ngFor="let item of items; let i = index">
  38. <blockbuster-component style="margin-bottom: 0.5rem;"></blockbuster-component>
  39. </div>
  40. </div>
  41. </div>
  42. <div style="display: flex; flex-direction: column; width: 30%">
  43. <!-- </data-v-card> -->
  44. <lj-app-ag-grid-component style="height: 250px" [showPageTurning]="false" [showEditButton]="true" title="今日汇总"
  45. [defaultColDef]="defaultColDef" [rowData]="todayRowData" [columnDefs]="colDefs2"
  46. [gridThemeClass]="gridThemedClass" />
  47. <app-data-v-lj-car-info-table style="width: 100%; margin-top: 30px" />
  48. <!--
  49. <data-v-card nz-col nzSpan="24" nzXs="24" nzSm="24" nzMd="12" nzLg="12" nzXl="12" nzXXl="12" title="报警信息">
  50. <app-ag-grid-component
  51. style="width: 30%"
  52. [defaultColDef]="defaultColDef"
  53. [rowData]="rowData"
  54. [columnDefs]="colDefs3"
  55. gridThemeClass="ag-theme-quartz ag-theme-datav"
  56. />
  57. </data-v-card>
  58. <data-v-card nz-col nzSpan="24" nzXs="24" nzSm="24" nzMd="12" nzLg="12" nzXl="12" nzXXl="12" title="通知">
  59. <app-ag-grid-component
  60. style="width: 30%"
  61. [defaultColDef]="defaultColDef"
  62. [rowData]="rowData"
  63. [columnDefs]="colDefs4"
  64. gridThemeClass="ag-theme-quartz ag-theme-datav"
  65. />
  66. </data-v-card> -->
  67. </div>
  68. </div>