update

src/common/progress_bar/index.vue

@@ -18,20 +18,20 @@ export default {
 
 <style lang="scss" scoped>
 .progress {
-  z-index: 3001;
   position: fixed;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
+  z-index: 3001;
   background-color: hsla(0, 0%, 100%, 0.9);
   transition: opacity 0.3s;
 
   &-bar {
     position: absolute;
     top: 50%;
-    margin-top: -65px;
     width: 100%;
+    margin-top: -65px;
     text-align: center;
   }
 }

src/common/show_file/index.vue

@@ -20,6 +20,10 @@
       <video :src="fileUrl" controls></video>
     </div>
 
+    <div v-else-if="fileType === 'txt'" class="text-file">
+      <el-input v-model="text" type="textarea" :readonly="true" resize="none" />
+    </div>
+
     <template v-else>
       <iframe
         :src="'https://view.officeapps.live.com/op/view.aspx?src=' + `${fileUrl}`"
@@ -57,7 +61,8 @@ export default {
       dialogVisibleShowFile: false,
       pdfSrc: '',
       numPages: 1,
-      fileUrl: ''
+      fileUrl: '',
+      text: ''
     };
   },
   computed: {
@@ -82,8 +87,10 @@ export default {
         }
 
         if (this.fileType === 'txt') {
-          this.dialogVisibleShowFile = false;
-          window.open(file_url_https, '_blank');
+          fetch(`${process.env.VUE_APP_PDF}${file_relative_path}`).then(async res => {
+            if (!res.ok) return;
+            this.text = await res.text();
+          });
         }
       });
     },
@@ -118,7 +125,7 @@ export default {
 </script>
 
 <style lang="scss">
-@import '~@/styles/mixin.scss';
+@import '~@/styles/mixin';
 
 .show-file {
   @include dialog;
@@ -127,17 +134,27 @@ export default {
     font-weight: bold;
   }
 
+  %image-parent,
   .image-parent {
     display: flex;
     justify-content: center;
   }
 
   .audio-file {
-    @extend .image-parent;
+    @extend %image-parent;
   }
 
   .video-file {
-    @extend .image-parent;
+    @extend %image-parent;
+  }
+
+  .text-file {
+    height: 60vh;
+
+    .el-textarea,
+    textarea {
+      height: 100%;
+    }
   }
 }
 </style>

src/components/course/CompletionView.vue

@@ -5,8 +5,8 @@
       <div class="completion-info">
         <div>{{ material_name }}</div>
         <div>
-          {{ student_name }} {{ finish_time_view_txt }} 用时：{{ duration }}秒 | 正确
-          {{ count_right }} | 错误 {{ count_error }}
+          {{ student_name }} {{ finish_time_view_txt }} 用时：{{ duration }}秒 | 正确 {{ count_right }} | 错误
+          {{ count_error }}
         </div>
       </div>
     </div>
@@ -20,13 +20,7 @@
       />
     </template>
     <template v-else>
-      <bookailp
-        v-if="dialogVisible"
-        :context="context"
-        :ui-type="ui_type"
-        :preview-width="800"
-        :preview-height="450"
-      />
+      <bookailp v-if="dialogVisible" :context="context" :ui-type="ui_type" :preview-width="800" :preview-height="450" />
     </template>
 
     <div slot="footer"></div>

src/components/course/FinishCourseware.vue

@@ -123,7 +123,7 @@ export default {
 </script>
 
 <style lang="scss">
-@import '~@/styles/mixin.scss';
+@import '~@/styles/mixin';
 
 .finish-courseware {
   @include dialog;

src/components/live/CurMaterial.vue

@@ -58,6 +58,18 @@
         <el-image fit="contain" :src="file_url_https" />
       </template>
 
+      <div v-else-if="fileType === 'mp3'" class="audio-file">
+        <audio :src="file_url_https" controls />
+      </div>
+
+      <div v-else-if="fileType === 'mp4'" class="video-file">
+        <video :src="file_url_https" controls />
+      </div>
+
+      <div v-else-if="fileType === 'txt'" class="text-file">
+        <el-input v-model="text" type="textarea" :readonly="true" resize="none" />
+      </div>
+
       <template v-else>
         <iframe
           :src="'https://view.officeapps.live.com/op/view.aspx?src=' + `${file_url_https}`"
@@ -134,7 +146,8 @@ export default {
         count_not_done: 0,
         count_right: 0,
         count_error: 0
-      }
+      },
+      text: ''
     };
   },
   computed: {
@@ -267,6 +280,13 @@ export default {
         if (fileType === 'pdf') {
           this.getNumPages(file_relative_path);
         }
+
+        if (fileType === 'txt') {
+          fetch(`${process.env.VUE_APP_PDF}${file_relative_path}`).then(async res => {
+            if (!res.ok) return;
+            this.text = await res.text();
+          });
+        }
       });
     },
 
