Skip to content

Commit

Permalink
feat: 审核
Browse files Browse the repository at this point in the history
  • Loading branch information
Soulter committed Apr 17, 2024
1 parent b5b6f45 commit 4262b60
Show file tree
Hide file tree
Showing 3 changed files with 292 additions and 63 deletions.
130 changes: 83 additions & 47 deletions frontend/src/components/PostCard.vue
Original file line number Diff line number Diff line change
@@ -1,44 +1,32 @@
<template>
<v-card
class="mx-auto postcard"
:color="backgrouldColor"
max-width="400"
style="border-radius: 10px; color: #fff"
>
<v-card class="mx-auto postcard" :color="backgrouldColor" max-width="400" style="border-radius: 10px; color: #fff">
<div style="width: 100%; padding: 8px 8px 0px 8px">
<div style="display: flex; align-items: center; justify-content: space-between;">
<div style="display: flex; align-items: center;">
<v-icon color="white" style="font-size: 25px">mdi-pin</v-icon>
<h3 style="margin-left: 8px">稿件</h3>
<h3 style="margin-left: 8px">稿件 #{{ post.id }}</h3>
</div>
<!-- 取消投稿 -->
<v-btn v-if="post.status == '待审核'" text="撤回" @click="recall" variant="plain"></v-btn>
<v-btn v-if="typ === 'self' && post.status == '待审核'" text="撤回" @click="recall" variant="plain"></v-btn>
</div>

</div>

<v-card-text class="py-2" style="font-size: 16px; font-weight: bold; line-height: 1.5; word-spacing: 2px">
{{post.text}}
{{ post.text }}
</v-card-text>

<!-- 图片显示,横向滑动,圆角 -->
<div style="display: flex; margin-left: 16px; margin-right: 16px; margin-top: 8px; overflow-x: auto; white-space: nowrap;">
<img
v-for="img in post.images"
:key="img"
:src="img"
style="border-radius: 10px; margin-right: 8px; width: 100px; height: 100px; object-fit: cover"
/>
<div
style="display: flex; margin-left: 16px; margin-right: 16px; margin-top: 8px; overflow-x: auto; white-space: nowrap;">
<img v-for="img in post.images" :key="img" :src="img"
style="border-radius: 10px; margin-right: 8px; width: 100px; height: 100px; object-fit: cover" />
</div>

<v-card-actions>
<v-list-item class="w-100">
<template v-slot:prepend>
<v-avatar
v-if="!post.anon"
color="grey-darken-3"
:image="avatarBaseUrl + post.uin + '&s=100'"
></v-avatar>
<v-avatar v-if="!post.anon" color="grey-darken-3" :image="avatarBaseUrl + post.uin + '&s=100'"></v-avatar>
<span v-else style="font-size: 36px; margin-right: 16px">🫥</span>
</template>

Expand All @@ -54,41 +42,89 @@
<span class="me-1">·</span>
<v-icon class="me-1" icon="mdi-share-variant"></v-icon>
<span class="subheading">45</span> -->
<span class="subheading" style="font-weight: bold">{{ post.status }}</span>
<span v-if="typ === 'self'" class="subheading" style="font-weight: bold">{{ post.status }}</span>
<!-- <v-select v-else v-model="post.status" label="标记为" :items="filterStatus" variant="outlined" size="small"
@update:model-value="updateJudgePost">
</v-select> -->

<v-menu v-else>
<template v-slot:activator="{ props }">
<v-btn v-bind="props">
标记为
</v-btn>
</template>
<v-list @click:select="updateJudgePost">
<v-list-item v-for="(item, index) in filterStatus" :key="index" :value="index">
<v-list-item-title>{{ item }}</v-list-item-title>
</v-list-item>
</v-list>
</v-menu>
</div>
</template>
</v-list-item>
</v-card-actions>
</v-card>

<v-dialog v-model="dialog" variant="outlined" persistent>
<v-card
title="拒绝原因">
<v-card-text>
<v-text-field v-model="reason" label="拒绝原因" outlined></v-text-field>
</v-card-text>
<template v-slot:actions>
<v-btn text="取消" @click="dialog = false"></v-btn>
<v-btn class="ms-auto" text="OK" @click="dialog = false; emitJudgePost()"></v-btn>
</template>
</v-card>
</v-dialog>
</template>

