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

✨ updated

Browse Source
This commit is contained in:
landaiqing
2024-11-03 17:21:36 +08:00
parent a451267e33
commit c725936f39
18 changed files with 267 additions and 121 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/assets/styles/theme.scss
View File

@@ -3,7 +3,10 @@
--text-color: #000000;
// 着陆页背景颜色
--landing-background-color-main: #b9f187;
// 评论文字颜色
--comment-text-color: #767779;
// 评论子评论背景颜色
--comment-child-background-color: #f5f5f5;
}
[data-dark="dark"] {
@@ -11,7 +14,10 @@
--text-color: #ffffff;
// 着陆页背景颜色
--landing-background-color-main: rgb(0, 0, 0);
// 评论文字颜色
--comment-text-color: #ffffff;
// 评论子评论背景颜色
--comment-child-background-color: rgb(0, 0, 0);
}
#app {

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

@@ -210,7 +210,6 @@ const getSlideCaptchaDataThrottled = useThrottleFn(comment.getSlideCaptchaData,
*/
async function showSlideCaptcha() {
if (commentContent.value.trim() === "") {
message.error(t('comment.commentContentNotEmpty'));
return;
}
if (comment.imageList.length > 3) {

11
src/components/CommentReply/src/CommentList/CommentList.vue
View File

@@ -94,13 +94,13 @@
{{ item.browser }}
</AButton>
<!-- 评论操作按钮 -->
<ADropdown trigger="click">
<ADropdown trigger="click" @click.prevent>
<AButton type="text" size="small" :icon="h(EllipsisOutlined)" class="reply-action-btn"
@click.prevent>
</AButton>
<template #overlay>
<AMenu>
<AMenuItem key="report">
<AMenuItem key="report" @click="showMessageReport = true">
<WarningOutlined/>
{{ t('comment.report') }}
</AMenuItem>
@@ -127,6 +127,11 @@
</div>
<AEmpty :description="null" v-show="!comment.commentList.comments"/>
</ASkeleton>
<!--举报窗口-->
<AModal v-model:open="showMessageReport" :title="t('comment.report')" :width="600" :footer="null">
<MessageReport/>
</AModal>
</div>
</template>
@@ -149,6 +154,7 @@ import useStore from "@/store";
import {useRouter} from "vue-router";
import ReplyInput from "@/components/CommentReply/src/ReplyInput/ReplyInput.vue";
import ReplyList from "@/components/CommentReply/src/ReplyList/ReplyList.vue";
import MessageReport from "@/components/CommentReply/src/MessageReport/MessageReport.vue";
const {t} = useI18n();
@@ -158,6 +164,7 @@ const user = useStore().user;
const topicId = ref<string>("123");
const showMessageReport = ref<boolean>(false);
/**
* 获取评论列表

103
src/components/CommentReply/src/MessageReport/MessageReport.vue Normal file
View File

@@ -0,0 +1,103 @@
<template>
<div>
<ASteps :current="current" :status="current==2?'finish':'process'" @change="handleCurrentChange">
<AStep title="类型">
</AStep>
<AStep title="说明">
</AStep>
<AStep title="材料">
</AStep>
</ASteps>
<div class="steps-content">
<div v-if="current === 0">
<a-radio-group v-model:value="value">
<a-radio :style="radioStyle" :value="1">Option A</a-radio>
<a-radio :style="radioStyle" :value="2">Option B</a-radio>
<a-radio :style="radioStyle" :value="3">Option C</a-radio>
<a-radio :style="radioStyle" :value="4">
More...
<a-input v-if="value === 4" style="width: 100px; margin-left: 10px"/>
</a-radio>
</a-radio-group>
</div>
<div v-if="current === 1">
<a-textarea :rows="8" placeholder="maxlength is 6" :maxlength="6"/>
</div>
<div v-if="current === 2">
<a-upload-dragger
v-model:fileList="fileList"
name="file"
:multiple="true"
action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
@change="handleChange"
@drop="handleDrop"
>
<p class="ant-upload-drag-icon">
<inbox-outlined></inbox-outlined>
</p>
<p class="ant-upload-text">Click or drag file to this area to upload</p>
<p class="ant-upload-hint">
Support for a single or bulk upload. Strictly prohibit from uploading company data or other
band files
</p>
</a-upload-dragger>
</div>
</div>
<div class="steps-action">
<AButton v-if="current > 0 && current <= 2" @click="prev">上一步</AButton>
<AButton v-if="current >= 0 && current < 2" type="primary" style="margin-left: 8px" @click="next">下一步</AButton>
<AButton
style="margin-left: 8px"
v-if="current == 2"
type="primary"
@click="message.success('Processing complete!')"
>
完成
</AButton>
</div>
</div>
</template>
<script lang="ts" setup>
import {reactive, ref} from 'vue';
import type {UploadChangeParam} from 'ant-design-vue';
import {message} from 'ant-design-vue';
const current = ref<number>(0);
const next = () => {
current.value++;
};
const prev = () => {
current.value--;
};
function handleCurrentChange(index: number) {
current.value = index;
}
const value = ref<number>(1);
const radioStyle = reactive({
display: 'flex',
height: '30px',
lineHeight: '30px',
});
const fileList = ref([]);
const handleChange = (info: UploadChangeParam) => {
const status = info.file.status;
if (status !== 'uploading') {
console.log(info.file, info.fileList);
}
if (status === 'done') {
message.success(`${info.file.name} file uploaded successfully.`);
} else if (status === 'error') {
message.error(`${info.file.name} file upload failed.`);
}
};
function handleDrop(e: DragEvent) {
console.log(e);
}
</script>
<style scoped lang="less" src="./index.scss">
</style>

16
src/components/CommentReply/src/MessageReport/index.scss Normal file
View File

@@ -0,0 +1,16 @@
.steps-content {
margin-top: 16px;
border: 1px dashed #e9e9e9;
border-radius: 10px;
background-color: #fafafa;
min-height: 200px;
text-align: center;
//padding-top: 80px;
}
.steps-action {
display: flex;
flex-direction: row;
justify-content: flex-end;
margin-top: 24px;
}

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

@@ -155,7 +155,6 @@ const replySubmitDebounced = useDebounceFn(replySubmit, 500);
*/
async function replySubmit(point: any) {
if (replyContent.value.trim() === "") {
message.error(t('comment.commentContentNotEmpty'));
return;
}
if (comment.imageList.length > 3) {

8
src/components/CommentReply/src/ReplyList/ReplyList.vue
View File

@@ -79,7 +79,7 @@
</AButton>
<template #overlay>
<AMenu>
<AMenuItem key="report">
<AMenuItem key="report" @click="showMessageReport = true">
<WarningOutlined/>
{{ t('comment.report') }}
</AMenuItem>
@@ -106,6 +106,9 @@
</AFlex>
<AEmpty :description="null" v-show="!comment.replyList.comments"/>
</ASpin>
<AModal v-model:open="showMessageReport" :title="t('comment.report')" :width="600" :footer="null">
<MessageReport/>
</AModal>
</AFlex>
</template>
<script lang="ts" setup>
@@ -123,6 +126,7 @@ import {useI18n} from "vue-i18n";
import useStore from "@/store";
import ReplyReply from "@/components/CommentReply/src/ReplyReplyInput/ReplyReply.vue";
import {useThrottleFn} from "@vueuse/core";
import MessageReport from "@/components/CommentReply/src/MessageReport/MessageReport.vue";
const {t} = useI18n();
@@ -135,7 +139,7 @@ const props = defineProps({
required: true
}
});
const showMessageReport = ref<boolean>(false);
/**
* 格式化时间
* @param dateString

2
src/components/CommentReply/src/ReplyList/index.scss
View File

@@ -1,7 +1,7 @@
.reply-item-child {
margin-top: 10px;
border-radius: 10px;
background-color: var(--background-color);
background-color: var(--comment-child-background-color);
padding: 10px;
.reply-pagination-child {

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

@@ -166,7 +166,6 @@ const replyReplySubmitThrottled = useThrottleFn(replyReplySubmit, 1000);
*/
async function replyReplySubmit(point: any) {
if (replyReplyContent.value.trim() === "") {
message.error(t('comment.commentContentNotEmpty'));
return;
}
if (comment.imageList.length > 3) {

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

@@ -11,6 +11,7 @@
transition: background-color 0.3s;
z-index: 3;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
border-radius: 20px;
.header-logo-container {
min-width: 280px;

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

@@ -34,6 +34,7 @@ export const useCommentStore = defineStore(
const uploadLoading = ref<boolean>(false);
const emojiList = ref<any[]>(QQ_EMOJI);
/**
* 获取评论列表
* @param params

13
src/utils/alova/service.ts
View File

@@ -50,7 +50,6 @@ export const service = createAlova({
if (!method.meta?.ignoreToken) {
const user = useStore().user;
method.config.headers.Authorization = `${import.meta.env.VITE_APP_TOKEN_KEY} ${user.user.accessToken}`;
method.config.headers['X-UID'] = user.user.uid;
}
const lang = useStore().lang;
method.config.headers['Accept-Language'] = lang.lang || 'zh';
@@ -77,11 +76,15 @@ export const service = createAlova({
title: i18n.global.t('error.loginExpired'),
content: i18n.global.t('error.authTokenExpired'),
onOk() {
window.location.href = '/login';
setTimeout(() => {
window.location.href = '/login';
},2000);
},
onCancel() {
window.location.href = '/login';
}
// onCancel() {
// setTimeout(() => {
// window.location.href = '/login';
// },2000);
// }
});
return Promise.reject(response.data);
}

2
src/views/Forget/ForgetPage.vue
View File

@@ -299,7 +299,7 @@ async function sendMessageByPhone(param: any): Promise<boolean> {
message.success(t('login.sendCaptchaSuccess'));
return true;
} else {
message.error(res.data);
message.error(res.message);
return false;
}
}

6
src/views/Login/LoginPage.vue
View File

@@ -338,7 +338,7 @@ async function sendCaptcha() {
});
})
.catch((error: any) => {
console.log('error', error);
console.error('error', error);
});
}
@@ -359,7 +359,7 @@ async function accountLoginSubmit() {
});
})
.catch((error: any) => {
console.log('error', error);
console.error('error', error);
});
}
@@ -476,7 +476,7 @@ async function checkAccountLoginCaptcha(angle: number) {
}, 1000);
} else {
loginLoading.value = false;
message.error(t('login.loginError'));
message.error(res.message);
}
}

2
src/views/Main/MainPage.vue
View File

@@ -13,6 +13,7 @@ import Header from "@/layout/default/Header/Header.vue";
import {notification} from "ant-design-vue";
import {SmileOutlined} from "@ant-design/icons-vue";
const websocket = useStore().websocket;
const userInfo = useStore().user;
const wsOptions = {
@@ -30,7 +31,6 @@ onMounted(() => {
});
});
});
onUnmounted(() => {
websocket.close(false);
});