Compare commits
4 Commits
fix/jgh/03
...
8090d679b4
| Author | SHA1 | Date | |
|---|---|---|---|
| 8090d679b4 | |||
| 4965d6c40e | |||
| 56fb3ade00 | |||
| 8c6fb1190e |
@@ -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;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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"]
|
||||||
|
|||||||
@@ -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) {
|
||||||
|
|||||||
@@ -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();
|
||||||
|
|||||||
@@ -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}分`;
|
||||||
|
}
|
||||||
|
|||||||
@@ -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
|
||||||
|
|||||||
Reference in New Issue
Block a user