以下是基于“东莞梦幻网络科技”的体育即时比分系统收藏界面的技术实现方案，包括后端（PHP + ThinkPHP）、安卓（Java）、iOS（Objective-C）和PC/H5前端（Vue.js）的代码示例。
技术架构
后端（PHP + ThinkPHP）：提供API接口，处理数据存储、用户管理、比赛数据获取等功能。
安卓端（Java）：调用后端API，展示比赛列表，并实现收藏功能。
iOS端（Objective-C）：实现与安卓端类似的功能，提供比赛数据展示和收藏功能。
PC/H5前端（Vue.js）：基于Vue3 + Element UI 实现收藏比赛列表、赛事展示等功能。
代码实现
（1）后端（ThinkPHP）
<?php
namespace app\controller;
use think\Request;
use think\Db;
class MatchController {
// 获取比赛数据（支持收藏筛选）
public function getMatchList(Request $request) {
$userId = $request->param('user_id');
$isFavorite = $request->param('favorite', 0); // 0: 全部 1: 仅收藏
$query = Db::table('matches')
->alias('m')
->field('m.id, m.time, m.team_home, m.team_away, m.status, f.id as favorite')
->leftJoin('favorites f', 'm.id = f.match_id AND f.user_id = '.$userId);
if ($isFavorite) {
$query->whereNotNull('f.id');
}
$matches = $query->order('m.time', 'asc')->select();
return json(['code' => 200, 'data' => $matches]);
}
// 收藏比赛
public function toggleFavorite(Request $request) {
$userId = $request->param('user_id');
$matchId = $request->param('match_id');
$exists = Db::table('favorites')->where('user_id', $userId)->where('match_id', $matchId)->find();
if ($exists) {
Db::table('favorites')->where('user_id', $userId)->where('match_id', $matchId)->delete();
return json(['code' => 200, 'message' => '取消收藏']);
} else {
Db::table('favorites')->insert(['user_id' => $userId, 'match_id' => $matchId]);
return json(['code' => 200, 'message' => '收藏成功']);
}
}
}
（2）安卓端（Java）
public void fetchMatchList(boolean favoriteOnly) {
ApiService apiService = RetrofitClient.getInstance().create(ApiService.class);
Call<ApiResponse<List<Match>>> call = apiService.getMatchList(userId, favoriteOnly ? 1 : 0);
call.enqueue(new Callback<ApiResponse<List<Match>>>() {
@Override
public void onResponse(Call<ApiResponse<List<Match>>> call, Response<ApiResponse<List<Match>>> response) {
if (response.isSuccessful() && response.body() != null) {
matchListAdapter.updateData(response.body().getData());
}
}
@Override
public void onFailure(Call<ApiResponse<List<Match>>> call, Throwable t) {
Log.e("API_ERROR", "Failed to fetch matches");
}
});
}
public void toggleFavorite(int matchId) {
ApiService apiService = RetrofitClient.getInstance().create(ApiService.class);
Call<ApiResponse<String>> call = apiService.toggleFavorite(userId, matchId);
call.enqueue(new Callback<ApiResponse<String>>() {
@Override
public void onResponse(Call<ApiResponse<String>> call, Response<ApiResponse<String>> response) {
if (response.isSuccessful() && response.body() != null) {
fetchMatchList(false); // 刷新比赛列表
}
}
@Override
public void onFailure(Call<ApiResponse<String>> call, Throwable t) {
Log.e("API_ERROR", "Failed to update favorite");
}
});
}
（3）iOS端（Objective-C ）
- (void)fetchMatchList:(BOOL)favoriteOnly {
NSDictionary *params = @{
@"user_id": userId, @"favorite": @(favoriteOnly ? 1 : 0)};
AFHTTPSessionManager *manager = [AFHTTPSessionManager manager];
[manager GET:@"http://yourserver.com/api/match/list" parameters:params headers:nil progress:nil success:^(NSURLSessionDataTask * _Nonnull task, id _Nullable responseObject) {
self.matches = responseObject[@"data"];
[self.tableView reloadData];
} failure:^(NSURLSessionDataTask * _Nullable task, NSError * _Nonnull error) {
NSLog(@"API Error: %@", error.localizedDescription);
}];
}
- (void)toggleFavorite:(NSInteger)matchId {
NSDictionary *params = @{
@"user_id": userId, @"match_id": @(matchId)};
AFHTTPSessionManager *manager = [AFHTTPSessionManager manager];
[manager POST:@"http://yourserver.com/api/match/toggleFavorite" parameters:params headers:nil progress:nil success:^(NSURLSessionDataTask * _Nonnull task, id _Nullable responseObject) {
[self fetchMatchList:NO]; // 刷新列表
} failure:^(NSURLSessionDataTask * _Nullable task, NSError * _Nonnull error) {
NSLog(@"API Error: %@", error.localizedDescription);
}];
}
（4）PC/H5前端（Vue.js）
<template>
<div>
<el-switch v-model="favoriteOnly" active-text="仅显示收藏" @change="fetchMatches" />
<el-table :data="matches">
<el-table-column prop="time" label="时间" />
<el-table-column prop="team_home" label="主队" />
<el-table-column prop="team_away" label="客队" />
<el-table-column label="操作">
<template #default="{ row }">
<el-button :type="row.favorite ? 'danger' : 'primary'" @click="toggleFavorite(row.id)">
{
{ row.favorite ? '取消收藏' : '收藏' }}
</el-button>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
import axios from "axios";
export default {
data() {
return {
matches: [],
favoriteOnly: false,
};
},
mounted() {
this.fetchMatches();
},
methods: {
fetchMatches() {
axios
.get("/api/match/list", {
params: {
user_id: 1, favorite: this.favoriteOnly ? 1 : 0 } })
.then((res) => {
this.matches = res.data.data;
});
},
toggleFavorite(matchId) {
axios.post("/api/match/toggleFavorite", {
user_id: 1, match_id: matchId }).then(() => {
this.fetchMatches();
});
},
},
};
</script>
