tall4-pc/src/views/commands.vue

<template>
  <SearchCommands @search="onSearch" />
  <template v-if="data">
    <el-table :data="data" :style="{ 'max-height': contentHeight + 'px' }" border stripe style="width: 100%">
      <el-table-column align="center" fixed label="设备ID" min-width="100" prop="deviceId" />
      <el-table-column align="center" label="传输方向" min-width="80">
        <template #default="scope">
          {{ log.DIRECTION[scope.row.dir] }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="传输启动" min-width="80">
        <template #default="scope">
          {{ log.PRM[scope.row.prm] }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="安全模式" min-width="80">
        <template #default="scope">
          {{ log.SER[scope.row.ser] }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="流控" min-width="80">
        <template #default="scope">
          {{ log.DFC[scope.row.dfc] }}
        </template>
      </el-table-column>

      <el-table-column align="center" label="功能码" min-width="180">
        <template #default="scope">
          {{ log.CODE[scope.row.code].text }}
        </template>
      </el-table-column>

      <el-table-column align="center" label="包序号" min-width="80" prop="serialNo" />

      <el-table-column align="center" label="类型标识" min-width="80">
        <template #default="scope">
          {{ log.ASDU_TYPE[scope.row.type] }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="信息体顺序" min-width="90">
        <template #default="scope">
          {{ log.INFO_ORDER[scope.row.infoOrder] }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="信息体个数" min-width="90" prop="infoNum" />

      <el-table-column align="center" label="传输原因" min-width="180">
        <template #default="scope">
          {{ log.REASON[scope.row.reason] }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="协议内容" min-width="300" prop="contents" />
    </el-table>
  </template>
</template>

<script setup>
import SearchCommands from 'components/commands/search-commands.vue';
import { onMounted, ref } from 'vue';
import { ElMessage } from 'element-plus';
import * as log from '@/config/log';

const data = ref([]);
let contentHeight = 600;

// 设置表格高度
onMounted(() => {
  const winHeight = document.documentElement.clientHeight;
  contentHeight = winHeight - 150;
});

/**
 * 查询
 * @param {object} options
 * @returns {Promise<void>}
 */
async function onSearch(options) {
  try {
    console.log(options);
    // data.value = await getCommandsStatus(options);
  } catch (error) {
    ElMessage.error('查询失败');
    throw new Error(error);
  }
}
</script>