fix: 【公共】详情页demo修改

src/views/page-detail/index.vue

@@ -1,7 +1,29 @@
 <template>
   <div class="page-detail">
     <page-detail-layout :tabs="tabs" v-model:tab-active-key="tabActiveKey">
-      <template #tab1>tab1</template>
+      <template #tab1>
+        <bs-contents-wrapper>
+          <bs-descriptions :items="bsDescriptionItems" title="表头1">
+            <template #name1_label_slot>
+              <span style="color: red">label插槽</span>
+            </template>
+            <template #name1_value_slot> <span style="color: blue">value插槽</span></template>
+          </bs-descriptions>
+          <bs-descriptions :items="bsDescriptionItems" title="表头2">
+            <template #name1_label_slot>
+              <span style="color: red">label插槽</span>
+            </template>
+            <template #name1_value_slot> <span style="color: blue">value插槽</span></template>
+          </bs-descriptions>
+          <bs-descriptions :items="bsDescriptionItems" title="表头3">
+            <template #name1_label_slot>
+              <span style="color: red">label插槽</span>
+            </template>
+            <template #name1_value_slot> <span style="color: blue">value插槽</span></template>
+          </bs-descriptions>
+        </bs-contents-wrapper>
+
+      </template>
       <template #tab2>tab2</template>
       <template #tab3>tab3</template>
     </page-detail-layout>
@@ -11,9 +33,11 @@
 <script setup>
   import { ref } from 'vue';
   import PageDetailLayout from '/@/components/business/page-detail-layout/index.vue';
+  import { BsDescriptions, BsContentsWrapper } from '/@/components/BsUi/index.js';
+
   import selectedIcon from '/@/assets/images/page-detail-layout/selectedIcon.png';
   import unSelectedIcon from '/@/assets/images/page-detail-layout/unSelectedIcon.png';
-  const tabActiveKey = ref('tab2');
+  const tabActiveKey = ref('tab1');
 
   const tabs = ref([
     {
@@ -38,6 +62,29 @@
       unSelectedIcon: unSelectedIcon,
     },
   ]);
+
+  const bsDescriptionItems = ref([
+    {
+      label: '姓名',
+      field: 'name',
+      value: '韩晓辉',
+      extraProps: {},
+    },
+    {
+      label: '姓名1',
+      field: 'name1',
+      value: '韩晓辉1',
+      labelSlot: 'name1_label_slot',
+      valueSlot: 'name1_value_slot',
+      extraProps: {},
+    },
+    {
+      label: '姓名1',
+      field: 'name1',
+      value: '韩晓辉1',
+      extraProps: {},
+    },
+  ]);
 </script>
 
 <style lang="scss" scoped>