| 1234567891011121314151617181920212223242526272829303132333435363738394041424344 |
- <template>
- <div class="para-tab-wrap">
- <div v-for="(item, index) in items" :key="index" class="para-tab-row">
- <div class="para-tab-name" :style="{ width: labelWidth }">{{ item.name }}</div>
- <div class="para-tab-content" v-html="item.content"></div>
- </div>
- </div>
- </template>
- <script setup>
- defineProps({
- labelWidth: {
- type: String,
- default: '150px' // 默认 150px
- },
- items: {
- type: Array,
- required: true,
- default: () => []
- }
- });
- </script>
- <style scoped>
- .para-tab-wrap {
- display: flex;
- flex-direction: column;
- gap: 20px;
- width: 100%;
- padding-top: 30px;
- padding-bottom: 30px;
- }
- .para-tab-row {
- display: flex;
- gap: 20px;
- }
- .para-tab-name {
- font-weight: bold;
- color: #333;
- }
- .para-tab-content {
- flex: 1;
- }
- </style>
|