From 900a125d7f7cf88c6fb6af5fc6a27a8e2c3d60ac Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=9B=AE=E6=A3=83?= <BT-Muli@outlook.com>
Date: Sat, 21 Sep 2024 09:03:50 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20=E7=AA=97=E5=8F=A3=E7=BD=AE?=
 =?UTF-8?q?=E9=A1=B6btn?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

https://github.com/tauri-apps/tauri/issues/11078
---
 src-tauri/capabilities/SubWindow.json       |  1 +
 src-tauri/gen/schemas/capabilities.json     |  1 +
 src/components/app/t-pinWin.vue             | 54 +++++++++++++++++++++
 src/components/{main => app}/t-shareBtn.vue |  2 +-
 src/components/post/tb-collect.vue          | 13 +++--
 src/views/t-anno.vue                        |  4 +-
 src/views/t-post.vue                        |  4 +-
 7 files changed, 69 insertions(+), 10 deletions(-)
 create mode 100644 src/components/app/t-pinWin.vue
 rename src/components/{main => app}/t-shareBtn.vue (98%)

diff --git a/src-tauri/capabilities/SubWindow.json b/src-tauri/capabilities/SubWindow.json
index e0d3fd4d..e7c2aaa1 100644
--- a/src-tauri/capabilities/SubWindow.json
+++ b/src-tauri/capabilities/SubWindow.json
@@ -31,6 +31,7 @@
     "core:window:allow-set-focus",
     "core:window:allow-set-fullscreen",
     "core:window:allow-show",
