<template>
  <Teleport to="body">
    <section class="view-container" v-show="show">
      <section class="user-conatiner">
        <section class="close">
          <el-button type="primary" circle size="small" @click="close">
            <Icon icon="ep:close" /> </el-button
        ></section>
        <User ref="userComponent" isInset v-bind="$attrs" />
      </section>
    </section>
  </Teleport>
</template>

<script setup>
import User from '@/views/system/user/index.vue'
const show = ref(false)
const emit = defineEmits(['select'])
const open = () => {
  show.value = true
}

function close() {
  show.value = false
  emit('close')
}

const dblclickRow = (row) => {
  emit('dbClickRow', row)
}

provide('closeParent', close);


defineExpose({
  open
})
</script>

<style lang="scss" scoped>
.view-container {
  background-color: #0000006f;
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
  .user-conatiner {
    width: 80vw;
    border-radius: 8px;
    // overflow: hidden;
    padding: 12px;
    background-color: #fff;
    position: relative;
    .close {
      position: absolute;
      right: 0;
      top: 0;
      transform: translateX(50%) translateY(-50%);
    }
  }
}
</style>
