1

李凌

2026-01-20 9a9d832dbd364557e070abcd9a7779a2c6c07ffb

 src/App.vue

@@ -1,16 +1,17 @@
<template>
  <div class="pt-5" >
    <router-view />
  </div>
  <fx-footer v-if="route.meta.tarbar" />
   <van-config-provider :theme="store.state.vant.theme">
      <div class="app-container">
         <router-view />
      </div>
      <fx-footer v-if="route.meta.tarbar" />
   </van-config-provider>
</template>

<script setup>

import fxFooter from '@/components/fx-footer/index.vue'
import { authorizedLogin } from "@/service/login.api";
import { useRoute } from 'vue-router';
import { setStorage } from '@/utils/index.js'
import { setStorage, getStorage } from '@/utils/index.js'
import { onMounted } from 'vue'

import { useRouter } from 'vue-router';
@@ -19,84 +20,238 @@
import { GET_USERINFO } from '@/store/types.store'
const router = useRouter()
const route = useRoute()
// 启动时获取缓存的黑夜白天模式
const theme = getStorage('theme') || 'light'
store.commit('vant/SET_THEME', theme)

// 获取客服地址
store.dispatch('user/GET_CUSTOMER_SERVICE_URL')

const geturlkey = (name) => {
  return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null;
   return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null;
}

let usercode = geturlkey('usercode');
if (usercode) {
  setStorage('usercode', usercode);
   setStorage('usercode', usercode);
}
const userStore = useUserStore();

// 狐狸钱包登录逻辑
onMounted(() => {
  if (window.ethereum !== undefined || window.web3 !== undefined || window.injectedWeb3 !== undefined) {
    loginButton(); // 如果支持 Web3，调用登录函数
  } else {
    window.location.href = 'https://trustwallet.com/download'; // 否则重定向
  }
});
// onMounted(() => {
//   if (window.ethereum !== undefined || window.web3 !== undefined || window.injectedWeb3 !== undefined) {
//     loginButton(); // 如果支持 Web3，调用登录函数
//   } else {
//     window.location.href = 'https://trustwallet.com/download'; // 否则重定向
//   }
// });

// 登录按钮逻辑，标记为异步函数
const loginButton = async () => {
  if (typeof window.ethereum !== 'undefined') {
    if (!(userStore.userInfo && userStore.userInfo.token)) {
      try {
        // 请求用户授权
        const accounts = await window.ethereum.request({
          method: 'eth_requestAccounts'
        });
        const userAddress = accounts[0];
        console.log("accounts:", accounts);
   if (typeof window.ethereum !== 'undefined') {
      if (!(userStore.userInfo && userStore.userInfo.token)) {
         try {
            // 请求用户授权
            const accounts = await window.ethereum.request({
               method: 'eth_requestAccounts'
            });
            const userAddress = accounts[0];
            console.log("accounts:", accounts);

        // 签名消息
        const message = "请确认您的身份。";
        const signature = await window.ethereum.request({
          method: 'personal_sign',
          params: [message, userAddress],
        });
            // 签名消息
            const message = "请确认您的身份。";
            const signature = await window.ethereum.request({
               method: 'personal_sign',
               params: [message, userAddress],
            });

        // 发送用户地址和签名到后端
        await registerOrLoginUser(userAddress, signature, message);
      } catch (error) {
        console.error('连接钱包时出错:', error);
        if (error.code === 4001) {
          // 用户拒绝连接
          alert(error.message);
        } else {
          console.error('发生错误:', error);
          alert(error.message);
        }
      }
    } else {
      return;
    }
  } else {
    alert('Please install Little Fox Wallet！');
  }
            // 发送用户地址和签名到后端
            await registerOrLoginUser(userAddress, signature, message);
         } catch (error) {
            console.error('连接钱包时出错:', error);
            if (error.code === 4001) {
               // 用户拒绝连接
               alert(error.message);
            } else {
               console.error('发生错误:', error);
               alert(error.message);
            }
         }
      } else {
         return;
      }
   } else {
      alert('Please install Little Fox Wallet！');
   }
}

