huang
2025-11-26 792236ef78c2cdd3a989fb40a7f2e2487c4e17b6
mes-web/src/views/device/DeviceConfigForm.vue
@@ -4,12 +4,13 @@
    <div class="search-section">
      <el-form :model="searchForm" :inline="true" class="search-form">
        <el-form-item label="设备类型">
          <el-select v-model="searchForm.deviceType" placeholder="选择设备类型" clearable>
            <el-option label="PLC控制器" value="PLC控制器" />
            <el-option label="传感器" value="传感器" />
            <el-option label="执行器" value="执行器" />
            <el-option label="控制器" value="控制器" />
            <el-option label="采集器" value="采集器" />
          <el-select v-model="searchForm.deviceType" placeholder="选择设备类型" clearable :loading="deviceTypesLoading">
            <el-option
              v-for="type in deviceTypes"
              :key="type"
              :label="type"
              :value="type"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="设备状态">
@@ -250,6 +251,10 @@
const deviceList = ref([])
const selectedDevices = ref([])
// 设备类型列表
const deviceTypes = ref([])
const deviceTypesLoading = ref(false)
// 搜索表单
const searchForm = reactive({
  deviceType: '',
@@ -272,6 +277,37 @@
const emit = defineEmits(['device-selected', 'refresh-statistics'])
// 方法定义
// 加载设备类型列表
const loadDeviceTypes = async () => {
  if (deviceTypes.value.length > 0) {
    // 如果已经加载过,不再重复加载
    return
  }
  // 所有支持的设备类型(确保包含所有有配置组件的类型)
  const supportedTypes = ['大车设备', '大理片笼', '卧转立扫码', '卧转立']
  try {
    deviceTypesLoading.value = true
    const res = await deviceConfigApi.getDeviceTypes()
    if (res?.data && Array.isArray(res.data)) {
      // 合并数据库中的类型和支持的类型,去重并排序
      const dbTypes = res.data
      const allTypes = [...new Set([...supportedTypes, ...dbTypes])].sort()
      deviceTypes.value = allTypes
    } else {
      // 如果API返回失败,使用默认类型
      deviceTypes.value = supportedTypes
      console.warn('获取设备类型列表失败,使用默认类型')
    }
  } catch (error) {
    console.error('加载设备类型列表失败:', error)
    // 失败时使用默认类型
    deviceTypes.value = supportedTypes
  } finally {
    deviceTypesLoading.value = false
  }
}
const loadDeviceList = async () => {
  try {
    tableLoading.value = true
@@ -502,6 +538,7 @@
// 组件挂载时加载数据
onMounted(() => {
  loadDeviceTypes()
  loadDeviceList()
})
</script>