修改

src/views/tentative/basic/rule.vue

@@ -1,5 +1,5 @@
 <template>
-    <hc-body split>
+    <hc-body id="pdf-card-target" split>
         <template #left>
             <hc-card scrollbar>
                 <TestTree
@@ -30,6 +30,18 @@
                 </div>
             </div>
         </hc-card>
+        <hc-drawer v-model="isDrawer" to-id="pdf-card-target" is-close>
+            <div class="drawer-content">
+                <div class="drawer-left">
+                    <hc-pdf v-if="currentPdfUrl" :src="currentPdfUrl" viewer />
+                </div>
+                <div class="drawer-right">
+                    <div v-for="(item, index) in pdfList" :key="index" class="rule-box-item" @click="switchPdf(item)">
+                        <div class="rule-box-item-title">{{ item.fileName }}</div>
+                    </div>
+                </div>
+            </div>
+        </hc-drawer>
     </hc-body>
 </template>
 
@@ -81,8 +93,18 @@ const ruleDetailClick = (item)=>{
 
 
 }
+const isDrawer = ref(false)
 const ruleDetailClick1 = (item)=>{
         getFileDetail1(item.id)
+        isDrawer.value = true
+
+}
+const currentPdfUrl = ref('')
+const switchPdf = (item) => {
+    console.log(item, 'item')
+    
+    // 假设这里通过某种方式获取了PDF的URL，并设置为currentPdfUrl
+    currentPdfUrl.value = item.standardFileUrl // 替换为实际的PDF URL获取逻辑
 }
 
 const getTableData = async () => {
@@ -131,6 +153,7 @@ const getFileDetail = async (id) => {
        fileData.value = []
     }
 }
+const pdfList = ref([])
 const getFileDetail1 = async (id) => {
     ruleFileLoading.value = true
     const { error, code, data } = await dataApi.getById({ 
@@ -141,9 +164,9 @@ const getFileDetail1 = async (id) => {
     ruleFileLoading.value = false
     if (!error && code === 200) {
       console.log(data, 'data')
-      
+      pdfList.value = data.standardFiles || []
     } else {
-       
+       pdfList.value = []
     }
 }
 </script>
@@ -178,4 +201,20 @@ const getFileDetail1 = async (id) => {
     }
 
 }
+.drawer-content {
+    display: flex;
+    height: 100%;
+    width: 100%;
+}
+.drawer-left {
+    flex: 3;
+    padding: 20px;
+    overflow-y: auto;
+    border-right: 1px solid #ddd;
+}
+.drawer-right {
+    flex: 1;
+    padding: 20px;
+    overflow-y: auto;
+}
 </style>