@@ -435,8 +455,28 @@ export default {
     }
   }
 
+  .audio-file {
+    display: flex;
+    justify-content: center;
+  }
+
+  .video-file {
+    display: flex;
+    justify-content: center;
+    height: 100%;
+  }
+
+  .text-file {
+    height: calc(60vh - 50px);
+
+    .el-textarea,
+    textarea {
+      height: 100%;
+    }
+  }
+
   .el-dialog__body {
-    height: 60vh;
+    max-height: 60vh;
 
     .el-image {
       width: 100%;

src/utils/validate.js

@@ -30,20 +30,7 @@ export function twoDecimal(value) {
  */
 export function isAllowFileType(fileName) {
   let suffix = fileName.slice(fileName.lastIndexOf('.') + 1, fileName.length).toLowerCase();
-  return [
-    'mp3',
-    'mp4',
-    'doc',
-    'docx',
-    'pdf',
-    'ppt',
-    'pptx',
-    'xls',
-    'xlsx',
-    'jpg',
-    'gif',
-    'png',
-    'txt',
-    'rtf'
-  ].includes(suffix);
+  return ['mp3', 'mp4', 'doc', 'docx', 'pdf', 'ppt', 'pptx', 'xls', 'xlsx', 'jpg', 'gif', 'png', 'txt', 'rtf'].includes(
+    suffix
+  );
 }

src/views/live/teacher/CompleteList.vue

@@ -74,6 +74,18 @@
           <el-image fit="contain" :src="file_url_https" />
         </template>
 
+        <div v-else-if="fileType === 'mp3'" class="audio-file">
+          <audio :src="file_url_https" controls></audio>
+        </div>
+
+        <div v-else-if="fileType === 'mp4'" class="video-file">
+          <video :src="file_url_https" controls></video>
+        </div>
+
+        <div v-else-if="fileType === 'txt'" class="text-file">
+          <el-input v-model="text" type="textarea" :readonly="true" resize="none" />
+        </div>
+
         <template v-else-if="fileType !== 'pdf'">
           <iframe
             :src="'https://view.officeapps.live.com/op/view.aspx?src=' + `${file_url_https}`"
@@ -141,7 +153,8 @@ export default {
       curStudentName: '',
       listTimer: null,
       marginLeft: 0,
-      isAlignCenter: true
+      isAlignCenter: true,
+      text: ''
     };
   },
   computed: {
@@ -257,6 +270,13 @@ export default {
         if (fileType === 'pdf') {
           this.getNumPages(file_relative_path);
         }
+
+        if (fileType === 'txt') {
+          fetch(`${process.env.VUE_APP_PDF}${file_relative_path}`).then(async res => {
+            if (!res.ok) return;
+            this.text = await res.text();
+          });
+        }
       });
     },
 
@@ -439,13 +459,33 @@ export default {
   }
 
   &-container {
-    height: calc(55vh - 117px);
+    max-height: calc(55vh - 117px);
     overflow: auto;
 
     .el-image {
       width: 100%;
       height: calc(100% - 4px);
     }
+
+    .audio-file {
+      display: flex;
+      justify-content: center;
+    }
+
+    .video-file {
+      display: flex;
+      justify-content: center;
+      height: 100%;
+    }
+
+    .text-file {
+      height: calc(55vh - 117px);
+
+      .el-textarea,
+      textarea {
+        height: 100%;
+      }
+    }
   }
 }
 </style>

src/views/login/index.vue

@@ -14,7 +14,6 @@
 
       <el-form-item prop="user_name">
         <el-input
-          ref="user_name"
           v-model="loginForm.user_name"
           type="text"
           name="user_name"
@@ -25,7 +24,6 @@
 
       <el-form-item prop="password">
         <el-input
-          ref="password"
           v-model="loginForm.password"
           type="password"
           name="password"
@@ -89,8 +87,8 @@ export default {
         user_type: ''
       },
       loginRules: {
-        user_name: [{ require: true, trigger: 'blur', validator: validateUsername }],
-        password: [{ require: true, trigger: 'blur', validator: validatePassword }]
+        user_name: [{ trigger: 'blur', validator: validateUsername }],
+        password: [{ trigger: 'blur', validator: validatePassword }]
       },
       loading: false,
       redirect: null
@@ -147,20 +145,20 @@ export default {
 
 <style lang="scss">
 .login-container {
-  background-color: #f5f5f5;
-  min-height: 100%;
   width: 100%;
+  min-height: 100%;
   overflow: hidden;
+  background-color: #f5f5f5;
 
   .title-container {
     position: relative;
 
     .title {
+      margin: 0 auto 40px;
       font-size: 26px;
+      font-weight: bold;
       color: #999;
-      margin: 0 auto 40px auto;
       text-align: center;
-      font-weight: bold;
     }
   }