ui-fix

package-lock.json

@@ -8,6 +8,7 @@
       "name": "colexiu-mobile",
       "version": "0.0.0",
       "dependencies": {
+        "amfe-flexible": "^2.2.1",
         "consola": "^2.15.3",
         "plyr": "^3.7.2",
         "umi-request": "^1.4.0",
@@ -1208,6 +1209,11 @@
         "ajv": "^6.9.1"
       }
     },
+    "node_modules/amfe-flexible": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/amfe-flexible/-/amfe-flexible-2.2.1.tgz",
+      "integrity": "sha512-L2VfvDzoETBjhRptg5u/IUuzHSuxm22JpSRb404p/TBGeRfwWmmNEbB+TFPIP/sS/+pbM18bCFH9QnMojLuPNw=="
+    },
     "node_modules/ansi-styles": {
       "version": "3.2.1",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
@@ -4621,6 +4627,11 @@
       "peer": true,
       "requires": {}
     },
+    "amfe-flexible": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/amfe-flexible/-/amfe-flexible-2.2.1.tgz",
+      "integrity": "sha512-L2VfvDzoETBjhRptg5u/IUuzHSuxm22JpSRb404p/TBGeRfwWmmNEbB+TFPIP/sS/+pbM18bCFH9QnMojLuPNw=="
+    },
     "ansi-styles": {
       "version": "3.2.1",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",

package.json

@@ -9,6 +9,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "amfe-flexible": "^2.2.1",
     "consola": "^2.15.3",
     "plyr": "^3.7.2",
     "umi-request": "^1.4.0",

src/components/TheDown/index.tsx

@@ -29,30 +29,24 @@ export default defineComponent({
       let urlIos = "";
       let urlAndroid = "";
       let type = downType;
-      if (location.origin.indexOf("online.colexiu.com") > -1) {
-        if (type === "student") {
-          urlIos = "https://itunes.apple.com/cn/app/id1626971695?mt=8";
-          urlAndroid =
-            "https://appstore.ks3-cn-beijing.ksyuncs.com/clx-student-domain.apk";
-        } else if (type === "teacher") {
-          urlIos = "https://itunes.apple.com/cn/app/id1626971149?mt=8";
-          urlAndroid =
-            "https://appstore.ks3-cn-beijing.ksyuncs.com/clx-teacher-domain.apk";
-        }
-      } else {
-        if (type === "student") {
-          urlIos = "https://www.pgyer.com/powy";
-          urlAndroid = "https://www.pgyer.com/70e7";
-        } else {
-          urlIos = "https://www.pgyer.com/iO0m";
-          urlAndroid = "https://www.pgyer.com/N2U3";
-        }
+      if (type === "student") {
+        urlIos = "https://itunes.apple.com/cn/app/id1626971695?mt=8";
+        urlAndroid = "https://appstore.ks3-cn-beijing.ksyuncs.com/clx-student-domain.apk";
+      } else if (type === "teacher") {
+        urlIos = "https://itunes.apple.com/cn/app/id1626971149?mt=8";
+        urlAndroid = "https://appstore.ks3-cn-beijing.ksyuncs.com/clx-teacher-domain.apk";
       }
 
       if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
         window.location.href = urlIos;
       } else if (/(Android)/i.test(navigator.userAgent)) {
         window.location.href = urlAndroid;
+      } else {
+        if (type == 'student') {
+          window.location.href = 'https://online.colexiu.com/student/#/download'
+        } else {
+          window.location.href = 'https://online.colexiu.com/student/#/download?type=teacher'
+        }
       }
     };
 

src/components/TheFooterApp/index.tsx

@@ -6,12 +6,14 @@ import { useToggle } from "@vant/use";
 import { useRoute } from "vue-router";
 import { isDingTalk, isWeChat } from "@/helpers/utils";
 import wx_bg from "@/assets/wx_bg.png";
+import TheDown from '../TheDown'
 
 export const [footerAppShow, toggleFooterApp] = useToggle(false);
 export default defineComponent({
   name: "TheFooterApp",
   setup() {
     const route = useRoute();
+    const downRef = ref()
     const firstShow = () => {
       if (route.name == "index") {
         toggleFooterApp(true);
@@ -19,6 +21,16 @@ export default defineComponent({
     };
     onMounted(() => {
       firstShow();
+      window.addEventListener('error', (e) => {
+        console.log(e)
+        console.log(e.message)
+        // console.log(e.source)
+        console.log(e.lineno)
+        console.log(e.colno)
+        console.log(e.error)
+        // 禁止默认错误提示
+        e.preventDefault();
+      }, true);
     });
     const btns = [
       {
@@ -55,15 +67,23 @@ export default defineComponent({
             window.location.href = `ColexiuStudent://linkUrl=${iosStr}`;
           } else if (/(Android)/i.test(navigator.userAgent)) {
             window.location.href = `colexiustudent://html:8888/SplashActivity?url=${iosStr}`;
+          } else {
+            console.log("🚀 ", downRef.value)
+            downRef.value?.downLoadApp('student')
           }
         } else {
           if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
             window.location.href = `ColexiuTeacher://linkUrl=${iosStr}`;
           } else if (/(Android)/i.test(navigator.userAgent)) {
             window.location.href = `colexiuteacher://html:8888/SplashActivity?url=${iosStr}`;
+          } else {
+            console.log("🚀 ", downRef.value)
+            downRef.value?.downLoadApp('teacher')
           }
         }
-      } catch (error) {}
+      } catch (error) {
+        console.log(error)
+      }
     };
     return () => (
       <>
@@ -110,6 +130,7 @@ export default defineComponent({
             </div>
           </div>
         </Popup>
+        <TheDown ref={downRef} />
       </>
     );
   },

src/components/TheHeader/index.module.less

@@ -7,12 +7,14 @@
   border-bottom: 1px solid #f8f8f8;
   z-index: 10;
   .logo {
-    height: 54%;
     position: relative;
-    max-width: 60%;
+    display: flex;
+    align-items: center;
+    height: 100%;
+    flex: 1;
     & > img {
-      width: 100%;
-      height: 100%;
+      max-height: 80%;
+      max-width: 80%;
     }
   }
   .undis {
@@ -29,13 +31,23 @@
     font-weight: 500;
     white-space: nowrap;
   }
+  .icon{
+    width: 20px;
+    height: 20px;
+    :global{
+      .van-icon__image{
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
 }
-.theHeader.light{
+.theHeader.light {
   background-color: #fff;
 }
-.theHeader.dark{
-  background-color: rgba(0, 0, 0, .6);
+.theHeader.dark {
+  background-color: rgba(0, 0, 0, 0.6);
   border-bottom: 0;
   backdrop-filter: blur(10px);
-  -webkit-backdrop-filter:blur(10px);
+  -webkit-backdrop-filter: blur(10px);
 }

src/components/TheHeader/index.tsx

@@ -31,9 +31,9 @@ export default defineComponent({
           打开APP
         </Button>
         <Icon
+          class={styles.icon}
           name={props.theme == "light" ? IconSearch : IconSearchWhite}
           color="#333"
-          size={20}
           onClick={() => router.push("/search")}
         />
         <TheDown ref={downRef} />

src/components/TheMusicGrid/index.module.less

@@ -32,10 +32,12 @@
   .imgWrap {
     position: relative;
     // height: 110px;
-    height: calc((100vw - 48px) / 3);
+    height: 29vw;
+    // height: calc((100vw - 48px) / 3);
     border-radius: 6px;
     overflow: hidden;
     margin-bottom: 6px;
+    max-height: 355PX;
     .model {
       position: absolute;
       left: 4px;

src/components/TheSong/index.module.less

@@ -31,12 +31,13 @@
       display: flex;
       align-items: center;
       .name {
-        font-size: 12px;
+        font-size: 14px;
         color: #999;
         line-height: 16px;
         margin-right: 12px;
       }
       .tags {
+        font-size: 12px;
         & > span {
           display: inline-block;
           background: #effbf9;
@@ -44,8 +45,7 @@
           color: var(--van-primary-color);
           padding: 4px 8px;
           margin-right: 4px;
-          font-size: 12px;
-          transform: scale(.9);
+          
         }
       }
     }

src/components/TheSong/index.tsx

@@ -55,9 +55,9 @@ export default defineComponent({
               </div>
               <div class={styles.user}>
                 {n.addName ? (
-                  <span class={styles.name}>上传者：{n.addName}</span>
+                  <div class={styles.name}>上传者：{n.addName}</div>
                 ) : (
-                  <span class={styles.name}>作曲：{n.composer}</span>
+                  <div class={styles.name}>作曲：{n.composer}</div>
                 )}
                 <div class={styles.tags}>
                   {n?.subjectNames.split(",").map((name: any) => (

src/main.ts

@@ -4,5 +4,6 @@ import App from './App'
 import router from './router'
 import { Lazyload } from 'vant';
 import './assets/flexible.js'
+// import 'amfe-flexible'
 
 createApp(App).use(router).use(Lazyload).mount('#app')

src/style.less

@@ -10,7 +10,7 @@ html{
   font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Segoe UI, Arial, Roboto, "PingFang SC", "miui", "Hiragino Sans GB", "Microsoft Yahei", sans-serif;
 }
 #app{
-  max-width: 750px;
+  max-width: 1000px;
   margin: 0 auto;
   background: #F8F8F8;
   min-height: 100vh;

src/views/components/banner/index.module.less

@@ -2,7 +2,8 @@
   min-height: 130px;
   :global {
     .van-swipe-item {
-      height: 130px;
+      height: 34.66vmin;
+      max-height: 335PX;
       background-color: #fff;
       border-radius: 10px;
       overflow: hidden;

src/views/down/index.module.less

@@ -1,12 +1,12 @@
 .down {
   min-height: 100vh;
-  background-size: 100% auto;
+  background-size: contain;
   background-repeat: no-repeat;
   background-color: #fff;
 }
 .text {
-  margin: 0 34px auto 34px;
-  padding-top: 45px;
+  margin: 0 9vmin auto 9vmin;
+  padding-top: 18vmin;
   .title {
     font-size: 20px;
     font-weight: 600;
@@ -36,7 +36,7 @@
   }
 }
 .logo{
-    margin-top: 200px;
+    margin-top: 30vmin;
     :global{
         .lottie-animation-container{
             margin-left: 17px;
@@ -44,11 +44,13 @@
     }
 }
 .app{
-    margin-top: 65px;
+    margin-top: 30vmin;
     .btns{
         display: flex;
         justify-content: center;
-        margin: -30px 0 120px 0;
+        margin-top: -30px;
+        padding-bottom: 120px;
+        // margin: -30px 0 120px 0;
     }
     :global{
         .van-button{

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

@@ -50,6 +50,7 @@
   }
   .alumDes {
     width: calc(100% - 129px);
+    font-size: 12px;
     .des {
       color: #999;
     }
@@ -57,6 +58,7 @@
 }
 .tags {
   margin: 6px -2px 24px -2px;
+  font-size: 12px;
   .tag {
     margin: 0 2px;
     padding: 2px 6px;

src/views/musicDetail/index.module.less

@@ -42,6 +42,7 @@
     .des {
       color: #999;
       max-width: 60%;
+      font-size: 12px;
     }
   }
   .musicDes {

src/views/video/detail/Info.tsx

@@ -27,7 +27,7 @@ export default defineComponent({
     },
   },
   setup(props) {
-    const router = useRouter()
+    const router = useRouter();
     const downRef = ref();
     return () => (
       <div class={styles.detailInfo}>
@@ -39,7 +39,7 @@ export default defineComponent({
         </div>
         <Row justify="space-between">
           <Col class={styles.col} style={{ color: "#FF6422" }}>
-            <Icon name={tree} size={16} />
+            <Icon name={tree} style size={16} />
             <span>共{props.lessonGroup.lessonCount}课时</span>
           </Col>
           <Col class={styles.col}>
@@ -54,7 +54,13 @@ export default defineComponent({
 
         <TheTitle title="教学老师" isMore={false} />
         <div class={styles.teacher}>
-          <Image width={68} height={68} fit="cover" round src={props.teacher.heardUrl || icon_teacher} />
+          <Image
+            width={68}
+            height={68}
+            fit="cover"
+            round
+            src={props.teacher.heardUrl || icon_teacher}
+          />
           <div class={styles.teacherContent}>
             <div class={styles.name}>{props.teacher.username}</div>
             <div class={styles.num}>
@@ -72,14 +78,22 @@ export default defineComponent({
           </Button>
         </div>
 
-        <TheTitle title="老师介绍" isMore={false} />
-        <div class={styles.des}>{props.teacher.introduction}</div>
+        {props.teacher.introduction && (
+          <>
+            <TheTitle title="老师介绍" isMore={false} />
+            <div class={styles.des}>{props.teacher.introduction}</div>
+          </>
+        )}
 
-        <TheTitle title="老师风采" isMore={false} />
-        <VideoList
-          list={props.teacher.styleVideo}
-          onPlay={() => downRef.value?.toggle()}
-        />
+        {props.teacher.styleVideo && props.teacher.styleVideo.length ? (
+          <>
+            <TheTitle title="老师风采" isMore={false} />
+            <VideoList
+              list={props.teacher.styleVideo}
+              onPlay={() => downRef.value?.toggle()}
+            />
+          </>
+        ) : null}
 
         <TheTitle title="其他课程" isMore={false} />
         <VideoItem

src/views/video/detail/index.module.less

@@ -64,9 +64,16 @@
     display: flex;
     align-items: center;
     color: var(--van-primary-color);
+    font-size: 16px;
     & > span {
       margin-left: 10px;
     }
+    :global{
+      .van-icon__image{
+        width: 18px;
+        height: 18px;
+      }
+    }
   }
   .des {
     font-size: 12px;

vite.config.ts

@@ -8,7 +8,8 @@ import { createStyleImportPlugin } from "vite-plugin-style-import";
 import legacy from "@vitejs/plugin-legacy";
 import path from "path";
 
-const proxyUrl = "https://dev.colexiu.com/";
+// const proxyUrl = "https://dev.colexiu.com/";
+const proxyUrl = "https://online.colexiu.com/";
 
 const resolve = (dir: string) => path.join(__dirname, dir)