<template>
  <div class="pay">
    <div class="img">
      <div>
        <image class="img-item" src="https://image.jxc4.com/image/52c3aa456a0efb198ef46aa26a935f0d.png" alt="" />
      </div>
      <div class="title">
        <div>京西菜市</div>
        <div v-if="payInfor.name" class="title-storeName">({{ payInfor.name }})</div>
      </div>
    </div>
    <div class="input-box">消费金额:<input class="input" type="text" :disabled="true" v-model="consumeFeeValue" />￥</div>

    <!-- 立即支付 -->
    <div v-if="payInfor.origin" class="jxPaybut" @click="surePay">立即支付</div>

    <!-- 返回app -->
    <button v-if="payInfor.origin"  open-type="launchApp"  class="backApp"  @launchapp="backApp"  :app-parameter="payInfor.storeID">返回app</button>

    <!-- 键盘 -->
    <div class="key-board" v-else>
      <div class="key">
        <div class="key-num">
          <div class="key-num-text" hover-class="bg_red" @click="clickNum(1)">1</div>
          <div class="key-num-text" hover-class="bg_red" @click="clickNum(2)">2</div>
          <div class="key-num-text" hover-class="bg_red" @click="clickNum(3)">3</div>
        </div>
        <div class="key-num">
          <div class="key-num-text" hover-class="bg_red" @click="clickNum(4)">4</div>
          <div class="key-num-text" hover-class="bg_red" @click="clickNum(5)">5</div>
          <div class="key-num-text" hover-class="bg_red" @click="clickNum(6)">6</div>
        </div>
        <div class="key-num">
          <div class="key-num-text" hover-class="bg_red" @click="clickNum(7)">7</div>
          <div class="key-num-text" hover-class="bg_red" @click="clickNum(8)">8</div>
          <div class="key-num-text" hover-class="bg_red" @click="clickNum(9)">9</div>
        </div>
        <div class="key-num">
          <div class="zero" hover-class="bg_red" @click="clickNum(0)">0</div>
          <div class="point" hover-class="bg_red" @click="clickNum('.')">.</div>
        </div>
      </div>
      <div class="key-text">
        <div class="del" @click="clickNum('del')" hover-class="bg_red">
        </div>
        <div class="sure-pay" @click="surePay">
          <div class="sure-pay-text" >确认支付</div>
        </div>
      </div>

    </div>
  </div>
</template>

