wener~

DESKTOP-CVS3R96\我恁爹

2022-11-14 f8b256ef152e54c19adb85856f62432d59c16b6e

 src/page/wallet/index.vue

@@ -9,18 +9,14 @@
          <div @click="goToTopUp()">
            <img src="@/assets/img/qiandai.png" alt />
          </div>
          <div>
          <div @click="goOnline()">
            <img src="@/assets/img/kefu.png" alt />
          </div>
        </div>
      </div>
      <div class="tabs">
        <div
          v-for="(item, index) in tabsArr"
          :key="index"
          @click="handleTabsClick(item, index)"
          :class="tabsCurrentIndex === index ? 'active' : ''"
        >
        <div v-for="(item, index) in tabsArr" :key="index" @click="handleTabsClick(item, index)"
          :class="tabsCurrentIndex === index ? 'active' : ''">
          <span>{{ item }}</span>
        </div>
      </div>
@@ -29,26 +25,20 @@
          <span>{{ '总资产' }}</span>
        </div>
        <div class="num_price">
          <p
            v-if="this.$store.state.settingForm.indexDisplay && !this.$store.state.settingForm.futuresDisplay"
            class="account"
          >
          <p v-if="this.$store.state.settingForm.indexDisplay && !this.$store.state.settingForm.futuresDisplay"
            class="account">
            ¥{{ $store.state.hide ? '****' : Number($store.state.userInfo.userAmt +
            $store.state.userInfo.userIndexAmt).toFixed(2)
                $store.state.userInfo.userIndexAmt).toFixed(2)
            }}
          </p>
          <p
            v-else-if="!this.$store.state.settingForm.indexDisplay && this.$store.state.settingForm.futuresDisplay"
            class="account"
          >
          <p v-else-if="!this.$store.state.settingForm.indexDisplay && this.$store.state.settingForm.futuresDisplay"
            class="account">
            ¥{{ $store.state.hide ? '****' : Number($store.state.userInfo.userAmt +
            $store.state.userInfo.userFuturesAmt).toFixed(2)
                $store.state.userInfo.userFuturesAmt).toFixed(2)
            }}
          </p>
          <p
            v-else-if="!this.$store.state.settingForm.indexDisplay && !this.$store.state.settingForm.futuresDisplay"
            class="account"
          >¥{{ $store.state.hide ? '****' : Number($store.state.userInfo.userAmt).toFixed(2) }}</p>
          <p v-else-if="!this.$store.state.settingForm.indexDisplay && !this.$store.state.settingForm.futuresDisplay"
            class="account">¥{{ $store.state.hide ? '****' : Number($store.state.userInfo.userAmt).toFixed(2) }}</p>
        </div>
        <div class="yk es">
          <div>
@@ -104,19 +94,16 @@
        </div>
      </div>
      <div class="banks" v-if="tabsCurrentIndex === 0">

        <div class="bank_1">
          <div class="left_name">
            <span>{{ '收款名称' }}</span>
          </div>
          <div class="center_input">
            <input type="text" v-model="skName" />
            <input type="text" v-model="skName" readonly />
          </div>
          <div class="right_copy">
            <span
              v-clipboard:copy="skName"
              v-clipboard:success="onCopy"
              v-clipboard:error="onError"
            >{{ '复制' }}</span>
            <span v-clipboard:copy="skName" v-clipboard:success="onCopy" v-clipboard:error="onError">{{ '复制' }}</span>
          </div>
        </div>
        <div class="bank_1">
@@ -124,14 +111,11 @@
            <span>{{ '收款银行' }}</span>
          </div>
          <div class="center_input">
            <input type="text" v-model="skBankName" />
            <input type="text" v-model="skBankName" readonly />
          </div>
          <div class="right_copy">
            <span
              v-clipboard:copy="skBankName"
              v-clipboard:success="onCopy"
              v-clipboard:error="onError"
            >{{ '复制' }}</span>
            <span v-clipboard:copy="skBankName" v-clipboard:success="onCopy" v-clipboard:error="onError">{{ '复制'
            }}</span>
          </div>
        </div>
        <div class="bank_1">
