4 Commits

6 changed files with 80 additions and 42 deletions

View File

@@ -189,7 +189,16 @@
font-weight: 600; font-weight: 600;
line-height: 24px; /* 150% */ line-height: 24px; /* 150% */
&-text {
flex: 1;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
&-arrow { &-arrow {
flex: 0 0 12px;
width: 12px; width: 12px;
height: 12px; height: 12px;
} }

View File

@@ -86,12 +86,12 @@ export default function OrganizerInfo(props) {
await LoginService.followUser(id); await LoginService.followUser(id);
} }
onUpdateUserInfo(); onUpdateUserInfo();
Taro.showToast({ (Taro as any).showToast({
title: `${nickname} ${follow ? "已取消关注" : "已关注"}`, title: `${nickname} ${follow ? "已取消关注" : "已关注"}`,
icon: "success", icon: "success",
}); });
} catch (e) { } catch (e) {
Taro.showToast({ (Taro as any).showToast({
title: `${nickname} ${follow ? "取消关注失败" : "关注失败"}`, title: `${nickname} ${follow ? "取消关注失败" : "关注失败"}`,
icon: "error", icon: "error",
}); });
@@ -195,7 +195,11 @@ export default function OrganizerInfo(props) {
> >
{/* game title */} {/* game title */}
<View className={styles["recommend-games-list-item-title"]}> <View className={styles["recommend-games-list-item-title"]}>
<Text>{game.title}</Text> <Text
className={styles["recommend-games-list-item-title-text"]}
>
{game.title}
</Text>
<Image <Image
className={ className={
styles["recommend-games-list-item-title-arrow"] styles["recommend-games-list-item-title-arrow"]

View File

@@ -12,7 +12,12 @@ import WechatLogo from "@/static/detail/wechat_icon.svg";
// import WechatTimeline from "@/static/detail/wechat_timeline.svg"; // import WechatTimeline from "@/static/detail/wechat_timeline.svg";
import LinkIcon from "@/static/detail/link.svg"; import LinkIcon from "@/static/detail/link.svg";
import CrossIcon from "@/static/detail/cross.svg"; import CrossIcon from "@/static/detail/cross.svg";
import { genNTRPRequirementText, navto, genGameLength } from "@/utils/helper"; import {
genNTRPRequirementText,
navto,
genGameLength,
formatGameStartTime,
} from "@/utils/helper";
import { waitForAuthInit } from "@/utils/authInit"; import { waitForAuthInit } from "@/utils/authInit";
import { useUserActions } from "@/store/userStore"; import { useUserActions } from "@/store/userStore";
import { OSS_BASE } from "@/config/api"; import { OSS_BASE } from "@/config/api";
@@ -107,7 +112,7 @@ export default forwardRef(({ id, from, detail, userInfo }, ref) => {
const startTime = dayjs(start_time); const startTime = dayjs(start_time);
const endTime = dayjs(end_time); const endTime = dayjs(end_time);
const dayofWeek = DayOfWeekMap.get(startTime.day()); const dayofWeek = DayOfWeekMap.get(startTime.day());
const gameLength = `${endTime.diff(startTime, "hour")}小时`; const gameLength = genGameLength(startTime, endTime);
const currentUserInfo = await ensureUserInfo(); const currentUserInfo = await ensureUserInfo();
try { try {
const url = await generateShareImage({ const url = await generateShareImage({
@@ -119,7 +124,7 @@ export default forwardRef(({ id, from, detail, userInfo }, ref) => {
skill_level_max, skill_level_max,
)}`, )}`,
gameDate: `${startTime.format("M月D日")} (${dayofWeek})`, gameDate: `${startTime.format("M月D日")} (${dayofWeek})`,
gameTime: `${startTime.format("ah")} ${gameLength}`, gameTime: `${formatGameStartTime(startTime)} ${gameLength}`,
venueName: location_name, venueName: location_name,
venueImages: image_list ? image_list : [], venueImages: image_list ? image_list : [],
}); });
@@ -133,11 +138,8 @@ export default forwardRef(({ id, from, detail, userInfo }, ref) => {
} }
} }
useShareAppMessage(async (res) => { useShareAppMessage(async () => {
await changeMessageType(); const url = shareImageUrl || (await generateShareImageUrl());
await ensureUserInfo();
const url = await generateShareImageUrl();
// console.log(res, "res");
return { return {
title: detail.title, title: detail.title,
imageUrl: url, imageUrl: url,
@@ -164,7 +166,6 @@ export default forwardRef(({ id, from, detail, userInfo }, ref) => {
const startTime = dayjs(start_time); const startTime = dayjs(start_time);
const endTime = dayjs(end_time); const endTime = dayjs(end_time);
const dayofWeek = DayOfWeekMap.get(startTime.day()); const dayofWeek = DayOfWeekMap.get(startTime.day());
// const gameLength = `${endTime.diff(startTime, "hour")}小时`;
const game_length = genGameLength(startTime, endTime); const game_length = genGameLength(startTime, endTime);
let qrCodeUrl = ""; let qrCodeUrl = "";
try { try {
@@ -193,7 +194,7 @@ export default forwardRef(({ id, from, detail, userInfo }, ref) => {
title, title,
locationName: location_name, locationName: location_name,
date: `${startTime.format("M月D日")} (${dayofWeek})`, date: `${startTime.format("M月D日")} (${dayofWeek})`,
time: `${startTime.format("ah")} ${game_length}`, time: `${formatGameStartTime(startTime)} ${game_length}`,
qrCodeUrl, qrCodeUrl,
}); });
} catch (e) { } catch (e) {

View File

@@ -14,7 +14,11 @@ import WechatLogo from "@/static/detail/wechat_icon.svg";
import WechatTimeline from "@/static/detail/wechat_timeline.svg"; import WechatTimeline from "@/static/detail/wechat_timeline.svg";
import { useUserActions } from "@/store/userStore"; import { useUserActions } from "@/store/userStore";
import { DayOfWeekMap } from "../detail/config"; import { DayOfWeekMap } from "../detail/config";
import { genNTRPRequirementText } from "@/utils/helper"; import {
genNTRPRequirementText,
genGameLength,
formatGameStartTime,
} from "@/utils/helper";
import { waitForAuthInit } from "@/utils/authInit"; import { waitForAuthInit } from "@/utils/authInit";
import { OSS_BASE } from "@/config/api"; import { OSS_BASE } from "@/config/api";
import styles from "./index.module.scss"; import styles from "./index.module.scss";
@@ -53,7 +57,7 @@ function SharePoster(props) {
const startTime = dayjs(start_time); const startTime = dayjs(start_time);
const endTime = dayjs(end_time); const endTime = dayjs(end_time);
const dayofWeek = DayOfWeekMap.get(startTime.day()); const dayofWeek = DayOfWeekMap.get(startTime.day());
const gameLength = `${endTime.diff(startTime, "hour")}小时`; const gameLength = genGameLength(startTime, endTime);
Taro.showLoading({ title: "生成中..." }); Taro.showLoading({ title: "生成中..." });
const qrCodeUrlRes = await DetailService.getQrCodeUrl({ const qrCodeUrlRes = await DetailService.getQrCodeUrl({
page: "game_pages/detail/index", page: "game_pages/detail/index",
@@ -77,7 +81,7 @@ function SharePoster(props) {
title, title,
locationName: location_name, locationName: location_name,
date: `${startTime.format("M月D日")} (${dayofWeek})`, date: `${startTime.format("M月D日")} (${dayofWeek})`,
time: `${startTime.format("ah")} ${gameLength}`, time: `${formatGameStartTime(startTime)} ${gameLength}`,
qrCodeUrl, qrCodeUrl,
}); });
Taro.hideLoading(); Taro.hideLoading();

View File

@@ -164,3 +164,12 @@ export function genGameLength(startTime: Dayjs, endTime: Dayjs) {
// 保留一位小数去除末尾的0 // 保留一位小数去除末尾的0
return `${parseFloat(totalHours.toFixed(1))}小时`; return `${parseFloat(totalHours.toFixed(1))}小时`;
} }
export function formatGameStartTime(startTime: Dayjs) {
if (!startTime || !startTime.isValid()) {
return "";
}
const hour = startTime.hour();
const minute = startTime.minute();
return minute === 0 ? `${hour}` : `${hour}${minute}`;
}

View File

@@ -115,16 +115,25 @@ function with_cache_bust(url: string): string {
// 工具函数 - OffscreenCanvas 下加载图片(使用 offscreen.createImage // 工具函数 - OffscreenCanvas 下加载图片(使用 offscreen.createImage
const loadImage = (src: string): Promise<any> => { const loadImage = (src: string): Promise<any> => {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
let timer: ReturnType<typeof setTimeout> | null = null
try { try {
const off = runtime.offscreen const off = runtime.offscreen
if (!off || typeof off.createImage !== 'function') { if (!off || typeof off.createImage !== 'function') {
throw new Error('OffscreenCanvas 未初始化或不支持 createImage') throw new Error('OffscreenCanvas 未初始化或不支持 createImage')
} }
const img = off.createImage() const img = off.createImage()
img.onload = () => resolve(img) timer = setTimeout(() => reject(new Error(`图片加载超时: ${src}`)), 8000)
img.onerror = reject img.onload = () => {
if (timer) clearTimeout(timer)
resolve(img)
}
img.onerror = (e: any) => {
if (timer) clearTimeout(timer)
reject(e)
}
img.src = with_cache_bust(src) img.src = with_cache_bust(src)
} catch (e) { } catch (e) {
if (timer) clearTimeout(timer)
reject(e) reject(e)
} }
}) })
@@ -413,7 +422,7 @@ const drawShareCard = async (ctx: any, data: ShareCardData, offscreen: any): Pro
ctx.restore() ctx.restore()
} catch (error) { } catch (error) {
// 如果头像加载失败,绘制默认头像 // 如果头像加载失败,绘制默认头像
ctx.setFillStyle('#CCCCCC') ctx.fillStyle = '#CCCCCC'
ctx.beginPath() ctx.beginPath()
ctx.arc(avatarX + avatarSize / 2, avatarY + avatarSize / 2, avatarSize / 2, 0, 2 * Math.PI) ctx.arc(avatarX + avatarSize / 2, avatarY + avatarSize / 2, avatarSize / 2, 0, 2 * Math.PI)
ctx.fill() ctx.fill()
@@ -594,10 +603,12 @@ export async function generateShareImage(data: ShareCardData): Promise<string> {
// 记录到 runtime供 loadImage 使用) // 记录到 runtime供 loadImage 使用)
runtime.offscreen = offscreen runtime.offscreen = offscreen
isDrawing = true isDrawing = true
try {
const imagePath = await drawShareCard(ctx, data, offscreen) const imagePath = await drawShareCard(ctx, data, offscreen)
isDrawing = false
return imagePath return imagePath
} finally {
isDrawing = false
}
} }
export default generateShareImage export default generateShareImage