diff --git a/src/assets/icon/arrowWhite.png b/src/assets/icon/arrowWhite.png new file mode 100644 index 0000000..c093651 Binary files /dev/null and b/src/assets/icon/arrowWhite.png differ diff --git a/src/assets/images/Lottery/cancel.png b/src/assets/images/Lottery/cancel.png new file mode 100644 index 0000000..2e5b076 Binary files /dev/null and b/src/assets/images/Lottery/cancel.png differ diff --git a/src/assets/images/Lottery/helpInfo.png b/src/assets/images/Lottery/helpInfo.png new file mode 100644 index 0000000..bbd466d Binary files /dev/null and b/src/assets/images/Lottery/helpInfo.png differ diff --git a/src/assets/images/Lottery/historyBg.png b/src/assets/images/Lottery/historyBg.png new file mode 100644 index 0000000..848b6e7 Binary files /dev/null and b/src/assets/images/Lottery/historyBg.png differ diff --git a/src/views/Activities/Lottery/Lottery.vue b/src/views/Activities/Lottery/Lottery.vue index 0e9a12c..703c7a2 100644 --- a/src/views/Activities/Lottery/Lottery.vue +++ b/src/views/Activities/Lottery/Lottery.vue @@ -84,13 +84,21 @@ background: rgba(255, 255, 255, 0.2); backdrop-filter: blur(32px); - padding: 12px; + padding: 20px 12px 12px; display: flex; align-items: center; gap: 8px; + + position: relative; " > + - +
- Transfer to others -
- - -
- +
- -
- -
- -
- -
-
- {{ selectedPayee.name || '' }} -
-
- ID: {{ selectedPayee.account || '' }} -
-
- -
+ +
+ + + +
+ +
- Change - -
- -
- - - + +
+ +
+ +
+ +
+
+ {{ selectedPayee.name || '' }} +
+
+ ID: {{ selectedPayee.account || '' }} +
+
+ + +
+ +
+ + + +
+
+ + +
+
+ Select +
+
+ + +
+
+ +
${{ coin.price }}
+
+
+ + +
+
+ Transfer +
+
+
+ + +
+
Exchange Gold Coins
+
- -
+ + +
- Search -
-
- - -
-
- -
${{ coin.price }}
-
-
- - -
-
- Transfer + +
+
+ +
{{ coin.amount }} coins x1
+
${{ coin.price }}
+
+
+ + +
+
+ Exchange +
+
+ + + +
+
Go to withdraw
+
@@ -374,7 +481,7 @@ " >
Current raffle tickets:{{ rollTimes }}
-
History
+
History
@@ -515,7 +622,8 @@ " @click.stop > -
+ +
+ + +
+
+
+
+ +
100000 coins
+
x1
+
+
2025.08.01 10:59:59
+
+
+
+
+ + +
+ +
+
@@ -620,9 +799,6 @@ import { getAppHeaderInfo, } from '@/utils/appConnectionManager.js' import { computed, nextTick, onMounted, onUnmounted, ref } from 'vue' -import GeneralHeader from '@/components/GeneralHeader.vue' -import itemCenter from '@/components/WeeklyStar/itemCenter.vue' -import TopUser from '@/components/WeeklyStar/topUser.vue' import maskLayer from '@/components/MaskLayer.vue' import { useDebounce, useThrottle } from '@/utils/useDebounce' import { getMemberProfile } from '@/api/wallet' @@ -668,18 +844,42 @@ const result = ref([]) // 抽奖结果 const resultShowIndex = ref(0) const isInAppEnvironment = ref(false) // 检测是否在APP环境中 -const maskLayerShow = ref(false) + +const resultShow = ref(false) +const helpShow = ref(false) +const historyShow = ref(false) +const maskLayerShow = computed(() => { + return helpShow.value || resultShow.value || historyShow.value +}) + const rankShow = ref(true) const incomeShow = ref(false) const lotteryShow = ref(false) +const transferShow = ref(false) +const exchangeShow = ref(false) +const withdrawShow = ref(false) + const selectedCoin = ref(null) +const appConnected = ref(false) +const headerInfo = ref({}) + +// 抽屉展示 +const drawerShowBt = (type) => { + transferShow.value = type == 'transfer' ? !transferShow.value : false + exchangeShow.value = type == 'exchange' ? !exchangeShow.value : false + withdrawShow.value = type == 'withdraw' ? !withdrawShow.value : false + selectedCoin.value = null +} + // 点击展示主体内容 const handleBt = (type) => { rankShow.value = type == 'Rank' ? true : false incomeShow.value = type == 'Income' ? true : false lotteryShow.value = type == 'Lottery' ? true : false + drawerShowBt('') // 收起抽屉 + selectedCoin.value = null // 清除选择币种 } const taskList = ref([ @@ -697,7 +897,7 @@ const taskList = ref([ // 选中的收款人 const selectedPayee = ref({ - id: null, + id: 1, account: '3232131', name: 'asdfasdfasdfas', avatar: '', @@ -787,7 +987,9 @@ const transfer = async () => { } const closedPopup = () => { - maskLayerShow.value = false + resultShow.value = false + helpShow.value = false + historyShow.value = false result.value = [] resultShowIndex.value = 0 } @@ -872,11 +1074,134 @@ const sweepstakes = async (consecutive) => { result.value.push(item) } rollTimes.value -= consecutive - maskLayerShow.value = true + resultShow.value = true + } +} + +/** + * 连接APP并获取认证信息(优化版 - 仅专注连接) + */ +const connectToApp = async () => { + console.group('🔗 APP Connection Process') + console.debug('🚀 Starting APP connection...') + + try { + // 检查是否在APP环境中 + if (!isInApp()) { + console.debug('🌐 Browser environment detected') + appConnected.value = true + console.groupEnd() + + // 触发连接成功回调 + // getUserInfo() + + return { success: true, environment: 'browser' } + } + + // 检查是否已经连接且未过期 + if (isAppConnected()) { + console.debug('✅ APP already connected and valid') + appConnected.value = true + + // 使用缓存的头部信息 + const cachedHeaderInfo = getAppHeaderInfo() + if (cachedHeaderInfo) { + headerInfo.value = cachedHeaderInfo + console.debug('🔧 Using cached HTTP headers') + } + + console.groupEnd() + + // 触发连接成功回调 + // getUserInfo() + + return { success: true, environment: 'app', fromCache: true } + } + + // 检查是否有正在进行的连接 + if (appConnectionManager.isConnecting()) { + console.debug('⏳ Connection already in progress, waiting...') + await appConnectionManager.getConnectionPromise() + appConnected.value = true + console.debug('✅ Connected via existing process') + console.groupEnd() + + // 触发连接成功回调 + // getUserInfo() + + return { success: true, environment: 'app', fromCache: true } + } + + // 建立新的APP连接 + console.debug('📱 Establishing new APP connection...') + + const connectionResult = await new Promise((resolve, reject) => { + const connectionPromise = new Promise((connectResolve, connectReject) => { + connectApplication(async (access) => { + try { + const result = parseAccessOrigin(access) + + if (result.success) { + // 解析头部信息 + headerInfo.value = parseHeader(result.data) + + // 设置HTTP请求头 + console.debug('🔧 Setting HTTP headers...') + await setHttpHeaders(headerInfo.value) + + // 标记连接成功 + appConnected.value = true + appConnectionManager.setConnected(headerInfo.value) + + console.debug('🎉 APP connection established successfully') + connectResolve({ success: true, environment: 'app', fromCache: false }) + } else { + console.error('❌ Failed to parse access origin:', result.error) + appConnectionManager.reset() + connectReject(new Error(result.error)) + } + } catch (error) { + console.error('❌ Connection process failed:', error) + appConnectionManager.reset() + connectReject(error) + } + }) + }) + + // 设置连接状态 + appConnectionManager.setConnecting(connectionPromise) + + connectionPromise.then(resolve).catch(reject) + }) + + console.debug('✅ Connection completed successfully') + console.groupEnd() + + // 触发连接成功回调 + // getUserInfo() + + return connectionResult + } catch (error) { + console.error('❌ Connection failed:', error) + appConnected.value = false + console.groupEnd() + + // 触发连接失败回调 + // if (onConnectionFailed) { + // onConnectionFailed(error) + // } + + // 连接失败的特殊处理 + if (error.message && error.message.includes('parse access')) { + router.push({ path: '/not_app', query: { message: error.message } }) + } + + return { success: false, error: error.message } } } onMounted(() => { + connectToApp() isInAppEnvironment.value = isInApp() }) @@ -897,6 +1222,10 @@ onMounted(() => { position: relative; } +.scrollbar::-webkit-scrollbar { + display: none; +} + .active-prize { border-radius: 8px; box-shadow: 0 51px 80px 0 rgba(56, 253, 182, 0.49), 0 21.307px 33.422px 0 rgba(56, 253, 182, 0.35), @@ -930,6 +1259,21 @@ onMounted(() => { transform: scale(0.98); } +.rotated { + transform: rotate(90deg); +} + +.drawer-enter-active, +.drawer-leave-active { + transition: all 0.2s ease-out; +} + +.drawer-enter-from, +.drawer-leave-to { + transform: translateY(-5px); + opacity: 0; +} + @media screen and (max-width: 360px) { * { font-size: 10px;