<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"
                            selectLabel="carNumber" 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/obstacleClearingRescue/rescueInquiry'

export default {
  name: 'RescueSynchronizaDialog',
  components: {SuperTableSelectorDialog},
  props: {
    isShow: {
      default: false,
      type: Boolean
    },
    treeId: {
      default: '',
      type: String
    }
  },
  data() {
    return {
      orgData: [], // 组织树
      optionList: [
        {title: '救援单号', prop: ['RESCUE_NO_'], type: 'input', default: true},
        {
          title: '救援类型',
          prop: ['RESCUE_TYPE_'],
          type: 'select',
          option: getDictionaryByCode('jylx'),
          multiple: true
        },
        {
          title: '报案来源',
          prop: ['RESCUE_SRC_'],
          type: 'select',
          option: getDictionaryByCode('baly'),
          multiple: true
        }
        // {
        //   title: '救援状态',
        //   prop: ['RESCUE_STATUS_'],
        //   type: 'select',
        //   option: [{
        //     name: '未委派',
        //     value: -1
        //   }, {
        //     name: '未处置',
        //     value: 1
        //   }, {
        //     name: '处置中',
        //     value: 2
        //   }, {
        //     name: '已完成',
        //     value: [3, 4, 5, 6]
        //   }],
        //   multiple: true
        // }
      ],
      tableOptions: [
        {label: '所属路段', minWidth: '60', prop: 'roadName', formatter: ({roadName}) => roadName || '-'},
        {label: '救援单号', minWidth: '80', prop: 'rescueNo', formatter: ({rescueNo}) => rescueNo || '-'},
        {label: '报案电话', minWidth: '60', prop: 'rescueTel', formatter: ({rescueTel}) => rescueTel || '-'},
        {
          label: '报案时间',
          minWidth: '80',
          prop: 'rescueTime',
          formatter: ({rescueTime}) => rescueTime || '-'
        },
        {
          label: '报案来源',
          minWidth: '60',
          prop: 'rescueSrc',
          formatter: ({rescueSrc}) => dictionaryEscape('baly', rescueSrc + '') || '-'
        },
        {
          label: '救援类型',
          minWidth: '100',
          prop: 'rescueType',
          formatter: ({rescueType}) => dictionaryEscape('jylx', rescueType + '') || '-'
        },
        {
          label: '开始站',
          minWidth: '80',
          prop: 'startPatrolName',
          formatter: ({startPatrolName}) => startPatrolName || '-'
        },
        {
          label: '结束站',
          minWidth: '80',
          prop: 'endPatrolName',
          formatter: ({endPatrolName}) => endPatrolName || '-'
        }
      ],
      params: {
        pageBean: {pageSize: 20, page: 1, total: 0},
        querys: [
          {group: 'quick', operation: 'LIKE', relation: 'AND', property: 'roadId'},
          {operation: 'IN', property: 'RESCUE_TYPE_', value: ''},
          {operation: 'IN', property: 'RESCUE_SRC_', value: ''},
          {operation: 'EQUAL', property: 'RESCUE_NO_', value: ''},
          {operation: 'IN', property: 'RESCUE_STATUS_', value: ''}
        ],
        sorter: [
          {
            property: 'createTime',
            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(params) {
      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
      }
    },

    // 处理确认事件
    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>
