<!--
  Description: 报警管理-确认/处置记录
  Author: 李亚光
  Date: 2025-03-04
 -->

<script lang="ts" setup name="confirmSituationDialog">
import { getDictByCode } from '@/api/system/dict'
import { handlerAlarmProcess, getHandlerAlarmRecord } from '@/api/home/alarm/current'
import pendingDialog from './pendingDialog.vue'
import type { FormRules } from 'element-plus'
import { ElMessage } from 'element-plus'
const $route = useRoute()
const emits = defineEmits(['refresh'])
const dialogFormVisible = ref(false)
const loading = ref(false)
const info = ref<any>({})
const isFirstFill = ref(true)
const isDispose = ref(false) // 是否处置
const alarmCategoryName = ref('')
const confirmSituationList = ref<{ id: string; name: string; value: string }[]>([])
const confirmSituationAllList = ref<{ id: string; name: string; value: string }[]>([])
const approvalStatusList = ref<{ id: string; name: string; value: string }[]>([
  {
    name: '待处置',
    id: '6',
    value: '6',
  },
  {
    name: '处置中',
    id: '7',
    value: '7',
  },
  // {
  //   name: '无需处置',
  //   id: '10',
  //   value: '10',
  // },
])
const dataFormRef = ref()
const dataForm = ref({
  confirmValue: '', // 现场浓度值
  approvalStatus: '', // 现场确认情况(字典)
  descn: '', // 现场情况备注
  approvalPerson: '', // 现场确认人员
  approvalTime: '', // 现场确认时间
  flowStatus: '', //


  approvalStatus1: '',
  descn1: '',
  approvalPerson1: '',
  flowStatus1: '',
  approvalTime1: '',
}) // 表单
const rules: FormRules = {
  confirmValue: [{ required: true, message: '现场浓度值不能为空', trigger: ['blur', 'change'] }],
  approvalStatus: [{ required: true, message: '现场确认情况不能为空', trigger: ['blur', 'change'] }],
  descn: [{ required: true, message: '现场确认情况不能为空', trigger: ['blur', 'change'] }],



  approvalPerson: [{ required: true, message: '现场确认人员不能为空', trigger: ['blur', 'change'] }],
  approvalTime: [{ required: true, message: '现场确认时间不能为空', trigger: ['blur', 'change'] }],

  approvalPerson1: [{ required: true, message: '处置人员不能为空', trigger: ['blur', 'change'] }],
  descn1: [{ required: true, message: '处置情况记录不能为空', trigger: ['blur', 'change'] }],
  approvalTime1: [{ required: true, message: '处置时间不能为空', trigger: ['blur', 'change'] }],


} // 前端校验规则

