<script lang="ts" setup>
import { Switch } from 'ant-design-vue'
import { onMounted } from 'vue'

import { useRoute } from 'vue-router'
import { columns, searchFormSchema } from './warn.data'
import UpdateModal from './UpdateModal.vue'

import { BasicTable, TableAction, useTable } from '@/components/Table'
import { getWarnPage, updateWarn } from '@/api/alert/warn'
import { useI18n } from '@/hooks/web/useI18n'
import { useMessage } from '@/hooks/web/useMessage'
import { IconEnum } from '@/enums/appEnum'
import { useModal } from '@/components/Modal'

defineOptions({ name: 'Warn' })

const route = useRoute()

const { createMessage } = useMessage()
const { t } = useI18n()
const [registerUpdateModal, { openModal: openUpdateModal }] = useModal()
const [registerTable, { getForm, reload, getDataSource, updateTableDataRecord }] = useTable({
  title: '预警测点列表',
  api: getWarnPage,
  rowKey: 'warnId',
  immediate: true,
  columns,
  formConfig: {
    labelWidth: 120,
    schemas: searchFormSchema,
    showResetButton: false,
    showSubmitButton: false,
    actionColOptions: {
      span: 2,
    },

  },
  beforeFetch: (params) => {
    // 查询前的事件增加默认值，然后设置到表单值中
    params.mpId = route.query.mpId
    // getForm().setFieldsValue(params)
    return params
  },
  useSearchForm: !route.query.mpId,
  showTableSetting: true,
  showIndexColumn: false,
  actionColumn: {
    width: 120,
    title: t('common.action'),
    dataIndex: 'action',
    fixed: 'right',
  },

})

async function updateStatus(record) {
  await updateWarn(record)
  createMessage.success(t('common.saveSuccessText'))
  console.log(record)
  reload()
}
function handleWarnConfig(record: Recordable) {
  openUpdateModal(true, { record, isUpdate: true })
}

onMounted(async () => {

})
</script>

<template>
  <div>
    <BasicTable @register="registerTable">
      <template #bodyCell="{ column, record }">
        <template v-if="column.key === 'action'">
          <TableAction
            :actions="[

              { icon: IconEnum.WARN, label: t('action.warnConfig'),  onClick: handleWarnConfig.bind(null, record) },

            ]"
          />
        </template>
      </template>
      <template #warnStatus="{ record }">
        <Switch
          v-model:checked="record.warnStatus" :checked-value="1" :un-checked-value="0" checked-children="是"
          un-checked-children="否" @change="updateStatus(record)"
        />
      </template>
      <template #shortMessageOnOff="{ record }">
        <Switch
          v-model:checked="record.shortMessageOnOff" :checked-value="1" :un-checked-value="0" checked-children="是"
          un-checked-children="否" @change="updateStatus(record)"
        />
      </template>
      <template #gzpOnOff="{ record }">
        <Switch
          v-model:checked="record.gzpOnOff" :checked-value="1" :un-checked-value="0" checked-children="是"
          un-checked-children="否" @change="updateStatus(record)"
        />
      </template>
      <template #copyToDiagOnOff="{ record }">
        <Switch
          v-model:checked="record.copyToDiagOnOff" :checked-value="1" :un-checked-value="0" checked-children="是"
          un-checked-children="否" @change="updateStatus(record)"
        />
      </template>

      <template #timeDurationThreshold="{ record }">
        {{ `${record.timeDurationThreshold}秒` }}
      </template>
    </BasicTable>
    <UpdateModal @register="registerUpdateModal" @success="reload" />
  </div>
</template>

<style lang="less" scoped>

</style>
