lin
2026-04-17 7654d718d458420c7e2d714d2cb40a7a4ffdcc68
pages/quanyi/add.vue
@@ -1,18 +1,23 @@
<script>
import offIcon from '@/static/imgs/icons/off.png'
import leftIcon from  '@/static/imgs/icons/left.png'
import kkIcon from  '@/static/imgs/icons/kk.png'
import addAddress from "./components/addAddress";
import agreement from "./components/agreement";
import offIcon from '@/static/img/off.png'
import leftIcon from  '@/static/img/left.png'
import kkIcon from  '@/static/img/kk.png'
import addAddress from "@/pages/quanyi/components/addAddress";
import agreement from "@/pages/quanyi/components/agreement";
import textBox from "@/components/textBox/index.vue";
export default {
  name: "add",
  components: {
    addAddress,agreement
    addAddress,agreement,textBox
  },
  data() {
    return {
      getPlatformProtocolNewList:[],
      showTextBox: false,
      loginAct: false,
      $webHost:'https://rbb98765.zrgy-bbg.com',
      protocolChecked: [1],
      protocolChecked: [0],
      offIcon,leftIcon,kkIcon,
      callbackData:{},
      addressDetail: {
@@ -74,9 +79,9 @@
    customStyle() {
      return {
        height: "100rpx",
        background: "#FF1472",
        background: "#EE2626",
        color: "#fff",
        borderRadius: "24rpx",
        borderRadius: "50rpx",
        fontSize: "34rpx",
      };
    },
@@ -134,6 +139,34 @@
      }
    })
    uni.request( {
      url: _this.$webHost + "/api/v2/renpin/H5/getPlatformProtocolNew",
      data: {
        customerId: uni.getStorageSync('ygxLogin').customerId,
        appId: uni.getStorageSync('ygxLogin').appId
      },
      method: 'GET',
      success(res) {
        uni.showLoading({})
        _this.getPlatformProtocolNewList = res.data.data;
        _this.showTextBox = true;
        _this.$nextTick(() => {
          if(_this.$refs.textBox){
            uni.hideLoading();
            _this.$refs.textBox.open()
          } else {
            setTimeout(() => {
              console.log('setTimeout');
              uni.hideLoading();
              _this.$refs.textBox && _this.$refs.textBox.open()
            }, 400);
          }
        })
      }
    })
  },