<script>
import { toast,jumpPage } from '@/utils/uniapi.js'
import { mapGetters } from "vuex";
// import { Pay4StoreMyselfDeliverOrder } from '@/apis/APIJxpay.js'
import orderPage from '@/apis/orderPage'
import { handleCreatePay } from '@/utils/uniapi.js'
import {store} from '@/store'
export default {
  data() {
    return {
      consumeFeeValue:'',
      avatar: 'https://image.jxc4.com/image/52c3aa456a0efb198ef46aa26a935f0d.png?imageView2/1/w/40/h/40',
      payInfor: {},
      isScan:false,
      dns:''
    }
  },
  async onLoad(query) {
    if (query.jxParams) {
      this.payInfor = JSON.parse(query.jxParams)
      this.consumeFeeValue = this.payInfor.totalPrice / 100
    }
    if(query.orderID && query.dns){
      // query.dns = 'wxC4'
      // 查询订单号
      store.commit('indexPage/changeDNS',query.dns)    // 更换域名 默认为菜市
      let orderInfo = await orderPage.getOrderInfo({vendorOrderID:query.orderID},query.dns)
      if(orderInfo.totalCount) {
        this.payInfor = orderInfo.data[0]
        this.consumeFeeValue = orderInfo.data[0].actualPayPrice / 100
        this.isScan = true
        this.dns = query.dns
      }
      // 88485711355641
      // console.log('111111111,,query',query)
      this.surePay()
    }
  },
  computed: {
    ...mapGetters({
      isLogin: "login/isLogin"
    }),
  },
  methods: {
    // 返回app
    backApp(e) {
      uni.reLaunch({
        url: '/pages/index/index'
      });
    },
    // 数字按钮
    clickNum(str) {
      if (!this.isLogin) {
        toast('请登录')
        jumpPage('navigateTo','/pagesAuth/auth-index/index?type=jxPay')
        return
      }
      if(str!=='del'){
        if((this.consumeFeeValue.indexOf('.') !== -1 && str === '.') || (this.consumeFeeValue.length === 0 && str === '.')) return 
        if(this.consumeFeeValue.length === 1 && this.consumeFeeValue === '0') {
          if(str!=='.') {
            toast('输入错误')
            return
          }
        }
        if(this.consumeFeeValue.includes('.')){
          if(this.consumeFeeValue.split('.')[1].length>=2) return
          this.consumeFeeValue = this.consumeFeeValue + str
        }else{
          this.consumeFeeValue = this.consumeFeeValue + str
        }
      }else{
        // 退格
        if(this.consumeFeeValue.length === 0) return
        this.consumeFeeValue = this.consumeFeeValue.substring(0,this.consumeFeeValue.length-1)
      }
    },
    // 确认支付
    async surePay() {
      if(this.isScan){
        // 扫码支付订单
        if (!this.isLogin) {
          toast('请登录')
          // jumpPage('navigateTo','/pagesAuth/auth-index/index?type=jxPay')
          jumpPage('navigateTo',`/pagesAuth/auth-index/index?dns=${this.dns}&orderID=${this.payInfor.vendorOrderID}&type=jxPay`)
          return
        }

        let res = await orderPage.pay4Order({
            vendorOrderID: this.payInfor.vendorOrderID,
            payType: 2,
            vendorPayType: 'W06',
            subAppID: "wx4b5930c13f8b1170",
          },this.dns);
          await handleCreatePay(
            res.vendorOrderID,
            res.prepayID,
            JSON.parse(res.codeURL)
          );
          toast('交易成功')  

          let obj = {vendorOrderID:this.payInfor.vendorOrderID,vendorID:this.payInfor.vendorID}
          await orderPage.finishedPickup(obj,this.dns) // 拣货完成
          await orderPage.selfDelivered(obj,this.dns) // 订单已送达
          // 修改备注休息，在退款时，以作区分
          await orderPage.updateOrderInfo({
                   ...obj,
                    payload: JSON.stringify({
                        buyerComment: '支付方式：qrCode'
                    }),
                },this.dns)

          this.isScan = false // 清除扫码记录的信息
          store.commit('indexPage/changeDNS','wxC4')    // 更换域名 默认为菜市
      }else{
        if (this.payInfor.origin) {
        // app跳转京西订单支付
          if (!this.isLogin) {
            toast('请登录')
            // jumpPage('navigateTo','/pagesAuth/auth-index/index?type=jxPay')
            jumpPage('navigateTo',`/pagesAuth/auth-index/index?type=jxPay&payInfor=${JSON.stringify(this.payInfor)}`)
            return
          }

          let res = await orderPage.pay4Order({
            vendorOrderID: this.payInfor.vendorOrderID,
            payType: 2,
            vendorPayType: 'W06',
            subAppID: "wx4b5930c13f8b1170",
          });
          await handleCreatePay(
            res.vendorOrderID,
            res.prepayID,
            JSON.parse(res.codeURL)
          );
        } else {
          if(this.consumeFeeValue.length === 0){
            toast('请输入支付金额')
          }else{
            if(this.consumeFeeValue.indexOf('.') !== -1) {
              if (this.consumeFeeValue.split('.')[1].replace(/(0+)$/g, "")) {
                this.consumeFeeValue = this.consumeFeeValue.split('.')[0] + '.' + this.consumeFeeValue.split('.')[1].replace(/(0+)$/g,"")
              } else {
                this.consumeFeeValue = this.consumeFeeValue.split('.')[0]
              }
            }
            let payInfo = await orderPage.pay4StoreMyselfDeliverOrder({
              subAppID: 'wx4b5930c13f8b1170',
              payType: 2,
              payMoney: Number(this.consumeFeeValue*100),
              vendorPayType: 'W06',
              storeId:668470
            })
            await handleCreatePay(payInfo.vendorOrderID, payInfo.prepayID, JSON.parse(payInfo.codeURL))
            toast('支付成功')
          }
        }
      }
     
    }
  },
}
</script>

<style lang="scss" scoped>
page {
  width: 100%;
  height: 100%;
}
@import './JX-pay.scss'
</style>