主题:缘起界面
This commit is contained in:
parent
acebb8fc3e
commit
669e2457a9
|
|
@ -1,4 +1,5 @@
|
|||
// 缘池 - 赛博梦幻版
|
||||
// 缘池 - 可折叠底部面板版
|
||||
// 保留所有原有功能
|
||||
|
||||
const AndroidBridge = {
|
||||
isAndroid: () => typeof Android !== 'undefined',
|
||||
|
|
@ -19,9 +20,9 @@ const AndroidBridge = {
|
|||
|
||||
getMatchableCount: function() {
|
||||
if (this.isAndroid()) {
|
||||
try { return Android.getMatchableCount(); } catch (e) { return '--'; }
|
||||
try { return Android.getMatchableCount(); } catch (e) { return '20'; }
|
||||
}
|
||||
return '--';
|
||||
return '20';
|
||||
},
|
||||
|
||||
getCategories: function() {
|
||||
|
|
@ -31,41 +32,73 @@ const AndroidBridge = {
|
|||
return [];
|
||||
},
|
||||
|
||||
// 点击用户头像 - 跳转到用户详情页
|
||||
onUserClick: function(userId, userName) {
|
||||
if (this.isAndroid()) Android.onUserClick(userId, userName);
|
||||
else console.log('点击用户:', userId, userName);
|
||||
if (this.isAndroid()) {
|
||||
Android.onUserClick(userId, userName);
|
||||
} else {
|
||||
console.log('点击用户:', userId, userName);
|
||||
}
|
||||
},
|
||||
|
||||
// 点击板块 - 跳转到板块详情页
|
||||
onCategoryClick: function(categoryId, categoryName, jumpPage) {
|
||||
if (this.isAndroid()) Android.onCategoryClick(categoryId, categoryName, jumpPage);
|
||||
else console.log('点击板块:', categoryId, categoryName);
|
||||
if (this.isAndroid()) {
|
||||
Android.onCategoryClick(parseInt(categoryId), categoryName, jumpPage || '');
|
||||
} else {
|
||||
console.log('点击板块:', categoryId, categoryName, jumpPage);
|
||||
}
|
||||
},
|
||||
|
||||
// 刷新数据
|
||||
onRefresh: function() {
|
||||
if (this.isAndroid()) Android.onRefresh();
|
||||
else console.log('刷新');
|
||||
if (this.isAndroid()) {
|
||||
Android.onRefresh();
|
||||
} else {
|
||||
console.log('刷新');
|
||||
}
|
||||
},
|
||||
|
||||
// 语音匹配
|
||||
onVoiceMatch: function() {
|
||||
if (this.isAndroid()) Android.onVoiceMatch();
|
||||
else alert('语音匹配功能待接入~');
|
||||
if (this.isAndroid()) {
|
||||
Android.onVoiceMatch();
|
||||
} else {
|
||||
alert('语音匹配功能待接入~');
|
||||
}
|
||||
},
|
||||
|
||||
// 心动信号
|
||||
onHeartSignal: function() {
|
||||
if (this.isAndroid()) Android.onHeartSignal();
|
||||
else alert('心动信号功能待接入~');
|
||||
if (this.isAndroid()) {
|
||||
Android.onHeartSignal();
|
||||
} else {
|
||||
alert('心动信号功能待接入~');
|
||||
}
|
||||
},
|
||||
|
||||
showToast: function(msg) {
|
||||
if (this.isAndroid()) Android.showToast(msg);
|
||||
else console.log('Toast:', msg);
|
||||
if (this.isAndroid()) {
|
||||
Android.showToast(msg);
|
||||
} else {
|
||||
console.log('Toast:', msg);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 缓存板块数据
|
||||
let cachedCategories = [];
|
||||
|
||||
// 底部面板状态
|
||||
let sheetExpanded = false;
|
||||
let startY = 0;
|
||||
let isDragging = false;
|
||||
|
||||
document.addEventListener('DOMContentLoaded', initPage);
|
||||
|
||||
function initPage() {
|
||||
setupEventListeners();
|
||||
setupBottomSheet();
|
||||
setTimeout(() => {
|
||||
loadUserInfo();
|
||||
loadMatchableCount();
|
||||
|
|
@ -75,58 +108,174 @@ function initPage() {
|
|||
}
|
||||
|
||||
function setupEventListeners() {
|
||||
// 刷新按钮
|
||||
document.getElementById('refreshBtn').addEventListener('click', function() {
|
||||
this.querySelector('.core-icon').style.animation = 'none';
|
||||
this.offsetHeight;
|
||||
this.querySelector('.core-icon').style.animation = 'spin 0.5s ease';
|
||||
// 刷新按钮(中心按钮)- 调用原生刷新
|
||||
const refreshBtn = document.getElementById('refreshBtn');
|
||||
if (refreshBtn) {
|
||||
refreshBtn.addEventListener('click', function() {
|
||||
AndroidBridge.onRefresh();
|
||||
loadMatchableCount();
|
||||
loadNearbyUsers();
|
||||
});
|
||||
}
|
||||
|
||||
// 语音匹配
|
||||
document.getElementById('voiceMatchBtn').addEventListener('click', () => AndroidBridge.onVoiceMatch());
|
||||
// 语音匹配 - 调用原生功能
|
||||
const voiceBtn = document.getElementById('voiceMatchBtn');
|
||||
if (voiceBtn) {
|
||||
voiceBtn.addEventListener('click', () => AndroidBridge.onVoiceMatch());
|
||||
}
|
||||
|
||||
// 心动信号
|
||||
document.getElementById('heartSignalBtn').addEventListener('click', () => AndroidBridge.onHeartSignal());
|
||||
// 心动信号 - 调用原生功能
|
||||
const heartBtn = document.getElementById('heartSignalBtn');
|
||||
if (heartBtn) {
|
||||
heartBtn.addEventListener('click', () => AndroidBridge.onHeartSignal());
|
||||
}
|
||||
|
||||
// 用户头像点击
|
||||
// 用户头像点击 - 跳转到用户详情页
|
||||
document.querySelectorAll('.orbit-user').forEach(user => {
|
||||
user.addEventListener('click', function() {
|
||||
const userId = this.dataset.userId || '';
|
||||
const userName = this.querySelector('.user-name').textContent || '用户';
|
||||
if (userId) AndroidBridge.onUserClick(userId, userName);
|
||||
if (userId) {
|
||||
AndroidBridge.onUserClick(userId, userName);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 功能卡片点击
|
||||
document.querySelectorAll('.feature-card').forEach(card => {
|
||||
// 底部面板卡片点击
|
||||
setupCardListeners();
|
||||
}
|
||||
|
||||
function setupCardListeners() {
|
||||
// 快速匹配玩伴
|
||||
document.querySelectorAll('.match-card').forEach(card => {
|
||||
card.addEventListener('click', function() {
|
||||
const id = parseInt(this.dataset.id) || 0;
|
||||
const name = this.querySelector('.card-title').textContent || '';
|
||||
const categoryId = this.dataset.categoryId || '0';
|
||||
const categoryName = this.dataset.categoryName || '';
|
||||
const jumpPage = this.dataset.jumpPage || '';
|
||||
AndroidBridge.onCategoryClick(id, name, jumpPage);
|
||||
AndroidBridge.onCategoryClick(categoryId, categoryName, jumpPage);
|
||||
});
|
||||
});
|
||||
|
||||
// 派对卡片
|
||||
document.querySelectorAll('.party-card').forEach(card => {
|
||||
card.addEventListener('click', function() {
|
||||
const categoryId = this.dataset.categoryId || '0';
|
||||
const categoryName = this.dataset.categoryName || '';
|
||||
const jumpPage = this.dataset.jumpPage || '';
|
||||
AndroidBridge.onCategoryClick(categoryId, categoryName, jumpPage);
|
||||
});
|
||||
});
|
||||
|
||||
// 小游戏
|
||||
document.querySelectorAll('.game-item').forEach(item => {
|
||||
item.addEventListener('click', function() {
|
||||
const categoryId = this.dataset.categoryId || '0';
|
||||
const categoryName = this.dataset.categoryName || '';
|
||||
const jumpPage = this.dataset.jumpPage || '';
|
||||
AndroidBridge.onCategoryClick(categoryId, categoryName, jumpPage);
|
||||
});
|
||||
});
|
||||
|
||||
// 一起玩
|
||||
document.querySelectorAll('.together-card').forEach(card => {
|
||||
card.addEventListener('click', function() {
|
||||
const categoryId = this.dataset.categoryId || '0';
|
||||
const categoryName = this.dataset.categoryName || '';
|
||||
const jumpPage = this.dataset.jumpPage || '';
|
||||
AndroidBridge.onCategoryClick(categoryId, categoryName, jumpPage);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// 添加旋转动画
|
||||
const style = document.createElement('style');
|
||||
style.textContent = '@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }';
|
||||
document.head.appendChild(style);
|
||||
// ========== 底部面板交互 ==========
|
||||
function setupBottomSheet() {
|
||||
const sheet = document.getElementById('bottomSheet');
|
||||
const handle = document.getElementById('sheetHandle');
|
||||
const handleText = document.querySelector('.handle-text');
|
||||
|
||||
if (!sheet || !handle) return;
|
||||
|
||||
// 点击手柄或"上滑查看更多"切换展开/收起
|
||||
handle.addEventListener('click', toggleSheet);
|
||||
if (handleText) {
|
||||
handleText.addEventListener('click', function(e) {
|
||||
e.stopPropagation();
|
||||
toggleSheet();
|
||||
});
|
||||
}
|
||||
|
||||
// 点击"上滑查看更多"按钮
|
||||
const expandBtn = document.getElementById('expandBtn');
|
||||
if (expandBtn) {
|
||||
expandBtn.addEventListener('click', function(e) {
|
||||
e.stopPropagation();
|
||||
expandSheet();
|
||||
});
|
||||
}
|
||||
|
||||
// 触摸拖动
|
||||
sheet.addEventListener('touchstart', onTouchStart, { passive: true });
|
||||
sheet.addEventListener('touchmove', onTouchMove, { passive: false });
|
||||
sheet.addEventListener('touchend', onTouchEnd);
|
||||
}
|
||||
|
||||
function toggleSheet() {
|
||||
const sheet = document.getElementById('bottomSheet');
|
||||
sheetExpanded = !sheetExpanded;
|
||||
sheet.classList.toggle('expanded', sheetExpanded);
|
||||
}
|
||||
|
||||
function expandSheet() {
|
||||
const sheet = document.getElementById('bottomSheet');
|
||||
sheetExpanded = true;
|
||||
sheet.classList.add('expanded');
|
||||
}
|
||||
|
||||
function collapseSheet() {
|
||||
const sheet = document.getElementById('bottomSheet');
|
||||
sheetExpanded = false;
|
||||
sheet.classList.remove('expanded');
|
||||
}
|
||||
|
||||
function onTouchStart(e) {
|
||||
startY = e.touches[0].clientY;
|
||||
isDragging = true;
|
||||
}
|
||||
|
||||
function onTouchMove(e) {
|
||||
if (!isDragging) return;
|
||||
|
||||
const currentY = e.touches[0].clientY;
|
||||
const deltaY = startY - currentY;
|
||||
|
||||
// 上滑超过40px展开
|
||||
if (deltaY > 40 && !sheetExpanded) {
|
||||
expandSheet();
|
||||
isDragging = false;
|
||||
}
|
||||
// 下滑超过40px收起
|
||||
else if (deltaY < -40 && sheetExpanded) {
|
||||
collapseSheet();
|
||||
isDragging = false;
|
||||
}
|
||||
}
|
||||
|
||||
function onTouchEnd() {
|
||||
isDragging = false;
|
||||
}
|
||||
|
||||
// ========== 数据加载 ==========
|
||||
function loadUserInfo() {
|
||||
const info = AndroidBridge.getUserInfo();
|
||||
if (info) {
|
||||
if (info.name) document.getElementById('userName').textContent = info.name;
|
||||
if (info.info) document.getElementById('userInfo').textContent = info.info;
|
||||
if (info && info.name) {
|
||||
console.log('用户信息:', info.name, info.info);
|
||||
}
|
||||
}
|
||||
|
||||
function loadMatchableCount() {
|
||||
const count = AndroidBridge.getMatchableCount();
|
||||
document.getElementById('matchCount').textContent = count;
|
||||
const el = document.getElementById('matchCount');
|
||||
if (el) el.textContent = '剩余匹配' + count + '人';
|
||||
}
|
||||
|
||||
function loadNearbyUsers() {
|
||||
|
|
@ -137,12 +286,12 @@ function loadNearbyUsers() {
|
|||
function renderOrbitUsers(users) {
|
||||
const userEls = document.querySelectorAll('.orbit-user');
|
||||
const defaultUsers = [
|
||||
{ id: '1', name: '小树', location: '杭州' },
|
||||
{ id: '2', name: 'Lina', location: '深圳' },
|
||||
{ id: '3', name: '小七', location: '武汉' },
|
||||
{ id: '4', name: '小北', location: '西安' },
|
||||
{ id: '5', name: '暖暖', location: '成都' },
|
||||
{ id: '6', name: '阿宁', location: '南宁' }
|
||||
{ id: '1', name: '对你何止...', location: '美国 · 在线' },
|
||||
{ id: '2', name: 'cat', location: '保密 · 在线' },
|
||||
{ id: '3', name: '雾落溪漫', location: '桂林 · 在线' },
|
||||
{ id: '4', name: '313', location: '南宁 · 在线' },
|
||||
{ id: '5', name: 'ZwaC', location: '南宁 · 在线' },
|
||||
{ id: '6', name: '小惠^', location: '崇左 · 在线' }
|
||||
];
|
||||
|
||||
const data = (users && users.length > 0) ? users : defaultUsers;
|
||||
|
|
@ -150,56 +299,117 @@ function renderOrbitUsers(users) {
|
|||
userEls.forEach((el, index) => {
|
||||
const user = data[index] || {};
|
||||
el.dataset.userId = user.id || '';
|
||||
el.querySelector('.user-name').textContent = user.name || '用户';
|
||||
el.querySelector('.user-location').textContent = user.location || '';
|
||||
|
||||
const nameEl = el.querySelector('.user-name');
|
||||
const locationEl = el.querySelector('.user-location');
|
||||
const img = el.querySelector('.avatar-img');
|
||||
|
||||
if (nameEl) nameEl.textContent = user.name || '用户';
|
||||
if (locationEl) locationEl.textContent = user.location || '';
|
||||
|
||||
if (img) {
|
||||
if (user.avatar) {
|
||||
img.src = user.avatar;
|
||||
img.onerror = () => { img.src = ''; };
|
||||
} else {
|
||||
img.src = '';
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function loadCategories() {
|
||||
const categories = AndroidBridge.getCategories();
|
||||
if (categories && categories.length > 0) {
|
||||
cachedCategories = categories;
|
||||
renderCategories(categories);
|
||||
}
|
||||
}
|
||||
|
||||
// 渲染板块到底部面板
|
||||
function renderCategories(categories) {
|
||||
const grid = document.getElementById('categoryGrid');
|
||||
const defaultIcons = ['💕', '🎮', '🎤', '🎨', '🔫', '🎲'];
|
||||
const defaultGlows = ['pink', 'cyan', 'purple', 'pink', 'cyan', 'purple'];
|
||||
|
||||
const cards = grid.querySelectorAll('.feature-card');
|
||||
cards.forEach((card, index) => {
|
||||
// 快速匹配玩伴区域 - 前3个板块
|
||||
const matchCards = document.querySelectorAll('.match-card');
|
||||
matchCards.forEach((card, index) => {
|
||||
const cat = categories[index];
|
||||
if (cat) {
|
||||
card.dataset.id = cat.id || index + 1;
|
||||
card.dataset.categoryId = cat.id;
|
||||
card.dataset.categoryName = cat.name || '';
|
||||
card.dataset.jumpPage = cat.jumpPage || '';
|
||||
card.querySelector('.card-title').textContent = cat.name || '未知';
|
||||
|
||||
const titleEl = card.querySelector('.match-title');
|
||||
if (titleEl && cat.name) titleEl.textContent = cat.name;
|
||||
}
|
||||
});
|
||||
|
||||
// 派对区域
|
||||
const partyCards = document.querySelectorAll('.party-card');
|
||||
partyCards.forEach((card, index) => {
|
||||
const cat = categories[3 + index];
|
||||
if (cat) {
|
||||
card.dataset.categoryId = cat.id;
|
||||
card.dataset.categoryName = cat.name || '';
|
||||
card.dataset.jumpPage = cat.jumpPage || '';
|
||||
|
||||
const titleEl = card.querySelector('.party-title');
|
||||
if (titleEl && cat.name) titleEl.textContent = cat.name;
|
||||
}
|
||||
});
|
||||
|
||||
// 小游戏区域
|
||||
const gameItems = document.querySelectorAll('.game-item');
|
||||
gameItems.forEach((item, index) => {
|
||||
const cat = categories[8 + index];
|
||||
if (cat) {
|
||||
item.dataset.categoryId = cat.id;
|
||||
item.dataset.categoryName = cat.name || '';
|
||||
item.dataset.jumpPage = cat.jumpPage || '';
|
||||
|
||||
const nameEl = item.querySelector('.game-name');
|
||||
if (nameEl && cat.name) nameEl.textContent = cat.name;
|
||||
}
|
||||
});
|
||||
|
||||
// 一起玩区域
|
||||
const togetherCards = document.querySelectorAll('.together-card');
|
||||
togetherCards.forEach((card, index) => {
|
||||
const cat = categories[12 + index];
|
||||
if (cat) {
|
||||
card.dataset.categoryId = cat.id;
|
||||
card.dataset.categoryName = cat.name || '';
|
||||
card.dataset.jumpPage = cat.jumpPage || '';
|
||||
|
||||
const titleEl = card.querySelector('.together-title');
|
||||
if (titleEl && cat.name) titleEl.textContent = cat.name;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Android回调
|
||||
// ========== Android回调函数 ==========
|
||||
function updateNearbyUsers(json) {
|
||||
try { renderOrbitUsers(JSON.parse(json)); } catch (e) {}
|
||||
try {
|
||||
const users = JSON.parse(json);
|
||||
renderOrbitUsers(users);
|
||||
} catch (e) {
|
||||
console.error('解析用户数据失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
function updateMatchableCount(count) {
|
||||
document.getElementById('matchCount').textContent = count;
|
||||
const el = document.getElementById('matchCount');
|
||||
if (el) el.textContent = '剩余匹配' + count + '人';
|
||||
}
|
||||
|
||||
function updateCategories(json) {
|
||||
try { renderCategories(JSON.parse(json)); } catch (e) {}
|
||||
try {
|
||||
const categories = JSON.parse(json);
|
||||
cachedCategories = categories;
|
||||
renderCategories(categories);
|
||||
} catch (e) {
|
||||
console.error('解析板块数据失败:', e);
|
||||
}
|
||||
}
|
||||
|
||||
function updateUserInfo(name, info) {
|
||||
if (name) document.getElementById('userName').textContent = name;
|
||||
if (info) document.getElementById('userInfo').textContent = info;
|
||||
console.log('用户信息更新:', name, info);
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -12,41 +12,30 @@
|
|||
<div class="bg-layer">
|
||||
<div class="gradient-orb orb-1"></div>
|
||||
<div class="gradient-orb orb-2"></div>
|
||||
<div class="grid-lines"></div>
|
||||
</div>
|
||||
|
||||
<div class="pond-inner">
|
||||
<!-- 顶部栏 -->
|
||||
<header class="top-bar">
|
||||
<div class="logo-area">
|
||||
<span class="logo-glow">◈</span>
|
||||
<span class="logo-text">FishPond</span>
|
||||
<div class="top-left">
|
||||
<span class="page-title">附近的人</span>
|
||||
</div>
|
||||
<div class="top-right">
|
||||
<span class="filter-btn">▼ 筛选</span>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- 信息栏 -->
|
||||
<section class="info-bar glass">
|
||||
<div class="info-left">
|
||||
<span class="info-label">剩余匹配</span>
|
||||
<span class="info-value neon-text" id="matchCount">--</span>
|
||||
<span class="info-unit">人</span>
|
||||
</div>
|
||||
<div class="info-right">
|
||||
<span class="info-desc" id="userInfo">真诚 | 南宁 | 在线</span>
|
||||
<span class="info-name neon-text" id="userName">加载中...</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 匹配圆环区域 -->
|
||||
<section class="match-area">
|
||||
<!-- 中心脉冲圆环 -->
|
||||
<!-- 中心按钮 - 粉色圆形 -->
|
||||
<div class="center-ring">
|
||||
<div class="ring-pulse"></div>
|
||||
<div class="ring-pulse delay-1"></div>
|
||||
<div class="ring-pulse delay-2"></div>
|
||||
<div class="ring-core" id="refreshBtn">
|
||||
<div class="core-inner">
|
||||
<span class="core-icon">⟳</span>
|
||||
<span class="core-text">立即速配</span>
|
||||
<span class="core-sub" id="matchCount">剩余匹配20人</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -54,104 +43,218 @@
|
|||
<!-- 轨道环 -->
|
||||
<div class="orbit-ring"></div>
|
||||
|
||||
<!-- 用户头像 - 摩天轮布局 -->
|
||||
<!-- 用户头像 - 固定位置 -->
|
||||
<div class="orbit-users" id="orbitGroup">
|
||||
<div class="orbit-user" data-pos="1">
|
||||
<div class="user-avatar glass">
|
||||
<div class="user-avatar">
|
||||
<img src="" alt="" class="avatar-img">
|
||||
<div class="avatar-glow"></div>
|
||||
</div>
|
||||
<div class="user-name"></div>
|
||||
<div class="user-location"></div>
|
||||
<div class="user-name">对你何止...</div>
|
||||
<div class="user-location">美国 · 在线</div>
|
||||
</div>
|
||||
<div class="orbit-user" data-pos="2">
|
||||
<div class="user-avatar glass">
|
||||
<div class="user-avatar">
|
||||
<img src="" alt="" class="avatar-img">
|
||||
<div class="avatar-glow"></div>
|
||||
</div>
|
||||
<div class="user-name"></div>
|
||||
<div class="user-location"></div>
|
||||
<div class="user-name">cat</div>
|
||||
<div class="user-location">保密 · 在线</div>
|
||||
</div>
|
||||
<div class="orbit-user" data-pos="3">
|
||||
<div class="user-avatar glass">
|
||||
<div class="user-avatar">
|
||||
<img src="" alt="" class="avatar-img">
|
||||
<div class="avatar-glow"></div>
|
||||
</div>
|
||||
<div class="user-name"></div>
|
||||
<div class="user-location"></div>
|
||||
<div class="user-name">雾落溪漫</div>
|
||||
<div class="user-location">桂林 · 在线</div>
|
||||
</div>
|
||||
<div class="orbit-user" data-pos="4">
|
||||
<div class="user-avatar glass">
|
||||
<div class="user-avatar">
|
||||
<img src="" alt="" class="avatar-img">
|
||||
<div class="avatar-glow"></div>
|
||||
</div>
|
||||
<div class="user-name"></div>
|
||||
<div class="user-location"></div>
|
||||
<div class="user-name">313</div>
|
||||
<div class="user-location">南宁 · 在线</div>
|
||||
</div>
|
||||
<div class="orbit-user" data-pos="5">
|
||||
<div class="user-avatar glass">
|
||||
<div class="user-avatar">
|
||||
<img src="" alt="" class="avatar-img">
|
||||
<div class="avatar-glow"></div>
|
||||
</div>
|
||||
<div class="user-name"></div>
|
||||
<div class="user-location"></div>
|
||||
<div class="user-name">ZwaC</div>
|
||||
<div class="user-location">南宁 · 在线</div>
|
||||
</div>
|
||||
<div class="orbit-user" data-pos="6">
|
||||
<div class="user-avatar glass">
|
||||
<div class="user-avatar">
|
||||
<img src="" alt="" class="avatar-img">
|
||||
<div class="avatar-glow"></div>
|
||||
</div>
|
||||
<div class="user-name"></div>
|
||||
<div class="user-location"></div>
|
||||
<div class="user-name">小惠^</div>
|
||||
<div class="user-location">崇左 · 在线</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 广告横幅 -->
|
||||
<section class="promo-banner">
|
||||
<img class="promo-icon-img" src="./images/promo_cards.png" alt="卡片" onerror="this.style.display='none'">
|
||||
<span class="promo-text">语音加速卡折扣</span>
|
||||
<span class="promo-link">加速卡/恋爱卡/魔仙卡 ></span>
|
||||
<span class="promo-new">NEW</span>
|
||||
</section>
|
||||
|
||||
<!-- 快捷操作按钮 -->
|
||||
<section class="quick-actions">
|
||||
<button class="action-btn neon-btn pink" id="voiceMatchBtn">
|
||||
<span class="btn-icon">🎧</span>
|
||||
<div class="btn-content">
|
||||
<span class="btn-label">语音匹配</span>
|
||||
<span class="btn-sub">今日剩9/10次</span>
|
||||
</div>
|
||||
</button>
|
||||
<button class="action-btn neon-btn cyan" id="heartSignalBtn">
|
||||
<span class="btn-icon">💓</span>
|
||||
<span class="btn-icon">💗</span>
|
||||
<div class="btn-content">
|
||||
<span class="btn-label">心动信号</span>
|
||||
<span class="btn-sub">已开启</span>
|
||||
</div>
|
||||
</button>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<!-- 功能入口 2x3 -->
|
||||
<section class="feature-grid" id="categoryGrid">
|
||||
<div class="feature-card glass" data-id="1">
|
||||
<div class="card-glow pink"></div>
|
||||
<div class="card-icon">💕</div>
|
||||
<div class="card-title">在线处对象</div>
|
||||
<!-- 可折叠底部面板 -->
|
||||
<div class="bottom-sheet" id="bottomSheet">
|
||||
<!-- 快速匹配玩伴 - 始终显示部分 -->
|
||||
<section class="sheet-section peek-section">
|
||||
<div class="sheet-handle" id="sheetHandle">
|
||||
<div class="handle-bar"></div>
|
||||
</div>
|
||||
<div class="feature-card glass" data-id="2">
|
||||
<div class="card-glow cyan"></div>
|
||||
<div class="card-icon">🎮</div>
|
||||
<div class="card-title">找人玩游戏</div>
|
||||
<div class="section-header">
|
||||
<span class="section-title">快速匹配玩伴</span>
|
||||
<span class="section-more" id="expandBtn">上滑查看更多</span>
|
||||
</div>
|
||||
<div class="feature-card glass" data-id="3">
|
||||
<div class="card-glow purple"></div>
|
||||
<div class="card-icon">🎤</div>
|
||||
<div class="card-title">一起KTV</div>
|
||||
<div class="match-grid">
|
||||
<div class="match-card" data-category-id="1" data-category-name="在线处对象">
|
||||
<div class="match-info">
|
||||
<span class="match-title">在线处对象</span>
|
||||
<span class="match-desc">找个CP上上头</span>
|
||||
</div>
|
||||
<div class="feature-card glass" data-id="4">
|
||||
<div class="card-glow pink"></div>
|
||||
<div class="card-icon">🎨</div>
|
||||
<div class="card-title">你画我猜</div>
|
||||
<span class="match-icon">💕</span>
|
||||
</div>
|
||||
<div class="feature-card glass" data-id="5">
|
||||
<div class="card-glow cyan"></div>
|
||||
<div class="card-icon">🔫</div>
|
||||
<div class="card-title">和平精英</div>
|
||||
<div class="match-card" data-category-id="2" data-category-name="找人玩游戏">
|
||||
<div class="match-info">
|
||||
<span class="match-title">找人玩游戏</span>
|
||||
<span class="match-desc">找游戏搭子</span>
|
||||
</div>
|
||||
<span class="match-icon">🎮</span>
|
||||
</div>
|
||||
<div class="match-card" data-category-id="3" data-category-name="心动颜究所">
|
||||
<div class="match-info">
|
||||
<span class="match-title">心动颜究所</span>
|
||||
<span class="match-desc">好看的人都在这</span>
|
||||
</div>
|
||||
<span class="match-icon">💗</span>
|
||||
</div>
|
||||
<div class="feature-card glass" data-id="6">
|
||||
<div class="card-glow purple"></div>
|
||||
<div class="card-icon">🎲</div>
|
||||
<div class="card-title">桌游派对</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 底部面板内容 - 展开后显示 -->
|
||||
<div class="sheet-content">
|
||||
<!-- 派对 -->
|
||||
<section class="sheet-section">
|
||||
<div class="section-header">
|
||||
<span class="section-title">派对</span>
|
||||
</div>
|
||||
<div class="party-grid">
|
||||
<div class="party-card large" data-category-id="10" data-category-name="派对大厅">
|
||||
<div class="party-bg pink"></div>
|
||||
<div class="party-content">
|
||||
<span class="party-title">派对大厅</span>
|
||||
<span class="party-count">12345人在玩</span>
|
||||
<span class="party-tag">快速进入</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="party-card" data-category-id="11" data-category-name="K歌房">
|
||||
<div class="party-bg cyan"></div>
|
||||
<div class="party-content">
|
||||
<span class="party-title">K歌房</span>
|
||||
<span class="party-desc">热门歌曲</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="party-card" data-category-id="12" data-category-name="游戏厅">
|
||||
<div class="party-bg purple"></div>
|
||||
<div class="party-content">
|
||||
<span class="party-title">游戏厅</span>
|
||||
<span class="party-desc">一起开黑</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="party-card" data-category-id="13" data-category-name="剧本杀">
|
||||
<div class="party-bg orange"></div>
|
||||
<div class="party-content">
|
||||
<span class="party-title">剧本杀</span>
|
||||
<span class="party-desc">烧脑推理</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="party-card" data-category-id="14" data-category-name="你画我猜">
|
||||
<div class="party-bg green"></div>
|
||||
<div class="party-content">
|
||||
<span class="party-title">你画我猜</span>
|
||||
<span class="party-desc">创意涂鸦</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 小游戏 -->
|
||||
<section class="sheet-section">
|
||||
<div class="section-header">
|
||||
<span class="section-title">小游戏</span>
|
||||
</div>
|
||||
<div class="game-list">
|
||||
<div class="game-item" data-category-id="20" data-category-name="飞行棋">
|
||||
<span class="game-name">飞行棋</span>
|
||||
<span class="game-icon">🎲</span>
|
||||
</div>
|
||||
<div class="game-item" data-category-id="21" data-category-name="桌球">
|
||||
<span class="game-name">桌球</span>
|
||||
<span class="game-icon">🎱</span>
|
||||
</div>
|
||||
<div class="game-item" data-category-id="22" data-category-name="五子棋">
|
||||
<span class="game-name">五子棋</span>
|
||||
<span class="game-icon">⚫</span>
|
||||
</div>
|
||||
<div class="game-item" data-category-id="23" data-category-name="你画我猜">
|
||||
<span class="game-name">你画我猜</span>
|
||||
<span class="game-icon">🎨</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 一起玩 -->
|
||||
<section class="sheet-section">
|
||||
<div class="section-header">
|
||||
<span class="section-title">一起玩</span>
|
||||
</div>
|
||||
<div class="together-grid">
|
||||
<div class="together-card" data-category-id="30" data-category-name="群聊广场">
|
||||
<div class="together-icon">💬</div>
|
||||
<div class="together-info">
|
||||
<span class="together-title">群聊广场</span>
|
||||
<span class="together-desc">31人在一起</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="together-card" data-category-id="31" data-category-name="游戏组队">
|
||||
<div class="together-icon">👥</div>
|
||||
<div class="together-info">
|
||||
<span class="together-title">游戏组队</span>
|
||||
<span class="together-desc">开黑上分</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="together-card" data-category-id="32" data-category-name="纸飞机">
|
||||
<div class="together-icon">✈️</div>
|
||||
<div class="together-info">
|
||||
<span class="together-title">纸飞机</span>
|
||||
<span class="together-desc">聊天匹配</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -56,7 +56,7 @@ public class DrawGuessActivity extends BaseCategoryActivity {
|
|||
return true;
|
||||
}
|
||||
if (id == R.id.nav_wish_tree) {
|
||||
WishTreeWebViewActivity.start(this);
|
||||
WishTreeActivity.start(this);
|
||||
finish();
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -130,7 +130,7 @@ public class DynamicCommunityActivity extends AppCompatActivity {
|
|||
return true;
|
||||
}
|
||||
if (id == R.id.nav_wish_tree) {
|
||||
WishTreeWebViewActivity.start(this);
|
||||
WishTreeActivity.start(this);
|
||||
finish();
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@ public class FindGameActivity extends BaseCategoryActivity {
|
|||
return true;
|
||||
}
|
||||
if (id == R.id.nav_wish_tree) {
|
||||
WishTreeWebViewActivity.start(this);
|
||||
WishTreeActivity.start(this);
|
||||
finish();
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -139,7 +139,7 @@ public class FishPondActivity extends AppCompatActivity {
|
|||
return true;
|
||||
}
|
||||
if (id == R.id.nav_wish_tree) {
|
||||
WishTreeWebViewActivity.start(this);
|
||||
WishTreeActivity.start(this);
|
||||
finish();
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -133,7 +133,7 @@ public class FishPondWebViewActivity extends AppCompatActivity {
|
|||
return true;
|
||||
}
|
||||
if (id == R.id.nav_wish_tree) {
|
||||
WishTreeWebViewActivity.start(this);
|
||||
WishTreeActivity.start(this);
|
||||
finish();
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -107,7 +107,7 @@ public class HeartbeatSignalActivity extends AppCompatActivity {
|
|||
return true;
|
||||
}
|
||||
if (id == R.id.nav_wish_tree) {
|
||||
WishTreeWebViewActivity.start(this);
|
||||
WishTreeActivity.start(this);
|
||||
finish();
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -56,7 +56,7 @@ public class KTVTogetherActivity extends BaseCategoryActivity {
|
|||
return true;
|
||||
}
|
||||
if (id == R.id.nav_wish_tree) {
|
||||
WishTreeWebViewActivity.start(this);
|
||||
WishTreeActivity.start(this);
|
||||
finish();
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -108,7 +108,7 @@ public class MessagesActivity extends AppCompatActivity {
|
|||
return true;
|
||||
}
|
||||
if (id == R.id.nav_wish_tree) {
|
||||
WishTreeWebViewActivity.start(this);
|
||||
WishTreeActivity.start(this);
|
||||
finish();
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -56,7 +56,7 @@ public class OnlineDatingActivity extends BaseCategoryActivity {
|
|||
return true;
|
||||
}
|
||||
if (id == R.id.nav_wish_tree) {
|
||||
WishTreeWebViewActivity.start(this);
|
||||
WishTreeActivity.start(this);
|
||||
finish();
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -56,7 +56,7 @@ public class PeaceEliteActivity extends BaseCategoryActivity {
|
|||
return true;
|
||||
}
|
||||
if (id == R.id.nav_wish_tree) {
|
||||
WishTreeWebViewActivity.start(this);
|
||||
WishTreeActivity.start(this);
|
||||
finish();
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -146,7 +146,7 @@ public class ProfileActivity extends AppCompatActivity {
|
|||
return true;
|
||||
}
|
||||
if (id == R.id.nav_wish_tree) {
|
||||
WishTreeWebViewActivity.start(this);
|
||||
WishTreeActivity.start(this);
|
||||
finish();
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -123,7 +123,7 @@ public class ProfileWebViewActivity extends AppCompatActivity {
|
|||
return true;
|
||||
}
|
||||
if (id == R.id.nav_wish_tree) {
|
||||
WishTreeWebViewActivity.start(this);
|
||||
WishTreeActivity.start(this);
|
||||
finish();
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -56,7 +56,7 @@ public class TableGamesActivity extends BaseCategoryActivity {
|
|||
return true;
|
||||
}
|
||||
if (id == R.id.nav_wish_tree) {
|
||||
WishTreeWebViewActivity.start(this);
|
||||
WishTreeActivity.start(this);
|
||||
finish();
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -211,7 +211,7 @@ public class VoiceMatchActivity extends AppCompatActivity {
|
|||
return true;
|
||||
}
|
||||
if (id == R.id.nav_wish_tree) {
|
||||
WishTreeWebViewActivity.start(this);
|
||||
WishTreeActivity.start(this);
|
||||
finish();
|
||||
return true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -204,7 +204,7 @@ public class WorksAdapter extends RecyclerView.Adapter<WorksAdapter.WorksViewHol
|
|||
public void onResponse(retrofit2.Call<com.example.livestreaming.net.ApiResponse<Boolean>> call,
|
||||
retrofit2.Response<com.example.livestreaming.net.ApiResponse<Boolean>> response) {
|
||||
// 重新启用按钮
|
||||
like Icon.setEnabled(true);
|
||||
likeIcon.setEnabled(true);
|
||||
|
||||
if (response.isSuccessful() && response.body() != null && response.body().isOk()) {
|
||||
// 更新数据
|
||||
|
|
|
|||
BIN
android-app/img/麻将红中龙_1767927109.png
Normal file
BIN
android-app/img/麻将红中龙_1767927109.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.6 KiB |
Loading…
Reference in New Issue
Block a user