Browse Source

修改上传视频的loding及排序的间距

秦鹏 3 years ago
parent
commit
e979c60d4a

+ 21 - 13
src/components/Adult/inputModules/VideoControl.vue

@@ -1,6 +1,6 @@
 <!--  -->
 <template>
-  <div class="Big-Book-Record" v-if="curQue">
+  <div class="Big-Book-Record" v-if="curQue" v-loading="loading2">
     <div class="adult-book-input-item">
       <span class="adult-book-lable">视频:</span>
       <Upload
@@ -84,22 +84,30 @@ export default {
     },
     // 获取不同视频清晰度 definition
     getqxd(id) {
-      this.loading2 = this.$loading({
-        lock: true,
-        text: "Loading",
-        spinner: "el-icon-loading",
-        background: "rgba(0, 0, 0, 0.7)",
-      });
+      // this.loading2 = this.$loading({
+      //   lock: true,
+      //   text: "Loading",
+      //   spinner: "el-icon-loading",
+      //   background: "rgba(0, 0, 0, 0.7)",
+      // });
+      this.loading2 = true;
       let Mname = "tool-VideoConversion_720P_480P";
       let data = {
         file_id: id,
       };
-      getContentFile(Mname, data).then((res) => {
-        this.curQue.definition_list = [];
-        this.curQue.definition_list.push(res["480P"]);
-        this.curQue.definition_list.push(res["720P"]);
-        // this.loading2.close();
-      });
+      getContentFile(Mname, data)
+        .then((res) => {
+          this.curQue.definition_list = [];
+          this.curQue.definition_list.push(res["480P"]);
+          this.curQue.definition_list.push(res["720P"]);
+          // this.loading2.close();
+          this.loading2 = false;
+        })
+        .catch((res) => {
+          console.log(res);
+          this.$message.warning("生成清晰度失败,请重新上传视频");
+          this.loading2 = false;  
+        });
     },
   },
   //生命周期 - 创建完成(可以访问当前this实例)

+ 11 - 8
src/components/Adult/preview/SentenceSortQP.vue