@@ -153,6 +186,7 @@
      const _this = this;
      if(this.addressStr.length < 8){
        uni.showToast({
          title: '请输入详细地址',
          icon: 'none'
@@ -189,13 +223,12 @@
      this.$refs.popup.close()
    },
    open(){
      // 通过组件定义的ref调用uni-popup方法 ,如果传入参数 ,type 属性将失效 ,仅支持 ['top','left','bottom','right','center']
      this.$refs.popup.open()
    },
    validateAndCacheCardInfo() {
      const _this = this;
      if(!_this.cardNumber.length || _this.cardNumber.length<14 ){
        return
      }
@@ -218,27 +251,61 @@
        }
      })
     /* uni.request({
        url: "https://ccdcapi.alipay.com/validateAndCacheCardInfo.json?_input_charset=utf-8&cardBinCheck=true", // 阿里接口
        data: {
          cardNo: _this.cardNumber,
        },
        success: function (res) {
          console.log(res.data.validated);
          if (res.data.validated) {
            for (let i of uni.getStorageSync("bankList")) {
              console.log(i);
              if (res.data.bank === i.bankCode) {
                _this.bankCode = i.bankCode;
                _this.bankName = i.bankName;
                break;
              }
            }
            if(!_this.bankName){
              uni.showToast({
                title: "暂不支持该银行或银行卡号有误",
                icon: "none",
              });
            }
          }
          else {
            uni.showToast({
              title: "暂不支持该银行或银行卡号有误",
              icon: "none",
            });
          }
        },
      });*/
    },
    submit() {
      const _this = this;
      if(!this.protocolChecked[0]){uni.showToast({title: '请阅读并同意相关协议', icon: 'none'});return;}
      if(!_this.cardName){
        uni.showToast({
          title: "请填写您的姓名",
          title: "请填写真实姓名",
          icon: "none",
        });
        return;
      }
      if(!_this.idCardNo){
        uni.showToast({
          title: "请填写您的身份证号",
          title: "请输入身份证号",
          icon: "none",
        });
        return;
      }
      if(!_this.cardNumber){
        uni.showToast({
          title: "请填写银行卡号",
          title: "请输入银行卡号",
          icon: "none",
        });
        return;
@@ -258,10 +325,9 @@
        });
        return
      }
      if(!_this.addressStr){
        uni.showToast({
          title: "请填写您的详细地址",
          title: "请填写详细地址",
          icon: "none",
        });
        return;
@@ -313,10 +379,13 @@
        },
        success(e){
          if(e.data.code!==200){
            uni.showTips({
              title: e.data.data
            });
            // _this.$util.Tips({
            //   title: e.data.data
            // });
         uni.showToast({
           title: e.data.data,
           icon: 'none'
         });
          }
          uni.request({
            url:_this.$webHost+`/api/v2/pay/getPayBindCardInfo/${uni.getStorageSync('ygxLogin').customerId}`,
@@ -373,7 +442,10 @@
          return
        }
        if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.cardPhone)) return uni.showToast({title: '请输入正确的手机号码', icon: 'none'});
        if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.cardPhone)) return uni.showToast({
          title: '请输入正确的手机号码',
          icon: 'none'
        });
        that.isCounting = true;
