|
|
|
|
@ -124,12 +124,16 @@
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="期刊编号">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<span>VOL</span>
|
|
|
|
|
<span>VOL.</span>
|
|
|
|
|
<span>{{ scope.row.number }}</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="期刊标题" prop="name"></el-table-column>
|
|
|
|
|
<el-table-column label="风格标签" prop="tag"></el-table-column>
|
|
|
|
|
<el-table-column label="风格标签">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<span>{{ getTagNameById(scope.row.tag) }}</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="歌曲数" prop="songCount"></el-table-column>
|
|
|
|
|
<el-table-column
|
|
|
|
|
label="播放次数"
|
|
|
|
|
@ -141,7 +145,11 @@
|
|
|
|
|
prop="commentCount"
|
|
|
|
|
v-if="activateTab === 1"
|
|
|
|
|
></el-table-column>
|
|
|
|
|
<el-table-column label="期刊作者" prop="userId"></el-table-column>
|
|
|
|
|
<el-table-column label="期刊作者">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<span>{{ getAuthorNameById(scope.row.userId) }}</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="创建时间" prop="createTime"></el-table-column>
|
|
|
|
|
<el-table-column
|
|
|
|
|
label="待发布时间"
|
|
|
|
|
@ -188,8 +196,8 @@
|
|
|
|
|
v-model="scope.row.state"
|
|
|
|
|
active-color="#13ce66"
|
|
|
|
|
@change="handleTableRowStatusChange($event, scope.row)"
|
|
|
|
|
:active-value="1"
|
|
|
|
|
:inactive-value="0"
|
|
|
|
|
:active-value="'1'"
|
|
|
|
|
:inactive-value="'0'"
|
|
|
|
|
></el-switch>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
@ -217,12 +225,32 @@
|
|
|
|
|
top="60px"
|
|
|
|
|
:before-close="handleModifyDialogBeforeClose"
|
|
|
|
|
>
|
|
|
|
|
<div style="height: 70vh;overflow: auto;padding-left:20px;padding-right:20px">
|
|
|
|
|
<ArticleModify v-if="modifyDialog.visible && (modifyDialog.type===0 || modifyDialog.type===1)" :data="modifyDialog.data" :remoteTagList="queryForm.remoteData.superFilterTags"></ArticleModify>
|
|
|
|
|
<ArticleDetail v-if="modifyDialog.visible && (modifyDialog.type===2)" :data="modifyDialog.data" :remoteTagList="queryForm.remoteData.superFilterTags"></ArticleDetail>
|
|
|
|
|
<div
|
|
|
|
|
style="height: 70vh;overflow: auto;padding-left:20px;padding-right:20px"
|
|
|
|
|
>
|
|
|
|
|
<ArticleModify
|
|
|
|
|
ref="modifyDialog"
|
|
|
|
|
v-if="
|
|
|
|
|
modifyDialog.visible &&
|
|
|
|
|
(modifyDialog.type === 0 || modifyDialog.type === 1)
|
|
|
|
|
"
|
|
|
|
|
:data="modifyDialog.data"
|
|
|
|
|
:remoteTagList="queryForm.remoteData.superFilterTags"
|
|
|
|
|
:publisher="queryForm.remoteData.publisher"
|
|
|
|
|
></ArticleModify>
|
|
|
|
|
<ArticleDetail
|
|
|
|
|
v-if="modifyDialog.visible && modifyDialog.type === 2"
|
|
|
|
|
:data="modifyDialog.data"
|
|
|
|
|
:remoteTagList="queryForm.remoteData.superFilterTags"
|
|
|
|
|
:publisher="queryForm.remoteData.publisher"
|
|
|
|
|
></ArticleDetail>
|
|
|
|
|
</div>
|
|
|
|
|
<span slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button v-if="(modifyDialog.type===0 || modifyDialog.type===1)" size="small" type="primary" @click="handleDialogSubmit"
|
|
|
|
|
<el-button
|
|
|
|
|
v-if="modifyDialog.type === 0 || modifyDialog.type === 1"
|
|
|
|
|
size="small"
|
|
|
|
|
type="primary"
|
|
|
|
|
@click="handleDialogSubmit"
|
|
|
|
|
>确定</el-button
|
|
|
|
|
>
|
|
|
|
|
<el-button size="small" @click="handleDialogCancel">取消</el-button>
|
|
|
|
|
@ -245,9 +273,10 @@
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import articleApi from "@/api/article";
|
|
|
|
|
import tagApi from "@/api/tag";
|
|
|
|
|
import SuperFilterTagDrawer from "./superFilterTagDrawer.vue";
|
|
|
|
|
import ArticleModify from "./articleModify.vue";
|
|
|
|
|
import ArticleDetail from "./articleDetail.vue"
|
|
|
|
|
import ArticleDetail from "./articleDetail.vue";
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
name: "Article",
|
|
|
|
|
@ -350,11 +379,11 @@ export default {
|
|
|
|
|
rows: [
|
|
|
|
|
{
|
|
|
|
|
commentCount: 0,
|
|
|
|
|
coverPhoto: "coverPhoto",
|
|
|
|
|
coverPhoto: "https://luoow.wxwenku.com/999/cover_min.jpg",
|
|
|
|
|
createTime: "2023-01-01",
|
|
|
|
|
id: "1",
|
|
|
|
|
name: "期刊名称",
|
|
|
|
|
number: "1001",
|
|
|
|
|
number: "742",
|
|
|
|
|
playCount: 1,
|
|
|
|
|
pubTime: "2023-01-01",
|
|
|
|
|
songCount: 1,
|
|
|
|
|
@ -367,7 +396,7 @@ export default {
|
|
|
|
|
journal: [1, 2, 3],
|
|
|
|
|
lyric: "lllll llll lll",
|
|
|
|
|
name: "双节棍",
|
|
|
|
|
picture: "/pic/pic",
|
|
|
|
|
picture: "https://luoow.wxwenku.com/999/cover_min.jpg",
|
|
|
|
|
size: "1.3m",
|
|
|
|
|
state: "1",
|
|
|
|
|
tags: [3, 5, 11],
|
|
|
|
|
@ -380,55 +409,108 @@ export default {
|
|
|
|
|
status: "1",
|
|
|
|
|
summary: "领军 \n 灵精了",
|
|
|
|
|
tag: [3, 5, 11],
|
|
|
|
|
userId: "1"
|
|
|
|
|
userId: "1627863701048659968"
|
|
|
|
|
}
|
|
|
|
|
],
|
|
|
|
|
total: 0
|
|
|
|
|
},
|
|
|
|
|
message: ""
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
this.table.data = res.data.rows;
|
|
|
|
|
this.table.page.total = res.data.total;
|
|
|
|
|
this.table.loading = false;
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.table.data = res.data.rows;
|
|
|
|
|
this.table.page.total = res.data.total;
|
|
|
|
|
this.table.loading = false;
|
|
|
|
|
}, 1000);
|
|
|
|
|
},
|
|
|
|
|
/**
|
|
|
|
|
* 创建人下拉框
|
|
|
|
|
*/
|
|
|
|
|
fetchCreaterList() {
|
|
|
|
|
// articleApi.createrList().then(res => {
|
|
|
|
|
// if (res.code === 200) {
|
|
|
|
|
// this.queryForm.remoteData.publisher = res.data;
|
|
|
|
|
// }
|
|
|
|
|
// });
|
|
|
|
|
this.queryForm.remoteData.publisher = [
|
|
|
|
|
{ id: 1, name: "落在低处" },
|
|
|
|
|
{ id: 2, name: "左岸以西" }
|
|
|
|
|
];
|
|
|
|
|
tagApi.createrList().then(res => {
|
|
|
|
|
if (res.code === 200) {
|
|
|
|
|
this.queryForm.remoteData.publisher = res.data;
|
|
|
|
|
} else {
|
|
|
|
|
this.queryForm.remoteData.publisher = [];
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
/**
|
|
|
|
|
* 高级筛选tag
|
|
|
|
|
*/
|
|
|
|
|
fetchSuperFilterTags() {
|
|
|
|
|
this.queryForm.remoteData.superFilterTags = [
|
|
|
|
|
// tagApi.queryHierarchical().then(res => {
|
|
|
|
|
// console.log(res)
|
|
|
|
|
// })
|
|
|
|
|
let res = [
|
|
|
|
|
{
|
|
|
|
|
value: 1,
|
|
|
|
|
label: "语言类型",
|
|
|
|
|
id: 1,
|
|
|
|
|
nameCh: "语言类型",
|
|
|
|
|
children: [
|
|
|
|
|
{ value: 3, label: "中文" },
|
|
|
|
|
{ value: 4, label: "日文" },
|
|
|
|
|
{ value: 5, label: "英文" }
|
|
|
|
|
{ id: 3, nameCh: "中文" },
|
|
|
|
|
{ id: 4, nameCh: "日文" },
|
|
|
|
|
{ id: 5, nameCh: "英文" }
|
|
|
|
|
]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: 10,
|
|
|
|
|
label: "期刊标签",
|
|
|
|
|
id: 10,
|
|
|
|
|
nameCh: "期刊标签",
|
|
|
|
|
children: [
|
|
|
|
|
{ value: 11, label: "民谣" },
|
|
|
|
|
{ value: 12, label: "摇滚" }
|
|
|
|
|
{ id: 11, nameCh: "民谣" },
|
|
|
|
|
{ id: 12, nameCh: "摇滚" }
|
|
|
|
|
]
|
|
|
|
|
}
|
|
|
|
|
];
|
|
|
|
|
let newList = [];
|
|
|
|
|
for (let index in res) {
|
|
|
|
|
let item = res[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.queryForm.remoteData.superFilterTags = newList;
|
|
|
|
|
},
|
|
|
|
|
// ************************* 数据处理 *************************
|
|
|
|
|
getAuthorNameById(userId) {
|
|
|
|
|
for (let index in this.queryForm.remoteData.publisher) {
|
|
|
|
|
let item = this.queryForm.remoteData.publisher[index];
|
|
|
|
|
if (item.id === userId) {
|
|
|
|
|
return item.name;
|
|
|
|
|
}
|
|
|
|
|
return "";
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
getTagNameById(tagIdList) {
|
|
|
|
|
let tagList = [];
|
|
|
|
|
for (let tagIdIndex in tagIdList) {
|
|
|
|
|
let tagId = tagIdList[tagIdIndex];
|
|
|
|
|
for (let index in this.queryForm.remoteData.superFilterTags) {
|
|
|
|
|
let item = this.queryForm.remoteData.superFilterTags[index];
|
|
|
|
|
if (item.value === tagId) {
|
|
|
|
|
tagList.push(item.label);
|
|
|
|
|
}
|
|
|
|
|
if (!item.children) {
|
|
|
|
|
continue;
|
|
|
|
|
}
|
|
|
|
|
for (let subIndex in item.children) {
|
|
|
|
|
let subItem = item.children[subIndex];
|
|
|
|
|
if (subItem.value === tagId) {
|
|
|
|
|
tagList.push(subItem.label);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
let name = "";
|
|
|
|
|
for (let index in tagList) {
|
|
|
|
|
name = name + "#" + tagList[index] + " ";
|
|
|
|
|
}
|
|
|
|
|
return name;
|
|
|
|
|
},
|
|
|
|
|
// ************************* 按扭事件 *************************
|
|
|
|
|
/**
|
|
|
|
|
@ -461,9 +543,9 @@ export default {
|
|
|
|
|
* 高级筛选中的查询按钮
|
|
|
|
|
*/
|
|
|
|
|
handleSuperFilterTagQuery(val) {
|
|
|
|
|
let tags = []
|
|
|
|
|
for(let i in val) {
|
|
|
|
|
tags.push(val[i].value)
|
|
|
|
|
let tags = [];
|
|
|
|
|
for (let i in val) {
|
|
|
|
|
tags.push(val[i].value);
|
|
|
|
|
}
|
|
|
|
|
let queryParam = {
|
|
|
|
|
name: null,
|
|
|
|
|
@ -546,53 +628,47 @@ export default {
|
|
|
|
|
* 弹窗确定按扭点击事件
|
|
|
|
|
*/
|
|
|
|
|
handleDialogSubmit() {
|
|
|
|
|
this.$refs.modifyDialogForm.validate(valid => {
|
|
|
|
|
debugger;
|
|
|
|
|
this.$refs.modifyDialog.$refs.modifyDialogForm.validate(valid => {
|
|
|
|
|
if (valid) {
|
|
|
|
|
// 新增
|
|
|
|
|
if (this.modifyDialog.type === 0) {
|
|
|
|
|
// tagApi.create(this.modifyDialog.form.data).then(res => {
|
|
|
|
|
// if (res.code === 200) {
|
|
|
|
|
// this.$message.success(res.message);
|
|
|
|
|
// this.modifyDialog.visible = false;
|
|
|
|
|
// this.table.page.current = 1;
|
|
|
|
|
// // 新增时重置查询条件
|
|
|
|
|
// this.handleResetClick();
|
|
|
|
|
// this.fetchData(this.queryForm.data);
|
|
|
|
|
// } else {
|
|
|
|
|
// this.$message.error(res.message);
|
|
|
|
|
// }
|
|
|
|
|
// });
|
|
|
|
|
this.$message.success("新增");
|
|
|
|
|
|
|
|
|
|
console.log(this.$refs.modifyDialog.data);
|
|
|
|
|
articleApi.add(this.$refs.modifyDialog.data).then(res => {
|
|
|
|
|
if (res.code === 200) {
|
|
|
|
|
this.$message.success(res.message);
|
|
|
|
|
this.modifyDialog.visible = false;
|
|
|
|
|
this.table.page.current = 1;
|
|
|
|
|
// 新增时重置查询条件
|
|
|
|
|
this.handleResetClick();
|
|
|
|
|
this.fetchData(this.queryForm.lastQuery);
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.error(res.message);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
console.log("编辑");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 编辑
|
|
|
|
|
if (this.modifyDialog.type === 1) {
|
|
|
|
|
// tagApi.update(this.modifyDialog.form.data).then(res => {
|
|
|
|
|
// if (res.code === 200) {
|
|
|
|
|
// this.$message.success(res.message);
|
|
|
|
|
// this.modifyDialog.visible = false;
|
|
|
|
|
// this.fetchData(this.queryForm.lastQuery);
|
|
|
|
|
// } else {
|
|
|
|
|
// this.$message.error(res.message);
|
|
|
|
|
// }
|
|
|
|
|
// });
|
|
|
|
|
this.$message.success("编辑");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 详情
|
|
|
|
|
if (this.modifyDialog.type === 2) {
|
|
|
|
|
// tagApi.create(this.modifyDialog.form.data).then(res => {
|
|
|
|
|
// if (res.code === 200) {
|
|
|
|
|
// this.$message.success(res.message);
|
|
|
|
|
// this.modifyDialog.visible = false;
|
|
|
|
|
// this.fetchData(this.queryForm.lastQuery);
|
|
|
|
|
// } else {
|
|
|
|
|
// this.$message.error(res.message);
|
|
|
|
|
// }
|
|
|
|
|
// });
|
|
|
|
|
this.$message.success("详情");
|
|
|
|
|
console.log(this.$refs.modifyDialog.data);
|
|
|
|
|
articleApi
|
|
|
|
|
.update(
|
|
|
|
|
this.$refs.modifyDialog.data.id,
|
|
|
|
|
this.$refs.modifyDialog.data
|
|
|
|
|
)
|
|
|
|
|
.then(res => {
|
|
|
|
|
if (res.code === 200) {
|
|
|
|
|
this.$message.success(res.message);
|
|
|
|
|
this.modifyDialog.visible = false;
|
|
|
|
|
this.fetchData(this.queryForm.lastQuery);
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.error(res.message);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
console.log("编辑");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
|
