<template>
  <!-- 所在路段选择弹层 -->
  <SuperTableSelectorDialog ref="superTableSelectorDialog" :defaultTreeExpandLevel="4" :isShow.sync="isShowDialog"
                            :isShowSelect="false" :isShowTree="false"
                            :search-option="optionList" :table-data="tableData" :table-loading="tableLoading"
                            :table-options="tableOptions"
                            :tableParams="params" :tree-item="treeItem"
                            :treeData="orgData" :treeTabList="['行政维度']"
                            hintLanguage="提示：请在列表中选择预警后，点击确认。" isSingleChoice
                            select-title-name="事件信息"
                            selectKey="id"
                            title="事件信息选择" v-bind="$attrs" width="75%" @closed="closed"
                            @confirm="handleConfirm"
                            @open="open" @tableRefresh="getTableData"
                            v-on="$listeners" />
</template>

<script>
import {refineRequestBody, setQueryValue} from '@/utils/requestWrappers'
import SuperTableSelectorDialog from '@/components/SuperTableSelectorDialog/index.vue'
import {dictionaryEscape, getDictionaryByCode} from '@/utils/dictionary'
import {tableData} from '@/api/patrolAndRescue/commandDispatch/eventManagement'

export default {
  name: 'ReventSynchronizaDialog',
  components: {SuperTableSelectorDialog},
  props: {
    isShow: {
      default: false,
      type: Boolean
    },
    treeId: {
      default: '',
      type: String
    }
  },
  data() {
    return {
      orgData: [], // 组织树
      optionList: [
        {title: '事件单号', prop: ['EVENT_NO_'], type: 'input', default: true},
        {
          title: '事件类型',
          prop: ['event_Type_'],
          type: 'select',
          option: getDictionaryByCode('lx_sjlxxq'),
          multiple: true
        },
        {
          title: '事件来源',
          prop: ['event_Src_'],
          type: 'select',
          option: getDictionaryByCode('sjly'),
          multiple: true
        }
        // {
        //   title: '事件状态',
        //   prop: ['EVENT_STATUS_'],
        //   type: 'select',
        //   option: getDictionaryByCode('sj_zt'),
        //   multiple: true
        // }
      ],
      tableOptions: [
        {label: '所属路段', minWidth: '60', prop: 'roadName', formatter: ({roadName}) => roadName || '-'},
        {label: '事件单号', minWidth: '80', prop: 'eventNo', formatter: ({eventNo}) => eventNo || '-'},
        {
          label: '事件类型',
          minWidth: '60',
          prop: 'warningType',
          formatter: ({lwEventType}) => dictionaryEscape('lx_sjlxxq', lwEventType + '') || '-'
        },
        {
          label: '事件来源',
          minWidth: '60',
          prop: 'eventSrc',
          formatter: ({eventSrc}) => dictionaryEscape('sjly', eventSrc + '') || '-'
        },
        {
          label: '事件等级',
          minWidth: '60',
          prop: 'warningValue',
          formatter: ({eventLevel}) => dictionaryEscape('sjdj', eventLevel + '') || '-'
        },
        {
          label: '路产损失',
          minWidth: '60',
          prop: 'loss',
          formatter: ({loss}) => loss || '-'
        },
        {
          label: '事件发生时间',
          minWidth: '80',
          prop: 'eventTime',
          formatter: ({eventTime}) => eventTime || '-'
        }
      ],
      params: {
        pageBean: {pageSize: 20, page: 1, total: 0},
        querys: [
          {group: 'quick', operation: 'LIKE', relation: 'AND', property: 'roadId'},
          {operation: 'IN', property: 'event_Type_', value: ''},
          {operation: 'IN', property: 'event_Src_', value: ''},
          {operation: 'EQUAL', property: 'EVENT_NO_', value: ''},
          {operation: 'IN', property: 'EVENT_STATUS_', value: ''}
        ],
        sorter: [
          {
            property: 'create_time_',
            direction: 'DESC'
          }
        ]
      },
      tableData: [], // 所在路段数据
      treeItem: {}, // 树选中
      tableLoading: false // 表格loading
    }
  },
  computed: {
    isShowDialog: {
      get() {
        return this.isShow
      },
      set(val) {
        this.$emit('update:isShow', val)
      }
    }
  },
  created() {
  },
  methods: {
    // 打开弹层时触发
    open() {
      setQueryValue(this.params, 'roadId', this.treeId)
      this.getTableData()
    },

    // 关闭弹层触发
    closed() {
      const {orgData} = this
      // 重置data中的数据
      Object.assign(this.$data, this.$options.data.call(this), {orgData})
      this.treeItem = this.orgData[0] || {}
    },


    //获取所在路段列表数据
    async getTableData() {
      this.tableData = []
      this.tableLoading = true
      try {
        const {rows = [], total, pageSize} = await tableData(
          refineRequestBody(this.params)
        )
        this.tableData = rows
        this.params.pageBean.total = total
      } catch (error) {
        console.error('请求数据失败:', error)
      } finally {
        this.tableLoading = false
      }
    },

    // 处理确认事件
    async handleConfirm(selectedData) {
      try {
        this.$emit('confirm', selectedData)
      } catch (error) {
        console.error('请求数据失败:', error)
      } finally {
        this.tableLoading = false
      }
    }
  }
}
</script>
<style>
.el-tooltip__popper {
  max-width: 800px;
}
</style>
<style lang="scss" scoped>

</style>