@@ -593,10 +665,13 @@
          },
          success(dts){
            if(dts.data.code!==200){
              uni.showTips({
                title: dts.data.data
              });
              // _this.$util.Tips({
              //   title: dts.data.data
              // });
           uni.showToast({
             title: dts.data.data,
             icon: 'none'
           });
              return
            }
@@ -727,10 +802,13 @@
          },
          success(dts){
            if(dts.data.code!==200){
              uni.showTitle({
                title: dts.data.data
              });
              // _this.$util.Tips({
              //   title: dts.data.data
              // });
           uni.showToast({
             title: dts.data.data,
             icon: 'none'
           });
            }
            uni.request({
@@ -758,17 +836,17 @@
      getUserInfo() {
        const data =   uni.getStorageSync('LOGING_DATA')
        console.log(data);
        this.$store.commit("LOGIN", {
          'token': data.token
        });
        this.$store.commit('UPDATE_USERINFO', {
          avatar: data.avatar,
          nickname: data.nickname,
          phone: data.phone
        });
        this.$store.commit("SETUID", data.id)
        // const data =   uni.getStorageSync('LOGING_DATA')
        // console.log(data);
        // this.$store.commit("LOGIN", {
        //   'token': data.token
        // });
        // this.$store.commit('UPDATE_USERINFO', {
        //   avatar: data.avatar,
        //   nickname: data.nickname,
        //   phone: data.phone
        // });
        // this.$store.commit("SETUID", data.id)
        uni.reLaunch({
          url: '/pages/index/index'
@@ -782,102 +860,116 @@
</script>
<template>
  <view style="background: #fff;padding-bottom: 20rpx;">
  <view style="background: #F7F7F7;padding-bottom: 40rpx;">
    <view >
      <view class="top">为向您提供更好的安全保障,您需要提供银行卡号以完成信息核验</view>
    </view>
    <view style="background: white;height: 20rpx;"></view>
    <view class="form">
      <view class="clo" style="display: flex;background: white">
      <view class="clo">
        <view class="label">
          <text>真实姓名</text>
        </view>
        <view class="inp_box">
          <input  maxlength="8" style="width: 400rpx;"   v-model="cardName" class="inp" placeholder="请填写您的姓名" />
          <input  maxlength="8"   v-model="cardName" class="inp" placeholder="请填写真实姓名" />
        </view>
      </view>
      <view class="clo" style="display: flex;background: white">
      <view class="clo">
        <view class="label">
          <text>身份证号</text>
        </view>
        <view class="inp_box">
          <input  maxlength="18" style="width: 400rpx;"   v-model="idCardNo" class="inp" placeholder="请填写您的身份证号" />
          <input  maxlength="18"   v-model="idCardNo" class="inp" placeholder="请填写身份证号" />
        </view>
      </view>
<!--      <view style="background: #F7F7F7;height: 20rpx;"></view>-->
      <view class="clo" style="display: flex">
      <view class="clo">
        <view class="label">
          <text>银行卡号</text>
        </view>
        <view class="inp_box">
          <input  maxlength="30" style="width: 400rpx;"   @blur="validateAndCacheCardInfo" v-model="cardNumber" class="inp" placeholder="请填写银行卡号" />
          <image @click="cardNumber=''" v-show="!bindStatus && cardNumber" :src="offIcon" style="width: 40rpx;height: 40rpx;position: absolute;right: -40rpx;top: 0;"></image>
          <input  maxlength="30"  @blur="validateAndCacheCardInfo" v-model="cardNumber" class="inp" placeholder="请输入银行卡号" />
          <image @click="cardNumber=''" v-show="!bindStatus && cardNumber" :src="offIcon" style="width: 40rpx;height: 40rpx;position: absolute;right: 0rpx;top: 30rpx;"></image>
        </view>
      </view>
      <view class="clo" style="display: flex">
      <view class="clo">
        <view class="label">
          <text>所属银行</text>
        </view>
        <view class="inp_box" style="flex: 1;z-index: 1" >
          <view :class="bankName?'':'a3'">{{bankName?bankName:'请输入所属银行'}}</view>
        <view class="inp_box" style="z-index: 1" >
          <view style="width: 670rpx;height: 100rpx;border: 1px solid #EEEEEE;border-radius: 20rpx;padding-left: 20rpx;line-height: 100rpx;" :class="bankName?'':'a3'">{{bankName?bankName:'请输入所属银行'}}</view>
        </view>
      </view>
      <view class="clo" style="display: flex">
      <view class="clo">
        <view class="label">
          <view>手机号码</view>
          <view>银行预留手机号</view>
        </view>
        <view class="inp_box" >
          <input  maxlength="11" v-model="cardPhone"  class="inp" placeholder="请填写银行预留手机号" />
        <view class="inp_box" style="position: relative;">
          <input  maxlength="11" v-model="cardPhone"  class="inp" placeholder="请填写手机号" />
<!--          <view class="code" style="position: absolute;top: 30rpx;right: 0;" @click="getSmsCode">-->
<!--            <text :class="isCounting?'code_k':'code_a'">{{ isCounting ? countText : '获取验证码' }}</text>-->
<!--          </view>-->
        </view>
      </view>
      <view class="clo" style="display: flex" v-if="!getPayBindCardInfo[0].bindStatus">
      <view class="clo" v-if="getPayBindCardInfo.length && !getPayBindCardInfo[0].bindStatus">
        <view class="label">
          <text>验证码</text>
        </view>
        <view class="inp_box" style="display: flex;flex: 1">
          <input  maxlength="6" v-model="verificationCode" class="inp" type="number" style="width: 200rpx" placeholder="请输入验证码" />
        <view class="inp_box" style="position: relative;">
          <input  maxlength="6" v-model="verificationCode" class="inp" type="number" placeholder="请填写验证码" />
          <view class="code" style="flex: 1;text-align: right" @click="getSmsCode">
          <view class="code" style="position: absolute;top: 30rpx;right: 0;" @click="getSmsCode">
            <text :class="isCounting?'code_k':'code_a'">{{ isCounting ? countText : '获取验证码' }}</text>
          </view>
        </view>
      </view>
      <view class="clo" style="display: flex;margin-bottom: 20rpx;" @click="$refs.address.open()">
      <view class="clo" @click="$refs.address.open()">
        <view class="label" >
          <text>收货地址</text>
        </view>
        <view class="inp_box">
          <view style="font-size: 28rpx;" v-if="addressStr">{{addressStr}}</view>
          <view style="font-size: 28rpx;color: #BDBDBE;" v-else>请填写您的详细地址</view>
          <view style="font-size: 28rpx;width: 670rpx;height: 100rpx;border: 1px solid #EEEEEE;border-radius: 20rpx;padding-left: 20rpx;line-height: 100rpx;" v-if="addressStr">{{addressStr}}</view>
          <view style="font-size: 28rpx;color: #BDBDBE;width: 670rpx;height: 100rpx;border: 1px solid #EEEEEE;border-radius: 20rpx;padding-left: 20rpx;line-height: 100rpx;" v-else>请填写收货地址</view>
        </view>
      </view>
    </view>
    <!--    <view class="xieyi">
          <view style="display: flex">
            <checkbox-group @change="checkboxChange">
    <view style=" padding: 0 30rpx;margin-left: 20rpx;">
              <checkbox value="1"   activeBorderColor="none"  activeBackgroundColor="red" style="border-radius: 0"  color="#ffffff"/>
            </checkbox-group>
            <view style="margin-top: 2rpx;"> <text>我已同意</text>
             </view>
          </view>
        </view>-->
    <view style=" padding: 0 30rpx;margin-top: 30rpx;">
      <view style="display: flex;">
        <uv-checkbox-group
            activeColor="#FF1472"
            activeColor="red"
            shape="circle"
            v-model="protocolChecked">
          <uv-checkbox size="14" :name="1" >
          </uv-checkbox>
          <text class="protocol-text" >
            我已阅读并同意<text style="font-size: 24rpx;color: #4766FE" class="link-text"  @click="$refs.agreement.open()">《相关协议》</text>
            我已阅读并同意
            <text style="font-size: 24rpx;" class="link-text"  @click="$refs.agreement.open()">《相关协议》</text>
          </text>
        </uv-checkbox-group>
@@ -904,20 +996,44 @@
    </uni-popup>
    <uv-popup mode="center" round="20" ref="codeUi" :closeOnClickOverlay="false" bgColor="">
    <uv-popup mode="center" round="20" ref="codeUi" :closeOnClickOverlay="false" >
      <view style="padding: 40rpx;width:calc( 100% - 120rpx);margin: auto;border-radius: 40rpx 40rpx 40rpx 40rpx;background-image: url('/static/imgs/codeUiBACK.png');background-repeat: no-repeat;background-size: 100% 100%;padding-top: 60rpx;">
      <view style="padding: 40rpx;width: 690rpx;background: url('/static/img/smsBg.png') no-repeat top center; background-size: 100%;height: 650rpx;">
        <view class="head">
          <view
              style="
          text-align: center;
          font-weight: bold;
          font-size: 36rpx;
          position: relative;
          height: 50rpx;
        "
          >
            <image
                @click="$refs.codeUi.close()"
                src="@/static/img/off.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;
         text-align: center;
        ">短信确认</view>
        <view style="font-size: 28rpx;color: #666666;">为确保安全到账,需再次对您的收款账户进行短信验证</view>
        <view style="font-size: 28rpx;color: #252938;text-align: center;">为确保安全到账,需再次对您的收款账户进行短信验证</view>
        <view class="content" style="margin-top: 40rpx;">
        <view class="content">
          <uv-form
              :labelStyle="lstyle"
              labelPosition="left"
@@ -933,7 +1049,6 @@
            >
              <uv-input
                  shape="circle"
                  :adjustPosition="true"
                  readonly
                  v-model="cardPhone"
@@ -943,10 +1058,9 @@
                  border="none"
                  placeholder="请输入手机号"
                  style="height: 100rpx;border: 1px solid #EEEEEE;border-radius: 30rpx;padding: 0 20rpx;"
              ></uv-input>
            </uv-form-item>
            <view style="height: 20rpx;"></view>
            <uv-form-item
                class="item"
@@ -960,10 +1074,12 @@
                  v-model="verificationCodeT"
                  border="none"
                  placeholder="请输入验证码"
                  style="height: 100rpx;border: 1px solid #EEEEEE;border-radius: 30rpx;padding: 0 20rpx;"
              >
                <template #suffix>
                  <text
                      class="code"
                      style="color: red;"
                      :class="isCounting_A ? 'ks' : ''"
                      @click="getCode"
                  >{{ isCounting_A ? countText_A : "获取验证码" }}</text
@@ -972,40 +1088,57 @@
              </uv-input>
            </uv-form-item>
            <uv-form-item >
              <view class="but" style="width: 100%;margin-top: 20rpx;font-weight: 600;">
              <view class="but" style="width: 100%;">
                <uv-button
                    :customStyle="customStyle"
                    shape="circle"
                    @click="submitPlan"
                >确定</uv-button
                >确认</uv-button
                >
              </view>
            </uv-form-item>
          </uv-form>
        </view>
      </view>
      <view style="text-align: center;margin-top: 40rpx;">
        <image
            @click="$refs.codeUi.close()"
            src="@/static/imgs/closeA.png"
            style="  width: 50rpx; height: 50rpx; "
        ></image>
      </view>
    </uv-popup>
    <uv-popup mode="center" round="20" ref="setUi" :closeOnClickOverlay="false"  bgColor="" z-index="999">
    <uv-popup mode="center" round="20" ref="setUi" :closeOnClickOverlay="false" >
      <view style="padding: 40rpx;width:calc( 100% - 120rpx);margin: auto;border-radius: 40rpx 40rpx 40rpx 40rpx;background-image: url('/static/imgs/codeUiBACK.png');background-repeat: no-repeat;background-size: 100% 100%;padding-top: 60rpx;">
      <view style="padding: 40rpx;width: 690rpx;background: url('/static/img/smsBg.png') no-repeat top center; background-size: 100%;height: 650rpx;">
        <view class="head">
          <view
              style="
          text-align: center;
          font-weight: bold;
          font-size: 36rpx;
          position: relative;
          height: 50rpx;
        "
          >
            <image
                @click="$refs.setUi.close()"
                src="@/static/img/off.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;
         text-align: center;
        ">本人提交确认</view>
        <view style="font-size: 28rpx;color: #666666;">根据合规要求我们将进行本人提交意愿确认的短信校验,请注意查看短信验证码</view>
        <view style="font-size: 28rpx;color: #252938;text-align: center;">根据合规要求我们将进行本人提交意愿确认的短信校验,请注意查看短信验证码</view>
        <view class="content" style="margin-top: 40rpx;">
        <view class="content">
          <uv-form
              :labelStyle="lstyle"
              labelPosition="left"
@@ -1030,9 +1163,10 @@
                  border="none"
                  placeholder="请输入手机号"
                  style="height: 100rpx;border: 1px solid #EEEEEE;border-radius: 30rpx;padding: 0 20rpx;"
              ></uv-input>
            </uv-form-item>
            <view style="height: 20rpx;"></view>
            <uv-form-item
                class="item"
                label=""
@@ -1045,10 +1179,12 @@
                  v-model="verificationCodeS"
                  border="none"
                  placeholder="请输入验证码"
                  style="height: 100rpx;border: 1px solid #EEEEEE;border-radius: 30rpx;padding: 0 20rpx;"
              >
                <template #suffix>
                  <text
                      class="code"
                      style="color: red;"
                      :class="isCounting_B ? 'ks' : ''"
                      @click="getCode_san"
                  >{{ isCounting_B ? countText_B : "获取验证码" }}</text
@@ -1057,24 +1193,17 @@
              </uv-input>
            </uv-form-item>
            <uv-form-item >
              <view class="but" style="width: 100%;margin-top: 20rpx;font-weight: 600;">
              <view class="but" style="width: 100%;">
                <uv-button
                    :customStyle="customStyle"
                    shape="circle"
                    @click="submitPlan_san"
                >确定</uv-button
                >确认</uv-button
                >
              </view>
            </uv-form-item>
          </uv-form>
        </view>
      </view>
      <view style="text-align: center;margin-top: 40rpx;">
        <image
            @click="$refs.setUi.close()"
            src="@/static/imgs/closeA.png"
            style="  width: 50rpx; height: 50rpx; "
        ></image>
      </view>
    </uv-popup>
@@ -1082,7 +1211,7 @@
      <addAddress :addressDetail="addressDetail" @off="$refs.address.close()" @submit="e => addressDetail = e"></addAddress>
    </uv-popup>
    <!-- <text-box v-if="showTextBox" ref="textBox" :getPlatformProtocolNewList="getPlatformProtocolNewList"></text-box> -->
  </view>
</template>
@@ -1101,19 +1230,15 @@
}
.form{
  background: #FFFFFF;
  padding-top: 40rpx;
  .clo{
    display: flex;
    padding: 30rpx 0rpx;
    //display: flex;
    //padding: 30rpx 0rpx;
    padding-bottom: 30rpx;
    margin: 0 40rpx;
    background: #FBFBFB !important;
    border-radius: 24rpx 24rpx 24rpx 24rpx;
    border: 2rpx solid #EEEEEE;
    padding: 30rpx 20rpx;
    margin-bottom: 40rpx;
    //border-bottom: 1rpx solid #E7E9ED;
    background: #FFFFFF;
    .label{
      width: 160rpx;
      width: 460rpx;
      height: 40rpx;
      font-weight: 600;
@@ -1124,13 +1249,17 @@
    .inp_box{
      position: relative;
      margin-top: 30rpx;
      .inp{
        &::placeholder{
          color: #999999;
          font-size: 30rpx;
        }
        height: 42rpx;
        width: 670rpx;
        height: 100rpx;
        border: 1px solid #EEEEEE;
        border-radius: 20rpx;
        padding-left: 20rpx;
        font-weight: 400;
        font-size: 30rpx;
        color: #333333;
@@ -1142,14 +1271,16 @@
.code_a{
  font-weight: 400;
  font-size: 24rpx;
  color: #FF1472;
  font-size: 28rpx;
  color: #EE2626;
  padding: 16rpx 20rpx;
  //border: 1rpx solid #EE2626;
  //border-radius: 8rpx 8rpx 8rpx 8rpx;
}
.code_k{
  font-weight: 400;
  font-size: 30rpx;
  font-size: 28rpx;
  color: #999999;
}
@@ -1166,12 +1297,12 @@
.sub{
  width: 100%;
  bottom: 50rpx;
  padding: 0 10rpx;
  margin-top: 50rpx;
  padding: 0 30rpx;
  margin-top: 40rpx;
  .sub_btn{
    background: #FF1472;
    background: #EE2626;
    border-radius: 50rpx 50rpx 50rpx 50rpx;
    padding: 10rpx;
@@ -1181,13 +1312,7 @@
  }
}
.item{
  background: #FBFBFB;
  border-radius: 24rpx 24rpx 24rpx 24rpx;
  border: 2rpx solid #EEEEEE;
  padding: 0 40rpx;
}
::v-deep  .uni-checkbox-input{
  border-radius: 0;
  transform: scale(0.7);
@@ -1211,8 +1336,5 @@
}
.nots{
  opacity: 0.5;
}
.code{
  color: #FF1472;
}
</style>