AI助手、信息中心调整优化

src/main/resources/static/css/activity/activity-vote.css

@@ -13,7 +13,7 @@
     border: none !important;
   }
  .el-button--primary{background: linear-gradient(90deg, #FF9300 0%, #FF5B00 100%) !important;}
- .t_container{ width: 1000px;margin: 30px auto; min-height:1200px;background:  rgba(255, 91, 0 ,0.8);box-sizing: border-box;padding: 20px 50px 100px 50px;}
+ .t_container{ width: 1000px;margin: 30px auto; min-height:1200px;background:linear-gradient(0deg, #FF9300 0%, #FF5B00 100%);box-sizing: border-box;padding: 20px 50px 100px 50px;}
  .t_title{width: 100%;height: 100px;margin-bottom: 20px;}
  .t_title p{font-size: 40px;font-weight: bold;text-align: center;color: #FFF;line-height: 100px;}
  .t_vote_main{ width: 100%;height: auto;background: #FFFFFF;box-sizing: border-box;padding: 20px;border-radius: 4px;overflow: hidden;}
@@ -83,7 +83,7 @@
    border: none !important;
   }
   .el-button--primary{background: linear-gradient(90deg, #FF9300 0%, #FF5B00 100%) !important;}
-  .t_container{ width: 100%; min-height:118vw;background:  rgba(255, 91, 0 ,0.8);box-sizing: border-box;padding: 27vw 3.3vw;}
+  .t_container{ width: 100%; min-height:118vw;background:linear-gradient(0deg, #FF9300 0%, #FF5B00 100%);box-sizing: border-box;padding: 27vw 3.3vw;}
   .t_title{width: 100%;height: 20vw;}
   .t_title p{font-size: 8vw;font-weight: bold;text-align: center;color: #FFF;line-height: 20vw;}
   .t_vote_main{ width: 100%;height: auto;background: #FFFFFF;box-sizing: border-box;padding: 3vw;border-radius: 8px;overflow: hidden;}

src/main/resources/static/css/article/article.css

@@ -542,7 +542,7 @@ dl,dd,dt{zoom:1}
 	.dataRousce .handleMore {width: 100%;border-top: 1px solid #CCCCCC;margin: 0 auto;display: flex;}
 	.dataRousce .handleMore .more {margin: 7.3vw auto 5.3vw auto;}
 
-	.footer{width:100%;padding:4vw 0;background:#262626;text-align:center;padding: 5vw;line-height: 6.4vw;}
+	.footer{width:100%;padding:4vw 0;background:#262626;text-align:center;padding: 5vw;line-height: 6.4vw;display: none;}
 	.footer .back-link {margin-bottom: 4vw;font-size: 3.4vw;}
 	.footer .back-link a {color: #fff;}
 	.footer .logo img{width:9.2vw;height:8vw;vertical-align:middle}

src/main/resources/static/css/base/base.pc.css

@@ -3,10 +3,10 @@
 * PC端
 */
 body{min-width:1184px;}
-header{box-shadow: 0 2px 10px #ebecef;}
 .h5Only{display:none!important;}
 /*微信二维码样式*/
 iframe{width:320px !important;height: 280px !important}
+#globalHead{box-shadow: 0 2px 10px #ebecef;}
 #globalHead.fiexd{width: 100%;height: auto;position: fixed;top: 0;left: 0;z-index: 1999;box-shadow: 3px 3px 5px rgba(0,0,0,.1);}
 #globalHead.fiexd .baseHeadTop{ display: none; }
 #globalHead.fiexd .baseTopNav{ display: none; }
@@ -404,7 +404,7 @@ iframe{width:320px !important;height: 280px !important}
 .loginAlert:after{content:'';display:block;width:125px;height:125px;background:url(/img/account/to_login.png) no-repeat left top;background-size:100% 100%;margin:10px 0 0 15px;}
 #supplierLogin {display: none;}
 /* 咨询，回到顶部 */
-#scrollTop{display:none;position:fixed;right:0;margin-right:0;width:88px;z-index:9999;bottom:50px;padding: 10px 0;background: #FFFFFF; border-radius: 16px;box-shadow: -2px 0 30px 2px rgba(97, 105, 119, 0.18);}
+#scrollTop{display:none;position:fixed;right:0;margin-right:0;width:88px;z-index:999;bottom:60px;padding: 10px 0;background: #FFFFFF; border-radius: 16px;box-shadow: -2px 0 30px 2px rgba(97, 105, 119, 0.18);}
 #scrollTop .item{width:100%;border-radius: 10px;display: flex;align-items: center;flex-direction: row; background-color:#fff;box-sizing:border-box;text-align:center;font-size:12px;position:relative}
 #scrollTop .item>span{display:block;width:94px;box-sizing:border-box;position:relative;cursor:pointer;white-space:pre-wrap;word-break:break-all;}
 #scrollTop .item>span:hover{color:#FF5B00;}
@@ -455,6 +455,8 @@ iframe{width:320px !important;height: 280px !important}
 }
 #scrollTop .item .toTop:before{width:32px;height:32px;background-position:-47px -254px;position:absolute;top:4px;left:16px}
 #scrollTop .item .Iphone:before{width:32px;height:32px;background-position:-333px -646px;position:absolute;top:4px;left:16px;}
+#scrollTop .item .aiItem {padding:12px 12px 12px 40px;line-height:16px;}
+#scrollTop .item .aiItem:before{content: '';width:20px;height:20px;background: url("/img/base/icon-ai@2x.png");background-size: cover;position: absolute;left: 15px;top: 10px;}
 #scrollTop .item .phoneHover{display:none;position:absolute;left:-238px;top:-150px;z-index:999;width:240px;height:383px;background:url(/img/common/hotline.png) no-repeat left top;box-sizing:border-box;padding:100px 15px 0 0;line-height:28px;font-size:14px;white-space:nowrap;}
 #scrollTop .item .phoneHover a{color:#FF5B00}
 #scrollTop .item .phoneHover span{color:#93979F;margin-top:10px}
@@ -552,9 +554,125 @@ iframe{width:320px !important;height: 280px !important}
 .filter-control .el-select {
     width: 200px;
 }
-
-
-
-
-
-
+/*采美AI助手弹窗样式*/
+.el-drawer__header{ margin-bottom: 10px !important; }
+.cm_ai_container{ width: 100%;height: 100%;display: flex;flex-direction: column; box-sizing: border-box;padding:0 15px; background-image: radial-gradient(circle at 14% 85%,#e7ecf7 0,rgba(231,236,247,0) 37%),radial-gradient(circle at 3.4% 3.7%,rgba(245,237,241,.5) 0,rgba(245,237,241,0) 28%),radial-gradient(circle at 100% 18%,#e8ebea 0,hsla(160,7%,92%,0) 30%),linear-gradient(180deg,#f5f4f6,#e6ebf7);}
+.cm_ai_content{
+    width: 100%;
+    height: auto;
+    background-color: #FFFFFF;
+    box-shadow: 0 16px 20px 0 rgba(174,167,223,.2);
+    border-radius: 8px;
+    box-sizing: border-box;
+    padding: 9px 10px 24px 10px;
+    margin:10px 0;
+    position: relative;
+}
+.cm_ai_header{ width: 100%;height: 24px;box-sizing: border-box;justify-content: left;align-items: center;display: inline-flex;}
+.cm_ai_header .cm_ai_icon{ width: 24px;height: 24px;box-sizing: border-box;margin-right: 5px }
+.cm_ai_header .cm_ai_icon img{ width: 24px;height: 24px;display: block; }
+.cm_ai_header .cm_ai_text{line-height: 24px;font-size: 14px;color: #ff5b00;font-weight: 600; }
+.cm_ai_content .cm_ai_input{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 100%;
+    min-height: 60px;
+    padding: 0 ;
+    overflow: hidden;
+    box-sizing: border-box;
+}
+.cm_ai_content .cm_ai_input textarea{
+    width: 100%;
+    max-height: 106px !important;
+    font-size: 14px;
+    line-height: 1.5715;
+    background-color: transparent;
+    border: none;
+    box-shadow: none;
+    overflow: auto;
+    scrollbar-width:none;
+    resize: none;
+    box-sizing: border-box;
+    padding-left: 4px;
+}
+.cm_ai_content .cm_ai_button{
+    width: 40px;
+    height: 24px;
+    position: absolute;
+    right: 6px;
+    bottom: 6px;
+    border-radius: 16px;
+    background-image: linear-gradient(90deg, #FF9300 0%, #FF5B00 100%);
+    display: inline-flex;
+    align-items: center;
+    justify-content: space-between;
+    transition: all .16s;
+    cursor: pointer;
+}
+.cm_ai_content .cm_ai_button.none{
+    opacity: 0.5;
+}
+.cm_ai_content .cm_ai_button .cm_ai_icon{
+    width: 14px;
+    height: 14px;
+    margin: 0 auto;
+    display: block;
+    transition: all .16s;
+}
+.cm_ai_content .cm_ai_button:hover{
+    transform: scale(1.05);
+}
+.cm_ai_content .cm_ai_button:hover .cm_ai_icon{
+    transform: scale(1.05);
+}
+.cm_ai_answer_main{
+    width: 100%;
+    min-height: 600px;
+    overflow-y: auto;
+    flex: 9;
+    padding: 10px 0 0 0;
+}
+.cm_ai_answer_main::-webkit-scrollbar{
+    display: none;
+}
+.cm_ai_answer{
+    width: 100%;
+    height: auto;
+    box-sizing: border-box;
+    padding-left:36px;
+    position: relative;
+}
+.cm_ai_answer .cm_ai_html_icon{
+    width: 32px;
+    height: 32px;
+    border-radius: 20px;
+    background-color: #FFFFFF;
+    position: absolute;
+    left: 0;
+    top: 0;
+    box-sizing: border-box;
+    padding: 5px;
+}
+.cm_ai_answer .cm_ai_html_icon.user{
+    background-color: rgba(255,91,0,0.1);
+}
+.cm_ai_answer .cm_ai_html_icon img{
+    width: 22px;
+    height: 22px;
+    border-radius: 20px;
+    display: block;
+}
+.cm_ai_answer .cm_ai_html{
+    width: 100%;
+    min-height: 300px;
+    border-radius: 8px;
+    line-height: 1.5715;
+    background-color: #FFFFFF;
+    box-sizing: border-box;
+    padding: 10px;
+}
+.cm_ai_answer .cm_ai_html.user{
+    min-height: 50px;
+    margin-bottom: 10px;
+}

src/main/resources/static/css/index/index_new.pc.css

@@ -201,7 +201,7 @@ li{list-style:none;}
 footer{width:100%;height:auto;float:left}
 
 /* 首页右侧导航 */
-#sideNav{display:none;position:fixed;right:0;margin-right:0;width:88px;z-index:9999;bottom:200px;}
+#sideNav{display:none;position:fixed;right:0;margin-right:0;width:88px;z-index:999;bottom:230px;}
 #sideNav .item{width:100%;background-color:#fff;box-sizing:border-box;text-align:center;box-shadow:-2px 0 30px 2px rgba(97, 105, 119, 0.18);border-radius:16px;font-size:12px;position:relative;overflow: hidden;}
 #sideNav .item>a{display:block;width:100%;box-sizing:border-box;padding:14px 6px;line-height:14px;position:relative;font-size: 13px;}
 #sideNav .item>a:before{content:'';position:absolute;width:70px;left:9px;top:0;border-top:1px solid #FEF6F3}

src/main/resources/static/js/article/common.js

@@ -49,13 +49,13 @@ const articleSide = new Vue({
         // },
         getRecommend: function (typeId, pageNum) {
             console.log(typeId, pageNum);
-            var _self = this;
+            const _self = this;
             $.getJSON("/article/recommend", {
                 typeId: typeId,
                 pageNum: pageNum
             }, function (r) {
                 if (r.code === 0 && r.data) {
-                    _self.recommend = r.data;
+                    _self.recommend = r.data
                 }
             });
         },
@@ -78,7 +78,6 @@ const articleSide = new Vue({
         const _self = this;
         this.typeId = $("#typeId").val() * 1;
         this.labelId = $("#labelId").val() * 1;
-        // this.getLabels();
         if (isPC) {
             // this.getAds();
             this.getRecommend(this.typeId, 1);
@@ -107,6 +106,7 @@ const drawerFooter = new Vue({
         typeId: 0,
         labelId: 0,
         screenWidth: 0,
+        sidebarLoading:true,
         vantWidth: 0 // 轮播图width
     },
     mounted() {
@@ -155,6 +155,7 @@ const drawerFooter = new Vue({
             }, function (r) {
                 if (r.code === 0 && r.data) {
                     _self.recommend = r.data;
+                    _self.sidebarLoading = false
                 }
             });
         },

src/main/resources/static/js/article/detail.js

@@ -27,7 +27,19 @@ const articleContent = new Vue({
         relatedLabels:''
     },
     methods: {
-
+        openFullScreen1() {
+            const _self = this
+            const loading = this.$loading({
+                lock: true,
+                text: '',
+                spinner: 'el-icon-loading',
+                background: 'rgba(0, 0, 0, 0.2)'
+            });
+            setTimeout(() => {
+                _self.isLoading = true;
+                loading.close();
+            }, 500);
+        }
     },
     created: function () {
         const pageLabelArray = []
@@ -47,8 +59,9 @@ const articleContent = new Vue({
         // this.getRelatedList();
     },
     mounted: function () {
-        var _self = this;
-        var thisUri = window.location.href;
+        const _self = this;
+        const thisUri = window.location.href;
+        this.openFullScreen1()
         // 文章浏览量+1
         $.get("/article/pv", {id: this.infoId}, function(res){
             if(res.code === 0){

src/main/resources/static/js/article/list.js

@@ -80,19 +80,6 @@ const articleList = new Vue({
         this.getNewList()
     },
     methods: {
-        openFullScreen1() {
-            const _self = this
-            const loading = this.$loading({
-                lock: true,
-                text: '',
-                spinner: 'el-icon-loading',
-                background: 'rgba(0, 0, 0, 0.2)'
-            });
-            setTimeout(() => {
-                _self.isLoading = true;
-                loading.close();
-            }, 250);
-        },
         initAuthInputComplete() {
             new AutoComplete({
                 el: '.auto-input',
@@ -421,7 +408,20 @@ const articleList = new Vue({
             if ($event.jumpLink) {
                 window.open($event.jumpLink)
             }
-        }
+        },
+        openFullScreen1() {
+            const _self = this
+            const loading = this.$loading({
+                lock: true,
+                text: '',
+                spinner: 'el-icon-loading',
+                background: 'rgba(0, 0, 0, 0.2)'
+            });
+            setTimeout(() => {
+                _self.isLoading = true;
+                loading.close();
+            }, 500);
+        },
     },
     mounted () {
         this.openFullScreen1()

src/main/resources/static/js/article/recommendation.js

@@ -1,6 +1,6 @@
 var recommendation = new Vue({
     el: "#Recommendation",
-    mixins: [cmSysVitaMixins],
+    mixins: [cmSysVitaMixins,searchMixins],
     data: {
         status: {
             'isDocument': 0, // 文件
@@ -68,9 +68,23 @@ var recommendation = new Vue({
         },
     },
     mounted() {
+        this.openFullScreen1()
         this.initData()
     },
     methods: {
+        openFullScreen1() {
+            const _self = this
+            const loading = this.$loading({
+                lock: true,
+                text: '',
+                spinner: 'el-icon-loading',
+                background: 'rgba(0, 0, 0, 0.2)'
+            });
+            setTimeout(() => {
+                _self.isLoading = true;
+                loading.close();
+            }, 500);
+        },
         initData() {
             if (this.state === 2) {
                 this.getNewList()

src/main/resources/static/js/base.js

@@ -368,6 +368,7 @@ var globalHead = new Vue({
 // 底部
 var globalFot = new Vue({
     el: '#globalFot',
+    mixins: [cmAiMixins],
     data: {
         isShowIcon: true,
     },

src/main/resources/static/js/mixins/cmAiMixins.js

@@ -0,0 +1,152 @@
+// AI助手
+var cmAiMixins = function () {
+    return {
+        data() {
+            return {
+                isAiDrawer: false,
+                textarea: '',
+                isLoading: false
+            }
+        },
+        methods: {
+            handleClose(done) {
+                this.$confirm('确认退出AI助手？')
+                    .then(_ => {
+                        const answerContainer = document.getElementById('cm_ai_answer')
+                        answerContainer.innerHTML = ''
+                        this.isAiDrawer = false
+                        done();
+                    })
+                    .catch(_ => {});
+            },
+            handleShowAiDrawer(){
+                this.isAiDrawer = true
+                this.textarea = ''
+            },
+            handleAskQuestion(){
+                if(this.isLoading){ return; }
+                if (!this.textarea){
+                    this.$message({
+                        message: '请输入内容',
+                        type: 'warning'
+                    });
+                    return
+                }
+                this.isLoading = true
+                const aiResponseLines = '在黄金微针品牌的选择上，市面上有多个知名品牌，它们各自具有独特的特点和优势。以下是一些值得推荐的品牌：\\n\\n* **以色列美迪迈（EndyMed）**：这是一个获得中国NMPA认证、美国FDA认证和欧盟CE认证的品牌，其资质认可度极高。美迪迈采用脉冲式发射非绝缘射频针技术，非绝缘针型增加了治疗范围，把射频能量作用于更多的组织。其独特的点阵脉冲模式使得能量传递更加精准，集中真皮深层，表皮无烫伤风险，操作便捷。同时，美迪迈射频能量三层叠加，针体全身都在发热，皮肤全层加热，到达深层才会释放能量，减少表皮热损伤，具有很好的治疗效果。\\n* **国产半岛**：半岛是国产的性价比之选，其在抗衰老治疗方面表现出色。由于抗衰老治疗需要能量深入皮肤深层，因此能量集中且具有绝缘性的黄金微针更为推荐。\\n* **韩国路创丽**：路创丽拥有微针点阵射频技术，同时还具备无创浅表点阵射频模式，层次精准。这一特点使得它对于一些希望以温和方式改善皮肤问题的敏感皮肤人群来说较为合适，并具有提亮肤色的效果。\\n* **韩国帝医思（原名：再希思）**：这个品牌同样在黄金微针领域有着不俗的表现，得到了许多用户的认可。\\n\\n这些品牌在市场上都有较高的知名度和用户口碑，但在选择时，建议消费者根据自身需求和皮肤状况，结合医生的建议进行选择。同时，无论选择哪个品牌的黄金微针，都应在正规医疗机构进行，并由专业医生操作，以确保治疗的安全和效果。'
+                const aiResponsText = aiResponseLines
+                    .replace(/\\n\\n/g, '') // 替换换行符
+                    .replace(/\* \*\*([^<]+?)\*\*/g, ''); // 替换加粗部分
+                // 用于显示AI回答的DOM元素
+                const answerContent = document.getElementById('cm_ai_answer')
+                this.handleCreateUserHtml(this.textarea,answerContent)
+                this.handleCreateChartHtml(aiResponsText,answerContent)
+            },
+            handleCreateUserHtml(userText,answerContent){
+                // 创建一个新的div元素，并设置其类名为'cm_ai_answer'
+                const answerElement = document.createElement('div');
+                answerElement.className = 'cm_ai_answer';
+                // 创建第一个子元素，包含图标
+                const iconDiv = document.createElement('div');
+                iconDiv.className = 'cm_ai_html_icon user';
+                // 在iconDiv中创建一个img元素
+                const img = document.createElement('img');
+                img.src = '/img/base/icon-aiUser@2x.png';
+                // 将img元素添加到iconDiv中
+                iconDiv.appendChild(img);
+                // 创建第二个子元素，用于显示内容
+                const contentDiv = document.createElement('div');
+                contentDiv.className = 'cm_ai_html user';
+                contentDiv.innerHTML = userText;
+                // 你可以在这里设置contentDiv的内容，例如：
+                // contentDiv.textContent = '这里是AI用户的内容';
+                // 或者，如果你想要保留空的div用于后续填充，可以跳过这一步
+                // 将iconDiv和contentDiv添加到answerElement中
+                answerElement.appendChild(iconDiv);
+                answerElement.appendChild(contentDiv);
+                // 最后，将answerElement添加到页面的某个现有元素中，例如body
+                answerContent.appendChild(answerElement);
+            },
+            handleCreateChartHtml(aiResponsText,answerContent){
+                const _this = this
+                // 创建一个新的diUserv元素，并设置其类名为'cm_ai_answer'
+                const answerElement = document.createElement('div');
+                answerElement.className = 'cm_ai_answer';
+                // 创建第一个子元素，包含图标
+                const iconDiv = document.createElement('div');
+                iconDiv.className = 'cm_ai_html_icon';
+                // 在iconDiv中创建一个img元素
+                const img = document.createElement('img');
+                img.src = '/img/base/icon-ai@1x.png';
+                // 将img元素添加到iconDiv中
+                iconDiv.appendChild(img);
+                // 创建第二个子元素，用于显示内容
+                const contentDiv = document.createElement('div');
+                contentDiv.className = 'cm_ai_html user';
+                // 你可以在这里设置contentDiv的内容，例如：
+                // contentDiv.textContent = '这里是AI用户的内容';
+                // 或者，如果你想要保留空的div用于后续填充，可以跳过这一步
+                // 将iconDiv和contentDiv添加到answerElement中
+                answerElement.appendChild(iconDiv);
+                answerElement.appendChild(contentDiv);
+                // 打字函数
+                let currentIndex = 0
+                const speed = 30
+                function typeEffect() {
+                    // 如果已经显示完所有字符，则停止
+                    if (currentIndex < aiResponsText.length) {
+                        // 逐个字符添加到打字效果的元素中
+                        contentDiv.innerHTML += aiResponsText.charAt(currentIndex)
+                        // 更新索引
+                        currentIndex++
+                        // 递归调用，直到显示完所有字符
+                        setTimeout(typeEffect, speed)
+                        // 滚动到容器底部（如果内容超出了可视区域）
+                        answerContent.scrollTop = answerContent.scrollHeight;
+                    }else{
+                        _this.isLoading = false
+                    }
+                    // 这里可以添加在文本显示完成后执行的代码（如果有的话）
+                }
+                // 开始打字效果
+                typeEffect()
+                // let index = 0
+                // function showNextLine() {
+                //     if (index < aiResponseLines.length) {
+                //         // 创建一个新的元素来显示当前行
+                //         const lineElement = document.createElement('p')
+                //         lineElement.textContent = aiResponseLines[index]
+                //         answerContainer.appendChild(lineElement)
+                //         // 递增索引并设置下一个显示的时间
+                //         index++
+                //         setTimeout(showNextLine, 500) // 500毫秒后显示下一行
+                //     }
+                // }
+                // // 开始显示
+                // showNextLine()
+                // 最后，将answerElement添加到页面的某个现有元素中，例如body
+                answerContent.appendChild(answerElement);
+            },
+            // 图像加载后的处理函数
+            adjustScrollIfNeeded(element,container) {
+                // 等待DOM更新（可选，但在某些情况下可能需要）
+                requestAnimationFrame(() => {
+                    // 计算元素相对于容器的顶部位置
+                    const offsetTop = element.offsetTop;
+                    const containerRect = container.getBoundingClientRect();
+                    const visibleHeight = containerRect.bottom - containerRect.top; // 容器的可视高度
+                    // 检查元素是否在可视区域内
+                    // 如果不在，则调整容器的scrollTop
+                    console.log('element-offsetTop',offsetTop)
+                    console.log('container-containerRect',containerRect)
+                    console.log('visibleHeight',visibleHeight)
+                    if (offsetTop < container.scrollTop || offsetTop + element.offsetHeight > container.scrollTop + visibleHeight) {
+                        // 这里我们简单地将scrollTop设置为新内容的顶部
+                        // 但你可以根据需要调整这个逻辑，比如保持元素居中或靠近容器顶部/底部
+                        container.scrollTop = offsetTop;
+                    }
+                });
+            }
+        }
+    }
+}();

src/main/resources/templates/article/components/article-drawer.html

@@ -5,110 +5,112 @@
   <link th:href="@{/css/article/drawer-footer.css(v=${version})}" rel="stylesheet" type="text/css" />
 </head>
 <body>
-<div id="drawer-footer">
-  <div class="drawer-footer"  th:if="${isSelectInfo}">
-    <div class="hot-recommend" v-if="recommend.list && recommend.list.length > 0">
-      <div class="hot-recommend-title">
-        <div>热门推荐</div>
-        <div>
-          <a></a>
-        </div>
-      </div>
-      <div class="hot-recommend-content">
-        <div class="hot-recommend-content-item" v-for="item in recommend.list">
+<div id="drawer-footer" v-cloak>
+  <template v-if="!sidebarLoading">
+    <div class="drawer-footer"  th:if="${isSelectInfo}">
+      <div class="hot-recommend" v-if="recommend.list && recommend.list.length > 0">
+        <div class="hot-recommend-title">
+          <div>热门推荐</div>
           <div>
-            <a :href="'/info/detail-'+item.id+'-1.html'" target="_blank">
-              <img :src="item.image"/>
-            </a>
-          </div>
-          <div>
-            <a :href="'/info/detail-'+item.id+'-1.html'" target="_blank">
-              <p class="shuoming" v-html="item.title"></p>
-            </a>
+            <a></a>
           </div>
         </div>
-      </div>
-    </div>
-    <div class="hot-recommend" th:if="${#arrays.length(productSellNumbers)} > 0">
-      <div class="hot-recommend-title">
-        <div>您可能感兴趣的商品</div>
-        <div>
-          <a href="/product/list.html">更多 ></a>
+        <div class="hot-recommend-content">
+          <div class="hot-recommend-content-item" v-for="item in recommend.list">
+            <div>
+              <a :href="'/info/detail-'+item.id+'-1.html'" target="_blank">
+                <img :src="item.image"/>
+              </a>
+            </div>
+            <div>
+              <a :href="'/info/detail-'+item.id+'-1.html'" target="_blank">
+                <p class="shuoming" v-html="item.title"></p>
+              </a>
+            </div>
+          </div>
         </div>
       </div>
-      <div class="hot-recommend-content">
-        <div class="hot-recommend-content-item" th:each="product: ${productSellNumbers}">
-          <div>
-            <a th:href="'/product-'+${product.id}+'.html'" target="_blank">
-              <img th:src="${product.image}" style="width: 100%;height: 100%;object-fit: contain;" />
-            </a>
-          </div>
+      <div class="hot-recommend" th:if="${#arrays.length(productSellNumbers)} > 0">
+        <div class="hot-recommend-title">
+          <div>您可能感兴趣的商品</div>
           <div>
-            <a th:text="${product.name}" th:href="'/product-'+${product.id}+'.html'" target="_blank"></a>
+            <a href="/product/list.html">更多 ></a>
           </div>
         </div>
-      </div>
-    </div>
-    <div class="hot-recommend" th:if="${#arrays.length(archiveFiles)} > 0">
-      <div class="hot-recommend-title">
-        <div>您可能感兴趣的美业资料</div>
-        <div>
-          <a href="/info/articlerecommendation-0-1.html?isDocument">更多 ></a>
+        <div class="hot-recommend-content">
+          <div class="hot-recommend-content-item" th:each="product: ${productSellNumbers}">
+            <div>
+              <a th:href="'/product-'+${product.id}+'.html'" target="_blank">
+                <img th:src="${product.image}" style="width: 100%;height: 100%;object-fit: contain;" />
+              </a>
+            </div>
+            <div>
+              <a th:text="${product.name}" th:href="'/product-'+${product.id}+'.html'" target="_blank"></a>
+            </div>
+          </div>
         </div>
       </div>
-      <div class="hot-recommend-content">
-        <div class="hot-recommend-content-item" th:each="file: ${archiveFiles}">
+      <div class="hot-recommend" th:if="${#arrays.length(archiveFiles)} > 0">
+        <div class="hot-recommend-title">
+          <div>您可能感兴趣的美业资料</div>
           <div>
-            <a href="javascript:void(0)" target="_blank" th:onclick="handleFileUrl([[${file.productId}]])">
-              <img src="/img/article/PC--pdf.png" th:if="${#strings.containsIgnoreCase(file.fileName, '.pdf')}">
-              <img src="/img/info/PC-doc.png" th:if="${#strings.containsIgnoreCase(file.fileName, '.doc')}">
-              <img src="/img/info/PC-ppt.png" th:if="${#strings.containsIgnoreCase(file.fileName, '.ppt')}">
-            </a>
+            <a href="/info/articlerecommendation-0-1.html?isDocument">更多 ></a>
           </div>
-          <div>
-            <a th:text="${file.fileName}" target="_blank" href="javascript:void(0)" th:onclick="handleFileUrl([[${file.productId}]])"></a>
+        </div>
+        <div class="hot-recommend-content">
+          <div class="hot-recommend-content-item" th:each="file: ${archiveFiles}">
+            <div>
+              <a href="javascript:void(0)" target="_blank" th:onclick="handleFileUrl([[${file.productId}]])">
+                <img src="/img/article/PC--pdf.png" th:if="${#strings.containsIgnoreCase(file.fileName, '.pdf')}">
+                <img src="/img/info/PC-doc.png" th:if="${#strings.containsIgnoreCase(file.fileName, '.doc')}">
+                <img src="/img/info/PC-ppt.png" th:if="${#strings.containsIgnoreCase(file.fileName, '.ppt')}">
+              </a>
+            </div>
+            <div>
+              <a th:text="${file.fileName}" target="_blank" href="javascript:void(0)" th:onclick="handleFileUrl([[${file.productId}]])"></a>
+            </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <!--    广告-->
-  <div class="advertisement" th:if="${#arrays.length(ads)} > 0 and ${isSelectInfo}">
-    <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white" :loop="false" :width="vantWidth">
-      <van-swipe-item th:each="ad : ${ads}">
-        <a class="advertisement-link" th:href="${ad.link}" target="_blank">
-          <img th:src="${ad.image}" th:alt="${ad.title}" class="advertisement-img" th:onclick="handleAdvHits([[${ad}]])"/>
-        </a>
-      </van-swipe-item>
-    </van-swipe>
-  </div>
-  <!--相关阅读-->
-  <div class="related-Reading bg-filter" id="related-Reading" th:if="${isDetail} and ${#arrays.length(articles) > 0}">
-    <div class="related-content">
-      <div class="related-content-title">相关阅读</div>
-      <div class="related-content-close">&#10006</div>
-      <div class="related-content-item">
-        <div class="reading-content" th:each="item : ${articles}">
-          <a th:href="'/info/detail-'+${item.id}+'-1.html'" target="_blank">
-            <img th:src="${item.image}"/>
+    <!--    广告-->
+    <div class="advertisement" th:if="${#arrays.length(ads)} > 0 and ${isSelectInfo}">
+      <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white" :loop="false" :width="vantWidth">
+        <van-swipe-item th:each="ad : ${ads}">
+          <a class="advertisement-link" th:href="${ad.link}" target="_blank">
+            <img th:src="${ad.image}" th:alt="${ad.title}" class="advertisement-img" th:onclick="handleAdvHits([[${ad}]])"/>
           </a>
-          <div class="content-text">
-            <a th:href="'/info/detail-'+${item.id}+'-1.html'" class="content-title" target="_blank" th:text="${item.title}"></a>
-            <div class="content-icon">
-              <div class="icon-recommend">
-                <div></div>
-                <div>推荐</div>
-              </div>
-              <div class="icon-group">
-                <div class="icon-pv"></div>
-                <div class="icon-text" th:text="${item.pv}"></div>
+        </van-swipe-item>
+      </van-swipe>
+    </div>
+    <!--相关阅读-->
+    <div class="related-Reading bg-filter" id="related-Reading" th:if="${isDetail} and ${#arrays.length(articles) > 0}">
+      <div class="related-content">
+        <div class="related-content-title">相关阅读</div>
+        <div class="related-content-close">&#10006</div>
+        <div class="related-content-item">
+          <div class="reading-content" th:each="item : ${articles}">
+            <a th:href="'/info/detail-'+${item.id}+'-1.html'" target="_blank">
+              <img th:src="${item.image}"/>
+            </a>
+            <div class="content-text">
+              <a th:href="'/info/detail-'+${item.id}+'-1.html'" class="content-title" target="_blank" th:text="${item.title}"></a>
+              <div class="content-icon">
+                <div class="icon-recommend">
+                  <div></div>
+                  <div>推荐</div>
+                </div>
+                <div class="icon-group">
+                  <div class="icon-pv"></div>
+                  <div class="icon-text" th:text="${item.pv}"></div>
+                </div>
               </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
+  </template>
 </div>
 
 </body>

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

@@ -1,92 +1,91 @@
-<header class="header" id="info-header" xmlns:th="http://www.w3isRossShow.org/1999/xhtml">
-    <div class="head-back">
-        <div class="head">
-            <div class="head-logo"></div>
-            <div class="text">
-                <a href="/index.html">采美商城首页</a>
-            </div>
-        </div>
-    </div>
-<!--    搜索头-->
-    <div class="search-top" :class="(show || right_drawer) ? 'search-top-shadow' : '' ">
-        <div class="info-logo-content" @click="handleOpenLink"></div>
-        <div class="search auto-input" id="topSearch">
-            <div class="search-info">
-                <label>
-                    <input class="keyword label-keyword" v-model="keywords" type="text" placeholder="搜索文章" autocomplete="off" />
-                </label>
-                <a class="searchBtn icon" href="javascript:void(0);">搜索</a>
-            </div>
-            <div class="keywords">
-                <div th:each="label,count : ${labels}" th:if="${count.index} le 7">
-                    <a th:labelId="${label.id}" th:href="'/info/label-' + ${label.id} + '-1.html'" th:text="${label.name}" th:class="${labelId==label.id}?'label-active':''"></a>
-                    <span th:if="${count.index} le 6"> / </span>
-                </div>
-            </div>
-        </div>
-        <div class="H5-info-logo" @click="handleOpenLink"></div>
-        <div class="H5-info-menu">
-            <div @click="(right_drawer = false), (show = !show)"></div>
-            <div>菜单</div>
-            <div :class="right_drawer ? 'right_drawer_close' : 'right_drawer_open'" @click="(right_drawer = !right_drawer), (show = false)"></div>
-        </div>
-    </div>
-
-<!--    搜索头弹窗-->
-    <van-popup class="searchPopup" v-model="show" position="top" v-cloak>
-        <div class="search-title">
-            <div>搜索</div>
-            <div @click.stop="show = !show"></div>
-        </div>
-        <div class="search-info">
-            <label>
-                <input class="keyword" type="search" placeholder="搜索文章" autocomplete="off" v-model="searchKeys" />
-            </label>
-            <a class="searchBtn icon" href="javascript:void(0);" @click="handlerH5Search">搜索</a>
-        </div>
-        <div class="keywords">
-            <div th:each="label,count : ${labels}" @click.stop="show = !show" th:if="${count.index} le 7">
-                <a th:href="'/info/label-' + ${label.id} + '-1.html'" th:text="${label.name}"></a>
-            </div>
-        </div>
-    </van-popup>
-
-<!--   导航栏弹窗-->
-    <van-popup class="navPopup" v-model="right_drawer" position="right" v-cloak>
-        <van-collapse accordion v-model="activeNames">
-            <van-collapse-item th:title="${type.name}" th:name="${type.id}" th:each="type,status: *{articleType}" th:typeId="${type.id}" th:if="${status.index} < 10">
-                <a th:href="'/info/center-'+${type.id}+'-1.html'" th:text="${type.name}" class="van-collapse-nav"></a>
-                <a class="van-collapse-nav" th:each="link: *{type.linkList}" th:text="${link.name}" th:href="'/info/center-'+${link.id}+'-1.html'"></a>
-            </van-collapse-item>
-            <a class="van-document" @click="(right_drawer = false)" href="/document/beauty-archive.html">美业资料</a>
-        </van-collapse>
-    </van-popup>
-
-    <!--导航栏-->
-    <div class="nav">
-        <div class="type">
-            <div class="type-content" th:if="${articleType}">
-                <!-- <a class="home" href="/" target="_blank">商城</a> -->
-                <div class="type-item" th:each="type,status: *{articleType}" th:typeId="${type.id}" th:class="${typeId==type.id}?'type-item current':'type-item'" th:if="${status.index} < 10">
-                    <a class="typeBtn" th:text="${type.name}" th:href="'/info/center-'+${type.id}+'-1.html'"></a>
-                    <div class="type-item-link" th:if="${type.linkList}"></div>
-                    <div class="nav-menu" th:if="${type.linkList}">
-                        <a th:each="link: *{type.linkList}" th:href="'/info/center-'+${link.id}+'-1.html'" th:text="${link.name}"></a>
-                    </div>
-                </div>
-                <a class="typeBtn moreLink" href="/document/beauty-archive.html" target="_blank">美业资料</a>
-                <!-- <a class="typeBtn" href="/encyclopedia/product.html" target="_blank">采美百科</a> -->
-            </div>
-        </div>
-        <!--搜索-->
-<!--        <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>
-    <input type="hidden" th:value="${labelId}" id="labelId">
-    <input type="hidden" th:value="${typeId}" id="typeId">
-    <input type="hidden" th:value="${pageNum}" id="pageNum">
-    <input type="hidden" th:value="${coreServer}" id="coreServer">
-    <input type="hidden" th:value="${agent}" id="userAgent">
-</header>
+<header class="header" id="info-header" xmlns:th="http://www.w3isRossShow.org/1999/xhtml">
+    <div class="head-back">
+        <div class="head">
+            <div class="head-logo"></div>
+            <div class="text">
+                <a href="/index.html">采美商城首页</a>
+            </div>
+        </div>
+    </div>
+<!--    搜索头-->
+    <div class="search-top" :class="(show || right_drawer) ? 'search-top-shadow' : '' ">
+        <div class="info-logo-content" @click="handleOpenLink"></div>
+        <div class="search auto-input" id="topSearch">
+            <div class="search-info">
+                <label>
+                    <input class="keyword label-keyword" v-model="keywords" type="text" placeholder="搜索文章" autocomplete="off" />
+                </label>
+                <a class="searchBtn icon" href="javascript:void(0);">搜索</a>
+            </div>
+            <div class="keywords">
+                <div th:each="label,count : ${labels}" th:if="${count.index} le 7">
+                    <a th:labelId="${label.id}" th:href="'/info/label-' + ${label.id} + '-1.html'" th:text="${label.name}" th:class="${labelId==label.id}?'label-active':''"></a>
+                    <span th:if="${count.index} le 6"> / </span>
+                </div>
+            </div>
+        </div>
+        <div class="H5-info-logo" @click="handleOpenLink"></div>
+        <div class="H5-info-menu">
+            <div @click="(right_drawer = false), (show = !show)"></div>
+            <div>菜单</div>
+            <div :class="right_drawer ? 'right_drawer_close' : 'right_drawer_open'" @click="(right_drawer = !right_drawer), (show = false)"></div>
+        </div>
+    </div>
+<!--    搜索头弹窗-->
+    <van-popup class="searchPopup" v-model="show" position="top" v-cloak>
+        <div class="search-title">
+            <div>搜索</div>
+            <div @click.stop="show = !show"></div>
+        </div>
+        <div class="search-info">
+            <label>
+                <input class="keyword" type="search" placeholder="搜索文章" autocomplete="off" v-model="searchKeys" />
+            </label>
+            <a class="searchBtn icon" href="javascript:void(0);" @click="handlerH5Search">搜索</a>
+        </div>
+        <div class="keywords">
+            <div th:each="label,count : ${labels}" @click.stop="show = !show" th:if="${count.index} le 7">
+                <a th:href="'/info/label-' + ${label.id} + '-1.html'" th:text="${label.name}"></a>
+            </div>
+        </div>
+    </van-popup>
+
+<!--   导航栏弹窗-->
+    <van-popup class="navPopup" v-model="right_drawer" position="right" v-cloak>
+        <van-collapse accordion v-model="activeNames">
+            <van-collapse-item th:title="${type.name}" th:name="${type.id}" th:each="type,status: *{articleType}" th:typeId="${type.id}" th:if="${status.index} < 10">
+                <a th:href="'/info/center-'+${type.id}+'-1.html'" th:text="${type.name}" class="van-collapse-nav"></a>
+                <a class="van-collapse-nav" th:each="link: *{type.linkList}" th:text="${link.name}" th:href="'/info/center-'+${link.id}+'-1.html'"></a>
+            </van-collapse-item>
+            <a class="van-document" @click="(right_drawer = false)" href="/document/beauty-archive.html">美业资料</a>
+        </van-collapse>
+    </van-popup>
+
+    <!--导航栏-->
+    <div class="nav">
+        <div class="type">
+            <div class="type-content" th:if="${articleType}">
+                <!-- <a class="home" href="/" target="_blank">商城</a> -->
+                <div class="type-item" th:each="type,status: *{articleType}" th:typeId="${type.id}" th:class="${typeId==type.id}?'type-item current':'type-item'" th:if="${status.index} < 10">
+                    <a class="typeBtn" th:text="${type.name}" th:href="'/info/center-'+${type.id}+'-1.html'"></a>
+                    <div class="type-item-link" th:if="${type.linkList}"></div>
+                    <div class="nav-menu" th:if="${type.linkList}">
+                        <a th:each="link: *{type.linkList}" th:href="'/info/center-'+${link.id}+'-1.html'" th:text="${link.name}"></a>
+                    </div>
+                </div>
+                <a class="typeBtn moreLink" href="/document/beauty-archive.html" target="_blank">美业资料</a>
+                <!-- <a class="typeBtn" href="/encyclopedia/product.html" target="_blank">采美百科</a> -->
+            </div>
+        </div>
+        <!--搜索-->
+<!--        <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>
+    <input type="hidden" th:value="${labelId}" id="labelId">
+    <input type="hidden" th:value="${typeId}" id="typeId">
+    <input type="hidden" th:value="${pageNum}" id="pageNum">
+    <input type="hidden" th:value="${coreServer}" id="coreServer">
+    <input type="hidden" th:value="${agent}" id="userAgent">
+</header>

src/main/resources/templates/article/components/article-sidebar.html

@@ -1,6 +1,6 @@
 <html xmlns:th="http://www.w3isRossShow.org/1999/xhtml">
-<div class="other">
-    <div class="other" id="articleSide" v-cloak th:if="${isSelectInfo}">
+<div class="other" id="articleSide" >
+    <div class="other" v-cloak th:if="${isSelectInfo}">
         <!--    &lt;!&ndash;侧边栏Ross广告图&ndash;&gt;-->
         <!--    <div v-if="isPC && isRossShow" class="article-right-ross" :class="isRossShow ? 'show' : 'none'">-->
         <!--        <a href="/supplier-1378.html" v-if="isPC"><img src="/img/ross/ross-image@1x.jpg" alt="深圳艾斯佰丽生物科技有限公司"></a>-->

src/main/resources/templates/article/detail.html

@@ -2,7 +2,7 @@
 <html lang="zh-CN" xmlns:th="https://www.thymeleaf.org" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xsi:schemaLocation="https://www.thymeleaf.org ">
 <head>
-    <title th:text="${article!=null?article.title:''}+'_采美365网'"></title>
+    <title th:text="${article!=null?article.title:''}+'采美信息中心'"></title>
     <meta name="keywords" th:content="${article?.keyword}">
     <meta name="description" th:content="${article?.recommendContent}">
     <template th:replace="article/components/article-link"></template>

src/main/resources/templates/article/list.html

@@ -2,7 +2,7 @@
 <html lang="zh-CN" xmlns:th="https://www.thymeleaf.org" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xsi:schemaLocation="https://www.thymeleaf.org ">
 <head>
-    <title>信息平台</title>
+    <title>采美信息中心</title>
     <template th:replace="article/components/article-link"></template>
     <template th:replace="components/analysis"></template>
     <link rel="stylesheet" href="/lib/element-ui/index.css" type="text/css"/>

src/main/resources/templates/article/recommendation.html

@@ -1,7 +1,7 @@
 <html lang="zh-CN" xmlns:th="https://www.thymeleaf.org" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="https://www.thymeleaf.org ">
 
 <head>
-    <title>信息平台</title>
+    <title>采美信息中心-精选推荐</title>
     <link th:href="@{/css/article/recommendation.css(v=${version})}" rel="stylesheet" type="text/css">
     <template th:replace="article/components/article-link"></template>
     <template th:replace="components/analysis"></template>
@@ -10,7 +10,6 @@
 <body>
     <!--导航栏-->
     <template th:replace="article/components/article-header"></template>
-
     <div class="mainContent">
         <div id="Recommendation" v-cloak>
             <div class="content clearfix" v-if="state == 1">
@@ -73,10 +72,6 @@
                         <a class="btn" href="javascript:void(0)" @click="changeLink">点击跳转</a>
                     </div>
                 </div>
-                <!--侧边栏Ross广告图-->
-<!--                <div v-if="isPC && isRossShow" class="article-right-ross" :class="isRossShow ? 'show' : 'none'">-->
-<!--                    <a href="/supplier-1378.html" v-if="isPC"><img src="/img/ross/ross-image@1x.jpg" alt="深圳艾斯佰丽生物科技有限公司"></a>-->
-<!--                </div>-->
             </div>
             <div class="infomationlist" v-else>
                 <div class="title" v-if="state == 2">
@@ -131,11 +126,9 @@
                 </div>
             </div>
         </div>
-
         <!--侧边栏-->
         <template th:replace="article/components/article-sidebar"></template>
     </div>
-
     <template th:replace="article/components/article-drawer"></template>
     <template th:replace="article/components/article-footer"></template>
     <template th:replace="components/foot-link"></template>
@@ -144,10 +137,11 @@
     <script charset="utf-8" type="text/javascript" th:src="@{/lib/element-ui/element-ui.min.js}"></script>
     <script type="text/javascript" src="/lib/element-ui/vant.min.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}"></script>
     <script charset="utf-8" type="text/javascript" th:src="@{/js/common/serviceapi/product.service.js}"></script>
     <script charset="utf-8" type="text/javascript" th:src="@{/js/article/common.js(v=${version})}"></script>
-    <script charset="utf-8" type="text/javascript" th:src="@{/js/common/serviceapi/utils.service.js}"></script>
-    <script charset="utf-8" type="text/javascript" th:src="@{/js/article/list.js(v=${version})}"></script>
+    <script charset="utf-8" type="text/javascript" th:src="@{/js/article/mixins/searchMixins.js(v=${version})}"></script>
+<!--    <script charset="utf-8" type="text/javascript" th:src="@{/js/article/list.js(v=${version})}"></script>-->
     <script charset="utf-8" type="text/javascript" th:src="@{/js/article/recommendation.js(v=${version})}"></script>
 </body>
 

src/main/resources/templates/components/drawer-ai.html

@@ -0,0 +1,32 @@
+<el-drawer title="" :visible.sync="isAiDrawer" direction="ltr" size="40%" :before-close="handleClose">
+  <div class="cm_ai_container">
+
+    <div class="cm_ai_answer_main" id="cm_ai_answer">
+<!--      <div class="cm_ai_answer">-->
+<!--        <div class="cm_ai_html_icon user">-->
+<!--          <img src="/img/base/icon-aiUser@2x.png">-->
+<!--        </div>-->
+<!--        <div class="cm_ai_html user" id="cm_ai_htmlcontent_user"></div>-->
+<!--      </div>-->
+<!--      <div class="cm_ai_answer">-->
+<!--        <div class="cm_ai_html_icon">-->
+<!--          <img src="/img/base/icon-ai@1x.png">-->
+<!--        </div>-->
+<!--        <div class="cm_ai_html" id="cm_ai_htmlcontent"></div>-->
+<!--      </div>-->
+    </div>
+    <div class="cm_ai_content">
+      <div class="cm_ai_header">
+        <div class="cm_ai_icon"><img src="/img/base/icon-ai@1x.png" alt="采美AI助手"></div>
+        <div class="cm_ai_text">采美AI助手</div>
+      </div>
+      <div class="cm_ai_input">
+        <textarea class="cm_ai_textarea" v-model="textarea" placeholder="请输入您想了解的内容"></textarea>
+      </div>
+      <div class="cm_ai_button" :class="isLoading ? 'none' : ''" @click="handleAskQuestion">
+        <img v-if="isLoading" class="cm_ai_icon" src="/img/base/icon-loading.gif">
+        <img v-else class="cm_ai_icon" src="/img/base/icon-aiBtn@2x.png">
+      </div>
+    </div>
+  </div>
+</el-drawer>

src/main/resources/templates/components/foot-link.html

@@ -11,6 +11,7 @@
 <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/mixins/router.config.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/mixins/cmAiMixins.js(v=${version})}"></script>
 <script charset="utf-8" type="text/javascript" th:src="@{/js/mixins/cmSysMixins.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>

src/main/resources/templates/components/footer.html

@@ -119,8 +119,12 @@
                 </div>
             </div>
         </div>
+<!--        <div class="item">-->
+<!--            <span class="aiItem" @click="handleShowAiDrawer">Ai助手</span>-->
+<!--        </div>-->
         <div class="item">
             <span class="toTop icon mIcon">TOP</span>
         </div>
     </div>
+    <template th:replace="components/drawer-ai"></template>
 </footer>