@@ -139,25 +123,10 @@
            <span>{{ '收款账号' }}</span>
          </div>
          <div class="center_input">
            <input type="text" v-model="skUser" />
            <input type="text" v-model="skUser" readonly />
          </div>
          <div class="right_copy">
            <span
              v-clipboard:copy="skUser"
              v-clipboard:success="onCopy"
              v-clipboard:error="onError"
            >{{ '复制' }}</span>
          </div>
        </div>
        <div class="bank_1">
          <div class="left_name">
            <span>{{ '充值金额' }}</span>
          </div>
          <div class="center_input">
            <input type="text" v-model="walletNum" />
          </div>
          <div class="right_copy" @click="handleGoCz()">
            <span>{{ '充值' }}</span>
            <span v-clipboard:copy="skUser" v-clipboard:success="onCopy" v-clipboard:error="onError">{{ '复制' }}</span>
          </div>
        </div>
        <div class="bank_1" @click="handleGoToTransferRecord()">
@@ -165,8 +134,20 @@
            <span>{{ '充值记录' }}</span>
          </div>
          <div class="center_input"></div>
          <div class="right_copy img_right">
            <img src="../../assets/img/youjiantou.png" alt />
          <div class="right_copy">
            <span>{{ '查看' }}</span>
          </div>
        </div>
        <div class="bank_1">
          <div class="left_name">
            <span>{{ '充值金额' }}</span>
          </div>
          <div class="center_input">
            <input type="text" v-model="walletNum" placeholder="请输入充值金额" />
          </div>
          <div class="right_copy" @click="handleGoCz()">
            <span style="background: #2d6ae9;color: #fff;padding: 0.2rem 0.4rem;border-radius: 0.2rem;">{{ '充值'
            }}</span>
          </div>
        </div>
      </div>
