feat:添加进度圈

src/App.vue

@@ -216,7 +216,7 @@ export default {
           originalText,
           selectionInfo,
           "\n![img](",
-          `${url} '=600 #left')\n`
+          `${url} "=600 #left")\n`
         );
         _this.text = newText;
         _this.$refs.mdUploadFile.value = "";

src/assets/style/iconfont.less

@@ -137,3 +137,7 @@
 .icon-liujibiaoti:before {
   content: "\e676";
 }
+
+.icon-loading:before {
+  content: "\e626";
+}

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

@@ -2,6 +2,10 @@
   <div v-if="isMobile" @click="mobileClick" class="tool_button">
     <span :class="['icon iconfont', `icon-${info.icon}`]"></span>
   </div>
+  <div v-else-if="info.name === 'loading'" class="tool_button">
+    <span :class="['icon loading iconfont', `icon-${info.icon}`]"> </span>
+    <span class="percent">{{ percent }}</span>
+  </div>
   <div
     v-else-if="info.name === 'code'"
     @click="handleTool(info.name, info.startStr, info.endStr)"
@@ -83,7 +87,17 @@ export default {
     }
   },
   data() {
-    return {};
+    return {
+      percent: 0
+    };
+  },
+  created() {
+    setInterval(() => {
+      this.percent++;
+      if (this.percent >= 100) {
+        this.percent = 0;
+      }
+    }, 100);
   },
   computed: {
     darkMode() {
@@ -247,15 +261,31 @@ export default {
 };
 </script>
 <style lang="less" scoped>
+@keyframes rotate {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(359deg);
+  }
+}
 .tool_button {
   padding: 0 8px 8px;
   box-sizing: border-box;
   cursor: pointer;
+  position: relative;
   &.active {
     .icon {
       color: var(--md-editor-border-color-active);
     }
   }
+  .percent {
+    font-size: 12px;
+    position: absolute;
+    top: 2px;
+    left: 50%;
+    transform: translateX(-50%) scale(0.8);
+  }
   .icon {
     font-size: 18px;
     color: var(--md-editor-text-color);
@@ -269,6 +299,9 @@ export default {
         color: var(--md-editor-border-color-active);
       }
     }
+    &.loading {
+      animation: rotate 3s linear infinite;
+    }
 
     &.icon-quxiaoquanping_o {
       font-size: 24px;

src/components/header/components/video-select.vue

@@ -20,8 +20,7 @@ export default {
 ul {
   max-height: 142px;
   overflow-y: auto;
-  margin-top: 2px;
-  margin-bottom: 4px;
+  margin-bottom: 2px;
   padding-top: 4px;
   box-sizing: border-box;
   scrollbar-color: transparent transparent;

src/components/header/md-header.vue

@@ -251,6 +251,13 @@ export default {
           startStr: "",
           endStr: ""
         },
+        {
+          name: "loading",
+          icon: "loading",
+          tip: "上传视频",
+          startStr: "",
+          endStr: ""
+        },
         {
           name: "task",
           icon: "renwu",