<template>

  <div class="flex left fw-b fs-16 mar-top-20" style="padding-left: 100px">相机ISO参数<span style="color: #FD5E1A">（<el-icon style="position: relative; top:2px; margin: 0 3px"><WarningFilled /></el-icon>相机设置ISO auto时无效）</span></div>
  <div class="selectBox">
    <div class="form-item" style="padding-bottom: 30px;">
      <div class="iso-inputs mar-top-20">
        <div class="iso-group">
          <span class="iso-label">用曝光灯时：</span>
          <div class="select-wrapper">
            <el-select
              v-model="iso_config.low"
              filterable
              default-first-option
              placeholder="请选择或输入ISO值"
              class="iso-input"
            >
              <el-option
                v-for="item in iso_options"
                :key="item"
                :label="item"
                :value="item"
              />
            </el-select>
          </div>
        </div>
        <div class="iso-group">
          <span class="iso-label">不用时：</span>
          <div class="select-wrapper">
            <el-select
              v-model="iso_config.high"
              filterable
              default-first-option
              placeholder="请选择或输入ISO值"
              class="iso-input"
            >
              <el-option
                v-for="item in iso_options"
                :key="item"
                :label="item"
                :value="item"
              />
            </el-select>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup>
import { reactive, onMounted, ref, watch } from 'vue'
import { ElMessage } from 'element-plus'
import client from "@/stores/modules/client";
import icpList from '@/utils/ipc';
import socket from "@/stores/modules/socket.js";
const clientStore = client();
const socketStore = socket(); // WebSocket状态管理实例

// 定义props
const props = defineProps({
  camera_configs: {
    type: Object,
    default: () => ({})
  }
})

// 定义emits
const emit = defineEmits(['update:camera_configs'])

const iso_config = reactive({
  low: 100,
  high: 6000,
  mode: "auto22"
})

const iso_options = ref(['auto', 100, 200, 400, 800, 1600, 3200, 6400, 12800])

// 监听iso_config变化并更新父组件
watch(iso_config, (newVal) => {
  emit('update:camera_configs', {
    iso_config,
  })
}, { deep: true })

onMounted(() => {
  // 从props初始化数据
  if (props.camera_configs.iso_config.low !== undefined) {
    iso_config.low = props.camera_configs.iso_config.low
  }
  if (props.camera_configs.iso_config.high !== undefined) {
    iso_config.high = props.camera_configs.iso_config.high
  }

  // 读取设备当前可用的 ISO 档位
  clientStore.ipc.removeAllListeners(icpList.socket.message + '_smart_shooter_get_camera_property');
  socketStore.sendMessage({
    type: 'smart_shooter_get_camera_property'
  });

  clientStore.ipc.on(icpList.socket.message + '_smart_shooter_get_camera_property', async (event, result) => {
    if (result.code == 0 && result.data) {
      const ISO = result.data.filter(item => item.CameraPropertyType == 'ISO')
      if (ISO.length > 0) {
        iso_options.value = ISO[0].CameraPropertyRange
      }
    }
    clientStore.ipc.removeAllListeners(icpList.socket.message + '_smart_shooter_get_camera_property');
  })
})

// 暴露保存方法，给父组件调用
const save =  () => {
  // 必填校验（允许填写数字或 'auto'）
  const isEmpty = (v) => v === undefined || v === null || v === ''
  if (isEmpty(iso_config.low)) {
    ElMessage.error('请填写“用曝光灯时”的 ISO 值')
    return false
  }
  if (isEmpty(iso_config.high)) {
    ElMessage.error('请填写“不用时”的 ISO 值')
    return false
  }

  // 若均为数字，做简单范围校验（>0）
  const lowNum = Number(iso_config.low)
  const highNum = Number(iso_config.high)
  if (!Number.isNaN(lowNum) && lowNum <= 0) {
    ElMessage.error('“用曝光灯时”的 ISO 必须大于 0')
    return false
  }
  if (!Number.isNaN(highNum) && highNum <= 0) {
    ElMessage.error('“不用时”的 ISO 必须大于 0')
    return false
  }

  return  true;
/*  return await new Promise((resolve, reject) => {
    clientStore.ipc.removeAllListeners(icpList.setting.updateSysConfigs);
    clientStore.ipc.send(icpList.setting.updateSysConfigs,{
      key: 'camera_configs',
      value: JSON.stringify({
        iso_low: iso_config.low,
        iso_high: iso_config.high
      })
    });

    clientStore.ipc.on(icpList.setting.updateSysConfigs, async (event, result) => {
      clientStore.ipc.removeAllListeners(icpList.setting.updateSysConfigs);
      if(result.code === 0 && result.msg){
        resolve(true)
      } else {
        resolve(false)
      }
    });
  });*/
}

defineExpose({ save })

</script>

<style lang="scss" scoped>
.iso-inputs {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.iso-group {
  display: flex;
  align-items: center;
  gap: 12px;
}

.iso-label {
  min-width: 80px;
  font-size: 14px;
  color: #1A1A1A;
}

.iso-input {
  width: 200px;
}

.select-wrapper {
  :deep(.el-input__inner) {
    border-radius: 6px;
  }
}
.selectBox {
  padding-top: 10px;
}
</style>
