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

<template>
  <el-dialog :title="title" :visible="show" width="80%" top="2vh" @close="close" :append-to-body="true">
    <user-check
      v-if="show"
      ref="check"
      :multiple="multiple"
      :init-select="initSelect"
      :list-api="listApi"
      v-on="$listeners"
      :query="query"
    />

    <template #footer>
      <el-button type="primary" @click="submit()">确定</el-button>
    </template>
  </el-dialog>
</template>

<script>
import DeptTreeSelect from '@/components/Business/Dept/DeptTreeSelect.vue'
import Price from '@/views/bst/price/index.vue'
import BooleanTag from '@/components/BooleanTag/index.vue'
import { $showColumns } from '@/utils/mixins'
import { listUser } from '@/api/system/user'
import UserCheck from '@/components/Business/User/UserCheck.vue'

export default {
  name: "UserDialog",
  mixins: [$showColumns],
  dicts: ['sys_normal_disable', 'sys_user_sex', 'user_employ_status'],
  components: {UserCheck, BooleanTag, Price, DeptTreeSelect},
  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: 'userId'
    },
    listApi: {
      type: Function,
      default: listUser
    }
  },
  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>
