开发活动页＋打包压缩问题解决

build/webpack.prod.conf.js

@@ -156,7 +156,7 @@ if (config.build.productionGzip) {
         config.build.productionGzipExtensions.join('|') +
         ')$'
       ),
-      threshold: 10240,
+      threshold: 1024,
       minRatio: 0.8
     })
   )

config/index.js

@@ -72,7 +72,7 @@ module.exports = {
     // Surge or Netlify already gzip all static assets for you.
     // Before setting to `true`, make sure to:
     // npm install --save-dev compression-webpack-plugin
-    productionGzip: false,
+    productionGzip: true,
     productionGzipExtensions: ['js', 'css'],
 
     // Run the build command with an extra argument to

package.json

@@ -21,6 +21,7 @@
     "@vue-office/pdf": "^0.2.5",
     "@vue/composition-api": "^1.7.1",
     "axios": "^0.26.1",
+    "compression-webpack-plugin": "^1.1.12",
     "docx-preview": "^0.1.15",
     "element-ui": "^2.15.6",
     "image-conversion": "^2.1.1",
@@ -37,11 +38,9 @@
     "vue-pdf": "^4.3.0",
     "vue-router": "^3.0.1",
     "vuex": "^3.6.2",
-    "compression-webpack-plugin": "^6.1.1",
     "xlsx": "^0.18.5"
   },
   "devDependencies": {
-    "image-webpack-loader": "^8.1.0",
     "autoprefixer": "^7.1.2",
     "babel-core": "^6.22.1",
     "babel-helper-vue-jsx-merge-props": "^2.0.3",
@@ -59,6 +58,7 @@
     "file-loader": "^1.1.4",
     "friendly-errors-webpack-plugin": "^1.6.1",
     "html-webpack-plugin": "^2.30.1",
+    "image-webpack-loader": "^8.1.0",
     "node-notifier": "^5.1.2",
     "node-sass": "^7.0.1",
     "optimize-css-assets-webpack-plugin": "^3.2.0",

src/pages/course-detail/components/CourseTree.vue

@@ -1140,6 +1140,7 @@ export default {
               }
             });
           });
+          console.log("rows.filter(e => e)",rows.filter(e => e))
           return Promise.resolve(rows.filter(e => e));
         });
     },

src/pages/course-detail/components/HandOut.vue

