src/views/data/channel/http/api/tag/index.vue

@@ -1,7 +1,7 @@
<template>
  <el-drawer
    v-model="drawer"
    size="50%"
    size="60%"
    title="Http Tag"
    :direction="direction"
    :before-close="handleClose"
@@ -107,18 +107,25 @@
          label="数据值"
          header-align="center"
          align="center"
          min-width="100"
          :formatter="(row) => {if (row.dataValue === -2.0) {return '--';}return row.dataValue;}"
        />
        <el-table-column
          prop="quality"
          prop="dataTime"
          label="数据时间"
          header-align="center"
          align="center"
          min-width="150"
        />
        <el-table-column
          prop="dataQuality"
          label="数据质量"
          header-align="center"
          align="center"
        >
          <template #default="scope">
            <el-tag v-if="scope.row.dataValue === Number(-2.0)" type="danger" size="small">bad
            </el-tag>
            <el-tag v-else size="small">good</el-tag>
            <el-tag v-if="scope.row.dataQuality === 'Good'" size="small" type="success">{{scope.row.dataQuality}}</el-tag>
            <el-tag v-if="scope.row.dataQuality === 'Bad'" size="small" type="danger">{{scope.row.dataQuality}}</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" min-width="110" fixed="right">
@@ -163,6 +170,7 @@
  import {ref} from "vue";
  import {onBeforeUnmount, onMounted} from "vue";
  import TagImportForm from '../../../common/tag/TagImportForm.vue'
  import * as OpcUaTagApi from "@/api/data/channel/opcua/tag";

  defineOptions({name: 'HttpTag'})

@@ -275,4 +283,24 @@
      exportLoading.value = false
    }
  }

  let intervalId;

  onMounted(async () => {
    // 创建定时器
    intervalId = setInterval(async () => {
      if(queryParams.currentValue){
        const page = await HttpTagApi.getHttpTagPage(queryParams)
        list.value = page.list
        total.value = page.total
      }
    }, 10000);
  });

  // 在组件卸载时清除定时器
  onBeforeUnmount(() => {
    if (intervalId) {
      clearInterval(intervalId);
    }
  });
</script>