feat: 小猪优选极速版提交

lin

2026-04-17 8eb6cb869fb69888abc8f99d3b1fad4fbddcdace

 pages/quanyi/components/code/set.vue

New file
@@ -0,0 +1,323 @@
<script>
import {
  payBindCardToCodes,
  payVerifySMSCodes,
  xinheyuanBankcardSave,
} from "@/api/modules/user";
export default {
  props: {
    bankDetail: {
      type: Object,
      default() {
        return {};
      },
    },
    queryBind: {
      type: Object,
      default() {
        return {};
      },
    },
  },
  computed: {
    customStyle() {
      return {
        height: "100rpx",
        background: "#EE2626",
        color: "#fff",
        borderRadius: "50rpx",
        fontSize: "34rpx",
      };
    },
    inputStyle() {
      return {
        fontWeight: "400",
        fontSize: "30rpx",
      };
    },
  },

  created() {
    this.detail = this.bankDetail;
    this.detail.verificationCode = "";
    this.detail.bankName = this.queryBind.bankName;
    this.detail.bankId = this.queryBind.cardNumber;
    this.detail.bankPhoneNo = this.queryBind.cardPhone;
  },

  data() {
    return {
      lstyle: {
        color: "#333333",
        fontSize: "30rpx",
        fontWeight: "bold",
      },

      isCounting: false,
      countText: "",
      detail: {
        bankName: "",
        verificationCode: "",
      },
      bankList: [],
      bankCode: "",
      callbackData: "",
    };
  },
  methods: {

    submitPlan() {
      const _this = this;
      const pro = uni.getStorageSync("params");

      if (!this.detail.bankPhoneNo) {
        uni.showToast({
          title: "请输入手机号",
          icon: "none",
        });
        return;
      }
      if (!this.detail.verificationCode) {
        uni.showToast({
          title: "请输入验证码",
          icon: "none",
        });
        return;
      }

      const callbackData = uni.getStorageSync("callbackData");
      const paymentMethod = uni.getStorageSync("payBindCardInf")[2]['paymentMethod'];
      payVerifySMSCodes({
        ...callbackData,
        customerId: pro.customerId,
        cardName: uni.getStorageSync("userName"), // 真实姓名
        bankName: _this.detail.bankName,
        cardIdNo: uni.getStorageSync("idCardNo"),

        cardPhone: _this.detail.bankPhoneNo,
        paymentMethod:paymentMethod,
        cardNumber: _this.detail.bankId,
        verificationCode: _this.detail.verificationCode, //短信
      }).then((res) => {
        if(res){
          this.$emit("submit", this.detail);
        }
      });
    },
    off() {
      this.$emit("off");
    },
    getCode() {
      if (this.isCounting) {
        return;
      }
      const paymentMethod = uni.getStorageSync("payBindCardInf")[2]['paymentMethod'];
      const _this = this;
      const pro = uni.getStorageSync("params");
      xinheyuanBankcardSave({
        customerId: pro.customerId,
        nameReal: uni.getStorageSync("userName"),
        cardNo: _this.detail.bankId,
        idCard: uni.getStorageSync("idCardNo"),
        bankId: "1",
        bankPhoneNo: _this.detail.bankPhoneNo,
        bankCode: _this.bankCode,
        bankName: _this.detail.bankName,
        phone: _this.detail.bankPhoneNo,
        preBindType: "prebc",
      }).then((res) => {
        payBindCardToCodes({
          cardIdNo: uni.getStorageSync("idCardNo"),
          customerId: pro.customerId,
          cardName: uni.getStorageSync("userName"),
          cardNo: _this.detail.bankId,
          cardPhone: _this.detail.bankPhoneNo,
          cardNumber: _this.detail.bankId,
          bankName: _this.detail.bankName,
          preBindType: "prebc",
          paymentMethod:paymentMethod,
          againType : true
        }).then((res) => {
          if(!res){
            return
          }
          _this.callbackData = res;
          uni.setStorageSync("callbackData", res);

          uni.showToast({
            title: "验证码已发送",
            icon: "none",
          });
          uni.setStorageSync("YF", 1);

          // 设置倒计时功能
          let count = 60;
          const timer = setInterval(() => {
            count--;
            if (count <= 0) {
              clearInterval(timer);
              _this.$set(_this, "isCounting", false);
            } else {
              _this.$set(_this, "isCounting", true);
              _this.$set(_this, "countText", `${count}秒后重新获取`);
            }
          }, 1000);
        });
      });
    },
  },
};
</script>

