1
jhzh
2026-05-22 ef52095f5e9f0a9fe2da779bb1573947d77d75b6
src/views/changeFundsPassword/index.vue
@@ -1,191 +1,129 @@
<template>
  <div class="changePassword">
    <fx-header>
      <template #title>
        {{ $t('changeFunsPassword') }}
      </template>
    </fx-header>
    <div class="content">
      <ExInput :label="$t('newPassword')" :placeholderText="$t('entryPassword')" :tips="$t('funsPasswordTips')"
        v-model="password" typeText="password" />
      <ExInput :label="$t('sureNewPassword')" :placeholderText="$t('entryPassword')" :tips="$t('funsPasswordTips')"
        v-model="rePassword" typeText="password" />
      <ExChecked class="mb-42" :list="list" @checkedSelect="onChecked"></ExChecked>
      <p class="label mt-14 textColor">{{ $t('verificationCode') }}</p>
      <div class="iptbox inputBackground">
        <input class="inputBackground textColor" type="text" :placeholder="$t('entryVerifyCode')" v-model="verifyCode">
        <span v-if="currentType != 3" @click="senCode">{{ $t('sendVerifyCode') }}<template v-if="time">
            ({{ time }})s</template></span>
  <div class="change-funds-password">
    <assets-head :title="''" :show-left="true" />
    <div class="edit-content">
      <div class="edit-input-wrap">
        <input
          v-model="oldPassword"
          type="password"
          class="edit-input"
          :placeholder="$t('oldPassword')"
        />
      </div>
      <van-button class="w-full" style="margin-top:10px;" @click="submit" type="primary">
        {{ $t('sure') }}
      </van-button>
      <div class="edit-input-wrap">
        <input
          v-model="newPassword"
          type="password"
          class="edit-input"
          :placeholder="$t('newPassword')"
        />
      </div>
      <div class="edit-input-wrap">
        <input
          v-model="confirmPassword"
          type="password"
          class="edit-input"
          :placeholder="$t('sureNewPassword')"
        />
      </div>
      <button class="edit-submit" @click="submit">{{ $t('sure') }}</button>
    </div>
  </div>
