<template>
  <BasicDrawer
    v-bind="$attrs"
    destroyOnClose
    @register="registerDrawer"
    :title="getTitle"
    :width="width"
  >
    <Description @register="registerDesc" :data="descData" />
  </BasicDrawer>
</template>
<script lang="ts" setup>
  import { onBeforeMount, ref } from 'vue'; // onBeforeMount,
  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  import { Description, useDescription } from '/@/components/Description';
  import { viewSchema } from './data';

  import { infraStorageconfigDetail } from '/@/api/infra/infraStorageConfigApi';

  const descData = ref({});
  const getTitle = '查看存储配置';
  const width = '45%';

  onBeforeMount(async () => {});
  const [registerDrawer] = useDrawerInner(async data => {
    const resData = await infraStorageconfigDetail(data.record.id);
    resData.master = resData.master ? '是' : '否';
    if (resData.type) {
      const configs = Object.keys(resData.config);
      configs.forEach(item => {
        resData['config' + item] = resData.config[item];
      });
    }
    descData.value = {
      ...resData,
      types: getTypeText(resData.type),
    };
  });
  const [registerDesc] = useDescription({
    schema: viewSchema,
    column: 1,
    size: 'middle',
    labelStyle: {
      width: '120px',
    },
  });
  function getTypeText(type) {
    switch (type) {
      case 'ali':
        return '阿里云';
      case 'db':
        return '数据库';
      case 'local':
        return '本地存储';
      case 'minio':
        return 'minio存储';
      default:
        return '';
    }
  }
</script>
