<template>
  <div class="comp-data-info">
    <div class="content">
      <TableForm ref="tableFormRef" :data="data" tableName="DATA_OVERVIEW" showDisabled>
        <template #form-originalName="{ row }">
          {{ row.originalName || '--' }}
        </template>
        <template #form-dataType="{ row }">
          {{ DATA_TYPE.O[row.dataType] || '--' }}
        </template>
        <template #form-creatorName="{ row }">
          {{ row.creatorName || '--' }}
        </template>
        <template #form-createTime="{ row }">
          {{ row.createTime || '--' }}
        </template>
        <template #form-updateTime="{ row }">
          {{ row.updateTime || '--' }}
        </template>
        <template #form-fileSize="{ row }">
          {{ formatFileSize(row.fileSize) || '--' }}
        </template>
      </TableForm>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import TableForm from '@/components/common/table/tableForm.vue';
import { formatFileSize } from '@/utils/file';
import { useDict } from '@/utils/useDict';

const { DATA_TYPE } = useDict('DATA_TYPE');
const tableFormRef = ref();

interface Props {
  data: any;
}

withDefaults(defineProps<Props>(), {
  data: {},
});
</script>

<style lang="scss" scoped>
.comp-data-info {
  width: 100%;
  min-height: 100%;
  padding: 10px;
  border: solid 1px var(--el-border-color);
  border-radius: 4px;
  margin-left: 10px;
}
</style>
