MTP2.0_WEB/src/common/components/commonDes/commonDes.vue

<template>
  <a-descriptions :column="column"
                  :bordered="bordered"
                  class="commom-des">
    <a-descriptions-item v-for="(item, i) in list"
                         :key="i + 'des'"
                         :label="item.label">
      <span class="white">{{item.value}}</span>
    </a-descriptions-item>
    <a-descriptions-item v-if="slotDesName"
                         :label="slotDesName">
      <slot></slot>
    </a-descriptions-item>
  </a-descriptions>
</template>
<script lang="ts">
import { defineComponent, PropType } from 'vue';
import { DescriptionsList } from './interface';

export default defineComponent({
    name: 'des-list',
    components: {},
    props: {
        column: {
            // 一行的 DescriptionItems 数量
            type: Number,
            default: 2,
        },
        bordered: {
            // 是否展示边框
            type: Boolean,
            default: false,
        },
        slotDesName: {
            // 使用插槽的时候，DescriptionItems 的内容描述
            type: String,
            default: '',
        },
        list: {
            type: Array as PropType<DescriptionsList[]>,
            default: [],
        },
    },
    setup() {},
});
</script>

<style lang="less">
.commom-des {
}
</style>;