浏览代码

feat(KIP-11923): 补充多种pdf的场景

john 1 年之前
父节点
当前提交
fd9c08502d

+ 7 - 4
src/pages/parkingFeeV2/mixins/parkingReceipt/parkingInvoice.js

@@ -95,7 +95,10 @@ export default {
         console.log('支付订单详情', res)
         self.order = res;
         // TODO KIP-11923 发布前移除
-        self.order.invoiceUrl = 'https://kip-public-qa.oss-cn-shanghai.aliyuncs.com/dea54e0cff544ace90564a9f715dc9df_99242000000001678918.pdf'
+        self.order.invoiceUrl = [
+          'https://kip-public-qa.oss-cn-shanghai.aliyuncs.com/dea54e0cff544ace90564a9f715dc9df_99242000000001678918.pdf',
+          'https://kip-public-qa.oss-cn-shanghai.aliyuncs.com/a2a53363f2a245d69b7853dc04d49ba1_996922403177_08447684.pdf'
+        ]
       } catch {
         uni.showToast({
           title: '服务器开小差了呢,请您稍后再试',
@@ -142,9 +145,9 @@ export default {
       });
     },
     showInvoiceDetail() {
-      this.$router.push({
-        path: 'parkingInvoiceImage?order=' + JSON.stringify(this.order),
-      });
+        this.$router.push({
+          path: 'parkingInvoiceImage?order=' + JSON.stringify(this.order),
+        });
     },
   },
 };

+ 6 - 0
src/pages/parkingFeeV2/mixins/parkingReceipt/parkingInvoiceImage.js

@@ -79,6 +79,12 @@ export default {
       }
     },
     downloadPdf() {
+      if(this.order.invoiceUrl.length > 1) {
+        this.$router.push({
+          path: 'parkingInvoiceImages?order=' + JSON.stringify(this.order),
+        });
+        return
+      }
       if (window.__wxjs_environment === 'miniprogram') {              
         wx.miniProgram.navigateTo({
           url: `/pages/package-parkingFee/file?invoiceUrl=${encodeURIComponent(this.order.invoiceUrl)}`,

+ 2 - 2
src/pages/parkingFeeV2/parkingReceipt/parkingInvoiceImage.vue

@@ -26,7 +26,7 @@
         再次推送
       </div>
       <div
-        v-if="order && order.invoiceUrl"
+        v-if="order && order.invoiceUrl.length"
         :class="{
           btn: true,
           'push-again-btn': true,
@@ -34,7 +34,7 @@
         style="width:100%; margin:24px auto 0;"
         @click="downloadPdf"
       >
-        下载发票
+        {{ order.invoiceUrl.length > 1 ? '下载更多发票' : "下载发票"}}
       </div>
     </div>
   </scroll-view>

+ 99 - 0
src/pages/parkingFeeV2/parkingReceipt/parkingInvoiceImages.vue

@@ -0,0 +1,99 @@
+<!-- 更多发票预览 -->
+<template>
+    <div :class="['invoice-url-list', theme]">
+        <div class="invoice-url" v-for="item in invoiceUrl">
+            <div class="url-box">
+                <div class="title">文件编号:</div>
+                <div class="url">{{ getTitle(item) }}</div>
+            </div> <div class="btn" @click="dowloadPdf(item)">下载发票</div>
+        </div>
+    </div>
+</template>
+
+
+<script>
+import baseMixins from '../mixins/base'
+
+export default {
+    mixins: [baseMixins],
+    data() {
+        return {
+            order: {},
+            invoiceUrl: []
+        }
+    },
+    created() {
+        this.order = JSON.parse(this.$route.query.order);
+        this.invoiceUrl = this.order.invoiceUrl
+    },
+    methods:{
+        getTitle(fileUrl = '') {
+            if (!fileUrl) return '';
+            
+            // 使用更明确的正则表达式并处理匹配失败的情况
+            const match = fileUrl.match(/.*_(.*_.*)\.pdf$/);
+            const match2 = fileUrl.match(/.*_(.*)\.pdf$/);
+            if (match && match[1]) {
+                return match[1];
+            } else if(match2 && match2[1]){
+                return match2[1]
+            } else {
+                // 处理不匹配的情况,返回空字符串或其他默认值
+                return '';
+            }
+        },
+        dowloadPdf(invoiceUrl) {
+            if (window.__wxjs_environment === 'miniprogram') {              
+                wx.miniProgram.navigateTo({
+                url: `/pages/package-parkingFee/file?invoiceUrl=${encodeURIComponent(invoiceUrl)}`,
+                });
+            }
+            if (this.isAlipayClient) {
+                my?.navigateTo({
+                url: `/pages/package-parkingFee/file?invoiceUrl=${encodeURIComponent(invoiceUrl)}`,
+                })
+            }
+        }
+    }
+}
+</script>
+
+
+<style lang="less" scoped>
+.invoice-url-list {
+    padding: 24px;
+    .invoice-url {
+        padding: 24px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        border: 1px solid var(--k-color-primary-02);
+        border-radius: 10px;
+        margin-bottom: 24px;
+        &:last-child {
+            margin-bottom: 0px;
+        }
+        .url-box {
+            font-size: 24px;
+            .title {
+                color: #333;
+                font-weight: 600;
+                font-size: 32px;
+                margin-bottom: 10px;
+            }
+            .url {
+                color: var(--k-color-primary-01);
+            }
+        }
+        .btn {
+            color: #ffffff;
+            font-size: 24px;
+            border-radius: 50px;
+            text-align: center;
+            padding: 10px 24px;
+            background: var(--k-color-primary-01);
+            border-radius: 45px;
+        }
+    }
+}
+</style>

+ 4 - 0
src/routes/indexV2.js

@@ -31,6 +31,10 @@ export const routes = [
         path: '/parkingInvoiceImage',
         name: 'parkingInvoiceImage',
         component: () => import('@/pages/parkingFeeV2/parkingReceipt/parkingInvoiceImage.vue'),
+    },{
+        path: '/parkingInvoiceImages',
+        name: 'parkingInvoiceImages',
+        component: () => import('@/pages/parkingFeeV2/parkingReceipt/parkingInvoiceImages.vue'),
     },{
         path: '/parkingInvoice',
         name: 'parkingInvoice',