@@ -113,14 +113,16 @@ export default {
     SortArr(newval, oldval) {
       this.SortArr.forEach((item) => {
         item.forEach((it, i) => {
-          if (i == 0) {
-            let str = it.pinyin[0];
-            str = str.toUpperCase();
-            it.pinyin = this.changeStr(it.pinyin, 0, str);
-          } else {
-            let str = it.pinyin[0];
-            str = str.toLowerCase();
-            it.pinyin = this.changeStr(it.pinyin, 0, str);
+          if (item.pinyin) {
+            if (i == 0) {
+              let str = it.pinyin[0];
+              str = str.toUpperCase();
+              it.pinyin = this.changeStr(it.pinyin, 0, str);
+            } else {
+              let str = it.pinyin[0];
+              str = str.toLowerCase();
+              it.pinyin = this.changeStr(it.pinyin, 0, str);
+            }
           }
         });
       });
@@ -311,6 +313,7 @@ export default {
     border-radius: 8px;
     position: relative;
     padding-right: 56px;
+    margin-left: 33px;
     > :nth-child(1) {
       > :nth-child(1) {
         display: flex;

+ 3 - 3
src/components/Adult/preview/VideoControl.vue

@@ -91,7 +91,7 @@ export default {
       autoplay: false,
       volume: 0.5, //视频初始音量大小
       loop: false, //是否循环播放
-      url: _this.curQue.video_list[0].url,
+      url: _this.curQue.definition_list[0].file_url,
       poster:
         _this.curQue.img_list.length > 0 ? _this.curQue.img_list[0].url : "", //视频封面
       height: "100%",
@@ -100,8 +100,8 @@ export default {
     // 设置清晰度
     _this.player.emit("resourceReady", [
       { name: "高清", url: _this.curQue.video_list[0].url },
-      { name: "标清", url: _this.curQue.definition_list[0].file_url },
-      { name: "流畅", url: _this.curQue.definition_list[1].file_url },
+      { name: "标清", url: _this.curQue.definition_list[1].file_url },
+      { name: "流畅", url: _this.curQue.definition_list[0].file_url },
     ]);
     setTimeout(() => {
       let name = document.getElementsByClassName("name")[0];

+ 119 - 119
vue.config.js

@@ -4,7 +4,7 @@ const defaultSettings = require('./src/settings.js')
 const CompressionPlugin = require('compression-webpack-plugin');
 
 function resolve(dir) {
-  return path.join(__dirname, dir)
+    return path.join(__dirname, dir)
 }
 
 const name = defaultSettings.title || '发展汉语' // page title
@@ -20,127 +20,127 @@ const webpack = require('webpack')
 
 // All configuration item explanations can be find in https://cli.vuejs.org/config/
 module.exports = {
-  /**
-   * You will need to set publicPath if you plan to deploy your site under a sub path,
-   * for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
-   * then publicPath should be set to "/bar/".
-   * In most cases please use '/' !!!
-   * Detail: https://cli.vuejs.org/config/#publicpath
-   */
-  publicPath: process.env.NODE_ENV === 'development' ? '/' : '/GCLS-Book-Component-NPC',
-  outputDir: 'dist',
-  assetsDir: 'static',
-  lintOnSave: false,
-  productionSourceMap: false,
-  devServer: {
-    port: port,
-    open: true,
-    overlay: {
-      warnings: false,
-      errors: true
-    },
-    proxy: {
-      // change xxx-api/login => mock/login
-      // detail: https://cli.vuejs.org/config/#devserver-proxy
-      [process.env.VUE_APP_BASE_API]: {
-        //target: `http://gcls.utschool.cn/`,
-        target: `http://gcls.helxsoft.cn/`,
-        changeOrigin: true,
-        pathRewrite: {
-          ['^' + process.env.VUE_APP_BASE_API]: ''
-        }
-      },
-    },
+    /**
+     * You will need to set publicPath if you plan to deploy your site under a sub path,
+     * for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
+     * then publicPath should be set to "/bar/".
+     * In most cases please use '/' !!!
+     * Detail: https://cli.vuejs.org/config/#publicpath
+     */
+    publicPath: process.env.NODE_ENV === 'development' ? '/' : '/GCLS-Book-Component-NPC',
+    outputDir: 'dist',
+    assetsDir: 'static',
+    lintOnSave: false,
+    productionSourceMap: false,
+    devServer: {
+        port: port,
+        open: true,
+        overlay: {
+            warnings: false,
+            errors: true
+        },
+        proxy: {
+            // change xxx-api/login => mock/login
+            // detail: https://cli.vuejs.org/config/#devserver-proxy
+            [process.env.VUE_APP_BASE_API]: {
+                target: `http://gcls.utschool.cn/`,
+                // target: `http://gcls.helxsoft.cn/`,
+                changeOrigin: true,
+                pathRewrite: {
+                    ['^' + process.env.VUE_APP_BASE_API]: ''
+                }
+            },
+        },
 
-    after: require('./mock/mock-server.js')
-  },
-  configureWebpack: {
-    // provide the app's title in webpack's name field, so that
-    // it can be accessed in index.html to inject the correct title.
-    name: name,
-    resolve: {
-      alias: {
-        '@': resolve('src')
-      }
+        after: require('./mock/mock-server.js')
+    },
+    configureWebpack: {
+        // provide the app's title in webpack's name field, so that
+        // it can be accessed in index.html to inject the correct title.
+        name: name,
+        resolve: {
+            alias: {
+                '@': resolve('src')
+            }
+        },
+        plugins: [
+            new webpack.ProvidePlugin({
+                jQuery: 'jquery',
+                $: 'jquery'
+            }),
+            new CompressionPlugin({
+                algorithm: 'gzip', // 使用gzip压缩
+                test: /\.js$|\.html$|\.css$/, // 匹配文件名
+                minRatio: 0.8, // 压缩率小于0.8才会压缩
+                threshold: 10240, // 对超过10k的数据压缩
+                deleteOriginalAssets: false // 是否删除未压缩的源文件,谨慎设置,如果希望提供非gzip的资源,可不设置或者设置为false(比如删除打包后的gz后还可以加载到原始资源文件)
+            })
+        ]
     },
-    plugins: [
-      new webpack.ProvidePlugin({
-        jQuery: 'jquery',
-        $: 'jquery'
-      }),
-      new CompressionPlugin({
-        algorithm: 'gzip', // 使用gzip压缩
-        test: /\.js$|\.html$|\.css$/, // 匹配文件名
-        minRatio: 0.8, // 压缩率小于0.8才会压缩
-        threshold: 10240, // 对超过10k的数据压缩
-        deleteOriginalAssets: false // 是否删除未压缩的源文件,谨慎设置,如果希望提供非gzip的资源,可不设置或者设置为false(比如删除打包后的gz后还可以加载到原始资源文件)
-      })
-    ]
-  },
-  chainWebpack(config) {
-    // it can improve the speed of the first screen, it is recommended to turn on preload
-    config.plugin('preload').tap(() => [{
-      rel: 'preload',
-      // to ignore runtime.js
-      // https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/cli-service/lib/config/app.js#L171
-      fileBlacklist: [/\.map$/, /hot-update\.js$/, /runtime\..*\.js$/],
-      include: 'initial'
-    }])
+    chainWebpack(config) {
+        // it can improve the speed of the first screen, it is recommended to turn on preload
+        config.plugin('preload').tap(() => [{
+            rel: 'preload',
+            // to ignore runtime.js
+            // https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/cli-service/lib/config/app.js#L171
+            fileBlacklist: [/\.map$/, /hot-update\.js$/, /runtime\..*\.js$/],
+            include: 'initial'
+        }])
 
-    // when there are many pages, it will cause too many meaningless requests
-    config.plugins.delete('prefetch')
+        // when there are many pages, it will cause too many meaningless requests
+        config.plugins.delete('prefetch')
 
-    // set svg-sprite-loader
-    config.module
-      .rule('svg')
-      .exclude.add(resolve('src/icons'))
-      .end()
-    config.module
-      .rule('icons')
-      .test(/\.svg$/)
-      .include.add(resolve('src/icons'))
-      .end()
-      .use('svg-sprite-loader')
-      .loader('svg-sprite-loader')
-      .options({
-        symbolId: 'icon-[name]'
-      })
-      .end()
+        // set svg-sprite-loader
+        config.module
+            .rule('svg')
+            .exclude.add(resolve('src/icons'))
+            .end()
+        config.module
+            .rule('icons')
+            .test(/\.svg$/)
+            .include.add(resolve('src/icons'))
+            .end()
+            .use('svg-sprite-loader')
+            .loader('svg-sprite-loader')
+            .options({
+                symbolId: 'icon-[name]'
+            })
+            .end()
 
-    config.when(process.env.NODE_ENV !== 'development', config => {
-      config
-        .plugin('ScriptExtHtmlWebpackPlugin')
-        .after('html')
-        .use('script-ext-html-webpack-plugin', [{
-          // `runtime` must same as runtimeChunk name. default is `runtime`
-          inline: /runtime\..*\.js$/
-        }])
-        .end()
-      config.optimization.splitChunks({
-        chunks: 'all',
-        cacheGroups: {
-          libs: {
-            name: 'chunk-libs',
-            test: /[\\/]node_modules[\\/]/,
-            priority: 10,
-            chunks: 'initial' // only package third parties that are initially dependent
-          },
-          elementUI: {
-            name: 'chunk-elementUI', // split elementUI into a single package
-            priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
-            test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
-          },
-          commons: {
-            name: 'chunk-commons',
-            test: resolve('src/components'), // can customize your rules
-            minChunks: 3, //  minimum common number
-            priority: 5,
-            reuseExistingChunk: true
-          }
-        }
-      })
-      // https:// webpack.js.org/configuration/optimization/#optimizationruntimechunk
-      config.optimization.runtimeChunk('single')
-    })
-  }
+        config.when(process.env.NODE_ENV !== 'development', config => {
+            config
+                .plugin('ScriptExtHtmlWebpackPlugin')
+                .after('html')
+                .use('script-ext-html-webpack-plugin', [{
+                    // `runtime` must same as runtimeChunk name. default is `runtime`
+                    inline: /runtime\..*\.js$/
+                }])
+                .end()
+            config.optimization.splitChunks({
+                    chunks: 'all',
+                    cacheGroups: {
+                        libs: {
+                            name: 'chunk-libs',
+                            test: /[\\/]node_modules[\\/]/,
+                            priority: 10,
+                            chunks: 'initial' // only package third parties that are initially dependent
+                        },
+                        elementUI: {
+                            name: 'chunk-elementUI', // split elementUI into a single package
+                            priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
+                            test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
+                        },
+                        commons: {
+                            name: 'chunk-commons',
+                            test: resolve('src/components'), // can customize your rules
+                            minChunks: 3, //  minimum common number
+                            priority: 5,
+                            reuseExistingChunk: true
+                        }
+                    }
+                })
+                // https:// webpack.js.org/configuration/optimization/#optimizationruntimechunk
+            config.optimization.runtimeChunk('single')
+        })
+    }
 }