修复

src/App.tsx

@@ -1,4 +1,4 @@
-import { defineComponent } from "vue";
+import { defineComponent, onMounted } from "vue";
 import { RouterView } from "vue-router";
 
 export default defineComponent({

src/components/TheFooterApp/index.tsx

@@ -1,13 +1,23 @@
-import { defineComponent } from "vue";
+import { defineComponent, onMounted, ref } from "vue";
 import styles from "./index.module.less";
 import IconLogo1 from "../../assets/logo-1.png";
 import { Button, Icon, Popup } from "vant";
 import { useToggle } from "@vant/use";
+import { useRoute } from "vue-router";
 
+export const [footerAppShow, toggleFooterApp] = useToggle(false);
 export default defineComponent({
   name: "TheFooterApp",
   setup() {
-    const [show, toggle] = useToggle(false);
+    const route = useRoute()
+    const firstShow = () => {
+      if (route.name == 'index'){
+        toggleFooterApp(true)
+      }
+    }
+    onMounted(() => {
+      firstShow()
+    })
     const btns = [
       {
         title: "酷乐秀",
@@ -47,16 +57,16 @@ export default defineComponent({
     };
     return () => (
       <>
-        <div class={styles.theFooterApp} onClick={() => toggle(true)}>
+        <div class={styles.theFooterApp} onClick={() => toggleFooterApp(true)}>
           <img class={styles.img} src={IconLogo1} />
           <span>打开APP看海量热门乐谱</span>
         </div>
 
-        <Popup position="bottom" round v-model:show={show.value}>
+        <Popup position="bottom" round v-model:show={footerAppShow.value}>
           <div class={styles.appContent}>
             <div class={styles.top}>
               <span>打开方式</span>
-              <div class={styles.des} onClick={() => toggle(false)}>
+              <div class={styles.des} onClick={() => toggleFooterApp(false)}>
                 <span>继续使用浏览器</span>
                 <Icon name="play" size={10} />
               </div>

src/helpers/request.ts

@@ -1,8 +1,35 @@
 import { extend } from "umi-request";
+import { Toast } from "vant";
 
 const request = extend({
-    timeout: 2000
-})
+  timeout: 20000,
+  timeoutMessage: "请求超时",
+});
+let timer: ReturnType<typeof setTimeout>;
+request.interceptors.request.use(
+  (url, options: any) => {
+    clearTimeout(timer);
+    Toast({
+      type: "loading",
+      message: "加载中",
+      duration: 0,
+    });
+    console.log(options);
+    return {
+      url,
+      options,
+    };
+  },
+  { global: false }
+);
+request.interceptors.response.use(
+  (response) => {
+    timer = setTimeout(() => {
+      Toast.clear();
+    }, 300);
+    return response;
+  },
+  { global: false }
+);
 
-
-export default request
+export default request;

src/views/components/boutique-class/index.tsx

@@ -2,12 +2,14 @@ import TheTitle from "@/components/TheTitle";
 import TheVideoGrid from "@/components/TheVideoGrid";
 import request from "@/helpers/request";
 import { defineComponent, onMounted, ref } from "vue";
+import { useRouter } from "vue-router";
 import { VideoItem } from "../../home/type";
 
 export default defineComponent({
   name: "BoutiqueClass",
   setup() {
     //视频课
+    const router = useRouter();
     const videoList = ref<VideoItem[]>([]);
     const getVideoList = async () => {
       try {
@@ -27,8 +29,16 @@ export default defineComponent({
     });
     return () => (
       <>
-        <TheTitle title="精品视频课" />
-        <TheVideoGrid list={videoList.value} />
+        <TheTitle title="精品视频课" onMore={() => router.push('/video')} />
+        <TheVideoGrid
+          list={videoList.value}
+          onGoto={(item: any) =>
+            router.push({
+              path: "/videoDetail",
+              query: { id: item.teacherId, groupId: item.id },
+            })
+          }
+        />
       </>
     );
   },

src/views/components/hot-music/index.tsx

@@ -5,10 +5,12 @@ import request from "@/helpers/request";
 import { Swipe, SwipeItem } from "vant";
 import { defineComponent, onMounted, ref } from "vue";
 import { chunkArr } from "@/helpers/utils";
+import { useRouter } from "vue-router";
 
 export default defineComponent({
   name: "HotMusic",
   setup() {
+    const router = useRouter()
     const musicList = ref<any[]>([]);
     
     const getMusic = async () => {
@@ -42,7 +44,7 @@ export default defineComponent({
     };
     return () => (
       <div class={styles.hotMusic}>
-        <TheTitle class={styles.title} title="热门曲目" />
+        <TheTitle class={styles.title} title="热门曲目" onMore={() => router.push('/search')} />
         {swipeShow.value && (
           <Swipe showIndicators={false} loop={false} width={swipeWidth.value}>
             {musicList.value.map((n) => (

src/views/home/index.tsx

@@ -1,6 +1,6 @@
-import { defineComponent } from "vue";
+import { defineComponent, onMounted } from "vue";
 import styles from "./index.module.less";
-import TheFooterApp from "../../components/TheFooterApp";
+import TheFooterApp, { toggleFooterApp } from "../../components/TheFooterApp";
 
 import HotAlbum from "../components/hot-album";
 import BoutiqueClass from "../components/boutique-class";

src/views/music/album/index.module.less

@@ -19,10 +19,12 @@
   object-fit: cover;
 }
 .bg {
+  position: relative;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.6);
   backdrop-filter: blur(10px);
   padding: 16px;
+  z-index: 10;
 }
 .alumWrap {
   display: flex;

src/views/music/album/index.tsx

@@ -10,7 +10,6 @@ import request from "@/helpers/request";
 import { useRoute, useRouter } from "vue-router";
 import HotAlbum from "@/views/components/hot-album";
 import TheMusicGrid from "@/components/TheMusicGrid";
-import { Toast } from "vant";
 
 interface IState {
   [_: string]: any;
@@ -28,11 +27,6 @@ export default defineComponent({
     });
     const state = reactive<IState>({});
     const getAlumn = async () => {
-      Toast({
-        type: "loading",
-        duration: 0,
-        message: "加载中",
-      });
       try {
         const { data } = await request.post(
           "/api-website/open/music/album/detail",
@@ -49,7 +43,6 @@ export default defineComponent({
           musicSheetList: data.musicSheetList?.rows || [],
         });
       } catch (error) {}
-      Toast.clear();
     };
     onMounted(() => {
       getAlumn();

src/views/music/index.module.less

@@ -1,3 +1,3 @@
 .indexMusic{
-    padding: 16px;
+    padding: 10px 16px;
 }

src/views/music/index.tsx

@@ -8,13 +8,13 @@ export default defineComponent({
   name: "indexMusic",
   setup() {
     return () => (
-      <>
+      <div>
         <div class={styles.indexMusic}>
           <Banner />
           <HotAlbum />
         </div>
         <HotMusic />
-      </>
+      </div>
     );
   },
 });

src/views/musicDetail/index.tsx

@@ -5,7 +5,7 @@ import TheTitle from "@/components/TheTitle";
 import TheSong from "@/components/TheSong";
 import request from "@/helpers/request";
 import { useRoute, useRouter } from "vue-router";
-import { Icon, Toast } from "vant";
+import { Icon } from "vant";
 import { useEventListener } from "@vant/use";
 import icon_teacher from "@/assets/icon_teacher.png";
 import Plyr from "plyr";
@@ -38,11 +38,6 @@ export default defineComponent({
     const getAlumn = async () => {
       const id = route.query.id;
       if (!id) return;
-      Toast({
-        type: "loading",
-        duration: 0,
-        message: "加载中",
-      });
       try {
         const { data } = await request.get(
           `api-website/open/music/sheet/detail/${id}`
@@ -59,7 +54,6 @@ export default defineComponent({
           }
         }
       } catch (error) {}
-      Toast.clear();
     };
     onMounted(() => {
       getAlumn();

src/views/search/index.tsx

@@ -8,6 +8,7 @@ import HotMusic from "../components/hot-music";
 import request from "@/helpers/request";
 import SearchList from "./components/search-list";
 import { useRoute, useRouter } from "vue-router";
+import TheDown from "@/components/TheDown";
 
 export default defineComponent({
   name: "Search",
@@ -43,14 +44,14 @@ export default defineComponent({
         },
       });
     };
-
+    const downRef = ref()
     return () => (
       <div class={styles.search}>
         <div class={styles.fixed}>
           <div class={styles.top}>
             <img class={styles.img} src={IconLogo1} />
             <span>打开APP看海量热门乐谱</span>
-            <Button round class={styles.topBtn}>
+            <Button round class={styles.topBtn} onClick={() => downRef.value?.downLoadApp()}>
               打开
             </Button>
           </div>
@@ -81,6 +82,7 @@ export default defineComponent({
           </div>
           <HotMusic />
         </div>
+        <TheDown ref={downRef}/>
       </div>
     );
   },

src/views/video/detail/index.tsx

@@ -3,8 +3,8 @@ import TheFooterApp from "@/components/TheFooterApp";
 import TheHeader from "@/components/TheHeader";
 import TheImage from "@/components/TheImage";
 import request from "@/helpers/request";
-import { Divider, Tab, Tabs, Toast } from "vant";
-import { defineComponent, nextTick, onMounted, reactive, ref, watch } from "vue";
+import { Divider, Tab, Tabs } from "vant";
+import { defineComponent, onMounted, reactive, ref, watch } from "vue";
 import { useRoute } from "vue-router";
 import styles from "./index.module.less";
 import Info from "./Info";
@@ -54,19 +54,9 @@ export default defineComponent({
       } catch (error) {}
     };
     const init = () => {
-      Toast({
-        type: 'loading',
-        message: '加载中',
-        duration:0
-      })
       getDetail();
       getTeacher();
       getOther();
-      nextTick(() => {
-        setTimeout(() => {
-          Toast.clear()
-        }, 300)
-      })
     }
     onMounted(() => {
       init()