[edit][src and ui and router]

package.json

@@ -19,7 +19,8 @@
     "postcss-import": "^14.0.2",
     "postcss-url": "^10.1.3",
     "sass-loader": "^12.6.0",
-    "vue": "^3.2.13"
+    "vue": "^3.2.13",
+    "vue-router": "^4.0.14"
   },
   "devDependencies": {
     "@babel/core": "^7.12.16",

src/entry/background.js

@@ -1,12 +1,12 @@
 console.log("hello world background todo something~");
-import {pageUrl } from '../http/configAPI'
+import {pageUrl } from '@/http/configAPI'
 import {
     backTwitterPinLoginToken,
     backTwitterPinLoginCode,
 } from "../logic/twitter.js";
 
-import { setChromeStorage, getChromeCookie, LANDING_PAGE, setChromeCookie, removeChromeCookie, LANDING_PAGE_MIND } from "../uilts/chromeExtension";
-import { guid } from '../uilts/help.js'
+import { setChromeStorage, getChromeCookie, LANDING_PAGE, setChromeCookie, removeChromeCookie, LANDING_PAGE_MIND } from "@/uilts/chromeExtension";
+import { guid } from '@/uilts/help.js'
 
 chrome.runtime.onInstalled.addListener(onInstalledMethod);
 

src/entry/content.js

@@ -14,7 +14,7 @@ import {
     addPinedPop
 } from "../logic/twitter.js";
 
-import { getChromeStorage } from "../uilts/chromeExtension";
+import { getChromeStorage } from "@/uilts/chromeExtension";
 
 port.onMessage.addListener(function (res) {
     switch (res.state) {

src/entry/popup.js

@@ -1,4 +1,10 @@
 import { createApp } from 'vue'
-import App from '../view/popup.vue'
+import App from '../view/popup/index.vue'
 
-createApp(App).mount('#app')
+const app = createApp(App)
+
+// 引入路由对象实例
+import router from '@/router/popup.js'
+app.use(router)
+console.log(router)
+app.mount('#app')

src/http/request.js

@@ -1,6 +1,6 @@
 import axios from 'axios'
-import { getChromeStorage } from '../uilts/chromeExtension.js'
-import { baseAPIUrl, appVersionCode } from '../http/configAPI.js'
+import { getChromeStorage } from '@/uilts/chromeExtension.js'
+import { baseAPIUrl, appVersionCode } from '@/http/configAPI.js'
 
 let userInfo = '';
 let storage_mid = ''

src/logic/twitter.js

@@ -1,7 +1,7 @@
-import { getChromeStorage, setChromeStorage, LANDING_PAGE } from '../uilts/chromeExtension.js'
-import { throttle } from '../uilts/help'
+import { getChromeStorage, setChromeStorage, LANDING_PAGE } from '@/uilts/chromeExtension.js'
+import { throttle } from '@/uilts/help'
 import { getTtwitterRequestToken, twitterLogin } from '../server/twitter.js'
-import { srcPublishSuccess } from '../http/publishApi'
+import { srcPublishSuccess } from '@/http/publishApi'
 
 let dom = {};
 
@@ -135,7 +135,7 @@ export function addPinedPop() {
     popWrapper.id = 'de-pin-pop'
 
     let img = document.createElement('img');
-    img.src = require("../assets/img/img-pined-guide.png");
+    img.src = require("@/assets/img/img-pined-guide.png");
 
     let contentDom = document.createElement('div');
     contentDom.innerHTML = "<div style='font-weight: 500;font-size: 18px;margin-top: 20px;margin-bottom: 20px'>📌 Pin an Extension is more convenient to open😄</div><div style='display: flex; align-items: center; justify-content: space-between;'><div style='display: flex; align-items: center; font-size: 14px; color: #899099; cursor: pointer;'><input id='de-check' type='checkbox'/> Don't remind</div><div class='de-pin-skip' style='font-weight: 500; font-size: 16px; color: #389AFF;cursor: pointer;'>Skip</div></div>"
@@ -374,7 +374,7 @@ function _setPublishContent(content) {
 function _createBtnDom(port) {
     let loadingImg = document.createElement('img');
     loadingImg.id = 'de-btn-loading'
-    loadingImg.src = require("../assets/img/icon-btn-loading.png");
+    loadingImg.src = require("@/assets/img/icon-btn-loading.png");
     loadingImg.style.cssText = 'width:20px;height: 20px;margin-right:3px;-webkit-animation:load 1.1s infinite linear;';
 
     let style = document.createElement('style');
@@ -388,7 +388,7 @@ function _createBtnDom(port) {
     deBtn.style.cssText = 'width:90%;height: 52px;text-align:center;line-height:52px;margin-bottom: 4px;margin-top: 4px;background: linear-gradient(274.8deg, #FF9900 -3.69%, #BD00FF 69.71%, #00F0FF 122.65%);color:#fff;font-size:17px;font-weight:700;border-radius:100px;cursor: pointer;display: flex;align-items: center;justify-content: center;';
 
     const deBtn1 = document.createElement('img');
-    let src = require("../assets/img/icon-gift-pack.png");
+    let src = require("@/assets/img/icon-gift-pack.png");
     const smallDeBtnStyle = 'width:20px;height: 20px;cursor: pointer;marign-left:4px;margin-right:4px';
     deBtn1.id = 'de-btn1';
     deBtn1.style.cssText = smallDeBtnStyle;
@@ -397,11 +397,11 @@ function _createBtnDom(port) {
     const deBtn2 = document.createElement('div');
     deBtn2.id = 'de-btn2';
     deBtn2.style.cssText = smallDeBtnStyle;
-    deBtn2.src = "../assets/img/icon-gift-pack.png"
+    deBtn2.src = "@/assets/img/icon-gift-pack.png"
 
     const deBtn3 = document.createElement('img');
     deBtn3.id = 'de-btn3'
-    deBtn3.src = require("../assets/img/icon-slider-de-net-btn.png");
+    deBtn3.src = require("@/assets/img/icon-slider-de-net-btn.png");
     deBtn3.style.cssText = 'width:52px;height: 52px;margin-top:20px;cursor: pointer;';
 
     deBtn.addEventListener('click', () => {

src/router/popup.js

@@ -0,0 +1,27 @@
+/* eslint-disable */
+import { createRouter, createWebHashHistory, createWebHistory } from "vue-router"
+
+import Home from '../view/popup/popup.vue'
+// 2. 定义路由配置
+const routes = [
+    {
+        path: "/",
+        name:'home',
+        component: Home
+    }
+]
+
+
+// 3. 创建路由实例
+const router = createRouter({
+
+    // 4. 采用hash 模式
+    history: createWebHashHistory('popup.html'),
+    // 采用 history 模式
+    // history: createWebHistory('popup.html'),
+    routes, // short for `routes: routes`
+});
+console.log(process.env.BASE_URL)
+
+export default router
+

src/server/twitter.js

@@ -1,5 +1,5 @@
-import { appVersionCode,baseAPIUrl} from '../http/configAPI.js'
-import {getChromeStorage } from '../uilts/chromeExtension.js'
+import { appVersionCode,baseAPIUrl} from '@/http/configAPI.js'
+import {getChromeStorage } from '@/uilts/chromeExtension.js'
 
 export async function getTtwitterRequestToken() {
     let storage_mid = await getChromeStorage('mid') || ''

src/uilts/chromeExtension.js

@@ -1,4 +1,4 @@
-import { pageUrl } from "../http/configAPI.js"
+import { pageUrl } from "@/http/configAPI.js"
 
 export const LANDING_PAGE = {
     name: 'received_log',

src/view/components/custom-card-cover.vue

@@ -1,11 +1,11 @@
 <!-- 自定义卡片红包封面 -->
 <template>
     <div class="not-open">
-        <img class="cover" :src="require('../../assets/subject/001-card.png')"  />
-        <img class="open-gif" :src="require('../../assets/gif/001.gif')" />
+        <img class="cover" :src="require('@/assets/subject/001-card.png')"  />
+        <img class="open-gif" :src="require('@/assets/gif/001.gif')" />
 
         <img
-            :src="require('../../assets/svg/icon-open.svg')"
+            :src="require('@/assets/svg/icon-open.svg')"
             class="open"
             @click="open"
         />

src/view/components/follow-input.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="follow-input-wrapper">
         <div class="at-user-item" v-for="(item, index) in pageAtUserList" :key="index">
-            <img :src="require('../../assets/svg/icon-del-follows-user.svg')" 
+            <img :src="require('@/assets/svg/icon-del-follows-user.svg')" 
                 class="icon-del"
                 @click="delUser(item, index)">
             <pre :id='"pre" + index' class="at-user-input-placeholder">{{item.name}}</pre>
@@ -25,7 +25,7 @@
                         @mouseleave="onUserMouseLeave(item, index)"
                         @click="selectedUser(item, index)">
                         <div class="following" v-if="item.following">
-                            <img :src="require('../../assets/svg/icon-following-user.svg')">following 
+                            <img :src="require('@/assets/svg/icon-following-user.svg')">following 
                         </div>
                         <div class="content">
                             <img class="avatar" :src="item.avatarlUrl">
@@ -43,10 +43,10 @@
             @click="addInput"
             @mouseenter="handleMouseEn"
             @mouseleave="handleMouseLe">
-            <img :src="require('../../assets/svg/icon-add-user-default.svg')" 
+            <img :src="require('@/assets/svg/icon-add-user-default.svg')" 
                 class="icon-add"
                 v-if="!isActiveAddBtn">
-            <img :src="require('../../assets/svg/icon-add-user-active.svg')" 
+            <img :src="require('@/assets/svg/icon-add-user-active.svg')" 
                 class="icon-add"
                 v-else>
         </div>
@@ -57,9 +57,9 @@
 <script setup>
 /* eslint-disable */
 import { reactive, ref, onMounted, defineEmits, defineProps, watch } from "vue";
-import {searchTwitterUser} from "../../http/publishApi";
-import {getChromeStorage} from "../../uilts/chromeExtension"
-import {debounce} from "../../uilts/help";
+import {searchTwitterUser} from "@/http/publishApi";
+import {getChromeStorage} from "@/uilts/chromeExtension"
+import {debounce} from "@/uilts/help";
 
 const props = defineProps({
     atUserList: {

src/view/components/give-dialog.vue

@@ -5,23 +5,23 @@
             <div class="head">
                 <div class="left">
                     <div class="close-btn" @click="close">
-                        <img class="icon-close" v-if="!showPreview" :src="require('../../assets/svg/icon-close.svg')" />
-                        <img class="icon-close" v-else :src="require('../../assets/svg/icon-back.svg')" />
+                        <img class="icon-close" v-if="!showPreview" :src="require('@/assets/svg/icon-close.svg')" />
+                        <img class="icon-close" v-else :src="require('@/assets/svg/icon-back.svg')" />
                     </div>
                     <div class="title">
                         Giveaways
                     </div>
                 </div>
-                <!-- <img class="icon-question" :src="require('../../assets/svg/icon-question.svg')"> -->
+                <!-- <img class="icon-question" :src="require('@/assets/svg/icon-question.svg')"> -->
             </div>
             <div class="body">
                 <div class="left">
                     <div class="gift-pack-wrapper">
-                        <img class="icon" :src="require('../../assets/svg/icon-gift-pack.svg')">
+                        <img class="icon" :src="require('@/assets/svg/icon-gift-pack.svg')">
                     </div>
                     <div class="bottom">
-                        <!-- <img class="icon" :src="require('../../assets/svg/icon-wallet.svg')">
-                        <img class="icon" :src="require('../../assets/svg/icon-setting.svg')"> -->
+                        <!-- <img class="icon" :src="require('@/assets/svg/icon-wallet.svg')">
+                        <img class="icon" :src="require('@/assets/svg/icon-setting.svg')"> -->
                     </div>
                 </div>
                 <div class="right">
@@ -30,7 +30,7 @@
                             <div class="error-msg" v-if="iptErrMsgTxt">
                                 {{iptErrMsgTxt}}
                             </div>
-                            <img class="img-mode" src="../../assets/img/img-mode.png">
+                            <img class="img-mode" src="@/assets/img/img-mode.png">
                             <div class="form-base-title">
                                 Reward
                                 <div class="msg">
@@ -41,7 +41,7 @@
                                 <div class="item">
                                     <div class="label">
                                         <img class="icon"
-                                            :src="require('../../assets/svg/icon-usd.svg')" />
+                                            :src="require('@/assets/svg/icon-usd.svg')" />
                                         USD
                                     </div>
                                     <el-input
@@ -55,7 +55,7 @@
                                 <div class="item">
                                     <div class="label">
                                         <img class="icon"
-                                            :src="require('../../assets/svg/icon-quantity.svg')" />
+                                            :src="require('@/assets/svg/icon-quantity.svg')" />
                                         Quantity
                                         </div>
                                     <el-input
@@ -88,15 +88,15 @@
                                         @delUser="delFollowUser"></follow-input>
                                     </div>
                                     <el-switch v-if="item.type == 2" v-model="item.checked" />
-                                    <img  v-if="item.type == 3"  :src="require('../../assets/svg/icon-option-checked.svg')" />
+                                    <img  v-if="item.type == 3"  :src="require('@/assets/svg/icon-option-checked.svg')" />
                                 </div>
                             </div>
                             <div class="anti-bot-wrapper">
                                 <div class="label">
-                                    <img :src="require('../../assets/svg/icon-anti-bot.svg')" class="icon-bot">
+                                    <img :src="require('@/assets/svg/icon-anti-bot.svg')" class="icon-bot">
                                     Anti Bot
-                                    <img :src="require('../../assets/svg/icon-beta.svg')" class="icon-beta">
-                                    <img :src="require('../../assets/svg/icon-question.svg')" class="icon-question">
+                                    <img :src="require('@/assets/svg/icon-beta.svg')" class="icon-beta">
+                                    <img :src="require('@/assets/svg/icon-question.svg')" class="icon-question">
                                 </div>
                                 <el-switch v-model="openAntiBot" />
                             </div>
@@ -120,7 +120,7 @@
 
                             <div class="submit-btn-wrapper">
                                 <div class="submit-btn" @click="confirm">
-                                    <img class="icon-loading" v-if="submitIng" :src="require('../../assets/svg/icon-btn-loading.svg')"  />
+                                    <img class="icon-loading" v-if="submitIng" :src="require('@/assets/svg/icon-btn-loading.svg')"  />
                                     NEXT
                                 </div>
                             </div>
@@ -151,9 +151,9 @@
 
 <script setup>
 import { ref, watch, reactive, defineProps, defineEmits, onMounted } from "vue";
-import {postPublish, verifyPaypalResult} from "../../http/publishApi"
-import {payCalcFee, getPayConfig} from "../../http/pay"
-import {getFrontConfig} from "../../http/account"
+import {postPublish, verifyPaypalResult} from "@/http/publishApi"
+import {payCalcFee, getPayConfig} from "@/http/pay"
+import {getFrontConfig} from "@/http/account"
 import { ElMessage, ElLoading} from 'element-plus';
 import 'element-plus/es/components/message/style/css'
 
@@ -198,7 +198,7 @@ let baseFormData = reactive({
 let formList = reactive([
     {
         label: "Follow",
-        icon: require('../../assets/svg/icon-follow.svg'),
+        icon: require('@/assets/svg/icon-follow.svg'),
         nodeType: 'textarea',
         type: 1,
         text: [],
@@ -206,14 +206,14 @@ let formList = reactive([
     },
     {
         label: "Retweet",
-        icon: require('../../assets/svg/icon-retweet.svg'),
+        icon: require('@/assets/svg/icon-retweet.svg'),
         nodeType: 'div',
         type: 3,
         checked: true
     },
     {
         label: "Like tweet",
-        icon: require('../../assets/svg/icon-like.svg'),
+        icon: require('@/assets/svg/icon-like.svg'),
         nodeType: 'div',
         type: 2,
         checked: true

src/view/components/option-login.vue

@@ -1,14 +1,14 @@
 <template>
     <div class="login-wrapper">
         <div class="content">
-            <img :src="require('../../assets/svg/icon-login-denet-logo.svg')" class="logo">
+            <img :src="require('@/assets/svg/icon-login-denet-logo.svg')" class="logo">
             <div class="product-name">
                 DeNet
             </div>
         </div>
 
         <div class="login-btn" @click="login">
-            <img :src="require('../../assets/svg/icon-login-twitter-white.svg')" 
+            <img :src="require('@/assets/svg/icon-login-twitter-white.svg')" 
             class="login-btn-icon">
             Login with Twitter
         </div>

src/view/components/option-withdraw.vue

@@ -2,7 +2,7 @@
     <div class="withdraw-wrapper">
         <div class="nav-bar">
             <img
-                :src="require('../../assets/svg/icon-bar-arrow-left.svg')"
+                :src="require('@/assets/svg/icon-bar-arrow-left.svg')"
                 class="icon"
                 @click="back"
             />
@@ -15,7 +15,7 @@
                     <img
                         class="icon"
                         :src="
-                            require('../../assets/svg/icon-withdraw-paypal-logo.svg')
+                            require('@/assets/svg/icon-withdraw-paypal-logo.svg')
                         "
                     />
                 </div>
@@ -92,14 +92,14 @@
                 </div>
             </div>
             <div @click="withdraw" class="confirm-btn">
-                <img class="icon-loading" v-if="withdrawIng" :src="require('../../assets/svg/icon-btn-loading.svg')"  />
+                <img class="icon-loading" v-if="withdrawIng" :src="require('@/assets/svg/icon-btn-loading.svg')"  />
                 Confirm
             </div>
         </template>
         <template v-else>
             <div class="withdraw-status">
                 <img
-                    :src="require('../../assets/svg/icon-withdraw-status.svg')"
+                    :src="require('@/assets/svg/icon-withdraw-status.svg')"
                     alt=""
                 />
                 <div>
@@ -122,9 +122,9 @@
 import { defineProps, defineEmits, ref, onMounted, watch, computed } from "vue";
 import { ElMessage } from 'element-plus';
 import 'element-plus/es/components/message/style/css'
-import { withdrawRequest } from "../../http/account";
-import { withdrawCalcFee } from "../../http/pay";
-import {debounce} from "../../uilts/help"
+import { withdrawRequest } from "@/http/account";
+import { withdrawCalcFee } from "@/http/pay";
+import {debounce} from "@/uilts/help"
 
 const props = defineProps({
     amountValue: {

src/view/components/options-transactions.vue

@@ -2,7 +2,7 @@
     <div class="com-wrapper">
         <div class="com-nav-bar">
             <img
-                :src="require('../../assets/svg/icon-bar-arrow-left.svg')"
+                :src="require('@/assets/svg/icon-bar-arrow-left.svg')"
                 class="icon"
                 @click="back"
             />
@@ -12,7 +12,7 @@
             <template v-if="!dataList.length">
                 <img
                     class="icon-empty"
-                    :src="require('../../assets/svg/icon-empty-list.svg')"
+                    :src="require('@/assets/svg/icon-empty-list.svg')"
                 />
             </template>
             <div ref="listContent">
@@ -31,7 +31,7 @@
                             <img
                                 class="icon-give"
                                 :src="
-                                    require('../../assets/svg/icon-giveaways.svg')
+                                    require('@/assets/svg/icon-giveaways.svg')
                                 "
                             />
                         </template>
@@ -40,7 +40,7 @@
                             <img
                                 style="margin-left:-4px"
                                 :src="
-                                    require('../../assets/svg/icon-give-refund-list.svg')
+                                    require('@/assets/svg/icon-give-refund-list.svg')
                                 "
                             />
                         </template>
@@ -49,7 +49,7 @@
                             <img
                                 style="margin-left:-4px"
                                 :src="
-                                    require('../../assets/svg/icon-withdraw-paypal-list.svg')
+                                    require('@/assets/svg/icon-withdraw-paypal-list.svg')
                                 "
                             />
                         </template>
@@ -58,7 +58,7 @@
                             <img
                                 style="margin-left:-4px"
                                 :src="
-                                    require('../../assets/svg/icon-withdraw-paypal-list.svg')
+                                    require('@/assets/svg/icon-withdraw-paypal-list.svg')
                                 "
                             />
                         </template>
@@ -128,7 +128,7 @@
 /* eslint-disable */
 import { onMounted, ref, defineProps, defineEmits } from "vue";
 
-import { transactionsList } from "../../http/account";
+import { transactionsList } from "@/http/account";
 var moment = require('moment');
 
 let dataList = ref([]);

src/view/components/preview-card.vue

@@ -27,7 +27,7 @@
                         totalCount: baseFormData.totalCount,
                         amountValue: baseFormData.amountValue * 100,
                         amountCurrencyCode: 'USD',
-                        currencyIconUrl: require('../../assets/subject/icon-USD.png'),
+                        currencyIconUrl: require('@/assets/subject/icon-USD.png'),
                         userInfo: {
                             nickName: userInfo.name,
                             avatarUrl: userInfo.avatarUrl
@@ -57,7 +57,7 @@
                     </div>
                 </div>
                 <div class="card-wrapper">
-                    <img :src="require('../../assets/subject/img-card-cover-blue.png')"
+                    <img :src="require('@/assets/subject/img-card-cover-blue.png')"
                         class="card-cover"/>
                     <div class="bottom-bar">
                         <div class="title">
@@ -76,7 +76,7 @@
                             USD GIVEAWAY
                         </div>
                         <div class="center">
-                            <img src="../../assets/subject/icon-USD.png" class="icon">
+                            <img src="@/assets/subject/icon-USD.png" class="icon">
                             {{baseFormData.amountValue}}
                         </div>
                         <div class="desc">
@@ -94,8 +94,8 @@ import { ref, defineProps, onMounted, nextTick } from "vue";
 
 import customCardCover from './custom-card-cover.vue'
 
-import {getChromeStorage} from "../../uilts/chromeExtension"
-import {getUser} from "../../http/publishApi"
+import {getChromeStorage} from "@/uilts/chromeExtension"
+import {getUser} from "@/http/publishApi"
 
 let userInfo = ref({});
 

src/view/home.vue

@@ -10,7 +10,7 @@
 <script setup>
 import { onMounted, ref } from "vue";
 
-import popup from './popup.vue'
+import popup from './popup/popup.vue'
 
 let contentStyle = ref({});
 

src/view/popup/index.vue

@@ -0,0 +1,13 @@
+<template>
+    <router-view></router-view>
+</template>
+
+<script>
+export default {
+  name: 'popup-home',
+}
+</script>
+
+
+<style>
+</style>

src/view/popup.vue → src/view/popup/popup.vue

@@ -3,31 +3,28 @@
         <template v-if="isLogin && homeVisibility">
             <div class="nav-bar">
                 <div class="item left">
-                    <img :src="require('../assets/svg/icon-denet-logo.svg')" />
+                    <img :src="require('@/assets/svg/icon-denet-logo.svg')" />
                     DeNet
                 </div>
                 <div class="item right" @click="showTransactions">
-                    <img :src="require('../assets/svg/icon-option-list.svg')" />
+                    <img :src="require('@/assets/svg/icon-option-list.svg')" />
                     Transactions
                 </div>
             </div>
             <div class="content">
-                <img
-                    :src="require('../assets/svg/icon-money.svg')"
-                    class="icon-money"
-                />
+                <img :src="require('@/assets/svg/icon-money.svg')" class="icon-money" />
+                <div class="msg" v-show="walletWithdrawConfig.withdrawUSDPaypalFeeDesc">
+                    ({{ walletWithdrawConfig.withdrawUSDPaypalFeeDesc }})</div>
                 <div class="amount">${{ canWithdrawBalance / 100 }}</div>
-                <div class="withdraw-btn" @click="clickWithdraw">Withdraw</div>
-                <div class="msg" v-show="walletWithdrawConfig.withdrawUSDPaypalFeeDesc">({{walletWithdrawConfig.withdrawUSDPaypalFeeDesc}})</div>
+                <div class="area-btn">
+                    <div class="withdraw-btn" @click="clickWithdraw">Withdraw</div>
+                    <div class="top-up-btn" @click="clickTopUp">Top Up</div>
+                </div>
+                
             </div>
             <div class="tab-bar">
-                <div
-                    class="tab-item"
-                    :class="{ active: currentTabIndex == index }"
-                    v-for="(item, index) in tabList"
-                    :key="index"
-                    @click="clickTab(item, index)"
-                >
+                <div class="tab-item" :class="{ active: currentTabIndex == index }" v-for="(item, index) in tabList"
+                    :key="index" @click="clickTab(item, index)">
                     <img :src="item.icon" class="icon" />
                     {{ item.label }}
                 </div>
@@ -35,33 +32,21 @@
             <div class="list-wrapper" ref="pageGiveListDom">
                 <div class="give-list" v-if="currentTabIndex == 0">
                     <template v-if="giveList.length">
-                        <div
-                            class="cell"
-                            v-for="(item, index) in giveList"
-                            :key="index"
-                            @click="clickListItem(item, index)"
-                        >
+                        <div class="cell" v-for="(item, index) in giveList" :key="index"
+                            @click="clickListItem(item, index)">
                             <div class="img-wrapper">
                                 <!-- 收到红包 -->
                                 <template v-if="item.type == 1">
-                                    <img
-                                        class="icon-avatar"
-                                        :src="item.userInfo.avatarUrl"
-                                    />
-                                    <img
-                                        class="icon-give"
-                                        :src="
-                                            require('../assets/svg/icon-giveaways.svg')
-                                        "
-                                    />
+                                    <img class="icon-avatar" :src="item.userInfo.avatarUrl" />
+                                    <img class="icon-give" :src="
+                                        require('@/assets/svg/icon-giveaways.svg')
+                                    " />
                                 </template>
                                 <!-- 发出去红包 -->
                                 <template v-else-if="2">
-                                    <img
-                                        :src="
-                                            require('../assets/svg/icon-list-big-give.svg')
-                                        "
-                                    />
+                                    <img :src="
+                                        require('@/assets/svg/icon-list-big-give.svg')
+                                    " />
                                 </template>
                             </div>
                             <div class="info-wrapper">
@@ -87,28 +72,20 @@
                                             <!-- 收到的 -->
                                             <template v-if="item.type == 1">
                                                 <!-- 进行中-->
-                                                <template
-                                                    v-if="item.status == 0"
-                                                >
+                                                <template v-if="item.status == 0">
                                                     in progress
                                                 </template>
                                                 <!-- 已完成 -->
-                                                <template
-                                                    v-else-if="item.status == 1"
-                                                >
+                                                <template v-else-if="item.status == 1">
                                                     ${{ item.amount / 100 }}
                                                 </template>
                                                 <!-- 已过期 -->
-                                                <template
-                                                    v-else-if="item.status == 2"
-                                                >
+                                                <template v-else-if="item.status == 2">
                                                     Timeout
                                                 </template>
                                             </template>
                                             <!-- 发出去的 -->
-                                            <template
-                                                v-else-if="item.type == 2"
-                                            >
+                                            <template v-else-if="item.type == 2">
                                                 -${{ item.amount / 100 }}
                                             </template>
                                         </div>
@@ -119,82 +96,61 @@
                                                 Unpublished
                                             </template>
                                             <!-- 进行中 -->
-                                            <template
-                                                v-else-if="item.status == 1"
-                                            >
+                                            <template v-else-if="item.status == 1">
                                                 {{
                                                     item.postTaskLuckdrop
                                                         .receivedCount
                                                 }}/{{
-                                                    item.postTaskLuckdrop
-                                                        .totalCount
-                                                }}
+    item.postTaskLuckdrop
+        .totalCount
+}}
                                             </template>
                                             <!-- 已结束 -->
-                                            <template
-                                                v-else-if="item.status == 2"
-                                            >
+                                            <template v-else-if="item.status == 2">
                                                 (Time expired)
                                                 {{
                                                     item.postTaskLuckdrop
                                                         .receivedCount
                                                 }}/{{
-                                                    item.postTaskLuckdrop
-                                                        .totalCount
-                                                }}
+    item.postTaskLuckdrop
+        .totalCount
+}}
                                             </template>
                                             <!-- 红包未发出显示 -->
-                                            <div
-                                                v-if="item.postTaskLuckdrop.reSendAvailable"
-                                                class="send-btn"
-                                                @click.stop="sendTwitter(item)"
-                                            >
+                                            <div v-if="item.postTaskLuckdrop.reSendAvailable" class="send-btn"
+                                                @click.stop="sendTwitter(item)">
                                                 Send
                                             </div>
                                         </div>
                                     </div>
                                     <!-- 发红包，红包未发出隐藏-->
-                                    <img
-                                        v-if="
-                                            !(
-                                                item.type == 2 &&
-                                                item.postTaskLuckdrop.reSendAvailable
-                                            )
-                                        "
-                                        class="icon"
-                                        :src="
-                                            require('../assets/svg/icon-cell-arrow-right.svg')
-                                        "
-                                    />
+                                    <img v-if="
+                                        !(
+                                            item.type == 2 &&
+                                            item.postTaskLuckdrop.reSendAvailable
+                                        )
+                                    " class="icon" :src="
+    require('@/assets/svg/icon-cell-arrow-right.svg')
+" />
                                 </div>
                             </div>
                         </div>
                     </template>
                     <template v-else>
-                        <img
-                            class="icon-empty"
-                            :src="require('../assets/svg/icon-empty-list.svg')"
-                        />
+                        <img class="icon-empty" :src="require('@/assets/svg/icon-empty-list.svg')" />
                     </template>
                 </div>
                 <div class="more-list" v-else>
-                    <div
-                        class="cell"
-                        v-for="(item, index) in moreTabList"
-                        :key="index"
-                    >
+                    <div class="cell" v-for="(item, index) in moreTabList" :key="index">
                         <img class="icon" :src="item.icon" />
                         <div class="info-wrapper">
                             <div class="left">
                                 {{ item.label }}
                             </div>
                             <div class="right">
-                                <img
-                                    class="icon"
-                                    :src="
-                                        require('../assets/svg/icon-cell-arrow-right.svg')
-                                    "
-                                />
+                                <img class="icon" :src="
+                                    require('@/assets/svg/icon-cell-arrow-right.svg')
+                                " />
                             </div>
                         </div>
                     </div>
@@ -205,31 +161,26 @@
         <option-login v-if="!isLogin" @loginAction="loginAction" />
         <template v-if="isLogin && !homeVisibility">
             <!-- 交易列表 -->
-            <option-transactions
-                v-if="transactionsVisibility"
-                @back="transactionsBack"
-            />
+            <option-transactions v-if="transactionsVisibility" @back="transactionsBack" />
             <!-- 提现页 -->
-            <option-withdraw
-                :amountValue="canWithdrawBalance"
-                :walletWithdrawConfig="walletWithdrawConfig"
-                v-if="withdrawVisibility"
-                @back="withdrawBack"
-            />
+            <option-withdraw :amountValue="canWithdrawBalance" :walletWithdrawConfig="walletWithdrawConfig"
+                v-if="withdrawVisibility" @back="withdrawBack" />
         </template>
     </div>
 </template>
 
 <script setup>
-/* eslint-disable */
-import { ref, reactive, onMounted, watch } from "vue";
-import optionTransactions from "./components/options-transactions";
-import optionLogin from "./components/option-login.vue";
-import optionWithdraw from "./components/option-withdraw.vue";
+import { ref, onMounted } from "vue";
+
+import optionTransactions from "@/view/components/options-transactions";
+import optionLogin from "@/view/components/option-login.vue";
+import optionWithdraw from "@/view/components/option-withdraw.vue";
 import {
     getChromeStorage,
-} from "../uilts/chromeExtension";
-import { getBalance, getMineLuckdropRecords, getWithdrawConfig } from "../http/account";
+} from "@/uilts/chromeExtension";
+import { getBalance, getMineLuckdropRecords, getWithdrawConfig } from "@/http/account";
+import router from "@/router/popup.js";
+
 var moment = require("moment");
 
 let pageWrapperDom = ref(null);
@@ -257,30 +208,30 @@ let giveReqParams = {
 
 
 let walletWithdrawConfig = ref({
-        withdrawUSDPaypalFee: 0,
-        withdrawUSDPreMinAmount: 100,
-        withdrawUSDSwitch: "",
-        withdrawUSDPaypalFeeDesc: ''
-    });
+    withdrawUSDPaypalFee: 0,
+    withdrawUSDPreMinAmount: 100,
+    withdrawUSDSwitch: "",
+    withdrawUSDPaypalFeeDesc: ''
+});
 
 let moreTabList = ref([
     {
-        icon: require("../assets/svg/icon-twitter.svg"),
+        icon: require("@/assets/svg/icon-twitter.svg"),
         label: "Twitter contact",
     },
     {
-        icon: require("../assets/svg/icon-about.svg"),
+        icon: require("@/assets/svg/icon-about.svg"),
         label: "About",
     },
 ]);
 
 let tabList = ref([
     {
-        icon: require("../assets/svg/icon-giveaways.svg"),
+        icon: require("@/assets/svg/icon-giveaways.svg"),
         label: "Giveaways",
     },
     {
-        icon: require("../assets/svg/icon-more.svg"),
+        icon: require("@/assets/svg/icon-more.svg"),
         label: "More",
     },
 ]);
@@ -396,8 +347,8 @@ const clickTab = (params, index) => {
 /**
  * 点击列表跳转到推文
  */
-const clickListItem = (params, index) => {
-    if(!params.srcContentId) {
+const clickListItem = (params) => {
+    if (!params.srcContentId) {
         return;
     }
     let url = "";
@@ -448,7 +399,7 @@ const showTransactions = () => {
 };
 
 const clickWithdraw = () => {
-    if(isRequestWithdrawBalance.value) {
+    if (isRequestWithdrawBalance.value) {
         homeVisibility.value = false;
         withdrawVisibility.value = true;
     }
@@ -489,13 +440,22 @@ const sendTwitter = (params) => {
         }
     );
 };
+// 点击提现
+const clickTopUp = ()=>{
+    // router
+    console.log(router)
+    router.push('project');
+}
+
 </script>
 
 <style lang="scss">
-html,body {
+html,
+body {
     padding: 0 !important;
     margin: 0 !important;
 }
+
 .page-wrapper {
     width: 375px;
     height: 600px;
@@ -514,6 +474,7 @@ html,body {
             align-items: center;
             font-size: 13px;
             cursor: pointer;
+
             img {
                 width: 16px;
                 height: 16px;
@@ -546,18 +507,38 @@ html,body {
             font-size: 42px;
         }
 
-        .withdraw-btn {
-            background: rgba(56, 154, 255, 0.01);
-            border: 1px solid #ffb443;
-            box-sizing: border-box;
-            width: 120px;
-            height: 38px;
-            text-align: center;
-            line-height: 38px;
-            border-radius: 100px;
-            color: #ffb443;
-            display: inline-block;
-            cursor: pointer;
+        .area-btn {
+            display: flex;
+            justify-content: center;
+            font-weight: 600;
+            font-size: 15px;
+
+            .top-up-btn {
+                border: 1px solid #ffb443;
+                color: #fff;
+                background: #FFB443;
+                border-radius: 100px;
+                width: 110px;
+                height: 38px;
+                margin-left: 8px;
+                line-height: 38px;
+
+            }
+
+            .withdraw-btn {
+                background: rgba(56, 154, 255, 0.01);
+                border: 1px solid #ffb443;
+                box-sizing: border-box;
+                width: 110px;
+                font-size: 15px;
+                height: 38px;
+                text-align: center;
+                line-height: 38px;
+                border-radius: 100px;
+                color: #ffb443;
+                display: inline-block;
+                cursor: pointer;
+            }
         }
 
         .msg {
@@ -603,9 +584,11 @@ html,body {
 
     .list-wrapper {
         min-height: 202px;
+
         .give-list {
             min-height: 202px;
             position: relative;
+
             .cell {
                 display: flex;
                 justify-content: space-between;
@@ -619,17 +602,20 @@ html,body {
                     position: relative;
                     margin-right: 16px;
                     box-sizing: border-box;
+
                     .icon-avatar {
                         width: 34px;
                         height: 34px;
                         border-radius: 50%;
                     }
+
                     .icon-give {
                         position: absolute;
                         right: -4px;
                         bottom: 2px;
                     }
                 }
+
                 .info-wrapper {
                     flex: 1;
                     height: 100%;
@@ -639,27 +625,32 @@ html,body {
                     border-bottom: 1px solid #d1d1d1;
                     box-sizing: border-box;
                     padding-right: 16px;
+
                     .left {
                         .nickname {
                             font-weight: 500;
                             font-size: 14px;
                             margin-bottom: 5px;
                         }
+
                         .time {
                             font-size: 12px;
                             color: #b6b6b6;
                         }
                     }
+
                     .right {
                         display: flex;
                         align-items: center;
                         cursor: pointer;
+
                         .msg {
                             .bold {
                                 font-weight: 500;
                                 font-size: 14px;
                                 text-align: right;
                             }
+
                             .desc {
                                 font-size: 12px;
                                 color: #b6b6b6;
@@ -683,6 +674,7 @@ html,body {
                                 }
                             }
                         }
+
                         .icon {
                             width: 18px;
                             height: 24px;
@@ -691,6 +683,7 @@ html,body {
                     }
                 }
             }
+
             .icon-empty {
                 position: absolute;
                 left: 50%;
@@ -698,6 +691,7 @@ html,body {
                 transform: translate(-50%, -50%);
             }
         }
+
         .more-list {
             .cell {
                 display: flex;
@@ -706,11 +700,13 @@ html,body {
                 height: 66px;
                 box-sizing: border-box;
                 padding-left: 20px;
+
                 .icon {
                     width: 42px;
                     height: 42px;
                     border-radius: 50%;
                 }
+
                 .info-wrapper {
                     flex: 1;
                     height: 100%;
@@ -725,10 +721,12 @@ html,body {
                         font-weight: 500;
                         font-size: 16px;
                     }
+
                     .right {
                         display: flex;
                         align-items: center;
                         cursor: pointer;
+
                         .icon {
                             width: 18px;
                             height: 24px;

src/view/popup/top-up/index.vue

@@ -0,0 +1,14 @@
+<template>
+   <div>123123123</div>
+</template>
+
+<script>
+export default {
+  name: 'project-one',
+}
+</script>
+
+
+<style lang='scss' scoped>
+
+</style>

src/view/publish.vue

@@ -11,7 +11,7 @@
 
 <script setup>
 import { ref } from "vue";
-import giveDialog from "./components/give-dialog.vue";
+import giveDialog from "@/view/components/give-dialog.vue";
 
 let dialogVisible = ref(false);
 

src/view/red-packet.vue

@@ -3,7 +3,7 @@
   <div class="content">
     <!-- open -->
     <div v-if="data.status == 'opened'" class="opened">
-      <div class="header" :style="{ 'backgroundImage': `url(${require('../assets/subject/001-back-head-top.svg')})` }">
+      <div class="header" :style="{ 'backgroundImage': `url(${require('@/assets/subject/001-back-head-top.svg')})` }">
         <div class="seat"></div>
         <div class="title">Awesome! You Will Get</div>
         <div class="money">
@@ -18,40 +18,40 @@
           <template v-if="item.type == 1 && item.relatedUsers && item.relatedUsers.length > 0">
             <div class="item-content">
               <div class="item-follow-title">
-                <img :src="require('../assets/svg/icon-follow.svg')" alt />
+                <img :src="require('@/assets/svg/icon-follow.svg')" alt />
                 <div class="item-title">Follow</div>
-                <img v-if="data.done.follow" :src="require('../assets/svg/icon-true.svg')" alt />
+                <img v-if="data.done.follow" :src="require('@/assets/svg/icon-true.svg')" alt />
                 <div v-else class="btn" @click="clickFollowAll(item.relatedUsers)">Follow All</div>
               </div>
               <div class="item-follow-area">
                 <template v-for="item2, i in item.relatedUsers" v-bind:key="i">
                   <div class="item-follow" v-if="item2.finished">
                     <span :class="{ finished: item2.finished }">@{{ item2.name }}</span>
-                    <img :src="require('../assets/svg/icon-true-ed.svg')" alt />
+                    <img :src="require('@/assets/svg/icon-true-ed.svg')" alt />
                   </div>
                   <div class="item-follow" v-else @click="clickFollowAll([{ name: item2.name }])">
                     <span :class="{ finished: item2.finished }">@{{ item2.name }}</span>
-                    <img :src="require('../assets/svg/icon-add.svg')" alt />
+                    <img :src="require('@/assets/svg/icon-add.svg')" alt />
                   </div>
                 </template>
               </div>
             </div>
           </template>
           <template v-if="item.type == 2">
-            <img :src="require('../assets/svg/icon-like.svg')" alt />
+            <img :src="require('@/assets/svg/icon-like.svg')" alt />
             <div class="item-content">
               <div class="item-title">Like</div>
             </div>
-            <img v-if="data.done.like" :src="require('../assets/svg/icon-true.svg')" alt />
+            <img v-if="data.done.like" :src="require('@/assets/svg/icon-true.svg')" alt />
 
             <div v-else class="btn" @click="clickLickBtn">Like</div>
           </template>
           <template v-if="item.type == 3">
-            <img :src="require('../assets/svg/icon-retweet.svg')" alt />
+            <img :src="require('@/assets/svg/icon-retweet.svg')" alt />
             <div class="item-content">
               <div class="item-title">Retweet</div>
             </div>
-            <img v-if="data.done.retweet" :src="require('../assets/svg/icon-true.svg')" alt />
+            <img v-if="data.done.retweet" :src="require('@/assets/svg/icon-true.svg')" alt />
             <div v-else class="btn" @click="clickRetweetBtn">Retweet</div>
           </template>
         </div>
@@ -66,9 +66,9 @@
           <template v-for="item, i in data.detail.allReceived.slice(0, 3)" v-bind:key="i">
             <img :src="item.simpleUserInfoVO.avatarUrl" alt :style="{ right: `${i * 16 + 14}px` }"
               v-if="item.simpleUserInfoVO.avatarUrl" />
-            <img v-else :src="require('../assets/svg/icon-twitter.svg')" alt :style="{ right: `${i * 16 + 14}px` }" />
+            <img v-else :src="require('@/assets/svg/icon-twitter.svg')" alt :style="{ right: `${i * 16 + 14}px` }" />
           </template>
-          <img :src="require('../assets/svg/icon-right.svg')" alt class="road" />
+          <img :src="require('@/assets/svg/icon-right.svg')" alt class="road" />
         </div>
       </div>
       <div class="footer">
@@ -83,7 +83,7 @@
 
     <!-- success -->
     <div v-else-if="data.status == 'success'" class="success">
-      <div class="header" :style="{ 'backgroundImage': `url(${require('../assets/subject/001-back-head-top.svg')})` }">
+      <div class="header" :style="{ 'backgroundImage': `url(${require('@/assets/subject/001-back-head-top.svg')})` }">
         <div class="seat"></div>
         <div class="money">
           <img :src="data.detail.currencyIconUrl" alt />
@@ -91,9 +91,9 @@
           <span class="small">{{ data.detail.amountCurrencyCode }}</span>
         </div>
         <div class="done" @click="clickDone">
-          <img :src="require('../assets/subject/001-icon-done.svg')" alt class="icon-done" />
+          <img :src="require('@/assets/subject/001-icon-done.svg')" alt class="icon-done" />
           <span>Giveaways transferred to Wallet</span>
-          <img :src="require('../assets/svg/icon-right.svg')" alt class="icon-right" />
+          <img :src="require('@/assets/svg/icon-right.svg')" alt class="icon-right" />
         </div>
       </div>
       <div class="luck-list-title">
@@ -105,7 +105,7 @@
       <div class="luck-list" @scroll="handleScroll($event)">
         <div class="luck-item" v-for="item, i in data.detail.allReceived" v-bind:key="i">
           <img v-if="item.simpleUserInfoVO.avatarUrl" :src="item.simpleUserInfoVO.avatarUrl" alt />
-          <img v-else :src="require('../assets/svg/icon-twitter.svg')" alt />
+          <img v-else :src="require('@/assets/svg/icon-twitter.svg')" alt />
           <div class="luck-content">
             <div class="luck-title" v-if="item.simpleUserInfoVO.nickName">{{ item.simpleUserInfoVO.nickName }}</div>
             <div class="luck-title" v-else>Twitter User</div>
@@ -117,7 +117,7 @@
             <div class="luck-money-txt">{{ showLastTwoPlace(item.amountValue) || 0 }}</div>
           </div>
           <div class="luck-king" v-if="item.maxAmount">
-            <img :src="require('../assets/svg/icon-king-hat.svg')" alt />
+            <img :src="require('@/assets/svg/icon-king-hat.svg')" alt />
             <span>Luckiest Draw</span>
           </div>
         </div>
@@ -127,10 +127,10 @@
 
     <!-- no-open -->
     <div v-else-if="data.status == 'not-open'" class="not-open">
-      <img :src="require('../assets/subject/001-card.png')" alt="">
-      <img class="open-gif" :src="require('../assets/gif/001.gif')" />
+      <img :src="require('@/assets/subject/001-card.png')" alt="">
+      <img class="open-gif" :src="require('@/assets/gif/001.gif')" />
 
-      <img :src="require('../assets/svg/icon-open.svg')" alt="" class="open" @click="clickOpenRedPacket">
+      <img :src="require('@/assets/svg/icon-open.svg')" alt="" class="open" @click="clickOpenRedPacket">
       <div class="title" v-if="data.detail.postUserInfo">
         <img :src="data.detail.postUserInfo.avatarUrl" alt />
         <span>{{ data.detail.postUserInfo.nickName || 'FutureDoctor' }}</span>
@@ -149,7 +149,7 @@
     <!-- 领取列表 -->
     <div v-else-if="data.status == 'luck-peopel-list'" class="luck-peopel-list">
       <div class="head">
-        <img :src="require('../assets/svg/icon-back.svg')" alt @click="clickBack" />
+        <img :src="require('@/assets/svg/icon-back.svg')" alt @click="clickBack" />
       </div>
       <div class="luck-list-title">
         <div>{{ data.detail.receiveCount || 0 }}/{{ data.detail.totalCount || 0 }} People Got</div>
@@ -160,7 +160,7 @@
       <div class="luck-list" @scroll="handleScroll">
         <div class="luck-item" v-for="item, i in data.detail.allReceived" v-bind:key="i">
           <img v-if="item.simpleUserInfoVO.avatarUrl" :src="item.simpleUserInfoVO.avatarUrl" alt />
-          <img v-else :src="require('../assets/svg/icon-twitter.svg')" alt />
+          <img v-else :src="require('@/assets/svg/icon-twitter.svg')" alt />
           <div class="luck-content">
             <div class="luck-title" v-if="item.simpleUserInfoVO.nickName">{{ item.simpleUserInfoVO.nickName }}</div>
             <div class="luck-title" v-else>Twitter User</div>
@@ -172,7 +172,7 @@
           </div>
 
           <div class="luck-king" v-if="item.maxAmount">
-            <img :src="require('../assets/svg/icon-king-hat.svg')" alt />
+            <img :src="require('@/assets/svg/icon-king-hat.svg')" alt />
             <span>Luckiest Draw</span>
           </div>
         </div>
@@ -181,7 +181,7 @@
 
     <!-- 红包被领完了 -->
     <div v-else-if="data.status == 'close'" class="close">
-      <div class="header" :style="{ 'backgroundImage': `url(${require('../assets/subject/001-back-head-top.svg')})` }">
+      <div class="header" :style="{ 'backgroundImage': `url(${require('@/assets/subject/001-back-head-top.svg')})` }">
         <div class="seat"></div>
         <div class="close-title">{{ data.close_title }}</div>
         <div class="close-title" v-if="data.close_text">{{ data.close_text }}</div>
@@ -195,7 +195,7 @@
       <div class="luck-list" @scroll="handleScroll">
         <div class="luck-item" v-for="item, i in data.detail.allReceived" v-bind:key="i">
           <img v-if="item.simpleUserInfoVO.avatarUrl" :src="item.simpleUserInfoVO.avatarUrl" alt />
-          <img v-else :src="require('../assets/svg/icon-twitter.svg')" alt />
+          <img v-else :src="require('@/assets/svg/icon-twitter.svg')" alt />
           <div class="luck-content">
             <div class="luck-title" v-if="item.simpleUserInfoVO.nickName">{{ item.simpleUserInfoVO.nickName }}</div>
             <div class="luck-title" v-else>Twitter User</div>
@@ -206,7 +206,7 @@
             <div class="luck-money-txt">{{ showLastTwoPlace(item.amountValue) || 0 }}</div>
           </div>
           <div class="luck-king" v-if="item.maxAmount">
-            <img :src="require('../assets/svg/icon-king-hat.svg')" alt />
+            <img :src="require('@/assets/svg/icon-king-hat.svg')" alt />
             <span>Luckiest Draw</span>
           </div>
         </div>
@@ -216,7 +216,7 @@
 
     <!-- error -->
     <div v-else-if="data.status == 'error'" class="error">
-      <img :src="require('../assets/svg/icon-error.svg')" alt />
+      <img :src="require('@/assets/svg/icon-error.svg')" alt />
       <div class="txt">
         {{ data.error_txt }}
       </div>
@@ -228,7 +228,7 @@
 
     <!-- loading -->
     <div v-show="data.loading_show" class="loading">
-      <img :src="require('../assets/svg/icon-loading.svg')" alt />
+      <img :src="require('@/assets/svg/icon-loading.svg')" alt />
     </div>
   </div>
 </template>
@@ -240,9 +240,9 @@ export default {
 </script>
 <script setup>
 import { onMounted, reactive } from "vue";
-import { getPostDetail, getRedPacket, finishRedPacket, oneKeyLike, oneKeyReTweet, oneKeyFollow, getTaskDetail, getReceivedList } from '../http/redPacket.js'
-import { getQueryString } from '../uilts/help.js'
-import { getChromeStorage } from '../uilts/chromeExtension.js'
+import { getPostDetail, getRedPacket, finishRedPacket, oneKeyLike, oneKeyReTweet, oneKeyFollow, getTaskDetail, getReceivedList } from '@/http/redPacket.js'
+import { getQueryString } from '@/uilts/help.js'
+import { getChromeStorage } from '@/uilts/chromeExtension.js'
 var moment = require('moment');
 
 let data = reactive({

vue.config.js

@@ -57,6 +57,13 @@ iframeName.forEach((name) => {
 const isDevMode = process.env.NODE_ENV === 'development'
 
 module.exports = {
+  resolve: {
+    extensions: ['*'],
+    alias: {
+      '@': resolve('src')
+    }
+  },
+
   pages,
   filenameHashing: false,
   chainWebpack: (config) => {