add:watchlist加入鼠标划过事件v1

src/main/java/top/lvzhiqiang/controller/CoinController.java

@@ -114,6 +114,12 @@ public class CoinController {
         return R.ok().data(coinService.watchlistUpdate(symbol, remark));
     }
 
+    @GetMapping("/mainSearchDetail/{nameEn}/{id}")
+    public Object mainSearchDetail(@PathVariable String nameEn, @PathVariable String id) {
+
+        return coinService.mainSearchDetail(nameEn, id);
+    }
+
     /**
      * 上传图片
      *

src/main/java/top/lvzhiqiang/service/CoinService.java

@@ -50,4 +50,6 @@ public interface CoinService {
     void syncCoinmarketcapCMap();
 
     Map<String, JSONObject> getMonitorJobConfig();
+
+    Object mainSearchDetail(String nameEn, String id);
 }

src/main/java/top/lvzhiqiang/service/impl/CoinServiceImpl.java

@@ -1370,10 +1370,12 @@ public class CoinServiceImpl implements CoinService {
     }
 
     private void renderMainSearch4Image(List<FileImage> fileImageList) {
-        String ftpBaseurl = InitRunner.dicCodeMap.get("ftp_baseurl").getCodeValue();
+        // String ftpBaseurl = InitRunner.dicCodeMap.get("ftp_baseurl").getCodeValue();
         for (FileImage fileImage : fileImageList) {
-            String newPath = "<a target=\"_blank\" href=\" " + ftpBaseurl + fileImage.getPath() + "\">" + fileImage.getNewName() + "</a>";
-            fileImage.setNewName(newPath);
+            // String newPath = "<a target=\"_blank\" href=\" " + ftpBaseurl + fileImage.getPath() + "\">" + fileImage.getNewName() + "</a>";
+            // fileImage.setNewName(newPath);
+
+            fileImage.setOldName("<span class=\"primary\" avid=\"" + fileImage.getId() + " \" >" + fileImage.getOldName() + " </span>");
         }
     }
 
@@ -1403,6 +1405,8 @@ public class CoinServiceImpl implements CoinService {
                     divide = divide.divide(bigDecimal10000, 4, RoundingMode.HALF_UP);
                     coinWatchlist.setTotalMarketValueStr(divide + "亿");
                 }
+
+                coinWatchlist.setTotalMarketValueStr("<span class=\"primary\" avid=\"" + coinWatchlist.getSymbol() + "\" >" + coinWatchlist.getTotalMarketValueStr() + " </span>");
             }
 
             // 赛道分类
@@ -1876,4 +1880,22 @@ public class CoinServiceImpl implements CoinService {
             }
         }
     }
+
+    @Override
+    public Object mainSearchDetail(String nameEn, String id) {
+        if ("image".equals(nameEn)) {
+            FileImage fileImage = coinMapper.findFileImageById(Long.valueOf(id));
+
+            String ftpBaseurl = InitRunner.dicCodeMap.get("ftp_baseurl").getCodeValue();
+            fileImage.setPath(ftpBaseurl + fileImage.getPath());
+            return fileImage;
+        } else if ("watchlist".equals(nameEn)) {
+            CoinWatchlist coinWatchlist = coinMapper.findWatchlistBySymbol(id);
+            coinWatchlist.setRemark(MarkdownToHtmlUtils.markdownToHtmlExtensions(coinWatchlist.getRemark()));
+
+            return coinWatchlist;
+        }
+
+        return null;
+    }
 }

src/main/resources/static/css/my-av.css

@@ -129,7 +129,7 @@ avdiverror avdiv {
     transition: 0.2s;
 }
 
-avdiv .avimg {
+avdiv .avimg, avdivsinfo img {
     height: 400px;
     max-width: 100%;
     max-height: 500px;
@@ -151,6 +151,14 @@ avdiv .imageBig {
     border-left: 2px solid #fff;
     box-shadow: -2px -2px 4px rgb(160 160 160), 4px 4px 4px rgb(70 70 70 / 60%);
 }
+avdiv .imageBigClick {
+    max-height: 600px;
+    transform: scale(2);
+    border-radius: 10px;
+    border-top: 2px solid #fff;
+    border-left: 2px solid #fff;
+    box-shadow: -2px -2px 4px rgb(160 160 160), 4px 4px 4px rgb(70 70 70 / 60%);
+}
 
 avdiv .imageBig:hover {
     box-shadow: -4px -4px 8px rgb(160 160 160), 6px 6px 8px rgb(70 70 70 / 60%);

src/main/resources/static/js/my-av.js

@@ -6,7 +6,7 @@ var avInfo = {};    // 临时存储相关信息
 var Imgscall = 1.0; // 图片默认放大倍数, 在图片上滚动鼠标滚轮使用。
 
 // 鼠标经过番号
-function savIDMouseEnter(e) {
+function savIDMouseEnter(e, nameEn) {
     // 进入番号, 如果之前存在菜单, 就判断是否是现在番号的菜单, 如果是, 退出; 否则删掉菜单, 重新获取
     if (divTarget && $(e).attr('href') == $(divTarget).attr('href')) {
         clearTimeout(timerMouseLeaveMenu);
@@ -24,7 +24,7 @@ function savIDMouseEnter(e) {
     clearTimeout(timerMouseLeave);
     clearTimeout(timerGetInfo);
 
-    avmouseenter($(e));
+    avmouseenter($(e), nameEn);
 }
 
 // 鼠标离开番号
@@ -67,13 +67,13 @@ function savMenuMouseLeave(e) {
 }
 
 // 鼠标滑过 显示菜单
-function avmouseenter(e) {
+function avmouseenter(e, nameEn) {
     if (document.querySelector(".sav-menu")) {
         return; // 防止出现菜单后重复触发, 尤其是margin上移两像素后
     }
 
     // 创建搜索基本菜单(搜索按钮)
-    var odiv = createPattenr($(e));
+    var odiv = createPattenr($(e), nameEn);
 
     // 信息加载时的动画
     addLoading(odiv);
@@ -91,7 +91,7 @@ function avmouseenter(e) {
     odiv.style.width = "650px";
 
     timerGetInfo = setTimeout(() => {
-        getInfo($(e));
+        getInfo($(e), nameEn);
     }, 300);
 
     var otherInfo = document.createElement('avdivsInfo');
@@ -102,51 +102,101 @@ function avmouseenter(e) {
 }
 
 // 获取番号相关的信息, 添加图片,调用其他函数添加信息
-function getInfo(e, oFirstBrowse) {
-    noReferrer();   // 针对防盗链问题
-    javbusloading();
-
-    // 将获取到的信息进行展示和保存
-    var otherInfo = document.querySelector("avdivsInfo");
-    if (!otherInfo) {
-        otherInfo = document.createElement('avdivsInfo');
-    }
-    otherInfo.innerHTML = addOtherInfo($(e));
+function getInfo(e, nameEn) {
+    var id = $(e).attr("avid");
+    $.ajax({
+        url: "coin/mainSearchDetail/"+ nameEn + "/" + id, //请求的url地址
+        dataType: "json", //返回格式为json
+        type: "get", //请求方式
+        async: false, //请求是否异步，默认为异步，这也是ajax重要特性
+        success: function (data) {
+            noReferrer();   // 针对防盗链问题
+            javbusloading();
+
+            //请求成功时处理
+            if (data != null && $.trim(data) != "" && data.success) {
+                console.log("insertOrUpdateWatchlist-submit success data");
+                if ('image' === nameEn){
+                    // 将获取到的信息进行展示和保存
+                    var otherInfo = document.querySelector("avdivsInfo");
+                    if (!otherInfo) {
+                        otherInfo = document.createElement('avdivsInfo');
+                    }
+                    otherInfo.innerHTML = addOtherInfo($(e));
+
+                    let imgDiv = document.createElement("avdivimg");
+                    let image = document.createElement("img");
+                    image.src = data.data.path;
+                    image.classList.add("avimg");
+                    image.setAttribute("referrerpolicy", "no-referrer");
+                    imgDiv.appendChild(image);
+                    otherInfo.appendChild(imgDiv);
+
+                    image.onload = function () {
+                        console.log("insertOrUpdateWatchlist-image onload，", image.src);
+                        removeLoading();
+                        settingPostion();
+                    }
+                    image.onerror = () => {
+                        console.log("insertOrUpdateWatchlist-image onerror，", image.src);
+                        if (avInfo.imgSrc2) {
+                            image.src = avInfo.imgSrc2;
+                            localInfo[avID].image = avInfo.imgSrc2;
+                            GM_setValue("avInfo2", localInfo);
+                        } else {
+                            image.classList.add('savImgError');
+                            image.src = imgErrorSVG;
+                        }
+                        settingPostion();
+                    }
+                }else if ('watchlist' === nameEn){
+                    // 将获取到的信息进行展示和保存
+                    var otherInfo = document.querySelector("avdivsInfo");
+                    if (!otherInfo) {
+                        otherInfo = document.createElement('avdivsInfo');
+                    }
 
-    let imgDiv = document.createElement("avdivimg");
-    let image = document.createElement("img");
-    image.src = $(e).attr('href');
-    image.classList.add("avimg");
-    image.setAttribute("referrerpolicy", "no-referrer");
-    imgDiv.appendChild(image);
-    otherInfo.appendChild(imgDiv);
+                    otherInfo.style.overflow = "auto";
+                    otherInfo.style.maxHeight = "550px";
+                    otherInfo.style.textIndent = "0em";
+                    otherInfo.innerHTML = data.data.remark;
 
-    image.onload = function () {
-        removeLoading();
-        settingPostion();
-    }
-    image.onerror = () => {
-        if (avInfo.imgSrc2) {
-            image.src = avInfo.imgSrc2;
-            localInfo[avID].image = avInfo.imgSrc2;
-            GM_setValue("avInfo2", localInfo);
-        } else {
-            image.classList.add('savImgError');
-            image.src = imgErrorSVG;
+                    removeLoading();
+                    settingPostion();
+                }
+            } else {
+                console.log("insertOrUpdateWatchlist-submit success empty，", data);
+            }
+        },
+        beforeSend: function () {
+        },
+        complete: function () {
+        },
+        error: function (data) {
+            //请求出错处理
+            console.log("insertOrUpdateWatchlist-submit error，" + data);
         }
-    }
-    settingPostion();
-
-    // document.querySelector(".sav-menu").appendChild(otherInfo);
+    });
 }
 
 // 创建搜索基本菜单(搜索按钮)
-function createPattenr(e, id_wuma) {
+function createPattenr(e, nameEn) {
     var odiv = document.createElement("avdiv");
     odiv.classList.add("sav-menu");
 
     let aPattern = "<avdivbutton>";
-    aPattern += "<avdiv class='savlink'><a href='" + $(e).attr('href') + "' target='_blank' referrerpolicy='same-origin'>原图</a></avdiv>";
+
+    if ('image' === nameEn) {
+        aPattern += "<avdiv class='savlink'><a href='" + $(e).attr('href') + "' target='_blank' referrerpolicy='same-origin'>原图</a></avdiv>";
+    } else if ('watchlist' === nameEn) {
+        aPattern += "<avdiv class='savlink'><a href='" + $(e).attr('href') + "' target='_blank' referrerpolicy='same-origin'>非小号</a></avdiv>";
+        aPattern += "<avdiv class='savlink'><a href='" + $(e).attr('href') + "' target='_blank' referrerpolicy='same-origin'>CoinMarketCap</a></avdiv>";
+        aPattern += "<avdiv class='savlink'><a href='" + $(e).attr('href') + "' target='_blank' referrerpolicy='same-origin'>CoinGecko</a></avdiv>";
+
+        // odiv.style.overflow = "auto";
+        // odiv.style.maxHeight = "550px";
+    }
+
     aPattern += "</avdivbutton>";
 
     odiv.addEventListener("mouseenter", savMenuMouseEnter);
@@ -175,7 +225,7 @@ function noReferrer() {
 function javbusloading() {
     var stop2 = document.querySelector(".stop2");
     if (stop2) {
-        stop2.classList.toggle("javbusloading")
+        stop2.classList.toggle("javbusloading");
     }
 }
 
@@ -257,19 +307,19 @@ function savMenuClick(e) {
 
     // 图片放大缩小
     if (e.target.tagName == "IMG") {
-        if (e.target.classList.contains("imageBig")) {
-            e.target.classList.remove("imageBig");
-            Imgscall = 1.0
+        if (e.target.classList.contains("imageBigClick")) {
+            e.target.classList.remove("imageBigClick");
+            Imgscall = 1.0;
             e.target.style = "";
         } else {
-            Imgscall = 1.3  // 重置大小
-            e.target.classList.add("imageBig");
+            Imgscall = 1.3;  // 重置大小
+            e.target.classList.add("imageBigClick");
         }
     } else {
         var oImg = document.querySelector(".sav-menu").querySelector("img");
         if (oImg) {
             oImg.classList.remove("imageBig");
-            Imgscall = 1.0
+            Imgscall = 1.0;
             oImg.style = "";
         }
     }

src/main/resources/static/js/my-coin.js

@@ -570,16 +570,16 @@ function initContentEvent(nameEn) {
                 }
             });
         });
-
-        // 鼠标滑过 开启菜单
-        $("tbody.contentTD").find("a").mouseenter(function () {
-            savIDMouseEnter($(this));
-        });
-        // 鼠标离开 关闭菜单
-        $("tbody.contentTD").find("a").mouseleave(function () {
-            savIDMouseLeave($(this));
-        });
     }
+
+    // 鼠标滑过 开启菜单
+    $(".primary").mouseenter(function () {
+        savIDMouseEnter($(this), nameEn);
+    });
+    // 鼠标离开 关闭菜单
+    $(".primary").mouseleave(function () {
+        savIDMouseLeave($(this), nameEn);
+    });
 }
 
 function uploadImgsSubmit(){