30 lines
911 B
Vue
30 lines
911 B
Vue
|
<template>
|
||
|
|
<el-descriptions :column="column" border>
|
||
|
|
<template v-for="item in options" :key="item.key">
|
||
|
|
<el-descriptions-item v-if="!item.hidden" :label="item.label" :span="item.span || 1">
|
||
|
|
<slot :name="item.key">
|
||
|
|
<template v-if="item.value">{{ item.value }}</template>
|
||
|
|
<template v-if="!item.value">{{ info[item.key] }}</template>
|
||
|
|
</slot>
|
||
|
|
</el-descriptions-item>
|
||
|
|
</template>
|
||
|
|
</el-descriptions>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import { ElDescriptions, ElDescriptionsItem } from "element-plus";
|
||
|
|
import "element-plus/es/components/descriptions/style/css";
|
||
|
|
import "element-plus/es/components/descriptions-item/style/css";
|
||
|
|
|
||
|
|
defineOptions({
|
||
|
|
name: "AppInfoBuilder",
|
||
|
|
});
|
||
|
|
defineProps({
|
||
|
|
info: { type: Object, required: true },
|
||
|
|
options: { type: Array, required: true },
|
||
|
|
column: { type: Number, default: 2 },
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped lang="scss"></style>
|