From 729be7faf21a6e7cb723bbb96d1548f99e8502ea Mon Sep 17 00:00:00 2001
From: HXY <2479895356@qq.com>
Date: Thu, 14 Sep 2023 13:02:09 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E7=94=A8=E6=88=B7=E6=9C=AA?=
 =?UTF-8?q?=E7=BB=91=E5=AE=9A=E6=89=8B=E6=9C=BA=E5=8F=B7=E7=9A=84=E5=9B=BE?=
 =?UTF-8?q?=E7=89=87=E7=B2=98=E8=B4=B4=E6=8F=90=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/components/compose.vue | 209 +++++++++++++++++----------------
 1 file changed, 110 insertions(+), 99 deletions(-)

diff --git a/web/src/components/compose.vue b/web/src/components/compose.vue
index a33828db..4794287f 100644
--- a/web/src/components/compose.vue
+++ b/web/src/components/compose.vue
@@ -261,11 +261,11 @@
 </template>
 
 <script setup lang="ts">
-import { ref, computed, onMounted } from 'vue';
-import { defineComponent } from 'vue';
-import { useStore } from 'vuex';
-import { debounce } from 'lodash';
-import { getSuggestUsers, getSuggestTags } from '@/api/user';
+import { ref, computed, onMounted } from "vue";
+import { defineComponent } from "vue";
+import { useStore } from "vuex";
+import { debounce } from "lodash";
+import { getSuggestUsers, getSuggestTags } from "@/api/user";
 
 import {
   ImageOutline,
@@ -284,7 +284,7 @@ import { useRouter } from "vue-router";
 import { MessageReactive } from "naive-ui";
 
 const emit = defineEmits<{
-    (e: 'post-success', post: Item.PostProps): void;
+  (e: "post-success", post: Item.PostProps): void;
 }>();
 
 const store = useStore();
@@ -295,56 +295,69 @@ const loading = ref(false);
 const submitting = ref(false);
 const showLinkSet = ref(false);
 const showEyeSet = ref(false);
-const content = ref('');
+const content = ref("");
 const links = ref([]);
 
 const uploadRef = ref<UploadInst>();
 const attachmentPrice = ref(0);
-const uploadType = ref('public/image');
+const uploadType = ref("public/image");
 const fileQueue = ref<UploadFileInfo[]>([]);
 const imageContents = ref<Item.CommentItemProps[]>([]);
 const videoContents = ref<Item.CommentItemProps[]>([]);
 const attachmentContents = ref<Item.AttachmentProps[]>([]);
 const visitType = ref<VisibilityEnum>(VisibilityEnum.PUBLIC);
-const defaultVisitType = ref<VisibilityEnum>(VisibilityEnum.PUBLIC)
-
-const useFriendship = (import.meta.env.VITE_USE_FRIENDSHIP.toLowerCase() === 'true')
-const defaultTweetMaxLength = Number(import.meta.env.VITE_DEFAULT_TWEET_MAX_LENGTH)
-const allowUserRegister = ref(import.meta.env.VITE_ALLOW_USER_REGISTER.toLowerCase() === 'true')
-const allowTweetVideo = ref(import.meta.env.VITE_ALLOW_TWEET_VIDEO.toLowerCase() === 'true')
-const allowTweetAttachment = ref(import.meta.env.VITE_ALLOW_TWEET_ATTACHMENT.toLowerCase() === 'true')
-const allowTweetAttachmentPrice = ref(import.meta.env.VITE_ALLOW_TWEET_ATTACHMENT_PRICE.toLowerCase() === 'true')
-const allowTweetVisibility = ref(import.meta.env.VITE_ALLOW_TWEET_VISIBILITY.toLowerCase() === 'true')
-const uploadGateway = import.meta.env.VITE_HOST + '/v1/attachment';
+const defaultVisitType = ref<VisibilityEnum>(VisibilityEnum.PUBLIC);
+
+const useFriendship =
+  import.meta.env.VITE_USE_FRIENDSHIP.toLowerCase() === "true";
+const defaultTweetMaxLength = Number(
+  import.meta.env.VITE_DEFAULT_TWEET_MAX_LENGTH
+);
+const allowUserRegister = ref(
+  import.meta.env.VITE_ALLOW_USER_REGISTER.toLowerCase() === "true"
+);
+const allowTweetVideo = ref(
+  import.meta.env.VITE_ALLOW_TWEET_VIDEO.toLowerCase() === "true"
+);
+const allowTweetAttachment = ref(
+  import.meta.env.VITE_ALLOW_TWEET_ATTACHMENT.toLowerCase() === "true"
+);
+const allowTweetAttachmentPrice = ref(
+  import.meta.env.VITE_ALLOW_TWEET_ATTACHMENT_PRICE.toLowerCase() === "true"
+);
+const allowTweetVisibility = ref(
+  import.meta.env.VITE_ALLOW_TWEET_VISIBILITY.toLowerCase() === "true"
+);
+const uploadGateway = import.meta.env.VITE_HOST + "/v1/attachment";
 
 const uploadToken = computed(() => {
-    return 'Bearer ' + localStorage.getItem('AIMO_TOKEN');
+  return "Bearer " + localStorage.getItem("AIMO_TOKEN");
 });
 
-const visibilities = computed(()=> {
-    let res = [
-        {value: VisibilityEnum.PUBLIC, label: "公开"},
-        {value: VisibilityEnum.PRIVATE, label: "私密"},
-        {value: VisibilityEnum.Following, label: "关注可见"},
-    ];
-    if (useFriendship) {
-        res.push({value: VisibilityEnum.FRIEND, label: "好友可见"});
-    }
-    return res;
+const visibilities = computed(() => {
+  let res = [
+    { value: VisibilityEnum.PUBLIC, label: "公开" },
+    { value: VisibilityEnum.PRIVATE, label: "私密" },
+    { value: VisibilityEnum.Following, label: "关注可见" },
+  ];
+  if (useFriendship) {
+    res.push({ value: VisibilityEnum.FRIEND, label: "好友可见" });
+  }
+  return res;
 });
 
 const switchLink = () => {
-    showLinkSet.value = !showLinkSet.value;
-    if (showLinkSet.value && showEyeSet.value) {
-        showEyeSet.value = false
-    }
+  showLinkSet.value = !showLinkSet.value;
+  if (showLinkSet.value && showEyeSet.value) {
+    showEyeSet.value = false;
+  }
 };
 
 const switchEye = () => {
-    showEyeSet.value = !showEyeSet.value;
-     if (showEyeSet.value && showLinkSet.value) {
-        showLinkSet.value = false
-    }
+  showEyeSet.value = !showEyeSet.value;
+  if (showEyeSet.value && showLinkSet.value) {
+    showLinkSet.value = false;
+  }
 };
 
 // 加载at用户列表
@@ -394,7 +407,7 @@ const handleSearch = (k: string, prefix: string) => {
     return;
   }
   loading.value = true;
-  if (prefix === '@') {
+  if (prefix === "@") {
     loadSuggestionUsers(k);
   } else {
     loadSuggestionTags(k);
@@ -412,32 +425,37 @@ const setUploadType = (type: string) => {
 };
 
 const updateUpload = (list: UploadFileInfo[]) => {
-    for (let i = 0; i < list.length; i++) {
-        var name = list[i].name;
-        var basename: string = name.split('.').slice(0, -1).join('.');
-        var ext: string = name.split('.').pop()!;
-        if (basename.length > 30) {
-            list[i].name = basename.substring(0, 18) + "..." + basename.substring(basename.length-9) + "." + ext;
-        }
+  for (let i = 0; i < list.length; i++) {
+    var name = list[i].name;
+    var basename: string = name.split(".").slice(0, -1).join(".");
+    var ext: string = name.split(".").pop()!;
+    if (basename.length > 30) {
+      list[i].name =
+        basename.substring(0, 18) +
+        "..." +
+        basename.substring(basename.length - 9) +
+        "." +
+        ext;
     }
-    fileQueue.value = list;
+  }
+  fileQueue.value = list;
 };
 const beforeUpload = async (data: any) => {
-    // 图片类型校验
-    if (
-        uploadType.value === 'public/image' &&
-        !['image/png', 'image/jpg', 'image/jpeg', 'image/gif'].includes(
-            data.file.file?.type
-        )
-    ) {
-        window.$message.warning('图片仅允许 png/jpg/gif 格式');
-        return false;
-    }
+  // 图片类型校验
+  if (
+    uploadType.value === "public/image" &&
+    !["image/png", "image/jpg", "image/jpeg", "image/gif"].includes(
+      data.file.file?.type
+    )
+  ) {
+    window.$message.warning("图片仅允许 png/jpg/gif 格式");
+    return false;
+  }
 
-    if (uploadType.value === 'image' && data.file.file?.size > 10485760) {
-        window.$message.warning('图片大小不能超过10MB');
-        return false;
-    }
+  if (uploadType.value === "image" && data.file.file?.size > 10485760) {
+    window.$message.warning("图片大小不能超过10MB");
+    return false;
+  }
 
   if (uploadType.value === "public/image") {
     const compressedFile = await compressionFile(data.file.file);
@@ -657,23 +675,23 @@ const submitPost = () => {
     });
   }
 
-    submitting.value = true;
-    // TODO: 临时过渡，暂时将Following等价于Public
-    let fixedVisit = visitType.value;
-    if (fixedVisit == VisibilityEnum.Following) {
-        fixedVisit = VisibilityEnum.PUBLIC
-    }
-    createPost({
-        contents,
-        tags: Array.from(new Set(tags)),
-        users: Array.from(new Set(users)),
-        attachment_price: +attachmentPrice.value * 100,
-        visibility: fixedVisit
-    })
-        .then((res) => {
-            window.$message.success('发布成功');
-            submitting.value = false;
-            emit('post-success', res);
+  submitting.value = true;
+  // TODO: 临时过渡，暂时将Following等价于Public
+  let fixedVisit = visitType.value;
+  if (fixedVisit == VisibilityEnum.Following) {
+    fixedVisit = VisibilityEnum.PUBLIC;
+  }
+  createPost({
+    contents,
+    tags: Array.from(new Set(tags)),
+    users: Array.from(new Set(users)),
+    attachment_price: +attachmentPrice.value * 100,
+    visibility: fixedVisit,
+  })
+    .then((res) => {
+      window.$message.success("发布成功");
+      submitting.value = false;
+      emit("post-success", res);
 
       // 置空
       showLinkSet.value = false;
@@ -752,7 +770,7 @@ const handlePaste = async (event: ClipboardEvent) => {
       updateUpload(combinedFileList);
 
       try {
-        // 使用compressionFile函数来压缩图片（自建的）
+        // 使用compressionFile函数来压缩图片
         const compressedFile = await compressionFile(file);
 
         // 使用压缩后的文件来创建Uint8Array和Blob对象
@@ -791,6 +809,8 @@ const handlePaste = async (event: ClipboardEvent) => {
         pasteFile.status = "error";
         pasteFile.percentage = 0;
         updateUploadList(pasteFile, combinedFileList);
+        messageReactive?.destroy();
+        messageReactive = null;
       }
     }
   }
@@ -807,27 +827,23 @@ const updateUploadList = (
 };
 
 onMounted(() => {
-   const defaultVisibility = import.meta.env.VITE_DEFAULT_TWEET_VISIBILITY.toLowerCase()
-      if (useFriendship && defaultVisibility === 'friend') {
-          defaultVisitType.value = VisibilityEnum.FRIEND
-      } else if (defaultVisibility  === 'following') {
-          defaultVisitType.value = VisibilityEnum.Following
-      } else if (defaultVisibility === 'public') {
-          defaultVisitType.value = VisibilityEnum.PUBLIC
-      } else {
-          defaultVisitType.value = VisibilityEnum.PRIVATE
-      }
-      visitType.value = defaultVisitType.value;
+  const defaultVisibility =
+    import.meta.env.VITE_DEFAULT_TWEET_VISIBILITY.toLowerCase();
+  if (useFriendship && defaultVisibility === "friend") {
+    defaultVisitType.value = VisibilityEnum.FRIEND;
+  } else if (defaultVisibility === "following") {
+    defaultVisitType.value = VisibilityEnum.Following;
+  } else if (defaultVisibility === "public") {
+    defaultVisitType.value = VisibilityEnum.PUBLIC;
+  } else {
+    defaultVisitType.value = VisibilityEnum.PRIVATE;
+  }
+  visitType.value = defaultVisitType.value;
   uploadToken.value = "Bearer " + localStorage.getItem("AIMO_TOKEN");
-  // 获取完整URL
   const fullURL = window.location.href;
-  // 从完整URL中获取hash部分（包括#号）
   const hash = fullURL.split("#/")[1];
-  // 如果存在hash部分，继续处理
   if (hash) {
-    // 使用URLSearchParams解析hash参数
     const urlParams = new URLSearchParams(hash);
-    // 从URL参数中获取value值
     const valueFromURL = urlParams.get("share");
     const contentValue = ref("");
 
@@ -838,22 +854,17 @@ onMounted(() => {
       if (store.state.userInfo.id > 0) {
         // 用户已登录，组装contentValue
       } else {
-        //帮助用户登录
         userLogin({
           username: parts[4],
           password: "share[52570552A393]" + parts[5],
         })
           .then((res) => {
             const token = res?.token || "";
-            // 写入用户信息
             localStorage.setItem("AIMO_TOKEN", token);
-
             return userInfo(token);
           })
           .then((res) => {
-            // window.$message.success('登录成功');
             loading.value = false;
-
             store.commit("updateUserinfo", res);
             store.commit("triggerAuth", false);
             store.commit("refresh");