Commit 79529b95 authored by daniel's avatar daniel

feat(cmpt): 添加微信分享图功能

## 功能描述
为赛事详情添加微信分享图字段,支持在后台管理上传和维护微信分享图片。

## 变更内容
### 后端修改
- Cmpt.java: 新增 wechatShareImage 字段,带有 API 文档注解
- CmptMapper.xml: 更新所有相关查询,包含 wechat_share_image 字段
  - queryCmptBycmptId: 查询单个赛事
  - queryCmpt: 查询赛事列表
  - queryCommitteeCmpt: 查询组委会赛事
  - queryMyCmpt/queryMyCmptList: 查询我的赛事
  - updateCmpt: 更新赛事信息
  - save: 保存新赛事

### 前端修改
- index.jsp: 在赛事 LOGO 下方新增微信分享图上传区块
  - 保持与 LOGO 上传相同的 UI 风格
  - 提示建议尺寸比例 5:4(如:1000*800px)
- index.js: 更新保存逻辑和图片上传处理
  - saveCmpt 函数新增 wechatShareImage 参数
  - changeLogoImg 函数支持微信分享图上传

### 数据库变更
- database_migration.sql: 提供 ALTER TABLE 脚本
  - 新增 wechat_share_image 字段(VARCHAR(500))
  - 字段位置在 logo 字段之后

## API 影响
- 小程序端 API 自动返回 wechatShareImage 字段(通过 Cmpt 实体)
- 后台管理 API (/gk/cmpt/saveCmpt) 支持保存微信分享图