</template>
<script setup>
import ExInput from "@/components/ex-input/index.vue";
import ExChecked from "@/components/ex-checked/index.vue";
import { _setSafeword, _getVerifTarget } from '@/service/user.api.js'
import { _sendVerifyCode } from "@/service/login.api";
import { ref, onMounted, onUnmounted } from "vue";
import { ref } from "vue";
import { showToast } from "vant";
import { useRouter } from "vue-router";
import { useI18n } from "vue-i18n";
const { t } = useI18n()
const router = useRouter()
import { _changeFundsPassword } from "@/service/user.api.js";
import AssetsHead from "@/components/Transform/assets-head/index.vue";
const password = ref('')//密码
const rePassword = ref('')//确认密码
const verifyCode = ref('') //验证码
let currentType = ref(1) //默认选中手机验证1/手机;2/邮箱;3/谷歌验证器;
const list = ref([
  {
    name: t('phoneVerify'),
    type: 1
  },
  {
    name: t('emailVerify'),
    type: 2
  },
  {
    name: t('googleVerify'),
    type: 3
  },
])
const email_authority = ref(false) //是否绑定邮箱
const google_auth_bind = ref(false)//是否绑定谷歌
const phone_authority = ref(false)//是否绑定手机
const email = ref('')
const phone = ref('')
const google_auth_secret = ref('')
const account = ref('')
const timer = ref(null)
const time = ref(0)
const { t } = useI18n();
const router = useRouter();
onMounted(() => {
  getVerifTarget();
  clearTimer()
})
const oldPassword = ref("");
const newPassword = ref("");
const confirmPassword = ref("");
const onChecked = (type) => {
  currentType.value = type;
  if (currentType.value == 3 && !google_auth_bind.value) {
    console.log('sd')
    showToast(t('bindGoogleTips'))
  }
  if (currentType.value == 1) {
    account.value = phone.value;
  } else if (currentType.value == 2) {
    account.value = email.value;
  } else if (currentType.value == 3) {
    account.value = google_auth_secret.value;
  }
}
const submit = () => {
  if (password.value.length < 6) {
    showToast(t('funpasswordTips'))
    return false
  if (!oldPassword.value) {
    showToast(t("旧密码不能为空"));
    return;
  }
  _setSafeword({
    safeword: password.value,
    verifcode_type: currentType.value,
    verifcode: verifyCode.value
  }).then((res) => {
    showToast(t('changeSuccess'))
    setTimeout(() => {
      router.push('/my/index')
    }, 1000)
  if (newPassword.value.length < 6) {
    showToast(t("funpasswordTips"));
    return;
  }
  if (newPassword.value !== confirmPassword.value) {
    showToast(t("两次输入的资金密码不相同"));
    return;
  }
  _changeFundsPassword({
    old_safeword: oldPassword.value,
    safeword: newPassword.value,
    safeword_confirm: confirmPassword.value,
  })
}
const getVerifTarget = async () => {
  _getVerifTarget({
  }).then((res) => {
    email_authority.value = res.email_authority
    google_auth_bind.value = res.google_auth_bind
    phone_authority.value = res.phone_authority
    email.value = res.email
    phone.value = res.phone
    google_auth_secret.value = res.google_auth_secret
  })
}
const senCode = () => {
  if (currentType.value == 1 && !phone_authority.value) {
    showToast(t('bindPhoneTips'));
    return false
  }
  if (currentType.value == 2 && !email_authority.value) {
    showToast(t('bindEmailTips'));
    return false
  }
  onChecked(currentType.value)
  if (time.value > 0) {
    return false
  }
  _sendVerifyCode({
    target: account.value,
  }).then((res) => {
    showToast(t('sendSuccess'));
    time.value = 30;
    timer.value = setInterval(() => {
      if (time.value > 0) {
        time.value = time.value - 1
    .then(() => {
      showToast(t("changeSuccess"));
      setTimeout(() => router.push("/my/index"), 1000);
    })
    .catch((err) => {
      const msg = err?.message || err?.msg;
      if (msg && (msg.includes("旧密码") || msg.includes("incorrect") || msg.includes("wrong"))) {
        showToast(t("旧密码不正确"));
      } else {
        time.value = 0;
        clearTimer()
        showToast(msg || t("fail"));
      }
    }, 1000);
  })
}
const clearTimer = () => {
  clearInterval(timer.value)
  timer.value = null
}
onUnmounted(() => {
  clearTimer()
})
    });
};
</script>
<style lang="scss" scoped>
.changePassword {
  width: 100%;
.change-funds-password {
  min-height: 100vh;
  background: #fff;
  box-sizing: border-box;
}
.line {
  width: 100%;
  height: 1px;
  background: $light-grey;
.edit-content {
  padding: 24px 16px;
}
.content {
  padding: 16px;
  font-size: 13px;
}
.iptbox {
  height: 44px;
  margin-top: 8px;
  padding: 0 10px;
.edit-input-wrap {
  height: 48px;
  margin-bottom: 20px;
  padding: 0 16px;
  background: #f5f5f5;
  border-radius: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 3px;
}
  input {
    flex: 1;
    height: 100%;
    border: none;
  }
.edit-input {
  flex: 1;
  height: 100%;
  border: none;
  background: transparent;
  font-size: 16px;
  color: #333;
  outline: none;
}
  span {
    color: $color_main;
  }
.edit-input::placeholder {
  color: #999;
}
.edit-submit {
  width: 100%;
  margin-top: 40px;
  padding: 16px 0;
  border: none;
  border-radius: 12px;
  background: linear-gradient(90deg, #5e2bc8, #a443cf);
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}
</style>