feat(期刊、乐库): 新建期刊发布、添加封面显示、歌词弹窗处理

dev
zjb 8 months ago
parent ffcd5e5198
commit 7728ae9397

@ -35,7 +35,7 @@ export default {
let matched = this.$route.matched.filter(item => item.name)
const first = matched[0]
if (first && first.name !== 'dashboard') {
matched = [{ path: '/dashboard', meta: { title: '首页' }}].concat(matched)
matched = [{ path: '/dashboard', meta: { title: '雀乐' }}].concat(matched)
}
this.levelList = matched
}

@ -2,7 +2,7 @@
* @Author: zhangjiabao
* @Date: 2024-01-25 11:05:17
* @LastEditors: Please set LastEditors
* @LastEditTime: 2024-01-28 19:06:17
* @LastEditTime: 2024-01-30 00:13:14
* @FilePath: /luoo_manage_fe/src/router/index.js
*/
import Vue from "vue";
@ -59,7 +59,7 @@ export const constantRouterMap = [
{
path: "article",
name: "ArticlePublish",
component: () => import("@/views/common/unfinished"),
component: () => import("@/views/article/publish"),
meta: { title: "期刊发布" }
},
{

@ -1,8 +1,8 @@
<!--
* @Author: zhangjiabao
* @Date: 2024-01-24 10:09:33
* @LastEditors: zhangjiabao
* @LastEditTime: 2024-01-29 11:03:47
* @LastEditors: Please set LastEditors
* @LastEditTime: 2024-01-30 00:35:07
* @FilePath: /luoo_manage_fe/src/views/article/articleModify.vue
-->
<!--
@ -47,8 +47,14 @@
filterable
></el-cascader>
</el-form-item>
<el-form-item prop="userId" label="期刊作者">
<el-select
<el-form-item
size="small"
prop="userId"
placeholder="输入发布人名称"
label="期刊作者"
>
<el-input v-model="data.userId"></el-input>
<!-- <el-select
placeholder="输入发布人名称"
size="small"
v-model="data.userId"
@ -59,7 +65,7 @@
:value="item.id"
:key="item.id"
></el-option>
</el-select>
</el-select> -->
</el-form-item>
<el-form-item prop="image" label="上传封面">
<img style="width: 170px;height: 120px;" :src="data.image" />
@ -207,7 +213,11 @@
:before-close="handleLyricDialogBeforeClose"
>
<div v-loading="lyricDialog.loading">
<el-input type="textarea" v-model="lyricDialog.data"></el-input>
<el-input
rows="30"
type="textarea"
v-model="lyricDialog.data"
></el-input>
</div>
<span slot="footer">
<el-button size="small" type="primary" @click="handleLyricDialogSubmit"
@ -392,9 +402,7 @@ export default {
};
},
filters: {},
created() {
this.syncTagDataToComponent();
},
created() {},
components: {
quillEditor,
MusicModify
@ -506,6 +514,7 @@ export default {
this.data.image = response.response.data["fullUrl"];
this.data.size = response.response.data["size"];
this.data.duration = response.response.data["duration"];
this.coverUploadFileList = [];
}
},
handleUploadSongSuccess(response, file, fileList) {
@ -606,8 +615,6 @@ export default {
* 弹窗提交按扭点击事件
*/
handleMusicDialogSubmit() {
this.$message.success("music submit");
// let newList = []
for (let i in this.musicDialog.tableData) {
let item = this.musicDialog.tableData[i];
let isIn = false;

@ -17,12 +17,13 @@
@click="handleChangeActivateTab(0)"
>新建</el-button
>
<el-button
<!-- 暂时隐藏已发布标签 -->
<!-- <el-button
:type="activateTab == 1 ? 'primary' : 'default'"
size="small"
@click="handleChangeActivateTab(1)"
>已发布</el-button
>
> -->
<el-button
:type="activateTab == 2 ? 'primary' : 'default'"
size="small"
@ -127,6 +128,11 @@
{{ scope.$index + 1 }}
</template>
</el-table-column>
<el-table-column label="期刊封面" >
<template slot-scope="scope">
<img style="height: 50px;" :src="scope.row.image">
</template>
</el-table-column>
<el-table-column label="期刊编号" prop="journalNo"></el-table-column>
<el-table-column label="期刊标题" prop="title"></el-table-column>
<el-table-column label="风格标签">

@ -0,0 +1,180 @@
<!--
* @Description: 期刊
* @version: v1
* @Author: zhangjiabao
* @Date: 2024-01-19 23:29:58
-->
<template>
<div class="app-container">
<el-card class="box-card">
<div slot="header" class="card-header clearfix">
<span class="card-header-text">期刊发布</span>
<el-button
style="float: right; margin-top: -5px;"
type="primary"
icon="el-icon-circle-check"
size="small"
@click="save"
>保存期刊</el-button
>
</div>
<ArticleModify
style="margin-left: -200px;"
ref="modifyDialog"
:data="data"
:remoteTagList="remoteData.tags"
:publisher="[]"
></ArticleModify>
</el-card>
</div>
</template>
<script>
import articleApi from "@/api/article";
import tagApi from "@/api/tag";
import ArticleModify from "./articleModify.vue";
export default {
name: "ArticlePublish",
data() {
return {
remoteData: { tags: [] },
data: {
id: null,
title: null,
tag: [],
journalNo: null,
userId: null,
image: null,
songs: [],
size: 0,
content: "",
duration: 0
}
};
},
components: {
ArticleModify
},
filters: {},
created() {
this.fetchSuperFilterTags();
},
methods: {
/**
* 高级筛选tag
*/
fetchSuperFilterTags() {
tagApi.queryHierarchical().then(res => {
let newList = [];
for (let index in res.data) {
let item = res.data[index];
let newItem = { value: item.id, label: item.nameCh, children: [] };
for (let childrenIndex in item.children) {
let childrenItem = item.children[childrenIndex];
newItem.children.push({
value: childrenItem.id,
label: childrenItem.nameCh
});
}
newList.push(newItem);
}
this.remoteData.tags = newList;
});
},
save() {
this.$refs.modifyDialog.$refs.modifyDialogForm.validate(valid => {
if (valid) {
let orgData = this.$refs.modifyDialog.data;
let param = {
id: orgData["id"],
content: orgData["content"],
image: orgData["image"],
journalNo: orgData["journalNo"],
songs: [],
tag: orgData["tag"],
title: orgData["title"],
userId: orgData["userId"]
};
let newMusicIdList = [];
if (orgData.songs) {
for (let i in orgData.songs) {
newMusicIdList.push(orgData.songs[i].id);
}
}
param.songs = newMusicIdList;
console.log(param);
//
articleApi.add(param).then(res => {
if (res.code === 200) {
this.data = {
id: null,
title: null,
tag: [],
journalNo: null,
userId: null,
image: null,
songs: [],
size: 0,
content: "",
duration: 0
};
this.$refs.modifyDialog.selectTag = [];
this.$message.success(res.message);
} else {
this.$message.error(res.message);
}
});
console.log("新增");
return;
} else {
this.$message.error("请完善表单相关信息!");
return false;
}
});
}
}
};
</script>
<style scoped>
.clearfix:before,
.clearfix:after {
display: table;
content: "";
}
.clearfix:after {
clear: both;
}
.card-header {
height: 23px;
}
.app-container {
font-family: "Microsoft YaHei Bold", "Microsoft YaHei Regular",
"Microsoft YaHei", sans-serif;
}
.card-header-text {
font-family: "Microsoft YaHei Bold", "Microsoft YaHei Regular",
"Microsoft YaHei", sans-serif;
font-weight: 700;
font-style: normal;
font-size: 16px;
text-align: left;
line-height: 20px;
letter-spacing: normal;
color: #333333;
}
.box-card {
min-height: 300px;
height: calc(100vh - 140px);
border-radius: 10px;
.el-card__header {
background-color: rgba(249, 249, 249, 1);
}
.el-card__body {
overflow: auto;
height: 100%;
}
}
</style>

@ -248,7 +248,7 @@
:before-close="handleLyricDialogBeforeClose"
>
<div v-loading="lyricDialog.loading">
<el-input type="textarea" v-model="lyricDialog.data"></el-input>
<el-input rows="30" type="textarea" v-model="lyricDialog.data"></el-input>
</div>
<span slot="footer">
<el-button size="small" type="primary" @click="handleLyricDialogSubmit"

Loading…
Cancel
Save