瀏覽代碼

代码格式化

喻文俊 3 年之前
父節點
當前提交
a175a1513c

+ 247 - 225
src/main/resources/static/js/encyclopedia/common.js

@@ -2,6 +2,7 @@
 
 var scrollFlag = false;
 var navbarIndex = 0;
+
 /**
  * 防抖
  * @param {*} func 执行数
@@ -11,32 +12,33 @@ var navbarIndex = 0;
  */
 
 function debounce(func, wait, immediate) {
-  var timeout, result;
-  return function () {
-    var context = this;
-    var args = arguments;
-    if (timeout) clearTimeout(timeout);
-
-    if (immediate) {
-      var callNow = !timeout;
-      timeout = setTimeout(function () {
-        timeout = null;
-      }, wait);
-      if (callNow) result = func.apply(context, args);
-    } else {
-      timeout = setTimeout(function () {
-        func.apply(context, args);
-      }, wait);
-    }
-
-    return result;
-  };
+    var timeout, result;
+    return function () {
+        var context = this;
+        var args = arguments;
+        if (timeout) clearTimeout(timeout);
+
+        if (immediate) {
+            var callNow = !timeout;
+            timeout = setTimeout(function () {
+                timeout = null;
+            }, wait);
+            if (callNow) result = func.apply(context, args);
+        } else {
+            timeout = setTimeout(function () {
+                func.apply(context, args);
+            }, wait);
+        }
+
+        return result;
+    };
 } // 还原滚动状态
 
 
 var resetScrollFlag = debounce(function () {
-  scrollFlag = false;
+    scrollFlag = false;
 }, 200);
+
 /**
  * 监听视窗大小
  * @param {*} size 视窗断点大小
@@ -44,18 +46,19 @@ var resetScrollFlag = debounce(function () {
  */
 
 function responseScreen(size, callback) {
-  var isPc = $(window).width() > size; // callback(isPc)
-
-  $(window).resize(function () {
-    if (!isPc && $(this).width() > size) {
-      isPc = true;
-      callback(isPc);
-    } else if (isPc && $(this).width() < size) {
-      isPc = false;
-      callback(isPc);
-    }
-  });
+    var isPc = $(window).width() > size; // callback(isPc)
+
+    $(window).resize(function () {
+        if (!isPc && $(this).width() > size) {
+            isPc = true;
+            callback(isPc);
+        } else if (isPc && $(this).width() < size) {
+            isPc = false;
+            callback(isPc);
+        }
+    });
 }
+
 /**
  * 菜单栏折叠展开 父子容器
  * @param {*} bindEl 触发事件的元素
@@ -67,32 +70,33 @@ function responseScreen(size, callback) {
 
 
 function collapseToggle(bindEl, eventName, callback) {
-  var isCollapse = false; // 获取元素
-
-  bindEl = $(bindEl);
-  var parent = $(bindEl.attr('data-collapse-parent-target'));
-  var children = $(bindEl.attr('data-collapse-children-target'));
-  parent.css('transition', 'height 0.4s'); // 获取父子容器高度
-
-  var parentHeight = parent.height();
-  var childrenHeight = children.height();
-  if (parentHeight >= childrenHeight) return bindEl.hide(); // 绑定点击事件
-
-  bindEl.on(eventName, function () {
-    var height = isCollapse ? parentHeight : childrenHeight;
-    parent.height(height); //为父元素重新设置高度
-
-    isCollapse = !isCollapse; // 执行回调
-
-    callback({
-      bindEl: bindEl,
-      parent: parent,
-      children: children,
-      height: height,
-      isCollapse: isCollapse
+    var isCollapse = false; // 获取元素
+
+    bindEl = $(bindEl);
+    var parent = $(bindEl.attr('data-collapse-parent-target'));
+    var children = $(bindEl.attr('data-collapse-children-target'));
+    parent.css('transition', 'height 0.4s'); // 获取父子容器高度
+
+    var parentHeight = parent.height();
+    var childrenHeight = children.height();
+    if (parentHeight >= childrenHeight) return bindEl.hide(); // 绑定点击事件
+
+    bindEl.on(eventName, function () {
+        var height = isCollapse ? parentHeight : childrenHeight;
+        parent.height(height); //为父元素重新设置高度
+
+        isCollapse = !isCollapse; // 执行回调
+
+        callback({
+            bindEl: bindEl,
+            parent: parent,
+            children: children,
+            height: height,
+            isCollapse: isCollapse
+        });
     });
-  });
 }
+
 /**
  * 设置高亮
  * @param {*} selector 节点选择器
@@ -101,17 +105,18 @@ function collapseToggle(bindEl, eventName, callback) {
 
 
 var activeCategory = debounce(function (selector, index) {
-  if (!selector || typeof index !== 'number') return;
-  var activeWidth = 0;
-  var selectorList = selector.split(',');
-  $('.navigate li, .category-list li').removeClass('active');
-  selectorList.forEach(function (el) {
-    $(el.trim()).eq(index).addClass('active');
-    activeWidth = $(el.trim()).eq(index).width();
-  });
-  var offset = ($(window).width() - activeWidth) / 2;
-  categoryScrollTo('#category ul', 0, offset);
+    if (!selector || typeof index !== 'number') return;
+    var activeWidth = 0;
+    var selectorList = selector.split(',');
+    $('.navigate li, .category-list li').removeClass('active');
+    selectorList.forEach(function (el) {
+        $(el.trim()).eq(index).addClass('active');
+        activeWidth = $(el.trim()).eq(index).width();
+    });
+    var offset = ($(window).width() - activeWidth) / 2;
+    categoryScrollTo('#category ul', 0, offset);
 }, 200);
+
 /**
  *
  * @param {*} el 监听的元素
@@ -119,24 +124,25 @@ var activeCategory = debounce(function (selector, index) {
  */
 
 function stickyResponse(el) {
-  var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-  var callback = arguments.length > 2 ? arguments[2] : undefined;
-  $(window).scroll(function () {
-    var scrollTop = $(this).scrollTop();
-
-    if (scrollTop >= offset) {
-      callback({
-        sticky: true,
-        scrollTop: scrollTop
-      });
-    } else {
-      callback({
-        sticky: false,
-        scrollTop: scrollTop
-      });
-    }
-  });
+    var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+    var callback = arguments.length > 2 ? arguments[2] : undefined;
+    $(window).scroll(function () {
+        var scrollTop = $(this).scrollTop();
+
+        if (scrollTop >= offset) {
+            callback({
+                sticky: true,
+                scrollTop: scrollTop
+            });
+        } else {
+            callback({
+                sticky: false,
+                scrollTop: scrollTop
+            });
+        }
+    });
 }
