feature GFRS-3716 支付结果页面调整页面布局样式

src/views/ebiz/sale/PayMent.vue

@@ -98,6 +98,7 @@ import { Cell, CellGroup, RadioGroup, Radio, Dialog } from 'vant'
 import { acceptInsurance, getBankCardSignState,payFlag, underWrite, getOrderDetail,signConfirm} from '@/api/ebiz/sale/sale'
 import Loading from '@/components/ebiz/Loading'
 import config from '@/config'
+import { wxShare } from '@/api/ebiz/common/common.js'
 export default {
   data() {
     let isWeixin = this.$utils.device().isWeixin //判断环境
@@ -202,6 +203,25 @@ export default {
     }
   },
   methods: {
+    getOpenid(){
+      wxShare({ url: location.href }).then(response => {
+        if (response.result == '0') {
+          let orderNo = this.$route.query.orderNo
+          let code = this.getUrlParam('code')
+          if(!code){
+            window.location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + response.content.appid + '&redirect_uri=' + encodeURIComponent(location.href + '?orderNo=' + orderNo) + '&response_type=code&scope=snsapi_base&state=1#wechat_redirect'
+          }else{
+            window.location.href = 'https://api.weixin.qq.com/sns/oauth2/access_token?appid=' + response.content.appid + '&secret=' + response.content.appsecret + '&code=' + code + '&grant_type=authorization_code'
+          }
+        }
+      })
+    },
+    // 获取地址上的参数
+    getUrlParam(name) {
+      var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
+      var r = window.location.search.substr(1).match(reg);
+      if (r != null) return unescape(r[2]); return null;
+    },
     async payMentWx(orderNo){
       const res = await payFlag({ orderNo: orderNo })
       console.dir(res)
@@ -225,6 +245,9 @@ export default {
         orderNo: this.orderNo,
         payType: this.radio
       }
+      if(that.isWeixin){
+        data.payType = 'WXJSAPI'
+      }
       acceptInsurance(data).then(res => {
         console.log('----取支付参数结果：', JSON.stringify(res))
         // res = {'result':'0','resultMessage':'','content':null,'prtNo':'8186270000000008','payStatus':'4','amnt':'63700.00','appntName':'投保人','message':null,'brPayReturnData':{'result':'','resultMessage':'','content':null,'businessId':'1569125393518','businessNo':'8186270000000008','tradeSubType':'COMM','businessType':'SALE','systemType':'GF','money':63700,'businessSubType':'XDCB','thirdType':'0002','thirdName':null,'bankCode':'ABC','epayOrderNo':'1909221209536259999900','companyAccount':null,'tradeState':'TRADING','standardCode':'DEALING','standardMsg':null,'thirdOrderNo':null,'respRemark':null,'tradeTime':'2019-09-22T04:09:53.518+0000','description':'','version':'1','sourceNotecode':'8186270000000008','payType':'MIT01','expireDate':'20191010101010','transSeq':'20190922120953782','transSource':'MIT','applyEntity':'11860000','paymentCode':'8186270000000008','transDate':'20190922','rdSeq':'1909221209536259999900','settleMode':null,'cur':'CNY','transTime':'120953','ourAmount':63700,'fixUser':'1','insurer':'投保人','certType':'0','certNum':'110101199009210011','oppBank':'ABC','oppAct':'6228481200290317812','oppActName':'投保人','cellPhone':null,'purpose':null,'memo':null,'returnURL':'http://139.199.50.151/#/sale/payResult','notifyURL':'http://139.199.50.151:7000/api/v1/epay/epay/payResult','s3Sign':'e3f0581ec6b751337e8eca360a0746bc'}}
@@ -432,7 +455,7 @@ export default {
           flag: 'share',
           extra: {
             title: `国富人寿电子投保单（${shareName}）付款`,
-            content: '付款进行',
+            content: '投保单号：'+ localStorage.orderNo + '\n' + '支付金额：' + this.underWriteData.orderAmount + '元',
             url: location.origin + '/#/sale/payMent?orderNo=' + localStorage.orderNo + '&token=' + localStorage.token,
             img: this.$assetsUrl + 'images/logo.png'
           }

src/views/ebiz/sale/PayResult.vue

@@ -21,13 +21,21 @@
     <!-- <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">
+    <!--    <div v-if="payStatus == '1'" class=" p10 pb250  bg-white">-->
-      <span class="pt150 fs14"> 核心承保中，请您稍后查看</span>
+    <!--      <span class="pt150 fs14"> 核心承保中，请您稍后查看</span>-->
-      <div class="mt15" v-if="this.manageComCode == '45'">
+    <!--      <div class="mt15" v-if="this.manageComCode == '45'">-->
-        <span class="pt150 fs14 green fwb">
+    <!--        <span class="pt150 fs14 green fwb">-->
-          温馨提示：为维护您的合法权益，广西保险行业协会将向您发送满意度调查短信，欢迎回复短信对我们的销售和服务进行监督。
+    <!--          温馨提示：为维护您的合法权益，广西保险行业协会将向您发送满意度调查短信，欢迎回复短信对我们的销售和服务进行监督。-->
-        </span>
+    <!--        </span>-->
+    <!--      </div>-->
+    <!--    </div>-->
+    <div v-if="payStatus == '1'" class="p10 pb250  bg-white" style="text-align: center;padding-top: 50px!important;">
+      <p style="text-align: center;font-weight: bold;">温馨提示</p>
+      <p style="text-align: center;">您可识别下方官方微信"国富人寿"二维码关注工号，查询您的保单信息和服务</p>
+      <div style="padding: 20px;">
+        <img :src="erweima" style="width: 60vw;"/>
       </div>
+      <p style="text-align: center;font-weight: bold;">长按识别二维码</p>
     </div>
     <div v-if="payStatus == '2' || payStatus == '4' || payStatus == '8'" class=" p10 pb250  bg-white">
       <span v-html="resMessage"></span>
@@ -51,161 +59,161 @@
 </template>
 
 <script>
-import { Cell, CellGroup } from 'vant'
+  import { Cell, CellGroup } from 'vant'
-import { getPayState } from '@/api/ebiz/sale/sale'
+  import { getPayState } from '@/api/ebiz/sale/sale'
-import riskRules from '@/views/ebiz/common/risk-rules'
+  import riskRules from '@/views/ebiz/common/risk-rules'
-
+  export default {
-export default {
+    data() {
-  data() {
+      let isWeixin = this.$utils.device().isWeixin //判断环境
-    let isWeixin = this.$utils.device().isWeixin //判断环境
+      return {
-    return {
+        isWeixin,
-      isWeixin,
+        // 保融收银台返回的支付流水号
-      // 保融收银台返回的支付流水号
+        paySeqNo: '',
-      paySeqNo: '',
+        // 接口返回数据前，不做页面渲染
-      // 接口返回数据前，不做页面渲染
+        isReady: true,
-      isReady: true,
+        // 是否已重新获取支付状态。（首次进入本页，立即查询支付结果。如果是‘支付中’，两秒后再次（最后一次）再次获取一次支付状态。）
-      // 是否已重新获取支付状态。（首次进入本页，立即查询支付结果。如果是‘支付中’，两秒后再次（最后一次）再次获取一次支付状态。）
+        isReloaded: false,
-      isReloaded: false,
+        // 结果原因
-      // 结果原因
+        resMessage: '',
-      resMessage: '',
+        // 支付结果
-      // 支付结果
+        payStatus: '',
-      payStatus: '',
+        // 支付信息
-      // 支付信息
+        payInfo: {
-      payInfo: {
+          appntName: '', // 投保人
-        appntName: '', // 投保人
+          prtNo: '', // 投保单号
-        prtNo: '', // 投保单号
+          amnt: '' // 支付金额
-        amnt: '' // 支付金额
+        },
+        // 图片
+        srcSuccess: this.$assetsUrl + 'images/success.png',
+        srcPending: this.$assetsUrl + 'images/pending.png',
+        srcFail: this.$assetsUrl + 'images/fail.png',
+        erweima: this.$assetsUrl + 'images/share.jpg',
+        manageComCode:''//代理人管理机构 52贵州 45广西
+      }
+    },
+    components: {
+      [Cell.name]: Cell,
+      [CellGroup.name]: CellGroup
+    },
+    methods: {
+      // 返回列表页
+      next() {
+        if(this.isWeixin){
+          WeixinJSBridge.call("closeWindow");
+        }else{
+          this.$jump({
+            flag: 'h5',
+            extra: {
+              url: location.origin + '/#/sale/list'
+            },
+            routerInfo: {
+              path: '/sale/list'
+            }
+          })
+        }
       },
-      // 图片
+      // 查询支付状态
-      srcSuccess: this.$assetsUrl + 'images/success.png',
+      queryPayState() {
-      srcPending: this.$assetsUrl + 'images/pending.png',
+        this.$toast.clear()
-      srcFail: this.$assetsUrl + 'images/fail.png',
+        this.$toast.loading({
-      manageComCode:''//代理人管理机构 52贵州 45广西
+          duration: 0, // 持续展示 toast
-    }
+          forbidClick: true, // 禁用背景点击
-  },
+          loadingType: 'spinner',
-  components: {
+          message: '加载中……'
-    [Cell.name]: Cell,
+        })
-    [CellGroup.name]: CellGroup
+        let data = { orderNo: this.paySeqNo }
-  },
+        getPayState(data).then(res => {
-  methods: {
+          this.$toast.clear()
-    // 返回列表页
+          this.isReady = true
-    next() {
+          console.log('----支付结果查询', JSON.stringify(res))
-      if(this.isWeixin){
+          if (res.result == '0') {
-        WeixinJSBridge.call("closeWindow");
+            this.payStatus = res.payStatus
-      }else{
+            this.payInfo = { appntName: res.appntName, prtNo: res.prtNo, amnt: res.amnt }
+            this.resMessage = res.message
+            // 如果是支付中，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/list'
+            url: location.origin + '/#/sale/payMent'
           },
           routerInfo: {
-            path: '/sale/list'
+            path: '/sale/payMent'
+          }
+        })
+      },
+      //更换卡号
+      changeCard() {
+        localStorage.setItem('changeCard', true)
+        this.$jump({
+          flag: 'h5',
+          extra: {
+            url: location.origin + '/#/sale/AccountInformation'
+          },
+          routerInfo: {
+            path: '/sale/AccountInformation'
           }
         })
       }
     },
-    // 查询支付状态
+    created() {
-    queryPayState() {
+      EWebBridge.webCallAppInJs('webview_left_button', {
-      this.$toast.clear()
+        intercept: '1' //是否拦截原生返回事件 1是 其他否
-      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 }
-          this.resMessage = res.message
-          // 如果是支付中，2秒后，重新获取一次支付状态
-          if (this.payStatus == '4' && !this.isReloaded) {
-            this.isReloaded = true
-            setTimeout(() => {
-              this.queryPayState()
-            }, 2000)
-          }
-        } else {
-          this.$toast(res.resultMessage)
-        }
       })
     },
-    // 重新支付
+    async mounted() {
-    rePayMent() {
+      let that = this
-      //  localStorage.orderNo = order.orderInfoDTO.orderNo
+      // document.body.style.backgroundColor = '#fff'
-      // 再次支付 salelist为 0
+      that.payStatus = window.localStorage.getItem('payStatus')
-      localStorage.salelist = '0'
+      that.payInfo = JSON.parse(window.localStorage.getItem('payInfo'))
-      this.$jump({
+      if (window.localStorage.getItem('resMessage') != null) {
-        flag: 'h5',
+        that.resMessage = window.localStorage.getItem('resMessage').replace(/\\n/g, '<br>')
-        extra: {
+      }
-          url: location.origin + '/#/sale/payMent'
-        },
-        routerInfo: {
-          path: '/sale/payMent'
-        }
-      })
-    },
-    //更换卡号
-    changeCard() {
-      localStorage.setItem('changeCard', true)
-      this.$jump({
-        flag: 'h5',
-        extra: {
-          url: location.origin + '/#/sale/AccountInformation'
-        },
-        routerInfo: {
-          path: '/sale/AccountInformation'
-        }
-      })
-    }
-  },
-  created() {
-    EWebBridge.webCallAppInJs('webview_left_button', {
-      intercept: '1' //是否拦截原生返回事件 1是 其他否
-    })
-  },
-  async 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
+      this.paySeqNo = this.$route.query.RdSeq
-    if (!this.paySeqNo) {
+      if (!this.paySeqNo) {
-      this.$toast({ message: '参数错误，缺少支付流水号‘RdSeq’查询参数', duration: 5000 })
+        this.$toast({ message: '参数错误，缺少支付流水号‘RdSeq’查询参数', duration: 5000 })
-    } else {
+      } else {
-      this.queryPayState()
+        this.queryPayState()
+      }
+      //获取代理人管理机构 52贵州 45广西
+      let dataReturn = await riskRules.getAgentInfoFunc(this)
+      this.manageComCode = dataReturn.manageComCode
+    },
+    beforeRouteLeave(to, from, next) {
+      document.body.style.backgroundColor = ''
+      next()
     }
-    //获取代理人管理机构 52贵州 45广西
-    let dataReturn = await riskRules.getAgentInfoFunc(this)
-    this.manageComCode = dataReturn.manageComCode
-  },
-  beforeRouteLeave(to, from, next) {
-    document.body.style.backgroundColor = ''
-    next()
   }
-}
 </script>
 
 <style lang="scss" scoped>
-.payResult-container {
+  .payResult-container {
-  .payResult-header {
+    .payResult-header {
-    width: 345px;
+      width: 345px;
-    // height: 143px;
+      // height: 143px;
-    .payResult-img {
+      .payResult-img {
-      width: 70px;
+        width: 70px;
-      height: 70px;
+        height: 70px;
+      }
     }
   }
-}
+  // /deep/ .van-cell__value {
-// /deep/ .van-cell__value {
+  //   text-align: left;
-//   text-align: left;
+  // }
-// }
 </style>