发票预览有问题

src/views/apihub/apiorder/index.vue

@@ -236,6 +236,19 @@ scope.row.invoiceStatus === InvoiceRequestEnum.INVOICING.type"
       v-model:limit="queryParams.pageSize"
       @pagination="getList"
     />
+    <!-- 发票预览弹窗 -->
+    <el-dialog
+      v-model="pdfDialogVisible"
+      title="发票预览"
+      width="80%"
+      top="5vh"
+    >
+      <iframe
+        v-if="invoiceUrl"
+        :src="invoiceUrl"
+        style="width: 100%; height: 80vh; border: none;"
+      ></iframe>
+    </el-dialog>
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
@@ -318,10 +331,21 @@ const issueInvoice = (row) => {
   issueInvoiceFormRef.value.open(row);
 }
 
-const OrderViewInvoiceFormRef = ref()
-const viewInvoice = (row) => {
-  OrderViewInvoiceFormRef.value.open(row)
+// const OrderViewInvoiceFormRef = ref()
+// const viewInvoice = (row) => {
+//   // OrderViewInvoiceFormRef.value.open(row)
+//
+// }
+
+const pdfDialogVisible = ref(false)
+const invoiceUrl = ref('')
+
+function viewInvoice(row) {
+  debugger;
+  invoiceUrl.value = import.meta.env.VITE_BASE_URL+'/admin-api/infra/file/preview?url=' + row.invoiceUrl // 从接口带回的 pdf 地址
+  pdfDialogVisible.value = true
 }
+
 /** 删除按钮操作 */
 const handleDelete = async (id: number) => {
   try {