提交 c222f0bb 编写于 作者: 檀越@新空间's avatar 檀越@新空间 🐭

fix:更新前端

上级 231cfdce
import axios from 'axios'
const BASE_URL = 'http://localhost:80'
// 创建一个名为 ApiService 的对象,包含您的异步方法
const ApiService = {
......@@ -107,19 +108,26 @@ const ApiService = {
return await axios.get(BASE_URL + '/csdn/followFans/deleteFollow')
},
//我的图片
async queryPic(currentPage, pageSize, picType) {
return await axios.get(BASE_URL + '/picInfo/page', {
params: {
page: currentPage,
pageSize: pageSize,
picType: picType,
},
async queryPic(currentPage, pageSize, formInline) {
return await axios.post(BASE_URL + '/picInfo/page', {
page: currentPage,
pageSize: pageSize,
type: formInline.type == '全部' ? '' : formInline.type,
picName: formInline.picName,
})
},
async editPicConfirm(currentRowId, type) {
async editPicConfirm(currentRowId, type, picName) {
return await axios.post(BASE_URL + '/picInfo/update', {
id: currentRowId,
type: type,
picName: picName,
})
},
async batchUpdatePic(ids, type) {
return await axios.post(BASE_URL + '/picInfo/batchUpdatePic', {
ids: ids,
type: type,
})
},
//余额管理
......@@ -149,5 +157,38 @@ const ApiService = {
endDate: formInline.accountDate != null ? formInline.accountDate[1] : '',
})
},
//用户管理
async multiTriplet(userNames) {
return await axios.post(BASE_URL + '/csdn/multiTriplet', userNames)
},
async autoReply() {
return await axios.get(BASE_URL + '/csdn/autoReply')
},
async singleTriplet(userName) {
return await axios.get(BASE_URL + '/csdn/singleTriplet?username=' + userName)
},
//私信管理
async dealMessageOne(userName) {
return await axios.get(BASE_URL + '/csdn/message/dealMessageOne?userName=' + userName)
},
async dealMessage() {
return await axios.get(BASE_URL + '/csdn/message/dealMessage')
},
async dealLikeCollect() {
return await axios.get(BASE_URL + '/csdn/likeCollect/dealLikeCollect')
},
async acquireMessage() {
return await axios.get(BASE_URL + '/csdn/message/acquireMessage')
},
async messagePage(currentPage, pageSize, formInline) {
return await axios.post('http://localhost:80/csdn/message/page', {
page: currentPage,
pageSize: pageSize,
userName: formInline.userName,
nickName: formInline.nickName,
hasReplied: formInline.hasRepliedInfo == -1 ? null : formInline.hasRepliedInfo,
})
},
}
export default ApiService
<template>
<div class="login-container">
<div class="login-box">
<!-- 头像区域 -->
<div class="text-center avatar-box">
<img src="../assets/kwan.png" class="img-thumbnail avatar" alt="kwan的解忧杂货铺" />
</div>
<div class="login-container">
<div class="login-box">
<!-- 头像区域 -->
<div class="text-center avatar-box">
<img src="../assets/kwan.png" class="img-thumbnail avatar" alt="kwan的解忧杂货铺"/>
</div>
<!-- 表单区域 -->
<div class="form-login p-4">
<!-- 登录名称 -->
<div class="form-group form-inline">
<label for="username">登录名称</label>
<input type="text" class="form-control ml-2" id="username" placeholder="请输入登录名称" autocomplete="off" v-model.trim="username" />
</div>
<!-- 登录密码 -->
<div class="form-group form-inline">
<label for="password">登录密码</label>
<input type="password" class="form-control ml-2" id="password" placeholder="请输入登录密码" v-model.trim="password" />
</div>
<!-- 登录和重置按钮 -->
<div class="form-group form-inline d-flex justify-content-end">
<button type="button" class="btn btn-secondary mr-2" @click="reset">重置</button>
<button type="button" class="btn btn-primary" @click="login">登录</button>
</div>
</div>
</div>
</div>
<!-- 表单区域 -->
<div class="form-login p-4">
<!-- 登录名称 -->
<div class="form-group form-inline">
<label for="username">登录名称</label>
<input type="text" class="form-control ml-2" id="username" placeholder="请输入登录名称" autocomplete="off"
v-model.trim="username"/>
</div>
<!-- 登录密码 -->
<div class="form-group form-inline">
<label for="password">登录密码</label>
<input type="password" class="form-control ml-2" id="password" placeholder="请输入登录密码" v-model.trim="password"/>
</div>
<!-- 登录和重置按钮 -->
<div class="form-group form-inline d-flex justify-content-end">
<button type="button" class="btn btn-secondary mr-2" @click="reset">重置</button>
<button type="button" class="btn btn-primary" @click="login">登录</button>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'MyLogin',
data() {
return {
username: '',
password: '',
}
name: 'MyLogin',
data() {
return {
username: '',
password: '',
}
},
methods: {
reset() {
this.username = ''
this.password = ''
},
methods: {
reset() {
this.username = ''
this.password = ''
},
login() {
if (this.username === 'admin' && this.password === '888888') {
// 登录成功
// 1. 存储 token
localStorage.setItem('token', 'Bearer xxxx')
// 2. 跳转到后台主页
this.$router.push('/home')
} else {
// 登录失败
localStorage.removeItem('token')
this.errorMsg('登录失败,请检查您的用户名或密码;由于用户名密码是写死的,需要在项目中查看!!!')
}
},
errorMsg(msg) {
this.$message({
showClose: true,
message: msg,
type: 'error',
})
},
login() {
if (this.username === 'admin' && this.password === '716288') {
// 登录成功
// 1. 存储 token
localStorage.setItem('token', 'Bearer xxxx')
// 2. 跳转到后台主页
this.$router.push('/home')
} else {
// 登录失败
localStorage.removeItem('token')
this.errorMsg('登录失败,请检查您的用户名或密码;由于用户名密码是写死的,需要在项目中查看!!!')
}
},
errorMsg(msg) {
this.$message({
showClose: true,
message: msg,
type: 'error',
})
},
},
}
</script>
<style lang="less" scoped>
.login-container {
background-color: #35495e;
height: 100%;
.login-box {
width: 400px;
height: 250px;
background-color: #fff;
border-radius: 3px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
box-shadow: 0 0 6px rgba(255, 255, 255, 0.5);
.form-login {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
box-sizing: border-box;
}
}
background-color: #35495e;
height: 100%;
.login-box {
width: 400px;
height: 250px;
background-color: #fff;
border-radius: 3px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
box-shadow: 0 0 6px rgba(255, 255, 255, 0.5);
.form-login {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
box-sizing: border-box;
}
}
}
.form-control {
flex: 1;
flex: 1;
}
.avatar-box {
position: absolute;
width: 100%;
top: -65px;
left: 0;
.avatar {
width: 120px;
height: 120px;
border-radius: 50% !important;
box-shadow: 0 0 6px #efefef;
}
position: absolute;
width: 100%;
top: -65px;
left: 0;
.avatar {
width: 120px;
height: 120px;
border-radius: 50% !important;
box-shadow: 0 0 6px #efefef;
}
}
</style>
\ No newline at end of file
......@@ -2,73 +2,14 @@
<div>
<el-container>
<el-main>
<el-dialog title="新增算法问题" :visible.sync="dialogFormVisible" style="width: 100%">
<el-form :model="form" class="custom-form">
<el-form-item label="算法问题" :label-width="formLabelWidth" class="form-item">
<el-input v-model="form.questionName" autocomplete="off" style="width: 100%"></el-input>
</el-form-item>
<el-form-item label="问题类型" :label-width="formLabelWidth" class="form-item">
<el-select v-model="form.questionType" placeholder="请选择问题类型">
<el-option v-for="item in allOptions" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="重要程度" :label-width="formLabelWidth" class="form-item">
<el-input v-model="form.degreeOfImportance" autocomplete="off" style="width: 100%"></el-input>
</el-form-item>
<el-form-item label="难易程度" :label-width="formLabelWidth" class="form-item">
<el-input v-model="form.degreeOfDifficulty" autocomplete="off" style="width: 100%"></el-input>
</el-form-item>
<el-form-item label="难易分数" :label-width="formLabelWidth" class="form-item">
<el-input v-model="form.difficultyOfScore" autocomplete="off" style="width: 100%"></el-input>
</el-form-item>
<el-form-item label="力扣题号" :label-width="formLabelWidth" class="form-item">
<el-input v-model="form.leetcodeNumber" autocomplete="off" style="width: 100%"></el-input>
</el-form-item>
<el-form-item label="力扣链接" :label-width="formLabelWidth" class="form-item">
<el-input v-model="form.leetcodeLink" autocomplete="off" style="width: 100%"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="handleConfirm(0)">确 定</el-button>
</div>
</el-dialog>
<el-dialog class="red-title" :visible.sync="dialogMutiFormVisible">
<div class="red-title" slot="title">批量新增算法问题(多个问题换行填写)</div>
<el-form :model="form" class="custom-form">
<el-form-item label="算法问题" :label-width="formLabelWidth" class="form-item">
<el-input type="textarea" v-model="form.questionName" autocomplete="off" :rows="5" :cols="30" style="width: 100%"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogMutiFormVisible = false">取 消</el-button>
<el-button type="primary" @click="handleConfirm(1)">确 定</el-button>
</div>
</el-dialog>
<el-dialog title="随机一题" :visible.sync="randomFormVisible" style="width: 100%">
<el-descriptions class="margin-top" title="随机选择的题目如下:" :column="3" border>
<el-descriptions-item v-model="randomAlgorithmic.questionName">
<template slot="label">题目名称</template>
{{ randomAlgorithmic.questionName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">力扣题号</template>
{{ randomAlgorithmic.leetcodeNumber }}
</el-descriptions-item>
<el-descriptions-item show-overflow-tooltip>
<template slot="label">力扣链接</template>
<a :href="randomAlgorithmic.leetcodeLink" target="_blank">{{ randomAlgorithmic.leetcodeLink }}</a>
</el-descriptions-item>
</el-descriptions>
<div slot="footer" class="dialog-footer">
<el-button @click="randomFormVisible = false">取 消</el-button>
</div>
</el-dialog>
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item>
<el-input clearable v-model="formInline.questionName" placeholder="请输入问题" @keydown.enter.native="algorithmPage"></el-input>
</el-form-item>
<el-select v-model="formInline.questionType" placeholder="请选择" @change="algorithmPage">
<el-select v-model="formInline.questionType" clearable placeholder="请选择" @change="algorithmPage">
<el-option v-for="item in questionType" :key="item" :label="item" :value="item"></el-option>
</el-select>
<el-select v-model="formInline.tag" clearable multiple placeholder="请选择">
<el-option v-for="item in allOptions" :key="item" :label="item" :value="item"></el-option>
</el-select>
<el-form-item>
......@@ -76,12 +17,79 @@
</el-form-item>
<el-form-item>
<el-button type="primary" @click="prepareRandom">随机一题</el-button>
<el-dialog title="随机一题" :visible.sync="randomFormVisible" style="width: 100%">
<el-descriptions class="margin-top" title="随机选择的题目如下:" :column="3" border>
<el-descriptions-item v-model="randomAlgorithmic.questionName">
<template slot="label">题目名称</template>
{{ randomAlgorithmic.questionName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">力扣题号</template>
{{ randomAlgorithmic.leetcodeNumber }}
</el-descriptions-item>
<el-descriptions-item show-overflow-tooltip>
<template slot="label">力扣链接</template>
<a :href="randomAlgorithmic.leetcodeLink" target="_blank">{{ randomAlgorithmic.leetcodeLink }}</a>
</el-descriptions-item>
</el-descriptions>
<div slot="footer" class="dialog-footer">
<el-button @click="randomFormVisible = false">取 消</el-button>
</div>
</el-dialog>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="prepareAdd">新增</el-button>
<el-dialog title="新增算法问题" :visible.sync="dialogFormVisible" style="width: 100%">
<el-form :model="form" class="custom-form">
<el-form-item label="算法问题" :label-width="formLabelWidth" class="form-item">
<el-input v-model="form.questionName" autocomplete="off" style="width: 100%"></el-input>
</el-form-item>
<el-form-item label="问题标签" :label-width="formLabelWidth" class="form-item">
<el-select v-model="form.tag" multiple placeholder="请选择">
<el-option v-for="item in allOptions" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="问题集" :label-width="formLabelWidth" class="form-item">
<el-select v-model="form.questionType" placeholder="请选择">
<el-option v-for="item in questionType" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="重要程度" :label-width="formLabelWidth" class="form-item">
<el-input v-model="form.degreeOfImportance" autocomplete="off" style="width: 100%"></el-input>
</el-form-item>
<el-form-item label="难易程度" :label-width="formLabelWidth" class="form-item">
<el-input v-model="form.degreeOfDifficulty" autocomplete="off" style="width: 100%"></el-input>
</el-form-item>
<el-form-item label="难易分数" :label-width="formLabelWidth" class="form-item">
<el-input v-model="form.difficultyOfScore" autocomplete="off" style="width: 100%"></el-input>
</el-form-item>
<el-form-item label="力扣题号" :label-width="formLabelWidth" class="form-item">
<el-input v-model="form.leetcodeNumber" autocomplete="off" style="width: 100%"></el-input>
</el-form-item>
<el-form-item label="力扣链接" :label-width="formLabelWidth" class="form-item">
<el-input v-model="form.leetcodeLink" autocomplete="off" style="width: 100%"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="handleConfirm(0)">确 定</el-button>
</div>
</el-dialog>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="prepareMutiAdd">批量新增</el-button>
<el-dialog class="red-title" :visible.sync="dialogMutiFormVisible">
<div class="red-title" slot="title">批量新增算法问题(多个问题换行填写)</div>
<el-form :model="form" class="custom-form">
<el-form-item label="算法问题" :label-width="formLabelWidth" class="form-item">
<el-input type="textarea" v-model="form.questionName" autocomplete="off" :rows="5" :cols="30" style="width: 100%"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogMutiFormVisible = false">取 消</el-button>
<el-button type="primary" @click="handleConfirm(1)">确 定</el-button>
</div>
</el-dialog>
</el-form-item>
</el-form>
<el-table border :data="algorithmicList" v-loading="loading">
......@@ -92,11 +100,23 @@
</template>
</el-table-column>
<el-table-column prop="leetcodeNumber" label="力扣题号" width="100" show-overflow-tooltip></el-table-column>
<el-table-column prop="questionType" label="问题类型" show-overflow-tooltip align="center">
<el-table-column prop="tags" label="标签" width="150px" show-overflow-tooltip>
<template slot-scope="scope">
<div class="tag-flex">
<div :style="{ 'margin-left': index > 0 ? '2px' : '0', 'margin-bottom': '2px' }" v-for="(tag, index) in scope.row.tags" :key="index">
<el-tag :type="getTagType(tag)">{{ tag }}</el-tag>
</div>
</div>
</template>
</el-table-column>
<el-table-column prop="questionType" label="问题集" show-overflow-tooltip align="center">
<template slot-scope="scope">
<span :style="{ color: getColorForValue(scope.row.questionType) }" v-html="scope.row.questionType"></span>
</template>
</el-table-column>
<el-table-column sortable prop="degreeOfImportance" label="重要程度" show-overflow-tooltip></el-table-column>
<el-table-column prop="degreeOfDifficulty" label="难易程度" show-overflow-tooltip></el-table-column>
<el-table-column prop="difficultyOfScore" label="难易分数" show-overflow-tooltip></el-table-column>
......@@ -108,17 +128,25 @@
</el-table-column>
<el-table-column prop="操作" label="操作">
<template slot-scope="props">
<el-button type="success" @click.prevent="preEdit(props.row.id, props.row.questionName, props.row.questionType, props.row.degreeOfImportance, props.row.degreeOfDifficulty, props.row.difficultyOfScore, props.row.leetcodeNumber, props.row.leetcodeLink)" width="200">编辑</el-button>
<el-button type="success" @click.prevent="preEdit(props.row.id, props.row.questionName, props.row.questionType, props.row.tags, props.row.degreeOfImportance, props.row.degreeOfDifficulty, props.row.difficultyOfScore, props.row.leetcodeNumber, props.row.leetcodeLink)" width="200">编辑</el-button>
<el-dialog title="编辑算法问题" :visible.sync="editVisible">
<el-form :model="form">
<el-form-item label="算法问题" :label-width="formLabelWidth" class="form-item">
<el-input v-model="form.questionName" autocomplete="off" style="width: 100%"></el-input>
</el-form-item>
<el-form-item label="问题类型" :label-width="formLabelWidth" class="form-item">
<el-select v-model="form.questionType" placeholder="请选择活动区域">
<el-form-item label="问题标签" :label-width="formLabelWidth" class="form-item">
<el-select v-model="form.tag" multiple placeholder="请选择">
<el-option v-for="item in allOptions" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="问题集" :label-width="formLabelWidth" class="form-item">
<el-select v-model="form.questionType" placeholder="请选择">
<el-option v-for="item in questionType" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="重要程度" :label-width="formLabelWidth" class="form-item">
<el-input v-model="form.degreeOfImportance" autocomplete="off" style="width: 100%"></el-input>
</el-form-item>
......@@ -161,326 +189,358 @@
<script>
import axios from 'axios'
export default {
name: 'MyInterview',
name: 'MyInterview',
data() {
return {
// 用户列表数据
algorithmicList: [],
randomAlgorithmic: {
questionName: '',
leetcodeNumber: '',
leetcodeLink: '',
},
loading: false,
elementui_page_component_key: 0,
currentPage: Number(localStorage.getItem('algorithmLastPage')) || 1,
pageSize: 9,
total: 0,
formInline: {
questionName: '',
questionType: '',
tag: [],
},
allOptions: ['hash表', '递归', '数组', '', '回溯', '双指针', '二分法', '滑动窗口', '动态规划', '链表', '二叉树', '组合'],
questionType: ['HOT-100', '周赛', '网络'],
// 新增的内容
dialogFormVisible: false,
randomFormVisible: false,
dialogMutiFormVisible: false,
form: {
questionName: '',
questionType: '',
degreeOfImportance: 5,
degreeOfDifficulty: 1,
difficultyOfScore: 1200,
leetcodeNumber: '',
leetcodeLink: '',
tag: [],
},
formLabelWidth: '120px',
dialogVisible: false,
editVisible: false,
currentRowId: null,
colorMap: {}, // 创建一个空的颜色映射关系对象
}
},
watch: {
formInline: {
handler(newVal, oldVal) {
this.currentPage = 1
localStorage.setItem('algorithmLastPage', this.currentPage)
this.algorithmPage()
},
deep: true,
},
// 监听currentPage的变化,将新值保存到localStorage中
currentPage(newPage) {
localStorage.setItem('algorithmLastPage', newPage.toString())
},
},
created() {
//获取问题类型的枚举
this.algorithmPage()
},
mounted() {
this.currentPage = 1
},
methods: {
prepareAdd() {
this.form.questionName = ''
this.form.questionType = ''
this.dialogFormVisible = true
},
prepareRandom() {
this.randomAlgorithmic = []
this.randomFormVisible = true
this.interviewRandom()
},
prepareMutiAdd() {
this.form.questionName = ''
this.form.questionType = ''
this.dialogMutiFormVisible = true
},
prepareDelete(id) {
this.currentRowId = id
this.dialogVisible = true
},
preEdit(id, questionName, questionType, tags, degreeOfImportance, degreeOfDifficulty, difficultyOfScore, leetcodeNumber, leetcodeLink) {
this.form.questionName = questionName
this.form.degreeOfImportance = degreeOfImportance
this.form.degreeOfDifficulty = degreeOfDifficulty
this.form.difficultyOfScore = difficultyOfScore
this.form.leetcodeNumber = leetcodeNumber
this.form.leetcodeLink = leetcodeLink
this.form.questionType = questionType
this.form.tag = tags
this.currentRowId = id
this.editVisible = true
},
handleClose(done) {
this.$confirm('确认关闭?')
.then((_) => {
done()
})
.catch((_) => {})
},
handleConfirm(addType) {
this.dialogFormVisible = false // 关闭对话框
this.dialogMutiFormVisible = false
this.addQuestion(addType) // 发送请求
},
data() {
return {
// 用户列表数据
algorithmicList: [],
randomAlgorithmic: {
questionName: '',
leetcodeNumber: '',
leetcodeLink: '',
},
loading: false,
elementui_page_component_key: 0,
currentPage: Number(localStorage.getItem('algorithmLastPage')) || 1,
pageSize: 9,
total: 0,
formInline: {
questionName: '',
questionType: '',
},
allOptions: ['hash表', '回溯', '双指针', '二分法', '滑动窗口', '动态规划', '链表', '二叉树'],
// 新增的内容
dialogFormVisible: false,
randomFormVisible: false,
dialogMutiFormVisible: false,
form: {
questionName: '',
questionType: '',
degreeOfImportance: 5,
degreeOfDifficulty: 1,
difficultyOfScore: 1200,
leetcodeNumber: '',
leetcodeLink: '',
},
formLabelWidth: '120px',
dialogVisible: false,
editVisible: false,
currentRowId: null,
colorMap: {}, // 创建一个空的颜色映射关系对象
}
},
watch: {
formInline: {
handler(newVal, oldVal) {
this.currentPage = 1
localStorage.setItem('algorithmLastPage', this.currentPage)
this.algorithmPage()
},
deep: true,
},
// 监听currentPage的变化,将新值保存到localStorage中
currentPage(newPage) {
localStorage.setItem('algorithmLastPage', newPage.toString())
},
},
created() {
//获取问题类型的枚举
this.algorithmPage()
},
mounted() {
this.currentPage = 1
},
methods: {
prepareAdd() {
this.form.questionName = ''
this.form.questionType = ''
this.dialogFormVisible = true
},
prepareRandom() {
this.randomAlgorithmic = []
this.randomFormVisible = true
this.interviewRandom()
},
prepareMutiAdd() {
this.form.questionName = ''
this.form.questionType = ''
this.dialogMutiFormVisible = true
},
async algorithmPage() {
this.loading = true
const { data: res } = await axios.post('http://localhost:80/algorithmicProblem/page', {
page: this.currentPage,
pageSize: this.pageSize,
questionName: this.formInline.questionName,
questionType: this.formInline.questionType,
tag: this.formInline.tag,
})
if (res.code === 200) {
this.total = res.result.totalElements
res.result.content.forEach((item) => {
item.tags = item && item.tag ? item.tag.split(',') : []
})
this.algorithmicList = res.result.content
}
this.loading = false
},
prepareDelete(id) {
this.currentRowId = id
this.dialogVisible = true
},
preEdit(id, questionName, questionType, degreeOfImportance, degreeOfDifficulty, difficultyOfScore, leetcodeNumber, leetcodeLink) {
this.form.questionName = questionName
this.form.degreeOfImportance = degreeOfImportance
this.form.degreeOfDifficulty = degreeOfDifficulty
this.form.difficultyOfScore = difficultyOfScore
this.form.leetcodeNumber = leetcodeNumber
this.form.leetcodeLink = leetcodeLink
this.form.questionType = questionType
this.currentRowId = id
this.editVisible = true
},
handleClose(done) {
this.$confirm('确认关闭?')
.then((_) => {
done()
})
.catch((_) => {})
},
handleConfirm(addType) {
this.dialogFormVisible = false // 关闭对话框
this.dialogMutiFormVisible = false
this.addQuestion(addType) // 发送请求
},
async addQuestion(addType) {
try {
this.loading = true
const { data: res } = await axios.post('http://localhost:80/algorithmicProblem/add', {
addType: addType,
questionName: this.form.questionName,
questionType: this.form.questionType,
tag: this.form.tag,
degreeOfImportance: this.form.degreeOfImportance,
degreeOfDifficulty: this.form.degreeOfDifficulty,
difficultyOfScore: this.form.difficultyOfScore,
leetcodeNumber: this.form.leetcodeNumber,
leetcodeLink: this.form.leetcodeLink,
})
if (res.code === 200) {
this.currentPage = 1
this.form.questionName = ''
this.form.questionType = 0
this.form.degreeOfImportance = 5
this.form.degreeOfDifficulty = 1
this.form.difficultyOfScore = 1200
this.form.leetcodeNumber = ''
this.form.leetcodeLink = ''
this.form.tag = []
this.algorithmPage()
} else {
console.error('Received non-200 status code', res)
this.errorMsg(res.message)
}
} catch (error) {
console.error('An error occurred while adding the questionName:', error)
// 异常处理逻辑
} finally {
this.loading = false
}
},
async addQuestion(addType) {
try {
this.loading = true
const { data: res } = await axios.post('http://localhost:80/algorithmicProblem/add', {
addType: addType,
questionName: this.form.questionName,
questionType: this.form.questionType,
degreeOfImportance: this.form.degreeOfImportance,
degreeOfDifficulty: this.form.degreeOfDifficulty,
difficultyOfScore: this.form.difficultyOfScore,
leetcodeNumber: this.form.leetcodeNumber,
leetcodeLink: this.form.leetcodeLink,
})
if (res.code === 200) {
this.currentPage = 1
this.form.questionName = ''
this.form.questionType = 0
this.form.degreeOfImportance = 5
this.form.degreeOfDifficulty = 1
this.form.difficultyOfScore = 1200
this.form.leetcodeNumber = ''
this.form.leetcodeLink = ''
this.algorithmPage()
} else {
console.error('Received non-200 status code', res)
this.errorMsg(res.message)
}
} catch (error) {
console.error('An error occurred while adding the questionName:', error)
// 异常处理逻辑
} finally {
this.loading = false
}
},
errorMsg(msg) {
this.$message({
showClose: true,
message: msg,
type: 'error',
})
},
async editConfirm() {
try {
this.loading = true
const { data: res } = await axios.post('http://localhost:80/algorithmicProblem/update', {
id: this.currentRowId,
questionName: this.form.questionName,
questionType: this.form.questionType,
degreeOfImportance: this.form.degreeOfImportance,
degreeOfDifficulty: this.form.degreeOfDifficulty,
difficultyOfScore: this.form.difficultyOfScore,
leetcodeNumber: this.form.leetcodeNumber,
leetcodeLink: this.form.leetcodeLink,
})
if (res.code === 200) {
this.form.questionName = ''
this.form.questionType = 0
this.editVisible = false
currentRowId: null
this.algorithmPage()
} else {
console.error('Received non-200 status code', res)
}
} catch (error) {
console.error('An error occurred while adding the questionName:', error)
// 异常处理逻辑
} finally {
this.loading = false
}
},
async editConfirm() {
try {
this.loading = true
const { data: res } = await axios.post('http://localhost:80/algorithmicProblem/update', {
id: this.currentRowId,
questionName: this.form.questionName,
questionType: this.form.questionType,
degreeOfImportance: this.form.degreeOfImportance,
degreeOfDifficulty: this.form.degreeOfDifficulty,
difficultyOfScore: this.form.difficultyOfScore,
leetcodeNumber: this.form.leetcodeNumber,
leetcodeLink: this.form.leetcodeLink,
tag: this.form.tag,
})
if (res.code === 200) {
this.form.questionName = ''
this.form.questionType = 0
this.editVisible = false
currentRowId: null
this.algorithmPage()
} else {
console.error('Received non-200 status code', res)
}
} catch (error) {
console.error('An error occurred while adding the questionName:', error)
// 异常处理逻辑
} finally {
this.loading = false
}
},
async onDelete(id) {
this.dialogVisible = false
this.loading = true
const { data: res } = await axios.get('http://localhost:80/algorithmicProblem/delete', {
params: {
id: id,
},
})
this.algorithmPage()
this.loading = false
},
refreshPage() {
//获取问题类型的枚举
this.algorithmPage()
location.reload()
},
async onDelete(id) {
this.dialogVisible = false
this.loading = true
const { data: res } = await axios.get('http://localhost:80/algorithmicProblem/delete', {
params: {
id: id,
},
})
this.algorithmPage()
this.loading = false
},
refreshPage() {
//获取问题类型的枚举
this.algorithmPage()
location.reload()
},
async algorithmPage() {
this.loading = true
const { data: res } = await axios.get('http://localhost:80/algorithmicProblem/page', {
params: {
page: this.currentPage,
pageSize: this.pageSize,
questionName: this.formInline.questionName,
questionType: this.formInline.questionType,
},
})
if (res.code === 200) {
this.total = res.result.totalElements
this.algorithmicList = res.result.content
}
this.loading = false
},
async interviewRandom() {
this.loading = true
const { data: res } = await axios.get('http://localhost:80/algorithmicProblem/random', { params: {} })
if (res.code === 200) {
this.randomAlgorithmic.questionName = res.result.questionName
this.randomAlgorithmic.leetcodeNumber = res.result.leetcodeNumber
this.randomAlgorithmic.leetcodeLink = res.result.leetcodeLink
}
this.loading = false
},
handleCurrentChange(currentPage) {
this.currentPage = currentPage
this.algorithmPage()
},
getColorForValue(value) {
// 检查颜色映射关系中是否已经有该值对应的颜色
if (!this.colorMap[value]) {
// 如果没有,随机生成一个颜色并将其关联到该值
this.colorMap[value] = this.getRandomColor()
}
// 返回值对应的颜色
return this.colorMap[value]
},
getRandomColor() {
// 从颜色数组中随机选取一个颜色
const colorArray = [
'red',
'blue',
'green',
'purple',
'orange',
'pink',
'brown',
'magenta',
'maroon',
'navy',
'olive',
'teal',
'silver',
'gray',
'indigo',
'violet',
'coral',
'salmon',
'orchid',
'slategray',
'thistle',
'burlywood',
'cadetblue',
'chocolate',
'crimson',
'darkblue',
'darkcyan',
'darkgoldenrod',
'darkgray',
'darkgreen',
'darkkhaki',
'darkmagenta',
'darkolivegreen',
'darkorange',
'darkorchid',
'darkred',
'darksalmon',
'darkseagreen',
'darkslateblue',
'darkslategray',
'darkturquoise',
'darkviolet',
'deeppink',
'deepskyblue',
'dodgerblue',
'firebrick',
'forestgreen',
'fuchsia',
'hotpink',
'indianred',
'lightcoral',
'lightpink',
'lightsalmon',
'lightseagreen',
'lightskyblue',
'lightslategray',
'lightsteelblue',
'mediumaquamarine',
'mediumblue',
'mediumorchid',
'mediumpurple',
'mediumslateblue',
'mediumturquoise',
'mediumvioletred',
'midnightblue',
'orangered',
'palevioletred',
'peru',
'rosybrown',
'saddlebrown',
'seagreen',
'sienna',
'skyblue',
'slateblue',
'tan',
'thistle',
'tomato',
'violet',
]
const randomIndex = Math.floor(Math.random() * colorArray.length)
return colorArray[randomIndex]
},
},
async interviewRandom() {
this.loading = true
const { data: res } = await axios.get('http://localhost:80/algorithmicProblem/random', { params: {} })
if (res.code === 200) {
this.randomAlgorithmic.questionName = res.result.questionName
this.randomAlgorithmic.leetcodeNumber = res.result.leetcodeNumber
this.randomAlgorithmic.leetcodeLink = res.result.leetcodeLink
}
this.loading = false
},
handleCurrentChange(currentPage) {
this.currentPage = currentPage
this.algorithmPage()
},
getColorForValue(value) {
// 检查颜色映射关系中是否已经有该值对应的颜色
if (!this.colorMap[value]) {
// 如果没有,随机生成一个颜色并将其关联到该值
this.colorMap[value] = this.getRandomColor()
}
// 返回值对应的颜色
return this.colorMap[value]
},
getTagType(tag) {
switch (tag.trim()) {
case '链表':
case '二叉树':
case '':
case '数组':
return 'primary'
case 'hash表':
case '回溯':
case '双指针':
case '二分法':
return 'success'
case '滑动窗口':
case '动态规划':
return 'danger'
case '组合':
return 'warning'
default:
return 'info'
}
},
getRandomColor() {
// 从颜色数组中随机选取一个颜色
const colorArray = [
'red',
'blue',
'green',
'purple',
'orange',
'pink',
'brown',
'magenta',
'maroon',
'navy',
'olive',
'teal',
'silver',
'gray',
'indigo',
'violet',
'coral',
'salmon',
'orchid',
'slategray',
'thistle',
'burlywood',
'cadetblue',
'chocolate',
'crimson',
'darkblue',
'darkcyan',
'darkgoldenrod',
'darkgray',
'darkgreen',
'darkkhaki',
'darkmagenta',
'darkolivegreen',
'darkorange',
'darkorchid',
'darkred',
'darksalmon',
'darkseagreen',
'darkslateblue',
'darkslategray',
'darkturquoise',
'darkviolet',
'deeppink',
'deepskyblue',
'dodgerblue',
'firebrick',
'forestgreen',
'fuchsia',
'hotpink',
'indianred',
'lightcoral',
'lightpink',
'lightsalmon',
'lightseagreen',
'lightskyblue',
'lightslategray',
'lightsteelblue',
'mediumaquamarine',
'mediumblue',
'mediumorchid',
'mediumpurple',
'mediumslateblue',
'mediumturquoise',
'mediumvioletred',
'midnightblue',
'orangered',
'palevioletred',
'peru',
'rosybrown',
'saddlebrown',
'seagreen',
'sienna',
'skyblue',
'slateblue',
'tan',
'thistle',
'tomato',
'violet',
]
const randomIndex = Math.floor(Math.random() * colorArray.length)
return colorArray[randomIndex]
},
errorMsg(msg) {
this.$message({
showClose: true,
message: msg,
type: 'error',
})
},
},
}
</script>
......@@ -499,6 +559,7 @@ export default {
margin-top: 16px;
text-align: right;
}
.header-button-item {
margin-right: 15px;
font-size: 20px;
......@@ -524,11 +585,19 @@ export default {
cursor: pointer;
z-index: 999;
}
.custom-textarea {
width: 100%;
text-align: left;
}
.backtop:hover {
background-color: #0050a0;
}
.tag-flex {
display: flex;
width: 150px;
flex-wrap: wrap;
}
</style>
\ No newline at end of file
......@@ -124,7 +124,7 @@
</el-dialog>
</el-form-item>
</el-form>
<el-table ref="multipleTable" v-loading="loading" :data="articleInfoList" tooltip-effect="dark" style="width: 100%" @selection-change="handleSelectionChange">
<el-table border ref="multipleTable" v-loading="loading" :data="articleInfoList" tooltip-effect="dark" style="width: 100%" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="50"></el-table-column>
<el-table-column prop="articleId" label="文章id" show-overflow-tooltip></el-table-column>
<el-table-column prop="userName" label="用户名称" show-overflow-tooltip></el-table-column>
......@@ -282,7 +282,7 @@ export default {
{ type: 2, name: '评论已满' },
{ type: 3, name: '禁言' },
{ type: 4, name: '评论太快' },
{ type: 5, name: '评论已经到了40条' },
{ type: 5, name: '评论已40条' },
{ type: 8, name: '其他错误' },
{ type: 9, name: '评论成功' },
],
......@@ -605,7 +605,7 @@ export default {
return 'info'
} else if (statusName == '已经点过赞' || statusName == '已经收藏过' || statusName == '已经评论过') {
return 'success'
} else if (statusName == '文章状态不能点赞' || statusName == '收藏已满' || statusName == '收藏夹不存在' || statusName == '评论已满' || statusName == '禁言' || statusName == '评论已经到了40条') {
} else if (statusName == '文章状态不能点赞' || statusName == '收藏已满' || statusName == '收藏夹不存在' || statusName == '评论已满' || statusName == '禁言' || statusName == '评论已40条') {
return 'danger'
} else if (statusName == '点赞成功' || statusName == '收藏成功' || statusName == '评论成功') {
return 'success'
......
......@@ -80,18 +80,9 @@
</div>
</el-dialog>
</el-form-item>
<el-form-item>
<el-button size="small" type="primary" @click="prepareAllTriplet">三连</el-button>
<el-dialog title="提示" :visible.sync="allTripletDialogVisible" width="30%" :before-close="handleClose">
<span>确认三连吗?</span>
<span slot="footer" class="dialog-footer">
<el-button @click="allTripletDialogVisible = false">取 消</el-button>
<el-button type="primary" @click.prevent="allTriplet()">确 定</el-button>
</span>
</el-dialog>
<el-button size="small" type="primary" @click="multiTriplet">三连</el-button>
</el-form-item>
<el-form-item>
<el-button size="small" type="warning" @click="prepareResetLikesComment">核验状态</el-button>
<el-dialog title="提示" :visible.sync="resetLikesCommentDialogVisible" width="30%" :before-close="handleClose">
......@@ -104,17 +95,10 @@
</el-form-item>
<el-form-item>
<el-button size="small" type="success" @click="prepareAutoReply">自动评论</el-button>
<el-dialog title="提示" :visible.sync="autoReplyDialogVisible" width="30%" :before-close="handleClose">
<span>确认自动评论吗?</span>
<span slot="footer" class="dialog-footer">
<el-button @click="autoReplyDialogVisible = false">取 消</el-button>
<el-button type="primary" @click.prevent="autoReply()">确 定</el-button>
</span>
</el-dialog>
<el-button size="small" type="success" @click="autoReply">自动评论</el-button>
</el-form-item>
</el-form>
<el-table ref="multipleTable" v-loading="loading" :data="csdnUserList" tooltip-effect="dark" style="width: 100%" @selection-change="handleSelectionChange">
<el-table border ref="multipleTable" v-loading="loading" :data="csdnUserList" tooltip-effect="dark" style="width: 100%" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column prop="userName" label="用户名称" show-overflow-tooltip></el-table-column>
<el-table-column prop="nickName" label="用户昵称" show-overflow-tooltip>
......@@ -143,7 +127,12 @@
<el-table-column prop="userWeightName" label="用户权重" show-overflow-tooltip></el-table-column>
<el-table-column prop="articleType" label="文章类型" show-overflow-tooltip></el-table-column>
<el-table-column prop="articleType" label="文章类型" show-overflow-tooltip>
<template slot-scope="scope">
<el-tag :type="getArticleType(scope.row.articleType)">{{ scope.row.articleType }}</el-tag>
</template>
</el-table-column>
<el-table-column label="更新时间">
<template slot-scope="props">
{{ props.row.updateTime | dateFormat }}
......@@ -151,22 +140,8 @@
</el-table-column>
<el-table-column prop="操作" label="操作" width="380px">
<template slot-scope="props">
<el-button type="primary" @click="prepareTriplet(props.row.userName)" size="small">三连</el-button>
<el-dialog title="提示" :visible.sync="tripletVisible" width="30%" :before-close="handleClose">
<span>确认三连?</span>
<span slot="footer" class="dialog-footer">
<el-button @click="tripletVisible = false">取 消</el-button>
<el-button type="primary" @click.prevent="triplet(currentUserName)">确 定</el-button>
</span>
</el-dialog>
<el-button type="warning" @click="prepareResetUserDayStatus(props.row.userName)" size="small">重置</el-button>
<el-dialog title="提示" :visible.sync="resetUserDayStatusVisible" width="30%" :before-close="handleClose">
<span>确认重置?</span>
<span slot="footer" class="dialog-footer">
<el-button @click="resetUserDayStatusVisible = false">取 消</el-button>
<el-button type="primary" @click.prevent="resetUserDayStatus(currentUserName)">确 定</el-button>
</span>
</el-dialog>
<el-button type="primary" @click="triplet(props.row.userName)" size="small">三连</el-button>
<el-button type="warning" @click="resetUserDayStatus(props.row.userName)" size="small">重置</el-button>
<el-button type="success" @click.prevent="preEdit(props.row.id, props.row.userName, props.row.nickName, props.row.userHomeUrl, props.row.userWeight)" width="200" size="small">编辑</el-button>
<el-dialog title="编辑用户信息" :visible.sync="editVisible">
<el-form :model="form">
......@@ -209,7 +184,7 @@
</template>
</el-table-column>
</el-table>
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[8, 10, 50, 100, 200, 400]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[ 10, 50, 100, 200, 400]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</el-main>
<el-backtop class="backtop"></el-backtop>
</el-container>
......@@ -218,419 +193,416 @@
<script>
import axios from 'axios'
import ApiService from '../../api/ApiService'
export default {
name: 'MyCsdnUser',
name: 'MyCsdnUser',
data() {
return {
form: {
userName: '',
nickName: '',
userHomeUrl: '',
userWeight: null,
},
formInline: {
userName: '',
nickName: '',
articleType: '',
likeStatus: null,
collectStatus: null,
commentStatus: null,
},
allOptions: [
{
type: -1,
name: '全部',
},
{
type: 9,
name: '铁子',
},
{ type: 8, name: '闺蜜' },
{ type: 7, name: '基友' },
{ type: 0, name: '默认' },
],
articleType: ['全部', 'blog', 'blink', 'download', 'ask'],
likeStatus: [
{
type: -1,
name: '全部',
},
{
type: 0,
name: '未处理',
},
{ type: 1, name: '已经点过赞' },
{ type: 2, name: '点赞已满' },
{ type: 3, name: '取消点赞' },
{ type: 4, name: '文章状态不能点赞' },
{ type: 8, name: '其他错误' },
{ type: 9, name: '点赞成功' },
],
collectStatus: [
{
type: -1,
name: '全部',
},
{
type: 0,
name: '未处理',
},
{ type: 1, name: '已经收藏过' },
{ type: 2, name: '收藏已满' },
{ type: 3, name: '参数缺失' },
{ type: 4, name: '收藏夹不存在' },
{ type: 8, name: '其他错误' },
{ type: 9, name: '收藏成功' },
],
commentStatus: [
{
type: -1,
name: '全部',
},
{
type: 0,
name: '未处理',
},
{ type: 1, name: '已经评论过' },
{ type: 2, name: '评论已满' },
{ type: 3, name: '禁言' },
{ type: 4, name: '评论太快' },
{ type: 5, name: '评论已到40条' },
{ type: 8, name: '其他错误' },
{ type: 9, name: '评论成功' },
],
dialogFormVisible: false,
dialogMutiFormVisible: false,
dialogVisible: false,
editVisible: false,
blog10DialogVisible: false,
resetLikesCommentDialogVisible: false,
// 用户列表数据
csdnUserList: [],
loading: false,
elementui_page_component_key: 0,
currentPage: Number(localStorage.getItem('csdnUserPage')) || 1,
pageSize: 10,
total: 0,
// 新增的内容
formLabelWidth: '120px',
currentRowId: null,
currentUserName: null,
multipleSelection: [],
}
},
watch: {
formInline: {
handler(newVal, oldVal) {
this.currentPage = 1
localStorage.setItem('csdnUserPage', this.currentPage)
this.userPage()
},
deep: true,
},
// 监听currentPage的变化,将新值保存到localStorage中
currentPage(newPage) {
localStorage.setItem('csdnUserPage', newPage.toString())
},
},
created() {
//获取问题类型的枚举
this.userPage()
},
mounted() {
this.currentPage = 1
},
methods: {
prepareAdd() {
this.form.userName = ''
this.form.nickName = ''
this.dialogFormVisible = true
},
prepareBlog10(userName) {
this.blog10DialogVisible = true
this.currentUserName = userName
},
prepareResetLikesComment() {
this.resetLikesCommentDialogVisible = true
},
prepareMutiAdd() {
this.form.userName = ''
this.dialogMutiFormVisible = true
},
prepareDelete(id) {
this.currentRowId = id
this.dialogVisible = true
},
preEdit(id, userName, nickName, userHomeUrl, userWeight) {
this.form.userName = userName
this.form.nickName = nickName
this.form.userHomeUrl = userHomeUrl
this.form.userWeight = userWeight
this.currentRowId = id
this.editVisible = true
},
handleClose(done) {
this.$confirm('确认关闭?')
.then((_) => {
done()
})
.catch((_) => {})
},
handleConfirm(addType) {
this.dialogFormVisible = false // 关闭对话框
this.dialogMutiFormVisible = false
this.addUser(addType) // 发送请求
},
handleSelectionChange(val) {
this.multipleSelection = val
},
async addUser(addType) {
try {
this.loading = true
const { data: res } = await axios.post('http://localhost:80/csdn/user/add', {
addType: addType,
userName: this.form.userName,
nickName: this.form.nickName,
userWeight: this.form.userWeight,
})
if (res.code === 200) {
this.currentPage = 1
this.form.userName = ''
this.form.nickName = ''
this.form.userWeight = null
this.userPage()
} else {
this.errorMsg(res.message)
console.error('Received non-200 status code', res)
}
} catch (error) {
console.error('An error occurred while adding the questionName:', error)
// 异常处理逻辑
} finally {
this.loading = false
}
},
async editConfirm() {
try {
this.loading = true
const { data: res } = await axios.post('http://localhost:80/csdn/user/update', {
id: this.currentRowId,
userName: this.form.userName,
nickName: this.form.nickName,
userWeight: this.form.userWeight,
userHomeUrl: this.form.userHomeUrl,
})
if (res.code === 200) {
this.form.userName = ''
this.form.nickName = ''
this.form.userHomeUrl = ''
this.form.userWeight = null
this.editVisible = false
currentRowId: null
this.userPage()
} else {
console.error('Received non-200 status code', res)
}
} catch (error) {
console.error('An error occurred while adding the questionName:', error)
// 异常处理逻辑
} finally {
this.loading = false
}
},
async multiTriplet() {
this.loading = true
if (this.multipleSelection && this.multipleSelection.length === 0) {
this.loading = false
this.errorMsg('请选择需要处理项')
} else {
let userNames = this.multipleSelection.map((item) => item.userName)
const { data: res } = await ApiService.multiTriplet(userNames)
if (res.code === 200) {
this.multipleSelection = []
this.userPage()
} else {
console.error('Received non-200 status code', res)
}
}
this.loading = false
},
data() {
return {
form: {
userName: '',
nickName: '',
userHomeUrl: '',
userWeight: null,
},
formInline: {
userName: '',
nickName: '',
articleType: '',
likeStatus: null,
collectStatus: null,
commentStatus: null,
},
allOptions: [
{
type: -1,
name: '全部',
},
{
type: 9,
name: '铁子',
},
{ type: 8, name: '闺蜜' },
{ type: 7, name: '基友' },
{ type: 0, name: '默认' },
],
articleType: ['全部', 'blog', 'blink', 'download', 'ask'],
likeStatus: [
{
type: -1,
name: '全部',
},
{
type: 0,
name: '未处理',
},
{ type: 1, name: '已经点过赞' },
{ type: 2, name: '点赞已满' },
{ type: 3, name: '取消点赞' },
{ type: 4, name: '文章状态不能点赞' },
{ type: 8, name: '其他错误' },
{ type: 9, name: '点赞成功' },
],
collectStatus: [
{
type: -1,
name: '全部',
},
{
type: 0,
name: '未处理',
},
{ type: 1, name: '已经收藏过' },
{ type: 2, name: '收藏已满' },
{ type: 3, name: '参数缺失' },
{ type: 4, name: '收藏夹不存在' },
{ type: 8, name: '其他错误' },
{ type: 9, name: '收藏成功' },
],
commentStatus: [
{
type: -1,
name: '全部',
},
{
type: 0,
name: '未处理',
},
{ type: 1, name: '已经评论过' },
{ type: 2, name: '评论已满' },
{ type: 3, name: '禁言' },
{ type: 4, name: '评论太快' },
{ type: 5, name: '评论已经到了40条' },
{ type: 8, name: '其他错误' },
{ type: 9, name: '评论成功' },
],
dialogFormVisible: false,
dialogMutiFormVisible: false,
dialogVisible: false,
editVisible: false,
tripletVisible: false,
allTripletDialogVisible: false,
autoReplyDialogVisible: false,
resetUserDayStatusVisible: false,
blog10DialogVisible: false,
resetLikesCommentDialogVisible: false,
// 用户列表数据
csdnUserList: [],
loading: false,
elementui_page_component_key: 0,
currentPage: Number(localStorage.getItem('csdnUserPage')) || 1,
pageSize: 8,
total: 0,
// 新增的内容
formLabelWidth: '120px',
currentRowId: null,
currentUserName: null,
multipleSelection: [],
}
},
watch: {
formInline: {
handler(newVal, oldVal) {
this.currentPage = 1
localStorage.setItem('csdnUserPage', this.currentPage)
this.userPage()
},
deep: true,
},
// 监听currentPage的变化,将新值保存到localStorage中
currentPage(newPage) {
localStorage.setItem('csdnUserPage', newPage.toString())
},
},
created() {
//获取问题类型的枚举
this.userPage()
},
mounted() {
this.currentPage = 1
},
methods: {
prepareAdd() {
this.form.userName = ''
this.form.nickName = ''
this.dialogFormVisible = true
},
prepareAllTriplet() {
this.allTripletDialogVisible = true
},
prepareResetUserDayStatus(userName) {
this.resetUserDayStatusVisible = true
this.currentUserName = userName
},
prepareBlog10(userName) {
this.blog10DialogVisible = true
this.currentUserName = userName
},
prepareResetLikesComment() {
this.resetLikesCommentDialogVisible = true
},
prepareAutoReply() {
this.autoReplyDialogVisible = true
},
prepareMutiAdd() {
this.form.userName = ''
this.dialogMutiFormVisible = true
},
prepareDelete(id) {
this.currentRowId = id
this.dialogVisible = true
},
prepareTriplet(userName) {
this.currentUserName = userName
this.tripletVisible = true
},
preEdit(id, userName, nickName, userHomeUrl, userWeight) {
this.form.userName = userName
this.form.nickName = nickName
this.form.userHomeUrl = userHomeUrl
this.form.userWeight = userWeight
this.currentRowId = id
this.editVisible = true
},
handleClose(done) {
this.$confirm('确认关闭?')
.then((_) => {
done()
})
.catch((_) => {})
},
handleConfirm(addType) {
this.dialogFormVisible = false // 关闭对话框
this.dialogMutiFormVisible = false
this.addUser(addType) // 发送请求
},
handleSelectionChange(val) {
this.multipleSelection = val
},
async autoReply() {
this.loading = true
const { data: res } = await ApiService.autoReply()
if (res.code === 200) {
this.userPage()
} else {
console.error('Received non-200 status code', res)
}
this.loading = false
},
async addUser(addType) {
try {
this.loading = true
const { data: res } = await axios.post('http://localhost:80/csdn/user/add', {
addType: addType,
userName: this.form.userName,
nickName: this.form.nickName,
userWeight: this.form.userWeight,
})
if (res.code === 200) {
this.currentPage = 1
this.form.userName = ''
this.form.nickName = ''
this.form.userWeight = null
this.userPage()
} else {
this.errorMsg(res.message)
console.error('Received non-200 status code', res)
}
} catch (error) {
console.error('An error occurred while adding the questionName:', error)
// 异常处理逻辑
} finally {
this.loading = false
}
},
errorMsg(msg) {
this.$message({
showClose: true,
message: msg,
type: 'error',
})
},
async editConfirm() {
try {
this.loading = true
const { data: res } = await axios.post('http://localhost:80/csdn/user/update', {
id: this.currentRowId,
userName: this.form.userName,
nickName: this.form.nickName,
userWeight: this.form.userWeight,
userHomeUrl: this.form.userHomeUrl,
})
if (res.code === 200) {
this.form.userName = ''
this.form.nickName = ''
this.form.userHomeUrl = ''
this.form.userWeight = null
this.editVisible = false
currentRowId: null
this.userPage()
} else {
console.error('Received non-200 status code', res)
}
} catch (error) {
console.error('An error occurred while adding the questionName:', error)
// 异常处理逻辑
} finally {
this.loading = false
}
},
async triplet(userName) {
this.loading = true
const { data: res } = await ApiService.singleTriplet(userName)
if (res.code === 200) {
this.currentUserName = null
this.userPage()
} else {
console.error('Received non-200 status code', res)
}
this.loading = false
},
async fixUserLikesStatus() {
this.loading = true
this.resetLikesCommentDialogVisible = false
const { data: res } = await axios.get('http://localhost:80/csdn/user/fixUserLikesStatus')
if (res.code === 200) {
this.userPage()
} else {
console.error('Received non-200 status code', res)
}
this.loading = false
},
async onBlog10(userName) {
this.loading = true
this.blog10DialogVisible = false
const { data: res } = await axios.get('http://localhost:80/csdn/user/add10Blog?username=' + userName)
if (res.code === 200) {
this.currentUserName = null
this.userPage()
} else {
console.error('Received non-200 status code', res)
}
this.loading = false
},
async resetUserDayStatus(userName) {
this.loading = true
const { data: res } = await axios.get('http://localhost:80/csdn/user/resetCsdnUserInfo?username=' + userName)
if (res.code === 200) {
this.currentUserName = null
this.userPage()
} else {
console.error('Received non-200 status code', res)
}
this.loading = false
},
async onDelete(id) {
this.loading = true
const { data: res } = await axios.get('http://localhost:80/csdn/user/delete', {
params: {
id: id,
},
})
this.dialogVisible = false
this.userPage()
this.loading = false
},
refreshPage() {
//获取问题类型的枚举
this.userPage()
location.reload()
},
async userPage() {
this.loading = true
const { data: res } = await axios.post('http://localhost:80/csdn/user/page', {
page: this.currentPage,
pageSize: this.pageSize,
userName: this.formInline.userName,
nickName: this.formInline.nickName,
articleType: this.formInline.articleType == '全部' ? '' : this.formInline.articleType,
userWeight: this.formInline.userWeight == -1 ? null : this.formInline.userWeight,
likeStatus: this.formInline.likeStatus == -1 ? null : this.formInline.likeStatus,
collectStatus: this.formInline.collectStatus == -1 ? null : this.formInline.collectStatus,
commentStatus: this.formInline.commentStatus == -1 ? null : this.formInline.commentStatus,
})
if (res.code === 200) {
this.total = res.result.totalElements
async allTriplet() {
this.loading = true
this.allTripletDialogVisible = false
if (this.multipleSelection && this.multipleSelection.length === 0) {
console.error('请选择需要处理的项')
} else {
let userNames = this.multipleSelection.map((item) => item.userName)
const { data: res } = await axios.post('http://localhost:80/csdn/multiTriplet', userNames)
if (res.code === 200) {
this.multipleSelection = []
this.userPage()
} else {
console.error('Received non-200 status code', res)
}
}
this.loading = false
},
async triplet(userName) {
this.loading = true
this.tripletVisible = false
const { data: res } = await axios.get('http://localhost:80/csdn/singleTriplet?username=' + userName)
if (res.code === 200) {
this.currentUserName = null
this.userPage()
} else {
console.error('Received non-200 status code', res)
}
this.loading = false
},
async fixUserLikesStatus() {
this.loading = true
this.resetLikesCommentDialogVisible = false
const { data: res } = await axios.get('http://localhost:80/csdn/user/fixUserLikesStatus')
if (res.code === 200) {
this.userPage()
} else {
console.error('Received non-200 status code', res)
}
this.loading = false
},
async onBlog10(userName) {
this.loading = true
this.blog10DialogVisible = false
const { data: res } = await axios.get('http://localhost:80/csdn/user/add10Blog?username=' + userName)
if (res.code === 200) {
this.currentUserName = null
this.userPage()
} else {
console.error('Received non-200 status code', res)
}
this.loading = false
},
async resetUserDayStatus(userName) {
this.loading = true
this.resetUserDayStatusVisible = false
const { data: res } = await axios.get('http://localhost:80/csdn/user/resetCsdnUserInfo?username=' + userName)
if (res.code === 200) {
this.currentUserName = null
this.userPage()
} else {
console.error('Received non-200 status code', res)
}
this.loading = false
},
async onDelete(id) {
this.loading = true
const { data: res } = await axios.get('http://localhost:80/csdn/user/delete', {
params: {
id: id,
},
})
this.dialogVisible = false
this.userPage()
this.loading = false
},
refreshPage() {
//获取问题类型的枚举
this.userPage()
location.reload()
},
async userPage() {
this.loading = true
const { data: res } = await axios.post('http://localhost:80/csdn/user/page', {
page: this.currentPage,
pageSize: this.pageSize,
userName: this.formInline.userName,
nickName: this.formInline.nickName,
articleType: this.formInline.articleType == '全部' ? '' : this.formInline.articleType,
userWeight: this.formInline.userWeight == -1 ? null : this.formInline.userWeight,
likeStatus: this.formInline.likeStatus == -1 ? null : this.formInline.likeStatus,
collectStatus: this.formInline.collectStatus == -1 ? null : this.formInline.collectStatus,
commentStatus: this.formInline.commentStatus == -1 ? null : this.formInline.commentStatus,
})
if (res.code === 200) {
this.total = res.result.totalElements
const userWeightMap = {}
this.allOptions.forEach((option) => {
userWeightMap[option.type] = option.name
})
res.result.content.forEach((item) => {
item.userWeightName = userWeightMap[item.userWeight]
})
const userWeightMap = {}
this.allOptions.forEach((option) => {
userWeightMap[option.type] = option.name
})
res.result.content.forEach((item) => {
item.userWeightName = userWeightMap[item.userWeight]
})
const likeStatusMap = {}
this.likeStatus.forEach((option) => {
likeStatusMap[option.type] = option.name
})
res.result.content.forEach((item) => {
item.likeStatusName = likeStatusMap[item.likeStatus]
})
const likeStatusMap = {}
this.likeStatus.forEach((option) => {
likeStatusMap[option.type] = option.name
})
res.result.content.forEach((item) => {
item.likeStatusName = likeStatusMap[item.likeStatus]
})
const collectStatusMap = {}
this.collectStatus.forEach((option) => {
collectStatusMap[option.type] = option.name
})
res.result.content.forEach((item) => {
item.collectStatusName = collectStatusMap[item.collectStatus]
})
const collectStatusMap = {}
this.collectStatus.forEach((option) => {
collectStatusMap[option.type] = option.name
})
res.result.content.forEach((item) => {
item.collectStatusName = collectStatusMap[item.collectStatus]
})
const commentStatusMap = {}
this.commentStatus.forEach((option) => {
commentStatusMap[option.type] = option.name
})
res.result.content.forEach((item) => {
item.commentStatusName = commentStatusMap[item.commentStatus]
})
const commentStatusMap = {}
this.commentStatus.forEach((option) => {
commentStatusMap[option.type] = option.name
})
res.result.content.forEach((item) => {
item.commentStatusName = commentStatusMap[item.commentStatus]
})
this.csdnUserList = res.result.content
}
this.loading = false
},
handleCurrentChange(currentPage) {
this.currentPage = currentPage
this.userPage()
},
handleSizeChange(currentSize) {
this.pageSize = currentSize
this.userPage()
},
getTagType(statusName) {
if (statusName == '未处理') {
return 'info'
} else if (statusName == '已经点过赞' || statusName == '已经收藏过' || statusName == '已经评论过') {
return 'success'
} else if (statusName == '文章状态不能点赞' || statusName == '收藏已满' || statusName == '收藏夹不存在' || statusName == '评论已满' || statusName == '禁言' || statusName == '评论已到40条') {
return 'danger'
} else if (statusName == '点赞成功' || statusName == '收藏成功' || statusName == '评论成功') {
return 'success'
} else if (statusName == '点赞已满' || statusName == '参数缺失' || statusName == '其他错误' || statusName == '取消点赞' || statusName == '评论太快') {
return 'warning'
}
},
getArticleType(articleType) {
if (articleType == 'blog') {
return 'success'
} else if (articleType == 'blink') {
return 'danger'
} else if (articleType == 'topic') {
return 'warning'
} else if (articleType == 'download') {
return 'primary'
} else if (articleType == 'ask') {
return 'info'
}
},
this.csdnUserList = res.result.content
}
this.loading = false
},
handleCurrentChange(currentPage) {
this.currentPage = currentPage
this.userPage()
},
handleSizeChange(currentSize) {
this.pageSize = currentSize
this.userPage()
},
getTagType(statusName) {
if (statusName == '未处理') {
return 'info'
} else if (statusName == '已经点过赞' || statusName == '已经收藏过' || statusName == '已经评论过') {
return 'success'
} else if (statusName == '文章状态不能点赞' || statusName == '收藏已满' || statusName == '收藏夹不存在' || statusName == '评论已满' || statusName == '禁言' || statusName == '评论已经到了40条') {
return 'danger'
} else if (statusName == '点赞成功' || statusName == '收藏成功' || statusName == '评论成功') {
return 'success'
} else if (statusName == '点赞已满' || statusName == '参数缺失' || statusName == '其他错误' || statusName == '取消点赞' || statusName == '评论太快') {
return 'warning'
}
},
async autoReply() {
this.loading = true
this.autoReplyDialogVisible = false
const { data: res } = await axios.get('http://localhost:80/csdn/autoReply')
if (res.code === 200) {
this.userPage()
} else {
console.error('Received non-200 status code', res)
}
this.loading = false
},
},
errorMsg(msg) {
this.$message({
showClose: true,
message: msg,
type: 'error',
})
},
},
}
</script>
......
<template>
<div>
<el-container>
<el-main>
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item>
<el-input size="small" clearable v-model="formInline.userName" placeholder="请输入用户名" @keydown.enter.native="messagePage"></el-input>
</el-form-item>
<el-form-item>
<el-input size="small" clearable v-model="formInline.nickName" placeholder="请输入用户昵称" @keydown.enter.native="messagePage"></el-input>
</el-form-item>
<el-form-item>
<el-select size="small" v-model="formInline.hasRepliedInfo" placeholder="请选择收藏状态" @change="messagePage">
<el-option v-for="item in hasRepliedInfo" :key="item.type" :label="item.name" :value="item.type"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button size="small" type="primary" @click="messagePage">查询</el-button>
</el-form-item>
<div>
<el-container>
<el-main>
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item>
<el-input size="small" clearable v-model="formInline.userName" placeholder="请输入用户名"
@keydown.enter.native="messagePage"></el-input>
</el-form-item>
<el-form-item>
<el-input size="small" clearable v-model="formInline.nickName" placeholder="请输入用户昵称"
@keydown.enter.native="messagePage"></el-input>
</el-form-item>
<el-form-item>
<el-select size="small" v-model="formInline.hasRepliedInfo" placeholder="请选择收藏状态" @change="messagePage">
<el-option v-for="item in hasRepliedInfo" :key="item.type" :label="item.name"
:value="item.type"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button size="small" type="primary" @click="messagePage">查询</el-button>
</el-form-item>
<el-form-item>
<el-button size="small" type="primary" @click="prepareRefreshMessage">刷新私信列表</el-button>
<el-dialog title="提示" :visible.sync="refreshMessageDialogVisible" width="30%" :before-close="handleClose">
<span>确认刷新私信列表吗?</span>
<span slot="footer" class="dialog-footer">
<el-form-item>
<el-button size="small" type="primary" @click="prepareRefreshMessage">刷新私信列表</el-button>
<el-dialog title="提示" :visible.sync="refreshMessageDialogVisible" width="30%" :before-close="handleClose">
<span>确认刷新私信列表吗?</span>
<span slot="footer" class="dialog-footer">
<el-button @click="refreshMessageDialogVisible = false">取 消</el-button>
<el-button type="primary" @click.prevent="refreshMessage()">确 定</el-button>
<el-button type="primary" @click.prevent="acquireMessage()">确 定</el-button>
</span>
</el-dialog>
</el-form-item>
</el-dialog>
</el-form-item>
<el-form-item>
<el-button size="small" type="primary" @click="prepareMeaasge">私信点赞收藏</el-button>
<el-dialog title="提示" :visible.sync="messageDialogVisible" width="30%" :before-close="handleClose">
<span>确认处理私信点赞收藏吗?</span>
<span slot="footer" class="dialog-footer">
<el-button @click="messageDialogVisible = false">取 消</el-button>
<el-button type="primary" @click.prevent="messageDeal()">确 定</el-button>
</span>
</el-dialog>
</el-form-item>
</el-form>
<el-table ref="multipleTable" v-loading="loading" :data="csdnMessageList" tooltip-effect="dark" style="width: 100%">
<el-table-column prop="id" label="序号" width="100" sortable></el-table-column>
<el-table-column prop="userName" label="用户名称" show-overflow-tooltip></el-table-column>
<el-table-column prop="nickName" label="用户昵称" show-overflow-tooltip>
<template slot-scope="scope">
<a :href="scope.row.messageUrl" target="_blank">{{ scope.row.nickName }}</a>
</template>
</el-table-column>
<el-form-item>
<el-button size="small" type="primary" @click="messageDeal">私信点赞收藏</el-button>
</el-form-item>
</el-form>
<el-table border ref="multipleTable" v-loading="loading" :data="csdnMessageList" tooltip-effect="dark"
style="width: 100%">
<el-table-column prop="id" label="序号" width="100" sortable></el-table-column>
<el-table-column prop="userName" label="用户名称" show-overflow-tooltip></el-table-column>
<el-table-column prop="nickName" label="用户昵称" show-overflow-tooltip>
<template slot-scope="scope">
<a :href="scope.row.messageUrl" target="_blank">{{ scope.row.nickName }}</a>
</template>
</el-table-column>
<el-table-column prop="hasRepliedName" label="是否回复" show-overflow-tooltip>
<template slot-scope="scope">
<el-tag :type="getTagType(scope.row.hasRepliedName)">{{ scope.row.hasRepliedName }}</el-tag>
</template>
</el-table-column>
<el-table-column prop="hasRepliedName" label="是否回复" show-overflow-tooltip>
<template slot-scope="scope">
<el-tag :type="getTagType(scope.row.hasRepliedName)">{{ scope.row.hasRepliedName }}</el-tag>
</template>
</el-table-column>
<el-table-column prop="content" label="回复内容" show-overflow-tooltip></el-table-column>
<el-table-column prop="content" label="回复内容" show-overflow-tooltip></el-table-column>
<el-table-column label="更新时间">
<template slot-scope="props">
{{ props.row.updateTime | dateFormat }}
</template>
</el-table-column>
<el-table-column prop="操作" label="操作" width="380px">
<template slot-scope="props">
<el-button type="primary" @click="prepareDealMessageOne(props.row.userName)" size="small">私信</el-button>
<el-dialog title="提示" :visible.sync="dealMessageOneVisible" width="30%" :before-close="handleClose">
<span>确认私信吗?</span>
<span slot="footer" class="dialog-footer">
<el-button @click="dealMessageOneVisible = false">取 消</el-button>
<el-button type="primary" @click.prevent="dealMessageOne(currentUserName)">确 定</el-button>
</span>
</el-dialog>
<el-button type="danger" @click="prepareDelete(props.row.id)" size="small">删除</el-button>
<el-dialog title="提示" :visible.sync="deleteDialogVisible" width="30%" :before-close="handleClose">
<span>确认删除?</span>
<span slot="footer" class="dialog-footer">
<el-button @click="deleteDialogVisible = false">取 消</el-button>
<el-button type="primary" @click.prevent="onDelete(currentRowId)">确 定</el-button>
</span>
</el-dialog>
</template>
</el-table-column>
</el-table>
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[8, 50, 100, 200, 400]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</el-main>
<el-backtop class="backtop"></el-backtop>
</el-container>
</div>
<el-table-column label="更新时间">
<template slot-scope="props">
{{ props.row.updateTime | dateFormat }}
</template>
</el-table-column>
<el-table-column prop="操作" label="操作" width="380px">
<template slot-scope="props">
<el-button type="primary" @click="dealMessageOne(props.row.userName)" size="small">私信</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
:page-sizes="[8, 50, 100, 200, 400]" :page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</el-main>
<el-backtop class="backtop"></el-backtop>
</el-container>
</div>
</template>
<script>
import axios from 'axios'
import ApiService from '../../api/ApiService'
export default {
name: 'MyMessage',
name: 'MyMessage',
data() {
return {
formInline: {
userName: '',
nickName: '',
hasRepliedInfo: null,
},
hasRepliedInfo: [
{
type: -1,
name: '全部',
},
{
type: 0,
name: '未回复',
},
{ type: 1, name: '已回复' },
],
deleteDialogVisible: false,
dealMessageOneVisible: false,
messageDialogVisible: false,
refreshMessageDialogVisible: false,
// 用户列表数据
csdnMessageList: [],
loading: false,
elementui_page_component_key: 0,
currentPage: Number(localStorage.getItem('csdnUserPage')) || 1,
pageSize: 8,
total: 0,
currentRowId: null,
currentUserName: null,
}
},
watch: {
'formInline.userName'(newVal, oldVal) {
if (newVal !== oldVal) {
this.currentPage = 1
localStorage.setItem('csdnUserPage', this.currentPage)
this.messagePage()
}
},
'formInline.nickName'(newVal, oldVal) {
if (newVal !== oldVal) {
this.currentPage = 1
localStorage.setItem('csdnUserPage', this.currentPage)
this.messagePage()
}
},
// 监听currentPage的变化,将新值保存到localStorage中
currentPage(newPage) {
localStorage.setItem('csdnUserPage', newPage.toString())
},
},
created() {
//获取问题类型的枚举
this.messagePage()
},
mounted() {
this.currentPage = 1
},
methods: {
prepareMeaasge() {
this.messageDialogVisible = true
},
prepareRefreshMessage() {
this.refreshMessageDialogVisible = true
},
prepareDelete(id) {
this.currentRowId = id
this.deleteDialogVisible = true
},
prepareDealMessageOne(userName) {
this.currentUserName = userName
this.dealMessageOneVisible = true
},
data() {
return {
formInline: {
userName: '',
nickName: '',
hasRepliedInfo: null,
},
hasRepliedInfo: [
{
type: -1,
name: '全部',
},
{
type: 0,
name: '未回复',
},
{type: 1, name: '已回复'},
],
refreshMessageDialogVisible: false,
// 用户列表数据
csdnMessageList: [],
loading: false,
elementui_page_component_key: 0,
currentPage: Number(localStorage.getItem('csdnUserPage')) || 1,
pageSize: 8,
total: 0,
currentRowId: null,
currentUserName: null,
}
},
watch: {
'formInline.userName'(newVal, oldVal) {
if (newVal !== oldVal) {
this.currentPage = 1
localStorage.setItem('csdnUserPage', this.currentPage)
this.messagePage()
}
},
'formInline.nickName'(newVal, oldVal) {
if (newVal !== oldVal) {
this.currentPage = 1
localStorage.setItem('csdnUserPage', this.currentPage)
this.messagePage()
}
},
// 监听currentPage的变化,将新值保存到localStorage中
currentPage(newPage) {
localStorage.setItem('csdnUserPage', newPage.toString())
},
},
created() {
//获取问题类型的枚举
this.messagePage()
},
mounted() {
this.currentPage = 1
},
methods: {
prepareRefreshMessage() {
this.refreshMessageDialogVisible = true
},
handleClose(done) {
this.$confirm('确认关闭?')
.then((_) => {
done()
})
.catch((_) => {})
},
handleConfirm(addType) {
this.dialogFormVisible = false // 关闭对话框
this.dialogMutiFormVisible = false
this.addUser(addType) // 发送请求
},
async messagePage() {
this.loading = true
const { data: res } = await axios.post('http://localhost:80/csdn/message/page', {
page: this.currentPage,
pageSize: this.pageSize,
userName: this.formInline.userName,
nickName: this.formInline.nickName,
hasReplied: this.formInline.hasRepliedInfo == -1 ? null : this.formInline.hasRepliedInfo,
})
if (res.code === 200) {
this.total = res.result.totalElements
const userWeightMap = {}
this.hasRepliedInfo.forEach((option) => {
userWeightMap[option.type] = option.name
})
res.result.content.forEach((item) => {
item.hasRepliedName = userWeightMap[item.hasReplied]
})
this.csdnMessageList = res.result.content
}
this.loading = false
},
handleClose(done) {
this.$confirm('确认关闭?')
.then((_) => {
done()
})
.catch((_) => {
})
},
handleConfirm(addType) {
this.dialogFormVisible = false // 关闭对话框
this.dialogMutiFormVisible = false
this.addUser(addType) // 发送请求
},
async messagePage() {
this.loading = true
const {data: res} = await ApiService.messagePage(this.currentPage, this.pageSize, this.formInline)
if (res.code === 200) {
this.total = res.result.totalElements
const userWeightMap = {}
this.hasRepliedInfo.forEach((option) => {
userWeightMap[option.type] = option.name
})
res.result.content.forEach((item) => {
item.hasRepliedName = userWeightMap[item.hasReplied]
})
this.csdnMessageList = res.result.content
}
this.loading = false
},
async dealMessageOne(userName) {
this.loading = true
this.dealMessageOneVisible = false
const { data: res } = await axios.get('http://localhost:80/csdn/message/dealMessageOne?userName=' + userName)
if (res.code === 200) {
this.currentUserName = null
this.messagePage()
} else {
console.error('Received non-200 status code', res)
}
this.loading = false
},
async dealMessageOne(userName) {
this.loading = true
const {data: res} = await ApiService.dealMessageOne(userName)
if (res.code === 200) {
this.currentUserName = null
await this.messagePage()
} else {
console.error('Received non-200 status code', res)
}
this.loading = false
},
async messageDeal() {
this.loading = true
this.messageDialogVisible = false
const { data: res1 } = await axios.get('http://localhost:80/csdn/message/dealMessage')
if (res1.code === 200) {
this.messagePage()
} else {
console.error('Received non-200 status code', res1)
}
const { data: res2 } = await axios.get('http://localhost:80/csdn/likeCollect/dealLikeCollect')
if (res2.code === 200) {
this.messagePage()
} else {
console.error('Received non-200 status code', res2)
}
this.loading = false
},
async refreshMessage() {
this.loading = true
this.refreshMessageDialogVisible = false
const { data: res } = await axios.get('http://localhost:80/csdn/message/acquireMessage')
if (res.code === 200) {
this.messagePage()
} else {
console.error('Received non-200 status code', res)
}
this.loading = false
},
async onDelete(id) {
this.loading = true
const { data: res } = await axios.get('http://localhost:80/csdn/user/delete', {
params: {
id: id,
},
})
this.deleteDialogVisible = false
this.messagePage()
this.loading = false
},
refreshPage() {
//获取问题类型的枚举
this.messagePage()
location.reload()
},
handleCurrentChange(currentPage) {
this.currentPage = currentPage
this.messagePage()
},
handleSizeChange(currentSize) {
this.pageSize = currentSize
this.messagePage()
},
getTagType(hasRepliedName) {
if (hasRepliedName == '未回复') {
return 'warning'
} else {
return 'success'
}
},
},
async messageDeal() {
this.loading = true
const {data: res1} = await ApiService.dealMessage()
if (res1.code === 200) {
await this.messagePage()
} else {
console.error('Received non-200 status code', res1)
}
const {data: res2} = await ApiService.dealLikeCollect()
if (res2.code === 200) {
await this.messagePage()
} else {
console.error('Received non-200 status code', res2)
}
this.loading = false
},
async acquireMessage() {
this.loading = true
this.refreshMessageDialogVisible = false
const {data: res} = await ApiService.acquireMessage()
if (res.code === 200) {
await this.messagePage()
} else {
console.error('Received non-200 status code', res)
}
this.loading = false
},
refreshPage() {
//获取问题类型的枚举
this.messagePage()
location.reload()
},
handleCurrentChange(currentPage) {
this.currentPage = currentPage
this.messagePage()
},
handleSizeChange(currentSize) {
this.pageSize = currentSize
this.messagePage()
},
getTagType(hasRepliedName) {
if (hasRepliedName == '未回复') {
return 'warning'
} else {
return 'success'
}
},
},
}
</script>
<style lang="less" scoped>
.el-header {
background-color: #b3c0d1;
color: #333;
line-height: 60px;
background-color: #b3c0d1;
color: #333;
line-height: 60px;
}
.el-aside {
color: #333;
color: #333;
}
.pagination {
margin-top: 16px;
text-align: right;
margin-top: 16px;
text-align: right;
}
.header-button-item {
margin-right: 15px;
font-size: 20px;
margin-right: 15px;
font-size: 20px;
}
.red-title {
line-height: 24px;
font-size: 18px;
color: red;
line-height: 24px;
font-size: 18px;
color: red;
}
.backtop {
position: fixed;
bottom: 50px;
right: 50px;
height: 40px;
width: 40px;
line-height: 40px;
text-align: center;
border-radius: 20px;
background-color: #007aff;
color: #fff;
cursor: pointer;
z-index: 999;
position: fixed;
bottom: 50px;
right: 50px;
height: 40px;
width: 40px;
line-height: 40px;
text-align: center;
border-radius: 20px;
background-color: #007aff;
color: #fff;
cursor: pointer;
z-index: 999;
}
.custom-textarea {
width: 100%;
text-align: left;
width: 100%;
text-align: left;
}
.backtop:hover {
background-color: #0050a0;
background-color: #0050a0;
}
</style>
\ No newline at end of file
......@@ -4,8 +4,11 @@
<el-main>
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item>
<el-select size="small" v-model="picType" placeholder="请选择" @change="queryPic">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
<el-input size="small" clearable v-model="formInline.picName" placeholder="请输入图片名称" @keydown.enter.native="queryPic"></el-input>
</el-form-item>
<el-form-item>
<el-select size="small" clearable v-model="formInline.type" placeholder="请选择" @change="queryPic">
<el-option v-for="item in options" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item>
......@@ -14,22 +17,44 @@
<el-form-item>
<el-button size="small" type="primary" @click="prepareAddPic">新增图片</el-button>
<el-dialog title="新增图片" :visible.sync="addPicVisible" style="width: 100%">
<el-upload ref="upload" :limit="30" accept=".jpg,.gif,.png,.jpeg,.txt,.pdf,.doc,.docx,.xls,.xlsx" name="files" multiple action="http://localhost:80/picInfo/upload" :on-preview="handlePreview" :on-remove="handleRemove" :file-list="fileList" :auto-upload="false" :on-success="handleUploadSuccess">
<el-select size="small" v-model="formInline.type" placeholder="请选择图片类型">
<el-option v-for="item in options" :key="item" :label="item" :value="item"></el-option>
</el-select>
<el-upload ref="upload" :limit="30" accept=".jpg,.gif,.png,.jpeg,.txt,.pdf,.doc,.docx,.xls,.xlsx" name="files" multiple :action="getUploadAction()" :on-preview="handlePreview" :on-remove="handleRemove" :file-list="fileList" :auto-upload="false" :on-success="handleUploadSuccess">
<el-button slot="trigger" size="small" type="primary">选择图片</el-button>
<el-button style="margin-left: 10px" size="small" type="success" @click="submitUpload">上传到服务器</el-button>
</el-upload>
</el-dialog>
</el-form-item>
</el-form>
<el-table border :data="picList" v-loading="loading">
<el-form-item>
<el-button size="small" type="primary" @click="prepareBatchUpdatePic">批量修改</el-button>
<el-dialog title="批量修改" :visible.sync="batchUpdatePicVisible" style="width: 100%">
<el-form :model="form" class="custom-form">
<el-form-item label="图片类型" :label-width="formLabelWidth" class="form-item">
<el-select size="small" v-model="form.type" placeholder="请选择图片类型">
<el-option v-for="item in options" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="batchUpdatePicVisible = false">取 消</el-button>
<el-button type="primary" @click="batchUpdatePic()">确 定</el-button>
</div>
</el-dialog>
</el-form-item>
</el-form>
<el-table border ref="multipleTable" v-loading="loading" :data="picList" tooltip-effect="dark" style="width: 100%" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column prop="id" label="序号" align="center" sortable></el-table-column>
<el-table-column prop="picName" label="图片名字" align="center" show-overflow-tooltip></el-table-column>
<el-table-column prop="type" label="图片类型" align="center" show-overflow-tooltip></el-table-column>
<el-table-column align="center">
<template slot-scope="props">
<img :src="props.row.picUrl" alt="图片" height="100px" @click="showImageDialog(props.row.picUrl, props.$index)" style="cursor: pointer" />
</template>
</el-table-column>
<el-table-column label="创建时间" align="center">
<template slot-scope="props">
{{ props.row.createTime | dateFormat }}
......@@ -38,18 +63,20 @@
<el-table-column prop="操作" label="操作" width="100px" align="center">
<template slot-scope="props">
<el-button size="small" type="primary" @click.prevent="prePicEdit(props.row.id, props.row.picUrl, props.row.type)">编辑</el-button>
<el-button size="small" type="primary" @click.prevent="prePicEdit(props.row.id, props.row.picName, props.row.picUrl, props.row.type)">编辑</el-button>
<el-dialog title="编辑图片信息" :visible.sync="editPicVisible">
<el-form :model="form" class="custom-form">
<el-form-item align="center" class="form-item">
<img :src="form.picUrl" alt="图片" height="100px" style="cursor: pointer" />
</el-form-item>
<el-form-item label="" class="form-item" align="middle">
<el-select v-model="form.type" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
<el-option v-for="item in options" :key="item" :label="item" :value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-input clearable v-model="form.picName" placeholder="请输入图片名称"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="editPicVisible = false">取 消</el-button>
......@@ -83,15 +110,19 @@ export default {
name: 'MyPic',
data() {
return {
fileUrl: 'http://localhost:80/picInfo/upload',
form: {
picName: '',
picUrl: '',
type: 0,
type: '',
},
formInline: {
picType: 0,
type: '',
picName: '',
},
//待上传的图片
fileList: [],
multipleSelection: [],
// 用户列表数据
picList: [],
loading: false,
......@@ -99,54 +130,43 @@ export default {
currentPage: 1,
pageSize: 6,
total: 0,
formLabelWidth: '120px',
imageDialogVisible: false,
batchUpdatePicVisible: false,
addPicVisible: false,
editPicVisible: false,
enlargedImageUrl: '',
currentRowId: null,
imageIndex: 0, // 当前展示的图片索引
options: [
{
value: 0,
label: '宝宝',
},
{
value: 1,
label: '学习',
},
{
value: 2,
label: '风景',
},
{
value: 3,
label: '美女',
},
{
value: 4,
label: '猫咪',
},
{
value: 5,
label: '素材',
},
{
value: 6,
label: '动漫',
},
{
value: 99,
label: '其他',
},
],
picType: 0,
options: ['全部', '宝宝', '学习', '风景', '美女', '猫咪', '素材', '动漫', '其他'],
}
},
watch: {
formInline: {
handler(newVal, oldVal) {
this.currentPage = 1
localStorage.setItem('picPage', this.currentPage)
this.queryPic()
},
deep: true,
},
// 监听currentPage的变化,将新值保存到localStorage中
currentPage(newPage) {
localStorage.setItem('picPage', newPage.toString())
},
},
created() {
// 调用请求数据的方法
this.queryPic()
},
methods: {
prepareBatchUpdatePic() {
this.form.type = ''
this.batchUpdatePicVisible = true
},
getUploadAction() {
return this.fileUrl + '?type=' + this.formInline.type
},
async submitUpload() {
this.$refs.upload.submit()
this.addPicVisible = false
......@@ -160,8 +180,9 @@ export default {
prepareAddPic() {
this.addPicVisible = true
},
prePicEdit(id, picUrl, type) {
prePicEdit(id, picName, picUrl, type) {
this.currentRowId = id
this.form.picName = picName
this.form.picUrl = picUrl
this.form.type = type
this.editPicVisible = true
......@@ -199,7 +220,7 @@ export default {
},
async queryPic() {
this.loading = true
const { data: res } = await ApiService.queryPic(this.currentPage, this.pageSize, this.picType)
const { data: res } = await ApiService.queryPic(this.currentPage, this.pageSize, this.formInline)
if (res.code === 200) {
this.picList = res.result.records
this.total = res.result.total
......@@ -210,9 +231,10 @@ export default {
try {
this.loading = true
this.editPicVisible = false
const { data: res } = await ApiService.editPicConfirm(this.currentRowId, this.form.type)
const { data: res } = await ApiService.editPicConfirm(this.currentRowId, this.form.type, this.form.picName)
if (res.code === 200) {
this.form.type = 0
this.form.picName = ''
this.form.type = ''
this.form.picUrl = null
this.currentRowId = null
this.queryPic()
......@@ -227,6 +249,26 @@ export default {
}
},
async batchUpdatePic() {
this.loading = true
this.batchUpdatePicVisible = false
if (this.multipleSelection && this.multipleSelection.length === 0) {
this.loading = false
this.errorMsg('请选择需要处理项')
} else {
let ids = this.multipleSelection.map((item) => item.id)
const { data: res } = await ApiService.batchUpdatePic(ids, this.form.type)
if (res.code === 200) {
this.multipleSelection = []
this.form.type = ''
this.queryPic()
} else {
console.error('Received non-200 status code', res)
}
}
this.loading = false
},
handleCurrentChange(currentPage) {
this.currentPage = currentPage
this.queryPic()
......@@ -235,6 +277,16 @@ export default {
this.pageSize = currentSize
this.queryPic()
},
handleSelectionChange(val) {
this.multipleSelection = val
},
errorMsg(msg) {
this.$message({
showClose: true,
message: msg,
type: 'error',
})
},
},
}
</script>
......
......@@ -32,13 +32,11 @@
{{ props.row.tripletDate | dateDayFormat }}
</template>
</el-table-column>
<el-table-column align="center" sortable prop="likeNum" label="点赞数量" show-overflow-tooltip>
<template slot-scope="scope">
<el-tag :type="isMaxValue(scope.row.likeNum, 'likeNum')">{{ scope.row.likeNum }}</el-tag>
</template>
</el-table-column>
<el-table-column align="center" sortable prop="collectNum" label="收藏数量" show-overflow-tooltip>
<template slot-scope="scope">
<el-tag :type="isMaxValue(scope.row.collectNum, 'collectNum')">{{ scope.row.collectNum }}</el-tag>
......@@ -79,7 +77,6 @@
</template>
<script>
import axios from 'axios'
import ApiService from '../../api/ApiService'
export default {
name: 'MyTripletDayInfo',
......@@ -126,6 +123,8 @@ export default {
endDate: null,
weekInfo: null,
},
form: {
},
tripletDayInfoList: [],
weekInfo: ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期日'],
likeStatus: [
......@@ -174,7 +173,7 @@ export default {
{ type: 2, name: '评论已满' },
{ type: 3, name: '禁言' },
{ type: 4, name: '评论太快' },
{ type: 5, name: '评论已经到了40条' },
{ type: 5, name: '评论已40条' },
{ type: 8, name: '其他错误' },
{ type: 9, name: '评论成功' },
],
......@@ -249,7 +248,6 @@ export default {
res.result.from.content.forEach((item) => {
item.commentStatusName = commentStatusMap[item.commentStatus]
})
this.tripletDayInfoList = res.result.from.content
}
this.loading = false
......@@ -271,7 +269,7 @@ export default {
return 'info'
} else if (statusName == '已经点过赞' || statusName == '已经收藏过' || statusName == '已经评论过') {
return 'success'
} else if (statusName == '文章状态不能点赞' || statusName == '收藏已满' || statusName == '收藏夹不存在' || statusName == '评论已满' || statusName == '禁言' || statusName == '评论已经到了40条') {
} else if (statusName == '文章状态不能点赞' || statusName == '收藏已满' || statusName == '收藏夹不存在' || statusName == '评论已满' || statusName == '禁言' || statusName == '评论已40条') {
return 'danger'
} else if (statusName == '点赞成功' || statusName == '收藏成功' || statusName == '评论成功') {
return 'success'
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册