SCHISANDRA/schisandra-cloud-album-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

✨ update dependency package

Browse Source
This commit is contained in:
landaiqing
2024-10-15 16:37:21 +08:00
parent 87afe5bf27
commit da39551586
16 changed files with 641 additions and 346 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/CommentReply/src/CommentInput/CommentInput.vue
View File

@@ -8,7 +8,7 @@
<ATextarea :rows="4" class="comment-text" @focus="onFocusHandler"
v-model:value="commentContent"
@keyup.ctrl.enter="showSlideCaptcha"
:placeholder="commentTextAreaPlaceholder" allow-clear :showCount="false"/>
:placeholder="t('comment.placeholder')" allow-clear :showCount="false"/>
<AFlex :vertical="false" align="center" justify="space-between" class="comment-actions"
v-if="showCommentActions">
@@ -164,7 +164,6 @@ const showCommentActions = ref<boolean>(false);
const commentContent = ref<string>("");
const user = useStore().user;
const commentTextAreaPlaceholder = ref<string>(t('comment.placeholder'));
const topicId = ref<string>("123");
const showSubmitCaptcha = ref<boolean>(false);
const comment = useStore().comment;

3
src/components/CommentReply/src/ReplyInput/ReplyInput.vue
View File

@@ -15,7 +15,7 @@
<ATextarea :rows="3" class="comment-text-reply"
v-model:value="replyContent"
@keyup.ctrl.enter="showSlideCaptcha"
:placeholder="commentTextAreaPlaceholder" allow-clear :showCount="false"/>
:placeholder="t('comment.placeholder')" allow-clear :showCount="false"/>
<AFlex :vertical="false" align="center" justify="space-between" class="comment-actions-reply"
>
<AFlex :vertical="false" align="center">
@@ -169,7 +169,6 @@ import {replySubmitApi} from "@/api/comment";
const {t} = useI18n();
const comment = useStore().comment;
const user = useStore().user;
const commentTextAreaPlaceholder = ref<string>(t('comment.placeholder'));
const replyContent = ref<string>("");
const topicId = ref<string>("123");
const showSubmitCaptcha = ref<boolean>(false);

3
src/components/CommentReply/src/ReplyReplyInput/ReplyReply.vue
View File

@@ -17,7 +17,7 @@
<ATextarea :rows="3" class="comment-text-reply-child"
v-model:value="replyReplyContent"
@keyup.ctrl.enter="showSlideCaptcha"
:placeholder="commentTextAreaPlaceholder" allow-clear :showCount="false"/>
:placeholder="t('comment.placeholder')" allow-clear :showCount="false"/>
<AFlex :vertical="false" align="center" justify="space-between"
class="comment-actions-reply-child"
>
@@ -173,7 +173,6 @@ import {ReplyCommentParams} from "@/types/comment";
import {useThrottleFn} from "@vueuse/core";
const {t} = useI18n();
const commentTextAreaPlaceholder = ref<string>(t('comment.placeholder'));
const comment = useStore().comment;
const replyReplyContent = ref<string>("");

13
src/directives/index.ts Normal file
View File

@@ -0,0 +1,13 @@
// src/directives/index.ts
import clickOutside from '@/directives/v-click-outside.ts';
import lazyLoad from "@/directives/v-lazy-load.ts";
/**
* Register all directives
* @param app
*/
export const registerDirectives = (app: any) => {
app.directive('click-outside', clickOutside);
app.directive('lazy-load', lazyLoad);
};

28
src/layout/default/Header/Header.vue
View File

@@ -9,10 +9,22 @@
<ABadge count="0" :numberStyle="{
marginTop: '5px',
}">
<AButton type="text" shape="circle" size="middle" class="header-menu-item-btn"
<AButton type="text" shape="circle" size="large" class="header-menu-item-btn"
:icon="h(BellOutlined)"/>
</ABadge>
</AFlex>
<AFlex :vertical="false" align="center" justify="flex-start" class="header-menu-item">
<ADropdown>
<template #overlay>
<AMenu @click="changeLang">
<AMenuItem key="zh">{{ t("landing.chinese") }}</AMenuItem>
<AMenuItem key="en">{{ t("landing.english") }}</AMenuItem>
</AMenu>
</template>
<AButton type="text" shape="circle" size="large" :icon="h(TranslationOutlined)">
</AButton>
</ADropdown>
</AFlex>
<AFlex :vertical="false" align="center" justify="flex-start" class="header-user-container">
<AAvatar :size="35" class="header-user-avatar" :src="user.user.userInfo.avatar"/>
<AButton type="text" size="small" class="header-user-btn">landaiqing</AButton>
@@ -23,10 +35,22 @@
<script lang="ts" setup>
import logo from "@/assets/svgs/logo-schisandra.svg";
import useStore from "@/store";
import {BellOutlined} from "@ant-design/icons-vue";
import {BellOutlined, TranslationOutlined} from "@ant-design/icons-vue";
import {h} from "vue";
import {useI18n} from "vue-i18n";
const user = useStore().user;
const {t, locale} = useI18n();
const lang = useStore().lang;
/**
* 切换语言
* @param language
*/
async function changeLang(language: any) {
lang.lang = language.key;
locale.value = language.key;
}
</script>
<style scoped lang="scss" src="./index.scss">

