yos_web/src/bgj/headquartersServiceMaterial/modules/baseInfo.vue

<template>
    <div>
        <div class="normal-margin">
            <el-descriptions
                :column="3"
                :title="$t('基本信息')"
                labelClassName="my-label"
                contentClassName="my-content"
                border
            >
                <el-descriptions-item
                    v-for="(item, index) in detailInfo.baseInfo"
                    :key="index"
                    :label="$t(item.label)"
                >
                    <span :style="item.style ? item.style() : ''">{{
                        item.value ? $t(item.value) : "--"
                    }}</span>
                </el-descriptions-item>
            </el-descriptions>
        </div>

        <div class="normal-margin">
            <el-descriptions
                :column="3"
                :title="$t('系统信息')"
                labelClassName="my-label"
                contentClassName="my-content"
                border
            >
                <el-descriptions-item
                    v-for="(item, index) in detailInfo.systemInfo"
                    :key="index"
                    :label="$t(item.label)"
                    >{{
                        item.value ? $t(item.value) : "--"
                    }}</el-descriptions-item
                >
            </el-descriptions>
        </div>
    </div>
</template>

<script>
export default {
    name: "detailedData",
    props: ["detailInfo"],
    detailInfo() {
        return {};
    },
    mounted() {},
    methods: {},
};
</script>

<style scoped>
/deep/.el-descriptions-item__label {
    font-size: 14px;
    color: rgb(163, 163, 163) !important;
    white-space: nowrap;
}
</style>