Newer
Older
KaiFengPC / src / views / dataAnalysis / syntheticData / operationAnaly.vue
@zhangdeliang zhangdeliang on 23 May 2 KB 初始化项目
  1. <template>
  2. <!-- 运维分析统计 -->
  3. <div class="operationAnaly">
  4. <!-- 表格 -->
  5. <div class="tableBox animate__animated animate__zoomIn">
  6. <el-table v-loading="tableLoading" :data="tableData" height="450">
  7. <el-table-column label="序号" prop="xh" />
  8. <el-table-column label="养护类型" prop="type" />
  9. <el-table-column label="计划养护时间" prop="date1" />
  10. <el-table-column label="实际养护时间" prop="date2" />
  11. <el-table-column label="实施人" prop="user1" />
  12. <el-table-column label="责任人" prop="user2" />
  13. <el-table-column label="养护单位" prop="unit" />
  14. <el-table-column label="行为分析" prop="xwfx">
  15. <template #default="scope">
  16. <span class="red">{{ scope.row.xwfx }}</span>
  17. </template>
  18. </el-table-column>
  19. <el-table-column label="评价" prop="pj" />
  20. <el-table-column label="轨迹" prop="gj">
  21. <template #default="scope">
  22. <el-icon><LocationInformation /></el-icon>
  23. </template>
  24. </el-table-column>
  25. <el-table-column label="报告" prop="report">
  26. <template #default="scope">
  27. <el-icon><Files /></el-icon>
  28. </template>
  29. </el-table-column>
  30. </el-table>
  31. <Pagination
  32. v-show="total > 0"
  33. :total="total"
  34. v-model:page="queryParams.pageNo"
  35. v-model:limit="queryParams.pageSize"
  36. @pagination="getList"
  37. />
  38. </div>
  39. </div>
  40. </template>
  41. <script setup>
  42. import {} from '@/api/dataAnalysis/syntherticData';
  43.  
  44. const props = defineProps({
  45. searchDate: Array,
  46. stationCode: String,
  47. });
  48. const { proxy } = getCurrentInstance();
  49.  
  50. const queryParams = reactive({
  51. pageNo: 1,
  52. pageSize: 10,
  53. start: props.searchDate ? props.searchDate[0] : '',
  54. end: props.searchDate ? props.searchDate[1] : '',
  55. });
  56. const total = ref(2);
  57. const tableData = ref([
  58. {
  59. xh: '1',
  60. type: '设备巡查',
  61. date1: '2023年3月',
  62. date2: '2023年4月',
  63. user1: '何庆功',
  64. user2: '朱方仁',
  65. unit: '新烽光电',
  66. xwfx: '定位异常',
  67. pj: '4星',
  68. },
  69. {
  70. xh: '2',
  71. type: '设备巡查',
  72. date1: '2023年5月',
  73. date2: '2023年6月',
  74. user1: '明亮',
  75. user2: '朱方仁',
  76. unit: '新烽光电',
  77. xwfx: '运维滞后',
  78. pj: '4星',
  79. },
  80. ]);
  81. const tableLoading = ref(false);
  82.  
  83. // 获取列表数据
  84. function getList(code) {
  85. // console.log('运维分析统计---', code);
  86. }
  87.  
  88. // 初始化
  89. onMounted(() => {
  90. getList(props.stationCode);
  91. });
  92. defineExpose({
  93. getList,
  94. });
  95. onBeforeUnmount(() => {});
  96. </script>
  97. <style lang="scss">
  98. .operationAnaly {
  99. width: 100%;
  100. .el-pagination {
  101. right: 25%;
  102. }
  103. .red {
  104. color: #ee6666;
  105. }
  106. .tableBox {
  107. border-top: 1px solid #00d1ff;
  108. .el-icon {
  109. cursor: pointer;
  110. font-size: 25px;
  111. color: #73c0de;
  112. }
  113. }
  114. }
  115. </style>