This commit is contained in:
2025-12-07 01:11:40 +08:00
parent bbb5170802
commit f5a4cd5a37
7 changed files with 110 additions and 20 deletions

View File

@@ -228,11 +228,35 @@
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
position: relative;
& > .input { & > .input {
width: 100%; width: 100%;
// height: 24px; // height: 24px;
} }
.limit {
position: absolute;
bottom: 0;
right: 0;
color: #3c3c43;
font-size: 12px;
font-weight: 400;
font-feature-settings: "liga" off, "clig" off;
font-family: "PingFang SC";
// background: #fff;
background: linear-gradient(
90deg,
rgba(255, 255, 255, 0.8) 0%,
#fff 100%
);
z-index: 999;
padding: 3px 4px 3px 4px;
&.red {
color: red;
}
}
} }
.sendIcon { .sendIcon {

View File

@@ -100,6 +100,9 @@ const CommentInput = forwardRef<CommentInputRef, CommentInputProps>(function (
toast("评论内容不得为空"); toast("评论内容不得为空");
return; return;
} }
if (value.length > 200) {
return;
}
onConfirm?.({ content: value, ...params }); onConfirm?.({ content: value, ...params });
onClose(); onClose();
} }
@@ -139,10 +142,18 @@ const CommentInput = forwardRef<CommentInputRef, CommentInputProps>(function (
confirmType="send" confirmType="send"
onConfirm={handleSend} onConfirm={handleSend}
focus focus
maxlength={100} maxlength={-1}
autoHeight autoHeight
showCount // showCount
/> />
<View
className={classnames(
styles.limit,
value.length > 200 ? styles.red : ""
)}
>
<Text>{value.length}</Text>/<Text>200</Text>
</View>
</View> </View>
<View className={styles.sendIcon} onClick={handleSend}> <View className={styles.sendIcon} onClick={handleSend}>
<Image className={styles.sendImage} src={sendImg} /> <Image className={styles.sendImage} src={sendImg} />
@@ -188,6 +199,8 @@ function CommentItem(props: {
const currentUserInfo = useUserInfo(); const currentUserInfo = useUserInfo();
// 判断评论的作者是否是组织者 // 判断评论的作者是否是组织者
const isGamePublisher = publisher_id === comment.user.id; const isGamePublisher = publisher_id === comment.user.id;
// 当前用户是否是球局发布者
const currentIsGamePublisher = publisher_id === currentUserInfo.id;
// 判断当前登录用户是否是评论的作者 // 判断当前登录用户是否是评论的作者
const isCommentPublisher = currentUserInfo.id === comment.user.id; const isCommentPublisher = currentUserInfo.id === comment.user.id;
return ( return (
@@ -251,7 +264,7 @@ function CommentItem(props: {
> >
<Text></Text> <Text></Text>
</View> </View>
{(isGamePublisher || isCommentPublisher) && ( {(currentIsGamePublisher || isCommentPublisher) && (
<View <View
className={styles.delete} className={styles.delete}
onClick={() => onClick={() =>
@@ -294,10 +307,15 @@ function CommentItem(props: {
} }
export default forwardRef(function Comments( export default forwardRef(function Comments(
props: { game_id: number; publisher_id: number; message_id?: number }, props: {
game_id: number;
publisher_id: number;
message_id?: number;
onScrollTo: (id: string) => void;
},
ref ref
) { ) {
const { game_id, publisher_id, message_id } = props; const { game_id, publisher_id, message_id, onScrollTo } = props;
const [comments, setComments] = useState<Comment[]>([]); const [comments, setComments] = useState<Comment[]>([]);
const inputRef = useRef<CommentInputRef>(null); const inputRef = useRef<CommentInputRef>(null);
const [blink_id, setBlinkId] = useState<number | undefined>(); const [blink_id, setBlinkId] = useState<number | undefined>();
@@ -350,17 +368,22 @@ export default forwardRef(function Comments(
if (item.id !== parent_id) return item; if (item.id !== parent_id) return item;
return { return {
...item, ...item,
replies: [res.data, ...item.replies], replies: [res.data, ...item.replies].sort((a, b) =>
dayjs(a.create_time).isAfter(dayjs(b.create_time))
? 1
: -1
),
}; };
}); });
}); });
} }
} }
await delay(100); await delay(200);
Taro.pageScrollTo({ onScrollTo?.(`#comment_id_${res.data.id}`);
selector: `#comment_id_${res.data.id}`, // Taro.pageScrollTo({
duration: 300, // selector: `#comment_id_${res.data.id}`,
}); // duration: 300,
// });
setBlinkId(res.data.id); setBlinkId(res.data.id);
setTimeout(() => { setTimeout(() => {
setBlinkId(undefined); setBlinkId(undefined);

View File

@@ -24,13 +24,24 @@
align-items: center; align-items: center;
gap: 4px; gap: 4px;
border-radius: 12px; border-radius: 12px;
// border: 0.5px solid rgba(255, 255, 255, 0.08); border: 0.5px solid rgba(255, 255, 255, 0.08);
background: rgba(255, 255, 255, 0.25); background: rgba(255, 255, 255, 0.25);
overflow: hidden; overflow: hidden;
color: #fff; color: #fff;
background: #536272; // background: #536272;
flex-shrink: 0; flex-shrink: 0;
font-family: "Quicksand"; font-family: "Quicksand";
// opacity: 0;
animation: intro 0.3s ease-in forwards;
@keyframes intro {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.month { .month {
width: 100%; width: 100%;
@@ -44,6 +55,8 @@
// border-bottom: 1px solid rgba(255, 255, 255, 0.08); // border-bottom: 1px solid rgba(255, 255, 255, 0.08);
background: #7b828b; background: #7b828b;
font-weight: 600; font-weight: 600;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
background: rgba(255, 255, 255, 0.25);
} }
.day { .day {
@@ -144,13 +157,23 @@
border-radius: 12px; border-radius: 12px;
padding: 14px; padding: 14px;
box-sizing: border-box; box-sizing: border-box;
background: #4d5865; // background: #4d5865;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
overflow: hidden; overflow: hidden;
// border: 0.5px solid rgba(255, 255, 255, 0.08); border: 0.5px solid rgba(255, 255, 255, 0.08);
// background: rgba(255, 255, 255, 0.25); background: rgba(255, 255, 255, 0.25);
animation: intro 0.3s ease-in forwards;
@keyframes intro {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
&-image { &-image {
width: 20px; width: 20px;

View File

@@ -189,6 +189,8 @@ function Index() {
); );
} }
const [scrollToTarget, setScrollToTarget] = useState("");
return ( return (
<ScrollView <ScrollView
className={styles["detail-page"]} className={styles["detail-page"]}
@@ -199,6 +201,8 @@ function Index() {
}} }}
enhanced enhanced
showScrollbar={false} showScrollbar={false}
scrollIntoView={scrollToTarget}
scroll-with-animation
> >
{/* custom navbar */} {/* custom navbar */}
<View <View
@@ -278,6 +282,7 @@ function Index() {
game_id={Number(detail.id)} game_id={Number(detail.id)}
message_id={message_id ? Number(message_id) : undefined} message_id={message_id ? Number(message_id) : undefined}
publisher_id={Number(detail.publisher_id)} publisher_id={Number(detail.publisher_id)}
onScrollTo={setScrollToTarget}
/> />
{/* sticky bottom action bar */} {/* sticky bottom action bar */}
<StickyBottom <StickyBottom

View File

@@ -160,15 +160,18 @@
color: #000; color: #000;
font-feature-settings: "liga" off, "clig" off; font-feature-settings: "liga" off, "clig" off;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap;
font-family: "PingFang SC"; font-family: "PingFang SC";
font-size: 16px; font-size: 16px;
font-style: normal; font-style: normal;
font-weight: 600; font-weight: 600;
line-height: 24px; /* 150% */ line-height: 24px; /* 150% */
flex: 1;
min-width: 0;
} }
.payNum { .payNum {
width: 90px; width: 120px;
font-feature-settings: "liga" off, "clig" off; font-feature-settings: "liga" off, "clig" off;
font-family: "PingFang SC"; font-family: "PingFang SC";
font-size: 12px; font-size: 12px;
@@ -176,6 +179,9 @@
font-weight: 600; font-weight: 600;
line-height: 26px; line-height: 26px;
text-align: right; text-align: right;
display: flex;
justify-content: flex-end;
gap: 6px;
&.paid { &.paid {
color: #000; color: #000;
} }
@@ -183,6 +189,10 @@
&.pending { &.pending {
color: #ff3b30; color: #ff3b30;
} }
.amount {
font-size: 16px;
}
} }
} }

View File

@@ -336,7 +336,9 @@ const OrderList = () => {
? "待支付" ? "待支付"
: refundTextMap.get(item.refund_status)} : refundTextMap.get(item.refund_status)}
</Text>{" "} </Text>{" "}
¥ <Text>{item.amount}</Text> <View className={styles.amount}>
¥ <Text>{item.amount}</Text>
</View>
</View> </View>
)} )}
</View> </View>

View File

@@ -6,13 +6,14 @@ export function getOrderStatus(orderData) {
return 'none' return 'none'
} }
const unPay = order_status === OrderStatus.PENDING && ([CancelType.NONE].includes(cancel_type)); const unPay = order_status === OrderStatus.PENDING && ([CancelType.NONE].includes(cancel_type));
const refund = [RefundStatus.PENDING, RefundStatus.SUCCESS].includes(refund_status); const refund = [RefundStatus.SUCCESS].includes(refund_status);
const refunding = [RefundStatus.PENDING].includes(refund_status);
const expired = const expired =
order_status === OrderStatus.FINISHED; order_status === OrderStatus.FINISHED;
const canceled = [CancelType.TIMEOUT, CancelType.USER].includes(cancel_type); const canceled = [CancelType.TIMEOUT, CancelType.USER].includes(cancel_type);
return unPay ? 'unpay' : refund ? 'refund' : canceled ? 'canceled' : expired ? 'expired' : 'progress' return unPay ? 'unpay' : refund ? 'refund' : canceled ? 'canceled' : expired ? 'expired' : refunding ? 'refunding' : 'progress'
} }
// scene: list、detail // scene: list、detail
@@ -59,6 +60,7 @@ export function generateOrderActions(orderData, actions, scene) {
['expired', [deleteOrder, gameDetail]], ['expired', [deleteOrder, gameDetail]],
['progress', [quitGame, gameDetail]], ['progress', [quitGame, gameDetail]],
['refund', [deleteOrder, gameDetail]], ['refund', [deleteOrder, gameDetail]],
['refunding', [gameDetail]],
['unpay', [cancelOrder, payNow]] ['unpay', [cancelOrder, payNow]]
]) ])
return actionMap.get(key) return actionMap.get(key)
@@ -70,6 +72,7 @@ export function generateOrderActions(orderData, actions, scene) {
['expired', [gameDetail, deleteOrder]], ['expired', [gameDetail, deleteOrder]],
['progress', [gameDetail, quitGame]], ['progress', [gameDetail, quitGame]],
['refund', [deleteOrder, gameDetail]], ['refund', [deleteOrder, gameDetail]],
['refunding', [gameDetail]],
['unpay', [cancelOrder]] ['unpay', [cancelOrder]]
]) ])
return actionMap.get(key) return actionMap.get(key)