<template>
  <div>
    <el-dialog v-model="props.modelValue" title="系统模块" width="100%" :before-close="handleClose" :append-to-body="false">
      <div class="cntBox">
        <CntBox />
      </div>
    </el-dialog>
  </div>
</template>

<script setup>
import CntBox from "@/views/backOfficeSystem/performanceMenu/achievements/index.vue";
import { ref, defineEmits, defineProps } from "vue";
const props = defineProps({
  modelValue: {
    type: Boolean,
    default: false
  }
});
const emits = defineEmits(["update:modelValue"]);
function handleClose() {
  emits("update:modelValue", false);
}
</script>

<style lang="scss" scoped>
::v-deep .el-dialog {
  background: #000;
  margin: 0;
  --el-dialog-width: 100% !important;
}

::v-deep .el-dialog__body {
  padding: 10px;
  box-sizing: border-box;
}

.cntBox {
  height: calc(100vh - 74px);
  overflow: hidden;
  overflow-y: auto;
}

::v-deep .el-table--border::after,
.el-table--group::after,
.el-table::before {
  background-color: #20606d !important;
}

::v-deep .el-table__border-left-patch {
  background-color: #20606d !important;
}

::v-deep .el-table {
  --el-table-border-color: #20606d !important;
}

::v-deep .margin-bt-10 {
  align-items: center;
}

::v-deep .el-input__inner {
  margin: 0 !important;
}

::v-deep .el-dialog__headerbtn .el-dialog__close {
  color: #fff;
  font-size: 20px;
}

::v-deep .el-table tr {
  background-color: #060537;
}

::v-deep .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell {
  background-color: rgba(34, 83, 140, 0.7);
}

::v-deep .popBody {
  height: 70vh;

  .el-table {
    background-color: #060537;
  }

  .el-table__body-wrapper {
    height: 64vh;
  }
}

::v-deep .qs-box {
  .popBody {
    height: 88vh !important;
    max-height: 88vh !important;
  }
}
</style>