简化代码逻辑

assets/js/commonVue.js

@@ -4,7 +4,6 @@ import dialogCom from '/assets/js/component/dialogCom.js'
 import loadingCom from '/assets/js/component/loadingCom.js'
 import headerCom from '/assets/js/component/headerCom.js'
 
-
 const App = {
 
   components: {
@@ -13,7 +12,6 @@ const App = {
     dialogCom,
     loadingCom,
     headerCom
-
   },
   data() {
     return {
@@ -31,7 +29,7 @@ const App = {
         articleid: 0, //访问量统计
         id: 0, //内容详情id
       },
-      dup:'',
+      dup: '',
       currentPath: '',
       articalArray: [], //详情数组
       articalArrayRelated: [], //相关推荐
@@ -78,7 +76,6 @@ const App = {
         }],
       },
 
-
       //首页
       homeList: [],
       status: false,
@@ -93,16 +90,14 @@ const App = {
   },
 
   computed: {
-
   },
-  created: function () { 
-    this.dup=this.getQuery('dup')
+  created: function () {
+    this.dup = this.getQuery('dup')
     this.requestParams.categoryid = this.getQuery('categoryid') ? this.getQuery('categoryid') : ''
     this.requestParams.id = this.getQuery('id') ? this.getQuery('id') : ''
     this.requestParams.articleid = this.getQuery('id') ? this.getQuery('id') : ''
   },
   mounted: function () {
-
     this.getColumnData()
   },
   methods: {
@@ -110,7 +105,7 @@ const App = {
     //获取栏目数据
     getColumnData() {
       var _this = this;
-      if (!localStorage.getItem('storeColumnList') || (window.location.pathname == '/'&&!this.dup) || window.location.pathname == '/index.html') {
+      if (!localStorage.getItem('storeColumnList') || (window.location.pathname == '/' && !this.dup) || window.location.pathname == '/index.html') {
         $.ajax({
           type: 'get',
           dataType: 'json',
@@ -124,8 +119,6 @@ const App = {
             expires
           }));
           _this.loading = false
-
-
           _this.handleColumnData()
         })
       } else {
@@ -142,78 +135,52 @@ const App = {
 
 
     handleColumnData() {
-     
-      if(window.location.pathname=='/'&&!this.dup){//if 首页模板
-        this.currentPath='/template1/'
-      } else if(window.location.pathname=='/'&&this.dup){ //if 首页复用模板
-        this.currentPath='/template1/?dup='+this.dup
-      }else if (window.location.href.indexOf("dup") > 0) { // if 非首页模板
+      if (window.location.pathname == '/' && !this.dup) { //if 首页模板
+        this.currentPath = '/template1/'
+      } else if (window.location.pathname == '/' && this.dup) { //if 首页复用模板
+        this.currentPath = '/template1/?dup=' + this.dup
+      } else if (window.location.href.indexOf("dup") > 0) { // if 非首页模板
         this.currentPath = `${window.location.pathname}?dup=` + this.getQuery('dup')
       } else { //非首页复用模板
         this.currentPath = window.location.pathname;
       }
-
       this.columnList = JSON.parse(localStorage.getItem('storeColumnList')).data;
-
       // 读取并检查是否过期
       if (JSON.parse(localStorage.getItem('storeColumnList')).expires < Date.now()) {
         localStorage.removeItem('storeColumnList');
-      } else {}
-
+      } 
 
       var _this = this;
-
       for (let i = 0; i < _this.columnList.length; i++) {
-
         // 获取反馈弹框类型数据
-        if ( _this.columnList[i].categoryStyle == '2'&& _this.columnList[i].sname == '') {
+        if (_this.columnList[i].categoryStyle == '2' && _this.columnList[i].sname == '') {
           _this.dialogDataArray = (_this.columnList[i].children)
           _this.ruleForm.platName = _this.dialogDataArray[0].categoryName;
         }
 
-
         //栏目处理  
 
         //进入首页
         if (_this.columnList[i].categoryStyle == '1' && (window.location.pathname == '/' || window.location.pathname == '' || window.location.pathname == '/index.html')) {
-          if ( '/?dup=' + _this.columnList[i].sname == `${window.location.pathname}?dup=` + this.getQuery('dup')) {
+          if ('/?dup=' + _this.columnList[i].sname == `${window.location.pathname}?dup=` + this.getQuery('dup')) {
             console.log('首页复用模板')
             getSeoCommon()
-            var objData = _this.columnList.filter(obj =>obj.categoryStyle==1? '/?dup=' + obj.sname == `${window.location.pathname}?dup=` + _this.getQuery('dup'):'');
+            var objData = _this.columnList.filter(obj => obj.categoryStyle == 1 ? '/?dup=' + obj.sname == `${window.location.pathname}?dup=` + _this.getQuery('dup') : '');
             _this.requestParams.categoryid = objData[0].id
             _this.getArticalData(_this.requestParams)
             _this.columnImage = _this.columnList[i].imagePath;
-            _this.modelType = _this.columnList[i].modelType;
-            setTimeout(() => {
-              if (_this.modelType == 2) {
-                document.getElementById("videoPlay").src = _this.columnImage; //url为你需要播放的视频地址
-                document.getElementById("videoPlay").setAttribute('poster', '/assets/img/banner/poster.jpg');
-              }
-            }, 100)
-
-
+            getBannerCommon()
           }
-          if(window.location.href.indexOf("dup") == -1&& !_this.columnList[i].sname  ){
+          if (window.location.href.indexOf("dup") == -1 && !_this.columnList[i].sname) {
             console.log('首页模板')
             getSeoCommon()
             this.requestParams.categoryid = this.columnList[0].id
-            _this.columnImage = _this.columnList[0].imagePath;
-          
             _this.getArticalData(_this.requestParams)
-            _this.modelType = _this.columnList[i].modelType;
-            setTimeout(() => {
-              if (_this.modelType == 2) {
-                document.getElementById("videoPlay").src = _this.columnImage; //url为你需要播放的视频地址
-                document.getElementById("videoPlay").setAttribute('poster', '/assets/img/banner/poster.jpg');
-              }
-            }, 100)
+            _this.columnImage = _this.columnList[0].imagePath;
+            getBannerCommon()
           }
-
-         
         }
 
-
-
         //进入其他栏目页
         if (('/template' + _this.columnList[i].categoryStyle + '/' == window.location.pathname) || (_this.columnList[i].categoryStyle == window.location.pathname.replace('index.html', ''))) {
           if (window.location.href.indexOf("dup") && ('/template' + _this.columnList[i].categoryStyle + '/?dup=' + _this.columnList[i].sname == `${window.location.pathname}?dup=` + this.getQuery('dup'))) {
@@ -222,21 +189,14 @@ const App = {
               _this.requestParams.categoryid = (_this.getQuery('isUrlId') == 1) ? _this.getQuery('categoryid') : _this.columnTypes[0].id;
               _this.getArticalData(_this.requestParams)
               _this.columnImage = _this.columnList[i].imagePath;
-            } else {  
+            } else {
               var objData = _this.columnList.filter(obj => '/template' + obj.categoryStyle + '/?dup=' + obj.sname == `${window.location.pathname}?dup=` + _this.getQuery('dup'));
               _this.requestParams.categoryid = objData[0].id
               _this.getArticalData(_this.requestParams)
               _this.columnImage = _this.columnList[i].imagePath;
             }
             getSeoCommon()
-            _this.modelType = _this.columnList[i].modelType;
-            setTimeout(() => {
-              if (_this.modelType == 2) {
-                document.getElementById("videoPlay").src = _this.columnImage; //url为你需要播放的视频地址
-                document.getElementById("videoPlay").setAttribute('poster', '/assets/img/banner/poster.jpg');
-              }
-            }, 100)
-
+            getBannerCommon()
           }
           if (window.location.href.indexOf("dup") == -1 && !_this.columnList[i].sname && ('/template' + _this.columnList[i].categoryStyle + '/' == window.location.pathname)) {
             if (_this.columnList[i].children.length > 0) {
@@ -250,23 +210,10 @@ const App = {
               _this.getArticalData(_this.requestParams)
               _this.columnImage = _this.columnList[i].imagePath;
             }
-            getSeoCommon()
-            _this.modelType = _this.columnList[i].modelType;
-            setTimeout(() => {
-              if (_this.modelType == 2) {
-                document.getElementById("videoPlay").src = _this.columnImage; //url为你需要播放的视频地址
-                document.getElementById("videoPlay").setAttribute('poster', '/assets/img/banner/poster.jpg');
-              }
-            }, 100)
-            
+           getSeoCommon()
+           getBannerCommon()
           }
-
-          
-
-
-
         } else {
-
           // 进入详情页
           if ('/template' + _this.columnList[i].categoryStyle + '/read.html' == window.location.pathname) {
             getDetailCommon()
@@ -283,40 +230,32 @@ const App = {
             }, 100)
 
             //产品详情时栏目高亮
-            if(window.location.href.indexOf("dup") && ('/template' + _this.columnList[i].categoryStyle+ '/read.html' + '?dup=' + _this.columnList[i].sname == `${window.location.pathname}?dup=` + _this.getQuery('dup'))){
+            if (window.location.href.indexOf("dup") && ('/template' + _this.columnList[i].categoryStyle + '/read.html' + '?dup=' + _this.columnList[i].sname == `${window.location.pathname}?dup=` + _this.getQuery('dup'))) {
               _this.currentPath = `/template${ _this.columnList[i].categoryStyle}/?dup=` + _this.getQuery('dup')
+              _this.columnImage = _this.columnList[i].imagePath; //栏目图片获取
               getSeoCommon()
-
-              _this.modelType = _this.columnList[i].modelType; //栏目图片获取
-            _this.columnImage = _this.columnList[i].imagePath; //栏目图片获取
-              setTimeout(() => {
-                if (_this.modelType == 2) {
-                  document.getElementById("videoPlay").src = _this.columnImage; //url为你需要播放的视频地址
-                  document.getElementById("videoPlay").setAttribute('poster', '/assets/img/banner/poster.jpg');
-                }
-              }, 100)
+              getBannerCommon()
             }
-           
-            if (window.location.href.indexOf("dup") == -1 && !_this.columnList[i].sname && ('/template' + _this.columnList[i].categoryStyle +  '/read.html' == window.location.pathname)) {
-              
+
+            if (window.location.href.indexOf("dup") == -1 && !_this.columnList[i].sname && ('/template' + _this.columnList[i].categoryStyle + '/read.html' == window.location.pathname)) {
               _this.currentPath = `/template${ _this.columnList[i].categoryStyle}/`
+              _this.columnImage = _this.columnList[i].imagePath; //栏目图片获取
               getSeoCommon()
-
-              _this.modelType = _this.columnList[i].modelType; //栏目图片获取
-               _this.columnImage = _this.columnList[i].imagePath; //栏目图片获取
-              setTimeout(() => {
-                if (_this.modelType == 2) {
-                  document.getElementById("videoPlay").src = _this.columnImage; //url为你需要播放的视频地址
-                  document.getElementById("videoPlay").setAttribute('poster', '/assets/img/banner/poster.jpg');
-                }
-              }, 100)
+              getBannerCommon()
             }
-
-            
-            
           }
         }
 
+        function getBannerCommon(){
+          _this.modelType = _this.columnList[i].modelType; //栏目图片获取
+          setTimeout(() => {
+            if (_this.modelType == 2) {
+              document.getElementById("videoPlay").src = _this.columnImage; //url为你需要播放的视频地址
+              document.getElementById("videoPlay").setAttribute('poster', '/assets/img/banner/poster.jpg');
+            }
+          }, 100)
+        }
+
         function getSeoCommon() {
           $('title').text(_this.columnList[i].categoryName);
           $('meta[name="description"]').attr('content', _this.columnList[i].metadescription);
@@ -350,9 +289,7 @@ const App = {
         }
         if (bb) {
           _this.articalArrayRelated = bb.filter(obj => obj.title != _this.articalArray[0].title);
-          // _this.articalArrayRelated = bb
         }
-        // _this.loading = false;
         _this.totalPageSzie = res.data.total
         _this.totalPageNum = Math.ceil(res.data.total / res.data.size);
       }).fail(function (err) {});
@@ -367,14 +304,11 @@ const App = {
 
     //  分页
     oneInnerBox: function (param) {
-     
-      var aa=this.getQuery('dup')
-      if(this.getQuery('dup')){
-        window.location = "./read.html?dup="+aa+"&categoryid=" + param.categoryid + "&id=" + param.id + "&isUrlId=1";
-
-      }else{
+      var aa = this.getQuery('dup')
+      if (this.getQuery('dup')) {
+        window.location = "./read.html?dup=" + aa + "&categoryid=" + param.categoryid + "&id=" + param.id + "&isUrlId=1";
+      } else {
         window.location = "./read.html?categoryid=" + param.categoryid + "&id=" + param.id + "&isUrlId=1";
-
       }
     },
     enterPage: function (res) {
@@ -394,7 +328,6 @@ const App = {
     //申请试用
     goApply: function () {
       this.centerDialogVisible = true
-
     },
 
     lazyFunc: function () {
@@ -406,21 +339,19 @@ const App = {
         window.addEventListener('scroll', lazyLoad)
         // 3 定义页面滚动的处理函数
         function lazyLoad() {
-            for (let i = 0; i < images.length; i++) {
-              // isVisible是否该图片位于可视区域 返回true 或false
-              if (isVisible(images[i])) {
-                // 将元素的自定义属性 data-src 赋值给元素的 src 属性 
-                // dataset.src 此为元素的自定义属性 data-src
-                if(images[i].dataset.src){
-                  images[i].src = images[i].dataset.src // 等价于：img.setAttribute('src', img.getAttribute('data-src'))
-                }
-                // 防止重复被遍历 加载完之后 删除元素不再加载
-                images.splice(i, 1)
-                i--
+          for (let i = 0; i < images.length; i++) {
+            // isVisible是否该图片位于可视区域 返回true 或false
+            if (isVisible(images[i])) {
+              // 将元素的自定义属性 data-src 赋值给元素的 src 属性 
+              // dataset.src 此为元素的自定义属性 data-src
+              if (images[i].dataset.src) {
+                images[i].src = images[i].dataset.src // 等价于：img.setAttribute('src', img.getAttribute('data-src'))
               }
+              // 防止重复被遍历 加载完之后 删除元素不再加载
+              images.splice(i, 1)
+              i--
             }
-
-          
+          }
         }
         lazyLoad()
         // 4 可视区域判断函数
@@ -437,7 +368,6 @@ const App = {
       this.centerDialogVisible = value; // 处理从子组件接收到的数据
     },
 
-
     // 排序
     compare(property) {
       return function (a, b) {