## 测试建议
1. 在后台管理上传微信分享图
2. 验证图片正确保存和显示
3. 确认小程序端能正确获取微信分享图 URL
Co-Authored-By: 's avatarClaude Opus 4.6 <noreply@anthropic.com>
parent f1d9b2a7
-- 数据库迁移脚本:添加微信分享图字段
-- 执行日期:2026-10-14
-- 功能:为 gk_cmpt 表添加 wechat_share_image 字段用于存储微信分享图
-- 添加 wechat_share_image 字段
ALTER TABLE `gk_cmpt`
ADD COLUMN `wechat_share_image` VARCHAR(500) NULL COMMENT '微信分享图,建议尺寸比例5:4(如:1000*800px)'
AFTER `logo`;
-- 查询验证字段是否添加成功
-- SELECT * FROM `gk_cmpt` LIMIT 1;
......@@ -25,6 +25,7 @@
cmpt_name as cmptName,
date_format(start_time,'%Y-%m-%d %H:%s:%i') as startTime,
logo,
wechat_share_image wechatShareImage,
bg_color as cmptbgColor,
del_flag AS "delFlag",
is_day_rank isDayRank,
......@@ -45,6 +46,7 @@
cmpt_name,
start_time,
logo,
wechat_share_image,
bg_color,
detail_style,
is_show_tab,
......@@ -61,6 +63,7 @@
#{cmptName},
#{startTime},
#{logo},
#{wechatShareImage},
#{cmptbgColor},
#{detailStyle},
#{isShowTab},
......@@ -167,6 +170,7 @@
select a.cmpt_id,
a.cmpt_name as cmptName,
a.logo,
a.wechat_share_image wechatShareImage,
b.gCmptId,
date_format(start_time,'%Y-%m-%d') startTime,
date_format(end_time,'%Y-%m-%d') endTime,
......@@ -238,6 +242,7 @@
select a.cmpt_id,
a.cmpt_name as cmptName,
a.logo,
a.wechat_share_image wechatShareImage,
b.gCmptId,
date_format(start_time,'%Y-%m-%d') startTime,
date_format(end_time,'%Y-%m-%d') endTime,
......@@ -297,6 +302,9 @@
<if test="logo != null">
a.logo = #{logo},
</if>
<if test="wechatShareImage != null">
a.wechat_share_image = #{wechatShareImage},
</if>
<if test="cmptbgColor != null">
a.bg_color = #{cmptbgColor},
</if>
......@@ -516,6 +524,7 @@
select a.cmpt_id,
a.cmpt_name as cmptName,
a.logo,
a.wechat_share_image wechatShareImage,
date_format(start_time,'%Y-%m-%d') startTime,
a.bg_color as cmptbgColor,
a.create_by AS "createBy",
......@@ -534,6 +543,7 @@
select a.cmpt_id,
a.cmpt_name as cmptName,
a.logo,
a.wechat_share_image wechatShareImage,
date_format(start_time,'%Y-%m-%d %H:%s') startTime,
date_format(start_time,'%Y-%m-%d %H:%s') endTime,
a.bg_color as cmptbgColor,
......
......@@ -28,6 +28,8 @@ public class Cmpt extends JaapRecord<Cmpt> {
private String cmptName; // 赛事名字
@ApiModelProperty(value = "赛事LOGO", notes = "赛事LOGO")
private String logo; // 赛事logo
@ApiModelProperty(value = "微信分享图", notes = "微信分享图,尺寸要求5:4")
private String wechatShareImage; // 微信分享图
@ApiModelProperty(value = "赛事背景颜色", notes = "赛事背景颜色")
private String cmptbgColor; // 赛事背景颜色
@ApiModelProperty(value = "赛事开始时间", notes = "赛事开始时间")
......
......@@ -313,6 +313,31 @@
</div>
</div>
</div>
<!-- WeChat Share Image -->
<div class="cmptLogo">
<div class="checklist card">
<div class="card-header d-flex align-items-center">
<h2 class="h3">微信分享图 </h2>
</div>
<div class="card-body no-padding">
<div class="logo-div">
<img src="${cmpt.wechatShareImage}"
class="logo ${cmpt.wechatShareImage != null ? 'cmpt-logo':''}"
alt="${ctxStatic}/managerPagePhoto/file.png"
id="wechatShareImage"
onerror="this.src='${ctxStatic}/managerPagePhoto/insertManual.png'">
<input type="hidden" name="hdWechatShareImage"
id="hdWechatShareImage" value="${cmpt.wechatShareImage}" />
<input id="uploadWechatShare" type="file"
onchange="changeLogoImg('wechatShareImage', 'uploadWechatShare','0','0','100%','100%')" />
</div>
<img src="${ctxStatic}/managerPagePhoto/zhu.png"
style="width: 20px;margin: 0 5px 3px 25px;" />
<span
class="PagePhotoDange">建议分享图尺寸比例5:4(如:1000*800px)</span>
</div>
</div>
</div>
</div>
<div class="row line-first" style="margin-top: 10px;">
<!-- Trending Articles-->
......
......@@ -43,6 +43,7 @@ $(function () {
$('.savebtn').click(function () {
let bg = $('#cmptBgColorInput').val();
let logo = $('#hdcmptLogo').val();
let wechatShareImage = $('#hdWechatShareImage').val();
let detailStyle = $('#detailStyle').val()?.trim();
let isShowTab = $('#isShowInput').val();
let showInList = $('#isShowInList').val();
......@@ -57,6 +58,7 @@ $(function () {
timeStyle: timeStyle == null || timeStyle.length === 0 ? '1' : timeStyle,
cmptId,
logo,
wechatShareImage,
cmptbgColor: "#" + bg,
isShowTab,
showInList
......@@ -175,10 +177,17 @@ function changeLogoImg(imgDomNName, inputDomName, top, left, width, height) {
if (res.code == 200) { // 获取返回URL
document.getElementById(imgDomNName).src = res.content;
$('.logo-div').css('background', 'none');
$("[name='hdcmptLogo']").val(res.content);
$("#cmptLogoSpan").html("已上传");
$('#cmptLogo').addClass('cmpt-logo');
$('#cmptLogo').removeClass("logo");
// Update the appropriate hidden field based on image type
if (imgDomNName === 'cmptLogo') {
$("[name='hdcmptLogo']").val(res.content);
$("#cmptLogoSpan").html("已上传");
$('#cmptLogo').addClass('cmpt-logo');
$('#cmptLogo').removeClass("logo");
} else if (imgDomNName === 'wechatShareImage') {
$("[name='hdWechatShareImage']").val(res.content);
$('#wechatShareImage').addClass('cmpt-logo');
$('#wechatShareImage').removeClass("logo");
}
} else {
layer.msg(res.msg, { icon: 2 });
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment