From 51de9bff3f3456b05354c5c6c1b07bec44dc1f0d Mon Sep 17 00:00:00 2001
From: nimengmeng_1990 <1175001086@qq.com>
Date: Thu, 2 Jan 2020 17:58:11 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8E=BB=E6=8E=89=E6=8A=A5=E9=94=99=EF=BC=8C?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E8=A2=AB=E4=BF=9D=E4=BA=BA=E4=BF=A1=E6=81=AF?=
 =?UTF-8?q?=E8=81=94=E5=8A=A8=EF=BC=8C=E6=B7=BB=E5=8A=A0=E5=B1=95=E7=A4=BA?=
 =?UTF-8?q?=E6=B3=95=E5=AE=9A=E5=8F=97=E7=9B=8A=E4=BA=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/router/ebiz/cardList.js             |  10 --
 src/views/ebiz/cardList/PayResult.vue   | 172 ++++++++++++++++++++++++
 src/views/ebiz/cardList/information.vue |   9 +-
 3 files changed, 177 insertions(+), 14 deletions(-)
 create mode 100644 src/views/ebiz/cardList/PayResult.vue

diff --git a/src/router/ebiz/cardList.js b/src/router/ebiz/cardList.js
index db63ad4e4..d22a6a273 100644
--- a/src/router/ebiz/cardList.js
+++ b/src/router/ebiz/cardList.js
@@ -2,7 +2,6 @@
 const information = () => import('@/views/ebiz/cardList/information')
 const cardTotreasure = () => import('@/views/ebiz/cardList/CardTotreasure')
 const productDetails = () => import('@/views/ebiz/cardList/productDetails')
-const ShowPDF = () => import('@/views/ebiz/cardList/ShowPDF')
 const pay = () => import('@/views/ebiz/cardList/Pay')
 const payResult = () => import('@/views/ebiz/cardList/PayResult')
 const paySuccess = () => import('@/views/ebiz/cardList/PaySuccess')
@@ -35,15 +34,6 @@ export default [
       index: 3
     }
   },
