/**
 * base_device 页面操作列扩展
 * 按 DeviceGroup 动态渲染对应的操作按钮组件
 * 框架升级不覆盖此文件（extension 目录受保护）
 */
import VideoDeviceActions from '@/views/warehouse/base_device/components/VideoDeviceActions.vue'
import IoTDeviceActions from '@/views/warehouse/base_device/components/IoTDeviceActions.vue'
import AccessDeviceActions from '@/views/warehouse/base_device/components/AccessDeviceActions.vue'
import BarrierDeviceActions from '@/views/warehouse/base_device/components/BarrierDeviceActions.vue'
import AlarmDeviceActions from '@/views/warehouse/base_device/components/AlarmDeviceActions.vue'
import DeviceLivePreview from '@/views/warehouse/base_device/components/DeviceLivePreview.vue'
import PtzControlPanel from '@/views/warehouse/base_device/components/PtzControlPanel.vue'
import RealtimeDataPanel from '@/views/warehouse/base_device/components/RealtimeDataPanel.vue'
import DeviceControlPanel from '@/views/warehouse/base_device/components/DeviceControlPanel.vue'
import DeviceEditDialog from '@/views/warehouse/base_device/components/DeviceEditDialog.vue'
import MapBindingPanel from '@/views/warehouse/base_device/components/MapBindingPanel.vue'

// 按 DeviceGroup 映射操作组件
const actionMap = {
  '视频设备': 'VideoDeviceActions',
  'IoT设备': 'IoTDeviceActions',
  '门禁设备': 'AccessDeviceActions',
  '道闸设备': 'BarrierDeviceActions',
  '报警设备': 'AlarmDeviceActions',
}

export default {
  components: {
    VideoDeviceActions, IoTDeviceActions, AccessDeviceActions, BarrierDeviceActions, AlarmDeviceActions,
    DeviceLivePreview, PtzControlPanel, RealtimeDataPanel, DeviceControlPanel, DeviceEditDialog, MapBindingPanel
  },

  data() {
    return {
      currentDevice: null,
      dialogs: { preview: false, ptz: false, realtime: false, control: false, edit: false, map: false }
    }
  },

  // 替换框架操作列
  slots: {
    'col-action': (h, { row }) => {
      const compName = actionMap[row.deviceGroup]
      if (!compName) return null
      // 渲染自定义按钮组，绑定事件
      return h(compName, {
        props: { row },
        on: {
          preview: () => this.openDialog('preview', row),
          ptz: () => this.openDialog('ptz', row),
          playback: () => console.log('playback', row),
          snapshot: () => console.log('snapshot', row),
          syncChannels: () => console.log('syncChannels', row),
          realtime: () => this.openDialog('realtime', row),
          control: () => this.openDialog('control', row),
          refresh: () => this.$emit('refresh'),
          alarms: () => console.log('alarms', row),
        }
      })
    }
  },

  methods: {
    openDialog(name, device) {
      this.currentDevice = device
      this.dialogs[name] = true
    },
    onRefresh() {
      this.$emit('refresh')
    }
  }
}