<script>
export default {
name: 'PostCard',
props: ['post'],
data() {
return {
backgrouldColor: "",
avatarBaseUrl: "http://q1.qlogo.cn/g?b=qq&nk="
}
},
mounted() {
this.backgrouldColor = this.randomColor()
},
methods: {
randomColor() {
let colors = ["#FFC107", "#42A5F5", "#9CCC65", "#F06292", "#76FF03", "#9E9E9E", "#8D6E63"]
return colors[Math.floor(Math.random() * colors.length)]
},
recall() {
this.$emit('recall', this.post.id)
}
}
export default {
name: 'PostCard',
props: ['post', 'typ'],
data() {
return {
dialog: false,
reason: "",
filterStatus: ['通过', '拒绝'],
backgrouldColor: "",
avatarBaseUrl: "http://q1.qlogo.cn/g?b=qq&nk="
}
},
mounted() {
this.backgrouldColor = this.randomColor()
},
methods: {
randomColor() {
let colors = ["#FFC107", "#42A5F5", "#9CCC65", "#F06292", "#76FF03", "#9E9E9E", "#8D6E63"]
return colors[Math.floor(Math.random() * colors.length)]
},
recall() {
this.$emit('recall', this.post.id)
},
updateJudgePost(e) {
// console.log(e)
let status = this.filterStatus[e.id]
this.post.status = status
if (status === '拒绝') {
this.dialog = true
} else {
this.emitJudgePost()
}
},
emitJudgePost() {
this.post.reason = this.reason
this.$emit('updateJudgePost', this.post)
}
}
}
</script>

<style>
.postcard {
box-shadow: 0px 10px 15px -3px rgba(0,0,0,0.1);
}
.postcard {
margin-bottom: 16px;
box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
}
</style>
58 changes: 57 additions & 1 deletion frontend/src/pages/service.vue
Original file line number Diff line number Diff line change
@@ -1,10 +1,39 @@
<template>

<BottomNavBar v-model="value" @input="go" />

·
<div style="padding: 16px;">

<h1 style="margin-bottom: 16px">🎲 服务</h1>

<h2 style="margin-top: 16px">🙂 账号服务</h2>
<v-dialog max-width="500">
<template v-slot:activator="{ props: activatorProps }">
<div class="rect1" style="background-color: #2196F3;" v-bind="activatorProps">
<div>
<p style="font-weight: bold; font-size: 16px">修改密码</p>
</div>
<a style="font-size: 16px; cursor:pointer; font-weight: bold;">></a>
</div>
</template>

<template v-slot:default="{ isActive }">
<v-card title="修改密码">

<v-card-text>
<v-text-field variant="outlined" v-model="password" label="新密码" type="password"></v-text-field>
</v-card-text>

<v-card-actions>
<v-spacer></v-spacer>
<v-btn text="取消" @click="isActive.value = false"></v-btn>
<v-btn text="确认" @click="isActive.value = false; updatePassword()"></v-btn>
</v-card-actions>
</v-card>
</template>
</v-dialog>

<h2 style="margin-top: 16px">🤩 推荐网站</h2>
<div class="rect1" style="background-color: #2196F3;">
<div>
<p style="font-weight: bold; font-size: 16px">🗺️ 桂林中学毕业生去向分布图</p>
Expand All @@ -30,6 +59,7 @@ export default {
},
data() {
return {
password: "",
snackbar: {
show: false,
text: '',
Expand All @@ -52,6 +82,27 @@ export default {
go(url) {
// this.displayInnerWindow = url
window.open(url, '_blank')
},
updatePassword() {
if (this.password.length < 6) {
this.toast('密码长度至少为6位')
return
}
this.$axios.put('/v1/account/update-pwd', {
"new_passwd": this.password
})
.then(res => {
if (res.data.code === 0) {
this.toast('密码修改成功', 'success')
} else {
this.toast('密码修改失败:' + res.data.msg)
}
})
.catch(err => {
this.toast('失败:' + err.response.data.msg)
console.error(err)
})
}
}
}
Expand All @@ -60,6 +111,7 @@ export default {

<style>
.rect1 {
cursor: pointer;
padding: 16px;
font-size: 18px;
border-radius: 7px;
Expand All @@ -70,5 +122,9 @@ export default {
display: flex;
justify-content: space-between;
align-items: center;
transition: box-shadow 0.2s;
}
.rect1:hover {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
</style>
Loading

0 comments on commit 4262b60

Please sign in to comment.