+
 /**
  *
  * @param {*} offsetEls 需要获取的元素列表
@@ -144,16 +150,17 @@ function stickyResponse(el) {
 
 
 function getScrollOffset(offsetEl) {
-  if (typeof offsetEl === 'string') {
-    return $(offsetEl).height();
-  }
-
-  var height = 0;
-  offsetEl.forEach(function (el) {
-    height += $(el).height();
-  });
-  return height;
+    if (typeof offsetEl === 'string') {
+        return $(offsetEl).height();
+    }
+
+    var height = 0;
+    offsetEl.forEach(function (el) {
+        height += $(el).height();
+    });
+    return height;
 }
+
 /**
  * 侧边栏点击跳转
  * @param {*} selector 侧边栏节点选择器
@@ -164,22 +171,23 @@ function getScrollOffset(offsetEl) {
 
 
 function bindCategory(selector, floorEl) {
-  var offset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
-  var callback = arguments.length > 3 ? arguments[3] : undefined;
-  $(selector).on('click', function () {
-    scrollFlag = true;
-    resetScrollFlag();
-    var index = $(this).index();
-    var floor = $(floorEl).eq(index);
-    if (!floor.length) return;
-    var floorTop = floor.offset().top - offset;
-    $('html ,body').animate({
-      scrollTop: floorTop
-    }, 400, 'linear', function () {
-      callback(index);
+    var offset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+    var callback = arguments.length > 3 ? arguments[3] : undefined;
+    $(selector).on('click', function () {
+        scrollFlag = true;
+        resetScrollFlag();
+        var index = $(this).index();
+        var floor = $(floorEl).eq(index);
+        if (!floor.length) return;
+        var floorTop = floor.offset().top - offset;
+        $('html ,body').animate({
+            scrollTop: floorTop
+        }, 400, 'linear', function () {
+            callback(index);
+        });
     });
-  });
 }
+
 /**
  * 监听页面滚动并观察元素是否在滚动区间
  * @param {*} selector 被观察的元素节点选择器
@@ -189,26 +197,27 @@ function bindCategory(selector, floorEl) {
 
 
 function pageScrollObserve(selector) {
-  var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-  var callback = arguments.length > 2 ? arguments[2] : undefined;
-  $(window).scroll(function () {
-    if (scrollFlag) return;
-    var scrollTop = $(this).scrollTop();
-
-    if (scrollTop < $(selector).eq(0).offset().top - offset) {
-      callback(null, -1);
-    }
-
-    $(selector).each(function (index, el) {
-      var offsetTop = $(el).offset().top - offset;
-      var height = $(el).height();
-
-      if (scrollTop >= offsetTop && scrollTop < offsetTop + height) {
-        callback(el, index);
-      }
+    var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+    var callback = arguments.length > 2 ? arguments[2] : undefined;
+    $(window).scroll(function () {
+        if (scrollFlag) return;
+        var scrollTop = $(this).scrollTop();
+
+        if (scrollTop < $(selector).eq(0).offset().top - offset) {
+            callback(null, -1);
+        }
+
+        $(selector).each(function (index, el) {
+            var offsetTop = $(el).offset().top - offset;
+            var height = $(el).height();
+
+            if (scrollTop >= offsetTop && scrollTop < offsetTop + height) {
+                callback(el, index);
+            }
+        });
     });
-  });
 }
+
 /**
  * 动态生成侧边导航
  * @param {*} selector 从该节点元素中获取文本
@@ -217,18 +226,19 @@ function pageScrollObserve(selector) {
 
 
 function makeNavigate(selector, bindEl) {
-  var ul = document.createElement('ul');
-  $(selector).each(function (index, el) {
-    var li = document.createElement('li');
-    var a = document.createElement('a');
-    a.innerText = $(el).text();
-    a.setAttribute('href', '#' + $(el).text());
-    li.appendChild(a);
-    if (index === 0) li.classList.add('active');
-    ul.appendChild(li);
-  });
-  $(bindEl).append(ul);
+    var ul = document.createElement('ul');
+    $(selector).each(function (index, el) {
+        var li = document.createElement('li');
+        var a = document.createElement('a');
+        a.innerText = $(el).text();
+        a.setAttribute('href', '#' + $(el).text());
+        li.appendChild(a);
+        if (index === 0) li.classList.add('active');
+        ul.appendChild(li);
+    });
+    $(bindEl).append(ul);
 }
+
 /**
  * 可折叠楼层
  * @param {*} options
@@ -245,77 +255,89 @@ function makeNavigate(selector, bindEl) {
 
 
 function makeFloorList(options) {
-  var row = options.size / options.col; //每列显示的个数
-
-  var floorMap = [];
-  var minHeight = options.minHeight; // 最小高度
-
-  $(options.root).each(function (index, el) {
-    var floorInfo = floorMap[index] = Object.create(null);
-    var selector = floorInfo.$floor = $(el); // 当前楼层对象
-    floorInfo.count = selector.find(options.item).length; // 总数
-    floorInfo.step = Math.ceil(floorInfo.count / options.size); // 可展开步数
-    floorInfo.current = 1; // 当前步数
-    floorInfo.hasMore = floorInfo.count > options.size; // 是否还有更多
-    // 初始化高度,只有在可展开时设置初始高度
-    if (floorInfo.hasMore) {
-      floorInfo.height = minHeight * row * floorInfo.current;
-      selector.find(options.collapse).height(floorInfo.height);
-      selector.find(options.collapse).css({
-        overflow: 'hidden',
-        transition: 'height .4s'
-      });
-    }
-  });
-  // 为按钮绑定事件
-  floorMap.forEach(function (floor) {
-    if (!floor.hasMore) return floor.$floor.find(options.touch).parent().hide();
-    floor.$floor.find(options.touch).on('click', function () {
-      moreClick(floor);
-    });
-  });
-  // 查看更多
-  function moreClick(floor) {
-    if (floor.current === floor.step) return closeMore(floor); // 剩下的个数
-    var lastCount = floor.count - options.size * floor.current;
-    floor.current++;
-    floor.hasMore = floor.current < floor.step; // 如果还有更多
-    if (floor.hasMore || lastCount > 3) {
-      floor.$floor.find(options.collapse).height(minHeight * row * floor.current);
-    } else {
-      floor.$floor.find(options.collapse).height(minHeight * row * (floor.current - 1) + minHeight);
+    var row = options.size / options.col; //每列显示的个数
+
+    var floorMap = [];
+    var minHeight = options.minHeight; // 最小高度
+
+    $(options.root).each(function (index, el) {
+        var floorInfo = floorMap[index] = Object.create(null);
+        var selector = floorInfo.$floor = $(el); // 当前楼层对象
+
+        floorInfo.count = selector.find(options.item).length; // 总数
+
+        floorInfo.step = Math.ceil(floorInfo.count / options.size); // 可展开步数
+
+        floorInfo.current = 1; // 当前步数
+
+        floorInfo.hasMore = floorInfo.count > options.size; // 是否还有更多
+        // 初始化高度,只有在可展开时设置初始高度
+
+        if (floorInfo.hasMore) {
+            floorInfo.height = minHeight * row * floorInfo.current;
+            selector.find(options.collapse).height(floorInfo.height);
+            selector.find(options.collapse).css({
+                overflow: 'hidden',
+                transition: 'height .4s'
+            });
+        }
+    }); // 为按钮绑定事件
+
+    floorMap.forEach(function (floor) {
+        if (!floor.hasMore) return floor.$floor.find(options.touch).parent().hide();
+        floor.$floor.find(options.touch).on('click', function () {
+            moreClick(floor);
+        });
+    }); // 查看更多
+
+    function moreClick(floor) {
+        if (floor.current === floor.step) return closeMore(floor); // 剩下的个数
+
+        var lastCount = floor.count - options.size * floor.current;
+        floor.current++;
+        floor.hasMore = floor.current < floor.step; // 如果还有更多
+
+        if (floor.hasMore || lastCount > 3) {
+            floor.$floor.find(options.collapse).height(minHeight * row * floor.current);
+        } else {
+            floor.$floor.find(options.collapse).height(minHeight * row * (floor.current - 1) + minHeight);
+        } // 展开回调
+
+
+        options.open(floor);
+    } // 全部收起
+
+
+    function closeMore(floor) {
+        floor.current = 1;
+        floor.hasMore = true;
+        floor.$floor.find(options.collapse).height(floor.height); // 收起回调
+
+        options.close(floor);
     }
-    // 展开回调
-    options.open(floor);
-  }
-
-  // 全部收起
-  function closeMore(floor) {
-    floor.current = 1;
-    floor.hasMore = true;
-    floor.$floor.find(options.collapse).height(floor.height); // 收起回调
-    options.close(floor);
-  }
 } // 激活导航栏
 
 
 function activeNavbar(selector) {
-  var baseHref = window.location.href;
-  navbarIndex = localStorage.getItem('navbarIndex') || 0;
-  selector = $(selector);
-  selector.each(function (index, el) {
-    $(el).removeClass('active');
-    if ($(el).find('a').length > 0) {
-      var href = $(el).find('a').attr('href');
-      href = href.split('?')[0].split('#')[0];
-      if (baseHref.indexOf(href) > -1) {
-        navbarIndex = index;
-        localStorage.setItem('navbarIndex', navbarIndex)
-      }
-    }
-  });
-  selector.eq(navbarIndex).addClass('active');
+    var baseHref = window.location.href;
+    navbarIndex = localStorage.getItem('navbarIndex') || 0;
+    selector = $(selector);
+    selector.each(function (index, el) {
+        $(el).removeClass('active');
+
+        if ($(el).find('a').length > 0) {
+            var href = $(el).find('a').attr('href');
+            href = href.split('?')[0].split('#')[0];
+
+            if (baseHref.indexOf(href) > -1) {
+                navbarIndex = index;
+                localStorage.setItem('navbarIndex', navbarIndex);
+            }
+        }
+    });
+    selector.eq(navbarIndex).addClass('active');
 }
+
 /**
  * 将导航滚动到激活位置
  * @param {*} selector 导航元素
@@ -326,36 +348,36 @@ function activeNavbar(selector) {
 
 
 function categoryScrollTo(selector, scrollLeft) {
-  var offset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
-  if ($(window).width <= 768) return;
-  selector = $(selector);
-  var sub = selector.children().eq(0).offset().left + offset;
-  scrollLeft = Math.ceil(selector.find('.active').offset().left - sub);
-  $(selector).animate({
-    scrollLeft: scrollLeft
-  }, 200, 'linear');
+    var offset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+    if ($(window).width <= 768) return;
+    selector = $(selector);
+    var sub = selector.children().eq(0).offset().left + offset;
+    scrollLeft = Math.ceil(selector.find('.active').offset().left - sub);
+    $(selector).animate({
+        scrollLeft: scrollLeft
+    }, 200, 'linear');
 } // 移动端绑定滑动事件
 
 
 function slideBarHandle(selector) {
-  var display = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'block';
-  if ($(window).width() > 768) return;
-  selector = $(selector);
-  var target = $(selector.attr('data-target'));
-  selector.on('click', function () {
-    target.slideDown();
-    target.css('display', display);
-  });
-  target.on('click', function () {
-    target.slideUp();
-  });
+    var display = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'block';
+    if ($(window).width() > 768) return;
+    selector = $(selector);
+    var target = $(selector.attr('data-target'));
+    selector.on('click', function () {
+        target.slideDown();
+        target.css('display', display);
+    });
+    target.on('click', function () {
+        target.slideUp();
+    });
 }
 
 $(function () {
-  activeNavbar('.navbar .nav li');
-  slideBarHandle('#menuBtn', 'flex');
-  slideBarHandle('#hotKeyword');
-  responseScreen(768, function () {
-    window.location.reload();
-  });
+    activeNavbar('.navbar .nav li');
+    slideBarHandle('#menuBtn', 'flex');
+    slideBarHandle('#hotKeyword');
+    responseScreen(768, function () {
+        window.location.reload();
+    });
 });

+ 25 - 25
src/main/resources/static/js/encyclopedia/detail.js

@@ -1,35 +1,35 @@
 "use strict";
 
 $(function () {
-  // 页面滚动偏移
-  var offset = 0; // 生成导航
+    // 页面滚动偏移
+    var offset = 0; // 生成导航
 
-  makeNavigate('.section h2', '.navigate');
+    makeNavigate('.section h2', '.navigate');
 
-  if ($(window).width() > 768) {
-    offset = getScrollOffset('.navbar') + 10;
-  } else {
-    offset = getScrollOffset(['.navbar', '.navigate']) + 10;
-  } // 侧边导航跳转
+    if ($(window).width() > 768) {
+        offset = getScrollOffset('.navbar') + 10;
+    } else {
+        offset = getScrollOffset(['.navbar', '.navigate']) + 10;
+    } // 侧边导航跳转
 
 
-  bindCategory('.navigate li', '.section', offset, function (index) {
-    activeCategory('.navigate li', index);
-  }); // 页面滚动观测
+    bindCategory('.navigate li', '.section', offset, function (index) {
+        activeCategory('.navigate li', index);
+    }); // 页面滚动观测
 
-  pageScrollObserve('.section', offset, function (el, index) {
-    if (index > -1) {
-      activeCategory('.navigate li', index);
-    }
-  }); // 常见问题展开收起
+    pageScrollObserve('.section', offset, function (el, index) {
+        if (index > -1) {
+            activeCategory('.navigate li', index);
+        }
+    }); // 常见问题展开收起
 
-  $('[data-toggle="collapse"]').each(function (index, el) {
-    var targetEl = $(el).attr('data-target');
-    if (!targetEl) return;
-    $(targetEl).hide();
-    $(el).on('click', function () {
-      $(targetEl).toggle();
-      $(el).toggleClass('arrowup');
+    $('[data-toggle="collapse"]').each(function (index, el) {
+        var targetEl = $(el).attr('data-target');
+        if (!targetEl) return;
+        $(targetEl).hide();
+        $(el).on('click', function () {
+            $(targetEl).toggle();
+            $(el).toggleClass('arrowup');
+        });
     });
-  });
-});
+});

+ 69 - 69
src/main/resources/static/js/encyclopedia/index.js

@@ -1,80 +1,80 @@
 "use strict";
 
 $(function () {
-  var windowWidth = $(window).width(); // 页面滚动偏移
+    var windowWidth = $(window).width(); // 页面滚动偏移
 
-  var offset = 0; // pc端
+    var offset = 0; // pc端
 
-  if (windowWidth > 768) {
-    offset = getScrollOffset('.navbar'); // 导航菜单展开折叠
+    if (windowWidth > 768) {
+        offset = getScrollOffset('.navbar'); // 导航菜单展开折叠
 
-    collapseToggle('[data-collapse-toggle="category"]', 'click', function (result) {
-      var bindEl = result.bindEl,
-          parent = result.parent,
-          height = result.height,
-          isCollapse = result.isCollapse;
-      var text = isCollapse ? '展开' : '收起';
-      var lineHeight = height - 32;
-      bindEl.children('.icon').toggleClass('arrowup');
-      bindEl.children('span').text(text);
-      parent.children('.name').children('em').height(lineHeight);
-    }); // 可折叠楼层
+        collapseToggle('[data-collapse-toggle="category"]', 'click', function (result) {
+            var bindEl = result.bindEl,
+                parent = result.parent,
+                height = result.height,
+                isCollapse = result.isCollapse;
+            var text = isCollapse ? '展开' : '收起';
+            var lineHeight = height - 32;
+            bindEl.children('.icon').toggleClass('arrowup');
+            bindEl.children('span').text(text);
+            parent.children('.name').children('em').height(lineHeight);
+        }); // 可折叠楼层
 
-    makeFloorList({
-      root: '.floor',
-      // 根节点元素
-      collapse: '.article',
-      //可折叠元素
-      item: '.section',
-      // 子元素
-      touch: '.more-btn',
-      // 事件绑定元素
-      size: 6,
-      // 每页最多显示的子元素个数
-      col: 3,
-      // 每列最多显示的子元素个数
-      minHeight: $('.floor').find('.section').height() + 24,
-      // 单个子元素的高度
-      // 展开时的回调
-      open: function open(floor) {
-        if (floor.current === floor.step) {
-          floor.$floor.find('.more span').text('收起全部');
-          floor.$floor.find('.more .icon').addClass('arrowup');
-        }
-      },
-      // 收起时的回调
-      close: function close(floor) {
-        floor.$floor.find('.more span').text('查看更多');
-        floor.$floor.find('.more .icon').removeClass('arrowup');
-      }
-    });
-  } else {
-    // 移动端
-    offset = getScrollOffset(['.navbar', '.category']);
-    stickyResponse('#category', getScrollOffset('.banner'), function (e) {
-      if (e.sticky) {
-        $('#category-list').addClass('fixed');
-      } else {
-        $('#category-list').removeClass('fixed');
-      }
-    });
-  } // 生成导航
+        makeFloorList({
+            root: '.floor',
+            // 根节点元素
+            collapse: '.article',
+            //可折叠元素
+            item: '.section',
+            // 子元素
+            touch: '.more-btn',
+            // 事件绑定元素
+            size: 6,
+            // 每页最多显示的子元素个数
+            col: 3,
+            // 每列最多显示的子元素个数
+            minHeight: $('.floor').find('.section').height() + 24,
+            // 单个子元素的高度
+            // 展开时的回调
+            open: function open(floor) {
+                if (floor.current === floor.step) {
+                    floor.$floor.find('.more span').text('收起全部');
+                    floor.$floor.find('.more .icon').addClass('arrowup');
+                }
+            },
+            // 收起时的回调
+            close: function close(floor) {
+                floor.$floor.find('.more span').text('查看更多');
+                floor.$floor.find('.more .icon').removeClass('arrowup');
+            }
+        });
+    } else {
+        // 移动端
+        offset = getScrollOffset(['.navbar', '.category']);
+        stickyResponse('#category', getScrollOffset('.banner'), function (e) {
+            if (e.sticky) {
+                $('#category-list').addClass('fixed');
+            } else {
+                $('#category-list').removeClass('fixed');
+            }
+        });
+    } // 生成导航
 
 
-  makeNavigate('.floor h2', '.navigate');
-  makeNavigate('.floor h2', '#category-list'); // 楼层滚动
+    makeNavigate('.floor h2', '.navigate');
+    makeNavigate('.floor h2', '#category-list'); // 楼层滚动
 
-  bindCategory('.navigate li,.category-list li', '.floor', offset, function (index) {
-    activeCategory('.navigate li, .category-list li', index);
-  }); // 页面滚动
+    bindCategory('.navigate li,.category-list li', '.floor', offset, function (index) {
+        activeCategory('.navigate li, .category-list li', index);
+    }); // 页面滚动
 
-  $('.navigate').hide();
-  pageScrollObserve('.floor', offset, function (el, index) {
-    if (index > -1) {
-      windowWidth > 768 && $('.navigate').fadeIn();
-      activeCategory('.navigate li, .category-list li', index);
-    } else {
-      windowWidth > 768 && $('.navigate').fadeOut();
-    }
-  });
-});
+    $('.navigate').hide();
+    pageScrollObserve('.floor', offset, function (el, index) {
+        if (index > -1) {
+            windowWidth > 768 && $('.navigate').fadeIn();
+            activeCategory('.navigate li, .category-list li', index);
+        } else {
+            windowWidth > 768 && $('.navigate').fadeOut();
+        }
+    });
+});

+ 104 - 76
src/main/resources/static/js/supplier-center/article/article-edit.js

@@ -1,95 +1,113 @@
+"use strict";
 
-
-new Vue({
+var articleEdit = new Vue({
     el: '#articleEdit',
     mixins: [formMixin, uploadMixin],
     data: {
         NODE_ENV_BASE_URL: '',
         editor: null,
-        shopId: GLOBAL_SHOP_ID, // 供应商id
+        shopId: GLOBAL_SHOP_ID,
+        // 供应商id
         formData: {
-            articleId: 0, // 文章id
-            title: '', // 标题
-            articleContent: '', // 内容
-            guidanceImage: '', // 引导图
-            keyword: '', // seo关键词
-            label: '', // 标签
-            publisher: '', // 发布人
-            recommendContent: '', // 推荐语
-            source: '', // 来源
-            status: 1, // 状态
-            typeId: '', // 文章分类
+            articleId: 0,
+            // 文章id
+            title: '',
+            // 标题
+            articleContent: '',
+            // 内容
+            guidanceImage: '',
+            // 引导图
+            keyword: '',
+            // seo关键词
+            label: '',
+            // 标签
+            publisher: '',
+            // 发布人
+            recommendContent: '',
+            // 推荐语
+            source: '',
+            // 来源
+            status: 1,
+            // 状态
+            typeId: '' // 文章分类
+
         },
         articleLabels: [],
         chooseLabels: [],
         articleTypeList: [],
-        addLabelName: '',
+        addLabelName: ''
     },
     watch: {
-        chooseLabels: function (newVal) {
+        chooseLabels: function chooseLabels(newVal) {
             this.formData.label = newVal.join(',');
         },
-        'formData.label': function (newVal, oldVal) {
+        'formData.label': function formDataLabel(newVal, oldVal) {
             if (!newVal.trim()) {
                 return this.chooseLabels = [];
             }
+
             if (newVal === oldVal) return;
             this.chooseLabels = newVal.split(',');
         }
     },
-    created() {
+    created: function created() {
         this.init();
     },
-    mounted() {
-        this.NODE_ENV_BASE_URL = $('#coreServer').val();
-        // console.log(this.NODE_ENV_BASE_URL);
+    mounted: function mounted() {
+        this.NODE_ENV_BASE_URL = $('#coreServer').val(); // console.log(this.NODE_ENV_BASE_URL);
+
         $('.navLayout').find('.navList').removeClass("on").find('.con').hide().find('a').removeClass("on");
         $('.navLayout').find('.navList').eq(2).addClass("on").find('.con').show().find('a').eq(0).addClass("on");
         this.initEditor();
     },
-    beforeDestroy() {
+    beforeDestroy: function beforeDestroy() {
         // 销毁编辑器
         this.editor.destroy();
         this.editor = null;
     },
     methods: {
         // 页面初始化
-        init() {
-            const articleId = localStorage.getItem('articleId') || 0;
+        init: function init() {
+            var articleId = localStorage.getItem('articleId') || 0;
             localStorage.removeItem('articleId');
             this.formData.articleId = articleId;
-            this.fetchArticleCatagory();
-            // 文章id就是修改文章
+            this.fetchArticleCatagory(); // 文章id就是修改文章
+
             this.fetchFormList();
         },
         // 获取标签列表和分类列表
-        fetchFormList() {
-            const that = this;
-            SupplierApi.GetArticleForm({articleId: this.formData.articleId}, function (res) {
+        fetchFormList: function fetchFormList() {
+            var that = this;
+            SupplierApi.GetArticleForm({
+                articleId: this.formData.articleId
+            }, function (res) {
                 if (res.code === 0) {
                     // console.log(res);
-                    that.articleLabels = res.data.articleLabels.split(',');
-                    // 初始化表单数据
+                    that.articleLabels = res.data.articleLabels.split(','); // 初始化表单数据
+
                     if (res.data.shopArticle) {
-                        that.setFormData(res.data.shopArticle)
+                        that.setFormData(res.data.shopArticle);
                     }
                 } else {
                     CAIMEI.Alert(res.msg, '确定', false);
                 }
-            })
+            });
         },
-        setFormData(shopArticle) {
-            for (let key in this.formData) {
-                if(key === 'status' || key === 'typeId'){
+        // 设置表单初始数据
+        setFormData: function setFormData(shopArticle) {
+            for (var key in this.formData) {
+                if (key === 'status' || key === 'typeId') {
                     this.formData[key] = shopArticle[key].toString();
-                }else{
+                } else {
                     this.formData[key] = shopArticle[key];
                 }
             }
+
             this.editor.txt.html(this.formData.articleContent);
         },
-        fetchArticleCatagory() {
-            const that = this;
+        // 获取文章分类
+        fetchArticleCatagory: function fetchArticleCatagory() {
+            var that = this;
             SupplierApi.ArticleCategory({}, function (res) {
                 if (res.code === 0) {
                     // console.log(res);
@@ -97,94 +115,104 @@ new Vue({
                 } else {
                     CAIMEI.Alert(res.msg, '确定', false);
                 }
-            })
+            });
         },
-        labelClick(index) {
-            const newLabel = this.articleLabels[index];
-            const popIndex = this.chooseLabels.indexOf(newLabel);
+        // 选择文章标签
+        labelClick: function labelClick(index) {
+            var newLabel = this.articleLabels[index];
+            var popIndex = this.chooseLabels.indexOf(newLabel);
+
             if (popIndex > -1) {
                 this.chooseLabels.splice(popIndex, 1);
             } else {
                 this.chooseLabels.push(newLabel);
             }
         },
-        addLabel() {
+        // 手动添加文章标签
+        addLabel: function addLabel() {
             if (!this.addLabelName.trim()) return;
             if (this.chooseLabels.indexOf(this.addLabelName) > -1) return this.addLabelName = '';
             this.chooseLabels.push(this.addLabelName);
-            this.addLabelName = ''
+            this.addLabelName = '';
         },
-        checkLabel(index) {
-            return this.chooseLabels.indexOf(this.articleLabels[index]) > -1
+        // 判断标签是否被选
+        checkLabel: function checkLabel(index) {
+            return this.chooseLabels.indexOf(this.articleLabels[index]) > -1;
         },
-        // 引导图上传
-        fileInputChange(e) {
-            this.uploadImage(e.target.files[0]).then(res => {
-                this.formData.guidanceImage = res;
-            })
+        // 引导图上传(文章封面图)
+        fileInputChange: function fileInputChange(e) {
+            var _this = this;
+
+            this.uploadImage(e.target.files[0]).then(function (res) {
+                _this.formData.guidanceImage = res;
+            });
         },
         // 初始化富文本
-        initEditor() {
-            const E = window.wangEditor;
+        initEditor: function initEditor() {
+            var E = window.wangEditor;
             this.editor = new E("#editor");
             this.initEditorOptions(this.editor, this.NODE_ENV_BASE_URL);
             this.editor.create();
         },
         // 保存 提交表单
-        handleSave() {
+        handleSave: function handleSave() {
+            var _this2 = this;
+
             this.formData.articleContent = this.editor.txt.html();
-            this.handleFormData();
-            // console.log(this.formData);
-            this.validAll(this.formData).then(valid => {
+            this.handleFormData(); // console.log(this.formData);
+
+            this.validAll(this.formData).then(function (valid) {
                 console.log(valid);
-                this.save()
-            }).catch(err => {
+
+                _this2.save();
+            }).catch(function (err) {
                 console.log(err);
-            })
+            });
         },
         // 保存接口
-        save() {
+        save: function save() {
             this.formData.shopId = this.shopId;
             SupplierApi.ArticleSubmitSave(this.formData, function (res) {
                 if (res.code === 0) {
                     CAIMEI.dialog('保存成功');
                     localStorage.setItem('refreshType', '1'); // 通知文章列表需要刷新
+
                     setTimeout(function () {
                         window.location.href = '/supplier/article/list.html';
-                    }, 2000)
+                    }, 2000);
                 } else {
                     CAIMEI.Alert(res.msg, '确定', false);
                 }
-            })
+            });
         },
         // 处理表单数据
-        handleFormData() {
-            const that = this;
+        handleFormData: function handleFormData() {
+            var that = this;
             $('.form').submit(function (eventData) {
-                const formData = that.serializeArrayToObj($(this).serializeArray());
-                for (let key in formData) {
+                var formData = that.serializeArrayToObj($(this).serializeArray());
+
+                for (var key in formData) {
                     if (key === 'typeId' || key === 'status') {
                         that.formData[key] = Number(formData[key]);
                     } else {
                         that.formData[key] = formData[key];
                     }
                 }
+
                 return false;
-            })
+            });
         },
         // 表单数据转为对象
-        serializeArrayToObj(serializeArray) {
-            const obj = Object.create(null);
+        serializeArrayToObj: function serializeArrayToObj(serializeArray) {
+            var obj = Object.create(null);
             serializeArray.forEach(function (item) {
-                obj[item.name] = item.value
+                obj[item.name] = item.value;
             });
             return obj;
         },
-        handleBack() {
+        handleBack: function handleBack() {
+            // window.open('/supplier/article/list.html')
             window.close();
         }
     }
 });
-
-
-

+ 75 - 60
src/main/resources/static/js/supplier-center/article/article-list.js

@@ -1,10 +1,12 @@
+"use strict";
+
 var articleList = new Vue({
     el: '#articleList',
     data: {
         refreshType: '',
         hidden: '',
         visibilityChange: '',
-        listRecord: 30,
+        listRecord: 0,
         shopId: GLOBAL_SHOP_ID || 0,
         listQuery: {
             articleId: '',
@@ -18,81 +20,87 @@ var articleList = new Vue({
         pageInput: 1,
         pageTotal: 0,
         articleList: [],
-        articleTypeList: [],
+        articleTypeList: []
     },
     computed: {
-        pageTotal: function () {
+        pageTotal: function pageTotal() {
             var total = Math.ceil(this.listRecord / this.listQuery.pageSize);
             return total > 0 ? total : 1;
         },
-        showPageBtn: function () {
+        showPageBtn: function showPageBtn() {
             var total = Math.ceil(this.listRecord / this.listQuery.pageSize);
             total = total > 0 ? total : 1;
-            var index = this.listQuery.pageNum, arr = [];
+            var index = this.listQuery.pageNum,
+                arr = [];
+
             if (total <= 6) {
                 for (var i = 1; i <= total; i++) {
                     arr.push(i);
                 }
+
                 return arr;
             }
+
             if (index <= 3) return [1, 2, 3, 4, 5, 0, total];
             if (index >= total - 2) return [1, 0, total - 4, total - 3, total - 2, total - 1, total];
             return [1, 0, index - 2, index - 1, index, index + 1, index + 2, 0, total];
         }
     },
     filters: {
-        formatDate(date) {
+        // 时间格式化
+        formatDate: function formatDate(date) {
             if (!date) return '---';
-            return dateFormat(new Date(date))
+            return dateFormat(new Date(date));
         }
     },
-    created() {
+    created: function created() {
         this.getArticleList();
-        this.fetchArticleCatagory()
+        this.fetchArticleCatagory();
     },
-    mounted() {
-        this.bindWindowHiddenOrVis()
+    mounted: function mounted() {
+        // this.bindWindowHiddenOrVis();
         $('.navLayout').find('.navList').removeClass("on").find('.con').hide().find('a').removeClass("on");
         $('.navLayout').find('.navList').eq(2).addClass("on").find('.con').show().find('a').eq(0).addClass("on");
     },
     methods: {
         // 获取文章列表
-        getArticleList() {
-            const that = this;
+        getArticleList: function getArticleList() {
+            var that = this;
             this.listQuery.shopId = this.shopId;
             SupplierApi.GetArticleList(this.listQuery, function (res) {
-                console.log(res);
+                // console.log(res);
                 if (res.code === 0) {
                     that.listRecord = res.data.total;
                     that.articleList = res.data.list;
-                    that.pageTotal = res.data.pages
+                    that.pageTotal = res.data.pages;
                 } else {
                     CAIMEI.Alert(res.msg, '确定', false);
                 }
-            })
+            });
         },
         //表格操作按钮点击
-        clickOption(article, type) {
-            const handles = {
+        clickOption: function clickOption(article, type) {
+            var handles = {
                 1: this.toEdit,
                 2: this.changeStatus,
                 3: this.toDetail,
-                4: this.handleDelete,
+                4: this.handleDelete
             };
-            handles[type](article)
+            handles[type](article);
         },
-        //编辑
-        toEdit(article) {
+        //跳转编辑页面
+        toEdit: function toEdit(article) {
             localStorage.setItem('articleId', article.articleId);
-            window.open('/supplier/article/edit.html')
+            window.open('/supplier/article/edit.html');
         },
         //修改状态
-        changeStatus(article) {
-            let newStatus = 1;
+        changeStatus: function changeStatus(article) {
+            var newStatus = 1;
+
             if (article.status === 1) {
-                newStatus = 0
+                newStatus = 0;
             }
-            // return;
+
             SupplierApi.ArticleStatusChange({
                 articleId: article.articleId,
                 shopId: this.shopId,
@@ -105,70 +113,77 @@ var articleList = new Vue({
                 } else {
                     CAIMEI.dialog('修改文章状态失败!');
                 }
-            })
+            });
         },
         //查看
-        toDetail() {
+        toDetail: function toDetail() {
         },
-        handleAddArticle() {
-            window.open('/supplier/article/edit.html')
+        // 跳转添加文章页面
+        handleAddArticle: function handleAddArticle() {
+            window.open('/supplier/article/edit.html');
         },
-        handleSearchList() {
+        // 查询文章列表
+        handleSearchList: function handleSearchList() {
             this.listQuery.pageNum = 1;
             this.getArticleList();
         },
-        fetchArticleCatagory() {
-            const that = this;
+        // 获取文章列表
+        fetchArticleCatagory: function fetchArticleCatagory() {
+            var that = this;
             SupplierApi.ArticleCategory({}, function (res) {
                 if (res.code === 0) {
-                    // console.log(res);
                     that.articleTypeList = res.data;
                 } else {
                     CAIMEI.Alert(res.msg, '确定', false);
                 }
-            })
+            });
         },
-        //删除
-        handleDelete(article) {
-            const that = this;
-            const params = {
+        //删除确认
+        handleDelete: function handleDelete(article) {
+            var that = this;
+            var params = {
                 content: '确认删除改文章?',
                 cancelBtnText: '取消',
                 confitmBtnText: '删除'
             };
             CAIMEI.Popup(params, function () {
-                that.articleDelete(article)
-            })
+                that.articleDelete(article);
+            });
         },
-        articleDelete(article) {
-            const that = this;
-            SupplierApi.ArticleRemove({articleId: article.articleId}, function (res) {
+        // 删除文章
+        articleDelete: function articleDelete(article) {
+            var that = this;
+            SupplierApi.ArticleRemove({
+                articleId: article.articleId
+            }, function (res) {
                 if (res.code === 0) {
                     that.getArticleList();
                     CAIMEI.dialog('删除文章成功!');
                 } else {
                     CAIMEI.dialog('删除文章失败!');
                 }
-            })
+            });
         },
         //页码跳转
-        toPagination: function (pageNum) {
+        toPagination: function toPagination(pageNum) {
             if (pageNum <= this.pageTotal) {
-                this.listQuery.pageNum = pageNum;
-                console.log('页码跳转');
+                this.listQuery.pageNum = pageNum; // console.log('页码跳转');
+
                 this.getArticleList();
             }
         },
-        checkNum: function () {
+        // 输入框设置页码
+        checkNum: function checkNum() {
             if (this.pageInput > this.pageTotal) {
                 this.pageInput = this.pageTotal;
             } else if (this.pageInput < 1) {
                 this.pageInput = 1;
             }
         },
-        bindWindowHiddenOrVis() {
+        bindWindowHiddenOrVis: function bindWindowHiddenOrVis() {
             // 设置隐藏属性和改变可见属性的事件的名称
-            if (typeof document.hidden !== "undefined") { // Opera 12.10 and Firefox 18 and later support
+            if (typeof document.hidden !== "undefined") {
+                // Opera 12.10 and Firefox 18 and later support
                 this.hidden = "hidden";
                 this.visibilityChange = "visibilitychange";
             } else if (typeof document.msHidden !== "undefined") {
@@ -177,8 +192,9 @@ var articleList = new Vue({
             } else if (typeof document.webkitHidden !== "undefined") {
                 this.hidden = "webkitHidden";
                 this.visibilityChange = "webkitvisibilitychange";
-            }
-            // 如果浏览器不支持addEventListener 或 Page Visibility API 给出警告
+            } // 如果浏览器不支持addEventListener 或 Page Visibility API 给出警告
+
+
             if (typeof document.addEventListener === "undefined" || typeof document[this.hidden] === "undefined") {
                 console.log("This demo requires a browser, such as Google Chrome or Firefox, that supports the Page Visibility API.");
             } else {
@@ -187,21 +203,20 @@ var articleList = new Vue({
             }
         },
         // 如果页面是展示状态 && 需要刷新列表,则刷新列表
-        handleVisibilityChange() {
-            const that = this;
+        handleVisibilityChange: function handleVisibilityChange() {
+            var that = this;
             this.refreshType = window.localStorage.getItem('refreshType');
+
             if (document[that.hidden]) {
                 console.log(this.refreshType);
                 console.log('article list page is show');
+
                 if (this.refreshType) {
                     that.listQuery.pageNum = 1;
                     window.localStorage.removeItem('refreshType');
-                    that.getArticleList()
+                    that.getArticleList();
                 }
             }
         }
     }
 });
-
-
-

+ 60 - 43
src/main/resources/static/js/supplier-center/article/formMixin.js

@@ -1,3 +1,5 @@
+"use strict";
+
 var formMixin = {
     data: {
         validData: {},
@@ -10,12 +12,12 @@ var formMixin = {
             }, {
                 maxLength: 10,
                 minLength: 2,
-                message: '最大字符长度为10,最小字符长度为2',
+                message: '最大字符长度为10,最小字符长度为2'
             }],
             label: [{
                 required: true,
                 message: '请输入文章标签',
-                trigger: ['blur','change']
+                trigger: ['blur', 'change']
             }],
             keyword: [{
                 required: true,
@@ -51,21 +53,21 @@ var formMixin = {
                 required: true,
                 message: '请选择文章状态',
                 trigger: 'change'
-            }],
+            }]
         }
     },
-    mounted() {
+    mounted: function mounted() {
         //初始化表单验证
-        this.initValidForm(this.formData)
+        this.initValidForm(this.formData);
     },
-    created() {
+    created: function created() {
         //初始化验证关系对象
         this.initValidData();
     },
     methods: {
         //初始化验证关系对象
-        initValidData() {
-            for (let key in this.rules) {
+        initValidData: function initValidData() {
+            for (var key in this.rules) {
                 this.$set(this.validData, key, {
                     valid: true,
                     message: ''
@@ -73,54 +75,66 @@ var formMixin = {
             }
         },
         //初始化表单验证
-        initValidForm(formData) {
-            const that = this;
-            for (let key in this.rules) {
-                const rules = this.rules[key];
-                const input = document.querySelector(`.form-item[prop="${key}"] input`);
-                const textarea = document.querySelector(`.form-item[prop="${key}"] textarea`);
-                const trigger = rules[0].trigger.toString();
-                if(trigger.indexOf('blur') > -1){
+        initValidForm: function initValidForm(formData) {
+            var _this = this;
+
+            var that = this;
+
+            var _loop = function _loop(key) {
+                var rules = _this.rules[key];
+                var input = document.querySelector(".form-item[prop=\"".concat(key, "\"] input"));
+                var textarea = document.querySelector(".form-item[prop=\"".concat(key, "\"] textarea"));
+                var trigger = rules[0].trigger.toString();
+
+                if (trigger.indexOf('blur') > -1) {
                     if (input) {
                         input.addEventListener('blur', function () {
-                            that.validInputHandle(formData, key, rules)
-                        })
+                            that.validInputHandle(formData, key, rules);
+                        });
                     }
+
                     if (textarea) {
                         textarea.addEventListener('blur', function () {
-                            that.validInputHandle(formData, key, rules)
-                        })
+                            that.validInputHandle(formData, key, rules);
+                        });
                     }
                 }
-                if(trigger.indexOf('change') > -1){
-                    const  str = 'formData.' + key;
-                    that.$watch(str, function(newVal, oldVal){
-                        that.validInputHandle(formData, key, rules)
-                    })
+
+                if (trigger.indexOf('change') > -1) {
+                    var str = 'formData.' + key;
+                    that.$watch(str, function (newVal, oldVal) {
+                        that.validInputHandle(formData, key, rules);
+                    });
                 }
+            };
+
+            for (var key in this.rules) {
+                _loop(key);
             }
         },
         //数据校验
-        validInputHandle(formData, key, rules) {
-            const validData = {
+        validInputHandle: function validInputHandle(formData, key, rules) {
+            var validData = {
                 valid: true,
                 message: ''
             };
             rules.forEach(function (rule, index) {
-                if (!validData.valid) return;
-                // 字符长度
-                const len = formData[key].toString().trim().length;
-                // 是否必填
+                if (!validData.valid) return; // 字符长度
+
+                var len = formData[key].toString().trim().length; // 是否必填
+
                 if (rule.required && !formData[key]) {
                     validData.valid = false;
                     validData.message = rule.message || '';
-                }
-                // 最大值最小值
-                if ((rule.maxLength && len < rule.minLength) || (rule.maxLength && len > rule.maxLength)) {
+                } // 最大值最小值
+
+
+                if (rule.maxLength && len < rule.minLength || rule.maxLength && len > rule.maxLength) {
                     validData.valid = false;
                     validData.message = rule.message || '';
-                }
-                // 自定义校验规则
+                } // 自定义校验规则
+
+
                 if (rule.pattern && !rule.pattern.test(formData[key])) {
                     validData.valid = false;
                     validData.message = rule.message || '';
@@ -128,18 +142,21 @@ var formMixin = {
             });
             this.validData[key] = validData;
         },
-        validAll(formData) {
-            for (let key in this.rules) {
-                const rules = this.rules[key];
+        // 验证全部数据
+        validAll: function validAll(formData) {
+            for (var key in this.rules) {
+                var rules = this.rules[key];
                 this.validInputHandle(formData, key, rules);
             }
-            for(let key in this.validData){
+
+            for (var _key in this.validData) {
                 // console.log(key, this.validData[key].valid);
-                if(!this.validData[key].valid) {
-                    return Promise.reject(false)
+                if (!this.validData[_key].valid) {
+                    return Promise.reject(false);
                 }
             }
-            return Promise.resolve(true)
+
+            return Promise.resolve(true);
         }
     }
 };

+ 13 - 9
src/main/resources/static/js/supplier-center/article/uploadMixin.js

@@ -1,33 +1,37 @@
+"use strict";
+
 var uploadMixin = {
     methods: {
-        initEditorOptions(editor, baseUrl) {
-            const that = this;
+        // 富文本框配置
+        initEditorOptions: function initEditorOptions(editor, baseUrl) {
+            var that = this;
             this.editor.config.zIndex = 333;
             this.editor.config.height = 400;
             this.editor.config.uploadImgMaxSize = 2 * 1024 * 1024;
             this.editor.config.uploadImgMaxLength = 5; // 一次最多上传 5 个图片
+
             this.editor.config.customUploadImg = function (resultFiles, insertImgFn) {
                 resultFiles.forEach(function (file) {
                     // resultFiles 是 input 中选中的文件列表
                     // insertImgFn 是获取图片 url 后,插入到编辑器的方法
-                    that.uploadImage(file).then(res => {
+                    that.uploadImage(file).then(function (res) {
                         insertImgFn(res);
-                    })
+                    });
                 });
-            }
+            };
         },
         // 上传图片
-        uploadImage(file) {
-            const formData = new FormData();
+        uploadImage: function uploadImage(file) {
+            var formData = new FormData();
             formData.append('file', file);
             return new Promise(function (resolve, reject) {
                 PublicApi.uploadimg(formData, function (res) {
                     if (res.code === 0) {
                         resolve(res.data);
                     }
-                    reject()
+                    reject();
                 });
-            })
+            });
         }
     }
 };

+ 1 - 1
src/main/resources/templates/encyclopedia/product.html

@@ -16,7 +16,7 @@
 <template th:replace="encyclopedia/components/header"></template>
 <!-- banner -->
 <div class="banner">
-    <img src="https://picsum.photos/1920/510" alt="采美百科"/>
+    <img th:src="@{banner}" alt="采美百科"/>
 </div>
 <!-- 产品 / 仪器分类 -->
 <div class="category container" id="category">