const isFirstLoading = ref(true)
watch(() => dataForm.value.confirmValue, (newVal) => {
  // if () { return }
  if (newVal && info.value.alarmCategory.includes('浓度')) {
    if (!isFirstLoading.value) {
      dataForm.value.approvalStatus = ''
    }
    if (newVal === '0') {
      confirmSituationList.value = confirmSituationAllList.value.filter((item) => item.value.split('-')[1] === '0')
    }
    else if (Number(newVal) > 0 && Number(newVal) <= 5) {
      confirmSituationList.value = confirmSituationAllList.value.filter((item) => item.value.split('-')[1] === '1')
    }
    else if (Number(newVal) > 5) {
      confirmSituationList.value = confirmSituationAllList.value.filter((item) => item.value.split('-')[1] === '2')
    }
  }
})
const record = ref<any[]>([])
const initDialog = (row: any) => {
  record.value = []
  isDispose.value = false
  isFirstLoading.value = true
  dataForm.value = {
    confirmValue: '', // 现场浓度值
    approvalStatus: '', // 现场确认情况(字典)
    descn: '', // 现场情况备注
    approvalPerson: '', // 现场确认人员
    approvalTime: '', // 现场确认时间
    flowStatus: '', // 现场确认人员

    approvalStatus1: '',
    descn1: '',
    approvalPerson1: '',
    flowStatus1: '',
    approvalTime1: '',
  }
  nextTick(() => {
    dataFormRef.value.resetFields()
  })
  // console.log(row, 'row')
  dialogFormVisible.value = true
  loading.value = true
  info.value = row
  alarmCategoryName.value = row.alarmCategory
  // console.log(row.alarmCategory, 'row.alarmCategory')
  if (row.alarmCategory.includes('浓度')) {
    confirmSituationList.value = confirmSituationAllList.value.filter((item) => item.value.split('-')[1] === '0')

  }
  else {
    confirmSituationList.value = confirmSituationAllList.value.filter((item) => item.value.split('-')[1] === '3')
    // console.log(row.alarmCategory, 'row.alarmCategory')
    if ($route.fullPath.includes('operation')) {
      confirmSituationList.value.shift()
      if (confirmSituationAllList.value.filter((item) => item.value.includes('5'))[0]) {
        confirmSituationList.value.unshift(confirmSituationAllList.value.filter((item) => item.value.includes('5'))[0])
      }

    }
  }
  getHandlerAlarmRecord({ alarmId: row.id }).then(res => {
    record.value = (res.data || []).filter((item: any) => item.flowStatus === '5')
    if (record.value.length) {
      isFirstFill.value = false
      dataForm.value.flowStatus = '6'
      dataForm.value.confirmValue = record.value[0].confirmValue
      dataForm.value.approvalStatus = record.value[0].approvalStatus
      dataForm.value.descn = record.value[0].descn
      dataForm.value.approvalPerson = record.value[0].approvalPerson
      dataForm.value.approvalTime = record.value[0].approvalTime
      if ((res.data || []).length) {
        const last = res.data[0]
        if (last.flowStatus === '6' || last.flowStatus === '7') {
          dataForm.value.flowStatus = last.flowStatus
          if (dataForm.value.flowStatus === '7') {
            isDispose.value = true
            console.log(last, 'last')
            dataForm.value.approvalPerson1 = last.approvalPerson
            dataForm.value.descn1 = last.descn
            dataForm.value.approvalTime1 = last.approvalTime
          }
        }
      }


    }
    else {
      isFirstFill.value = true
      dataForm.value.flowStatus = '6'
    }
    setTimeout(() => {
      isFirstLoading.value = false
    }, 100);
    loading.value = false

  })
}
defineExpose({
  initDialog
})

// 去挂起
const pendingRef = ref()
const pending = () => {
  if (!dataForm.value.confirmValue && info.value.alarmCategory?.includes('浓度')) {
    ElMessage.warning('现场浓度值不能为空')
    return
  }
  pendingRef.value.initDialog(info.value, confirmSituationList.value)
}
const pendingRefresh = () => {
  dialogFormVisible.value = false
  emits('refresh')
}

// 确认
const confirm = () => {
  dataFormRef.value.validate((valid: any) => {
    if (valid) {
      const handler = (data: any[]) => {
        handlerAlarmProcess(data).then(res => {
          emits('refresh')
          ElMessage.success('操作成功')
          dialogFormVisible.value = false
        })
      }
      if (record.value.length) {
        const data = []
        data.push({
          alarmId: info.value.id,
          flowStatus: dataForm.value.flowStatus,
          approvalStatus: dataForm.value.approvalStatus,
          descn: dataForm.value.descn1 ? dataForm.value.descn1 : confirmSituationList.value.filter(item => item.value === dataForm.value.approvalStatus)[0]?.name || '',
          approvalPerson: dataForm.value.approvalPerson1,
          approvalTime: dataForm.value.approvalTime1,
        })
        handler(data)
      }
      else {
        const data = [
          {
            alarmId: info.value.id,
            approvalStatus: dataForm.value.approvalStatus,
            confirmValue: dataForm.value.confirmValue,
            descn: dataForm.value.descn,
            approvalPerson: dataForm.value.approvalPerson,
            approvalTime: dataForm.value.approvalTime,
            flowStatus: '5',
          }
        ] as any[]
        data.push({
          alarmId: info.value.id,
          flowStatus: dataForm.value.flowStatus,
          approvalStatus: dataForm.value.approvalStatus,
          descn: dataForm.value.descn1 ? dataForm.value.descn1 : confirmSituationList.value.filter(item => item.value === dataForm.value.approvalStatus)[0]?.name || '',
          approvalPerson: dataForm.value.approvalPerson1,
          approvalTime: dataForm.value.approvalTime1,
        })
        handler(data)
      }
      // handlerAlarmProcess([{ ...dataForm.value, alarmId: info.value.id }]).then(res => {
      //   console.log(res.data, '1111')
      //   emits('refresh')
      // })
    }
  })
}
// 取消
const cancel = () => {
  dialogFormVisible.value = false
}

