feat:导出功能完成

bookMarkService/business/bookmark/src/main/java/com/fanxb/bookmark/business/bookmark/service/impl/BookmarkServiceImpl.java

@@ -71,15 +71,15 @@ public class BookmarkServiceImpl implements BookmarkService {
         int count = 0;
         List<Bookmark> bookmarks = new ArrayList<>();
         for (int i = 0, length = elements.size(); i < length; i++) {
-            if (i == 0) {
+//            if (i == 0) {
-                Elements firstChildren = elements.get(0).child(1).children();
+//                Elements firstChildren = elements.get(0).child(0).children();
-                count = firstChildren.size();
+//                count = firstChildren.size();
-                for (int j = 0; j < count; j++) {
+//                for (int j = 0; j < count; j++) {
-                    dealBookmark(userId, firstChildren.get(j), path, sortBase + j, bookmarks);
+//                    dealBookmark(userId, firstChildren.get(j), path, sortBase + j, bookmarks);
-                }
+//                }
-            } else {
+//            } else {
-                dealBookmark(userId, elements.get(i), path, sortBase + count + i - 1, bookmarks);
+                dealBookmark(userId, elements.get(i), path, sortBase+i , bookmarks);
-            }
+//            }
         }
         //每一千条处理插入一次
         List<Bookmark> tempList = new ArrayList<>(1000);

bookmark_front/package.json

@@ -14,6 +14,7 @@
     "clipboard": "^2.0.6",
     "core-js": "^3.6.5",
     "localforage": "^1.7.4",
+    "moment": "^2.29.1",
     "vue": "^2.6.11",
     "vue-router": "^3.2.0",
     "vuex": "^3.4.0"

bookmark_front/src/util/FileUtil.js

@@ -0,0 +1,17 @@
+export function downloadFile(fileName, content) {
+  debugger;
+  // 定义触发事件的DOM
+  var aLink = document.createElement("a");
+  // 定义BLOB对象，生成文件内容
+  var blob = new Blob([content], { type: "text/html" });
+  // 定义事件对象
+  var evt = document.createEvent("MouseEvents");
+  // 初始化事件
+  evt.initMouseEvent("click", true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
+  // 定义下载文件名称
+  aLink.download = fileName;
+  // 根据上面定义的 BLOB 对象创建文件 dataURL
+  aLink.href = URL.createObjectURL(blob);
+  // 应用事件，触发下载
+  aLink.dispatchEvent(evt);
+}

bookmark_front/src/views/main/pages/things/BookmarkManage.vue

@@ -4,6 +4,7 @@
       <search :showActions="true" @location="location" />
     </div>
     <div class="actions">
+      <div class="left">
         <span class="myBookmark">我的书签</span>
         <a-tooltip title="刷新书签缓存">
           <a-button @click="refresh(true)" type="primary" shape="circle" icon="sync" />
@@ -29,6 +30,12 @@
           </a-tooltip>
         </a-popconfirm>
       </div>
+      <div>
+        <a-tooltip title="导出书签">
+          <a-button @click="exportBookmark" type="primary" shape="circle" icon="export" />
+        </a-tooltip>
+      </div>
+    </div>
     <a-empty v-if="treeData.length == 0" description="无数据，点击上方 + 新增"></a-empty>
     <a-tree v-else :tree-data="treeData" :loaded-keys="loadedKeys" :selected-keys="currentSelect ? [currentSelect.bookmarkId] : []" :load-data="loadData" :checked-keys="checkedKeys" :replace-fields="replaceFields" :expandedKeys="expandedKeys" @select="select" @expand="expand" @check="check" blockNode :checkable="mulSelect" checkStrictly :draggable="!isPhone" @drop="onDrop">
       <a-dropdown :trigger="['contextmenu']" slot="nodeTitle" slot-scope="rec">
@@ -61,7 +68,9 @@ import AddBookmark from "../../../../components/main/things/AddBookmark.vue";
 import Search from "../../../../components/main/Search.vue";
 import HttpUtil from "../../../../util/HttpUtil.js";
 import { mapState, mapActions } from "vuex";
+import { downloadFile } from "../../../../util/FileUtil";
 import ClipboardJS from "clipboard";
+import moment from "moment";
 export default {
   name: "BookmarkManage",
   components: { AddBookmark, Search },
@@ -336,6 +345,52 @@ export default {
         this.editData();
       }
     },
+    /**
+     * 书签文件导出
+     */
+    exportBookmark() {
+      let map = this.totalTreeData;
+      let root = document.createElement("DL");
+      this.dealList(root, map[""], map);
+      let content =
+        `<!DOCTYPE NETSCAPE-Bookmark-file-1>
+<!-- This is an automatically generated file.
+     It will be read and overwritten.
+     DO NOT EDIT! -->
+<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8">
+<TITLE>Bookmarks</TITLE>
+<H1>签签世界导出</H1>` + root.outerHTML;
+      downloadFile(moment().format("YYYY-MM-DD") + "导出书签.html", content);
+    },
+    dealList(root, list, totalMap) {
+      if (!list || list.length == undefined) {
+        return;
+      }
+      list.forEach((item) => {
+        let node = document.createElement("DT");
+        root.appendChild(node);
+        if (item.type === 0) {
+          //说明为书签
+          let url = document.createElement("A");
+          url.setAttribute("HREF", item.url);
+          url.setAttribute("ADD_DATE", parseInt(Date.now() / 1000));
+          url.innerText = item.name;
+          if (item.icon.length > 0) {
+            url.setAttribute("ICON", item.icon);
+          }
+          node.appendChild(url);
+        } else {
+          //说明为文件夹
+          let header = document.createElement("H3");
+          header.setAttribute("ADD_DATE", parseInt(Date.now() / 1000));
+          header.innerText = item.name;
+          node.appendChild(header);
+          let children = document.createElement("DL");
+          node.appendChild(children);
+          this.dealList(children, totalMap[item.path + "." + item.bookmarkId], totalMap);
+        }
+      });
+    },
   },
 };
 </script>
@@ -347,6 +402,12 @@ export default {
   height: 0.42rem;
   display: flex;
   align-items: center;
+  justify-content: space-between;
+
+  .left {
+    display: flex;
+    justify-items: center;
+  }
 }
 .myBookmark {
   font-size: 0.25rem;