@@ -234,7 +215,8 @@
      mess: "",
      messDialog: false,
      withdrawalValue: 0,
      settingInfo: {}
      settingInfo: {},
      onlineService: "",
    };
  },
  computed: {
@@ -243,8 +225,36 @@
  created() {
    this.getSettingInfo();
    this.getCardDetail(); // 获取银行卡信息
    this.getUserInfo();
    this.getInfoSite();
  },
  methods: {
    goOnline() {
      if (navigator.vibrate) {
        // 支持
        navigator.vibrate([55]);
      }
      window.location.href = this.onlineService;
    },
    async getInfoSite() {
      let data = await api.getInfoSite()
      if (data.status === 0) {
        this.onlineService = data.data.onlineService
      } else {
        Toast(data.msg)
      }
    },
    async getUserInfo() {
      // 获取用户信息
      let data = await api.getUserInfo();
      if (data.status === 0) {
        // 判断是否登录
        this.$store.commit('dialogVisible', false);
        this.$store.state.userInfo = data.data;
      } else {
        this.$store.commit('dialogVisible', true);
      }
    },
    handleZh() {
      //cho
      this.selectUserFlag = !this.selectUserFlag;
@@ -254,14 +264,26 @@
      this.$router.go(-1);
    },
    goToTopUp() {
      if (navigator.vibrate) {
        // 支持
        navigator.vibrate([55]);
      }
      this.$router.push("/wallet");
    },
    handleTabsClick(item, index) {
      this.tabsCurrentIndex = index;
      if (navigator.vibrate) {
        // 支持
        navigator.vibrate([55]);
      }
    },
    withdrawalAll() {
      // 点击全部提现
      this.withdrawalValue = this.userInfo.enableAmt;
      if (navigator.vibrate) {
          // 支持
          navigator.vibrate([55]);
        }
    },
    async handleToSure() {
      // 点击确定提现
@@ -291,12 +313,19 @@
          Toast(data.msg ? data.msg : "提现失败,请重新提现或者联系管理员");
        }
      }
      if (navigator.vibrate) {
          // 支持
          navigator.vibrate([55]);
        }
    },
    async getCardDetail() {
      // 获取银行卡信息
      let data = await api.getBankCard();
      if (data.status === 0) {
        this.$store.state.bankInfo = data.data;
        this.skName = data.data.bankName
        this.skBankName = data.data.bankAddress
        this.skUser = data.data.bankNo
      } else {
        // Toast(data.msg)
      }
@@ -312,15 +341,27 @@
      }
    },
    handleGoToTransferRecord() { // 充值记录
      if (navigator.vibrate) {
          // 支持
          navigator.vibrate([55]);
        }
      this.$router.push('/transferRecord');
    },
    handleGoToCashWithdrawalRecord() { // 提现记录
      this.$router.push('/cashWithdrawalRecord');
    },
    handleGoToTransfers() {
      if (navigator.vibrate) {
          // 支持
          navigator.vibrate([55]);
        }
      this.$router.push('/transfers');
    },
    handleGoCz() {
      if (navigator.vibrate) {
          // 支持
          navigator.vibrate([55]);
        }
      if (this.walletNum === "") {
        this.messShow = true;
        this.mess = "请输入充值金额";
@@ -340,6 +381,10 @@
    },
    onCopy() {
      Toast("复制成功");
      if (navigator.vibrate) {
          // 支持
          navigator.vibrate([55]);
        }
    },
    onError() {
      Toast("复制失败请重试");
@@ -368,37 +413,44 @@
.user_page {
  width: 100%;
  height: calc(100% - 1.3rem);

  .content {
    width: 100%;
    height: 100%;
    padding: 0 0.3rem;

    .top_icon {
      width: 100%;
      height: 1.5rem;
      display: flex;
      justify-content: space-between;
      align-items: center;

      .left_back {
        width: 10%;
        height: 50%;
        display: flex;
        align-items: center;
        justify-content: center;

        img {
          width: 0.6rem;
          height: 0.6rem;
        }
      }

      .right_icon {
        width: 25%;
        height: 50%;
        display: flex;
        > div {

        >div {
          width: 50%;
          height: 100%;
          display: flex;
          justify-content: center;
          align-items: center;

          img {
            width: 0.6rem;
            height: 0.6rem;
@@ -406,6 +458,7 @@
        }
      }
    }

    .users {
      width: 100%;
      height: 1.7949rem;
@@ -414,10 +467,12 @@
      display: flex;
      align-items: center;
      justify-content: space-between;

      .left_tou {
        width: 80%;
        height: 70%;
        display: flex;

        .left_tx {
          width: 20%;
          height: 100%;
@@ -425,29 +480,34 @@
          display: flex;
          align-items: center;
          justify-content: center;
          > div {

          >div {
            width: 1rem;
            height: 1rem;
            border-radius: 50%;
            overflow: hidden;
            background: rgb(211, 211, 211);

            img {
              width: 100%;
              height: 100%;
            }
          }
        }

        .right_name {
          width: 80%;
          height: 100%;
          display: flex;
          align-items: center;
          font-size: 0.4415rem;

          span {
            font-weight: 600;
          }
        }
      }

      .right_go {
        width: 20%;
        height: 70%;
@@ -455,12 +515,14 @@
        justify-content: flex-end;
        align-items: center;
        padding-right: 0.2rem;

        img {
          width: 0.6rem;
          height: 0.6rem;
        }
      }
    }

    .center_card {
      width: 100%;
      height: 5.3846rem;
@@ -468,6 +530,7 @@
      // background-image: linear-gradient(to right, #ffffff , #dfedfc);
      border-radius: 0.15rem;
      padding: 0.5rem 0.4rem;

      .keyon {
        width: 100%;
        height: 0.5128rem;
@@ -475,10 +538,12 @@
        display: flex;
        align-items: center;
        color: #3d4144;

        span {
          font-weight: 600;
        }
      }

      .num_price {
        width: 100%;
        height: 0.6667rem;
@@ -486,16 +551,19 @@
        display: flex;
        align-items: center;
        font-size: 0.5528rem;

        span {
          font-weight: 600;
        }
      }

      .yk {
        width: 100%;
        height: 0.5rem;
        display: flex;
        align-items: center;
        > div {

        >div {
          width: 50%;
          height: 100%;
          color: #97989d;
@@ -503,20 +571,25 @@
          align-items: center;
        }
      }

      .yk.es {
        margin-top: 0.3rem;
      }

      .yk.as {
        font-size: 0.4033rem;
        margin-top: 0.1rem;

        span {
          color: #000;
          font-weight: 600;
        }

        .bzz {
          color: #4ea364;
        }
      }

      .btns {
        width: 100%;
        height: 1.2821rem;
@@ -528,14 +601,17 @@
        font-size: 0.4015rem;
        color: #fff;
        margin-top: 0.35rem;

        span {
          font-weight: 600;
        }
      }

      .active {
        background: #4ea364;
      }
    }

    .jy {
      width: 100%;
      height: 1.5rem;
@@ -546,21 +622,25 @@
      justify-content: space-between;
      padding: 0 0.3rem;
      margin-top: 0.3rem;

      .left_gn {
        width: 40%;
        height: 60%;
        display: flex;

        .l_icon {
          width: 30%;
          height: 100%;
          display: flex;
          justify-content: center;
          align-items: center;

          img {
            width: 0.5041rem;
            height: 0.5041rem;
          }
        }

        .r_title {
          width: 70%;
          height: 100%;
@@ -568,17 +648,20 @@
          align-items: center;
          font-size: 0.4046rem;
          color: #404040;

          span {
            font-weight: 600;
          }
        }
      }

      .right_gos {
        width: 20%;
        height: 60%;
        display: flex;
        align-items: center;
        justify-content: flex-end;

        img {
          width: 0.6rem;
          height: 0.6rem;
@@ -587,59 +670,70 @@
    }
  }
}

.tabs {
  width: 100%;
  height: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  > div {
  justify-content: space-between;

  >div {
    width: 48%;
    height: 70%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .active {
    background: rgb(255, 255, 255);
    border-radius: 0.15rem;
  }
}

.banks {
  width: 100%;
  background: #fff;
  padding: 0 0.3rem;
  border-radius: 0.15rem;
  padding: 0 0.4rem;
  border-radius: 0.3rem;
  margin-top: 0.3rem;
  > div {

  >div {
    width: 100%;
    height: 1.5385rem;
    margin-top: 0.3rem;
    // height: 1.5385rem;
    // margin-top: 0.3rem;
    padding: 0.5rem 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 0.05rem solid rgb(224, 224, 224);
    font-size: 0.359rem;

    span {
      font-weight: 600;
    }

    .left_name {
      width: 25%;
      // width: 25%;
      height: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .center_input {
      width: 60%;
      height: 50%;

      input {
        width: 100%;
        height: 100%;
      }
    }

    .right_copy {
      width: 15%;
      // width: 15%;
      height: 50%;
      display: flex;
      align-items: center;
@@ -647,50 +741,60 @@
    }
  }
}

.img_right {
  > img {
    width: 0.8rem;
    height: 0.8rem;
  >img {
    width: 0.55rem;
    height: 0.55rem;
  }
}

.mess_content {
  width: 100%;
  height: 100%;
  padding: 0.5rem 0.3rem;

  .top_title {
    width: 100%;
    height: 2.5rem;

    .tt {
      width: 100%;
      height: 30%;
      display: flex;
      align-items: center;

      .left_icon {
        width: 0.5rem;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;

        img {
          width: 0.4rem;
          height: 0.4rem;
        }
      }

      .right_title {
        margin-left: 0.2rem;
      }
    }
  }

  ._on {
    width: 100%;
    height: 0.5rem;
    padding: 0 0.3rem;
    margin-top: 0.1rem;
  }

  .hgg {
    line-height: 0.5rem;
  }
}

.withdrawal {
  width: 100%;
  height: 5rem;
@@ -698,13 +802,16 @@
  border-radius: 0.15rem;
  padding: 0.5rem 0.4rem;
  background-image: linear-gradient(to right bottom, #ffffff, #dfedfc);

  .ttx {
    width: 100%;
    height: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.35rem;
  }

  .ttx_price {
    width: 100%;
    height: 1rem;
@@ -713,39 +820,51 @@
    justify-content: center;
    color: #2d6ae9;
    font-size: 0.6615rem;

    span {
      font-weight: 600;
    }
  }

  .ttx_input {
    width: 100%;
    height: 1rem;
    display: flex;
    > div {

    >div {
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .titles {
      width: 20%;
      height: 100%;
      font-size: 0.35rem;
    }

    .num {
      width: 70%;
      height: 100%;
      font-size: 0.35rem;

      input {
        width: 100%;
        height: 100%;
        padding-left: 1rem;
        font-weight: 600;
        font-size: 0.35rem;
      }
    }

    .all {
      width: 10%;
      height: 100%;
      font-size: 0.35rem;
    }
  }
}

.btns {
  width: 100%;
  height: 1.2821rem;
@@ -757,10 +876,12 @@
  font-size: 0.4015rem;
  color: #fff;
  margin-top: 0.35rem;

  span {
    font-weight: 600;
  }
}

.bank_1:last-child {
  border: none;
}