magic-csb/boluo-app-main
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: dev click, group list, swiper button

Browse Source
This commit is contained in:
eleanor.mao
2025-04-12 23:43:36 +08:00
parent c26c1c92fe
commit f86b4481d8
4 changed files with 51 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
src/fragments/profile/view/index.tsx
View File

@ -1,4 +1,4 @@
import { BaseEventOrig, Image, Swiper, SwiperItem, SwiperProps } from "@tarojs/components";
import { BaseEventOrig, Image, Swiper, SwiperItem, SwiperProps } from '@tarojs/components';
import Taro from '@tarojs/taro';
import classNames from 'classnames';
@ -138,28 +138,24 @@ export default function ProfileViewFragment(props: IProps) {
}, []);
const videoLength = videos.length ? videos.length : 0;
const showSwiperButton = videoLength > 1 && isDesktop;
const handleChange = useCallback((e: BaseEventOrig<onChangeEventDetail>)=> {
setCoverIndex(e.detail.current)
}, [])
const handleChange = useCallback((e: BaseEventOrig<onChangeEventDetail>) => {
setCoverIndex(e.detail.current);
}, []);
const handlePrev = useCallback(() => {
setCoverIndex(coverIndex ? coverIndex - 1 : videoLength - 1);
}, [coverIndex, videoLength]);
const handleNext = useCallback(() => {
setCoverIndex(coverIndex === videoLength- 1 ? 0 : coverIndex + 1);
}, [coverIndex,videoLength]);
setCoverIndex(coverIndex === videoLength - 1 ? 0 : coverIndex + 1);
}, [coverIndex, videoLength]);
return (
<div className={PREFIX}>
<div className={`${PREFIX}__header`}>
<Swiper
className={`${PREFIX}__header__swiper`}
current={coverIndex}
onChange={handleChange}
circular
>
<Swiper className={`${PREFIX}__header__swiper`} current={coverIndex} onChange={handleChange} circular>
{videos.map((cover, index) => (
<SwiperItem key={cover.coverUrl}>
<div className={`${PREFIX}__header__swiper-item`}>
@ -181,22 +177,24 @@ export default function ProfileViewFragment(props: IProps) {
</SwiperItem>
))}
</Swiper>
{videoLength > 1 &&
(<div className={`${PREFIX}__header__swiper-button__prev`} onClick={handlePrev}>
<Image
className={`${PREFIX}__header__swiper-button__image`}
mode="aspectFit"
src={require('@/statics/svg/arrow-left-thin.svg')}
/>
</div>)}
{videoLength > 1 &&
(<div className={`${PREFIX}__header__swiper-button__next`} onClick={handleNext}>
<Image
className={`${PREFIX}__header__swiper-button__image`}
mode="aspectFit"
src={require('@/statics/svg/arrow-right-thin.svg')}
/>
</div>)}
{showSwiperButton && (
<div className={`${PREFIX}__header__swiper-button__prev`} onClick={handlePrev}>
<Image
className={`${PREFIX}__header__swiper-button__image`}
mode="aspectFit"
src={require('@/statics/svg/arrow-left-thin.svg')}
/>
</div>
)}
{showSwiperButton && (
<div className={`${PREFIX}__header__swiper-button__next`} onClick={handleNext}>
<Image
className={`${PREFIX}__header__swiper-button__image`}
mode="aspectFit"
src={require('@/statics/svg/arrow-right-thin.svg')}
/>
</div>
)}
{editable && (
<div className={`${PREFIX}__header__edit-video`} onClick={handleEditVideo}>
编辑录屏
@ -227,7 +225,11 @@ export default function ProfileViewFragment(props: IProps) {
{dataGroup.map((data, index: number) => (
<div className={`${PREFIX}__info-group`} key={data.type}>
<div className={`${PREFIX}__info-group__header`}>
<div className={`${PREFIX}__info-group__header__title`}>{data.title}</div>
{index ? (
<div className={`${PREFIX}__info-group__header__title`}>{data.title}</div>
) : (
<DevDiv className={`${PREFIX}__info-group__header__title`} OnDev={onDev}>{data.title}</DevDiv>
)}
{editable && (
<div className={`${PREFIX}__info-group__header__edit`} onClick={() => handleEditGroupItem(data.type)}>
编辑