infoTable.vue 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. <!-- 信息点表 -->
  2. <template>
  3. <div v-loading="loading">
  4. <div class="cont-table">
  5. <el-table
  6. :data="dingzhiData"
  7. stripe
  8. style="width: 100%"
  9. :cell-style="{ color: '#000', cursor: 'pointer' }"
  10. @row-click="svSendRowClick3"
  11. :highlight-current-row="true"
  12. ref="myTable5"
  13. >
  14. <el-table-column type="index" label="序号" width="60" />
  15. <el-table-column prop="accesspoint_name" label="访问点"/>
  16. <el-table-column label="逻辑设备(lnst)" width="160">
  17. <template #default="scope">
  18. {{ `${scope.row.ld_desc}(${scope.row.ld_inst})` }}
  19. </template>
  20. </el-table-column>
  21. <el-table-column prop="block_name" label="控制块名称" />
  22. <el-table-column prop="block_desc" label="控制块描述" />
  23. <el-table-column prop="block_datset" label="数据集名称" />
  24. <el-table-column prop="block_rptid" label="RptID" />
  25. <el-table-column prop="block_intgpd" label="完整性周期" />
  26. <el-table-column prop="block_confrev" label="配置版本" />
  27. <el-table-column prop="block_buffered" label="是否缓存" />
  28. <el-table-column prop="block_buftime" label="缓存时间" />
  29. <el-table-column label="信息点数量">
  30. <template #default="scope">
  31. <span v-if="scope.row.list">{{ scope.row.list.length }}</span>
  32. </template>
  33. </el-table-column>
  34. </el-table>
  35. <div class="title">
  36. 定值条目列表详情(共<span v-if="dingzhiDataChild">{{
  37. dingzhiDataChild.length
  38. }}</span
  39. >条)
  40. </div>
  41. <el-table
  42. :data="dingzhiDataChild"
  43. style="width: 100%"
  44. stripe
  45. :cell-style="{ color: '#000' }"
  46. >
  47. <el-table-column type="index" label="序号" width="80" />
  48. <el-table-column prop="doi_desc" label="条目描述" />
  49. <el-table-column prop="da_datatype" label="数据类型" />
  50. <el-table-column prop="short_addr" label="内部地址" />
  51. </el-table>
  52. </div>
  53. </div>
  54. </template>
  55. <script setup>
  56. import { onMounted, watch, ref, nextTick, defineEmits, inject } from "vue";
  57. import { getPointtable } from "@/api/iedNetwork";
  58. import { useRoute } from "vue-router";
  59. const route = useRoute();
  60. const props = defineProps({
  61. checkData: {
  62. type: Object,
  63. default: () => {},
  64. },
  65. isPhoto: {
  66. type: String,
  67. default: "",
  68. },
  69. delScdId:{
  70. type:String,
  71. default: '',
  72. }
  73. });
  74. const dingzhiData = ref(null);
  75. const dingzhiDataChild = ref(null);
  76. const myTable5 = ref(null);
  77. const loading = ref(true);
  78. const getDingzhisList = async () => {
  79. const dingRes = await getPointtable({
  80. scd_id: scdIdValue,
  81. ied_name: props.checkData.ied_name,
  82. });
  83. loading.value= false;
  84. if (dingRes.data.length > 0) {
  85. dingzhiData.value = dingRes.data;
  86. dingzhiDataChild.value = dingRes.data[0].list;
  87. myTable5.value.setCurrentRow(dingzhiData.value[0]);
  88. }
  89. };
  90. const svSendRowClick3 = (row, column) => {
  91. dingzhiDataChild.value = row.list;
  92. };
  93. watch(
  94. () => props.checkData,
  95. (newValue) => {
  96. dingzhiData.value = [];
  97. dingzhiDataChild.value = [];
  98. if (newValue != null) {
  99. getDingzhisList();
  100. }
  101. }
  102. );
  103. let scdIdValue = '';
  104. onMounted(() => {
  105. if (props.delScdId) {
  106. scdIdValue = props.delScdId;
  107. } else {
  108. scdIdValue = route.query.id;
  109. }
  110. getDingzhisList();
  111. });
  112. </script>
  113. <style scoped lang="scss">
  114. .cont-table {
  115. height: 72vh;
  116. display: flex;
  117. flex-direction: column;
  118. justify-content: space-between;
  119. }
  120. :deep(.el-table) {
  121. flex-basis: 45%;
  122. }
  123. .title {
  124. margin: 16px;
  125. color: #51637f;
  126. }
  127. </style>