<template>
  <view>
    <view class="head">
      <view
          style="
          text-align: center;
          font-weight: bold;
          font-size: 36rpx;
          position: relative;
          height: 50rpx;
        "
      >

        <image
            @click="off"
            src="@/static/img/close.png"
            style="
            width: 50rpx;
            height: 50rpx;
            position: absolute;
            right: 0;
            top: -2rpx;
          "
        ></image>
      </view>
    </view>
    <view  style="
          font-weight: bold;
          font-size: 36rpx;
          position: relative;
         margin-bottom: 12rpx;
          padding-left: 38rpx;
        ">本人提交确认</view>
    <view style="font-size: 28rpx;color: #252938; padding-left: 38rpx;padding-right: 30rpx;">根据合规要求我们将进行本人提交意愿确认的短信校验，请注意查看短信验证码</view>
    <view class="con">
      <u-form
          :labelStyle="lstyle"
          labelPosition="left"
          :model="detail"
          ref="form"
          labelWidth="100"
      >

        <u-form-item
            class="item"
            label="手机号"
            prop="repayTermStr"
            borderBottom
        >
          <u-input
              :adjustPosition="true"
              maxlength="11"
              :customStyle="inputStyle"
              disabledColor="none"
              inputAlign="right"
              v-model="detail.bankPhoneNo"
              border="none"
              placeholder="请输入手机号"
          ></u-input>
        </u-form-item>

        <u-form-item
            class="item"
            label="短信验证码"
            prop="needVerify"
        >
          <u-input
              :adjustPosition="true"
              maxlength="6"
              inputAlign="right"
              v-model="detail.verificationCode"
              border="none"
              placeholder="请输入验证码"
          >
            <template #suffix>
              <text
                  class="code"
                  :class="isCounting ? 'ks' : ''"
                  @click="getCode"
              >{{ isCounting ? countText : "获取验证码" }}</text
              >
            </template>
          </u-input>
        </u-form-item>
        <u-form-item >
          <view class="but">
            <u-button
                :customStyle="customStyle"
                shape="circle"
                @click="submitPlan"
            >确认提交</u-button
            >
          </view>
        </u-form-item>
      </u-form>
    </view>
  </view>
</template>

<style scoped lang="scss">
.ks {
  color: #999999 !important;
}
.but {
  width: 100%;
  margin-top: 46rpx;
  .pack {
    text-align: center;
    margin-top: 20rpx;
    font-size: 30rpx;
    display: flex;
    flex-direction: row;
    justify-content: center;
  }
}
.head {
  margin-top: 40rpx;
  padding: 0 40rpx;

  font-size: 32rpx;
  color: #252938;
  .title {
    display: flex;
    flex-direction: row;
    text-align: center;
    color: #252938;
    font-size: 32rpx;
    font-weight: bold;
    .num {
      color: #4766fe;
      display: contents;
    }
  }
}

.con {
  padding: 0 38rpx;
  .pt40 {
    padding-top: 40rpx;
  }
  .mr {
    margin-right: 20rpx;
  }
  .code {
    margin-left: 40rpx;
    font-size: 24rpx;
    color: #4766fe;
    background: none;
    border-radius: 8rpx 8rpx 8rpx 8rpx;
  }
}
</style>