+    "core:window:allow-set-always-on-top",
     "core:window:default",
     {
       "identifier": "fs:allow-exists",
diff --git a/src-tauri/gen/schemas/capabilities.json b/src-tauri/gen/schemas/capabilities.json
index 4ec39d2e..a42f42e7 100644
--- a/src-tauri/gen/schemas/capabilities.json
+++ b/src-tauri/gen/schemas/capabilities.json
@@ -102,6 +102,7 @@
       "core:window:allow-set-focus",
       "core:window:allow-set-fullscreen",
       "core:window:allow-show",
+      "core:window:allow-set-always-on-top",
       "core:window:default",
       { "identifier": "fs:allow-exists", "allow": [{ "path": "**" }] },
       { "identifier": "fs:allow-mkdir", "allow": [{ "path": "**" }] },
diff --git a/src/components/app/t-pinWin.vue b/src/components/app/t-pinWin.vue
new file mode 100644
index 00000000..f684acb3
--- /dev/null
+++ b/src/components/app/t-pinWin.vue
@@ -0,0 +1,54 @@
+<template>
+  <div class="tpw-box" data-html2canvas-ignore>
+    <div class="tpw-btn" @click="switchPin()" :title="isPined ? '取消置顶' : '窗口置顶'">
+      <v-icon :color="isPined ? 'yellow' : 'inherit'">
+        {{ isPined ? "mdi-pin-off" : "mdi-pin" }}
+      </v-icon>
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+import { getCurrentWindow } from "@tauri-apps/api/window";
+import { onMounted, ref } from "vue";
+
+import showSnackbar from "../func/snackbar.js";
+
+const isPined = ref<boolean>(false);
+
+onMounted(async () => {
+  // 因为无法获取窗口是否置顶，这边手动取消置顶
+  // 详见：https://github.com/tauri-apps/tauri/issues/11078
+  await getCurrentWindow().setAlwaysOnTop(false);
+});
+
+async function switchPin(): Promise<void> {
+  isPined.value = !isPined.value;
+  await getCurrentWindow().setAlwaysOnTop(isPined.value);
+  const text = isPined.value ? "已将窗口置顶！" : "已经取消窗口置顶!";
+  showSnackbar({ text: text, color: "success" });
+}
+</script>
+<style lang="css" scoped>
+.tpw-box {
+  position: fixed;
+  top: 70px;
+  left: 20px;
+  border: 2px solid var(--common-shadow-8);
+  border-radius: 50%;
+  cursor: pointer;
+
+  :hover {
+    opacity: 0.8;
+  }
+}
+
+.tpw-btn {
+  display: flex;
+  width: 24px;
+  height: 24px;
+  align-items: center;
+  justify-content: center;
+  margin: 5px;
+  rotate: 30deg;
+}
+</style>
diff --git a/src/components/main/t-shareBtn.vue b/src/components/app/t-shareBtn.vue
similarity index 98%
rename from src/components/main/t-shareBtn.vue
rename to src/components/app/t-shareBtn.vue
index a3de4cc2..7a535b21 100644
--- a/src/components/main/t-shareBtn.vue
+++ b/src/components/app/t-shareBtn.vue
@@ -63,7 +63,7 @@ async function shareContent(): Promise<void> {
   height: 24px;
   align-items: center;
   justify-content: center;
-  padding-right: 2px;
+  padding-right: 3px;
   margin: 5px;
 }
 </style>
diff --git a/src/components/post/tb-collect.vue b/src/components/post/tb-collect.vue
index 8c348945..5f916269 100644
--- a/src/components/post/tb-collect.vue
+++ b/src/components/post/tb-collect.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="tbc-box" data-html2canvas-ignore>
     <div class="tbc-btn" @click="switchCollect()" :title="isCollected ? '取消收藏' : '收藏'">
-      <v-icon size="large" :color="isCollected ? 'yellow' : 'inherit'">
+      <v-icon :color="isCollected ? 'yellow' : 'inherit'">
         {{ isCollected ? "mdi-star" : "mdi-star-outline" }}
       </v-icon>
     </div>
@@ -57,7 +57,7 @@ watch(
   () => props.data,
   async (val) => {
     if (val === undefined) return;
-    if (isCollected.value === false) return;
+    if (!isCollected.value) return;
     const res = await TSUserCollection.updatePostInfo(props.modelValue.toString(), val);
     await event.emit("refreshCollect");
     if (!res) {
@@ -76,7 +76,7 @@ watch(
 );
 
 async function switchCollect(): Promise<void> {
-  if (isCollected.value === false) {
+  if (!isCollected.value) {
     if (props.data === undefined) {
       showSnackbar({
         text: "未获取到帖子信息",
@@ -119,10 +119,10 @@ async function switchCollect(): Promise<void> {
   border: 2px solid var(--common-shadow-8);
   border-radius: 50%;
   cursor: pointer;
-}
 
-.tbc-box:hover {
-  opacity: 0.8;
+  :hover {
+    opacity: 0.8;
+  }
 }
 
 .tbc-btn {
@@ -131,7 +131,6 @@ async function switchCollect(): Promise<void> {
   height: 24px;
   align-items: center;
   justify-content: center;
-  padding-right: 2px;
   margin: 5px;
 }
 
diff --git a/src/views/t-anno.vue b/src/views/t-anno.vue
index 29bc8f2b..8291bcf3 100644
--- a/src/views/t-anno.vue
+++ b/src/views/t-anno.vue
@@ -1,5 +1,6 @@
 <template>
   <TSwitchTheme />
+  <TPinWin />
   <TShareBtn
     v-show="!loadingEmpty"
     v-model="annoRef"
@@ -26,8 +27,9 @@ import { ref, onMounted, watch, onUnmounted } from "vue";
 import { useRoute } from "vue-router";
 
 import TaParser from "../components/anno/ta-parser.vue";
+import TPinWin from "../components/app/t-pinWin.vue";
+import TShareBtn from "../components/app/t-shareBtn.vue";
 import TSwitchTheme from "../components/app/t-switchTheme.vue";
-import TShareBtn from "../components/main/t-shareBtn.vue";
 import ToLoading from "../components/overlay/to-loading.vue";
 import { useAppStore } from "../store/modules/app.js";
 import TGLogger from "../utils/TGLogger.js";
diff --git a/src/views/t-post.vue b/src/views/t-post.vue
index f7469bc0..dec7228b 100644
--- a/src/views/t-post.vue
+++ b/src/views/t-post.vue
@@ -1,5 +1,6 @@
 <template>
   <TSwitchTheme />
+  <TPinWin />
   <TbCollect :model-value="postId" :data="postData" />
   <TShareBtn
     v-show="!loadingEmpty"
@@ -88,8 +89,9 @@ import { webviewWindow } from "@tauri-apps/api";
 import { nextTick, onMounted, onUnmounted, ref, watch } from "vue";
 import { useRoute } from "vue-router";
 
+import TPinWin from "../components/app/t-pinWin.vue";
+import TShareBtn from "../components/app/t-shareBtn.vue";
 import TSwitchTheme from "../components/app/t-switchTheme.vue";
-import TShareBtn from "../components/main/t-shareBtn.vue";
 import ToLoading from "../components/overlay/to-loading.vue";
 import TbCollect from "../components/post/tb-collect.vue";
 import TpAvatar from "../components/post/tp-avatar.vue";