feat: copy note to clipboard

src/content-scripts/renderer/popup/note-book/note-list.vue

@@ -97,6 +97,7 @@ export default defineComponent({
         createTime: dayjs().unix(),
         updateTime: dayjs().unix(),
         link: removeUrlPostfix(window.location.href),
+        linkTitle: window.document.title ?? '',
         content: text,
         rects: rects,
         tags: [],

src/content-scripts/renderer/popup/note-book/note.vue

@@ -65,9 +65,9 @@ import { inject, ref, computed, nextTick, PropType } from "vue";
 import randomcolor from "randomcolor";
 import dayjs from "dayjs";
 import { ElMessage } from "element-plus";
-
 import { QuillEditor, Delta } from "@vueup/vue-quill";
 import "@vueup/vue-quill/dist/vue-quill.snow.css";
+import { toClipboard } from "@soerenmartius/vue3-clipboard"
 
 import { Note } from "@/types/note";
 import { Tag } from "@/types/tag";
@@ -133,6 +133,17 @@ export default {
         },
         isConfirm: true,
       },
+      {
+        title: "Copy to clipboard",
+        onClick: () => {
+          const { link = '', linkTitle = '', content = '', tags = [] } : Note = props.note;
+          const text = `[${linkTitle || 'unknowned'}](${link})
+        - ${content}
+        ${tags.join(',')}`;
+          toClipboard(text);
+          ElMessage.success("Copied");
+        }
+      }
     ]);
 
     /// note tags

src/types/note.ts

@@ -6,6 +6,7 @@ export interface Note {
   createTime: number;
   updateTime: number;
   link: string;
+  linkTitle: string;
   content: string;
   tags: string[];
   rects: Rect[];

todo.md

@@ -1,7 +1,7 @@
 - [ ] export/import notes' data by json
   - [x] export
   - [x] import
-- [ ] expand the notes(classify by tag)
+- [x] expand the notes(classify by tag)
 - [ ] more precise rects selection rather than coor (select the real dom by text)
 - [ ] screenshot features
   - https://javascript.plainenglish.io/a-better-alternative-to-html2canvas-in-vuejs-3-e0686755d56e