wallet_app/src/views/login/importWallet/index.vue

<template>
  <van-form @submit="onSubmit">
    <van-cell-group inset>
      <van-field
        v-model="form.userKey"
        :label="type == 0 ? $t('form.PrivateKey') : $t('form.MemoryAidWord')"
        rows="3"
        autosize
        type="textarea"
        :placeholder="
          type == 0
            ? $t('form.PleaseEnterThePrivateKey')
            : $t('form.PleaseEnterTheMnemonicPhrase')
        "
        show-word-limit
      />
      <!-- <van-field
        v-model="form.username"
        name="username"
        :label="$t('form.WalletName')"
        :placeholder="$t('form.PleaseFillIn') + $t('form.WalletName')"
        :rules="[
          {
            required: true,
            message: $t('form.PleaseFillIn') + $t('form.WalletName'),
          },
        ]"
      /> -->
      <van-field
        v-model="form.password"
        type="password"
        name="password"
        :label="$t('form.WalletPassword')"
        :placeholder="$t('form.PleaseFillIn') + $t('form.WalletPassword')"
        :rules="[
          {
            required: true,
            message: $t('form.PleaseFillIn') + $t('form.WalletPassword'),
          },
        ]"
      />

      <van-field
        v-model="form.confirmPassword"
        type="password"
        name="confirmPassword"
        :label="$t('form.ConfirmPassword')"
        :placeholder="$t('form.PleaseFillIn') + $t('form.ConfirmPassword')"
        :rules="[
          {
            required: true,
            message: $t('form.PleaseFillIn') + $t('form.ConfirmPassword'),
          },
        ]"
      />

      <van-field
        v-model="form.promptMessage"
        name="promptMessage"
        :label="$t('form.PromptMessage')"
        :placeholder="$t('form.PleaseFillIn') + $t('form.PromptMessage')"
      />
    </van-cell-group>
    <div class="button-group">
      <van-button class="btn" round block type="primary" native-type="submit">
        {{ $t("router.ImportWallet") }}
      </van-button>
    </div>
  </van-form>
</template>

<script setup>
import _ from "lodash";
import { useRoute } from "vue-router";
import { useWalletStore } from "@/stores/modules/walletStore";
 

const router = useRouter();
const route = useRoute();
const walletStore = useWalletStore();
const type = route.query.type;

const form = ref({
  userKey: "",
});

const onSubmit = async () => {
  if (form.value.password !== form.value.confirmPassword) {
    $msg($t("form.InconsistentPasswords"));
    return;
  }
  if(type == 0){
    walletStore.privateKey = form.value.userKey;
  }else{
    walletStore.words = form.value.userKey.trim().split(',');
  } 
  walletStore.accountPassword = form.value.password;
  walletStore.accountHint = form.value.promptMessage;
  await walletStore.loginWithPrivateKey(type != 0);
  router.push({
    path: "/wallet",
  });
};
</script>

<style scoped lang="less">
.van-cell-group {
  margin-top: 16px;
}
.button-group {
  width: calc(100% - 32px);
  position: absolute;
  left: 16px;
  bottom: 70px;
  .btn {
    background: @theme-color1;
    border-radius: 70px;
    font-family:
      PingFang SC,
      PingFang SC;
    font-weight: 600;
    font-size: 19px;
    color: #ffffff;
    height: 54px !important;
    border: none !important;
  }
}
</style>