@@ -384,7 +384,7 @@ export default {
   }
 }
 .lecture-notesjy {
-  max-height: 416px;
+  height: 416px;
   .header {
     display: flex;
     align-items: center;

src/pages/home/index.vue

@@ -641,6 +641,16 @@
       ref="rebuildModal"
       @rebuildSubmit="rebuildSubmit($event)"
     ></RebuildModal>
+    <div id="packPageDialog" v-if="packPageStatus">
+      <div class="img-box">
+        <img
+          src="@/assets/img/tcs.png"
+          alt=""
+          @click="swiperJump({ jumpType: 2, jumpUrl: '/packPage' })"
+        />
+        <i class="el-icon-circle-close" @click="closePackPage"></i>
+      </div>
+    </div>
   </div>
 </template>
 
@@ -774,7 +784,8 @@ export default {
       couIndex: 0,
       bankIndex: 0,
       courseId: "",
-      bankId: ""
+      bankId: "",
+      packPageStatus:false
     };
   },
   created() {
@@ -810,6 +821,10 @@ export default {
     }
   },
   methods: {
+    closePackPage() {
+      this.packPageStatus = false
+      this.$store.state.packPageStatus = false;
+    },
     //课程
     courseLists() {
       this.$request
@@ -1457,6 +1472,9 @@ export default {
                 }
                 this.bannerList = res.rows;
                 this.colors = res.rows.map(item => {
+                  if(item.jumpUrl == "/packPage" && this.$store.state.packPageStatus){
+                    this.packPageStatus = true
+                  }
                   return item.color ? item.color : "rgba(225,225,225,0.1)";
                 });
                 this.color = this.colors[0];
@@ -2560,4 +2578,29 @@ export default {
 .tooltipStyle .popper__arrow::after {
   border-bottom-color: #3f8dfd !important;
 }
+#packPageDialog {
+  z-index: 9999;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  & > .img-box {
+    position: relative;
+    text-align: center;
+    & > img {
+      cursor: pointer;
+    }
+    & > i {
+      vertical-align: top;
+      color: #fff;
+      cursor: pointer;
+      font-size: 40px;
+    }
+  }
+}
 </style>

src/pages/packPage/index.vue

@@ -0,0 +1,162 @@
+<template>
+  <div id="packPage">
+    <img src="@/assets/img/a88848d9321bc1706685815ea2103b5.png" alt="" />
+    <div
+      v-for="(item, index) in listComputer(screenWidth)"
+      :key="index"
+      @click="jump(item)"
+      :style="item.style"
+    ></div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      screenWidth: 0
+    };
+  },
+  computed: {
+    listComputer: function() {
+      return function(floats) {
+        return [
+          {
+            style: {
+              position: "absolute",
+              left: 360 * floats + "px",
+              top: 1440 * floats + "px",
+              width: 380 * floats + "px",
+              height: 260 * floats + "px",
+              cursor: "pointer"
+            },
+            url: "/bank-list"
+          },
+          {
+            style: {
+              position: "absolute",
+              left: 770 * floats + "px",
+              top: 1440 * floats + "px",
+              width: 380 * floats + "px",
+              height: 260 * floats + "px",
+              cursor: "pointer"
+            },
+            url: "/bank-list"
+          },
+          {
+            style: {
+              position: "absolute",
+              left: 1180 * floats + "px",
+              top: 1440 * floats + "px",
+              width: 380 * floats + "px",
+              height: 260 * floats + "px",
+              cursor: "pointer"
+            },
+            url: "/handout-list"
+          },
+          {
+            style: {
+              position: "absolute",
+              left: 360 * floats + "px",
+              top: 1730 * floats + "px",
+              width: 380 * floats + "px",
+              height: 260 * floats + "px",
+              cursor: "pointer"
+            },
+            url: "/bank-list"
+          },
+          {
+            style: {
+              position: "absolute",
+              left: 770 * floats + "px",
+              top: 1730 * floats + "px",
+              width: 380 * floats + "px",
+              height: 260 * floats + "px",
+              cursor: "pointer"
+            },
+            url: "/handout-list"
+          },
+          ////--------------------------------
+
+          {
+            style: {
+              position: "absolute",
+              left: 360 * floats + "px",
+              top: 2655 * floats + "px",
+              width: 380 * floats + "px",
+              height: 260 * floats + "px",
+              cursor: "pointer"
+            },
+            url: "/bank-list"
+          },
+          {
+            style: {
+              position: "absolute",
+              left: 770 * floats + "px",
+              top: 2655 * floats + "px",
+              width: 380 * floats + "px",
+              height: 260 * floats + "px",
+              cursor: "pointer"
+            },
+            url: "/bank-list"
+          },
+          {
+            style: {
+              position: "absolute",
+              left: 1180 * floats + "px",
+              top: 2655 * floats + "px",
+              width: 380 * floats + "px",
+              height: 260 * floats + "px",
+              cursor: "pointer"
+            },
+            url: "/bank-list"
+          },
+          {
+            style: {
+              position: "absolute",
+              left: 360 * floats + "px",
+              top: 2945 * floats + "px",
+              width: 380 * floats + "px",
+              height: 260 * floats + "px",
+              cursor: "pointer"
+            },
+            url: "/handout-list"
+          },
+          {
+            style: {
+              position: "absolute",
+              left: 770 * floats + "px",
+              top: 2945 * floats + "px",
+              width: 380 * floats + "px",
+              height: 260 * floats + "px",
+              cursor: "pointer"
+            },
+            url: "/handout-list"
+          }
+        ];
+      };
+    }
+  },
+  mounted() {
+    this.screenWidth = (document.body.clientWidth / 1920).toFixed(4);
+    window.onresize = () => {
+      return (() => {
+        this.screenWidth = (document.body.clientWidth / 1920).toFixed(4);
+      })();
+    };
+  },
+  methods: {
+    jump(item) {
+      window.open(item.url, "_blank");
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+#packPage {
+  & > img {
+    width: 100%;
+  }
+}
+</style>

src/pages/person-center/my-course/index.vue

@@ -889,7 +889,7 @@ export default {
           : this.$message({
               type: "warning",
               message:
-                "您的学习账号未开通，请稍后再尝试，有疑问，请联系{{$store.state.userInfo.eduPhone}}！"
+                `您的学习账号未开通，请稍后再尝试，有疑问，请联系${this.$store.state.userInfo.eduPhone}！`
             });
         return false;
       }

src/router/index.js

@@ -61,6 +61,18 @@ const router = new Router({
         }
       }
     },
+    {
+      path: '/packPage',
+      name: '冲刺秘籍大礼包',
+      component: resolve => require(['@/pages/packPage/index'], resolve),
+      meta: {
+        title: + '-建造师造价师在线教育培训报名报考平台',
+        content: {
+          keywords: + '-建造师造价师在线教育培训平台报名报考',
+          description: + '-建造师造价师在线教育培训平台报名报考'
+        }
+      }
+    },
     {
       path: '/cart',
       name: '购物车',
@@ -615,7 +627,7 @@ const router = new Router({
           component: resolve => require(['@/pages/person-center/my-mock/index'], resolve),
           name: '我的模考'
         },
-        { 
+        {
           path: 'my-message',
           component: resolve => require(['@/pages/person-center/my-message/index'], resolve),
           name: '我的消息'

src/store/index.js

@@ -30,6 +30,7 @@ export default new Vuex.Store({
     sysTime: 0,
     businessItem: null,
     businessList: [],
+    packPageStatus: true,
     isDesktop: !navigator.userAgent.match(
       /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|IEMobile)/i
     )