分享页面 增加换一换

src/views/creation/index-share.tsx

@@ -41,7 +41,6 @@ import { storage } from '@/helpers/storage';
 import { ACCESS_TOKEN } from '@/store/mutation-types';
 import MWxTip from '@/components/m-wx-tip';
 import { usePageVisibility, useEventListener, useWindowSize } from '@vant/use';
-import videoBg from './images/video-bg.png';
 import LoginChangeModel from './login-change-model';
 import MSticky from '@/components/m-sticky';
 import "plyr/dist/plyr.css";
@@ -51,6 +50,7 @@ import audioBga from "./images/audioBga.json";
 import audioBga1 from "./images/leftCloud.json";
 import audioBga2 from "./images/rightCloud.json";
 import videobg from "./images/videobg.png";
+import btnImg from './images/btn.png';
 import audioVisualDraw from "./audioVisualDraw"
 import playProgressData from "./playCreation/playProgress"
 import Loading from './loading';
@@ -83,7 +83,7 @@ export default defineComponent({
       },
       params: {
         page: 1,
-        rows: 20
+        rows: 4
       },
       messageStatus: false,
       message: '',
@@ -152,7 +152,7 @@ export default defineComponent({
         if (state.list.length > 0 && result.current === 1) {
           return;
         }
-        state.list = state.list.concat(result.rows || []);
+        state.list = result.rows || [];
         state.listState.finished = result.current >= result.pages;
         state.params.page = result.current + 1;
         state.listState.dataShow = state.list.length > 0;
@@ -596,55 +596,63 @@ export default defineComponent({
             <div class={styles.likeSection}>
               <div class={styles.likeTitle}>推荐作品</div>
               {state.listState.dataShow ? (
-                <List
-                  finished={state.listState.finished}
-                  finishedText=" "
-                  class={[styles.container, styles.containerInformation]}
-                  onLoad={getList}
-                  immediateCheck={false}>
-                  {state.list.map((item: any, index: number) => (
-                    <Cell
-                      class={[styles.likeShareItem, index===state.list.length-1&&styles.likeShareItemLast]}
-                      border={false}
-                      onClick={() => onDetail(item)}
-                    >
-                      {{
-                        icon: () => (
-                          <div class={styles.audioImgBox}>
-                            <img
-                              src={audioPan}
-                              class={styles.audioPan}
-                              crossorigin="anonymous"
-                            />
-                            <img
-                              src={
-                                item.img || musicBg
-                              }
-                              class={styles.muploader}
-                              crossorigin="anonymous"
-                            />
-                            <img class={styles.imgLabel} src={item.videoUrl?.lastIndexOf('mp4') !== -1 ? videoLabel : audioLabel} />
-                          </div>
-                        ),
-                        title: () => (
-                          <div class={styles.userInfo}>
-                            <div class={[styles.musicSheetName,'van-ellipsis']}>{item.musicSheetName}</div>
-                            <div class={styles.usernameCon}>
-                              <div class={styles.likeNum}>
-                                <img src={iconZanActive} />
-                                <span>{item.likeNum}</span>
+                <>
+                  <List
+                    finished={true}
+                    finishedText=" "
+                    class={[styles.container, styles.containerInformation]}
+                    //onLoad={getList}
+                    immediateCheck={false}>
+                    {state.list.map((item: any, index:number) => (
+                      <Cell
+                        class={[styles.likeShareItem, index===state.list.length-1&&styles.likeShareItemLast]}
+                        border={false}
+                        onClick={() => onDetail(item)}
+                      >
+                        {{
+                          icon: () => (
+                            <div class={styles.audioImgBox}>
+                              <img
+                                src={audioPan}
+                                class={styles.audioPan}
+                                crossorigin="anonymous"
+                              />
+                              <img
+                                src={
+                                  item.img || musicBg
+                                }
+                                class={styles.muploader}
+                                crossorigin="anonymous"
+                              />
+                              <img class={styles.imgLabel} src={item.videoUrl?.lastIndexOf('mp4') !== -1 ? videoLabel : audioLabel} />
+                            </div>
+                          ),
+                          title: () => (
+                            <div class={styles.userInfo}>
+                              <div class={[styles.musicSheetName,'van-ellipsis']}>{item.musicSheetName}</div>
+                              <div class={styles.usernameCon}>
+                                <div class={styles.likeNum}>
+                                  <img src={iconZanActive} />
+                                  <span>{item.likeNum}</span>
+                                </div>
+                                <div class={styles.username}>{item.username}</div>
                               </div>
-                              <div class={styles.username}>{item.username}</div>
                             </div>
-                          </div>
-                        ),
-                        value: () => (
-                          <img src={playImg} class={styles.playImg} />
-                        )
-                      }}
-                    </Cell>
-                  ))}
-                </List>
+                          ),
+                          value: () => (
+                            <img src={playImg} class={styles.playImg} />
+                          )
+                        }}
+                      </Cell>
+                    ))}
+                  </List>
+                  {
+                    !state.listState.finished &&
+                      <div class={styles.btnImg}>
+                        <img onClick={getList} src={btnImg} />
+                    </div>
+                  }
+                </>
               ) : (
                 <MEmpty image={"empty2"} description="暂无作品" />
               )}

src/views/creation/index.module.less

@@ -282,6 +282,7 @@
   background: rgba(255,255,255,.09);
   border-radius: 10px;
   padding: 12px 12px 0 12px;
+  overflow: hidden;
   .likeTitle {
     display: flex;
     align-items: center;
@@ -340,6 +341,19 @@
   .mEmpty{
     padding: 0;
   }
+  .btnImg{
+    display: flex;
+    justify-content: center;
+    margin-top: 3px;
+    margin-bottom: 12px;
+    &>img{
+      width: 88px;
+      height: 31px;
+      &:active{
+        opacity: 0.8;
+      }
+    }
+  }
 }
 
 .upward{

src/views/creation/playCreation/index.module.less

@@ -17,6 +17,7 @@
       .osmdLoadingPop{
         width: 100vh !important;
         height: 100vw !important;
+        min-height: 100vw !important;
       }
     }
   }