<script lang="ts" setup>
import { ref } from 'vue'
import moment from 'moment'

import { Card } from 'ant-design-vue'
import { formHistory } from '../exa.data'
import HistoryLine from '../HistoryLine.vue'

import { BasicModal, useModalInner } from '@/components/Modal'
import { BasicForm, useForm } from '@/components/Form'

import { getExaHistorys } from '@/api/alert/exa'
import {EXAHistoryReqVO} from "@/api/alert/warn";

const props = defineProps({
  itemName: {
    type: String,
    default: '',
  },
  legendName: {
    type: Array<string>,
    default: () => [],
  },
})

const loading = ref(true)

// const itemName = ref('')

const [registerForm, { getFieldsValue }] = useForm({
  labelWidth: 100,
  // baseColProps: { span: 24 },
  schemas: formHistory,
  showResetButton: false,
  layout: 'horizontal',
  model: { time: [moment().subtract(1, 'day').format('YYYY-MM-DD HH:mm:ss'), moment().format('YYYY-MM-DD HH:mm:ss')] },
  fieldMapToTime: [
    // data为时间组件在表单内的字段，startTime，endTime为转化后的开始时间于结束时间
    ['time', ['startTime', 'endTime'], 'YYYY-MM-DD HH:mm:ss'],
  ],
  actionColOptions: { span: 2 },
})
const historyData = ref()
// const legendName = ref<any[]>([])

const [registerHistoryModal, { setModalProps }] = useModalInner(async (data) => {
  console.log(543)
  setModalProps({ confirmLoading: false, showCancelBtn: false, showOkBtn: false })
  // props.itemName = data.record.itemName
  // legendName.value = []
  // legendName.value.push(`${data.record.descriptor}-${data.record.itemName}`)
  handleSubmitR()
  // 利用点号去获取历史数据，从而生成曲线
  // setFieldsValue({ time: [moment().subtract(1, 'day').format('YYYY-MM-DD HH:mm:ss'), moment().format('YYYY-MM-DD HH:mm:ss')] })
  // console.log(startTime, endTime, itemName)
  // const historyData = getExaHistory({
  //   startTime,
  //   endTime,
  //   itemName: itemName.value,
  // })
  // isUpdate.value = !!data?.isUpdate
  // if (unref(isUpdate)) {
  //   const res = await getUser(data.record.id)
  //   setFieldsValue({ ...res })
  // }
})

async function handleSubmitR() {
  const exaHistoryReqVO = getFieldsValue() as EXAHistoryReqVO
  loading.value = true
  exaHistoryReqVO.itemName = props.itemName
  historyData.value = await getExaHistorys(exaHistoryReqVO)

  loading.value = false
}
</script>

<template>
  <BasicModal :min-height="300" v-bind="$attrs" title="历史曲线" width="60%" @register="registerHistoryModal">
    <BasicForm @register="registerForm" @submit="handleSubmitR" />
    <Card :loading="loading">
      <HistoryLine :data="historyData" :name="legendName" height="40vh" />
    </Card>
  </BasicModal>
</template>
