feat:添加@快捷工具

src/App.vue

@@ -5,7 +5,7 @@
   >
     <markdown-header
       :id="textareaId"
-      :ref="'md_header' + id"
+      :ref="'md_header_' + id"
       :text.sync="text"
       :selectionInfo.sync="selectionInfo"
       :showPreview.sync="showPreview"
@@ -63,9 +63,9 @@
       :show-help="showHelp"
       :formatType="formatType"
       :userList="userList"
-      :ref="'md_textarea' + id"
+      :ref="'md_textarea_' + id"
       :renderLinks="renderLinks"
-      @tab="$refs['md_header' + id].tab()"
+      @tab="$refs['md_header_' + id].tab()"
       @submit="submit"
       @enter="handleEnter"
       @getFilteredTags="filteredTags = $event"
@@ -213,7 +213,7 @@ export default {
       return "textarea_" + this.id;
     },
     headId() {
-      return "md_header" + this.id;
+      return "md_header_" + this.id;
     },
     textareaHeight() {
       const height = this.height;
@@ -235,12 +235,12 @@ export default {
           _this.text = newText;
           _this.$refs.mdUploadFile.value = "";
           _this.uploadImgPercent = 100;
-          _this.$refs["md_textarea" + _this.id].waiting = false;
+          _this.$refs["md_textarea_" + _this.id].waiting = false;
         } else {
-          _this.$refs["md_textarea" + _this.id].waiting = true;
+          _this.$refs["md_textarea_" + _this.id].waiting = true;
           _this.uploadImgPercent = parseInt(url);
         }
-        _this.$refs["md_header" + _this.id].loading(
+        _this.$refs["md_header_" + _this.id].loading(
           "img",
           _this.uploadImgPercent
         );
@@ -279,7 +279,7 @@ export default {
         } else {
           _this.uploadVideoPercent = parseInt(url);
         }
-        _this.$refs["md_header" + _this.id].loading(
+        _this.$refs["md_header_" + _this.id].loading(
           "video",
           _this.uploadVideoPercent
         );

src/assets/style/iconfont.less

@@ -83,6 +83,9 @@
   content: "\e63d";
 }
 
+.icon-aite:before {
+  content: "\e634";
+}
 .icon-fengexian:before {
   content: "\e60a";
 }
@@ -104,7 +107,7 @@
 }
 
 .icon-help:before {
-  content: "\e641";
+  content: "\e642";
 }
 
 .icon-file:before {

src/components/header/components/tool-button.vue

@@ -235,6 +235,7 @@ export default {
         case "ul":
         case "task":
         case "table":
+        case "call":
           this.$emit("updateText", { startStr, endStr });
           break;
         case "format":
@@ -361,7 +362,8 @@ export default {
     &.icon-lianjie {
       font-size: 16px;
     }
-    &.icon-file {
+    &.icon-file,
+    &.icon-aite {
       font-size: 19px;
     }
   }

src/components/header/md-header.vue

@@ -180,6 +180,13 @@ export default {
         tip: "全屏模式"
       },
       toolButtonList: [
+        {
+          name: "call",
+          icon: "aite",
+          tip: "@用户",
+          startStr: "@",
+          endStr: ""
+        },
         {
           name: "headline",
           icon: "biaoti",
@@ -399,6 +406,11 @@ export default {
         selectionInfo.selectionStart +
         startStr.length;
       this.updateText(newText, len);
+      if (startStr === "@") {
+        setTimeout(() => {
+          this.$parent.$refs["md_" + this.id].createSelectUserDialog('android');
+        }, 200);
+      }
     },
     updateText(val, len = 0) {
       const textEl = document.getElementById(this.id);