const fetchDict = () => {
  loading.value = true
  getDictByCode('confirmSituation').then(res => {
    confirmSituationAllList.value = JSON.parse(JSON.stringify(res.data))
    confirmSituationList.value = JSON.parse(JSON.stringify(res.data))
    loading.value = false
  })
}
fetchDict()

const computedDescn = computed(() => {
  return confirmSituationAllList.value.filter((item) => item.value === dataForm.value.approvalStatus)[0]?.name || ''
})
</script>

<template>
  <el-dialog v-model="dialogFormVisible" title="处置情况记录" append-to-body width="500px">
    <!-- 挂起 -->
    <pending-dialog ref="pendingRef" @refresh="pendingRefresh" />
    <el-form ref="dataFormRef" v-loading="loading" :rules="rules" :model="dataForm" label-position="right"
      label-width="120px">
      <el-row :gutter="24" v-if="alarmCategoryName.includes('浓度')">
        <el-col :span="18">
          <el-form-item v-if="info.alarmCategory.includes('浓度')" label="现场浓度值" prop="confirmValue">
            <el-input :disabled="!isFirstFill" v-model="dataForm.confirmValue" placeholder="现场浓度值"
              style="width: 150px;"></el-input>
            %LEL
          </el-form-item>
          <el-form-item v-else label="现场浓度值">
            <el-input :disabled="!isFirstFill" v-model.trim="dataForm.confirmValue" placeholder="现场浓度值"
              style="width: 150px;"></el-input>
            %LEL
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :span="22">
          <el-form-item label="现场确认情况" prop="approvalStatus">
            <el-select v-model="dataForm.approvalStatus" placeholder="现场确认情况" style="width: 100%;"
              :disabled="isDispose">
              <el-option v-for="item in confirmSituationList" :key="item.value" :label="item.name"
                :value="item.value"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :span="22">
          <el-form-item v-if="computedDescn.includes('其他')" label="现场情况备注" prop="descn">
            <el-input type="textarea" v-model.trim="dataForm.descn" placeholder="现场情况备注" :rows="5" maxlength="100"
              show-word-limit></el-input>
          </el-form-item>
          <el-form-item v-else label="现场情况备注">
            <el-input type="textarea" v-model.trim="dataForm.descn" placeholder="现场情况备注" :rows="5" maxlength="100"
              show-word-limit></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :span="22">
          <el-form-item label="现场确认人员" prop="approvalPerson">
            <el-input v-model.trim="dataForm.approvalPerson" placeholder="现场确认人员" :disabled="isDispose"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :span="22">
          <el-form-item label="现场确认时间" prop="approvalTime">
            <el-date-picker v-model="dataForm.approvalTime" type="datetime" placeholder="现场确认时间"
              format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" style="width: 100%;"
              :disabled="isDispose" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :span="22">
          <el-form-item label="处置状态" prop="flowStatus">
            <el-select v-model="dataForm.flowStatus" placeholder="处置状态" style="width: 100%;" :disabled="isDispose">
              <el-option v-for="item in approvalStatusList" :key="item.value" :label="item.name"
                :value="item.value"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <template v-if="dataForm.flowStatus === '7'">
        <el-row :gutter="24">
          <el-col :span="22">
            <el-form-item label="处置情况记录" prop="descn1">
              <el-input type="textarea" v-model.trim="dataForm.descn1" placeholder="处置情况记录" :rows="5" maxlength="100"
                show-word-limit></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="22">
            <el-form-item label="处置人员" prop="approvalPerson1">
              <el-input v-model.trim="dataForm.approvalPerson1" placeholder="处置人员" :disabled="isDispose"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="22">
            <el-form-item label="处置完成时间" prop="approvalTime1">
              <el-date-picker v-model="dataForm.approvalTime1" type="datetime" placeholder="处置完成时间"
                format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" style="width: 100%;"
                :disabled="isDispose" />
            </el-form-item>
          </el-col>
        </el-row>
      </template>
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="pending" :disabled="loading"> 去挂起 </el-button>
        <el-button type="primary" @click="confirm" :disabled="loading"> 确认 </el-button>
        <el-button @click="cancel" :disabled="loading"> 取消 </el-button>
      </div>
    </template>
  </el-dialog>
</template>

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