<template>
  <div style="padding: 20px;">
    <div style="margin-bottom: 10px;">
      <div style="margin-bottom: 3px;">前时像</div>
      <a-select
        v-model:value="beforeTime" 
        :options="timeOptions"
        style="width: 100%" />
    </div>
    <div style="margin-bottom: 10px;">
      <div style="margin-bottom: 3px;">后时像</div>
      <a-select
        v-model:value="afterTime" 
        :options="timeOptions"
        style="width: 100%" />
    </div>
    <div style="margin-bottom: 30px;">
      <div style="margin-bottom: 3px;">图层</div>
      <a-select
          mode="multiple"
          max-tag-count="responsive"
          v-model:value="layer" 
          :options="layerOptions"
          style="width: 100%" />
    </div>
    <a-button style="width:100%" type="primary" @click="submit">提交</a-button>
  </div>
</template>

<script setup lang="ts">
import { defineProps,ref, onMounted, defineEmits } from "vue"
import { LoadLayerInfo, AddCaseInfoTask, LoadTuBanshixiang } from '@/api/audit/index'
import { message } from 'ant-design-vue'

onMounted(() => {
  LoadLayerInfo().then(res => {
    console.log(res)
    layerOptions.value = res.map(item => {
      return {
        label: item.layername,
        value: item.layerid
      }
    })
  })
  LoadTuBanshixiang().then(res => {
    timeOptions.value = res.map(item => {
      return {
        label: `${item.name}  [ ${item.time} ]`,
        value: item.time
      }
    })
  })
})

const props = defineProps(["picihao","selectKeys"])
const emits = defineEmits(["closeCloudQuery"])
const beforeTime = ref()
const afterTime = ref()
const layer = ref([])
const layerOptions = ref([])
const timeOptions = ref([])

const submit = () => {
  console.log(props.selectKeys())
  let params = {
    picihao: props.picihao,
    qianshixiang: beforeTime.value,
    houshixiang: afterTime.value,
    // caseinfoids: props.selectKeys().join(','),
    caseinfoids: '0',
    shplayerids: layer.value.join(','),
  }
  AddCaseInfoTask(params).then(res => {
    console.log(res)
    if(res){
      message.success('提交成功')
      emits("closeCloudQuery")
    }
  })
}
</script>

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