<template>
  <!-- 表格 -->
  <div class="wibox">
    <span class="sjbiao" v-if="props.showtb"></span>
    <div class='bigboxs-t'>
      <div class='top-box'>
        <div class="from-top">
          <span style="color: #000;font-size: 19px;font-weight: 600px;"><el-icon>
              <CollectionTag />
            </el-icon> {{ props.title }}</span>
        </div>
        <div class="content">
          <slot name="content"></slot>

        </div>
        <div class="footerBox">
          <slot name="footer"></slot>
        </div>
      </div>

    </div>


    <slot name="dwbox"></slot>
  </div>

</template>

<script setup>
// 引入
import { reactive, onMounted, watch, ref, getCurrentInstance } from "vue";
const props = defineProps({
  showtb: {
    default: true,
    type: Boolean
  },
  title: {
    default: '',
    type: String
  }
});
const emits = defineEmits(["closeDialog"]);
onMounted(() => {
});

function closeDialog() {

  emits('closeDialog')
}

</script>

<style lang="scss" scoped>
.wibox {
  height: 100%;
  width: 100%;
  padding: 10px;
  background-color: #fff;
  position: relative;

  .sjbiao {
    display: inline-block;
    width: 49px;
    background: var(--el-color-primary);
    clip-path: polygon(100% 39%, 61% 118%, 62% 84%, 62% 14%);
    height: 27px;
    position: absolute;
    left: -34px;
    border-radius: 41%;
    top: -10px;
    text-align: left;
  }

}

.bigboxs-t {
  height: 100%;
}

.from-top {
  height: 33px;
  display: flex;
  justify-content: space-between;
  border-bottom: 2px solid #EFEFEF;
}

.footerBox {
  width: 100%;
  display: flex;
  justify-content: center;
  border-top: 2px solid #EFEFEF;
  padding: 10px 0px;
}

.dwbox {
  width: 100% !important;
  height: 100% !important;
  position: absolute;
  top: 0;
  left: 0;
}

.content {
  height: calc(100vh - 243px);
  // height: 667px;
  overflow-y: scroll;
}

::v-deep ::-webkit-scrollbar {
  display: none !important;
}
</style>