2
src/layout/default/Header/index.scss
View File

@@ -21,7 +21,7 @@
width: 30%;
.header-menu-item {
min-width: 60px;
min-width: 50px;
.header-menu-item-btn {
font-size: 16px;

6
src/main.ts
View File

@@ -8,15 +8,13 @@ import "go-captcha-vue/dist/style.css";
import GoCaptcha from "go-captcha-vue";
import {createPinia, Pinia} from "pinia";
import piniaPluginPersistedstate from "pinia-plugin-persistedstate";
import clickOutside from '@/directives/v-click-outside.ts';
import lazyLoad from "@/directives/v-lazy-load.ts";
import VueDOMPurifyHTML from 'vue-dompurify-html';
import {registerDirectives} from "@/directives";
const pinia: Pinia = createPinia();
pinia.use(piniaPluginPersistedstate);
const app = createApp(App);
app.directive('click-outside', clickOutside);
app.directive('lazy-load', lazyLoad);
registerDirectives(app);
app.use(pinia);
app.use(router);
app.use(i18n);

27
src/store/modules/commentStore.ts
View File

@@ -203,32 +203,7 @@ export const useCommentStore = defineStore(
uploadLoading.value = false;
return false;
}
const canvas = document.createElement('canvas');
canvas.width = img.naturalWidth;
canvas.height = img.naturalHeight;
const ctx = canvas.getContext('2d');
if (!ctx) {
console.error('Failed to get canvas context');
return;
}
ctx.drawImage(img, 0, 0);
ctx.fillStyle = 'rgba(255, 255, 255, 0.5)';
ctx.textBaseline = 'middle';
// 动态设置字体大小，假设字体大小为画布高度的 5%
const fontSize = canvas.height * 0.05; // 可以根据需要调整比例
ctx.font = `${fontSize}px Microsoft Yahei`;
// 计算文本的宽度和高度，以便将其放置在右下角
const text = 'schisandra';
const textWidth = ctx.measureText(text).width;
const textHeight = fontSize; // 字体大小
// 设置文本的位置到右下角
const x: number = canvas.width - textWidth - 5; // 距离右边缘 5 像素
const y: number = canvas.height - textHeight / 2 - 5; // 距离下边缘 5 像素
ctx.fillText(text, x, y);
fileList.value.push(canvas.toDataURL());
fileList.value.push(img.src);
uploadLoading.value = false;
};
} else {

38
src/utils/imageUtils/addWatermark.ts Normal file
View File

@@ -0,0 +1,38 @@
/**
* 添加水印
* @param img
* @param watermarkText
*/
function addWatermark(img: HTMLImageElement, watermarkText: string) {
const canvas = document.createElement('canvas');
canvas.width = img.naturalWidth;
canvas.height = img.naturalHeight;
const ctx = canvas.getContext('2d');
if (!ctx) {
console.error('Failed to get canvas context');
return;
}
ctx.drawImage(img, 0, 0);
ctx.fillStyle = 'rgba(255, 255, 255, 0.5)';
ctx.textBaseline = 'middle';
// 动态设置字体大小，假设字体大小为画布高度的 5%
const fontSize = canvas.height * 0.05; // 可以根据需要调整比例
ctx.font = `${fontSize}px Microsoft Yahei`;
// 计算文本的宽度和高度，以便将其放置在右下角
const textWidth = ctx.measureText(watermarkText).width;
const textHeight = fontSize; // 字体大小
// 设置文本的位置到右下角
const x: number = canvas.width - textWidth - 5; // 距离右边缘 5 像素
const y: number = canvas.height - textHeight / 2 - 5; // 距离下边缘 5 像素
ctx.fillText(watermarkText, x, y);
return canvas.toDataURL(); // 返回带水印的图片数据
}
export default addWatermark;

3
src/views/404/NotFound.vue
View File

@@ -63,6 +63,9 @@ import {useRouter} from "vue-router";
const router = useRouter();
/**
* Redirect to home page after 3 seconds
*/
async function backHome() {
setTimeout(() => {
router.go(-1);

4
src/views/QRLogin/QRLogin.vue
View File

@@ -18,9 +18,7 @@
:size="280"
:error-level="'H'"
:status="status"
@refresh="() => {
getQrCode();
}"
@refresh="getQrCode"
:value=qrcode
:icon="logo"
/>