feat: dev click, group list, swiper button

src/fragments/profile/view/index.tsx

@@ -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>)=> {
+  const handleChange = useCallback((e: BaseEventOrig<onChangeEventDetail>) => {
-    setCoverIndex(e.detail.current)
+    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);
+    setCoverIndex(coverIndex === videoLength - 1 ? 0 : coverIndex + 1);
-  }, [coverIndex,videoLength]);
+  }, [coverIndex, videoLength]);
 
   return (
     <div className={PREFIX}>
       <div className={`${PREFIX}__header`}>
-        <Swiper
+        <Swiper className={`${PREFIX}__header__swiper`} current={coverIndex} onChange={handleChange} circular>
-          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 &&
+        {showSwiperButton && (
-          (<div className={`${PREFIX}__header__swiper-button__prev`} onClick={handlePrev}>
+          <div className={`${PREFIX}__header__swiper-button__prev`} onClick={handlePrev}>
-          <Image
+            <Image
-            className={`${PREFIX}__header__swiper-button__image`}
+              className={`${PREFIX}__header__swiper-button__image`}
-            mode="aspectFit"
+              mode="aspectFit"
-            src={require('@/statics/svg/arrow-left-thin.svg')}
+              src={require('@/statics/svg/arrow-left-thin.svg')}
-          />
+            />
-        </div>)}
+          </div>
-        {videoLength > 1 &&
+        )}
-          (<div className={`${PREFIX}__header__swiper-button__next`} onClick={handleNext}>
+        {showSwiperButton && (
-          <Image
+          <div className={`${PREFIX}__header__swiper-button__next`} onClick={handleNext}>
-            className={`${PREFIX}__header__swiper-button__image`}
+            <Image
-            mode="aspectFit"
+              className={`${PREFIX}__header__swiper-button__image`}
-            src={require('@/statics/svg/arrow-right-thin.svg')}
+              mode="aspectFit"
-          />
+              src={require('@/statics/svg/arrow-right-thin.svg')}
-        </div>)}
+            />
+          </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)}>
                   编辑

src/pages/group-v2/index.tsx

@@ -29,28 +29,28 @@ const CALC_LIST_PROPS: IUseListHeightProps = {
 };
 const GROUPS: GroupItem[] = [
   { title: '【杭州】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc223f495e159af95e' },
-  { title: '【上海】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc4189e68429cf07f8' },
-  { title: '【南京】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcc6dc8d0a9692b70e' },
-  { title: '【合肥】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc41c9785cc2035277' },
-  { title: '【苏州】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc4642f90a6e3528ff' },
-  { title: '【温州】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcb0ea5f197a18b335' },
   { title: '【广州】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcb4b88b8abb7a7c8b' },
   { title: '【深圳】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcfe70d8736e14bb64' },
-  { title: '【佛山】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcfac1132df386fac8' },
-  { title: '【东莞】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcb2b0e39026f7dddc' },
-  { title: '【厦门】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc2007a895cb48464b' },
-  { title: '【福州】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc126483dedadde82b' },
-  { title: '【泉州】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc4c8c42b1a9337aaf' },
   { title: '【北京】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcb119c94575e91262' },
-  { title: '【青岛】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfce8d7a68190f6a1d2' },
+  { title: '【上海】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc4189e68429cf07f8' },
-  { title: '【天津】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcda46c23dade6f6a3' },
-  { title: '【长沙】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc76be8f2b3f8aa437' },
-  { title: '【武汉】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc047c94f8c709b395' },
   { title: '【郑州】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcd1c53b7bf8ecdb97' },
+  { title: '【长沙】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc76be8f2b3f8aa437' },
   { title: '【成都】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcf75cefbdc62946fa' },
   { title: '【重庆】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcd7008f747d545f83' },
-  { title: '【昆明】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcf2aebcbf3d46d9cd' },
+  { title: '【武汉】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc047c94f8c709b395' },
+  { title: '【厦门】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc2007a895cb48464b' },
   { title: '【西安】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc34768971b7354220' },
+  { title: '【合肥】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc41c9785cc2035277' },
+  { title: '【南京】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcc6dc8d0a9692b70e' },
+  { title: '【青岛】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfce8d7a68190f6a1d2' },
+  { title: '【佛山】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcfac1132df386fac8' },
+  { title: '【东莞】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcb2b0e39026f7dddc' },
+  { title: '【苏州】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc4642f90a6e3528ff' },
+  { title: '【福州】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc126483dedadde82b' },
+  { title: '【泉州】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfc4c8c42b1a9337aaf' },
+  { title: '【温州】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcb0ea5f197a18b335' },
+  { title: '【天津】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcda46c23dade6f6a3' },
+  { title: '【昆明】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcf2aebcbf3d46d9cd' },
   { title: '【全国】', serviceUrl: 'https://work.weixin.qq.com/kfid/kfcc60ac7b6420787a8' },
 ];
 

src/pages/user-info/index.tsx

@@ -19,7 +19,7 @@ export default function UserInfo() {
   const userInfo = useUserInfo();
   const nameRef = useRef(userInfo.nickName);
 
-  const handleChooseAvatar = useCallback(async (e: BaseEventOrig) => {
+  const handleChooseAvatar = useCallback(async () => {
     // const { avatarUrl } = e.detail;
     // log('handleChooseAvatar', avatarUrl, e.detail);
     // const { url } = await uploadVideo(avatarUrl, 'image', commonUploadProgress, 'user-avatar');
@@ -32,8 +32,8 @@ export default function UserInfo() {
         log('handleChooseAvatar', tempFiles[0]);
         const { url } = await uploadVideo(tempFiles[0].tempFilePath, 'image', commonUploadProgress, 'user-avatar');
         url && updateUserInfo({ avatarUrl: url });
-      }
+      },
-    })
+    });
   }, []);
 
   const handleInput = useCallback((e: BaseEventOrig<InputProps.inputValueEventDetail>) => {
@@ -55,7 +55,7 @@ export default function UserInfo() {
     <div className={PREFIX}>
       <Cell className={`${PREFIX}__avatar-cell`} title="头像" align="center" isLink>
         <Image
-          mode="aspectFit"
+          mode="aspectFill"
           className={`${PREFIX}__avatar`}
           src={userInfo.avatarUrl || require('@/statics/png/default_avatar.png')}
         />

src/pages/user/index.tsx

@@ -47,7 +47,7 @@ export default function User() {
       <div className={PREFIX}>
         <div className={`${PREFIX}__header`}>
           <Image
-            mode="aspectFit"
+            mode="aspectFill"
             className={`${PREFIX}__header__avatar`}
             src={userInfo.avatarUrl || require('@/statics/png/default_avatar.png')}
           />