报销/拨款发票明细增加预览功能

审核员点击发票明细行的"预览"按钮即可直接查看PDF/图片内容，复用已有的
Folder全局预览组件，无需下载。

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

ruoyi-ui/src/views/hrm/requests/appropriationDetail.vue

@@ -35,14 +35,20 @@
               <el-table-column prop="amount" label="金额(元)" width="110" align="right">
                 <template slot-scope="{ row }">¥{{ row.amount }}</template>
               </el-table-column>
-              <el-table-column label="附件" width="80" align="center">
+              <el-table-column label="附件" width="130" align="center">
                 <template slot-scope="scope">
-                  <el-button
+                  <template v-if="scope.row.ossId && isFirstRowOfFile(detail.invoiceItems, scope.$index, scope.row.ossId)">
-                    v-if="scope.row.ossId && isFirstRowOfFile(detail.invoiceItems, scope.$index, scope.row.ossId)"
+                    <el-button
-                    type="text" size="mini" title="下载附件"
+                      type="text" size="mini" title="预览附件"
-                    @click="downloadOss(scope.row.ossId)">
+                      @click="previewOss(scope.row.ossId)">
-                    <i class="el-icon-download"></i> 下载
+                      <i class="el-icon-view"></i> 预览
-                  </el-button>
+                    </el-button>
+                    <el-button
+                      type="text" size="mini" title="下载附件"
+                      @click="downloadOss(scope.row.ossId)">
+                      <i class="el-icon-download"></i> 下载
+                    </el-button>
+                  </template>
                 </template>
               </el-table-column>
             </el-table>
@@ -92,6 +98,7 @@ export default {
     FilePreview,
     BizDetailContainer
   },
+  inject: ['$folder'],
   data () {
     return {
       loading: false,
@@ -357,6 +364,20 @@ export default {
     downloadOss (ossId) {
       this.$download.oss(ossId)
     },
+    async previewOss (ossId) {
+      try {
+        const res = await listByIds([ossId])
+        const file = (res.data || [])[0]
+        if (!file) {
+          this.$message.warning('文件不存在')
+          return
+        }
+        this.$folder().previewSimple(file)
+      } catch (e) {
+        console.error('预览失败:', e)
+        this.$message.error('预览失败')
+      }
+    },
     getActionText (action) {
       const map = {
         'submit': '提交申请',

ruoyi-ui/src/views/hrm/requests/reimburseDetail.vue

@@ -26,14 +26,20 @@
               <el-table-column prop="amount" label="金额(元)" width="110" align="right">
                 <template slot-scope="{ row }">¥{{ row.amount }}</template>
               </el-table-column>
-              <el-table-column label="附件" width="80" align="center">
+              <el-table-column label="附件" width="130" align="center">
                 <template slot-scope="scope">
-                  <el-button
+                  <template v-if="scope.row.ossId && isFirstRowOfFile(detail.invoiceItems, scope.$index, scope.row.ossId)">
-                    v-if="scope.row.ossId && isFirstRowOfFile(detail.invoiceItems, scope.$index, scope.row.ossId)"
+                    <el-button
-                    type="text" size="mini" title="下载附件"
+                      type="text" size="mini" title="预览附件"
-                    @click="downloadOss(scope.row.ossId)">
+                      @click="previewOss(scope.row.ossId)">
-                    <i class="el-icon-download"></i> 下载
+                      <i class="el-icon-view"></i> 预览
-                  </el-button>
+                    </el-button>
+                    <el-button
+                      type="text" size="mini" title="下载附件"
+                      @click="downloadOss(scope.row.ossId)">
+                      <i class="el-icon-download"></i> 下载
+                    </el-button>
+                  </template>
                 </template>
               </el-table-column>
             </el-table>
@@ -66,6 +72,7 @@
 </template>
 
 <script>
+import { listByIds } from "@/api/system/oss";
 import FilePreview from "@/components/FilePreview/index.vue";
 import BizDetailContainer from '@/views/hrm/components/BizDetailContainer/index.vue';
 
@@ -80,6 +87,7 @@ export default {
     BizDetailContainer,
     FilePreview
   },
+  inject: ['$folder'],
   computed: {
     currentBizId () {
       return this.bizId || this.$route?.params?.bizId || this.$route?.query?.bizId || this.$route?.params?.id
@@ -97,6 +105,20 @@ export default {
     },
     downloadOss (ossId) {
       this.$download.oss(ossId)
+    },
+    async previewOss (ossId) {
+      try {
+        const res = await listByIds([ossId])
+        const file = (res.data || [])[0]
+        if (!file) {
+          this.$message.warning('文件不存在')
+          return
+        }
+        this.$folder().previewSimple(file)
+      } catch (e) {
+        console.error('预览失败:', e)
+        this.$message.error('预览失败')
+      }
     }
   }
 }