<template>
  <el-drawer
    v-model="visible"
    :size="400"
    :title="$t('知识库.基本信息')"
    :close-on-click-modal="false"
    @close="visible = false"
  >
    <div class="info-content">
      <el-descriptions class="info-content-descriptions" :column="1" label-width="100px" border>
        <el-descriptions-item :label="$t('知识库.目录名称')">
          {{ data?.originalName }}
        </el-descriptions-item>
        <el-descriptions-item :label="$t('通用.创建人')">
          {{ data?.creatorName }}
        </el-descriptions-item>
        <el-descriptions-item :label="$t('通用.创建时间')">
          {{ data?.createTime }}
        </el-descriptions-item>
        <el-descriptions-item :label="$t('通用.更新人')">
          {{ data?.updaterName }}
        </el-descriptions-item>
        <el-descriptions-item :label="$t('通用.更新时间')">
          {{ data?.updateTime }}
        </el-descriptions-item>
      </el-descriptions>
    </div>
  </el-drawer>
</template>

<script lang="ts" setup>
const visible = defineModel<boolean>({ default: false });
defineProps<{ data?: any }>();
</script>

<style lang="scss" scoped>
.info-content {
  width: 100%;
  height: 100%;
  .info-content-descriptions {
    margin-top: var(--margin-small);
  }
}
</style>
