<template>
  <div style="padding: 20px;">
    <div style="margin-bottom: 8px;">设备名称({{ props.editDeviceDate.typeId }})</div>
    <a-input v-model:value="props.editDeviceDate.name" style="margin-bottom: 10px;" placeholder="请输入设备名称" />
    <div v-for="item in props.editDeviceDate.uavList">
      <div style="margin-bottom: 8px;">设备名称({{ item.typeId }})</div>
      <a-input v-model:value="item.name" style="margin-bottom: 10px;" placeholder="请输入设备名称" />
    </div>
    <div style="margin-bottom: 8px;">所属项目</div>
    <a-select
      v-model:value="props.editDeviceDate.workSpaceId"
      style="width:100%;margin-bottom: 20px;"
      :options="props.projectList"
    ></a-select>
    <div style="display: flex;justify-content: end;">
      <a-button style="margin-right: 10px;" @click="emits('changeEditDeviceModal',false)">取消</a-button>
      <a-button type="primary" @click="submit">确定</a-button>

    </div>
  </div>
</template>

<script setup lang="ts">
import { defineProps, defineEmits } from "vue"
import { EditDronePort } from '@/api/demo/device'
import { message } from "ant-design-vue"
const props = defineProps(['editDeviceDate', 'projectList'])
const emits = defineEmits(['changeEditDeviceModal','reload'])

const submit = () => {
  console.log('123',props.editDeviceDate)
  let params = {}
  let useId = ['id','name','typeId','serialNumber','firmwareVersion','bindStatus','updateTime','createTime',
    'orgId','sn','devicePicUrl','did','isDelete','workSpaceId','uavList']
  Object.keys(props.editDeviceDate).forEach(id => {
    if(useId.includes(id)){
      params[id] = props.editDeviceDate[id]
    }
  })
  EditDronePort(params).then(res => {
    message.success('编辑成功')
    emits('reload')
    emits('changeEditDeviceModal',false)
  })
}
</script>

<style lang="scss" scoped></style>
