搜索输入优化

src/main/java/com/caimei/www/controller/unlimited/InstrumentController.java

@@ -24,7 +24,7 @@ import java.util.List;
 @Controller
 public class InstrumentController extends BaseController {
 
-	private static final String INSTRUMENT_SEARCH_PATH = "instrument/search";
+	private static final String INSTRUMENT_LIST_PATH = "instrument/list";
 	private static final String INSTRUMENT_DETAIL_PATH = "instrument/detail";
 
     private InstrumentService instrumentService;
@@ -39,7 +39,7 @@ public class InstrumentController extends BaseController {
      */
     @GetMapping("/instrument/list.html")
     public String search() {
-        return INSTRUMENT_SEARCH_PATH;
+        return INSTRUMENT_LIST_PATH;
     }
 
     /**

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

@@ -112,25 +112,10 @@
 .productItem .item .btn{display:inline-block;width:35.8vw;height:9vw;text-align:center;overflow:hidden;color:#F94B4B;background:#FEF6F3;border-radius:2px}
 .productItem .item .btn.add{background:#FEF6F3;color:#E15616;}
 .noMore{height:10vw;line-height:10vw;text-align:center;color:#ccc}
-/*常规弹框*/
-.baseAlert{display:none;background-color:rgba(74,79,88,.7);z-index:999}
-.baseAlert .box{box-sizing:border-box;width:74.6vw;padding-bottom:2.7vw;position:relative;top:50%;margin:-40vw auto 0 auto;font-size:3.7vw;background:#FFF;border-radius:1.6vw;color:#4A4F58;line-height:5.4vw;text-align:left}
-.baseAlert .hd{border-bottom:1px solid #E2E7EF;height:10vw;line-height:10vw;box-sizing:border-box;padding:0 2.7vw;color:#627386}
-.baseAlert .hd .close{float:right;text-align:center;font-style:normal;cursor:pointer}
-.baseAlert .hd .close:before{content:'\2715'}
-.baseAlert .bd{padding:4vw 2.7vw;text-align:center}
-.baseAlert .btn{text-align:center}
-.baseAlert .btn em{display:inline-block;width:20vw;height:8vw;line-height:8vw;margin:0 3vw;text-align:center;font-style:normal;border-radius:2px;box-sizing:border-box;cursor:pointer;font-size:3.1vw}
-.baseAlert .btn em.confirm{color:#FFF;background:#E15621}
-.baseAlert .btn em.cancel{color:#22272E;background:#FFF;border:1px solid #B8BFCA}
-/*登录弹框*/
-.loginAlert .box{width:74.6vw;padding-top:7.6vw;margin:-40vw auto 0 auto;text-align:center}
-.loginAlert .box:before{content:'';display:block;width:26.7vw;height:26.7vw;background:url(/img/base/to_login_m.png) no-repeat left top;background-size:100% 100%;margin:0 auto}
-.loginAlert .hd{display:none}
-.loginAlert .bd{padding:2vw 0}
-.loginAlert .bd span{display:block}
-.loginAlert .btn em{display:block;box-sizing:border-box;width:55.2vw;height:11.6vw;line-height:11.6vw;text-align:center;border-radius:5.8vw;margin:5.4vw auto 0}
-.loginAlert .btn em.confirm{color:#FFF;background:#E15621;border:none}
+/* 登录弹框 */
+.loginAlert{padding-top:1vw;text-align:center;}
+.loginAlert span{display:block}
+.loginAlert:before{content:'';display:block;width:26.7vw;height:26.7vw;background:url(/img/base/to_login_m.png) no-repeat left top;background-size:100% 100%;margin:0 auto}
 
 /* 咨询，回到顶部 */
 #scrollTop{display:none;position:fixed;right:0;;z-index:9999;bottom:4vw;}

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

@@ -188,24 +188,10 @@ body{min-width:1184px;}
 .pageWrap span{display:inline-block;height:40px;line-height:40px;margin:0 5px;color:#93979F}
 .pageWrap b{color:#2D3036;font-weight:normal}
 .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}
-/* 常规弹框 */
-.baseAlert{display:none;position:fixed;top:0;left:0;width:100%;height:100%;margin:0 auto;background-color:rgba(74,79,88,.7);z-index:999}
-.baseAlert .box{position:relative;width:338px;top:50%;margin:-100px auto 0 auto;padding-bottom:16px;box-sizing:border-box;font-size:14px;background:#FFF;border-radius:2px;color:#4A4F58;text-align:left}
-.baseAlert .hd{border-bottom:1px solid #E2E7EF;height:42px;line-height:42px;box-sizing:border-box;padding:0 16px;color:#627386}
-.baseAlert .hd .close{float:right;text-align:center;font-style:normal;cursor:pointer}
-.baseAlert .hd .close:before{content:'\2715'}
-.baseAlert .bd{padding:16px;line-height:24px;font-size:14px;color:#22272E}
-.baseAlert .btn{text-align:center}
-.baseAlert .btn em{display:inline-block;width:68px;height:32px;line-height:32px;margin:0 8px;text-align:center;font-style:normal;border-radius:2px;box-sizing:border-box;cursor:pointer}
-.baseAlert .btn em.confirm{color:#FFF;background:#E15621}
-.baseAlert .btn em.cancel{color:#22272E;background:#FFF;border:1px solid #B8BFCA}
 /* 登录弹框 */
-.loginAlert .box{width:338px;height:234px;top:50%;margin:-117px auto 0 auto}
-.loginAlert .box:after{content:'';display:block;width:125px;height:125px;background:url(/img/base/to_login.png) no-repeat left top;background-size:100% 100%;margin-left:16px}
-.loginAlert .bd span:first-child:after{content:'，'}
-.loginAlert .btn em{position:absolute;bottom:16px}
-.baseAlert .btn em.confirm{right:16px;}
-.baseAlert .btn em.cancel{right:100px;}
+.loginAlert{padding-top:5px;}
+.loginAlert span:first-child:after{content: '，';}
+.loginAlert:after{content:'';display:block;width:125px;height:125px;background:url(/img/base/to_login.png) no-repeat left top;background-size:100% 100%;margin:10px 0 0 15px;}
 /* 咨询，回到顶部 */
 #scrollTop{display:none;position:fixed;right:50%;margin-right:-700px;width:88px;z-index:9999;bottom:120px;}
 #scrollTop .item{width:100%;background-color:#fff;box-sizing:border-box;text-align:center;box-shadow:0 2px 4px rgb(254,246,243);border-radius:2px;margin-bottom:10px;font-size:12px;position:relative}

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

@@ -86,13 +86,30 @@ $(function(){
     }
     // 去登录弹窗
     $('body').on("click", '.toLogin',function () {
-        $('.loginAlert').show();
-        if(!isPC){fixedBody();}
-    }).on("click", '.loginAlert .box',function (e) {
-        e.stopPropagation();
-    }).on("click", '.loginAlert .close,.loginAlert em.btn,.loginAlert',function () {
-        $('.loginAlert').hide();
-        if(!isPC){looseBody();}
+        $.confirm({
+            useBootstrap: false,
+            boxWidth: (isPC?'338px':'74.6vw'),
+            title: false,
+            content:'<div class="loginAlert"><span>你还未登录</span><span>请登录后再进行购买</span></div>',
+            closeIcon: true,
+            animation: 'opacity',
+            closeAnimation: 'opacity',
+            animateFromElement: false,
+            scrollToPreviousElement: false,
+            buttons: {
+                login: {
+                    text: '去登录',
+                    btnClass: 'btn-confirm-login',
+                    action: function(){
+                        window.location.href = '/login.html';
+                    }
+                },
+                close: {
+                    text: '取消',
+                    btnClass: 'btn-cancel-login'
+                }
+            }
+        });
     });
     // 置顶
     $('#scrollTop').on("click", '.toTop',function () {
@@ -124,18 +141,33 @@ $(function(){
     });
     // 顶部搜索框
     $('#topSearch').on("click", '.searchBtn', function(){
-        var type = $(this).parents('#topSearch').find('[data-select]').attr("data-select")*1;
-        var keyword = $.trim($(this).parents('#topSearch').find('.keyword').val());
+        var type = $('#topSearch').find('[data-select]').attr("data-select")*1;
+        var keyword = $.trim($('#topSearch').find('.keyword').val());
         if (keyword.length < 2) {
-
+            $.confirm({
+                useBootstrap: false,
+                boxWidth: (isPC?'300px':'70%'),
+                title:'提示',
+                content:'请至少输入两个关键字！',
+                closeIcon: true,
+                animation: 'opacity',
+                closeAnimation: 'opacity',
+                animateFromElement: false,
+                buttons: {
+                    close: {
+                        text: '确定',
+                        btnClass: 'btn-confirm'
+                    }
+                }
+            });
             return false;
         }
         if (type === 2) {
             // 项目仪器
-            window.location.href = '/product/list.html?keyword='+encodeURIComponent(keyword);
+            window.location.href = '/instrument/list.html?keyword='+encodeURIComponent(keyword);
         } else if(type === 1) {
             // 供应商
-            window.location.href = '/product/list.html?keyword='+encodeURIComponent(keyword);
+            window.location.href = '/supplier/list.html?keyword='+encodeURIComponent(keyword);
         } else{
             // 商品
             window.location.href = '/product/list.html?keyword='+encodeURIComponent(keyword);
@@ -250,7 +282,7 @@ function looseBody() {
 //url参数
 function getUrlParam(name) {
     var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
-    var r = decodeURIComponent(unescape(window.location.search)).substr(1).match(reg);
+    var r = decodeURIComponent(window.location.search).substr(1).match(reg);
     if (r != null) {
         return (r[2])
     }

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

@@ -79,6 +79,10 @@ var instrumentList = new Vue({
             this.params.num = 1;
         }
         this.params.keyword = getUrlParam("keyword") ? getUrlParam("keyword") : "";
+        // 搜索框赋值
+        $('#topSearch').find('[data-select]').attr("data-select", 2).text("项目仪器");
+        $('#topSearch').find('.jqSelect').find('select').val(2);
+        $('#topSearch').find('.keyword').val(this.params.keyword);
         // 获取列表数据
         this.getListByKeyword();
     },

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

@@ -161,6 +161,10 @@ var productList = new Vue({
             this.params.num = 1;
         }
         this.params.keyword = getUrlParam("keyword") ? getUrlParam("keyword") : "";
+        // 搜索框赋值
+        $('#topSearch').find('[data-select]').attr("data-select", 0).text("产品");
+        $('#topSearch').find('.jqSelect').find('select').val(0);
+        $('#topSearch').find('.keyword').val(getUrlParam("keyword"));
         this.params.sortField = getUrlParam("sortField") ? getUrlParam("sortField") : "";
         this.params.sortType = getUrlParam("sortType") ? getUrlParam("sortType") * 1 : 1;
         this.searchFlag = (this.params.keyword !== "");
@@ -196,7 +200,6 @@ var productList = new Vue({
         }
     },
     mounted: function () {
-        var searchTypeID = getUrlParam("searchTypeID");
         var _self = this;
         if(!isPC){
             $('footer').addClass("noneImportant");

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

@@ -79,11 +79,14 @@ var supplierList = new Vue({
             this.params.num = 1;
         }
         this.params.keyword = getUrlParam("keyword") ? getUrlParam("keyword") : "";
+        // 搜索框赋值
+        $('#topSearch').find('[data-select]').attr("data-select", 1).text("供应商");
+        $('#topSearch').find('.jqSelect').find('select').val(1);
+        $('#topSearch').find('.keyword').val(this.params.keyword);
         // 获取列表数据
         this.getListByKeyword();
     },
     mounted: function () {
-        var searchTypeID = getUrlParam("searchTypeID");
         var _self = this;
         if(!isPC){
             $('footer').addClass("noneImportant");

src/main/resources/static/lib/jquery-confirm.min.css

@@ -0,0 +1,184 @@
+/*!
+ * jquery-confirm v3.3.4 (http://craftpip.github.io/jquery-confirm/)
+ * Author: boniface pereira
+ * Website: www.craftpip.com
+ * Contact: hey@craftpip.com
+ *
+ * Copyright 2013-2019 jquery-confirm
+ * Licensed under MIT (https://github.com/craftpip/jquery-confirm/blob/master/LICENSE)
+ */
+@-webkit-keyframes jconfirm-spin{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}
+@keyframes jconfirm-spin{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}
+body[class*=jconfirm-no-scroll-]{overflow:hidden !important}
+.jconfirm{position:fixed;top:0;left:0;right:0;bottom:0;z-index:99999999;font-family:inherit;overflow:hidden}
+.jconfirm .jconfirm-bg{position:fixed;top:0;left:0;right:0;bottom:0;-webkit-transition:opacity .4s;transition:opacity .4s}
+.jconfirm .jconfirm-bg.jconfirm-bg-h{opacity:0 !important}
+.jconfirm .jconfirm-scrollpane{-webkit-perspective:500px;perspective:500px;-webkit-perspective-origin:center;perspective-origin:center;display:table;width:100%;height:100%}
+.jconfirm .jconfirm-row{display:table-row;width:100%}
+.jconfirm .jconfirm-cell{display:table-cell;vertical-align:middle}
+.jconfirm .jconfirm-holder{max-height:100%;padding:50px 0}
+.jconfirm .jconfirm-box-container{-webkit-transition:-webkit-transform;transition:-webkit-transform;transition:transform;transition:transform,-webkit-transform}
+.jconfirm .jconfirm-box-container.jconfirm-no-transition{-webkit-transition:none !important;transition:none !important}
+.jconfirm .jconfirm-box{background:white;border-radius:4px;position:relative;outline:none;padding:15px 15px 0;overflow:hidden;margin-left:auto;margin-right:auto}
+@-webkit-keyframes type-blue{1%,100%{border-color:#3498db}50%{border-color:#5faee3}}
+@keyframes type-blue{1%,100%{border-color:#3498db}50%{border-color:#5faee3}}
+@-webkit-keyframes type-green{1%,100%{border-color:#2ecc71}50%{border-color:#54d98c}}
+@keyframes type-green{1%,100%{border-color:#2ecc71}50%{border-color:#54d98c}}
+@-webkit-keyframes type-red{1%,100%{border-color:#e74c3c}50%{border-color:#ed7669}}
+@keyframes type-red{1%,100%{border-color:#e74c3c}50%{border-color:#ed7669}}
+@-webkit-keyframes type-orange{1%,100%{border-color:#f1c40f}50%{border-color:#f4d03f}}
+@keyframes type-orange{1%,100%{border-color:#f1c40f}50%{border-color:#f4d03f}}
+@-webkit-keyframes type-purple{1%,100%{border-color:#9b59b6}50%{border-color:#b07cc6}}
+@keyframes type-purple{1%,100%{border-color:#9b59b6}50%{border-color:#b07cc6}}
+@-webkit-keyframes type-dark{1%,100%{border-color:#34495e}50%{border-color:#46627f}}
+@keyframes type-dark{1%,100%{border-color:#34495e}50%{border-color:#46627f}}
+.jconfirm .jconfirm-box.jconfirm-type-animated{-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}
+.jconfirm .jconfirm-box.jconfirm-type-blue{border-top:solid 7px #3498db;-webkit-animation-name:type-blue;animation-name:type-blue}
+.jconfirm .jconfirm-box.jconfirm-type-green{border-top:solid 7px #2ecc71;-webkit-animation-name:type-green;animation-name:type-green}
+.jconfirm .jconfirm-box.jconfirm-type-red{border-top:solid 7px #e74c3c;-webkit-animation-name:type-red;animation-name:type-red}
+.jconfirm .jconfirm-box.jconfirm-type-orange{border-top:solid 7px #f1c40f;-webkit-animation-name:type-orange;animation-name:type-orange}
+.jconfirm .jconfirm-box.jconfirm-type-purple{border-top:solid 7px #9b59b6;-webkit-animation-name:type-purple;animation-name:type-purple}
+.jconfirm .jconfirm-box.jconfirm-type-dark{border-top:solid 7px #34495e;-webkit-animation-name:type-dark;animation-name:type-dark}
+.jconfirm .jconfirm-box.loading{height:120px}
+.jconfirm .jconfirm-box.loading:before{content:'';position:absolute;left:0;background:white;right:0;top:0;bottom:0;border-radius:10px;z-index:1}
+.jconfirm .jconfirm-box.loading:after{opacity:0.6;content:'';height:30px;width:30px;border:solid 3px transparent;position:absolute;left:50%;margin-left:-15px;border-radius:50%;-webkit-animation:jconfirm-spin 1s infinite linear;animation:jconfirm-spin 1s infinite linear;border-bottom-color:dodgerblue;top:50%;margin-top:-15px;z-index:2}
+.jconfirm .jconfirm-box div.jconfirm-closeIcon{height:20px;width:20px;position:absolute;top:10px;right:10px;cursor:pointer;opacity:.6;text-align:center;font-size:27px !important;line-height:14px !important;display:none;z-index:1}
+.jconfirm .jconfirm-box div.jconfirm-closeIcon:empty{display:none}
+.jconfirm .jconfirm-box div.jconfirm-closeIcon .fa{font-size:16px}
+.jconfirm .jconfirm-box div.jconfirm-closeIcon .glyphicon{font-size:16px}
+.jconfirm .jconfirm-box div.jconfirm-closeIcon .zmdi{font-size:16px}
+.jconfirm .jconfirm-box div.jconfirm-closeIcon:hover{opacity:1}
+.jconfirm .jconfirm-box div.jconfirm-title-c{display:block;font-size:22px;line-height:20px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;padding-bottom:15px}
+.jconfirm .jconfirm-box div.jconfirm-title-c.jconfirm-hand{cursor:move}
+.jconfirm .jconfirm-box div.jconfirm-title-c .jconfirm-icon-c{font-size:inherit;display:inline-block;vertical-align:middle}
+.jconfirm .jconfirm-box div.jconfirm-title-c .jconfirm-icon-c i{vertical-align:middle}
+.jconfirm .jconfirm-box div.jconfirm-title-c .jconfirm-icon-c:empty{display:none}
+.jconfirm .jconfirm-box div.jconfirm-title-c .jconfirm-title{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-size:inherit;font-family:inherit;display:inline-block;vertical-align:middle}
+.jconfirm .jconfirm-box div.jconfirm-title-c .jconfirm-title:empty{display:none}
+.jconfirm .jconfirm-box div.jconfirm-content-pane{margin-bottom:15px;height:auto;-webkit-transition:height 0.4s ease-in;transition:height 0.4s ease-in;display:inline-block;width:100%;position:relative;overflow-x:hidden;overflow-y:auto}
+.jconfirm .jconfirm-box div.jconfirm-content-pane.no-scroll{overflow-y:hidden}
+.jconfirm .jconfirm-box div.jconfirm-content-pane::-webkit-scrollbar{width:3px}
+.jconfirm .jconfirm-box div.jconfirm-content-pane::-webkit-scrollbar-track{background:rgba(0,0,0,0.1)}
+.jconfirm .jconfirm-box div.jconfirm-content-pane::-webkit-scrollbar-thumb{background:#666;border-radius:3px}
+.jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content{overflow:auto}
+.jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content img{max-width:100%;height:auto}
+.jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content:empty{display:none}
+.jconfirm .jconfirm-box .jconfirm-buttons > button{margin:0 5px 12px 5px}
+.jconfirm .jconfirm-box .jconfirm-buttons button{display:inline-block;padding:6px 16px;font-size:14px;font-weight:400;line-height:1.42857143;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-radius:4px;min-height:1em;-webkit-transition:opacity 0.1s ease,background-color 0.1s ease,color 0.1s ease,background 0.1s ease,-webkit-box-shadow 0.1s ease;transition:opacity 0.1s ease,background-color 0.1s ease,color 0.1s ease,background 0.1s ease,-webkit-box-shadow 0.1s ease;transition:opacity 0.1s ease,background-color 0.1s ease,color 0.1s ease,box-shadow 0.1s ease,background 0.1s ease;transition:opacity 0.1s ease,background-color 0.1s ease,color 0.1s ease,box-shadow 0.1s ease,background 0.1s ease,-webkit-box-shadow 0.1s ease;-webkit-tap-highlight-color:transparent;border:none;background-image:none}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-blue{background-color:#3498db;color:#FFF;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-blue:hover{background-color:#2980b9;color:#FFF}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-green{background-color:#2ecc71;color:#FFF;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-green:hover{background-color:#27ae60;color:#FFF}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-red{background-color:#e74c3c;color:#FFF;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-red:hover{background-color:#c0392b;color:#FFF}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-orange{background-color:#f1c40f;color:#FFF;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-orange:hover{background-color:#f39c12;color:#FFF}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-default{color:#22272E;background:#FFF;border:1px solid #B8BFCA;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-default:hover{background-color:#FFE6DC;color:#000}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-confirm{color:#FFF;background:#E15621;border:1px solid #E15621;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-confirm:hover{opacity:.8}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-purple{background-color:#9b59b6;color:#FFF;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-purple:hover{background-color:#8e44ad;color:#FFF}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-dark{background-color:#34495e;color:#FFF;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-dark:hover{background-color:#2c3e50;color:#FFF}
+.jconfirm .jconfirm-box.jconfirm-type-red .jconfirm-title-c .jconfirm-icon-c{color:#e74c3c !important}
+.jconfirm .jconfirm-box.jconfirm-type-blue .jconfirm-title-c .jconfirm-icon-c{color:#3498db !important}
+.jconfirm .jconfirm-box.jconfirm-type-green .jconfirm-title-c .jconfirm-icon-c{color:#2ecc71 !important}
+.jconfirm .jconfirm-box.jconfirm-type-purple .jconfirm-title-c .jconfirm-icon-c{color:#9b59b6 !important}
+.jconfirm .jconfirm-box.jconfirm-type-orange .jconfirm-title-c .jconfirm-icon-c{color:#f1c40f !important}
+.jconfirm .jconfirm-box.jconfirm-type-dark .jconfirm-title-c .jconfirm-icon-c{color:#34495e !important}
+.jconfirm .jconfirm-clear{clear:both}
+.jconfirm.jconfirm-rtl{direction:rtl}
+.jconfirm.jconfirm-rtl div.jconfirm-closeIcon{left:5px;right:auto}
+.jconfirm.jconfirm-white .jconfirm-bg,.jconfirm.jconfirm-light .jconfirm-bg{background-color:#444;opacity:.2}
+.jconfirm.jconfirm-white .jconfirm-box,.jconfirm.jconfirm-light .jconfirm-box{-webkit-box-shadow:0 2px 6px rgba(0,0,0,0.2);box-shadow:0 2px 6px rgba(0,0,0,0.2);border-radius:5px}
+.jconfirm.jconfirm-white .jconfirm-box .jconfirm-title-c .jconfirm-icon-c,.jconfirm.jconfirm-light .jconfirm-box .jconfirm-title-c .jconfirm-icon-c{margin-right:8px;margin-left:0px}
+.jconfirm.jconfirm-white .jconfirm-box .jconfirm-buttons,.jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons{text-align:right;font-size:0}
+.jconfirm.jconfirm-white .jconfirm-box .jconfirm-buttons button,.jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button{text-transform:uppercase;font-size:14px;text-shadow:none;position:relative}
+.jconfirm.jconfirm-white .jconfirm-box .jconfirm-buttons button.btn-default,.jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button.btn-default{-webkit-box-shadow:none;box-shadow:none;color:#333}
+.jconfirm.jconfirm-white .jconfirm-box .jconfirm-buttons button.btn-default:hover,.jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button.btn-default:hover{background:#ddd}
+.jconfirm.jconfirm-white.jconfirm-rtl .jconfirm-title-c .jconfirm-icon-c,.jconfirm.jconfirm-light.jconfirm-rtl .jconfirm-title-c .jconfirm-icon-c{margin-left:8px;margin-right:0px}
+.jconfirm.jconfirm-black .jconfirm-bg,.jconfirm.jconfirm-dark .jconfirm-bg{background-color:darkslategray;opacity:.4}
+.jconfirm.jconfirm-black .jconfirm-box,.jconfirm.jconfirm-dark .jconfirm-box{-webkit-box-shadow:0 2px 6px rgba(0,0,0,0.2);box-shadow:0 2px 6px rgba(0,0,0,0.2);background:#444;border-radius:5px;color:white}
+.jconfirm.jconfirm-black .jconfirm-box .jconfirm-title-c .jconfirm-icon-c,.jconfirm.jconfirm-dark .jconfirm-box .jconfirm-title-c .jconfirm-icon-c{margin-right:8px;margin-left:0px}
+.jconfirm.jconfirm-black .jconfirm-box .jconfirm-buttons,.jconfirm.jconfirm-dark .jconfirm-box .jconfirm-buttons{float:right}
+.jconfirm.jconfirm-black .jconfirm-box .jconfirm-buttons button,.jconfirm.jconfirm-dark .jconfirm-box .jconfirm-buttons button{border:none;background-image:none;text-transform:uppercase;font-size:14px;font-weight:bold;text-shadow:none;-webkit-transition:background .1s;transition:background .1s;color:white}
+.jconfirm.jconfirm-black .jconfirm-box .jconfirm-buttons button.btn-default,.jconfirm.jconfirm-dark .jconfirm-box .jconfirm-buttons button.btn-default{-webkit-box-shadow:none;box-shadow:none;color:#fff;background:none}
+.jconfirm.jconfirm-black .jconfirm-box .jconfirm-buttons button.btn-default:hover,.jconfirm.jconfirm-dark .jconfirm-box .jconfirm-buttons button.btn-default:hover{background:#666}
+@media screen and (min-width:768px){.jconfirm .jconfirm-box .jconfirm-buttons button.btn-cancel-login{color:#22272E;background:#FFF;border:1px solid #B8BFCA;text-shadow:none;-webkit-transition:background .2s;transition:background .2s;margin-top:-60px}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-cancel-login:hover{background-color:#FFE6DC;color:#000}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-confirm-login{color:#FFF;background:#E15621;border:1px solid #E15621;text-shadow:none;-webkit-transition:background .2s;transition:background .2s;margin-top:-60px}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-confirm-login:hover{opacity:.8}
+}@media screen and (max-width:768px){.jconfirm .jconfirm-box .jconfirm-buttons button.btn-confirm-login,.jconfirm .jconfirm-box .jconfirm-buttons button.btn-cancel-login{display:block;box-sizing:border-box;width:55.2vw;height:11.6vw;line-height:11.6vw;text-align:center;border-radius:5.8vw;margin:0 auto 5.4vw;padding:0}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-confirm-login{color:#FFF;background:#E15621;border:1px solid #E15621;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}
+.jconfirm .jconfirm-box .jconfirm-buttons button.btn-cancel-login{color:#22272E;background:#FFF;border:1px solid #B8BFCA;text-shadow:none;-webkit-transition:background .2s;transition:background .2s}
+}
+.jconfirm.jconfirm-black.jconfirm-rtl .jconfirm-title-c .jconfirm-icon-c,.jconfirm.jconfirm-dark.jconfirm-rtl .jconfirm-title-c .jconfirm-icon-c{margin-left:8px;margin-right:0px}
+.jconfirm .jconfirm-box.hilight.jconfirm-hilight-shake{-webkit-animation:shake 0.82s cubic-bezier(0.36,0.07,0.19,0.97) both;animation:shake 0.82s cubic-bezier(0.36,0.07,0.19,0.97) both;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
+.jconfirm .jconfirm-box.hilight.jconfirm-hilight-glow{-webkit-animation:glow 0.82s cubic-bezier(0.36,0.07,0.19,0.97) both;animation:glow 0.82s cubic-bezier(0.36,0.07,0.19,0.97) both;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
+@-webkit-keyframes shake{10%,90%{-webkit-transform:translate3d(-2px,0,0);transform:translate3d(-2px,0,0)}20%,80%{-webkit-transform:translate3d(4px,0,0);transform:translate3d(4px,0,0)}30%,50%,70%{-webkit-transform:translate3d(-8px,0,0);transform:translate3d(-8px,0,0)}40%,60%{-webkit-transform:translate3d(8px,0,0);transform:translate3d(8px,0,0)}}
+@keyframes shake{10%,90%{-webkit-transform:translate3d(-2px,0,0);transform:translate3d(-2px,0,0)}20%,80%{-webkit-transform:translate3d(4px,0,0);transform:translate3d(4px,0,0)}30%,50%,70%{-webkit-transform:translate3d(-8px,0,0);transform:translate3d(-8px,0,0)}40%,60%{-webkit-transform:translate3d(8px,0,0);transform:translate3d(8px,0,0)}}
+@-webkit-keyframes glow{0%,100%{-webkit-box-shadow:0 0 0px red;box-shadow:0 0 0px red}50%{-webkit-box-shadow:0 0 30px red;box-shadow:0 0 30px red}}
+@keyframes glow{0%,100%{-webkit-box-shadow:0 0 0px red;box-shadow:0 0 0px red}50%{-webkit-box-shadow:0 0 30px red;box-shadow:0 0 30px red}}
+.jconfirm{-webkit-perspective:400px;perspective:400px}
+.jconfirm .jconfirm-box{opacity:1;-webkit-transition-property:all;transition-property:all}
+.jconfirm .jconfirm-box.jconfirm-animation-top,.jconfirm .jconfirm-box.jconfirm-animation-left,.jconfirm .jconfirm-box.jconfirm-animation-right,.jconfirm .jconfirm-box.jconfirm-animation-bottom,.jconfirm .jconfirm-box.jconfirm-animation-opacity,.jconfirm .jconfirm-box.jconfirm-animation-zoom,.jconfirm .jconfirm-box.jconfirm-animation-scale,.jconfirm .jconfirm-box.jconfirm-animation-none,.jconfirm .jconfirm-box.jconfirm-animation-rotate,.jconfirm .jconfirm-box.jconfirm-animation-rotatex,.jconfirm .jconfirm-box.jconfirm-animation-rotatey,.jconfirm .jconfirm-box.jconfirm-animation-scaley,.jconfirm .jconfirm-box.jconfirm-animation-scalex{opacity:0}
+.jconfirm .jconfirm-box.jconfirm-animation-rotate{-webkit-transform:rotate(90deg);transform:rotate(90deg)}
+.jconfirm .jconfirm-box.jconfirm-animation-rotatex{-webkit-transform:rotateX(90deg);transform:rotateX(90deg);-webkit-transform-origin:center;transform-origin:center}
+.jconfirm .jconfirm-box.jconfirm-animation-rotatexr{-webkit-transform:rotateX(-90deg);transform:rotateX(-90deg);-webkit-transform-origin:center;transform-origin:center}
+.jconfirm .jconfirm-box.jconfirm-animation-rotatey{-webkit-transform:rotatey(90deg);transform:rotatey(90deg);-webkit-transform-origin:center;transform-origin:center}
+.jconfirm .jconfirm-box.jconfirm-animation-rotateyr{-webkit-transform:rotatey(-90deg);transform:rotatey(-90deg);-webkit-transform-origin:center;transform-origin:center}
+.jconfirm .jconfirm-box.jconfirm-animation-scaley{-webkit-transform:scaley(1.5);transform:scaley(1.5);-webkit-transform-origin:center;transform-origin:center}
+.jconfirm .jconfirm-box.jconfirm-animation-scalex{-webkit-transform:scalex(1.5);transform:scalex(1.5);-webkit-transform-origin:center;transform-origin:center}
+.jconfirm .jconfirm-box.jconfirm-animation-top{-webkit-transform:translate(0px,-100px);transform:translate(0px,-100px)}
+.jconfirm .jconfirm-box.jconfirm-animation-left{-webkit-transform:translate(-100px,0px);transform:translate(-100px,0px)}
+.jconfirm .jconfirm-box.jconfirm-animation-right{-webkit-transform:translate(100px,0px);transform:translate(100px,0px)}
+.jconfirm .jconfirm-box.jconfirm-animation-bottom{-webkit-transform:translate(0px,100px);transform:translate(0px,100px)}
+.jconfirm .jconfirm-box.jconfirm-animation-zoom{-webkit-transform:scale(1.2);transform:scale(1.2)}
+.jconfirm .jconfirm-box.jconfirm-animation-scale{-webkit-transform:scale(0.5);transform:scale(0.5)}
+.jconfirm .jconfirm-box.jconfirm-animation-none{visibility:hidden}
+.jconfirm.jconfirm-supervan .jconfirm-bg{background-color:rgba(54,70,93,0.95)}
+.jconfirm.jconfirm-supervan .jconfirm-box{background-color:transparent}
+.jconfirm.jconfirm-supervan .jconfirm-box.jconfirm-type-blue{border:none}
+.jconfirm.jconfirm-supervan .jconfirm-box.jconfirm-type-green{border:none}
+.jconfirm.jconfirm-supervan .jconfirm-box.jconfirm-type-red{border:none}
+.jconfirm.jconfirm-supervan .jconfirm-box.jconfirm-type-orange{border:none}
+.jconfirm.jconfirm-supervan .jconfirm-box.jconfirm-type-purple{border:none}
+.jconfirm.jconfirm-supervan .jconfirm-box.jconfirm-type-dark{border:none}
+.jconfirm.jconfirm-supervan .jconfirm-box div.jconfirm-closeIcon{color:white}
+.jconfirm.jconfirm-supervan .jconfirm-box div.jconfirm-title-c{text-align:center;color:white;font-size:28px;font-weight:normal}
+.jconfirm.jconfirm-supervan .jconfirm-box div.jconfirm-title-c > *{padding-bottom:25px}
+.jconfirm.jconfirm-supervan .jconfirm-box div.jconfirm-title-c .jconfirm-icon-c{margin-right:8px;margin-left:0px}
+.jconfirm.jconfirm-supervan .jconfirm-box div.jconfirm-content-pane{margin-bottom:25px}
+.jconfirm.jconfirm-supervan .jconfirm-box div.jconfirm-content{text-align:center;color:white}
+.jconfirm.jconfirm-supervan .jconfirm-box .jconfirm-buttons{text-align:center}
+.jconfirm.jconfirm-supervan .jconfirm-box .jconfirm-buttons button{font-size:16px;border-radius:2px;background:#303f53;text-shadow:none;border:none;color:white;padding:10px;min-width:100px}
+.jconfirm.jconfirm-supervan.jconfirm-rtl .jconfirm-box div.jconfirm-title-c .jconfirm-icon-c{margin-left:8px;margin-right:0px}
+.jconfirm.jconfirm-material .jconfirm-bg{background-color:rgba(0,0,0,0.67)}
+.jconfirm.jconfirm-material .jconfirm-box{background-color:white;-webkit-box-shadow:0 7px 8px -4px rgba(0,0,0,0.2),0 13px 19px 2px rgba(0,0,0,0.14),0 5px 24px 4px rgba(0,0,0,0.12);box-shadow:0 7px 8px -4px rgba(0,0,0,0.2),0 13px 19px 2px rgba(0,0,0,0.14),0 5px 24px 4px rgba(0,0,0,0.12);padding:30px 25px 10px 25px}
+.jconfirm.jconfirm-material .jconfirm-box .jconfirm-title-c .jconfirm-icon-c{margin-right:8px;margin-left:0px}
+.jconfirm.jconfirm-material .jconfirm-box div.jconfirm-closeIcon{color:rgba(0,0,0,0.87)}
+.jconfirm.jconfirm-material .jconfirm-box div.jconfirm-title-c{color:rgba(0,0,0,0.87);font-size:22px;font-weight:bold}
+.jconfirm.jconfirm-material .jconfirm-box div.jconfirm-content{color:rgba(0,0,0,0.87)}
+.jconfirm.jconfirm-material .jconfirm-box .jconfirm-buttons{text-align:right}
+.jconfirm.jconfirm-material .jconfirm-box .jconfirm-buttons button{text-transform:uppercase;font-weight:500}
+.jconfirm.jconfirm-material.jconfirm-rtl .jconfirm-title-c .jconfirm-icon-c{margin-left:8px;margin-right:0px}
+.jconfirm.jconfirm-bootstrap .jconfirm-bg{background-color:rgba(0,0,0,0.21)}
+.jconfirm.jconfirm-bootstrap .jconfirm-box{background-color:white;-webkit-box-shadow:0 3px 8px 0px rgba(0,0,0,0.2);box-shadow:0 3px 8px 0px rgba(0,0,0,0.2);border:solid 1px rgba(0,0,0,0.4);padding:15px 0 0}
+.jconfirm.jconfirm-bootstrap .jconfirm-box .jconfirm-title-c .jconfirm-icon-c{margin-right:8px;margin-left:0px}
+.jconfirm.jconfirm-bootstrap .jconfirm-box div.jconfirm-closeIcon{color:rgba(0,0,0,0.87)}
+.jconfirm.jconfirm-bootstrap .jconfirm-box div.jconfirm-title-c{color:rgba(0,0,0,0.87);font-size:22px;font-weight:bold;padding-left:15px;padding-right:15px}
+.jconfirm.jconfirm-bootstrap .jconfirm-box div.jconfirm-content{color:rgba(0,0,0,0.87);padding:0px 15px}
+.jconfirm.jconfirm-bootstrap .jconfirm-box .jconfirm-buttons{text-align:right;padding:10px;margin:-5px 0 0px;border-top:solid 1px #ddd;overflow:hidden;border-radius:0 0 4px 4px}
+.jconfirm.jconfirm-bootstrap .jconfirm-box .jconfirm-buttons button{font-weight:500}
+.jconfirm.jconfirm-bootstrap.jconfirm-rtl .jconfirm-title-c .jconfirm-icon-c{margin-left:8px;margin-right:0px}
+.jconfirm.jconfirm-modern .jconfirm-bg{background-color:slategray;opacity:.6}
+.jconfirm.jconfirm-modern .jconfirm-box{background-color:white;-webkit-box-shadow:0 7px 8px -4px rgba(0,0,0,0.2),0 13px 19px 2px rgba(0,0,0,0.14),0 5px 24px 4px rgba(0,0,0,0.12);box-shadow:0 7px 8px -4px rgba(0,0,0,0.2),0 13px 19px 2px rgba(0,0,0,0.14),0 5px 24px 4px rgba(0,0,0,0.12);padding:30px 30px 15px}
+.jconfirm.jconfirm-modern .jconfirm-box div.jconfirm-closeIcon{color:rgba(0,0,0,0.87);top:15px;right:15px}
+.jconfirm.jconfirm-modern .jconfirm-box div.jconfirm-title-c{color:rgba(0,0,0,0.87);font-size:24px;font-weight:bold;text-align:center;margin-bottom:10px}
+.jconfirm.jconfirm-modern .jconfirm-box div.jconfirm-title-c .jconfirm-icon-c{-webkit-transition:-webkit-transform .5s;transition:-webkit-transform .5s;transition:transform .5s;transition:transform .5s,-webkit-transform .5s;-webkit-transform:scale(0);transform:scale(0);display:block;margin-right:0px;margin-left:0px;margin-bottom:10px;font-size:69px;color:#aaa}
+.jconfirm.jconfirm-modern .jconfirm-box div.jconfirm-content{text-align:center;font-size:15px;color:#777;margin-bottom:25px}
+.jconfirm.jconfirm-modern .jconfirm-box .jconfirm-buttons{text-align:center}
+.jconfirm.jconfirm-modern .jconfirm-box .jconfirm-buttons button{font-weight:bold;text-transform:uppercase;-webkit-transition:background .1s;transition:background .1s;padding:10px 20px}
+.jconfirm.jconfirm-modern .jconfirm-box .jconfirm-buttons button + button{margin-left:4px}
+.jconfirm.jconfirm-modern.jconfirm-open .jconfirm-box .jconfirm-title-c .jconfirm-icon-c{-webkit-transform:scale(1);transform:scale(1)}

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

@@ -1,5 +1,6 @@
 <script charset="utf-8" type="text/javascript" src="/lib/jquery-3.5.1.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" src="/lib/swiper.min.js"></script>
+<script charset="utf-8" type="text/javascript" src="/lib/jquery-confirm.min.js"></script>
 <script charset="utf-8" type="text/javascript" src="/lib/vue2.6.11.min.js"></script>
 <script charset="utf-8" type="text/javascript" th:src="@{/js/base.js(v=${version})}"></script>

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

@@ -73,28 +73,4 @@
             <span class="toTop icon mIcon">置顶</span>
         </div>
     </div>
-    <div class="baseAlert mFixed loginAlert">
-        <div class="box">
-            <div class="hd">提示<em class="close"></em></div>
-            <div class="bd">
-                <span>你还未登录</span>
-                <span>请登录后再进行购买</span>
-            </div>
-            <div class="btn">
-                <a href="javascript:void(0);"><em class="confirm">去登录</em></a>
-                <em class="cancel">取消</em>
-            </div>
-        </div>
-    </div>
-    <div class="baseAlert mFixed">
-        <div class="box">
-            <div class="hd"><span class="title">提示</span><em class="close"></em></div>
-            <div class="bd content">提示信息</div>
-            <div class="btn">
-                <em class="confirm">确定</em>
-                <em class="cancel">关闭</em>
-            </div>
-        </div>
-    </div>
-
 </footer>

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

@@ -7,6 +7,7 @@
     <meta http-equiv="description" content="采美365网——中国美业互联网共享经济平台，中国美业较大的光电美容干货信息平台，提供美容专业线客装产品、美容院消耗品、专业线院装产品、光电美容仪器、光电美容项目交易，同时提供采美公益大讲堂、光电美容干货、光电美容资讯、美业动态等行业信息。采集梦想，美启未来。">
     <link rel="shortcut icon" href="/img/favicon.ico" type="image/x-icon">
     <link href="/lib/swiper.min.css" media="screen and (max-width:768px)" rel="stylesheet" type="text/css">
+    <link href="/lib/jquery-confirm.min.css" rel="stylesheet" type="text/css">
     <link th:href="@{/css/base/init.css(v=${version})}" rel="stylesheet" type="text/css">
     <link th:href="@{/css/base/base.h5.css(v=${version})}" media="screen and (max-width:768px)" rel="stylesheet" type="text/css">
     <link th:href="@{/css/base/base.pc.css(v=${version})}" media="screen and (min-width:768px)" rel="stylesheet" type="text/css">

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

@@ -47,8 +47,8 @@
                 <div class="search">
                     <div class="jqSelect">
                         <div class="pc">
-                            <span data-select="1">供应商</span>
-                            <ul><li data-id="1">供应商</li></ul>
+                            <span data-select="0">产品</span>
+                            <ul><li data-id="0">产品</li></ul>
                         </div>
                         <select>
                             <option value="0">产品</option>