feat: 更新推荐管理功能,优化推荐描述为必填项,新增音乐搜索功能,简化音乐类型选择,提升用户体验。

This commit is contained in:
wangjie52
2025-08-02 18:31:56 +08:00
parent aa88b63bb2
commit c2fb204692
3 changed files with 48 additions and 6 deletions

View File

@@ -61,7 +61,7 @@ export function delRecommend(id) {
// 获取推荐已绑定的音乐
export function getRecommendBoundMusic(recommendId) {
return request({
url: `/back/re/cate/music/${recommendId}`,
url: `/back/re/music/${recommendId}`,
method: 'get'
})
}
@@ -71,6 +71,5 @@ export function bindMusicToRecommend(recommendId, musicIds) {
return request({
url: `/back/re/bind/${recommendId}/${musicIds.join(',')}`,
method: 'put',
baseURL: 'http://60.205.107.210:8080'
})
}

View File

@@ -87,7 +87,7 @@
<el-form-item label="推荐名称" prop="name" required>
<el-input v-model="form.name" placeholder="请输入推荐名称" />
</el-form-item>
<el-form-item label="推荐描述" prop="desc">
<el-form-item label="推荐描述" prop="desc" required>
<el-input v-model="form.desc" type="textarea" :rows="3" placeholder="请输入推荐描述" />
</el-form-item>
<el-form-item label="推荐图片" required>
@@ -116,12 +116,36 @@
<!-- 绑定音乐对话框 -->
<el-dialog title="绑定音乐" :visible.sync="bindMusicOpen" width="800px" append-to-body>
<!-- 搜索表单 -->
<el-form :model="musicQueryParams" ref="musicQueryForm" size="small" :inline="true" label-width="80px" style="margin-bottom: 15px;">
<el-form-item label="音乐名称" prop="name">
<el-input
v-model="musicQueryParams.name"
placeholder="请输入音乐名称"
clearable
style="width: 150px"
@keyup.enter.native="handleMusicQuery"
/>
</el-form-item>
<el-form-item label="音乐类型" prop="musicType">
<el-select v-model="musicQueryParams.musicType" placeholder="选择音乐类型" clearable style="width: 150px">
<el-option label="全部" value="" />
<el-option label="普通歌曲" value="ordinary" />
<el-option label="混音歌曲" value="mixing" />
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleMusicQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetMusicQuery">重置</el-button>
</el-form-item>
</el-form>
<el-table
ref="musicTable"
v-loading="musicLoading"
:data="musicList"
@selection-change="handleMusicSelectionChange"
height="400"
style="max-height: 300px; overflow-y: auto;"
>
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="音乐名称" align="center" prop="name" :show-overflow-tooltip="true" />
@@ -166,6 +190,7 @@
:page.sync="musicQueryParams.pageNum"
:limit.sync="musicQueryParams.pageSize"
@pagination="handleMusicPagination"
style="margin-top: 15px;"
/>
<div slot="footer" class="dialog-footer">
@@ -216,6 +241,9 @@ export default {
rules: {
name: [
{ required: true, message: "推荐名称不能为空", trigger: "blur" }
],
desc: [
{ required: true, message: "推荐描述不能为空", trigger: "blur" }
]
},
// 图片上传状态
@@ -230,7 +258,8 @@ export default {
musicQueryParams: {
pageNum: 1,
pageSize: 10,
musicType: null
name: null,
musicType: ''
},
bindLoading: false
};
@@ -505,6 +534,18 @@ export default {
this.musicQueryParams.pageNum = val.pageNum;
this.musicQueryParams.pageSize = val.pageSize;
this.getMusicList();
},
/** 搜索音乐 */
handleMusicQuery() {
this.musicQueryParams.pageNum = 1;
this.getMusicList();
},
/** 重置音乐搜索 */
resetMusicQuery() {
this.resetForm("musicQueryForm");
// 重置后保持musicType为空显示全部
this.musicQueryParams.musicType = '';
this.handleMusicQuery();
}
}
};

View File

@@ -241,7 +241,7 @@ export default {
author: null,
vip: null,
shelf: null,
musicType: null
musicType: 'ordinary'
},
form: {},
rules: {
@@ -327,6 +327,8 @@ export default {
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
// 重置后保持musicType为ordinary
this.queryParams.musicType = 'ordinary';
this.handleQuery();
},
/** 新增按钮操作 */