infoCenter.data.ts 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. import { BasicColumn } from '/@/components/Table';
  2. import { ModuleDataChart } from '/@/views/vent/deviceManager/configurationTable/types';
  3. import { h } from 'vue'; // 引入vue的h函数用于创建VNode
  4. // 系统数据排名
  5. export const sysDataColumn: BasicColumn[] = [
  6. {
  7. title: '',
  8. align: 'center',
  9. width: 60,
  10. // 修正customRender的类型和返回值
  11. customRender: ({ index }: { index: number }) => {
  12. // 确保index是数字类型,避免算术运算错误
  13. const numIndex = Number(index);
  14. let rankImg = '';
  15. if (numIndex === 0) {
  16. rankImg = '/src/assets/images/dataCenter/infoCenter/rank-1.png';
  17. } else if (numIndex === 1) {
  18. rankImg = '/src/assets/images/dataCenter/infoCenter/rank-2.png';
  19. } else if (numIndex === 2) {
  20. rankImg = '/src/assets/images/dataCenter/infoCenter/rank-3.png';
  21. } else {
  22. rankImg = '/src/assets/images/dataCenter/infoCenter/rank-4.png';
  23. }
  24. return h(
  25. 'div',
  26. {
  27. style: {
  28. width: '80px',
  29. height: '35px',
  30. backgroundImage: `url(${rankImg})`,
  31. backgroundSize: '100% 100%',
  32. backgroundRepeat: 'no-repeat',
  33. position: 'relative',
  34. margin: '0 15px',
  35. },
  36. },
  37. [
  38. // 排名文字
  39. h(
  40. 'span',
  41. {
  42. style: {
  43. position: 'absolute',
  44. top: '50%',
  45. left: '50%',
  46. transform: 'translate(-50%, -50%)',
  47. color: '#fff',
  48. fontSize: '14px',
  49. fontWeight: 'bold',
  50. },
  51. },
  52. `NO.${index + 1}`
  53. ), // 显示NO.1、NO.2等
  54. ]
  55. );
  56. },
  57. },
  58. {
  59. title: '设备类别',
  60. dataIndex: 'devKind',
  61. align: 'center',
  62. },
  63. {
  64. title: '设备数量',
  65. dataIndex: 'devNum',
  66. align: 'center',
  67. },
  68. {
  69. title: '数据采集量',
  70. dataIndex: 'dataCount',
  71. align: 'center',
  72. },
  73. ];
  74. //系统接入情况
  75. export const accessStatusColumn: BasicColumn[] = [
  76. {
  77. title: '序号',
  78. align: 'center',
  79. customRender: ({ index }: { index: number }) => `${index + 1}`,
  80. },
  81. {
  82. title: '设备名称',
  83. dataIndex: 'devicekind_dictText',
  84. align: 'center',
  85. },
  86. {
  87. title: '设备接入时间',
  88. dataIndex: 'createTime',
  89. align: 'center',
  90. },
  91. {
  92. title: '点位数量',
  93. dataIndex: 'monitorPointNum',
  94. align: 'center',
  95. },
  96. {
  97. title: '网络状态',
  98. dataIndex: 'netStatus',
  99. align: 'center',
  100. // 添加状态转换逻辑
  101. customRender: ({ record }) => {
  102. // 将状态值转为数字进行判断
  103. const status = Number(record.netStatus);
  104. return status === 1 ? '正常' : '断开';
  105. },
  106. },
  107. {
  108. title: '数据更新时间',
  109. dataIndex: 'dataUpdateTime',
  110. align: 'center',
  111. },
  112. {
  113. title: '操作',
  114. dataIndex: 'action',
  115. width: 200,
  116. align: 'center',
  117. slots: { customRender: 'action' },
  118. },
  119. ];
  120. // 每日采集数据表格属性
  121. export const dailyNumOption: ModuleDataChart = {
  122. type: 'bar',
  123. readFrom: '',
  124. legend: { show: false },
  125. xAxis: [{ show: true }],
  126. yAxis: [{ show: true, name: '', position: 'left' }],
  127. series: [{ readFrom: 'collectDataByDayList', xprop: 'day', yprop: 'total_count', label: '' }],
  128. };