fix:更新前端

上级 231cfdce
import axios from 'axios' import axios from 'axios'
const BASE_URL = 'http://localhost:80' const BASE_URL = 'http://localhost:80'
// 创建一个名为 ApiService 的对象,包含您的异步方法 // 创建一个名为 ApiService 的对象,包含您的异步方法
const ApiService = { const ApiService = {
...@@ -107,19 +108,26 @@ const ApiService = { ...@@ -107,19 +108,26 @@ const ApiService = {
return await axios.get(BASE_URL + '/csdn/followFans/deleteFollow') return await axios.get(BASE_URL + '/csdn/followFans/deleteFollow')
}, },
//我的图片 //我的图片
async queryPic(currentPage, pageSize, picType) { async queryPic(currentPage, pageSize, formInline) {
return await axios.get(BASE_URL + '/picInfo/page', { return await axios.post(BASE_URL + '/picInfo/page', {
params: { page: currentPage,
page: currentPage, pageSize: pageSize,
pageSize: pageSize, type: formInline.type == '全部' ? '' : formInline.type,
picType: picType, picName: formInline.picName,
},
}) })
}, },
async editPicConfirm(currentRowId, type) { async editPicConfirm(currentRowId, type, picName) {
return await axios.post(BASE_URL + '/picInfo/update', { return await axios.post(BASE_URL + '/picInfo/update', {
id: currentRowId, id: currentRowId,
type: type, 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 = { ...@@ -149,5 +157,38 @@ const ApiService = {
endDate: formInline.accountDate != null ? formInline.accountDate[1] : '', 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 export default ApiService
<template> <template>
<div class="login-container"> <div class="login-container">
<div class="login-box"> <div class="login-box">
<!-- 头像区域 --> <!-- 头像区域 -->
<div class="text-center avatar-box"> <div class="text-center avatar-box">
<img src="../assets/kwan.png" class="img-thumbnail avatar" alt="kwan的解忧杂货铺" /> <img src="../assets/kwan.png" class="img-thumbnail avatar" alt="kwan的解忧杂货铺"/>
</div> </div>
<!-- 表单区域 --> <!-- 表单区域 -->
<div class="form-login p-4"> <div class="form-login p-4">
<!-- 登录名称 --> <!-- 登录名称 -->
<div class="form-group form-inline"> <div class="form-group form-inline">
<label for="username">登录名称</label> <label for="username">登录名称</label>
<input type="text" class="form-control ml-2" id="username" placeholder="请输入登录名称" autocomplete="off" v-model.trim="username" /> <input type="text" class="form-control ml-2" id="username" placeholder="请输入登录名称" autocomplete="off"
</div> v-model.trim="username"/>
<!-- 登录密码 --> </div>
<div class="form-group form-inline"> <!-- 登录密码 -->
<label for="password">登录密码</label> <div class="form-group form-inline">
<input type="password" class="form-control ml-2" id="password" placeholder="请输入登录密码" v-model.trim="password" /> <label for="password">登录密码</label>
</div> <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> <div class="form-group form-inline d-flex justify-content-end">
<button type="button" class="btn btn-primary" @click="login">登录</button> <button type="button" class="btn btn-secondary mr-2" @click="reset">重置</button>
</div> <button type="button" class="btn btn-primary" @click="login">登录</button>
</div> </div>
</div> </div>
</div> </div>
</div>
</template> </template>
<script> <script>
export default { export default {
name: 'MyLogin', name: 'MyLogin',
data() { data() {
return { return {
username: '', username: '',
password: '', password: '',
} }
},
methods: {
reset() {
this.username = ''
this.password = ''
}, },
methods: { login() {
reset() { if (this.username === 'admin' && this.password === '716288') {
this.username = '' // 登录成功
this.password = '' // 1. 存储 token
}, localStorage.setItem('token', 'Bearer xxxx')
login() { // 2. 跳转到后台主页
if (this.username === 'admin' && this.password === '888888') { this.$router.push('/home')
// 登录成功 } else {
// 1. 存储 token // 登录失败
localStorage.setItem('token', 'Bearer xxxx') localStorage.removeItem('token')
// 2. 跳转到后台主页 this.errorMsg('登录失败,请检查您的用户名或密码;由于用户名密码是写死的,需要在项目中查看!!!')
this.$router.push('/home') }
} else {
// 登录失败
localStorage.removeItem('token')
this.errorMsg('登录失败,请检查您的用户名或密码;由于用户名密码是写死的,需要在项目中查看!!!')
}
},
errorMsg(msg) {
this.$message({
showClose: true,
message: msg,
type: 'error',
})
},
}, },
errorMsg(msg) {
this.$message({
showClose: true,
message: msg,
type: 'error',
})
},
},
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.login-container { .login-container {
background-color: #35495e; background-color: #35495e;
height: 100%; height: 100%;
.login-box {
width: 400px; .login-box {
height: 250px; width: 400px;
background-color: #fff; height: 250px;
border-radius: 3px; background-color: #fff;
position: absolute; border-radius: 3px;
left: 50%; position: absolute;
top: 50%; left: 50%;
transform: translate(-50%, -50%); top: 50%;
box-shadow: 0 0 6px rgba(255, 255, 255, 0.5); transform: translate(-50%, -50%);
.form-login { box-shadow: 0 0 6px rgba(255, 255, 255, 0.5);
position: absolute;
bottom: 0; .form-login {
left: 0; position: absolute;
width: 100%; bottom: 0;
box-sizing: border-box; left: 0;
} width: 100%;
} box-sizing: border-box;
}
}
} }
.form-control { .form-control {
flex: 1; flex: 1;
} }
.avatar-box { .avatar-box {
position: absolute; position: absolute;
width: 100%; width: 100%;
top: -65px; top: -65px;
left: 0; left: 0;
.avatar {
width: 120px; .avatar {
height: 120px; width: 120px;
border-radius: 50% !important; height: 120px;
box-shadow: 0 0 6px #efefef; border-radius: 50% !important;
} box-shadow: 0 0 6px #efefef;
}
} }
</style> </style>
\ No newline at end of file
...@@ -124,7 +124,7 @@ ...@@ -124,7 +124,7 @@
</el-dialog> </el-dialog>
</el-form-item> </el-form-item>
</el-form> </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 type="selection" width="50"></el-table-column>
<el-table-column prop="articleId" label="文章id" show-overflow-tooltip></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> <el-table-column prop="userName" label="用户名称" show-overflow-tooltip></el-table-column>
...@@ -282,7 +282,7 @@ export default { ...@@ -282,7 +282,7 @@ export default {
{ type: 2, name: '评论已满' }, { type: 2, name: '评论已满' },
{ type: 3, name: '禁言' }, { type: 3, name: '禁言' },
{ type: 4, name: '评论太快' }, { type: 4, name: '评论太快' },
{ type: 5, name: '评论已经到了40条' }, { type: 5, name: '评论已40条' },
{ type: 8, name: '其他错误' }, { type: 8, name: '其他错误' },
{ type: 9, name: '评论成功' }, { type: 9, name: '评论成功' },
], ],
...@@ -605,7 +605,7 @@ export default { ...@@ -605,7 +605,7 @@ export default {
return 'info' return 'info'
} else if (statusName == '已经点过赞' || statusName == '已经收藏过' || statusName == '已经评论过') { } else if (statusName == '已经点过赞' || statusName == '已经收藏过' || statusName == '已经评论过') {
return 'success' return 'success'
} else if (statusName == '文章状态不能点赞' || statusName == '收藏已满' || statusName == '收藏夹不存在' || statusName == '评论已满' || statusName == '禁言' || statusName == '评论已经到了40条') { } else if (statusName == '文章状态不能点赞' || statusName == '收藏已满' || statusName == '收藏夹不存在' || statusName == '评论已满' || statusName == '禁言' || statusName == '评论已40条') {
return 'danger' return 'danger'
} else if (statusName == '点赞成功' || statusName == '收藏成功' || statusName == '评论成功') { } else if (statusName == '点赞成功' || statusName == '收藏成功' || statusName == '评论成功') {
return 'success' return 'success'
......
此差异已折叠。
<template> <template>
<div> <div>
<el-container> <el-container>
<el-main> <el-main>
<el-form :inline="true" :model="formInline" class="demo-form-inline"> <el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item> <el-form-item>
<el-input size="small" clearable v-model="formInline.userName" placeholder="请输入用户名" @keydown.enter.native="messagePage"></el-input> <el-input size="small" clearable v-model="formInline.userName" placeholder="请输入用户名"
</el-form-item> @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-input size="small" clearable v-model="formInline.nickName" placeholder="请输入用户昵称"
<el-form-item> @keydown.enter.native="messagePage"></el-input>
<el-select size="small" v-model="formInline.hasRepliedInfo" placeholder="请选择收藏状态" @change="messagePage"> </el-form-item>
<el-option v-for="item in hasRepliedInfo" :key="item.type" :label="item.name" :value="item.type"></el-option> <el-form-item>
</el-select> <el-select size="small" v-model="formInline.hasRepliedInfo" placeholder="请选择收藏状态" @change="messagePage">
</el-form-item> <el-option v-for="item in hasRepliedInfo" :key="item.type" :label="item.name"
<el-form-item> :value="item.type"></el-option>
<el-button size="small" type="primary" @click="messagePage">查询</el-button> </el-select>
</el-form-item> </el-form-item>
<el-form-item>
<el-button size="small" type="primary" @click="messagePage">查询</el-button>
</el-form-item>
<el-form-item> <el-form-item>
<el-button size="small" type="primary" @click="prepareRefreshMessage">刷新私信列表</el-button> <el-button size="small" type="primary" @click="prepareRefreshMessage">刷新私信列表</el-button>
<el-dialog title="提示" :visible.sync="refreshMessageDialogVisible" width="30%" :before-close="handleClose"> <el-dialog title="提示" :visible.sync="refreshMessageDialogVisible" width="30%" :before-close="handleClose">
<span>确认刷新私信列表吗?</span> <span>确认刷新私信列表吗?</span>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="refreshMessageDialogVisible = false">取 消</el-button> <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> </span>
</el-dialog> </el-dialog>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button size="small" type="primary" @click="prepareMeaasge">私信点赞收藏</el-button> <el-button size="small" type="primary" @click="messageDeal">私信点赞收藏</el-button>
<el-dialog title="提示" :visible.sync="messageDialogVisible" width="30%" :before-close="handleClose"> </el-form-item>
<span>确认处理私信点赞收藏吗?</span> </el-form>
<span slot="footer" class="dialog-footer"> <el-table border ref="multipleTable" v-loading="loading" :data="csdnMessageList" tooltip-effect="dark"
<el-button @click="messageDialogVisible = false">取 消</el-button> style="width: 100%">
<el-button type="primary" @click.prevent="messageDeal()">确 定</el-button> <el-table-column prop="id" label="序号" width="100" sortable></el-table-column>
</span> <el-table-column prop="userName" label="用户名称" show-overflow-tooltip></el-table-column>
</el-dialog> <el-table-column prop="nickName" label="用户昵称" show-overflow-tooltip>
</el-form-item> <template slot-scope="scope">
</el-form> <a :href="scope.row.messageUrl" target="_blank">{{ scope.row.nickName }}</a>
<el-table ref="multipleTable" v-loading="loading" :data="csdnMessageList" tooltip-effect="dark" style="width: 100%"> </template>
<el-table-column prop="id" label="序号" width="100" sortable></el-table-column> </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> <el-table-column prop="hasRepliedName" label="是否回复" show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<el-tag :type="getTagType(scope.row.hasRepliedName)">{{ scope.row.hasRepliedName }}</el-tag> <el-tag :type="getTagType(scope.row.hasRepliedName)">{{ scope.row.hasRepliedName }}</el-tag>
</template> </template>
</el-table-column> </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="更新时间"> <el-table-column label="更新时间">
<template slot-scope="props"> <template slot-scope="props">
{{ props.row.updateTime | dateFormat }} {{ props.row.updateTime | dateFormat }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="操作" label="操作" width="380px"> <el-table-column prop="操作" label="操作" width="380px">
<template slot-scope="props"> <template slot-scope="props">
<el-button type="primary" @click="prepareDealMessageOne(props.row.userName)" size="small">私信</el-button> <el-button type="primary" @click="dealMessageOne(props.row.userName)" size="small">私信</el-button>
<el-dialog title="提示" :visible.sync="dealMessageOneVisible" width="30%" :before-close="handleClose"> </template>
<span>确认私信吗?</span> </el-table-column>
<span slot="footer" class="dialog-footer"> </el-table>
<el-button @click="dealMessageOneVisible = false">取 消</el-button> <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
<el-button type="primary" @click.prevent="dealMessageOne(currentUserName)">确 定</el-button> :page-sizes="[8, 50, 100, 200, 400]" :page-size="pageSize"
</span> layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</el-dialog> </el-main>
<el-button type="danger" @click="prepareDelete(props.row.id)" size="small">删除</el-button> <el-backtop class="backtop"></el-backtop>
<el-dialog title="提示" :visible.sync="deleteDialogVisible" width="30%" :before-close="handleClose"> </el-container>
<span>确认删除?</span> </div>
<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>
</template> </template>
<script> <script>
import axios from 'axios' import axios from 'axios'
import ApiService from '../../api/ApiService'
export default { export default {
name: 'MyMessage', name: 'MyMessage',
data() { data() {
return { return {
formInline: { formInline: {
userName: '', userName: '',
nickName: '', nickName: '',
hasRepliedInfo: null, hasRepliedInfo: null,
}, },
hasRepliedInfo: [ hasRepliedInfo: [
{ {
type: -1, type: -1,
name: '全部', name: '全部',
}, },
{ {
type: 0, type: 0,
name: '未回复', name: '未回复',
}, },
{ type: 1, name: '已回复' }, {type: 1, name: '已回复'},
], ],
deleteDialogVisible: false, refreshMessageDialogVisible: false,
dealMessageOneVisible: false, // 用户列表数据
messageDialogVisible: false, csdnMessageList: [],
refreshMessageDialogVisible: false, loading: false,
// 用户列表数据 elementui_page_component_key: 0,
csdnMessageList: [], currentPage: Number(localStorage.getItem('csdnUserPage')) || 1,
loading: false, pageSize: 8,
elementui_page_component_key: 0, total: 0,
currentPage: Number(localStorage.getItem('csdnUserPage')) || 1, currentRowId: null,
pageSize: 8, currentUserName: null,
total: 0, }
currentRowId: null, },
currentUserName: null, watch: {
} 'formInline.userName'(newVal, oldVal) {
}, if (newVal !== oldVal) {
watch: { this.currentPage = 1
'formInline.userName'(newVal, oldVal) { localStorage.setItem('csdnUserPage', this.currentPage)
if (newVal !== oldVal) { this.messagePage()
this.currentPage = 1 }
localStorage.setItem('csdnUserPage', this.currentPage) },
this.messagePage() 'formInline.nickName'(newVal, oldVal) {
} if (newVal !== oldVal) {
}, this.currentPage = 1
'formInline.nickName'(newVal, oldVal) { localStorage.setItem('csdnUserPage', this.currentPage)
if (newVal !== oldVal) { this.messagePage()
this.currentPage = 1 }
localStorage.setItem('csdnUserPage', this.currentPage) },
this.messagePage() // 监听currentPage的变化,将新值保存到localStorage中
} currentPage(newPage) {
}, localStorage.setItem('csdnUserPage', newPage.toString())
// 监听currentPage的变化,将新值保存到localStorage中 },
currentPage(newPage) { },
localStorage.setItem('csdnUserPage', newPage.toString()) created() {
}, //获取问题类型的枚举
}, this.messagePage()
created() { },
//获取问题类型的枚举 mounted() {
this.messagePage() this.currentPage = 1
}, },
mounted() { methods: {
this.currentPage = 1 prepareRefreshMessage() {
}, this.refreshMessageDialogVisible = true
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
},
handleClose(done) { handleClose(done) {
this.$confirm('确认关闭?') this.$confirm('确认关闭?')
.then((_) => { .then((_) => {
done() done()
}) })
.catch((_) => {}) .catch((_) => {
}, })
handleConfirm(addType) { },
this.dialogFormVisible = false // 关闭对话框 handleConfirm(addType) {
this.dialogMutiFormVisible = false this.dialogFormVisible = false // 关闭对话框
this.addUser(addType) // 发送请求 this.dialogMutiFormVisible = false
}, this.addUser(addType) // 发送请求
async messagePage() { },
this.loading = true async messagePage() {
const { data: res } = await axios.post('http://localhost:80/csdn/message/page', { this.loading = true
page: this.currentPage, const {data: res} = await ApiService.messagePage(this.currentPage, this.pageSize, this.formInline)
pageSize: this.pageSize, if (res.code === 200) {
userName: this.formInline.userName, this.total = res.result.totalElements
nickName: this.formInline.nickName, const userWeightMap = {}
hasReplied: this.formInline.hasRepliedInfo == -1 ? null : this.formInline.hasRepliedInfo, this.hasRepliedInfo.forEach((option) => {
}) userWeightMap[option.type] = option.name
if (res.code === 200) { })
this.total = res.result.totalElements res.result.content.forEach((item) => {
const userWeightMap = {} item.hasRepliedName = userWeightMap[item.hasReplied]
this.hasRepliedInfo.forEach((option) => { })
userWeightMap[option.type] = option.name this.csdnMessageList = res.result.content
}) }
res.result.content.forEach((item) => { this.loading = false
item.hasRepliedName = userWeightMap[item.hasReplied] },
})
this.csdnMessageList = res.result.content
}
this.loading = false
},
async dealMessageOne(userName) { async dealMessageOne(userName) {
this.loading = true this.loading = true
this.dealMessageOneVisible = false const {data: res} = await ApiService.dealMessageOne(userName)
const { data: res } = await axios.get('http://localhost:80/csdn/message/dealMessageOne?userName=' + userName) if (res.code === 200) {
if (res.code === 200) { this.currentUserName = null
this.currentUserName = null await this.messagePage()
this.messagePage() } else {
} else { console.error('Received non-200 status code', res)
console.error('Received non-200 status code', res) }
} this.loading = false
this.loading = false },
},
async messageDeal() { async messageDeal() {
this.loading = true this.loading = true
this.messageDialogVisible = false const {data: res1} = await ApiService.dealMessage()
const { data: res1 } = await axios.get('http://localhost:80/csdn/message/dealMessage') if (res1.code === 200) {
if (res1.code === 200) { await this.messagePage()
this.messagePage() } else {
} else { console.error('Received non-200 status code', res1)
console.error('Received non-200 status code', res1) }
} const {data: res2} = await ApiService.dealLikeCollect()
const { data: res2 } = await axios.get('http://localhost:80/csdn/likeCollect/dealLikeCollect') if (res2.code === 200) {
if (res2.code === 200) { await this.messagePage()
this.messagePage() } else {
} else { console.error('Received non-200 status code', res2)
console.error('Received non-200 status code', res2) }
} this.loading = false
this.loading = false },
}, async acquireMessage() {
async refreshMessage() { this.loading = true
this.loading = true this.refreshMessageDialogVisible = false
this.refreshMessageDialogVisible = false const {data: res} = await ApiService.acquireMessage()
const { data: res } = await axios.get('http://localhost:80/csdn/message/acquireMessage') if (res.code === 200) {
if (res.code === 200) { await this.messagePage()
this.messagePage() } else {
} else { console.error('Received non-200 status code', res)
console.error('Received non-200 status code', res) }
} this.loading = false
this.loading = false },
}, refreshPage() {
async onDelete(id) { //获取问题类型的枚举
this.loading = true this.messagePage()
const { data: res } = await axios.get('http://localhost:80/csdn/user/delete', { location.reload()
params: { },
id: id, handleCurrentChange(currentPage) {
}, this.currentPage = currentPage
}) this.messagePage()
this.deleteDialogVisible = false },
this.messagePage() handleSizeChange(currentSize) {
this.loading = false this.pageSize = currentSize
}, this.messagePage()
refreshPage() { },
//获取问题类型的枚举 getTagType(hasRepliedName) {
this.messagePage() if (hasRepliedName == '未回复') {
location.reload() return 'warning'
}, } else {
handleCurrentChange(currentPage) { return 'success'
this.currentPage = currentPage }
this.messagePage() },
}, },
handleSizeChange(currentSize) {
this.pageSize = currentSize
this.messagePage()
},
getTagType(hasRepliedName) {
if (hasRepliedName == '未回复') {
return 'warning'
} else {
return 'success'
}
},
},
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.el-header { .el-header {
background-color: #b3c0d1; background-color: #b3c0d1;
color: #333; color: #333;
line-height: 60px; line-height: 60px;
} }
.el-aside { .el-aside {
color: #333; color: #333;
} }
.pagination { .pagination {
margin-top: 16px; margin-top: 16px;
text-align: right; text-align: right;
} }
.header-button-item { .header-button-item {
margin-right: 15px; margin-right: 15px;
font-size: 20px; font-size: 20px;
} }
.red-title { .red-title {
line-height: 24px; line-height: 24px;
font-size: 18px; font-size: 18px;
color: red; color: red;
} }
.backtop { .backtop {
position: fixed; position: fixed;
bottom: 50px; bottom: 50px;
right: 50px; right: 50px;
height: 40px; height: 40px;
width: 40px; width: 40px;
line-height: 40px; line-height: 40px;
text-align: center; text-align: center;
border-radius: 20px; border-radius: 20px;
background-color: #007aff; background-color: #007aff;
color: #fff; color: #fff;
cursor: pointer; cursor: pointer;
z-index: 999; z-index: 999;
} }
.custom-textarea { .custom-textarea {
width: 100%; width: 100%;
text-align: left; text-align: left;
} }
.backtop:hover { .backtop:hover {
background-color: #0050a0; background-color: #0050a0;
} }
</style> </style>
\ No newline at end of file
...@@ -4,8 +4,11 @@ ...@@ -4,8 +4,11 @@
<el-main> <el-main>
<el-form :inline="true" :model="formInline" class="demo-form-inline"> <el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item> <el-form-item>
<el-select size="small" v-model="picType" placeholder="请选择" @change="queryPic"> <el-input size="small" clearable v-model="formInline.picName" placeholder="请输入图片名称" @keydown.enter.native="queryPic"></el-input>
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option> </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-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
...@@ -14,22 +17,44 @@ ...@@ -14,22 +17,44 @@
<el-form-item> <el-form-item>
<el-button size="small" type="primary" @click="prepareAddPic">新增图片</el-button> <el-button size="small" type="primary" @click="prepareAddPic">新增图片</el-button>
<el-dialog title="新增图片" :visible.sync="addPicVisible" style="width: 100%"> <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 slot="trigger" size="small" type="primary">选择图片</el-button>
<el-button style="margin-left: 10px" size="small" type="success" @click="submitUpload">上传到服务器</el-button> <el-button style="margin-left: 10px" size="small" type="success" @click="submitUpload">上传到服务器</el-button>
</el-upload> </el-upload>
</el-dialog> </el-dialog>
</el-form-item> </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="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="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"> <el-table-column align="center">
<template slot-scope="props"> <template slot-scope="props">
<img :src="props.row.picUrl" alt="图片" height="100px" @click="showImageDialog(props.row.picUrl, props.$index)" style="cursor: pointer" /> <img :src="props.row.picUrl" alt="图片" height="100px" @click="showImageDialog(props.row.picUrl, props.$index)" style="cursor: pointer" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="创建时间" align="center"> <el-table-column label="创建时间" align="center">
<template slot-scope="props"> <template slot-scope="props">
{{ props.row.createTime | dateFormat }} {{ props.row.createTime | dateFormat }}
...@@ -38,18 +63,20 @@ ...@@ -38,18 +63,20 @@
<el-table-column prop="操作" label="操作" width="100px" align="center"> <el-table-column prop="操作" label="操作" width="100px" align="center">
<template slot-scope="props"> <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-dialog title="编辑图片信息" :visible.sync="editPicVisible">
<el-form :model="form" class="custom-form"> <el-form :model="form" class="custom-form">
<el-form-item align="center" class="form-item"> <el-form-item align="center" class="form-item">
<img :src="form.picUrl" alt="图片" height="100px" style="cursor: pointer" /> <img :src="form.picUrl" alt="图片" height="100px" style="cursor: pointer" />
</el-form-item> </el-form-item>
<el-form-item label="" class="form-item" align="middle"> <el-form-item label="" class="form-item" align="middle">
<el-select v-model="form.type" placeholder="请选择"> <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-select>
</el-form-item> </el-form-item>
<el-form-item>
<el-input clearable v-model="form.picName" placeholder="请输入图片名称"></el-input>
</el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button @click="editPicVisible = false">取 消</el-button> <el-button @click="editPicVisible = false">取 消</el-button>
...@@ -83,15 +110,19 @@ export default { ...@@ -83,15 +110,19 @@ export default {
name: 'MyPic', name: 'MyPic',
data() { data() {
return { return {
fileUrl: 'http://localhost:80/picInfo/upload',
form: { form: {
picName: '',
picUrl: '', picUrl: '',
type: 0, type: '',
}, },
formInline: { formInline: {
picType: 0, type: '',
picName: '',
}, },
//待上传的图片 //待上传的图片
fileList: [], fileList: [],
multipleSelection: [],
// 用户列表数据 // 用户列表数据
picList: [], picList: [],
loading: false, loading: false,
...@@ -99,54 +130,43 @@ export default { ...@@ -99,54 +130,43 @@ export default {
currentPage: 1, currentPage: 1,
pageSize: 6, pageSize: 6,
total: 0, total: 0,
formLabelWidth: '120px',
imageDialogVisible: false, imageDialogVisible: false,
batchUpdatePicVisible: false,
addPicVisible: false, addPicVisible: false,
editPicVisible: false, editPicVisible: false,
enlargedImageUrl: '', enlargedImageUrl: '',
currentRowId: null, currentRowId: null,
imageIndex: 0, // 当前展示的图片索引 imageIndex: 0, // 当前展示的图片索引
options: [ 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,
} }
}, },
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() { created() {
// 调用请求数据的方法 // 调用请求数据的方法
this.queryPic() this.queryPic()
}, },
methods: { methods: {
prepareBatchUpdatePic() {
this.form.type = ''
this.batchUpdatePicVisible = true
},
getUploadAction() {
return this.fileUrl + '?type=' + this.formInline.type
},
async submitUpload() { async submitUpload() {
this.$refs.upload.submit() this.$refs.upload.submit()
this.addPicVisible = false this.addPicVisible = false
...@@ -160,8 +180,9 @@ export default { ...@@ -160,8 +180,9 @@ export default {
prepareAddPic() { prepareAddPic() {
this.addPicVisible = true this.addPicVisible = true
}, },
prePicEdit(id, picUrl, type) { prePicEdit(id, picName, picUrl, type) {
this.currentRowId = id this.currentRowId = id
this.form.picName = picName
this.form.picUrl = picUrl this.form.picUrl = picUrl
this.form.type = type this.form.type = type
this.editPicVisible = true this.editPicVisible = true
...@@ -199,7 +220,7 @@ export default { ...@@ -199,7 +220,7 @@ export default {
}, },
async queryPic() { async queryPic() {
this.loading = true 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) { if (res.code === 200) {
this.picList = res.result.records this.picList = res.result.records
this.total = res.result.total this.total = res.result.total
...@@ -210,9 +231,10 @@ export default { ...@@ -210,9 +231,10 @@ export default {
try { try {
this.loading = true this.loading = true
this.editPicVisible = false 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) { if (res.code === 200) {
this.form.type = 0 this.form.picName = ''
this.form.type = ''
this.form.picUrl = null this.form.picUrl = null
this.currentRowId = null this.currentRowId = null
this.queryPic() this.queryPic()
...@@ -227,6 +249,26 @@ export default { ...@@ -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) { handleCurrentChange(currentPage) {
this.currentPage = currentPage this.currentPage = currentPage
this.queryPic() this.queryPic()
...@@ -235,6 +277,16 @@ export default { ...@@ -235,6 +277,16 @@ export default {
this.pageSize = currentSize this.pageSize = currentSize
this.queryPic() this.queryPic()
}, },
handleSelectionChange(val) {
this.multipleSelection = val
},
errorMsg(msg) {
this.$message({
showClose: true,
message: msg,
type: 'error',
})
},
}, },
} }
</script> </script>
......
...@@ -32,13 +32,11 @@ ...@@ -32,13 +32,11 @@
{{ props.row.tripletDate | dateDayFormat }} {{ props.row.tripletDate | dateDayFormat }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" sortable prop="likeNum" label="点赞数量" show-overflow-tooltip> <el-table-column align="center" sortable prop="likeNum" label="点赞数量" show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<el-tag :type="isMaxValue(scope.row.likeNum, 'likeNum')">{{ scope.row.likeNum }}</el-tag> <el-tag :type="isMaxValue(scope.row.likeNum, 'likeNum')">{{ scope.row.likeNum }}</el-tag>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" sortable prop="collectNum" label="收藏数量" show-overflow-tooltip> <el-table-column align="center" sortable prop="collectNum" label="收藏数量" show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<el-tag :type="isMaxValue(scope.row.collectNum, 'collectNum')">{{ scope.row.collectNum }}</el-tag> <el-tag :type="isMaxValue(scope.row.collectNum, 'collectNum')">{{ scope.row.collectNum }}</el-tag>
...@@ -79,7 +77,6 @@ ...@@ -79,7 +77,6 @@
</template> </template>
<script> <script>
import axios from 'axios'
import ApiService from '../../api/ApiService' import ApiService from '../../api/ApiService'
export default { export default {
name: 'MyTripletDayInfo', name: 'MyTripletDayInfo',
...@@ -126,6 +123,8 @@ export default { ...@@ -126,6 +123,8 @@ export default {
endDate: null, endDate: null,
weekInfo: null, weekInfo: null,
}, },
form: {
},
tripletDayInfoList: [], tripletDayInfoList: [],
weekInfo: ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期日'], weekInfo: ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期日'],
likeStatus: [ likeStatus: [
...@@ -174,7 +173,7 @@ export default { ...@@ -174,7 +173,7 @@ export default {
{ type: 2, name: '评论已满' }, { type: 2, name: '评论已满' },
{ type: 3, name: '禁言' }, { type: 3, name: '禁言' },
{ type: 4, name: '评论太快' }, { type: 4, name: '评论太快' },
{ type: 5, name: '评论已经到了40条' }, { type: 5, name: '评论已40条' },
{ type: 8, name: '其他错误' }, { type: 8, name: '其他错误' },
{ type: 9, name: '评论成功' }, { type: 9, name: '评论成功' },
], ],
...@@ -249,7 +248,6 @@ export default { ...@@ -249,7 +248,6 @@ export default {
res.result.from.content.forEach((item) => { res.result.from.content.forEach((item) => {
item.commentStatusName = commentStatusMap[item.commentStatus] item.commentStatusName = commentStatusMap[item.commentStatus]
}) })
this.tripletDayInfoList = res.result.from.content this.tripletDayInfoList = res.result.from.content
} }
this.loading = false this.loading = false
...@@ -271,7 +269,7 @@ export default { ...@@ -271,7 +269,7 @@ export default {
return 'info' return 'info'
} else if (statusName == '已经点过赞' || statusName == '已经收藏过' || statusName == '已经评论过') { } else if (statusName == '已经点过赞' || statusName == '已经收藏过' || statusName == '已经评论过') {
return 'success' return 'success'
} else if (statusName == '文章状态不能点赞' || statusName == '收藏已满' || statusName == '收藏夹不存在' || statusName == '评论已满' || statusName == '禁言' || statusName == '评论已经到了40条') { } else if (statusName == '文章状态不能点赞' || statusName == '收藏已满' || statusName == '收藏夹不存在' || statusName == '评论已满' || statusName == '禁言' || statusName == '评论已40条') {
return 'danger' return 'danger'
} else if (statusName == '点赞成功' || statusName == '收藏成功' || statusName == '评论成功') { } else if (statusName == '点赞成功' || statusName == '收藏成功' || statusName == '评论成功') {
return 'success' return 'success'
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册