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

<script>
import {setQueryValue} from '@/utils/requestWrappers'
import SuperTableSelectorDialog from '@/components/SuperTableSelectorDialog/index.vue'
import {dictionaryEscape, getDictionaryByCode} from '@/utils/dictionary'

export default {
  name: 'UserChoiceDialog',
  components: {SuperTableSelectorDialog},
  props: {
    isShow: {
      default: false,
      type: Boolean
    },
    personOptions: {
      default: () => [],
      type: Array
    },
    selectedContent: {
      default: () => [],
      type: Array
    }
  },
  data() {
    return {
      optionList: [
        {
          title: '人员姓名、手机号',
          prop: ['name', 'tel'],
          type: 'input',
          default: true
        },
        {
          title: '外包公司',
          prop: 'out_company_name_',
          type: 'input'
        },
        {
          title: '人员类型',
          prop: 'type',
          type: 'select',
          option: getDictionaryByCode('rylx-xcjyry'),
          multiple: false
        },
        {
          title: '人员职务',
          prop: 'post',
          type: 'select',
          option: getDictionaryByCode('ryzw-xcjyry'),
          multiple: false
        },
        {
          title: '是否外派人员',
          prop: 'isOut',
          type: 'select',
          option: getDictionaryByCode('sfpj'),
          multiple: false
        }
      ],
      tableOptions: [
        {label: '人员姓名', minWidth: '30', prop: 'name'},
        {label: '手机号', minWidth: '40', prop: 'tel'},
        {
          label: '外包公司',
          minWidth: '65',
          prop: 'outCompanyName'
        },
        {
          label: '人员类型',
          minWidth: '40',
          prop: 'type',
          formatter: ({type}) => dictionaryEscape('rylx-xcjyry', type) || '-'
        },
        {
          label: '人员职务',
          minWidth: '50',
          prop: 'post',
          formatter: ({post}) => dictionaryEscape('ryzw-xcjyry', post) || '-'
        },
        {
          label: '是否外派人员',
          minWidth: '50',
          prop: 'isOut',
          formatter: ({isOut}) => dictionaryEscape('sfpj', isOut) || '-'
        }
      ],
      params: {
        pageBean: {pageSize: 20, page: 1, total: 0},
        querys: [
          {operation: 'LIKE', property: 'TEAM_FULL_ID_'},
          {
            group: 'accountNameTel',
            operation: 'LIKE',
            relation: 'OR',
            property: 'name'
          },
          {
            group: 'accountNameTel',
            operation: 'LIKE',
            relation: 'OR',
            property: 'tel'
          },
          {operation: 'LIKE', property: 'code'},
          {
            operation: 'LIKE',
            property: 'out_company_name_'
          },
          {operation: 'EQUAL', property: 'type'},
          {operation: 'EQUAL', property: 'post'},
          {operation: 'EQUAL', property: 'isOut'}
        ],
        sorter: [
          {direction: '', property: 'name'},
          {direction: '', property: 'tel'},
          {direction: '', property: 'isOut'}
        ]
      },
      tableData: [], // 所在路段数据
      treeItem: {}, // 树选中
      tableLoading: false // 表格loading
    }
  },
  computed: {
    isShowDialog: {
      get() {
        return this.isShow
      },
      set(val) {
        this.$emit('update:isShow', val)
      }
    }
  },
  created() {
    // this.getOrgTreeData()
  },
  methods: {
    getSelectData(data) {
      this.selectedContent = data
    },
    // 打开弹层时触发
    open() {
      this.getTableData()
    },

    // 关闭弹层触发
    closed() {
      // 重置data中的数据
      Object.assign(this.$data, this.$options.data.call(this))
    },

    //获取所在路段列表数据
    async getTableData() {
      this.tableData = []
      this.tableLoading = true
      this.tableData = this.personOptions
      this.params.pageBean.total = this.personOptions.length
      this.tableLoading = false
    },

    // 树改变
    treeChange(treeItem) {
      // 修改对应的字段值
      setQueryValue(this.params, 'TEAM_FULL_ID_', treeItem?.path || '')
      this.getTableData()
    }
  }
}
</script>

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