new-cashier/jeepay-ui-uapp-agent/pageAccount/takeMoney/components/ConfirmTake.vue

<template>
  <JPopup ref="popup" dir="center" type="center">
    <JMainCard v-if="take.amount">
      <view class="take-header"
        ><image src="/static/iconImg/icon-close-X.svg" mode="scaleToFill" @tap="popup.close()" /> 请输入支付密码
      </view>
      <view class="take-num">
        提现
        <view>￥{{ take.amount }}</view>
      </view>
      <block v-for="(v, i) in takeInfo" :key="i">
        <view class="take-info">
          {{ v.text }}
          <view class="take-value">{{ v.value }}</view>
        </view>
      </block>
      <verificationCodeStyle
        @getInputVerification="getInputVerification"
        :latticeNum="6"
        ciphertextSty="1"
        ref="verCode"
      ></verificationCodeStyle>
    </JMainCard>
  </JPopup>
</template>

<script setup>
import { ref, reactive, onMounted, getCurrentInstance } from "vue"
import { Base64 } from "js-base64"
import { onLoad, onShow } from "@dcloudio/uni-app"
import { $getAmountFee, $getAcountInfo, $putApplition, $statistics, $isSipw } from "@/http/apiManager.js"
import { horn } from "@/hooks/handleMoney"
import JPopup from "@/components/newComponents/JPopup/JPopup"
import JMainCard from "@/components/newComponents/JMainCard/JMainCard"
import JButton from "@/components/newComponents/JButton/JButton"
import verificationCodeStyle from "@/components/verification-code-style2/verification-code-style2"

const take = ref({})
const popup = ref()
const { ctx } = getCurrentInstance()
const takeInfo = reactive([
  {
    text: "提现手续费",
    value: "",
  },
  {
    text: "预计到账",
    value: "",
  },
  {
    text: "提现账户类型",
    value: "",
  },
  {
    text: "提现账户",
    value: "",
  },
])

const settAccountType = reactive({
  BANK_PRIVATE: "对私账户",
  BANK_PUBLIC: "对公账户",
  WX_CASH: "个人微信",
  ALIPAY_CASH: "个人支付宝",
})
const getInputVerification = (val) => {
  if (val.length >= 6) {
    take.value.sipw = Base64.encode(val)
    launchTake()
  }
}
const open = (val) => {
  take.value = val
  takeInfo[2].value = settAccountType[val.settAccountType]
  takeInfo[3].value = account(val.settAccountNo)
  calculationFee()
  popup.value.open()
}
const account = (val) => {
  if (!val) return
  return val.slice(0, 3) + "****" + val.slice(-4)
}
// 计算手续费
function calculationFee() {
  $getAmountFee()
    .then(({ bizData }) => {
      if (bizData.freeLimit !== 0) {
        //如果在额度限度里，手续费为0
        if (take.value.amount <= bizData.freeLimit / 100) {
          takeInfo[0].value = "￥" + 0
        } else {
          console.log(3)
          //如果超过限制额度
          if (bizData.feeType === "FIX") {
            //若是固定额度
            takeInfo[0].value = "￥" + bizData.fixFee / 100
          } else if (bizData.feeType === "SINGLE") {
            //若是费率
            takeInfo[0].value = "￥" + (bizData.feeRate * take.value.amount).toFixed(2)
          } else if (bizData.feeType === "FIXANDRATE") {
            //若是固定+费率
            takeInfo[0].value = "￥" + ((bizData.fixFee / 100) + (bizData.feeRate * take.value.amount)).toFixed(2)
          }
        }
      } else {
        //如果额度为0则计算费率
        if (bizData.feeType === "FIX") {
          takeInfo[0].value = "￥" + bizData.fixFee / 100
        } else if (bizData.feeType === "SINGLE") {
          //若是费率

          takeInfo[0].value = "￥" + (bizData.feeRate * take.value.amount).toFixed(2)
        } else if (bizData.feeType === "FIXANDRATE") {
            //若是固定+费率
            takeInfo[0].value = "￥" + ((bizData.fixFee / 100) + (bizData.feeRate * take.value.amount)).toFixed(2)
          }
      }
      takeInfo[1].value = (take.value.amount - takeInfo[0].value.split("￥")[1]).toFixed(2)
      if (takeInfo[1].value <= 0) {
        uni.showToast({
          title: "提现金额不足",
          icon: "none",
        })
      }
      takeInfo[1].value = "￥" + takeInfo[1].value
    })
    .catch((err) => {
      console.log(err)
    })
}
// 发起提现
const launchTake = () => {
  uni.showLoading({
    title: "提交中",
    mask: true,
  })
  const data = {
    amount: take.value.amount,
    applyRemark: take.value.applyRemark,
    settAccountType: take.value.settAccountType,
    settAccountNo: take.value.settAccountNo,
    settAccountName: take.value.contactName,
    settAccountBank: take.value.settAccountBank,
    settAccountTelphone: take.value.contactTel,
    sipw: take.value.sipw,
    settCertImg: take.value.settCertImg,
    applyRemark: take.value.applyRemark,
    contactName: take.value.contactName,
    contactTel: take.value.contactTel,
  }
  $putApplition(data)
    .then((res) => {
      if (!take.value.rid) {
        uni.navigateBack({
          success: () => {
            uni.showToast({
              title: "提交成功",
              icon: "success",
            })
          },
        })
      } else {
        uni.navigateBack({
          delta: 2,
          success: () => {
            uni.showToast({
              title: "提交成功",
              icon: "success",
            })
          },
        })
      }
      uni.hideLoading()
      popup.value.close()
    })
    .catch(() => {
      ctx.$refs.verCode.cleanVal()
      take.value.sipw = ""
    })
}
defineExpose({ open })
</script>

<style lang="scss" scoped>
.take-header {
  position: relative;
  text-align: center;
  font-size: 30rpx;
  font-weight: 700;
  image {
    position: absolute;
    top: 8rpx;
    left: 0;
    width: 26rpx;
    height: 26rpx;
  }
}
.take-num {
  text-align: center;
  margin-top: 40rpx;
  font-size: 33rpx;
  color: #666;
  view {
    margin-top: 15rpx;
    padding-bottom: 35rpx;
    font-size: 57rpx;
    font-weight: 700;
    color: #000;
    border-bottom: 1rpx solid #e6e6e6;
  }
}
.take-info {
  display: flex;
  justify-content: space-between;
  font-size: 28rpx;
  color: #a6a6a6;
  margin: 20rpx 0;
  .take-value {
    color: #000000;
  }
}
</style>