fix:大乱斗结算页面接口对接完成

This commit is contained in:
2026-05-09 14:24:28 +08:00
parent df4f8d8fd5
commit c4ad44b02a

View File

@@ -12,6 +12,8 @@ import { storeToRefs } from "pinia";
const store = useStore();
const { user } = storeToRefs(store);
/** 通过 store action 获取段位名称rank_lvl → 显示文字) */
const { getLvlName } = store;
/** 结算图片资源 CDN 前缀 */
const RESULT_CDN = "https://static.shelingxingqiu.com/shootmini/static/friend-battle-result";
@@ -102,32 +104,43 @@ const expPercent = computed(() =>
Math.min((expCurrent.value / expTotal.value) * 100, 100)
);
// ---- 大乱斗专属 Mock 数据(后期对接接口后替换)----
/**
* 是否为大乱斗模式mode > 3
*/
const isMeleeMode = computed(() => data.value.mode > 3);
/**
* 大乱斗排行榜模拟数据7 条,第 7 条半显示提示可滚动
* isSelf: true 表示当前登录用户所在行;后期改为与 user.value.id 比对
* 大乱斗排行榜列表(从接口 teams["0"].players + resultList 构建
* - 以 teams["0"].players 为全量玩家基础(包含未射击的玩家)
* - 从 resultList 中按 userId 匹配获取得分;未命中则 totalRing 为 0
* - 按 totalRing 降序排列后注入 rank
* @returns {{ id, rank, avatar, name, lvlName, totalRing, isSelf }[]}
*/
const mockMeleeRankList = ref([
{ id: 1001, rank: 1, avatar: "", name: "打酱油大声路过", lvlName: "钻石三级", totalRing: 100, isSelf: false },
{ id: 1002, rank: 2, avatar: "", name: "打酱油大声路过", lvlName: "钻石三级", totalRing: 100, isSelf: false },
{ id: 1003, rank: 3, avatar: "", name: "打酱油大声路过", lvlName: "钻石三级", totalRing: 100, isSelf: false },
{ id: 1004, rank: 4, avatar: "", name: "打酱油大声路过", lvlName: "钻石三级", totalRing: 100, isSelf: true },
{ id: 1005, rank: 5, avatar: "", name: "打酱油大声路过", lvlName: "钻石三级", totalRing: 100, isSelf: false },
{ id: 1006, rank: 6, avatar: "", name: "打酱油大声路过", lvlName: "钻石三级", totalRing: 100, isSelf: false },
{ id: 1007, rank: 7, avatar: "", name: "打酱油大声路过", lvlName: "钻石三级", totalRing: 100, isSelf: false },
]);
const meleeRankList = computed(() => {
const resultList = data.value.resultList || [];
const teamPlayers = data.value.teams?.[0]?.players || [];
if (!teamPlayers.length) return [];
/**
* 大乱斗模式开发预览开关true = 始终展示大乱斗态,方便不传 battleId 时预览样式)
* 对接接口后将此 ref 删除isMeleeMode 改为只依赖 data.value.mode
*/
const isMeleePreview = ref(true);
// 以 players 为基础merge resultList 得分数据
const list = teamPlayers.map((p) => {
const resultItem = resultList.find((r) => r.userId === p.id) || {};
return {
id: p.id,
avatar: p.avatar || "",
name: p.name || "",
// rank_lvl 字段可能缺失,缺失时显示空字符串,避免 getLvlName(undefined) 返回错误段位名
lvlName: p.rank_lvl != null ? getLvlName(p.rank_lvl) : "",
totalRing: resultItem.totalRing ?? 0,
isSelf: String(p.id) === String(user.value.id),
};
});
/**
* 是否为大乱斗模式mode > 3 或开发预览开关开启)
*/
const isMeleeMode = computed(() => isMeleePreview.value || data.value.mode > 3);
// 按总环数降序排列,环数相同时按 id 升序保证顺序稳定
list.sort((a, b) => b.totalRing - a.totalRing || a.id - b.id);
// 注入名次从1开始
return list.map((item, index) => ({ ...item, rank: index + 1 }));
});
/**
* 获取前三名行背景装饰 SVG 路径
@@ -152,10 +165,16 @@ function getMeleeAvatarBorderColor(rank) {
// ---- 生命周期 ----
onLoad(async (options) => {
if (!options.battleId) return;
// TODO: 调试用固定 battleId联调完成后删除 fallback
const battleId = options.battleId || "92368717727535104";
if (!battleId) return;
const result = await getBattleAPI(options.battleId);
const result = await getBattleAPI(battleId);
data.value = result;
// DEBUG: 打印接口原始数据,联调完成后删除
console.log("[friend-battle-result] raw result:", JSON.stringify(result));
console.log("[friend-battle-result] mode:", result.mode, "resultList:", result.resultList, "teams keys:", result.teams ? Object.keys(result.teams) : null);
console.log("[friend-battle-result] current user.id:", user.value.id, "type:", typeof user.value.id);
// 判断当前用户是否在胜利队伍中
// 优先使用接口返回的 winTeam 字段;若缺失则以队伍得分高低作为兜底判断
@@ -342,7 +361,7 @@ function goBack() {
<!-- 排行榜滚动列表显示 6.5 7 条半显示提示可滚动-->
<scroll-view class="melee-rank-scroll" scroll-y>
<view
v-for="item in mockMeleeRankList"
v-for="item in meleeRankList"
:key="item.id"
:class="['rank-item', item.isSelf ? 'rank-item-self' : '']"
>