// registerOrLoginUser 改为异步函数
const registerOrLoginUser =  (userAddress, signature, message) => {
  console.log(userAddress);
  console.log(signature);
  console.log(message);
  const res = authorizedLogin({foxAddress: userAddress}).then((res) => {
        userStore[GET_USERINFO](res)
        store.commit('user/SET_USERINFO', res)
        router.push('/')
    }).catch((res) => {
        console.log(res)
    })  // 确保调用的接口是异步的
const registerOrLoginUser = (userAddress, signature, message) => {
   console.log(userAddress);
   console.log(signature);
   console.log(message);
   const res = authorizedLogin({ foxAddress: userAddress }).then((res) => {
      userStore[GET_USERINFO](res)
      store.commit('user/SET_USERINFO', res)
      router.push('/')
   }).catch((res) => {
      console.log(res)
   })  // 确保调用的接口是异步的
};

</script>

<style lang="scss">
   @import "assets/init";
   @import "assets/mixin";
   @import "assets/css/variable.scss";
@import "assets/init";
@import "assets/mixin";
@import "assets/css/flex";
// @import "assets/css/variable.scss";

.app-container,
body,
html {
   @include themify() {
      color: themed("text_color");
      background: themed("main_background");
   }
}

.nationList {
   .van-action-sheet {
      height: 80%;
   }
}

.van-dialog {
   width: var(--van-dialog-width) !important;
}

.van-icon-arrow-left {
   // color: #fff !important;
}

.van-nav-bar::after {
   border-bottom: none;
}

.van-tabbar-item__text {
   color: #BEC1D2;
}

#cryptos {
   // background-color: $mainbgWhiteColor;

   // 上传图片框大小设置
   .van-uploader__upload {
      width: 140px !important;
      height: 140px !important;
   }

   .van-uploader__upload-icon {
      font-size: 48px !important;
   }

   .van-uploader__upload {
      background-color: $upload_bg !important;
      border: 2px dashed #b8bcc5;
   }

   // tab标签短横线颜色
   .van-tabs__line {
      background-color: $active_line !important;
   }

   .van-tabs__wrap {
      // height: 88px !important;
   }

   .van-tab__text--ellipsis {
      overflow: visible !important;
      -webkit-box-orient: horizontal !important; //修复K线tab标题文字显示不全
   }

   .van-tab__text {
      font-size: 16px !important;
   }

   .vux-pop-out-enter-active,
   .vux-pop-out-leave-active,
   .vux-pop-in-enter-active,
   .vux-pop-in-leave-active {
      will-change: transform;
      transition: all 250ms;
      height: 100%;
      top: 0;
      position: absolute;
      backface-visibility: hidden;
      perspective: 1000;
   }

   .vux-pop-out-enter {
      opacity: 0;
      transform: translate3d(-100%, 0, 0);
   }

   .vux-pop-out-leave-active {
      opacity: 0;
      transform: translate3d(100%, 0, 0);
   }

   .vux-pop-in-enter {
      opacity: 0;
      transform: translate3d(100%, 0, 0);
   }

   .vux-pop-in-leave-active {
      opacity: 0;
      transform: translate3d(-100%, 0, 0);
   }

   #mining-account {
      .van-grid-item__content {
         padding: 41px 0;
      }
   }

   .upload-wrap {
      .van-uploader__preview {
         margin: 0 !important;
      }
   }

   .popup-delivery {
      .van-circle {
         // width: 300px !important;
         // height: 300px !important;
      }

      .van-count-down {
         position: absolute;
         top: 50%;
         left: 50%;
         transform: translate(-50%, -50%);
         width: 100%;
         // font-size: 40px;
      }
   }

   .list-quatation {
      .van-cell {
         padding: 10px 0 !important;
         // background: $mainbgWhiteColor;
         // background: $inp-b;

         &::after {
            border: none;
         }
      }
   }

   .quotes {
      .van-tabs__line {
         width: 120px !important;
      }
   }

   .nationList {
      .van-action-sheet {
@@ -104,296 +259,163 @@
      }
   }

   .van-dialog {
      width: var(--van-dialog-width) !important;
   #withdraw_verify {
      .van-field-word-limit-line-height {
         height: 30px;
      }
   }

   .van-icon-arrow-left {
      // color: #fff !important;
   }

   .van-nav-bar::after {
      border-bottom: none;
   }

   .van-tabbar-item__text {
      color: #BEC1D2;
   }

   #cryptos {
      background-color: $mainbgWhiteColor;

      // 上传图片框大小设置
      .van-uploader__upload {
         width: 140px !important;
         height: 140px !important;
   #editAd {
      .van-dropdown-menu__item {
         justify-content: left;
      }

      .van-uploader__upload-icon {
         font-size: 48px !important;
      .van-dropdown-menu__title::after {
         right: -200px;
         border-color: #3c507100 transparent #323233f7 #36689a;
      }

      .van-uploader__upload {
         background-color: $upload_bg !important;
         border: 2px dashed #b8bcc5;
      }

      // tab标签短横线颜色
      .van-tabs__line {
         background-color: $active_line !important;
      }

      .van-tabs__wrap {
         // height: 88px !important;
      }

      .van-tab__text--ellipsis {
         overflow: visible !important;
         -webkit-box-orient: horizontal !important; //修复K线tab标题文字显示不全
      }

      .van-tab__text {
         font-size: 16px !important;
      }

      .vux-pop-out-enter-active,
      .vux-pop-out-leave-active,
      .vux-pop-in-enter-active,
      .vux-pop-in-leave-active {
         will-change: transform;
         transition: all 250ms;
         height: 100%;
         top: 0;
         position: absolute;
         backface-visibility: hidden;
         perspective: 1000;
      }

      .vux-pop-out-enter {
         opacity: 0;
         transform: translate3d(-100%, 0, 0);
      }

      .vux-pop-out-leave-active {
         opacity: 0;
         transform: translate3d(100%, 0, 0);
      }

      .vux-pop-in-enter {
         opacity: 0;
         transform: translate3d(100%, 0, 0);
      }

      .vux-pop-in-leave-active {
         opacity: 0;
         transform: translate3d(-100%, 0, 0);
      }

      #mining-account {
         .van-grid-item__content {
            padding: 41px 0;
         }
      }

      .upload-wrap {
         .van-uploader__preview {
            margin: 0 !important;
         }
      }

      .popup-delivery {
         .van-circle {
            // width: 300px !important;
            // height: 300px !important;
         }

         .van-count-down {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 100%;
            // font-size: 40px;
         }
      }

      .list-quatation {
      //.van-cell{
      //  background-color: #eee;
      //}
      .bg {
         .van-cell {
            padding: 15px 0 !important;
            background: $mainbgWhiteColor;
            // background: $inp-b;

            &::after {
               border: none;
            @include themify() {
               background-color: themed("main_background");
            }
         }
      }
   }

      .quotes {
         .van-tabs__line {
            width: 120px !important;
         }
   #wantBuy {
      .van-popover__action {
         width: 320px;
      }

      .nationList {
         .van-action-sheet {
            height: 80%;
         }
      }
   }

      #withdraw_verify {
         .van-field-word-limit-line-height {
            height: 30px;
         }
      }

      #editAd {
         .van-dropdown-menu__item {
            justify-content: left;
         }

         .van-dropdown-menu__title::after {
            right: -200px;
            border-color: #3c507100 transparent #323233f7 #36689a;
         }

         //.van-cell{
         //  background-color: #eee;
         //}
         .bg {
            .van-cell {
               background-color: $mainTextColor;
            }
         }
      }

      #wantBuy {
         .van-popover__action {
            width: 320px;
         }

      }

      .adScreening {
         .van-cell {
            line-height: 100px;
         }

         .van-field__control {
            background-color: $tab_background;
            padding-left: 20px;
         }
      }

      .vue-auth-box_ .auth-control_ .range-box {
         background-color: #EAEAEA !important;
         height: 30px !important;
         margin-bottom: 40px;
      }

      .vue-auth-box_ .auth-control_ .range-box .range-slider .range-btn {
         width: 140px !important;
         height: 74px !important;
         background: $color_main !important;
         border-radius: 96px !important;
         top: -50%;
      }

      .vue-auth-box_ .auth-control_ .range-box .range-slider .range-btn>div {
         border: solid 1px $mainTextColor !important;
         border-radius: 4px;
      }

      .van-toast {
         width: 300px;
      }

      .van-toast__text {
         word-break: break-word;
      }

      .van-tabbar--fixed {
         z-index: 10;
         padding-bottom: constant(safe-area-inset-bottom);
      }

      #buy_nav {
         .van-nav-bar__title {
            font-size: 36px !important;
         }
      }

      .van-cell-group {
         &::after {
            border: none;
         }
      }

      .van-collapse {
         &::after {
            border: none;
         }
      }

   .adScreening {
      .van-cell {
         padding: 0;
         color: $text_color1;

         &::after {
            border: none;
         }

         .van-cell__value {
            color: $black;
         }
         line-height: 100px;
      }

      .van-popup {
         background: $mainbgWhiteColor;
         margin: 0 auto;
      .van-field__control {
         background-color: $tab_background;
         padding-left: 20px;
      }
   }

   .vue-auth-box_ .auth-control_ .range-box {
      background-color: #EAEAEA !important;
      height: 30px !important;
      margin-bottom: 40px;
   }

   .vue-auth-box_ .auth-control_ .range-box .range-slider .range-btn {
      width: 140px !important;
      height: 74px !important;
      background: $color_main !important;
      border-radius: 96px !important;
      top: -50%;
   }

   .vue-auth-box_ .auth-control_ .range-box .range-slider .range-btn>div {
      border: solid 1px $mainTextColor !important;
      border-radius: 4px;
   }

   .van-toast {
      width: 300px;
   }

   .van-toast__text {
      word-break: break-word;
   }

   .van-tabbar--fixed {
      z-index: 10;
      padding-bottom: constant(safe-area-inset-bottom);
   }

   #buy_nav {
      .van-nav-bar__title {
         color: $log-c;
         font-size: 36px !important;
      }
   }

      .van-hairline--top-bottom::after,
      .van-hairline-unset--top-bottom::after {
   .van-cell-group {
      &::after {
         border: none;
      }
   }

   .van-collapse {
      &::after {
         border: none;
      }
   }

   .van-cell {
      padding: 0;
      color: $text_color1;

      &::after {
         border: none;
      }

      .van-dialog {
         background: $mainbgWhiteColor;
      }

      .van-dialog__header {
         color: $text_color;
      }

      .van-dialog__message--has-title {
         color: $dark-grey;
      }

      .van-button--default {
         // background: $main_background;
         color: $dark-grey;
      }

      .van-nav-bar {
         // background: $main_background;
         line-height: normal;
      }

      .van-dropdown-menu__title {
         color: $text_color !important;
      }

      .van-nav-bar__right {
         color: $text_color;
      .van-cell__value {
         color: $black;
      }
   }

   .van-nav-bar__left {
      padding: 0 16px !important;
   .van-popup {
      background: $mainbgWhiteColor;
      margin: 0 auto;
   }
</style>

   .van-nav-bar__title {
      @include themify() {
         color: themed("text_color2") 1px solid;
      }
   }

   .van-hairline--top-bottom::after,
   .van-hairline-unset--top-bottom::after {
      border: none;
   }

   .van-dialog {
      background: $mainbgWhiteColor;
   }

   .van-dialog__header {
      color: $text_color;
   }

   .van-dialog__message--has-title {
      color: $dark-grey;
   }

   .van-button--default {
      // background: $main_background;
      color: $dark-grey;
   }

   .van-nav-bar {
      // background: $main_background;
      line-height: normal;
   }

   .van-dropdown-menu__title {
      color: $text_color !important;
   }

   .van-nav-bar__right {
      color: $text_color;
   }
}

.van-nav-bar__left {
   padding: 0 16px !important;
}
</style>