Просмотр исходного кода

Merge branch 'iteration_video'

lex 2 лет назад
Родитель
Сommit
9ab61a1138

+ 6 - 0
src/components/m-image-preview/index.module.less

@@ -24,6 +24,12 @@
     .plyr--fullscreen-fallback {
       height: 100% !important;
       width: var(--window-page-width) !important;
+      left: var(--window-page-position-left) !important;
+    }
+
+    .video-back {
+      // left: 20px;
+      // left: calc(var(--window-page-position-left) + 20px) !important;
     }
   }
 }

+ 22 - 7
src/components/m-image-preview/index.tsx

@@ -97,6 +97,7 @@ export default defineComponent({
       videoRef.value.forEach((item: any, child: any) => {
         if (child !== index) {
           item?.onStop();
+          item?.onExitScreen();
         }
       });
     };
@@ -109,14 +110,26 @@ export default defineComponent({
         (window.document.body.clientWidth || window.document.body.offsetWidth) +
           'px'
       );
+
+      onChnageLeftWidth(forms.index - 1);
     });
 
+    const onChnageLeftWidth = (index: number) => {
+      document.documentElement.style.setProperty(
+        '--window-page-position-left',
+        (window.document.body.clientWidth || window.document.body.offsetWidth) *
+          index +
+          'px'
+      );
+    };
+
     watch(
       () => props.show,
       () => {
         forms.show = props.show;
         forms.index = props.startPosition + 1;
         forms.preLoading = props.show;
+        onChnageLeftWidth(props.startPosition);
         // console.log(forms.preLoading, 'show');
         // nextTick(() => {
         //   // 判断打开的内容是否为视频,是则自动播放
@@ -139,6 +152,7 @@ export default defineComponent({
       () => props.startPosition,
       () => {
         forms.index = props.startPosition + 1;
+        onChnageLeftWidth(props.startPosition);
       }
     );
 
@@ -184,11 +198,11 @@ export default defineComponent({
                         : 'var(--van-padding-md)'
                     }}
                     onClick={() => {
-                      console.log(
-                        forms.index,
-                        'index',
-                        props.images[forms.index - 1]
-                      );
+                      // console.log(
+                      //   forms.index,
+                      //   'index',
+                      //   props.images[forms.index - 1]
+                      // );
 
                       onSave(props.images[forms.index - 1]);
                     }}
@@ -208,6 +222,7 @@ export default defineComponent({
                 forms.index = index + 1;
                 // forms.preLoading = true;
                 onPlay(index);
+                onChnageLeftWidth(index);
               }}
               lazyRender>
               {props.images.map((url: string, index: number) => (
@@ -248,8 +263,8 @@ export default defineComponent({
                         src={url}
                         onPlay={() => onPlay(index)}
                         preLoading={false}
-                        onEnterfullscreen={() => (forms.showButton = false)}
-                        onExitfullscreen={() => (forms.showButton = true)}
+                        // onEnterfullscreen={() => (forms.showButton = false)}
+                        // onExitfullscreen={() => (forms.showButton = true)}
                       />
                     </div>
                   )}

+ 18 - 17
src/components/m-video/index.tsx

@@ -132,29 +132,27 @@ export default defineComponent({
       });
 
       this.player.on('enterfullscreen', () => {
-        console.log('fullscreen');
-        const fragment = document.createDocumentFragment();
-        const i = document.createElement('i');
-        i.id = 'fullscreen-back';
-        i.className = 'van-icon van-icon-arrow-left video-back';
-        i.addEventListener('click', () => {
-          this.player.fullscreen.exit();
-        });
-        console.log(document.getElementsByClassName('plyr'), i);
-        fragment.appendChild(i);
-        const parentNode = document.getElementsByClassName('plyr')[0];
-        parentNode.insertBefore(fragment, parentNode.firstChild);
-        // document
-        //   .getElementsByClassName('plyr__controls')[0]
-        //   .insertBefore(fragment);
+        // console.log('fullscreen', this.player.elements);
+        // const fragment = document.createDocumentFragment();
+        // const i = document.createElement('i');
+        // i.id = 'fullscreen-back';
+        // i.className = 'van-icon van-icon-arrow-left video-back';
+        // i.addEventListener('click', () => {
+        //   this.player.fullscreen.exit();
+        // });
+        // console.log(document.getElementsByClassName('plyr'), i);
+        // fragment.appendChild(i);
+        // // const parentNode = document.getElementsByClassName('plyr')[0];
+        // // parentNode.insertBefore(fragment, parentNode.firstChild);
+        // this.player.elements.container.appendChild(fragment);
 
         this.$emit('enterfullscreen');
       });
 
       this.player.on('exitfullscreen', () => {
         console.log('exitfullscreen');
-        const i = document.getElementById('fullscreen-back');
-        i && i.remove();
+        // const i = document.getElementById('fullscreen-back');
+        // i && i.remove();
         this.$emit('exitfullscreen');
       });
     },
@@ -175,6 +173,9 @@ export default defineComponent({
     onStop() {
       this.player.stop();
     },
+    onExitScreen() {
+      this.player.fullscreen.active && this.player.fullscreen.exit();
+    },
     onPlay() {
       this.player?.play();
     }

+ 4 - 4
src/views/activity-record/detail.module.less

@@ -694,15 +694,15 @@
       padding-bottom: 18px;
 
       .schoolLogo {
-        width: 52px;
-        height: 52px;
+        width: 56px;
+        height: 56px;
         border-radius: 50%;
         overflow: hidden;
         border: 2px solid #fff;
         position: absolute;
-        top: -26px;
+        top: -28px;
         left: 50%;
-        margin-left: -26px;
+        margin-left: -28px;
       }
 
       .schoolName {

+ 17 - 7
src/views/home/component/Practice.tsx

@@ -51,7 +51,7 @@ export default defineComponent({
             shrink
             v-model:active={tab.value}
             onChange={value => {
-              console.log(value)
+              console.log(value);
               emit('change', value);
             }}>
             <Tab name="week" title="本周"></Tab>
@@ -65,11 +65,13 @@ export default defineComponent({
               {{
                 icon: () => (
                   <div>
-                    <span class={styles.tagNum}>{data.value.commitRate || 0}</span>
+                    <span class={styles.tagNum}>
+                      {data.value.commitRate || 0}
+                    </span>
                     <span class={[styles.tagNum, styles.fenHao]}>%</span>
                   </div>
                 ),
-                text: () => <div>提交率</div>
+                text: () => <div>练习率</div>
               }}
             </GridItem>
             <Image class={styles.iconline} src={iconLine} fit="contain" />
@@ -77,7 +79,9 @@ export default defineComponent({
               {{
                 icon: () => (
                   <div>
-                    <span class={styles.tagNum}>{data.value.passRate || 0}</span>
+                    <span class={styles.tagNum}>
+                      {data.value.passRate || 0}
+                    </span>
                     <span class={[styles.tagNum, styles.fenHao]}>%</span>
                   </div>
                 ),
@@ -94,7 +98,9 @@ export default defineComponent({
               color="linear-gradient(to right, #9AC6FF, #5C91FF)"></Progress>
             <div>
               应提交{' '}
-              <span style={{ color: '#5C91FF' }} class={[styles.tagNum, styles.numDes]}>
+              <span
+                style={{ color: '#5C91FF' }}
+                class={[styles.tagNum, styles.numDes]}>
                 {data.value.expectNum || 0}
               </span>
@@ -109,7 +115,9 @@ export default defineComponent({
               color="linear-gradient(to right, #91F4DA, #01C1B5)"></Progress>
             <div>
               实际提交{' '}
-              <span style={{ color: '#01C1B5' }} class={[styles.tagNum, styles.numDes]}>
+              <span
+                style={{ color: '#01C1B5' }}
+                class={[styles.tagNum, styles.numDes]}>
                 {data.value.actualNum || 0}
               </span>
@@ -124,7 +132,9 @@ export default defineComponent({
               color="linear-gradient(to right, #FFDCAC, #FFA724)"></Progress>
             <div>
               合格提交{' '}
-              <span style={{ color: '#FFA724' }} class={[styles.tagNum, styles.numDes]}>
+              <span
+                style={{ color: '#FFA724' }}
+                class={[styles.tagNum, styles.numDes]}>
                 {data.value.passNum || 0}
               </span>

+ 2 - 2
src/views/student-manage/component/Attendance.tsx

@@ -15,7 +15,7 @@ export default defineComponent({
     return () => (
       <div class={styles.attendance}>
         <div class={styles.attendanceTitle}>
-          <span>本学期作业</span>
+          <span>本学期课后练习</span>
         </div>
         <div class={styles.items}>
           <div class={styles.item}>
@@ -32,7 +32,7 @@ export default defineComponent({
               /{item.shouldSubmitCount}
               <span class={styles.ci}></span>
             </div>
-            <div class={styles.label}>作业情况</div>
+            <div class={styles.label}>课后练习情况</div>
           </div>
 
           <div class={styles.item}>