Przeglądaj źródła

Merge remote-tracking branch 'origin/developer' into developerB

zhengjinyi 2 lat temu
rodzic
commit
675c304dc4
28 zmienionych plików z 413 dodań i 71 usunięć
  1. 6 4
      src/main/resources/static/css/activity/attestation.css
  2. 3 3
      src/main/resources/static/css/article/article.css
  3. 2 2
      src/main/resources/static/css/base/base.h5.css
  4. 1 1
      src/main/resources/static/css/encyclopedia/common.css
  5. 2 0
      src/main/resources/static/css/encyclopedia/index.css
  6. BIN
      src/main/resources/static/img/activity/attestation/10.png
  7. BIN
      src/main/resources/static/img/activity/attestation/section_bg_device_04.png
  8. BIN
      src/main/resources/static/img/common/qr_code_caimei.jpg
  9. 14 0
      src/main/resources/static/js/activity/attestation.js
  10. 65 35
      src/main/resources/static/js/article/list.js
  11. 178 0
      src/main/resources/static/js/auto-input.js
  12. 51 6
      src/main/resources/static/js/base.js
  13. 9 0
      src/main/resources/static/js/common/serviceapi/utils.service.js
  14. 27 2
      src/main/resources/static/js/document/beauty-archive.js
  15. 18 0
      src/main/resources/static/js/encyclopedia/common.js
  16. 4 1
      src/main/resources/static/js/encyclopedia/search.js
  17. 5 0
      src/main/resources/static/js/product/detail.js
  18. 6 0
      src/main/resources/static/js/product/list.js
  19. 2 2
      src/main/resources/templates/article/components/article-header.html
  20. 3 3
      src/main/resources/templates/article/list.html
  21. 1 0
      src/main/resources/templates/components/foot-link.html
  22. 2 2
      src/main/resources/templates/components/footer.html
  23. 3 3
      src/main/resources/templates/components/header.html
  24. 3 1
      src/main/resources/templates/document/beauty-archive.html
  25. 2 0
      src/main/resources/templates/encyclopedia/components/footer.html
  26. 2 2
      src/main/resources/templates/encyclopedia/components/header.html
  27. 3 3
      src/main/resources/templates/product/detail.html
  28. 1 1
      src/main/resources/templates/supplier-center/repair/detail.html

+ 6 - 4
src/main/resources/static/css/activity/attestation.css

