<!--version: 3, 选择弹窗-->
<!--版本更新内容：添加prop属性，修复多选-->

<template>
  <el-dialog :title="title" :visible="show" width="1000px" top="2vh" @close="close" :append-to-body="true">
    <el-scrollbar style="height: 60vh;">
      <dept-check
        v-if="show"
        ref="check"
        :multiple="multiple"
        :init-select="initSelect"
        :list-api="listApi"
        v-on="$listeners"
        :query="query"
      />
    </el-scrollbar>
    <template #footer>
      <el-button type="primary" @click="submit()" icon="el-icon-check">确 定</el-button>
    </template>
  </el-dialog>
</template>

<script>
import { $showColumns } from '@/utils/mixins'
import DeptCheck from '@/components/Business/Dept/DeptCheck.vue'
import { listDept } from '@/api/system/dept'

export default {
  name: "DeptDialog",
  mixins: [$showColumns],
  dicts: ['sys_normal_disable', 'sys_user_sex', 'user_employ_status'],
  components: { DeptCheck },
  props: {
    // 标题
    title: {
      type: String,
      default: `选择部门`
    },
    multiple: {
      type: Boolean,
      default: false,
    },
    show: {
      type: Boolean,
      default: false
    },
    query: {
      type: Object,
      default: () => ({})
    },
    initSelect: {
      type: Array,
      default: null,
    },
    prop: {
      type: String,
      default: 'deptId'
    },
    listApi: {
      type: Function,
      default: listDept
    }
  },
  methods: {
    // 确认选中
    submit() {
      if (this.multiple) {
        this.$emit('select', this.$refs.check.selected);
      } else {
        this.$emit('select', this.$refs.check.selected[0]);
      }
    },
    // 关闭弹窗
    close() {
      this.$emit('update:show', false);
    },
  },
}
</script>
