feat: #132 集成PicGO以及图床-新增功能菜单按钮

terwer · Dec 18, 2022 · 2cc434c · 2cc434c
1 parent 03e2736
commit 2cc434c
Show file tree

Hide file tree

Showing 6 changed files with 147 additions and 36 deletions.
diff --git a/README.md b/README.md
@@ -55,7 +55,7 @@ import("/widgets/sy-post-publisher/lib/siyuanhook.js")
 
 点击按钮开始体验
 
-![](https://img1.terwer.space/api/public/202212180137539.png)
+![](https://img1.terwer.space/api/public/202212182033394.png)
 
 详情请参考: [挂件模式用挂载菜单的方式使用](https://www.terwer.space/post/the-pendant-mode-is-used-in-the-method-of-mounting-menu-169wrw.html#%E6%95%88%E6%9E%9C%E6%BC%94%E7%A4%BA)<sup>
 强烈推荐</sup> <sup>0.4.2+</sup>

diff --git a/components.d.ts b/components.d.ts
@@ -34,6 +34,7 @@ declare module '@vue/runtime-core' {
     ElTabPane: typeof import('element-plus/es')['ElTabPane']
     ElTabs: typeof import('element-plus/es')['ElTabs']
     ElTag: typeof import('element-plus/es')['ElTag']
+    ElTooltip: typeof import('element-plus/es')['ElTooltip']
     ElTreeSelect: typeof import('element-plus/es')['ElTreeSelect']
   }
 }
diff --git a/layouts/default/DefaultHeader.vue b/layouts/default/DefaultHeader.vue
@@ -27,46 +27,131 @@
   <div class="header-default">
     <el-header id="publisher-header">
       <div v-if="!showTitle">
-        <el-button
-          v-if="showOpenBtn"
-          class="b3-button--quick"
-          type="success"
-          @click="handleWinQuick"
+        <!-- 快速发布 -->
+        <el-tooltip
+          :content="$t('siyuan.browser.menu.quick.btn')"
+          class="box-item"
+          effect="light"
+          placement="right"
+          popper-class="publish-menu-tooltip"
         >
-          <font-awesome-icon icon="fa-solid fa-bolt" />
-        </el-button>
-        <el-button
-          v-if="showOpenBtn"
-          class="b3-button--open"
-          type="success"
-          @click="handleWinOpen"
+          <el-button
+            v-if="showOpenBtn"
+            class="b3-button--quick"
+            type="success"
+            @click="handleWinQuick"
+          >
+            <font-awesome-icon icon="fa-solid fa-bolt" />
+          </el-button>
+        </el-tooltip>
+
+        <!-- 文章发布 -->
+        <el-tooltip
+          :content="$t('siyuan.browser.menu.publish.btn')"
+          class="box-item"
+          effect="light"
+          placement="right"
+          popper-class="publish-menu-tooltip"
         >
-          <font-awesome-icon icon="fa-solid fa-upload" />
-        </el-button>
-        <el-button
-          v-if="showOpenBtn"
-          class="b3-button--preview"
-          type="success"
-          @click="handleWinPreview"
+          <el-button
+            v-if="showOpenBtn"
+            class="b3-button--open"
+            type="success"
+            @click="handleWinOpen"
+          >
+            <font-awesome-icon icon="fa-solid fa-upload" />
+          </el-button>
+        </el-tooltip>
+
+        <!-- 文章预览 -->
+        <el-tooltip
+          :content="$t('siyuan.browser.menu.preview.btn')"
+          class="box-item"
+          effect="light"
+          placement="right"
+          popper-class="publish-menu-tooltip"
         >
-          <font-awesome-icon icon="fa-solid fa-book-open-reader" />
-        </el-button>
-        <el-button
-          v-if="showOpenBtn"
-          class="b3-button--preview"
-          type="success"
-          @click="handleWinManage"
+          <el-button
+            v-if="showOpenBtn"
+            class="b3-button--preview"
+            type="success"
+            @click="handleWinPreview"
+          >
+            <font-awesome-icon icon="fa-solid fa-book-open-reader" />
+          </el-button>
+        </el-tooltip>
+
+        <!-- 文章管理 -->
+        <el-tooltip
+          :content="$t('siyuan.browser.menu.manage.btn')"
+          class="box-item"
+          effect="light"
+          placement="right"
+          popper-class="publish-menu-tooltip"
         >
-          <font-awesome-icon icon="fa-solid fa-rectangle-list" />
-        </el-button>
-        <el-button
-          v-if="showCloseBtn"
-          class="b3-button--cancel"
-          type="danger"
-          @click="handleWinClose"
+          <el-button
+            v-if="showOpenBtn"
+            class="b3-button--preview"
+            type="success"
+            @click="handleWinManage"
+          >
+            <font-awesome-icon icon="fa-solid fa-rectangle-list" />
+          </el-button>
+        </el-tooltip>
+
+        <!-- Anki标记 -->
+        <el-tooltip
+          :content="$t('siyuan.browser.menu.anki.btn')"
+          class="box-item"
+          effect="light"
+          placement="right"
+          popper-class="publish-menu-tooltip"
         >
-          <font-awesome-icon icon="fa-solid fa-xmark" />
-        </el-button>
+          <el-button
+            v-if="showOpenBtn"
+            class="b3-button--anki"
+            type="success"
+            @click="handleWinAnki"
+          >
+            <font-awesome-icon icon="fa-solid fa-credit-card" />
+          </el-button>
+        </el-tooltip>
+
+        <!-- 图床 -->
+        <el-tooltip
+          :content="$t('siyuan.browser.menu.picture.btn')"
+          class="box-item"
+          effect="light"
+          placement="right"
+          popper-class="publish-menu-tooltip"
+        >
+          <el-button
+            v-if="showOpenBtn"
+            class="b3-button--picture"
+            type="success"
+            @click="handleWinPicture"
+          >
+            <font-awesome-icon icon="fa-solid fa-image" />
+          </el-button>
+        </el-tooltip>
+
+        <!-- 关闭 -->
+        <el-tooltip
+          :content="$t('siyuan.browser.menu.quick.btn')"
+          class="box-item"
+          effect="light"
+          placement="right"
+          popper-class="publish-menu-tooltip"
+        >
+          <el-button
+            v-if="showCloseBtn"
+            class="b3-button--cancel"
+            type="danger"
+            @click="handleWinClose"
+          >
+            <font-awesome-icon icon="fa-solid fa-xmark" />
+          </el-button>
+        </el-tooltip>
       </div>
       <h1 v-if="showTitle" class="header-title-default">
         <el-button class="header-title-btn disabled-click">
@@ -145,6 +230,14 @@ const handleWinManage = async () => {
   }
 }
 
+const handleWinAnki = async () => {
+  alert("anki")
+}
+
+const handleWinPicture = async () => {
+  alert("picture")
+}
+
 const handleWinClose = () => {
   if (showCloseBtn.value) {
     try {

diff --git a/locales/en_US.ts b/locales/en_US.ts
@@ -291,4 +291,10 @@ export default {
     "Delete H1 may accidentally delete the beginning of the beginning of Markdown. If you need to open it, please use more than 2 ones.",
   "preference.setting.newWin": "New win",
   "siyuan.browser.show.close.btn": "Show close btn",
+  "siyuan.browser.menu.quick.btn": "Quick publish",
+  "siyuan.browser.menu.publish.btn": "Publish",
+  "siyuan.browser.menu.preview.btn": "Preview",
+  "siyuan.browser.menu.manage.btn": "Manage",
+  "siyuan.browser.menu.anki.btn": "Anki",
+  "siyuan.browser.menu.picture.btn": "PicGO",
 }
diff --git a/locales/zh_CN.ts b/locales/zh_CN.ts
@@ -302,4 +302,11 @@ export default {
     "删除H1可能会误删除Markdown里面的#开头的注释，如需开启，请使用2个以上的#注释，是否继续？",
   "preference.setting.newWin": "新窗口",
   "siyuan.browser.show.close.btn": "显示关闭按钮",
+  "siyuan.browser.menu.quick.btn": "一键快速发布",
+  "siyuan.browser.menu.publish.btn":
+    "文章发布（自动检测，有子文档->列表页；无子文档->发布页）",
+  "siyuan.browser.menu.preview.btn": "文章预览（当前文章只读预览）",
+  "siyuan.browser.menu.manage.btn": "文章管理（全部文章统一管理）",
+  "siyuan.browser.menu.anki.btn": "Anki标记（配合ankisiyuan生成Anki标记）",
+  "siyuan.browser.menu.picture.btn": "PicGO图床（支持图床配置与图片上传）",
 }
diff --git a/plugins/font-awesome/font-awesome.ts b/plugins/font-awesome/font-awesome.ts
@@ -34,6 +34,8 @@ import {
   faBolt,
   faBookOpenReader,
   faCircleXmark,
+  faCreditCard,
+  faImage,
   faRectangleList,
   faUpload,
   faXmark,
@@ -50,6 +52,8 @@ const FontAwesome: PluginObject<any> = {
     library.add(faXmark)
     library.add(faCircleXmark)
     library.add(faBolt)
+    library.add(faCreditCard)
+    library.add(faImage)
 
     Vue.component("font-awesome-icon", FontAwesomeIcon)
     logger.debug("FontAwesome inited")