@@ -135,9 +135,10 @@ li{list-style:none}
     .section_main.ten .section_content .section_li .logo{ width: 98px;height: 98px;margin-bottom: 28px;border-radius: 50%; }
     .section_main.ten .section_content .section_li .name{ font-size: 20px; color: #fff }
     /*.section_main.ten .section_content .section_li:nth-child(1){background-image: url("/img/activity/attestation/section_bg_club_01.png");margin-right: 80px; }*/
-    .section_main.ten .section_content .section_li:nth-child(1){background-image: url("/img/activity/attestation/section_bg_device_03.png"); margin-right: 40px;}
-    .section_main.ten .section_content .section_li:nth-child(2){background-image: url("/img/activity/attestation/section_bg_device_01.png"); margin-right: 40px;}
-    .section_main.ten .section_content .section_li:nth-child(3){background-image: url("/img/activity/attestation/section_bg_device_02.png"); }
+    .section_main.ten .section_content .section_li:nth-child(1){background-image: url("/img/activity/attestation/section_bg_device_03.png"); margin-right: 16px;}
+    .section_main.ten .section_content .section_li:nth-child(2){background-image: url("/img/activity/attestation/section_bg_device_01.png"); margin-right: 16px;}
+    .section_main.ten .section_content .section_li:nth-child(3){background-image: url("/img/activity/attestation/section_bg_device_02.png"); margin-right: 16px;}
+    .section_main.ten .section_content .section_li:nth-child(4){background-image: url("/img/activity/attestation/section_bg_device_04.png"); }
     .section_main.ten .section_content .section_li:hover { -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px);border-bottom-color: #BC1724}
     .section_main.ten .section_content.mobile{display: none !important; }
     /*侧边栏-联系我们*/
@@ -270,7 +271,7 @@ li{list-style:none}
     .section_main.eight .section_content{width: 100%;height: 46.4vw;-webkit-box-sizing: border-box;box-sizing: border-box;}
     .section_main.eight .section_content img{width:82.1vw;height: 46.4vw;display: block;margin: 0 auto;}
     /*section_main 09*/
-    .section_main.nine{height: 78.4vw;background: #F7F7F7;padding:10vw 0 0 0;}
+    .section_main.nine{height: 100vw;background: #F7F7F7;padding:10vw 0 0 0;}
     .section_main.nine .title{width: 100%;margin-bottom: 8vw;}
     .section_main.nine .title h1{line-height: 4.9vw;text-align: center;font-size: 4.8vw;color: #333333;font-weight: normal;}
     .section_main.nine .title h1 span{ display: block; font-size: 3vw;color: #999; margin-top: 2.4vw }
@@ -295,6 +296,7 @@ li{list-style:none}
     .section_main.ten .section_content .section_li_0{background-image: url(/img/activity/attestation/section_bg_device_03.png) }
     .section_main.ten .section_content .section_li_1{background-image: url(/img/activity/attestation/section_bg_device_01.png) }
     .section_main.ten .section_content .section_li_2{background-image: url(/img/activity/attestation/section_bg_device_02.png) }
+    .section_main.ten .section_content .section_li_3{background-image: url(/img/activity/attestation/section_bg_device_04.png) }
     /*.section_main.ten .section_content .section_li:nth-child(3){background-image: url("/img/activity/attestation/section_bg_club_02.png") }*/
     /*.section_main.ten .section_content .section_li:nth-child(4){background-image: url("/img/activity/attestation/section_bg_device_02.png") }*/
     /*.section_main.ten .section_content.pc{display: none !important; }*/

+ 3 - 3
src/main/resources/static/css/article/article.css

@@ -68,7 +68,7 @@ dl,dd,dt{zoom:1}
 	.pageWrap input{box-sizing:border-box;width:80px;height:40px;line-height:40px;font-size:16px;border:1px solid #EBECEF;outline:none;border-radius:2px;text-align:center}
 	.loading{box-sizing:border-box;padding:200px 0;text-align:center}
 	.hasTop{position:fixed;left:0;bottom:0}
-	.header{position:sticky;width:100%;background:#e15616;top:0;left:0;z-index:999}
+	.header{position:sticky;width:100%;background:#e15616;top:0;left:0;z-index:9999}
 	.header .nav{display:table;width:1185px;margin:0 auto}
 	.nav .logo{display:table-cell;vertical-align:top;height:48px;padding:11px 0;margin-right: 16px;}
 	.nav .logo img{width:56px;height:48px}
@@ -242,12 +242,12 @@ dl,dd,dt{zoom:1}
 	#scrollTop .item>span{box-sizing:border-box;display:block;padding:1.5vw;line-height:3.4vw;}
 	#scrollTop .item .toTop:before{display:block;margin:0 auto;width:5.8vw;height:5.8vw;background-position:-58.8vw -9vw}
 	.loading{box-sizing:border-box;padding:20vw 0;text-align:center}
-	.header{position:relative}
+	.header{position: sticky; top: 0; z-index: 9999; background: #f5f5f5;}
 	.h5-head{box-sizing:border-box;width:100%;background:#FFF;height:13.6vw;margin-bottom:2.6vw;padding:0 2.6vw;position:relative}
 	.h5-head .index{float:left;width:9vw;line-height:3.4vw;text-align:center;font-size:3.7vw;color:#333}
 	.h5-head .index img{width:100%}
 	.h5-head .hotWord{float:right;background-color:#e15616;color:#fff;text-align:center;border-radius:5px;width:16vw;height:9.6vw;line-height:9.6vw;font-size:3.7vw;margin-top:2vw}
-	.search{position:absolute;top:2vw;left:15vw;width:64vw;height:9.6vw;line-height:9.6vw;margin:0 auto;box-sizing:border-box;border:1px solid #FFE6DC;border-radius:5px;overflow:hidden}
+	.search{position:absolute;top:2vw;left:15vw;width:64vw;height:9.6vw;line-height:9.6vw;margin:0 auto;box-sizing:border-box;border:1px solid #FFE6DC;border-radius:5px;}
 	.search .keyword{position:absolute;left:0;top:0;border:none;outline:none;width:48vw;height:9.6vw;font-size:3.7vw;color:#4A4F58;text-indent:7.6vw;background:#FFF url(/img/info/search-m.png) no-repeat 1.6vw center;background-size:auto 60%}
 	.search .searchBtn{position:absolute;right:0;top:0;width:16vw;height:9.6vw;font-size:3.7vw;color:#fff;text-align:center;background-color:#e15616}
 	.search .searchBtn:before{content:'搜索'}

+ 2 - 2
src/main/resources/static/css/base/base.h5.css

@@ -5,7 +5,7 @@
 .noneImportant .footTop,
 .noneImportant .footMain{display:none!important;}
 .wechat_qrcode{display: none;}
-.baseHeadCenter,#container,.footMain{width:100%;overflow:hidden;}
+#container,.footMain{width:100%;overflow:hidden;}
 .pcOnly,.jqSelect .pc,.baseHeadCenter .headCart,.baseHeadCenter .hotKey,.baseTopNav_nav{display:none!important;}
 .baseHeadTop .wrap ul>li,.baseHeadTop .header_top_left{display:none;}
 .mIcon:before{content:'';display:inline-block;font-size:0;background:url(/img/base/icon_m.png) no-repeat;background-size:100vw auto;transition:all .5s}
@@ -254,4 +254,4 @@
 .cmbeans-alert-content-tips{width: 100%;height: 5.6vw;line-height: 5.6vw;margin-top: 4vw;box-sizing: border-box;display: flex;flex-direction: column;align-items: center;}
 .cmbeans-alert-content-tips .tips{width: 27.2vw;height: 5.6vw;background-color: rgba(226, 91, 28, 0.1);border-radius: 2.8vw;line-height: 5.6vw;font-size: 2.6vw;color: #E15616;text-align: center;padding: 0 1.2vw;}
 
-
+#globalHead{position: sticky !important; top: 0 !important; left: 0 !important; z-index: 9999;}

+ 1 - 1
src/main/resources/static/css/encyclopedia/common.css

@@ -18,7 +18,7 @@ body{padding-top:80px;}
 .navbar .nav li a{height:80px;padding:0 28px}
 .navbar .nav li a:hover{color:#e15616}
 .navbar .search .search-control form{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
-.navbar .search .search-control .search-input{display:block;width:272px;height:36px;padding:8px 16px;border:1px solid #e15616;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:2px 0 0 2px;color:#4a4f58}
+.navbar .search .search-control .search-input{display:block;width:272px;height:36px;padding:8px 16px;border:1px solid #e15616;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:2px 0 0 2px;color:#4a4f58;font-size: 14px;}
 .navbar .search .search-control .search-input::-webkit-input-placeholder{color:#9aa5b5;font-size:14px}
 .navbar .search .search-control .search-input::-moz-placeholder{color:#9aa5b5;font-size:14px}
 .navbar .search .search-control .search-input:-ms-input-placeholder{color:#9aa5b5;font-size:14px}

+ 2 - 0
src/main/resources/static/css/encyclopedia/index.css

@@ -54,6 +54,7 @@
 .floor .more{padding:32px 0 16px}
 .floor .more .more-btn{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:98px;height:32px;margin:0 auto;border:1px solid #cccccc;border-radius:2px;-webkit-box-sizing:border-box;box-sizing:border-box;font-size:14px;color:#909090;cursor:pointer}
 .floor .more .more-btn:hover{color:#e15616;border-color:#e15616}
+.search-floor{min-height: calc(100vh - 200px)}
 }
 @media screen and (max-width:768px){
 .flex,.flex-start-center,.floor .article .section .content .tag-list,.flex-between-center,.floor .article .section .content .footer,.floor .article .section a,.floor .floor-title,.flex-center,.banner{display:-webkit-box;display:-ms-flexbox;display:flex}
@@ -105,4 +106,5 @@
 .search-floor .emtyp p{margin-top:5vw;font-size:3.2vw;color:#4a4f58}
 .search-floor .article{padding:10vw 4vw 0}
 .search-floor .article .section:first-child{border-top:0}
+.search-floor{min-height: 66vh}
 }

BIN
src/main/resources/static/img/activity/attestation/10.png


BIN
src/main/resources/static/img/activity/attestation/section_bg_device_04.png


BIN
src/main/resources/static/img/common/qr_code_caimei.jpg


+ 14 - 0
src/main/resources/static/js/activity/attestation.js

@@ -17,6 +17,13 @@ new Vue({
                 secondRoute: '',
                 redirect: ''
             },
+            {
+                logo: '/img/activity/attestation/10.png',
+                name: '上海禾雅堂科技有限公司',
+                entryRoute: '/15/hty',
+                secondRoute: '',
+                redirect: 'http://zprz.hoyabeauty.com'
+            },
             {
                 logo: '/img/activity/attestation/1.jpg',
                 name: '上海品辉医疗科技有限公司',
@@ -59,6 +66,13 @@ new Vue({
                 secondRoute: '',
                 redirect: ''
             },
+            {
+                logo: '/img/activity/attestation/10.png',
+                name: '禾雅堂机构认证',
+                entryRoute: '/15/hty',
+                secondRoute: '',
+                redirect: 'http://zprz.hoyabeauty.com'
+            },
         ]
     },
     mounted() {

+ 65 - 35
src/main/resources/static/js/article/list.js

@@ -6,9 +6,9 @@ var requestUrlConfig = {
 
 var articleList = new Vue({
     el: '#articleList',
-    filters:{
-        keywordSlice: function(keyword){
-            return keyword.length > 6 ? keyword.slice(0,6) + '…' : keyword;
+    filters: {
+        keywordSlice: function (keyword) {
+            return keyword.length > 6 ? keyword.slice(0, 6) + '…' : keyword;
         }
     },
     data: {
@@ -24,7 +24,9 @@ var articleList = new Vue({
             keyword: '',
             status: 1,
             startDate: '',
-            endDate: ''
+            endDate: '',
+            productFlag: 1, // 是否统计关键词 1 统计 0 不统计
+            linkageFlag: 0 // 关键词来源是否为用户搜索 0 是 1 不是
         },
         listData: [],
         listRecord: 0,
@@ -64,8 +66,28 @@ var articleList = new Vue({
             self.initQueryParam();
             self.initBase();
         });
+        self.initAuthInputComplete();
     },
+
     methods: {
+        // init auto-input complete
+        initAuthInputComplete(){
+            new AutoComplete({
+                el: '.auto-input',
+                callback: async function(keyword){
+                    try {
+                        const res = await PublicApi.fetchQueryKeywordList({keyword: keyword});
+                        if(!res.data) return [];
+                        return res.data.map(item => item.keyword);
+                    } catch (e) {
+                        console.log(e);
+                    }
+                },
+                itemClick: function (keyword) {
+                    window.location.href = '/info/search-1.html?keyword='+keyword + '&linkageFlag=1';
+                }
+            });
+        },
         // 初始化链接参数
         initQueryParam() {
             if (isPC) {
@@ -76,6 +98,7 @@ var articleList = new Vue({
                 this.params.num = 1;
             }
             this.keyword = getUrlParam("keyword") ? getUrlParam("keyword") : '';
+            this.params.linkageFlag = getUrlParam('linkageFlag') ? getUrlParam('linkageFlag') : 0
             this.params.keyword = this.keyword;
         },
 
@@ -137,14 +160,16 @@ var articleList = new Vue({
                 keyword: this.params.keyword,
                 pageSize: this.params.size,
                 pageNum: this.params.num,
-                status: this.params.status
+                status: this.params.status,
+                productFlag: this.params.productFlag, // 是否统计关键词 1 统计 2 不统计
+                linkageFlag: this.params.linkageFlag // 关键词来源是否为用户搜索 0 是 1 不是
             }
             this.getArticleList(requestUrlConfig['keyword'], params);
         },
 
         // 高亮关键词
-        highlightKeyword: function(str){
-            return str.replace(new RegExp(this.keyword, 'g'), '<span style="color: #E15616">'+ this.keyword +'</span>')
+        highlightKeyword: function (str) {
+            return str.replace(new RegExp(this.keyword, 'g'), '<span style="color: #E15616">' + this.keyword + '</span>')
         },
 
         // 获取文章列表
@@ -171,7 +196,7 @@ var articleList = new Vue({
                         });
                     });
                     // 处理标题和描述
-                    resultData = resultData.map(function (item){
+                    resultData = resultData.map(function (item) {
                         item.title = self.highlightKeyword(item.title);
                         item.intro = self.highlightKeyword(item.intro);
                         return item
@@ -251,7 +276,9 @@ var articleList = new Vue({
         fetchProductList: function () {
             var self = this;
             ProductApi.GetProductSearchList({
-                keyword: this.params.keyword
+                keyword: this.params.keyword,
+                productFlag: 0, // 是否统计关键词 1 统计 0 不统计
+                linkageFlag: 0 // 关键词来源是否为用户搜索 0 是 1 不是
             }, function (res) {
                 res = JSON.parse(res.data);
                 self.productRecord = res.total;
@@ -281,53 +308,56 @@ var articleList = new Vue({
             })
         },
 
+        onPageScroll: debounce(function () {
+            var scrollTop = $('body').scrollTop();
+            var documentHeight = $(document).height();
+            var windowHeight = $('body').height();
+            // alert(scrollTop + windowHeight == documentHeight)
+            if (scrollTop > 600) {
+                $('#scrollTop').show();
+            } else {
+                $('#scrollTop').hide();
+            }
+            if (scrollTop + windowHeight + 100 > documentHeight) {
+                //此处是滚动条到底部时候触发的事件,在这里写要加载的数据,或者是拉动滚动条的操作
+                if (this.params.num < this.pageTotal) { // 获取列表数据
+                    if (this.requestFlag) {
+                        this.params.num = this.params.num + 1;
+                        this.requestAction(this.requestType);
+                    }
+                } else { //到底了
+                    this.noMore = true;
+                    $('footer').removeClass("noneImportant");
+                }
+            }
+        }),
+
         // 页面样式初始化
         initPageReset: function () {
-            var self = this;
             if (!isPC) {
                 $('footer').addClass("noneImportant");
                 //移动端上垃加载更多
-                $('body').on('scroll', function () {
-                    var scrollTop = $(this).scrollTop();
-                    var documentHeight = $(document).height();
-                    var windowHeight = $(this).height();
-                    // alert(scrollTop + windowHeight == documentHeight)
-                    if (scrollTop + windowHeight + 100 > documentHeight) {
-                        //此处是滚动条到底部时候触发的事件,在这里写要加载的数据,或者是拉动滚动条的操作
-                        var totalPage = Math.ceil(self.listRecord / self.params.size) ? Math.ceil(self.listRecord / self.params.size) : 1;
-                        self.params.num = self.params.num + 1;
-                        if (next <= totalPage) { // 获取列表数据
-                            if (self.requestFlag) {
-                                self.requestAction(self.requestType);
-                            }
-                            self.requestFlag = false;
-                        } else { //到底了
-                            self.noMore = false;
-                            $('footer').removeClass("noneImportant");
-                        }
-                    }
-                });
+                $('body').on('scroll', this.onPageScroll);
             }
         },
     }
 });
 
-function initFilterSort(option = {}){
+function initFilterSort(option = {}) {
     var sortControl = $(option.el);
     var sortItem = sortControl.find('.search__sort_select li');
     var sotrCurrent = sortControl.find('.search__sort_current');
 
-    $(window).on('click', function(el){
-        console.log(el);
+    $(window).on('click', function (el) {
         if (sortControl.has(el.target).length > 0) return;
         sortControl.removeClass('active');
     })
 
-    sortControl.on('click', function(){
+    sortControl.on('click', function () {
         $(this).toggleClass('active');
     })
 
-    sortItem.on('click', function(el){
+    sortItem.on('click', function (el) {
         $(this).addClass('selected').siblings('li').removeClass('selected');
         var status = parseInt($(this).attr('data-type'));
         console.log(status)

+ 178 - 0
src/main/resources/static/js/auto-input.js

@@ -0,0 +1,178 @@
+'use strict';
+
+class AutoCompleteBase {
+    constructor(options) {
+        this.options = {
+            el: '#autoInput',
+            callback: (text) => [],
+            itemClick: (text) => {},
+            itemTop: 'auto',
+            follow: 'container',
+            offsetTop: 5,
+            setValueFlag: true,
+        };
+        Object.assign(this.options, options);
+        this.handleInput = this.debounce(this.inputEvent).bind(this);
+        this.handleBlur = this.debounce(this.blurEvent).bind(this);
+        this.init();
+    }
+
+    /**
+     * 初始化dom
+     */
+    init() {
+        this.container = document.querySelector(this.options.el);
+        this.input = this.container.querySelector('input');
+        this.ul = this.container.querySelector('.auto-select-list')
+        if(this.ul){
+            this.ul.remove();
+        }
+        this.ul = document.createElement('ul');
+        this.ul.style.display = 'none';
+        this.ul.classList.add('auto-select-list');
+        this.container.appendChild(this.ul);
+        this.input.addEventListener('input', this.handleInput);
+        this.input.addEventListener('blur', this.handleBlur);
+        this.initStyle();
+    }
+
+    /**
+     * 初始化样式
+     */
+    initStyle() {
+        const containerStyle = getComputedStyle(this.container);
+        console.log(containerStyle.position);
+        if (containerStyle.position === 'static') {
+            this.container.style.position = 'relative';
+        }
+        if (this.options.itemTop === 'auto') {
+            const containerHeight = this.container.offsetHeight;
+            const inputHeight = this.input.offsetHeight;
+            const inputTop = this.input.offsetTop;
+            // const offset = containerHeight - inputHeight + inputTop - this.options.offsetTop;
+            this.ul.style.top = inputHeight + inputTop + this.options.offsetTop + 'px';
+        } else {
+            this.ul.style.top = this.options.itemTop;
+        }
+
+        if (this.options.follow === 'input') {
+            this.ul.style.left = this.input.offsetLeft + 'px';
+            this.ul.style.width = this.input.offsetWidth + 'px';
+        } else {
+            this.ul.style.left = 0;
+            this.ul.style.width = this.container.offsetWidth + 'px';
+        }
+
+        var style = document.createElement('style');
+        style.textContent = `
+        @media screen and (min-width: 768px) {
+            .auto-input ul.auto-select-list{margin: 0;position:absolute;left:0;top:50px;width:50%;padding:8px 0;background:#fff; z-index: 999;box-shadow: 0px 6px 12px 1px rgba(0,0,0,0.1);max-height: 420px;overflow-y:auto;}
+            .auto-input ul.auto-select-list::-webkit-scrollbar { width: 8px; background-color: #fff;}
+            .auto-input ul.auto-select-list::-webkit-scrollbar-thumb { border-radius: 4px; background-color: #e2e2e2;}
+            .auto-input ul.auto-select-list li{padding:0 16px;font-size:14px;line-height:36px;height:36px;color:#2c3e50;user-select: none;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
+            .auto-input ul.auto-select-list li:hover{background:#FEF6F3;}
+        }
+        @media screen and (max-width: 768px) {
+            .auto-input ul.auto-select-list{margin: 0;position:absolute;left:0;top:5vw;width:50%;padding:2.4vw 0;background:#fff; z-index: 999;box-shadow: 0px 0.6vw 1.2vw 0.1vw rgba(0,0,0,0.1);max-height:82vw;overflow-y:auto;}
+            .auto-input ul.auto-select-list::-webkit-scrollbar { width: 1.6vw; background-color: #fff;}
+            .auto-input ul.auto-select-list::-webkit-scrollbar-thumb { border-radius: 0.8vw; background-color: #e2e2e2;}
+            .auto-input ul.auto-select-list li{padding:0 3.2vw;font-size:3.4vw;line-height:8vw;height:8vw;color:#2c3e50;user-select: none;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
+            .auto-input ul.auto-select-list li:hover{background:#ecf0f1;}
+        }
+        `
+        this.container.appendChild(style);
+    }
+
+    /**
+     * 输入框input事件
+     */
+    async inputEvent(e) {
+        this.keyword = e.target.value;
+        this.list = await this.options.callback(this.keyword);
+        if (!(this.list instanceof Array)) {
+            throw Error('callback result mast an array');
+        }
+        this.ul.innerHTML = '';
+        this.renderList();
+        this.ul.style.display = this.list.length > 0 ? 'block' : 'none';
+    }
+
+    /**
+     * 输入框blur事件
+     */
+    blurEvent() {
+        if(!this.isPc()) return
+        this.ul.style.display = 'none';
+    }
+
+    /**
+     * 渲染列表
+     */
+    renderList() {
+        this.list.forEach((text) => {
+            const li = document.createElement('li');
+            li.innerHTML = text.replace(this.keyword, '<span style="color: #E15616;">' + this.keyword + '</span>');
+            li.addEventListener('click', () => this.listItemClick(text));
+            this.ul.appendChild(li);
+        });
+    }
+
+    /**
+     * 列表元素点击事件
+     */
+    listItemClick(text) {
+        if(this.options.setValueFlag){
+            this.input.value = text;
+        }
+        this.ul.innerHTML = '';
+        this.ul.style.display = 'none';
+        this.options.itemClick(text);
+    }
+
+    /**
+     * 防抖
+     */
+    debounce(func, wait = 400, immediate = false) {
+        let timeout, result;
+        return function () {
+            const context = this;
+            const args = arguments;
+            if (timeout) clearTimeout(timeout);
+            if (immediate) {
+                const 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;
+        };
+    }
+
+    isPc(){
+        return window.innerWidth > 768
+    }
+}
+
+class AutoComplete extends  AutoCompleteBase {
+    constructor(options) {
+        super(options);
+    }
+
+    /**
+     * 重写父类方法
+     * 列表元素点击事件
+     */
+    listItemClick(text) {
+        if(this.options.setValueFlag){
+            this.input.value = text;
+        }
+        this.ul.innerHTML = '';
+        this.ul.style.display = 'none';
+        this.options.itemClick(text);
+    }
+}

+ 51 - 6
src/main/resources/static/js/base.js

@@ -69,11 +69,11 @@ var globalHead = new Vue({
     watch:{
         isFiexd: function(nVal,oVal){
             // 防止跳动
-            if(nVal && isPC){
-                $("body").css('paddingTop', $("#globalHead").height() + "px");
-            }else{
-                $("body").css('paddingTop', "0px");
-            }
+            // if(nVal && isPC){
+            //     $("body").css('paddingTop', $("#globalHead").height() + "px");
+            // }else{
+            //     $("body").css('paddingTop', "0px");
+            // }
         }
     },
     methods: {
@@ -223,7 +223,26 @@ var globalHead = new Vue({
             if(!isPC){
                 $("#mGlobalMenu").hide().find(".cShow").hide();
             }
-        }
+        },
+
+        // init auto-input complete
+        initAuthInputComplete(){
+            new AutoComplete({
+                el: '.auto-input',
+                callback: async function(keyword){
+                    try {
+                        const res = await PublicApi.fetchQueryKeywordList({keyword: keyword});
+                        if(!res.data) return [];
+                        return res.data.map(item => item.keyword);
+                    } catch (e) {
+                        console.log(e);
+                    }
+                },
+                itemClick: function (keyword) {
+                    window.location.href = '/product/list.html?keyword='+keyword + '&productFlag=1' + '&linkageFlag=1';
+                }
+            });
+        },
     },
     created: function () {
         var _self = this;
@@ -293,6 +312,7 @@ var globalHead = new Vue({
                 });
             }
         },500);
+        this.initAuthInputComplete();
     }
 });
 // 初始化效果
@@ -904,3 +924,28 @@ function param(json) {
         })
     ).join('&')
 }
+
+
+/**
+ * 防抖
+ */
+function debounce(func, wait = 200, immediate = false) {
+    let timeout, result;
+    return function () {
+        const context = this;
+        const args = arguments;
+        if (timeout) clearTimeout(timeout);
+        if (immediate) {
+            const 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;
+    };
+}

+ 9 - 0
src/main/resources/static/js/common/serviceapi/utils.service.js

@@ -4,6 +4,15 @@
  * auther ZHJY
  */
 var PublicApi = {
+        // 获取搜索关键词
+        fetchQueryKeywordList: function(params){
+            return Http.AjaxService({
+                url:'/commodity/search/query/get/keyword/list',
+                type:'post',
+                data:params,
+                json:false,
+            })
+        },
         // oss 初始化 (临时凭证获取)
         fetchOssInitData: function(params){
             return Http.AjaxService({

+ 27 - 2
src/main/resources/static/js/document/beauty-archive.js

@@ -19,7 +19,9 @@ var beautyArchive = new Vue({
             keyword: '', //查询关键词
             productType: 0, //商品类型 0 全部 1 仪器 2 产品
             pageNum: 1,
-            pageSize: 10
+            pageSize: 10,
+            productFlag: 1, // 是否统计关键词 1 统计 0 不统计
+            linkageFlag: 0 // 关键词来源是否为用户搜索 0 是 1 不是
         },
         keyword: '',
         productList: [],  //商品列表
@@ -48,6 +50,7 @@ var beautyArchive = new Vue({
     },
     mounted() {
         this.getList();
+        this.initAuthInputComplete();
     },
     computed: {
         loadingText: function () {
@@ -82,6 +85,27 @@ var beautyArchive = new Vue({
         }
     },
     methods: {
+        // init auto-input complete
+        initAuthInputComplete(){
+            var _self = this;
+            new AutoComplete({
+                el: '.auto-input',
+                setValueFlag: false,
+                callback: async function(keyword){
+                    try {
+                        const res = await PublicApi.fetchQueryKeywordList({keyword: keyword});
+                        if(!res.data) return [];
+                        return res.data.map(item => item.keyword);
+                    } catch (e) {
+                        console.log(e);
+                    }
+                },
+                itemClick: function (keyword) {
+                    _self.keyword = keyword;
+                    _self.handleSearch(keyword, true);
+                }
+            });
+        },
         //页码跳转
         toPagination: function (pageNum) {
             if (pageNum > this.totalPage || pageNum <= 0) {
@@ -125,7 +149,8 @@ var beautyArchive = new Vue({
             return val.replace(reg, str);
         },
         //搜索
-        handleSearch: function (keyword) {
+        handleSearch: function (keyword, flag) {
+            this.listQuery.linkageFlag = flag === true ? 1 : 0
             this.listQuery.keyword = keyword;
             this.listQuery.pageNum = 1;
             this.productList = [];

+ 18 - 0
src/main/resources/static/js/encyclopedia/common.js

@@ -396,4 +396,22 @@ $(function () {
         searchKeyword.val(val);
         if(!val) return false;
     });
+
+    // init auto-input complete
+    new AutoComplete({
+        el: '.auto-input',
+        setValueFlag: true,
+        callback: async function(keyword){
+            try {
+                const res = await PublicApi.fetchQueryKeywordList({keyword: keyword});
+                if(!res.data) return [];
+                return res.data.map(item => item.keyword);
+            } catch (e) {
+                console.log(e);
+            }
+        },
+        itemClick: function (keyword) {
+            window.location.href = '/encyclopedia/search.html?linkageFlag=1&keyword=' + keyword;
+        }
+    });
 });

+ 4 - 1
src/main/resources/static/js/encyclopedia/search.js

@@ -5,7 +5,9 @@ var search = new Vue({
         listQuery: {
             keyword: '',
             pageSize: 12,
-            pageNum: 1
+            pageNum: 1,
+            productFlag: 1, // 是否统计关键词 1 统计 0 不统计
+            linkageFlag: 0 // 关键词来源是否为用户搜索 0 是 1 不是
         },
         searchList: [], // 查询列表
         totalRecord: 0,
@@ -38,6 +40,7 @@ var search = new Vue({
             var query = this.queryString(window.location.search.slice(1));
             document.querySelector('#searchKeyword').value = query.keyword;
             this.listQuery.keyword = query.keyword || '';
+            this.listQuery.linkageFlag = query.linkageFlag || 0
         },
         // 获取查询列表
         fetchSearchList: function () {

+ 5 - 0
src/main/resources/static/js/product/detail.js

@@ -238,6 +238,11 @@ var productDetail = new Vue({
                     var str = CAIMEI.getUrlParam('open');
                     if (str === 'caimei365' && _self.archiveId > 0) {
                         _self.tabsIndex = 4;
+                        $('body').css({height: '100vh', overflow: 'hidden'})
+                        setTimeout(()=>{
+                            $('body').css({height: '', overflow: ''})
+                            $('html, body').animate({ scrollTop: $('.tabTit').offset().top - $('#globalHead').height() - 50 });
+                        }, 1000);
                     }
                 } else {
                     console.log('<===Error===>',response.msg)

+ 6 - 0
src/main/resources/static/js/product/list.js

@@ -18,6 +18,8 @@ var productList = new Vue({
             // bid: "",
             // sid: "",
             // tid: ""
+            productFlag: 1, // 是否统计关键词 1 统计 0 不统计
+            linkageFlag: 0 // 关键词来源是否为用户搜索 0 是 1 不是
         },
         classify: [],
         listData: [], //priceflag 0公开价格 1不公开价格 2仅对会员机构公开,//userIdentity: 2-会员机构, 4-普通机构
@@ -133,6 +135,8 @@ var productList = new Vue({
                 brandIds: this.params.brandIds, // 品牌Id
                 newFlag: this.params.newFlag, // 查询新品标记,默认0,新品1
                 promotionFlag: this.params.promotionFlag, // 查询促销标记,默认0,促销1
+                productFlag: this.params.productFlag,
+                linkageFlag: this.params.linkageFlag
             },function (res) {
                 if (res.code === 0 && res.data ) {
                     var result = JSON.parse(res.data);
@@ -306,6 +310,8 @@ var productList = new Vue({
             this.hrefBrandId = getUrlParam("bpn") ? getUrlParam("bpn") : null; //bpn 品牌链接参数
             this.params.promotionFlag = getUrlParam("pro") ? getUrlParam("pro")*1 : 0; // pro 促销商品链接参数
             this.params.newFlag = getUrlParam("newg") ? getUrlParam("newg")*1 : 0; // newg 新品链接参数
+            this.params.productFlag = getUrlParam('productFlag') ? getUrlParam('productFlag') : 1
+            this.params.linkageFlag = getUrlParam('linkageFlag') ? getUrlParam('linkageFlag') : 0
             if(this.params.promotionFlag == 1){
                 this.isActiviChecked = true;
             }else{

+ 2 - 2
src/main/resources/templates/article/components/article-header.html

@@ -17,8 +17,8 @@
             </div>
         </div>
         <!--搜索-->
-        <div class="search" id="topSearch">
-            <input class="keyword" type="text" placeholder="请输入关键词" />
+        <div class="search auto-input" id="topSearch">
+            <input class="keyword" type="text" placeholder="请输入关键词" autocomplete="off" />
             <a class="searchBtn icon" href="javascript:void(0);"></a>
         </div>
     </div>

+ 3 - 3
src/main/resources/templates/article/list.html

@@ -41,14 +41,14 @@
                         <div class="search__more" v-if="!isPC && productRecord > 8">
                             <span class="search__more_tip">更多{{keyword | keywordSlice}}产品</span>
                             <span class="search__more_line"></span>
-                            <a class="search__more_link" :href="'/product/list.html?keyword=' + keyword" target="_blank">查看全部</a>
+                            <a class="search__more_link" :href="'/product/list.html?productFlag=0&linkageFlag=0&keyword=' + keyword" target="_blank">查看全部</a>
                         </div>
                     </div>
                 </div>
                 <div class="search__more" v-if="isPC && productRecord > 8">
                     <span class="search__more_tip">更多{{keyword | keywordSlice}}产品</span>
                     <span class="search__more_line"></span>
-                    <a class="search__more_link" :href="'/product/list.html?keyword=' + keyword" target="_blank">查看全部</a>
+                    <a class="search__more_link" :href="'/product/list.html?productFlag=0&linkageFlag=0&keyword=' + keyword" target="_blank">查看全部</a>
                 </div>
             </div>
             <!-- 文章筛选 -->
@@ -98,7 +98,7 @@
                 <p class="nofound">很抱歉,没有找到 “<span v-text="params.keyword"></span>” 相关结果!</p>
                 <p class="change">请修改或者尝试其他搜索词</p>
             </div>
-            <div v-if="(!isPC) && noMore" class="noMore">---- 没有更多了 ----</div>
+            <div v-if="(!isPC) && noMore" class="no-more">---- 没有更多了 ----</div>
             <!--分页-->
             <div v-if="isPC && pageTotal>1" class="pageWrap clear">
                 <a v-if="params.num>1" class="prev" :href="paginationUrl(params.num*1-1)"></a>

+ 1 - 0
src/main/resources/templates/components/foot-link.html

@@ -9,4 +9,5 @@
 <script charset="utf-8" type="text/javascript" th:src="@{/js/common/serviceapi/utils.service.js(v=${version})}"></script>
 <script charset="utf-8" type="text/javascript" th:src="@{/js/common/serviceapi/shopping.service.js(v=${version})}"></script>
 <script charset="utf-8" type="text/javascript" th:src="@{/js/utils.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/auto-input.js(v=${version})}"></script>
 <script charset="utf-8" type="text/javascript" th:src="@{/js/base.js(v=${version})}"></script>

+ 2 - 2
src/main/resources/templates/components/footer.html

@@ -38,8 +38,8 @@
                     <div class="foot-icon caimei">
                         <i class="icon mIcon icon-caimei"></i>
                     </div>
-                    <div class="foot-code"><img src="/img/common/qr_code_caimei.png" alt="采美商城"></div>
-                    <P>采美商城</P>
+                    <div class="foot-code"><img src="/img/common/qr_code_caimei.jpg" alt="采美公众号"></div>
+                    <P>采美公众号</P>
                 </div>
                <div class="item">
                     <div class="foot-icon mini">

+ 3 - 3
src/main/resources/templates/components/header.html

@@ -80,7 +80,7 @@
                 </template>
             </div>
             <div class="searchBox" id="topSearch">
-                <div class="search">
+                <div class="search auto-input" id="autoInput">
                     <div class="jqSelect">
                         <div class="pc">
                             <span data-select="0">产品</span>
@@ -105,8 +105,8 @@
             </div>
             <div class="wechat_qrcode">
                 <div class="q_item">
-                    <div class="q_item_icon"><img src="/img/common/qr_code_caimei.png" alt="采美公众号"></div>
-                    <div class="q_item_code"><img src="/img/common/qr_code_caimei.png" alt="采美公众号"></div>
+                    <div class="q_item_icon"><img src="/img/common/qr_code_caimei.jpg" alt="采美公众号"></div>
+                    <div class="q_item_code"><img src="/img/common/qr_code_caimei.jpg" alt="采美公众号"></div>
                     <p>采美公众号</p>
                 </div>
                 <div class="q_item">

+ 3 - 1
src/main/resources/templates/document/beauty-archive.html

@@ -18,7 +18,7 @@
             <div class="cm-container cm-clearfix">
                 <div class="cm-fl cm-title" v-if="isPC">美业资料</div>
                 <div class="cm-fr">
-                    <div class="cm-search">
+                    <div class="cm-search auto-input">
                         <input class="cm-keyword" v-model="keyword" placeholder="请输入商品名称/供应商名" @keyup.enter="handleSearch(keyword)" type="text"/>
                         <a href="javascript:void(0)" @click="handleSearch(keyword)" class="cm-search-btn icon"></a>
                     </div>
@@ -99,8 +99,10 @@
 <script charset="utf-8" type="text/javascript" src="/lib/jquery-3.6.0.min.js"></script>
 <script charset="utf-8" type="text/javascript" src="/lib/lazyload.js"></script>
 <script charset="utf-8" type="text/javascript" th:src="@{/js/common/ajax.service.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/common/serviceapi/utils.service.js(v=${version})}"></script>
 <script charset="utf-8" type="text/javascript"
         th:src="@{/js/common/serviceapi/beautyArchive.service.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/auto-input.js(v=${version})}"></script>
 <script charset="utf-8" type="text/javascript" th:src="@{/js/document/beauty-archive.js(v=${version})}"></script>
 
 </body>

+ 2 - 0
src/main/resources/templates/encyclopedia/components/footer.html

@@ -15,6 +15,8 @@
 <script src="/lib/jquery-3.6.0.min.js"></script>
 <script charset="utf-8" type="text/javascript" src="/lib/vue2.6.12.min.js"></script>
 <script charset="utf-8" type="text/javascript" src="/lib/jquery.slide-2.1.3.js"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/common/ajax.service.js}"></script>
 <script charset="utf-8" type="text/javascript" th:src="@{/js/common/serviceapi/utils.service.js(v=${version})}"></script>
+<script th:src="@{/js/auto-input.js(v=${version})}" xmlns:th="https://www.thymeleaf.org"></script>
 <script charset="utf-8" type="text/javascript" th:src="@{/js/base.js(v=${version})}"></script>
 <script th:src="@{/js/encyclopedia/common.js(v=${version})}" xmlns:th="https://www.thymeleaf.org"></script>

+ 2 - 2
src/main/resources/templates/encyclopedia/components/header.html

@@ -20,9 +20,9 @@
             <li><span class="nav-close" id="#menuColseBtn"></span></li>
         </ul>
         <div class="search">
-            <div class="search-control">
+            <div class="search-control auto-input">
                 <form action="search.html">
-                    <input type="text" id="searchKeyword" class="search-input" name="keyword" placeholder="请输入产品/仪器名称"/>
+                    <input type="text" id="searchKeyword" class="search-input" name="keyword" placeholder="请输入产品/仪器名称" autocomplete="off"/>
                     <button class="search-btn">搜索</button>
                 </form>
                 <button class="hot-keyword" id="hotKeyword" data-target="#hotKeywords">热搜词</button>

+ 3 - 3
src/main/resources/templates/product/detail.html

@@ -70,7 +70,7 @@
                         <div class="WechatBg"><img src="/img/base/Wecha.png">
                             <p>扫码添加采美微信客服咨询更快捷</p></div>
                     </div>
-                    <div class="row price"><span class="l">采美价</span><i>:</i>
+                    <div class="row price"><span class="l">会员价</span><i>:</i>
                         <!--登录-->
                         <template v-if="GLOBAL_USER_ID && GLOBAL_USER_ID>0">
                             <!--用户身份 0、个人 1、协销 2、会员机构 3、供应商 4,普通机构-->
@@ -112,7 +112,7 @@
                         </template>
                     </div>
                     <template
-                            v-if="GLOBAL_USER_ID && GLOBAL_USER_ID>0 && priceObj.normalPrice>0 && ((priceObj.priceFlag==0 && priceObj.userIdentity!=3) || (priceObj.priceFlag==2 && priceObj.userIdentity==2) || (priceObj.userIdentity==3 && priceObj.shopId==GLOBAL_SHOP_ID || GLOBAL_VIP_FLAG === 1))">
+                            v-if="GLOBAL_USER_ID && GLOBAL_USER_ID>0 && priceObj.normalPrice>0 && ((priceObj.priceFlag==0 && priceObj.userIdentity!=3) || (priceObj.priceFlag==2 && priceObj.userIdentity==2) || (priceObj.priceFlag==3 && GLOBAL_CLUB_TYPE==1) || (priceObj.userIdentity==3 && priceObj.shopId==GLOBAL_SHOP_ID || GLOBAL_VIP_FLAG === 1))">
                         <div class="row"><span class="l">市场价</span><i>:</i>
                             <em>
                                 <del v-text="'¥'+priceObj.normalPrice.toFixed(2)"></del>
@@ -123,7 +123,7 @@
                          v-if="GLOBAL_USER_ID && GLOBAL_USER_ID>0 && priceObj.actStatus==1 || ladderList.length >0">
                         <span class="l">促销</span><i>:</i>
                         <template
-                                v-if="GLOBAL_USER_ID && GLOBAL_USER_ID>0 && ((priceObj.priceFlag==0 && priceObj.userIdentity!=3) || (priceObj.priceFlag==2 && priceObj.userIdentity==2) || (priceObj.userIdentity==3 && priceObj.shopId==GLOBAL_SHOP_ID || GLOBAL_VIP_FLAG === 1))">
+                                v-if="GLOBAL_USER_ID && GLOBAL_USER_ID>0 && ((priceObj.priceFlag==0 && priceObj.userIdentity!=3) || (priceObj.priceFlag==2 && priceObj.userIdentity==2) || (priceObj.priceFlag==3 && GLOBAL_CLUB_TYPE==1) || (priceObj.userIdentity==3 && priceObj.shopId==GLOBAL_SHOP_ID || GLOBAL_VIP_FLAG === 1))">
                             <!-- 阶梯价 -->
                             <div v-if="ladderList.length >0" class="priceTag">
                                 <i class="tag icon mIcon" @click="toggleThisLadder($event)">阶梯价格</i>

+ 1 - 1
src/main/resources/templates/supplier-center/repair/detail.html

@@ -46,7 +46,7 @@
                         <p>了解更多服务内容</p>
                         <p>生美/医美采购服务平台</p>
                     </div>
-                    <img src="/img/common/qr_code_caimei.png" alt="">
+                    <img src="/img/common/qr_code_caimei.jpg" alt="">
                 </div>
             </div>
         </div>