-  {
-    path: '/cardList/ShowPDF',
-    name: 'ShowPDF',
-    component: ShowPDF,
-    meta: {
-      title: '国富健康保终身重大疾病保险条款',
-      index: 3
-    }
-  },
   {
     path: '/cardList/pay',
     name: 'pay',
diff --git a/src/views/ebiz/cardList/PayResult.vue b/src/views/ebiz/cardList/PayResult.vue
new file mode 100644
index 000000000..ffcc0ef6e
--- /dev/null
+++ b/src/views/ebiz/cardList/PayResult.vue
@@ -0,0 +1,172 @@
+<template>
+  <div class="payResult-container" v-if="isReady">
+    <div class="payResult-header flex justify-content-c align-items-c m15 bg-white flex-direction-colunm">
+      <img :src="srcSuccess" class="payResult-img mb15 pt15" v-if="payStatus == '1'" />
+      <img :src="srcPending" class="payResult-img mb15 pt15" v-if="payStatus == '4' || payStatus == '8'" />
+      <img :src="srcFail" class="payResult-img mb15 pt15" v-if="payStatus == '2'" />
+      <h3 v-if="payStatus == '1'" class="mb10">支付成功</h3>
+      <h3 v-if="payStatus == '4'" class="mb10">支付中...</h3>
+      <h3 v-if="payStatus == '2'" class="mb10">支付失败</h3>
+      <span v-if="payStatus == '4'" class="pb10">银行扣款中，请稍后查询</span>
+      <span v-if="payStatus == '8'" class="pb10">线下批扣中……</span>
+      <!-- <span v-if="payStatus == '8'">{{ resMessage }}</span> -->
+    </div>
+
+    <van-cell-group>
+      <van-cell title="付款人" :value="payInfo.appntName" v-if="payInfo.appntName != ''" />
+      <van-cell title="投保单号" :value="payInfo.prtNo" />
+      <van-cell title="支付金额" :value="`${payInfo.amnt}元` | moneyFormat" v-if="payInfo.amnt != ''" />
+    </van-cell-group>
+    <!-- <div v-if="payStatus != '2' && payStatus != '1'" class=" p10 pb250  bg-white">
+      <span class="pt150 fs14"> 如有相关问题，请联系信息技术部运维人员</span>
+    </div> -->
+    <div v-if="payStatus == '1'" class=" p10 pb250  bg-white">
+      <span class="pt150 fs14"> 核心承保中，请您稍后查看</span>
+    </div>
+    <div v-if="payStatus == '2' || payStatus == '4' || payStatus == '8'" class=" p10 pb250  bg-white">
+      <span v-html="resMessage"></span>
+    </div>
+    <!-- <div class=" p10 pb250  bg-white">
+      <span v-html="resMessage"></span>
+    </div> -->
+
+    <div class="bottom-btn bg-white" v-if="payStatus == '1' || payStatus == '4' || payStatus == '8'">
+      <van-button type="danger" size="large" @click="next" v-no-more-click="1000">返回列表页</van-button>
+    </div>
+    <div class="bottom-area bottom-btn flex" v-if="payStatus == '2'">
+      <van-button class="m-btn w250" type="danger" size="normal" @click="rePayMent">重新支付</van-button>
+      <van-button class="m-btn w250" type="danger" size="normal" @click="next">返回列表页</van-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import { Cell, CellGroup } from 'vant'
+import { getPayState } from '@/api/ebiz/sale/sale'
+export default {
+  data() {
+    return {
+      // 保融收银台返回的支付流水号
+      paySeqNo: '',
+      // 接口返回数据前，不做页面渲染
+      isReady: false,
+      // 是否已重新获取支付状态。（首次进入本页，立即查询支付结果。如果是‘支付中’，两秒后再次（最后一次）再次获取一次支付状态。）
+      isReloaded: false,
+      // 结果原因
+      resMessage: '',
+      // 支付结果
+      payStatus: '',
+      // 支付信息
+      payInfo: {
+        appntName: '', // 投保人
+        prtNo: '', // 投保单号
+        amnt: '' // 支付金额
+      },
+      // 图片
+      srcSuccess: this.$assetsUrl + 'images/success.png',
+      srcPending: this.$assetsUrl + 'images/pending.png',
+      srcFail: this.$assetsUrl + 'images/fail.png'
+    }
+  },
+  components: {
+    [Cell.name]: Cell,
+    [CellGroup.name]: CellGroup
+  },
+  methods: {
+    // 返回列表页
+    next() {
+      this.$jump({
+        flag: 'h5',
+        extra: {
+          url: location.origin + '/#/cardList/cardTotreasure'
+        },
+
+        routerInfo: {
+          path: '/cardList/cardTotreasure'
+        }
+      })
+    },
+    // 查询支付状态
+    queryPayState() {
+      this.$toast.clear()
+      this.$toast.loading({
+        duration: 0, // 持续展示 toast
+        forbidClick: true, // 禁用背景点击
+        loadingType: 'spinner',
+        message: '加载中……'
+      })
+      let data = { orderNo: this.paySeqNo }
+      getPayState(data).then(res => {
+        this.$toast.clear()
+        this.isReady = true
+        console.log('----支付结果查询', JSON.stringify(res))
+        if (res.result == '0') {
+          this.payStatus = res.payStatus
+          this.payInfo = { appntName: res.appntName, prtNo: res.prtNo, amnt: res.amnt }
+
+          // 如果是支付中，2秒后，重新获取一次支付状态
+          if (this.payStatus == '4' && !this.isReloaded) {
+            this.isReloaded = true
+            setTimeout(() => {
+              this.queryPayState()
+            }, 2000)
+          }
+        } else {
+          this.$toast(res.resultMessage)
+        }
+      })
+    },
+    // // 重新支付
+    // rePayMent() {
+    //   //  localStorage.orderNo = order.orderInfoDTO.orderNo
+    //   // 再次支付 salelist为 0
+    //   localStorage.salelist = '0'
+    //   this.$jump({
+    //     flag: 'h5',
+    //     extra: {
+    //       url: location.origin + '/#/sale/payMent'
+    //     },
+    //     routerInfo: {
+    //       path: '/sale/payMent'
+    //     }
+    //   })
+    // }
+  },
+  mounted() {
+    let that = this
+    // document.body.style.backgroundColor = '#fff'
+    that.payStatus = window.localStorage.getItem('payStatus')
+    that.payInfo = JSON.parse(window.localStorage.getItem('payInfo'))
+    if (window.localStorage.getItem('resMessage') != null) {
+      that.resMessage = window.localStorage.getItem('resMessage').replace(/\\n/g, '<br>')
+    }
+
+    this.paySeqNo = this.$route.query.RdSeq
+    if (!this.paySeqNo) {
+      this.$toast({ message: '参数错误，缺少支付流水号‘RdSeq’查询参数', duration: 5000 })
+    } else {
+      this.queryPayState()
+    }
+  },
+  beforeRouteLeave(to, from, next) {
+    document.body.style.backgroundColor = ''
+    next()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.payResult-container {
+  .payResult-header {
+    width: 345px;
+    // height: 143px;
+    .payResult-img {
+      width: 70px;
+      height: 70px;
+    }
+  }
+}
+// /deep/ .van-cell__value {
+//   text-align: left;
+// }
+</style>
diff --git a/src/views/ebiz/cardList/information.vue b/src/views/ebiz/cardList/information.vue
index 2e4cd59f8..b94cfb82e 100644
--- a/src/views/ebiz/cardList/information.vue
+++ b/src/views/ebiz/cardList/information.vue
@@ -109,14 +109,14 @@
         @click="toSelect('11')"
       />
       
-      <van-field v-model="insuredInfo.idNo" maxlength="18" required label="证件号码" v-validate="'required'" name="证件号码" placeholder="请输入" clearable >
+      <van-field v-model="insuredInfo.idNo" maxlength="18" required label="证件号码" v-validate="'required'" name="证件号码" placeholder="请输入" clearable @blur="getRelatedData(insuredInfo.idNo,'2')" >
         <van-button v-if="insuredInfo.idType == 1" slot="button" size="small" type="danger" round @click="selectClick('3')">证件扫描</van-button>
       </van-field>
       </van-cell-group>
     <!-- 受益人信息 -->
     <van-cell-group class="mt10">
       <p style="border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">受益人信息</p>
-        <van-field required v-model="userInfo.bnfType" clearable label="受益人类型"   v-validate="'required'"  style="border-bottom: 1px solid #ebedf0;"/>
+        <van-field required v-model="bnfTypeVal" clearable label="受益人类型"   v-validate="'required'"  style="border-bottom: 1px solid #ebedf0;"/>
       </van-cell-group>
       <p style="background:white;border-bottom: 1px solid #ebedf0" class="fs15 fwb pl10 pv12">产品信息</p> 
     <FieldDatePicter
@@ -240,6 +240,7 @@ export default {
       columns: [],
       valueKey: 'text',
       homeName: '', //家庭地址
+      bnfTypeVal:'法定受益人', //受益人类型文字展示
       //投保人信息
       userInfo: {
         name: '', //投保人姓名
@@ -556,7 +557,7 @@ export default {
         // 计算年龄
         // let age = utilsAge.getAge(this.userInfo.birthday, new Date())
 
-        this.getRelatedData(this.userInfo.idNo)
+        this.getRelatedData(this.userInfo.idNo,'1')
       } else if (data[0][1] == '1') {
         let { customerName, customerSex } = data[0][0]
         this.insuredInfo.name = customerName //用户名
@@ -572,7 +573,7 @@ export default {
         // 计算年龄
         // let age = utilsAge.getAge(this.userInfo.birthday, new Date())
 
-        this.getRelatedData(this.insuredInfo.idNo)
+        this.getRelatedData(this.insuredInfo.idNo,'2')
       }
       // console.log(data, val)
     },