fix:项目初始化
This commit is contained in:
ouyangxiu
@@ -0,0 +1,107 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="80px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="标签名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入标签名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="排序" prop="rank">
|
||||
<el-input v-model.number="form.rank" placeholder="请输入排序" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="观看数" prop="watchTimes">
|
||||
<el-input v-model.number="form.watchTimes" placeholder="请输入观看数" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="是否启用" prop="status">
|
||||
<el-switch v-model="form.status" active-color="#13ce66" inactive-color="#ff4949" active-text="开启" inactive-text="关闭"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit('ruleForm')"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import { comicsTagAdd, comicsTagUpdate } from '@/api/resourceManagement/comics.js'
|
||||
import UploadImg from '@/components/UploadImg/index'
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data'],
|
||||
components: {
|
||||
UploadImg,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
cover: undefined, //"string",
|
||||
name: undefined, //"string",
|
||||
rank: undefined, //0,
|
||||
status: undefined, // true,
|
||||
watchTimes: undefined, // 0
|
||||
},
|
||||
rules: {},
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
if (this.title === '编辑') {
|
||||
this.form = { ...this.data.data }
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
add(data) {
|
||||
comicsTagAdd(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('新增失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
update(data) {
|
||||
comicsTagUpdate(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 提交按钮
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.title === '新增') {
|
||||
this.add(this.form)
|
||||
} else if (this.title === '编辑') {
|
||||
this.update(this.form)
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,208 @@
|
||||
<template>
|
||||
<div class="pf-warpper avlist">
|
||||
<el-row class="table-form">
|
||||
<el-form :inline="true" :model="searchData" class="form-inline" size="mini">
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入标签ID" clearable v-model.number="searchData.id" @clear="onClear('id')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入标签名称" clearable v-model.trim="searchData.name" @clear="onClear('name')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择是否启用" clearable v-model="searchData.status" @clear="onClear('status')">
|
||||
<el-option label="启用" :value="true" />
|
||||
<el-option label="未启用" :value="false" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="排序方式" clearable v-model.number="searchData.sort" @clear="onClear('sort')">
|
||||
<el-option label="rank排序" :value="0" />
|
||||
<el-option label="观看次数排序" :value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="onSearch" icon="el-icon-search" plain type="primary">搜索</el-button>
|
||||
<el-button @click="add" icon="el-icon-circle-plus-outline" plain type="success">新增</el-button>
|
||||
<el-button @click="getList" icon="el-icon-refresh" plain type="info">刷新</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col>
|
||||
<el-table :data="resData" element-loading-text="拼命加载中" border height="750" highlight-current-row style="width: 100%" v-loading="loading">
|
||||
<el-table-column align="center" label="标签ID" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.id }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="标签名称" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.name }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="标签排序" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.rank }}</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column align="center" label="标签封面">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width: 104px; height: 70px; margin: 0 auto" :urls="scope.row.cover"></ShowImg>
|
||||
</template>
|
||||
</el-table-column> -->
|
||||
<el-table-column align="center" label="观看次数" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.watchTimes }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否展示" width="80">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.status ? '展示' : '不展示'
|
||||
}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="创建时间" width="180">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.createdAt | BeiJingTime
|
||||
}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="更新时间" width="180">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.updatedAt | BeiJingTime
|
||||
}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="180">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="handleEdit(scope.$index, scope.row)" size="mini" type="primary">编辑
|
||||
</el-button>
|
||||
<el-button @click="handleDelete(scope.$index, scope.row)" size="mini" type="danger">删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="table-pagination">
|
||||
<el-pagination :current-page="searchData.pageNum" :page-size="searchData.pageSize" :page-sizes="[10, 20, 30, 50, 100]" :total="total" @current-change="handleCurrentChange" @size-change="handleSizeChange" layout="total, sizes, prev, pager, next, jumper" />
|
||||
</div>
|
||||
<!-- 新增及编辑 -->
|
||||
<Edit :data="editData" v-if="editVisible" @close="closeEdit" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// 引入模块
|
||||
import Edit from './components/AddOrEdit'
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
import { comicsTagList, comicsTagDel } from '@/api/resourceManagement/comics.js'
|
||||
|
||||
export default {
|
||||
name: 'ComicsTag',
|
||||
components: {
|
||||
Edit,
|
||||
ShowImg,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 50,
|
||||
name: undefined, //"string",
|
||||
status: undefined, // true
|
||||
},
|
||||
resData: [], // el-table表格数据
|
||||
editVisible: false, // 新增或编辑弹出框
|
||||
total: 0, // 数据总条数
|
||||
loading: false, // 列表加载状态
|
||||
|
||||
// 编辑数据
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {},
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
//TODO:请求漫画标签列表数据
|
||||
getList() {
|
||||
this.loading = true
|
||||
comicsTagList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.count
|
||||
} else {
|
||||
this.$message.error('请求列表失败!')
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
//TODO：删除漫画标签列表数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}).then(() => {
|
||||
comicsTagDel({ id: row.id }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.getList()
|
||||
this.$message.success('成功删除!')
|
||||
} else {
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
onSearch() {
|
||||
this.searchData.pageNum = 1
|
||||
this.searchData.pageSize = 50
|
||||
this.getList()
|
||||
},
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getList()
|
||||
},
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getList()
|
||||
},
|
||||
|
||||
// 新增按钮
|
||||
add() {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {},
|
||||
}
|
||||
},
|
||||
// 编辑按钮
|
||||
handleEdit(index, row) {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row,
|
||||
}
|
||||
},
|
||||
|
||||
// 关闭编辑弹窗
|
||||
closeEdit() {
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {},
|
||||
}
|
||||
this.editVisible = false
|
||||
this.getList()
|
||||
},
|
||||
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getList()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,335 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" calss="ac-dialog" center width="800px" @close="close">
|
||||
<div>
|
||||
<el-form :rules="rules" :model="dialogForm" label-width="130px" ref="dialogForm">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="漫画标题">
|
||||
<el-input placeholder="请输入标题" v-model="dialogForm.title" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="漫画作者">
|
||||
<el-input placeholder="请输入作者" v-model="dialogForm.author" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="漫画主题">
|
||||
<el-select placeholder="请选择漫画主题" v-model="dialogForm.topics" filterable multiple>
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in topicsList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="漫画标签">
|
||||
<el-select placeholder="请选择漫画标题" v-model="dialogForm.tags" value-key="id" filterable multiple>
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in labelList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="排序" prop="rank">
|
||||
<el-input placeholder="请输入排序" v-model.number="dialogForm.rank" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="是否VIP" prop="isVip">
|
||||
<el-switch v-model="dialogForm.isVip" :active-value="true" :inactive-value="false" active-color="#13ce66" inactive-color="#ff4949"> </el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="是否参与会员日活动" prop="memberDayActivity">
|
||||
<el-switch v-model="dialogForm.memberDayActivity" :active-value="true" :inactive-value="false" active-color="#13ce66" inactive-color="#ff4949"> </el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="圈子">
|
||||
<el-select style="width: 180px" clearable placeholder="请选择圈子" v-model="dialogForm.circleId" filterable>
|
||||
<el-option :key="item.id + item.name" :label="item.name" :value="item.id" v-for="item in circleList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="免费章节" prop="noneChapter">
|
||||
<el-input placeholder="请输入免费章节" v-model.number="dialogForm.noneChapter" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="封面">
|
||||
<UploadImg @onRemove="onRemove('coverImg')" @changeImgUrl="changeCoverImg('coverImg',$event)" :img="dialogForm.coverImg"> </UploadImg>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="背景图">
|
||||
<UploadImg @onRemove="onRemove('backgroundImg')" @changeImgUrl="changeCoverImg('backgroundImg',$event)" :img="dialogForm.backgroundImg"> </UploadImg>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="人物图">
|
||||
<UploadImg @onRemove="onRemove('characterImg')" @changeImgUrl="changeCoverImg('characterImg',$event)" :img="dialogForm.characterImg"> </UploadImg>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="章节数量">
|
||||
<el-input placeholder="请输入章节数量" v-model.number="dialogForm.chapterCount" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="最新章节">
|
||||
<el-input placeholder="请输入最新章节" v-model.number="dialogForm.newChapter" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="售价">
|
||||
<el-input placeholder="请输入售价" v-model.number="dialogForm.price" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="漫画上架状态">
|
||||
<el-select placeholder="请选择漫画上架状态" v-model="dialogForm.status">
|
||||
<el-option label="上架" :value="1" />
|
||||
<el-option label="下架" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="漫画更新状态">
|
||||
<el-select placeholder="请选择漫画更新状态" v-model="dialogForm.updateStatus">
|
||||
<el-option label="待发布" :value="0" />
|
||||
<el-option label="连载中" :value="1" />
|
||||
<el-option label="已完结" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
||||
<el-form-item label="描述" prop="desc">
|
||||
<el-input placeholder="请输入描述" v-model="dialogForm.desc" type="textarea" style="width: 520px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24">
|
||||
<el-form-item label="背景颜色">
|
||||
<el-color-picker v-model="dialogForm.backgroundColor"></el-color-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<template v-for="(item, index) in dialogForm.roleList">
|
||||
<el-row :key="index" :gutter="10" style="background: #efe4d2; padding: 5px 0; margin: 5px 0">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="CV">
|
||||
<el-select placeholder="请选择CvId" v-model="item.comicsCvId">
|
||||
<el-option :label="item.name" :value="item.id" v-for="(item, index) in resData" :key="index" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="配音角色">
|
||||
<el-input placeholder="请输入配音角色" v-model="item.roleName" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="4" :md="4" :sm="4" :xl="4" :xs="4">
|
||||
<el-button v-if="dialogForm.roleList.length === index + 1" type="succsees" size="mini" icon="el-icon-circle-plus-outline" @click="addSectionItem"> 新增节点 </el-button>
|
||||
<el-button type="danger" size="mini" style="margin: 5px 0" icon="el-icon-delete-solid" @click="delSectionItem(index)"> 删除节点 </el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="dialog-footer" slot="footer">
|
||||
<el-button @click="Visible = false">取 消</el-button>
|
||||
<el-button @click="submitForm('dialogForm')" type="primary">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import { comicsAdd, comicsUpdate } from '@/api/resourceManagement/comics.js';
|
||||
import { comicLabelsList } from '@/api/comicsManagement/comicsTopic';
|
||||
import { comicsCvList } from '@/api/comicsManagement/comicsCV';
|
||||
import { changeMoneyYuan, changeMoneyFen, arryToString, stringToArry } from '@/filters/index';
|
||||
import UploadImg from '@/components/UploadImg/index';
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data', 'circleList'],
|
||||
components: {
|
||||
UploadImg,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
dialogForm: {
|
||||
author: undefined, // "string",漫画作者
|
||||
chapterCount: undefined, // 0,章节数量
|
||||
coverImg: undefined, // "string",封面
|
||||
desc: undefined, // "string",描述信息
|
||||
|
||||
isVip: undefined, // true,是否VIp
|
||||
newChapter: undefined, // 0,最新章节
|
||||
price: undefined, // 0,售价，单位分
|
||||
rank: undefined, // 0,排序
|
||||
status: undefined, // 0,漫画状态
|
||||
tags: [], // 0 漫画标签
|
||||
title: undefined, // string 标题
|
||||
topics: undefined, // 0 漫画话题
|
||||
updateStatus: undefined, // 漫画更新状态
|
||||
noneChapter: undefined, // 免费章节
|
||||
circleId: undefined,
|
||||
memberDayActivity:undefined, // 是否参与会员日活动
|
||||
roleList: [
|
||||
{
|
||||
comicsId: undefined,
|
||||
roleName: undefined,
|
||||
},
|
||||
],
|
||||
},
|
||||
topicsList: this.$store.getters.comicsTopicList,
|
||||
labelList: [],
|
||||
rules: {
|
||||
// sort: [{ required: true, message: '必填', trigger: 'blur' }],
|
||||
},
|
||||
resData: [],
|
||||
};
|
||||
},
|
||||
|
||||
async mounted() {
|
||||
this.title = this.data.title;
|
||||
if (this.title === '编辑') {
|
||||
this.dialogForm = { ...this.data.data };
|
||||
if (!this.dialogForm.roleList.length) {
|
||||
this.dialogForm.roleList.push({
|
||||
comicsId: undefined,
|
||||
roleName: undefined,
|
||||
});
|
||||
console.log(this.dialogForm, 'dialogForm');
|
||||
}
|
||||
this.dialogForm.price = changeMoneyYuan(this.dialogForm.price);
|
||||
this.dialogForm.author = arryToString(this.data.data.author);
|
||||
}
|
||||
this.getComicLabelsList();
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
// TODO:请求漫画标签列表数据
|
||||
getList() {
|
||||
this.loading = true;
|
||||
comicsCvList({ pageNum: 1, pageSize: 50 }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list;
|
||||
} else {
|
||||
this.$message.error('请求列表失败!');
|
||||
this.resData = [];
|
||||
this.total = 0;
|
||||
}
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
addSectionItem() {
|
||||
this.dialogForm.roleList.push({
|
||||
comicsId: undefined,
|
||||
roleName: undefined,
|
||||
});
|
||||
},
|
||||
delSectionItem(index) {
|
||||
this.dialogForm.roleList.splice(index, 1);
|
||||
},
|
||||
// TODO：请求漫画标签列表
|
||||
async getComicLabelsList() {
|
||||
console.log('tianjia1');
|
||||
this.labelList = this.title === '编辑' ? this.data.data.tagName : [];
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
// pageSize: 500,
|
||||
status: true,
|
||||
};
|
||||
comicLabelsList(param).then(res => {
|
||||
if (res.code === 200) {
|
||||
// if (this.title === '编辑') {
|
||||
// for (let tagindex = 0; tagindex < this.data.data.tagName.length; tagindex++) {
|
||||
// const tag = this.data.data.tagName[tagindex]
|
||||
// let e = 0
|
||||
// for (let index = 0; index < this.labelList.length; index++) {
|
||||
// const element = this.labelList[index]
|
||||
// if (element.id === tag.id) {
|
||||
// e = 1
|
||||
// }
|
||||
// }
|
||||
// if (e === 0) {
|
||||
// this.labelList.push(tag)
|
||||
// }
|
||||
// }
|
||||
// res.data.forEach(item => {
|
||||
// });
|
||||
// this.labelList = res.data
|
||||
// } else {
|
||||
// this.labelList = res.data
|
||||
// }
|
||||
this.labelList = res.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
// TODO:新增漫画列表数据
|
||||
comicsAddFun(data) {
|
||||
comicsAdd(data).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功');
|
||||
this.Visible = false;
|
||||
} else {
|
||||
this.$message.error('新增失败');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// TODO:编辑漫画列表数据
|
||||
comicsUpdateFun(data) {
|
||||
comicsUpdate(data).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('编辑成功');
|
||||
this.Visible = false;
|
||||
} else {
|
||||
this.$message.error('编辑失败');
|
||||
}
|
||||
});
|
||||
},
|
||||
changeCoverImg(key,data) {
|
||||
console.log(key,data);
|
||||
this.dialogForm[key] = data;
|
||||
},
|
||||
onRemove(data) {
|
||||
this.dialogForm[data] = undefined;
|
||||
},
|
||||
|
||||
close() {
|
||||
this.$emit('close');
|
||||
},
|
||||
|
||||
// 提交按钮
|
||||
submitForm(formName) {
|
||||
this.$refs[formName].validate(valid => {
|
||||
if (valid) {
|
||||
const data = JSON.parse(JSON.stringify(this.dialogForm));
|
||||
data.price = data.price ? changeMoneyFen(data.price) : 0;
|
||||
data.author = stringToArry(data.author);
|
||||
data.circleId = data.circleId ? data.circleId : undefined;
|
||||
if (this.title === '编辑') {
|
||||
this.comicsUpdateFun(data);
|
||||
} else {
|
||||
this.comicsAddFun(data);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,72 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-05-17 14:17:25
|
||||
* @LastEditTime: 2022-06-09 11:04:13
|
||||
* @LastEditors:
|
||||
* @FilePath: /comics-admin/src/views/comicsManagement/comics/components/EditCom.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog :close-on-click-modal="false" :title="title" :visible.sync="Visible" @close="close" center class="ac-dialog" width="500px">
|
||||
<el-form :inline="true" :model="form" class="demo-form-inline" label-position="right" label-width="100px" ref="form">
|
||||
<el-row :gutter="24">
|
||||
<el-col :lg="24" :md="24" :sm="24" :xl="24" :xs="24">
|
||||
<el-form-item label="用户ID">
|
||||
<el-input v-model.number="form.userId" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="24" :md="24" :sm="24" :xl="24" :xs="24">
|
||||
<el-form-item label="评论内容">
|
||||
<el-input v-model="form.text" type="textarea" style="width:300px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div class="dialog-footer" slot="footer">
|
||||
<el-button @click="Visible=false">取 消</el-button>
|
||||
<el-button @click="submit('form')" type="primary">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { comicsAddComment } from '@/api/comicsManagement/comics'
|
||||
export default {
|
||||
name: 'EditCom',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
userId: undefined, // 用户id
|
||||
comicsId: undefined, //漫画ID
|
||||
text: undefined, //评论
|
||||
},
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
this.form.comicsId = this.data.data.id
|
||||
},
|
||||
methods: {
|
||||
//TODO：添加评论
|
||||
submit(formName) {
|
||||
comicsAddComment(this.form).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('评论成功')
|
||||
this.close()
|
||||
} else {
|
||||
this.$message.error('评论失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close', false)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,96 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-04-06 17:32:20
|
||||
* @LastEditTime: 2022-06-09 11:08:45
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @FilePath: /comics-admin/src/views/comicsManagement/comics/components/setTag.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="120px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="漫画标签">
|
||||
<el-select placeholder="请选择漫画标题" v-model="form.tags" value-key="id" filterable multiple>
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in labelList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { comicsAddTags } from '@/api/comicsManagement/comics'
|
||||
import { comicLabelsList } from '@/api/comicsManagement/comicsTopic'
|
||||
export default {
|
||||
name: 'SetTag',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
MediaSatusList: [],
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
tags: [] // 0 漫画标签
|
||||
},
|
||||
//
|
||||
rules: {},
|
||||
labelList: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getComicLabelsList()
|
||||
},
|
||||
methods: {
|
||||
// TODO：请求漫画标签列表
|
||||
async getComicLabelsList() {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
status: true
|
||||
}
|
||||
comicLabelsList(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.labelList = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:批量增加漫画标签
|
||||
submit() {
|
||||
if (this.data.length) {
|
||||
const comicsIds = []
|
||||
this.data.forEach((item) => {
|
||||
comicsIds.push(item.id)
|
||||
})
|
||||
const param = {
|
||||
comicsIds: comicsIds,
|
||||
tags: this.form.tags
|
||||
}
|
||||
comicsAddTags(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('增加标签成功')
|
||||
} else {
|
||||
this.$message.error('增加标签失败')
|
||||
}
|
||||
this.Visible = false
|
||||
})
|
||||
} else {
|
||||
this.$message.error('未选择视频')
|
||||
}
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false"
|
||||
@close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules"
|
||||
ref="ruleForm" class="demo-form-inline" label-width="80px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="漫画ID" prop="comicsId">
|
||||
<el-input v-model.number="form.comicsId" placeholder="请输入漫画ID" disabled style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="章节序列" prop="chapterNum">
|
||||
<el-input v-model.number="form.chapterNum" placeholder="请输入章节序列" style="width: 180px">
|
||||
<template slot="prepend">第</template>
|
||||
<template slot="append">话</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="章节标题" prop="title">
|
||||
<el-input v-model="form.title" placeholder="请输入章节标题" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="章节页数" prop="pageNum">
|
||||
<el-input v-model.number="form.pageNum" placeholder="请输入章节页数" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col v-loading.fullscreen.lock="isAddReqLoading" element-loading-text="漫画添加中" :span="24" :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
||||
<el-form-item label="内容图片" label-width="655px" class="upLoadFormItem" style="text-align:center">
|
||||
<UploadComicsImgArrByOrder @changeImgUrl='changeImagesUrl' @setIsUploadIng='setIsUploadIng'
|
||||
:img='form.chapter'>
|
||||
</UploadComicsImgArrByOrder>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="是否启用" prop="status">
|
||||
<el-switch v-model="form.status" active-color="#13ce66" inactive-color="#ff4949" active-text="开启"
|
||||
inactive-text="关闭"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="最新章节" prop="isNew">
|
||||
<el-switch v-model="form.isNew" active-color="#13ce66" inactive-color="#ff4949" active-text="最新"
|
||||
inactive-text="非最新"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
||||
<el-form-item label="章节描述" prop="desc">
|
||||
<el-input placeholder="请输入章节描述" v-model="form.desc" type="textarea" style="width: 520px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit('ruleForm')"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
comicChapterAdd,
|
||||
comicChapterUpdate,
|
||||
} from '@/api/comicsManagement/comicChapter'
|
||||
import UploadComicsImgArrByOrder from '@/components/UploadComicsImgArrByOrder/index'
|
||||
export default {
|
||||
name: 'ChapterAddOrEdit',
|
||||
props: ['data'],
|
||||
components: {
|
||||
UploadComicsImgArrByOrder,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
chapter: undefined, //[]内容图片
|
||||
chapterNum: undefined, // 0,第几章节
|
||||
comicsId: undefined, // 0,漫画ID
|
||||
desc: undefined, // "string",章节描述
|
||||
isNew: undefined, // true,是否为最新章节
|
||||
pageNum: undefined, // 0,章节页数
|
||||
status: undefined, // true,是否启用
|
||||
title: undefined, // "string",章节标题
|
||||
jmid: undefined, //漫画唯一标识
|
||||
},
|
||||
rules: {},
|
||||
isUploadIng: false,
|
||||
isAddReqLoading: false
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
if (this.title === '编辑') {
|
||||
this.form = { ...this.data.data }
|
||||
// this.form.jmid
|
||||
} else {
|
||||
this.form.jmid = this.data.data.jmid
|
||||
this.form.comicsId = this.data.data.id
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//TODO：新增漫画章节列表数据
|
||||
add(data) {
|
||||
if (this.isUploadIng) {
|
||||
this.$message('图片上传中,稍后尝试');
|
||||
|
||||
return false
|
||||
}
|
||||
if (this.isAddReqLoading) {
|
||||
this.$message('漫画添加中');
|
||||
return false
|
||||
}
|
||||
this.isAddReqLoading = true
|
||||
comicChapterAdd(data).then((res) => {
|
||||
// this.Visible = false
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功')
|
||||
this.Visible = false
|
||||
this.isAddReqLoading = false
|
||||
} else {
|
||||
this.isAddReqLoading = false
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
}).catch((error) => {
|
||||
this.isAddReqLoading = false
|
||||
this.$message.error(error.message)
|
||||
})
|
||||
},
|
||||
//TODO：编辑漫画章节列表数据
|
||||
update(data) {
|
||||
comicChapterUpdate(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
changeImagesUrl(data) {
|
||||
this.form.chapter = data
|
||||
},
|
||||
setIsUploadIng(status) {
|
||||
this.isUploadIng = status
|
||||
},
|
||||
// 提交按钮
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.title === '新增') {
|
||||
this.add(this.form)
|
||||
} else if (this.title === '编辑') {
|
||||
this.update(this.form)
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.upLoadFormItem{
|
||||
label{
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,223 @@
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog title="漫画章节列表" :visible.sync="Visible" width="90%" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-row class="table-form">
|
||||
<el-form :inline="true" :model="searchData" class="form-inline" size="mini">
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入章节名称" clearable v-model.trim="searchData.title" @clear="onClear('title')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择是否启用" clearable v-model="searchData.status" @clear="onClear('status')">
|
||||
<el-option label="启用" :value="true" />
|
||||
<el-option label="未启用" :value="false" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="展示顺序" clearable v-model="searchData.sort" @clear="onClear('sort')">
|
||||
<el-option label="正序" :value="true" />
|
||||
<el-option label="倒序" :value="false" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="onSearch" icon="el-icon-search" plain type="primary">搜索</el-button>
|
||||
<el-button @click="add" icon="el-icon-circle-plus-outline" plain type="success">新增</el-button>
|
||||
<el-button @click="getList" icon="el-icon-refresh" plain type="info">刷新</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col>
|
||||
<el-table :data="resData" element-loading-text="拼命加载中" border height="550" highlight-current-row style="width: 100%" v-loading="loading">
|
||||
<el-table-column align="center" label="标题" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.title }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="漫画ID" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.comicsId }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="章节序列" width="80">
|
||||
<template slot-scope="scope">第{{ scope.row.chapterNum}}话</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="章节页数" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.pageNum }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否最新章节" width="90">
|
||||
<template slot-scope="scope">
|
||||
<el-button :type="scope.row.isNew? 'success' : 'danger'" plain size="mini">{{ scope.row.isNew ? "最新" : "非最新" }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否启用" width="90">
|
||||
<template slot-scope="scope">
|
||||
<el-button :type="scope.row.status? 'success' : 'danger'" plain size="mini">{{ scope.row.status ? "启用" : "未启用" }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="创建时间" width="180">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.createdAt | BeiJingTime
|
||||
}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="更新时间" width="180">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.updatedAt | BeiJingTime
|
||||
}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="180">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="handleEdit(scope.$index, scope.row)" size="mini" type="primary">编辑
|
||||
</el-button>
|
||||
<el-button @click="handleDelete(scope.$index, scope.row)" size="mini" type="danger">删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="table-pagination">
|
||||
<el-pagination :current-page="searchData.pageNum" :page-size="searchData.pageSize" :page-sizes="[10, 20, 30, 50, 100]" :total="total" @current-change="handleCurrentChange" @size-change="handleSizeChange" layout="total, sizes, prev, pager, next, jumper" />
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="Visible = false"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<ChapterAddOrEdit :data="editData" v-if="editVisible" @close="closeEdit" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
comicChapterList,
|
||||
comicChapterDel,
|
||||
} from '@/api/comicsManagement/comicChapter'
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
import ChapterAddOrEdit from './chapterAddOrEdit.vue'
|
||||
|
||||
export default {
|
||||
name: 'ChapterList',
|
||||
props: ['data'],
|
||||
components: {
|
||||
ShowImg,
|
||||
ChapterAddOrEdit,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
// 表单数据
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
title: undefined, //"string",
|
||||
status: undefined, // true
|
||||
id: undefined,
|
||||
sort: true,
|
||||
},
|
||||
resData: [],
|
||||
total: 0,
|
||||
loading: false, // 列表加载状态
|
||||
editVisible: false,
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {},
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.searchData.id = this.data.data.id
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
//TODO:请求漫画章节列表数据
|
||||
getList() {
|
||||
this.loading = true
|
||||
comicChapterList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.count
|
||||
} else {
|
||||
this.$message.error('请求列表失败!')
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
//TODO：删除漫画章节列表数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}).then(() => {
|
||||
comicChapterDel({ comicsChapterId: row.id }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.getList()
|
||||
this.$message.success('成功删除!')
|
||||
} else {
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
onSearch() {
|
||||
this.searchData.pageNum = 1
|
||||
this.searchData.pageSize = 10
|
||||
this.getList()
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
// 新增按钮
|
||||
add() {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {
|
||||
id: this.data.data.id,
|
||||
jmid: this.data.data.jmid,
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
// 编辑按钮
|
||||
handleEdit(index, row) {
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row,
|
||||
}
|
||||
this.editVisible = true
|
||||
},
|
||||
|
||||
// 关闭编辑弹窗
|
||||
closeEdit() {
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {},
|
||||
}
|
||||
this.editVisible = false
|
||||
this.getList()
|
||||
},
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getList()
|
||||
},
|
||||
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getList()
|
||||
},
|
||||
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getList()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,71 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-04-06 17:32:20
|
||||
* @LastEditTime: 2022-06-09 11:08:45
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @FilePath: /comics-admin/src/views/comicsManagement/comics/components/setTag.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="400px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="120px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-form-item label="漫画主题">
|
||||
<el-select placeholder="请选择漫画主题" clearable v-model.number="form.topicId" filterable>
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in data" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { comicsDelTags } from '@/api/comicsManagement/comics'
|
||||
export default {
|
||||
name: 'DelTag',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
MediaSatusList: [],
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
topicId: undefined,
|
||||
},
|
||||
rules: {}
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
console.log(this.data,'this.dat')
|
||||
},
|
||||
|
||||
methods: {
|
||||
// TODO:批量设置漫画主题
|
||||
submit() {
|
||||
|
||||
comicsDelTags(this.form).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('删除标签成功')
|
||||
} else {
|
||||
this.$message.error('删除标签失败')
|
||||
}
|
||||
this.Visible = false
|
||||
})
|
||||
},
|
||||
|
||||
// TODO:请求漫画主题列表数据
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -0,0 +1,103 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-04-06 17:32:20
|
||||
* @LastEditTime: 2022-06-09 11:08:45
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @FilePath: /comics-admin/src/views/comicsManagement/comics/components/setTag.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="120px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="漫画主题" prop="status">
|
||||
<el-select placeholder="请选择漫画主题" clearable v-model="form.topics" style="width: 180px" multiple filterable>
|
||||
<el-option v-for="item in MediaSatusList" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="" prop="flag">
|
||||
<el-switch v-model="form.flag" active-text="增加" inactive-text="删除" active-color="#13ce66" inactive-color="#ff4949"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { comicsAddTopics } from '@/api/comicsManagement/comics'
|
||||
import { comicsTopicList } from '@/api/comicsManagement/comicsTopic'
|
||||
export default {
|
||||
name: 'SetTag',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
MediaSatusList: [],
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
topics: undefined,
|
||||
flag: true
|
||||
},
|
||||
rules: {}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getComicsTopicList()
|
||||
},
|
||||
methods: {
|
||||
// TODO:批量设置漫画主题
|
||||
submit() {
|
||||
if (this.data.length) {
|
||||
const comicsIds = []
|
||||
this.data.forEach((item) => {
|
||||
comicsIds.push(item.id)
|
||||
})
|
||||
const param = {
|
||||
comicsIds: comicsIds,
|
||||
flag: this.form.flag,
|
||||
topicsIds: this.form.topics
|
||||
}
|
||||
comicsAddTopics(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('设置标签成功')
|
||||
} else {
|
||||
this.$message.error('设置标签失败')
|
||||
}
|
||||
this.Visible = false
|
||||
})
|
||||
} else {
|
||||
this.$message.error('未选择视频')
|
||||
}
|
||||
},
|
||||
|
||||
// TODO:请求漫画主题列表数据
|
||||
getComicsTopicList(val) {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 5000
|
||||
}
|
||||
comicsTopicList(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.MediaSatusList = res.data.list
|
||||
} else {
|
||||
this.$message.error('请求漫画主题列表失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,502 @@
|
||||
<template>
|
||||
<div class="pf-warpper">
|
||||
<el-row class="table-form">
|
||||
<!-- 查询条件 -->
|
||||
<el-form :inline="true" :model="searchData" class="form-inline" label-width="80px" size="mini">
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入漫画ID" clearable v-model.number="searchData.id" @clear="onClear('id')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入漫画标题" clearable v-model.trim="searchData.title" @clear="onClear('title')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入漫画作者" clearable v-model.trim="searchData.author" @clear="onClear('author')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入漫画唯一标识" clearable v-model.trim="searchData.jmid" @clear="onClear('jmid')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择漫画上架状态" clearable v-model.number="searchData.status" @clear="onClear('status')">
|
||||
<el-option label="待上架" :value="0" />
|
||||
<el-option label="上架" :value="1" />
|
||||
<el-option label="下架" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="是否参与会员日活动" clearable v-model.number="searchData.memberDayActivity"
|
||||
@clear="onClear('memberDayActivity')">
|
||||
<el-option label="是" :value="true" />
|
||||
<el-option label="否" :value="false" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择漫画更新状态" clearable v-model.number="searchData.updateStatus"
|
||||
@clear="onClear('updateStatus')">
|
||||
<el-option label="待发布" :value="0" />
|
||||
<el-option label="连载中" :value="1" />
|
||||
<el-option label="已完结" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择漫画主题" clearable v-model.number="searchData.topicId" @clear="onClear('topicId')"
|
||||
filterable>
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in topicIdList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入漫画标签" clearable v-model.trim="searchData.tagStr" @clear="onClear('tagStr')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择漫画付费类型" clearable v-model="searchData.comicsPayType"
|
||||
@clear="onClear('comicsPayType')">
|
||||
<el-option label="免费" :value="0" />
|
||||
<el-option label="会员" :value="1" />
|
||||
<el-option label="金币" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="排序方式" clearable v-model.number="searchData.sort" @clear="onClear('sort')">
|
||||
<el-option label="上架时间" :value="0" />
|
||||
<el-option label="更新时间" :value="1" />
|
||||
<el-option label="观看次数排序" :value="2" />
|
||||
<el-option label="收藏次数排序" :value="3" />
|
||||
<el-option label="章节数量排序" :value="4" />
|
||||
<el-option label="图片数量排序" :value="5" />
|
||||
<el-option label="虚假观看数排序" :value="6" />
|
||||
<el-option label="周观看次数" :value="7" />
|
||||
<el-option label="月观看次数" :value="8" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="onSearch" icon="el-icon-search" plain type="primary">搜索</el-button>
|
||||
<el-button @click="handleAdd()" icon="el-icon-circle-plus-outline" plain type="success">新增</el-button>
|
||||
<el-button @click="getData" icon="el-icon-refresh" plain type="info">刷新</el-button>
|
||||
<!-- <el-button @click="setTag" icon="el-icon-edit-outline" plain type="warning">批量设置主题</el-button>
|
||||
<el-button @click="setTags" icon="el-icon-edit-outline" plain type="warning">批量添加标签</el-button> -->
|
||||
<!-- <el-button @click="delTheme" icon="el-icon-edit-outline" plain type="warning">一键移除漫画主题</el-button> -->
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col>
|
||||
<!-- 展示列表 -->
|
||||
<el-table :data="tableData" border height="750" highlight-current-row style="width: 100%"
|
||||
@selection-change="handleSelectionChange" :row-style="{ height: '70px' }">
|
||||
<el-table-column type="selection" width="50" fixed="left"> </el-table-column>
|
||||
<el-table-column align="center" label="ID">
|
||||
<template slot-scope="scope">{{ scope.row.id }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="唯一标识">
|
||||
<template slot-scope="scope">{{ scope.row.jmid }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="漫画标题" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.title }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="漫画作者" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-tag v-for="(item, index) in scope.row.author" :key="index">{{ item }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="章节数量">
|
||||
<template slot-scope="scope">{{ scope.row.chapterCount }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="最新章节">
|
||||
<template slot-scope="scope">{{ scope.row.newChapter }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="页数">
|
||||
<template slot-scope="scope">{{ scope.row.pageCount }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="售价">
|
||||
<template slot-scope="scope">{{ scope.row.price | changeMoneyYuan }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="免费章节">
|
||||
<template slot-scope="scope">{{ scope.row.noneChapter }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="周观看次数">
|
||||
<template slot-scope="scope">{{ scope.row.weekWatchTimes }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="月观看次数">
|
||||
<template slot-scope="scope">{{ scope.row.monthWatchTimes }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="最后观看时间">
|
||||
<template slot-scope="scope">{{ scope.row.lastWatchTime | BeiJingTime }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="排序">
|
||||
<template slot-scope="scope">{{ scope.row.rank }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="封面">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width: 40px; height: 40px; margin: 0 auto;line-height: 40px" :urls="scope.row.coverImg">
|
||||
</ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="背景图">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width: 40px; height: 40px; margin: 0 auto;line-height: 40px"
|
||||
:urls="scope.row.backgroundImg"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="人物图">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width: 40px; height: 40px; margin: 0 auto;line-height: 40px"
|
||||
:urls="scope.row.characterImg"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center " label="字体颜色">
|
||||
<template slot-scope="scope">
|
||||
<div :style="{ backgroundColor: '#' + scope.row.backGroupImage }">
|
||||
{{ scope.row.backGroupImage }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="描述信息" width="300" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.desc }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否VIP" width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-button :type="scope.row.isVip ? 'success' : 'danger'" plain size="mini">{{ scope.row.isVip ? "VIP" :
|
||||
"非VIP" }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="上架状态">
|
||||
<template slot-scope="scope">{{ scope.row.status | changeStatus }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="上架时间" width="150">
|
||||
<template slot-scope="scope">{{ scope.row.addedTime | BeiJingTime2 }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="更新状态">
|
||||
<template slot-scope="scope">{{ scope.row.updateStatus | changeUpdateStatus }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="漫画主题" width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :key="index" v-for="(item, index) in scope.row.topics" type="success">{{
|
||||
item | changeName(topicIdList, 'id', 'name') }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="漫画标签" width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :key="index" v-for="(item, index) in scope.row.tagName" type="success">{{ item.name }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="配音角色" width="300">
|
||||
<template slot-scope="scope">
|
||||
<template>
|
||||
<el-table :data="scope.row.roleList" max-height="200" border style="width: 100%">
|
||||
<el-table-column align="center" prop="comicsCvId" label="CV-id" width="135">
|
||||
<template slot-scope="scopes">{{
|
||||
scopes.row.comicsCvId
|
||||
}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" prop="roleName" label="配音角色" width="135">
|
||||
<template slot-scope="scopes">{{
|
||||
scopes.row.roleName
|
||||
}}</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="创建时间" width="150">
|
||||
<template slot-scope="scope">{{ scope.row.createdAt | BeiJingTime }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="更新时间" width="150">
|
||||
<template slot-scope="scope">{{ scope.row.updatedAt | BeiJingTime }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="450">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onAddComment(scope.row)" size="mini" type="success">添加评论</el-button>
|
||||
<el-button @click="showChapterList(scope.$index, scope.row)" size="mini" type="primary">查看章节列表</el-button>
|
||||
<!-- <el-button @click="topComics(scope.$index, scope.row)" size="mini" type="success">最新置顶</el-button> -->
|
||||
<el-button @click="handleEdit(scope.$index, scope.row)" size="mini" type="primary">编辑</el-button>
|
||||
<el-button @click="handleDelete(scope.$index, scope.row)" size="mini" type="danger">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 分页 -->
|
||||
<div class="table-pagination">
|
||||
<el-pagination :current-page="searchData.pageNum" :page-size="searchData.pageSize"
|
||||
:page-sizes="[10, 20, 30, 50, 100]" :total="total" @current-change="handleCurrentChange"
|
||||
@size-change="handleSizeChange" layout="total, sizes, prev, pager, next, jumper" />
|
||||
</div>
|
||||
<!-- 新增/编辑弹出框 -->
|
||||
<Edit :data="editData" v-if="dialogFormVisible" @close="closeEdit" :circleList="circleList"></Edit>
|
||||
<ChapterList :data="editData" v-if="chapterListVisible" @close="closeEdit" />
|
||||
<SetTag :data="selectBatch" v-if="setTagVisible" @close="closeEdit"></SetTag>
|
||||
<DelTag :data="topicIdList" v-if="delThemeVisible" @close="closeEdit"></DelTag>
|
||||
<EditCom :data="editData" v-if="editComVisible" @close="closeEdit" />
|
||||
<AddTags :data="selectBatch" v-if="tagsVisible" @close="closeEdit" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
comicsList,
|
||||
comicsDel,
|
||||
} from '@/api/resourceManagement/comics.js'
|
||||
import { comicsTopicList } from '@/api/comicsManagement/comicsTopic'
|
||||
import { comicsTagList } from '@/api/comicsManagement/comicsTag'
|
||||
import { circleListSearch } from '@/api/user/circleList'
|
||||
import ChapterList from './components/chapterList'
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
import Edit from './components/AddOrEdit'
|
||||
import SetTag from './components/setTag'
|
||||
import DelTag from './components/delTag'
|
||||
import EditCom from './components/EditCom.vue'
|
||||
import AddTags from './components/addTags'
|
||||
export default {
|
||||
name: 'Comics',
|
||||
components: {
|
||||
Edit,
|
||||
ShowImg,
|
||||
ChapterList,
|
||||
SetTag,
|
||||
EditCom,
|
||||
AddTags,
|
||||
DelTag
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 请求列表筛选参数
|
||||
searchData: {
|
||||
id: undefined,
|
||||
status: undefined, // 激活状态
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
comicsPayType: undefined, // true 是否VIp
|
||||
sort: undefined, // integer 排序，0创建时间，1rank排序，2观看数量排序，3收藏数量排序
|
||||
tagId: undefined, // integer 标签
|
||||
title: undefined, // "string",标题
|
||||
topicId: undefined, // integer 主题
|
||||
author: undefined, // 漫画作者
|
||||
tagStr: undefined,
|
||||
memberDayActivity: undefined,
|
||||
},
|
||||
tableData: [],
|
||||
total: 0,
|
||||
dialogFormVisible: false,
|
||||
chapterListVisible: false,
|
||||
editComVisible: false, // 评论弹出框
|
||||
setTagVisible: false,
|
||||
tagsVisible: false, // 批量添加标签
|
||||
delThemeVisible: false,
|
||||
|
||||
editData: {},
|
||||
topicIdList: [],
|
||||
tagIdList: [],
|
||||
selectBatch: [],
|
||||
circleList: []
|
||||
}
|
||||
},
|
||||
filters: {
|
||||
changeStatus(val) {
|
||||
switch (val) {
|
||||
case 0:
|
||||
return '待上架'
|
||||
case 1:
|
||||
return '上架'
|
||||
case 2:
|
||||
return '取消上架'
|
||||
case 3:
|
||||
return '待审核'
|
||||
case 4:
|
||||
return '拒绝'
|
||||
}
|
||||
},
|
||||
changeUpdateStatus(val) {
|
||||
switch (val) {
|
||||
case 0:
|
||||
return '待发布'
|
||||
case 1:
|
||||
return '连载中'
|
||||
case 2:
|
||||
return '已完结'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
async mounted() {
|
||||
// this.getComicsTagList()
|
||||
this.getComicsTopicList()
|
||||
await this.getData()
|
||||
// this.getCircleListSearch()
|
||||
},
|
||||
methods: {
|
||||
// TODO：请求漫画主题列表数据
|
||||
getComicsTopicList() {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 500,
|
||||
status: true
|
||||
}
|
||||
comicsTopicList(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.topicIdList = res.data.list
|
||||
this.$store.dispatch('comics/setComicsTopicList', res.data.list)
|
||||
} else {
|
||||
this.topicIdList = []
|
||||
this.$store.dispatch('comics/setComicsTopicList', [])
|
||||
this.$message.error('请求漫画主题列表失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// TODO:请求漫画标签列表数据
|
||||
getComicsTagList() {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 10000
|
||||
}
|
||||
comicsTagList(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.tagIdList = res.data.list
|
||||
this.$store.dispatch('comics/setComicsTagList', res.data.list)
|
||||
} else {
|
||||
this.tagIdList = []
|
||||
this.$store.dispatch('comics/setComicsTagList', [])
|
||||
this.$message.error('请求漫画标签列表失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// TODO:请求漫画列表数据
|
||||
getData() {
|
||||
comicsList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.tableData = res.data.list
|
||||
this.total = res.data.count
|
||||
} else {
|
||||
this.tableData = []
|
||||
this.total = 0
|
||||
this.$message.error('请求漫画列表数据失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// TODO:漫画置顶
|
||||
// topComics(index, row) {
|
||||
// comicsNewOne({ id: row.id }).then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// this.$message.success('置顶成功')
|
||||
// } else {
|
||||
// this.$message.error('置顶失败')
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
|
||||
// TODO：删除漫画列表数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
comicsDel({ comicsId: row.id }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.getData({ pageNum: 1 }) // 刷新商品列表
|
||||
this.$message.success('删除成功')
|
||||
} else {
|
||||
this.$message.error('删除失败')
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
// TODO:请求圈子列表数据
|
||||
getCircleListSearch() {
|
||||
circleListSearch({ pageNum: 1, pageSize: 5000 }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.circleList = res.data.list
|
||||
} else {
|
||||
this.$message.error('请求圈子列表失败!')
|
||||
this.circleList = []
|
||||
}
|
||||
})
|
||||
},
|
||||
onSearch() {
|
||||
this.searchData.pageNum = 1
|
||||
this.getData()
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
this.selectBatch = val
|
||||
},
|
||||
setTag() {
|
||||
this.setTagVisible = true
|
||||
},
|
||||
setTags() {
|
||||
this.tagsVisible = true
|
||||
},
|
||||
delTheme() {
|
||||
this.delThemeVisible = true
|
||||
},
|
||||
showChapterList(index, row) {
|
||||
this.editData = {
|
||||
title: '视频列表',
|
||||
type: 3,
|
||||
data: row
|
||||
}
|
||||
this.chapterListVisible = true
|
||||
},
|
||||
|
||||
// 列表编辑按钮点击事件
|
||||
handleAdd() {
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {}
|
||||
}
|
||||
this.dialogFormVisible = true
|
||||
},
|
||||
|
||||
// 列表编辑按钮点击事件
|
||||
handleEdit(index, row) {
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row
|
||||
}
|
||||
this.dialogFormVisible = true
|
||||
},
|
||||
|
||||
closeEdit() {
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {}
|
||||
}
|
||||
this.editComVisible = false
|
||||
this.setTagVisible = false
|
||||
this.delThemeVisible = false
|
||||
this.dialogFormVisible = false
|
||||
this.chapterListVisible = false
|
||||
this.tagsVisible = false
|
||||
this.getData()
|
||||
},
|
||||
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getData()
|
||||
},
|
||||
|
||||
// 切换每页显示的条数触发
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getData()
|
||||
},
|
||||
|
||||
// 切换页码时触发
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getData()
|
||||
},
|
||||
|
||||
onAddComment(row) {
|
||||
this.editData = {
|
||||
title: '添加评论',
|
||||
data: row
|
||||
}
|
||||
this.editComVisible = true
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@/api/user/circleList
|
||||
@@ -0,0 +1,113 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="80px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="标签名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入标签名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="排序" prop="rank">
|
||||
<el-input v-model.number="form.rank" placeholder="请输入排序" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="观看数" prop="watchTimes">
|
||||
<el-input v-model.number="form.watchTimes" placeholder="请输入观看数" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="是否启用" prop="status">
|
||||
<el-switch v-model="form.status" active-color="#13ce66" inactive-color="#ff4949" active-text="开启" inactive-text="关闭"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="是否展示状态" prop="status">
|
||||
<el-switch v-model="form.isShowStatus" active-color="#13ce66" inactive-color="#ff4949" active-text="开启" inactive-text="关闭"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit('ruleForm')"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import { novelsTagAdd, novelsTagUpdate } from '@/api/resourceManagement/novel.js'
|
||||
import UploadImg from '@/components/UploadImg/index'
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data'],
|
||||
components: {
|
||||
UploadImg,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
cover: undefined, //"string",
|
||||
name: undefined, //"string",
|
||||
rank: undefined, //0,
|
||||
status: undefined, // true,
|
||||
watchTimes: undefined, // 0
|
||||
isShowStatus:undefined //是否展示状态
|
||||
},
|
||||
rules: {},
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
if (this.title === '编辑') {
|
||||
this.form = { ...this.data.data }
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
add(data) {
|
||||
novelsTagAdd(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('新增失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
update(data) {
|
||||
novelsTagUpdate(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 提交按钮
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.title === '新增') {
|
||||
this.add(this.form)
|
||||
} else if (this.title === '编辑') {
|
||||
this.update(this.form)
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,214 @@
|
||||
<template>
|
||||
<div class="pf-warpper avlist">
|
||||
<el-row class="table-form">
|
||||
<el-form :inline="true" :model="searchData" class="form-inline" size="mini">
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入标签ID" clearable v-model.number="searchData.id" @clear="onClear('id')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入标签名称" clearable v-model.trim="searchData.name" @clear="onClear('name')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择是否启用" clearable v-model="searchData.status" @clear="onClear('status')">
|
||||
<el-option label="启用" :value="true" />
|
||||
<el-option label="未启用" :value="false" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="排序方式" clearable v-model.number="searchData.sort" @clear="onClear('sort')">
|
||||
<el-option label="rank排序" :value="0" />
|
||||
<el-option label="观看次数排序" :value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="onSearch" icon="el-icon-search" plain type="primary">搜索</el-button>
|
||||
<el-button @click="add" icon="el-icon-circle-plus-outline" plain type="success">新增</el-button>
|
||||
<el-button @click="getList" icon="el-icon-refresh" plain type="info">刷新</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col>
|
||||
<el-table :data="resData" element-loading-text="拼命加载中" border height="750" highlight-current-row style="width: 100%" v-loading="loading">
|
||||
<el-table-column align="center" label="标签ID" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.id }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="标签名称" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.name }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="标签排序" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.rank }}</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column align="center" label="标签封面">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width: 104px; height: 70px; margin: 0 auto" :urls="scope.row.cover"></ShowImg>
|
||||
</template>
|
||||
</el-table-column> -->
|
||||
<el-table-column align="center" label="观看次数" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.watchTimes }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否展示" width="80">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.status ? '展示' : '不展示'
|
||||
}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否展示状态" width="80">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.isShowStatus ? '展示' : '不展示'
|
||||
}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="创建时间" width="180">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.createdAt | BeiJingTime
|
||||
}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="更新时间" width="180">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.updatedAt | BeiJingTime
|
||||
}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="180">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="handleEdit(scope.$index, scope.row)" size="mini" type="primary">编辑
|
||||
</el-button>
|
||||
<el-button @click="handleDelete(scope.$index, scope.row)" size="mini" type="danger">删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="table-pagination">
|
||||
<el-pagination :current-page="searchData.pageNum" :page-size="searchData.pageSize" :page-sizes="[10, 20, 30, 50, 100]" :total="total" @current-change="handleCurrentChange" @size-change="handleSizeChange" layout="total, sizes, prev, pager, next, jumper" />
|
||||
</div>
|
||||
<!-- 新增及编辑 -->
|
||||
<Edit :data="editData" v-if="editVisible" @close="closeEdit" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// 引入模块
|
||||
import Edit from './components/AddOrEdit'
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
import { novelsTagList, novelsTagDel } from '@/api/resourceManagement/novel.js'
|
||||
|
||||
export default {
|
||||
name: 'NovelsTag',
|
||||
components: {
|
||||
Edit,
|
||||
ShowImg,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 50,
|
||||
name: undefined, //"string",
|
||||
status: undefined, // true
|
||||
},
|
||||
resData: [], // el-table表格数据
|
||||
editVisible: false, // 新增或编辑弹出框
|
||||
total: 0, // 数据总条数
|
||||
loading: false, // 列表加载状态
|
||||
|
||||
// 编辑数据
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {},
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
//TODO:请求小说标签列表数据
|
||||
getList() {
|
||||
this.loading = true
|
||||
novelsTagList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.count
|
||||
} else {
|
||||
this.$message.error('请求列表失败!')
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
//TODO：删除小说标签列表数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}).then(() => {
|
||||
novelsTagDel({ id: row.id }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.getList()
|
||||
this.$message.success('成功删除!')
|
||||
} else {
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
onSearch() {
|
||||
this.searchData.pageNum = 1
|
||||
this.searchData.pageSize = 50
|
||||
this.getList()
|
||||
},
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getList()
|
||||
},
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getList()
|
||||
},
|
||||
|
||||
// 新增按钮
|
||||
add() {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {},
|
||||
}
|
||||
},
|
||||
// 编辑按钮
|
||||
handleEdit(index, row) {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row,
|
||||
}
|
||||
},
|
||||
|
||||
// 关闭编辑弹窗
|
||||
closeEdit() {
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {},
|
||||
}
|
||||
this.editVisible = false
|
||||
this.getList()
|
||||
},
|
||||
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getList()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,324 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" calss="ac-dialog" center width="800px" @close="close">
|
||||
<div>
|
||||
<el-form :rules="rules" :model="dialogForm" label-width="130px" ref="dialogForm">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="小说标题">
|
||||
<el-input placeholder="请输入标题" v-model="dialogForm.title" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="小说作者">
|
||||
<el-input placeholder="请输入作者" v-model="dialogForm.author" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="小说主题">
|
||||
<el-select placeholder="请选择小说主题" v-model="dialogForm.topics" filterable multiple>
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in topicsList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="小说标签">
|
||||
<el-select placeholder="请选择小说标题" v-model="dialogForm.tags" value-key="id" filterable multiple>
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in labelList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="排序" prop="rank">
|
||||
<el-input placeholder="请输入排序" v-model.number="dialogForm.rank" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="是否VIP" prop="isVip">
|
||||
<el-switch v-model.number="dialogForm.isVip" :active-value="true" :inactive-value="false" active-color="#13ce66" inactive-color="#ff4949"> </el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="小说类型">
|
||||
<el-select placeholder="请选择小说类型" v-model="dialogForm.novelType">
|
||||
<el-option label="文本" :value="1" />
|
||||
<el-option label="有声" :value="2" />
|
||||
<el-option label="asmr" :value="3" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="12">
|
||||
<el-form-item label="上架时间">
|
||||
<el-date-picker style="width: 180px" v-model="dialogForm.addedTime" type="date" placeholder="选择日期" value-format="yyyy-MM-ddTHH:mm:ssZ"> </el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="登场人物" prop="actors">
|
||||
<el-input placeholder="请输入登场人物" v-model.number="dialogForm.actors" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="免费章节" prop="noneChapter">
|
||||
<el-input placeholder="请输入免费章节" v-model.number="dialogForm.noneChapter" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="封面">
|
||||
<UploadImg @onRemove="onRemove('coverImg')" @changeImgUrl="changeCoverImg" :img="dialogForm.coverImg"> </UploadImg>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="章节数量">
|
||||
<el-input placeholder="请输入章节数量" v-model.number="dialogForm.chapterCount" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="小说总字数">
|
||||
<el-input placeholder="请输入小说总字数" v-model.number="dialogForm.wordTotalCount" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="最新章节">
|
||||
<el-input placeholder="请输入最新章节" v-model.number="dialogForm.newChapter" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="12">
|
||||
<el-form-item label="小说发布者ID">
|
||||
<el-input placeholder="请输入小说发布者ID" v-model.number="dialogForm.publishId" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="售价">
|
||||
<el-input placeholder="请输入售价" v-model.number="dialogForm.price" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="小说上架状态">
|
||||
<el-select placeholder="请选择小说上架状态" v-model="dialogForm.status">
|
||||
<el-option label="上架" :value="1" />
|
||||
<el-option label="下架" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="小说更新状态">
|
||||
<el-select placeholder="请选择小说更新状态" v-model="dialogForm.updateStatus">
|
||||
<el-option label="待发布" :value="0" />
|
||||
<el-option label="连载中" :value="1" />
|
||||
<el-option label="已完结" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
||||
<el-form-item label="描述" prop="desc">
|
||||
<el-input placeholder="请输入描述" v-model="dialogForm.desc" type="textarea" style="width: 520px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="dialog-footer" slot="footer">
|
||||
<el-button @click="Visible = false">取 消</el-button>
|
||||
<el-button @click="submitForm('dialogForm')" type="primary">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import { novelsAdd, novelsUpdate } from '@/api/resourceManagement/novel';
|
||||
import { novelsLabelsList } from '@/api/novelsManagement/novelsTopic';
|
||||
// import { novelsCvList } from '@/api/novelsManagement/novelsCV'
|
||||
import { changeMoneyYuan, changeMoneyFen, arryToString, stringToArry, current } from '@/filters/index';
|
||||
import UploadImg from '@/components/UploadImg/index';
|
||||
import moment from 'moment/moment';
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data', 'circleList'],
|
||||
components: {
|
||||
UploadImg,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
dialogForm: {
|
||||
author: undefined, // "string",小说作者
|
||||
chapterCount: undefined, // 0,章节数量
|
||||
coverImg: undefined, // "string",封面
|
||||
desc: undefined, // "string",描述信息
|
||||
isVip: undefined, // true,是否VIp
|
||||
newChapter: undefined, // 0,最新章节
|
||||
price: undefined, // 0,售价，单位分
|
||||
rank: undefined, // 0,排序
|
||||
status: undefined, // 0,小说状态
|
||||
tags: [], // 0 小说标签
|
||||
title: undefined, // string 标题
|
||||
topics: undefined, // 0 小说话题
|
||||
updateStatus: undefined, // 小说更新状态
|
||||
noneChapter: undefined, // 免费章节
|
||||
novelNumber: undefined, //评分
|
||||
actors: undefined, //登场人物
|
||||
addedTime: undefined, //上架时间
|
||||
lastWatchTime: undefined, //上次观看时间
|
||||
monthWatchTimes: undefined, //月观看次数，每月一号重置
|
||||
weekWatchTimes: undefined, //周观看次数，每周一重置
|
||||
newTime: undefined, //最新章节更新时间
|
||||
wordTotalCount: undefined, //小说总字数
|
||||
publishId: undefined, //漫画发布者ID
|
||||
novelType:undefined
|
||||
},
|
||||
topicsList: this.$store.state.novels.novelsTopicList,
|
||||
labelList: [],
|
||||
rules: {
|
||||
// sort: [{ required: true, message: '必填', trigger: 'blur' }],
|
||||
},
|
||||
resData: [],
|
||||
};
|
||||
},
|
||||
|
||||
async mounted() {
|
||||
this.title = this.data.title;
|
||||
|
||||
if (this.title === '编辑') {
|
||||
this.dialogForm = { ...this.data.data };
|
||||
// if (!this.dialogForm.roleList.length) {
|
||||
// this.dialogForm.roleList.push({
|
||||
// comicsId: undefined,
|
||||
// roleName: undefined
|
||||
// })
|
||||
// console.log(this.dialogForm,"dialogForm")
|
||||
// }
|
||||
this.dialogForm.price = changeMoneyYuan(this.dialogForm.price);
|
||||
this.dialogForm.author = arryToString(this.data.data.author);
|
||||
this.dialogForm.actors = arryToString(this.data.data.actors);
|
||||
}
|
||||
this.getNovelsLabelsList();
|
||||
// this.getList()
|
||||
},
|
||||
methods: {
|
||||
// TODO:请求小说标签列表数据
|
||||
// getList() {
|
||||
// this.loading = true
|
||||
// novelsCvList({ pageNum: 1, pageSize: 50 }).then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// this.resData = res.data.list
|
||||
// } else {
|
||||
// this.$message.error('请求列表失败!')
|
||||
// this.resData = []
|
||||
// this.total = 0
|
||||
// }
|
||||
// this.loading = false
|
||||
// })
|
||||
// },
|
||||
// addSectionItem() {
|
||||
// this.dialogForm.roleList.push({
|
||||
// comicsId: undefined,
|
||||
// roleName: undefined
|
||||
// })
|
||||
// },
|
||||
delSectionItem(index) {
|
||||
this.dialogForm.roleList.splice(index, 1);
|
||||
},
|
||||
// TODO：请求小说标签列表
|
||||
async getNovelsLabelsList() {
|
||||
console.log('tianjia1');
|
||||
this.labelList = this.title === '编辑' ? this.data.data.tagName : [];
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
// pageSize: 500,
|
||||
status: true,
|
||||
};
|
||||
novelsLabelsList(param).then(res => {
|
||||
if (res.code === 200) {
|
||||
// if (this.title === '编辑') {
|
||||
// for (let tagindex = 0; tagindex < this.data.data.tagName.length; tagindex++) {
|
||||
// const tag = this.data.data.tagName[tagindex]
|
||||
// let e = 0
|
||||
// for (let index = 0; index < this.labelList.length; index++) {
|
||||
// const element = this.labelList[index]
|
||||
// if (element.id === tag.id) {
|
||||
// e = 1
|
||||
// }
|
||||
// }
|
||||
// if (e === 0) {
|
||||
// this.labelList.push(tag)
|
||||
// }
|
||||
// }
|
||||
// res.data.forEach(item => {
|
||||
// });
|
||||
// this.labelList = res.data
|
||||
// } else {
|
||||
// this.labelList = res.data
|
||||
// }
|
||||
this.labelList = res.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
// TODO:新增小说列表数据
|
||||
novelsAddFun(data) {
|
||||
novelsAdd(data).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功');
|
||||
this.Visible = false;
|
||||
} else {
|
||||
this.$message.error('新增失败');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// TODO:编辑小说列表数据
|
||||
novelsUpdateFun(data) {
|
||||
novelsUpdate(data).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('编辑成功');
|
||||
this.Visible = false;
|
||||
} else {
|
||||
this.$message.error('编辑失败');
|
||||
}
|
||||
});
|
||||
},
|
||||
changeCoverImg(data) {
|
||||
this.dialogForm.coverImg = data;
|
||||
},
|
||||
onRemove(data) {
|
||||
this.dialogForm[data] = undefined;
|
||||
},
|
||||
|
||||
close() {
|
||||
this.$emit('close');
|
||||
},
|
||||
|
||||
// 提交按钮
|
||||
submitForm(formName) {
|
||||
this.$refs[formName].validate(valid => {
|
||||
if (valid) {
|
||||
const data = JSON.parse(JSON.stringify(this.dialogForm));
|
||||
data.price = data.price ? changeMoneyFen(data.price) : 0;
|
||||
data.author = stringToArry(data.author);
|
||||
data.actors = stringToArry(data.actors);
|
||||
data.circleId = data.circleId ? data.circleId : undefined;
|
||||
if (this.title === '编辑') {
|
||||
this.novelsUpdateFun(data);
|
||||
} else {
|
||||
this.novelsAddFun(data);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,72 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-05-17 14:17:25
|
||||
* @LastEditTime: 2022-06-09 11:04:13
|
||||
* @LastEditors:
|
||||
* @FilePath: /novels-admin/src/views/novelsManagement/novels/components/EditCom.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog :close-on-click-modal="false" :title="title" :visible.sync="Visible" @close="close" center class="ac-dialog" width="500px">
|
||||
<el-form :inline="true" :model="form" class="demo-form-inline" label-position="right" label-width="100px" ref="form">
|
||||
<el-row :gutter="24">
|
||||
<el-col :lg="24" :md="24" :sm="24" :xl="24" :xs="24">
|
||||
<el-form-item label="用户ID">
|
||||
<el-input v-model.number="form.userId" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="24" :md="24" :sm="24" :xl="24" :xs="24">
|
||||
<el-form-item label="评论内容">
|
||||
<el-input v-model="form.text" type="textarea" style="width:300px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div class="dialog-footer" slot="footer">
|
||||
<el-button @click="Visible=false">取 消</el-button>
|
||||
<el-button @click="submit('form')" type="primary">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { novelsAddComment } from '@/api/novelsManagement/novels'
|
||||
export default {
|
||||
name: 'EditCom',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
userId: undefined, // 用户id
|
||||
novelId: undefined, //小说ID
|
||||
text: undefined, //评论
|
||||
},
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
this.form.novelId = this.data.data.id
|
||||
},
|
||||
methods: {
|
||||
//TODO：添加评论
|
||||
submit(formName) {
|
||||
novelsAddComment(this.form).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('评论成功')
|
||||
this.close()
|
||||
} else {
|
||||
this.$message.error('评论失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close', false)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,95 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-04-06 17:32:20
|
||||
* @LastEditTime: 2022-06-09 11:08:45
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @FilePath: /novels-admin/src/views/novelsManagement/novels/components/setTag.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="120px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="小说标签">
|
||||
<el-select placeholder="请选择小说标题" v-model="form.tags" value-key="id" filterable multiple>
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in labelList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { novelsAddTags } from '@/api/novelsManagement/novels'
|
||||
import { novelsLabelsList } from '@/api/novelsManagement/novelsTopic'
|
||||
export default {
|
||||
name: 'SetTag',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
MediaSatusList: [],
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
tags: [] // 0 小说标签
|
||||
},
|
||||
//
|
||||
rules: {},
|
||||
labelList: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getComicLabelsList()
|
||||
},
|
||||
methods: {
|
||||
// TODO：请求小说标签列表
|
||||
async getComicLabelsList() {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
status: true
|
||||
}
|
||||
novelsLabelsList(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.labelList = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:批量增加小说标签
|
||||
submit() {
|
||||
if (this.data.length) {
|
||||
const novelIds = []
|
||||
this.data.forEach((item) => {
|
||||
novelIds.push(item.id)
|
||||
})
|
||||
const param = {
|
||||
novelIds: novelIds,
|
||||
tags: this.form.tags
|
||||
}
|
||||
novelsAddTags(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('增加标签成功')
|
||||
} else {
|
||||
this.$message.error('增加标签失败')
|
||||
}
|
||||
this.Visible = false
|
||||
})
|
||||
} else {
|
||||
this.$message.error('未选择小说')
|
||||
}
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,110 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-04-06 17:32:20
|
||||
* @LastEditTime: 2022-06-09 11:08:45
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @FilePath: /novels-admin/src/views/novelsManagement/novels/components/setTag.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false"
|
||||
@close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="120px"
|
||||
label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="上传小说">
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
ref="upload"
|
||||
action="#"
|
||||
:limit="1"
|
||||
accept=".txt"
|
||||
:file-list="form.fileList"
|
||||
:on-change="uploadChange"
|
||||
:on-remove="uploadRemove"
|
||||
:auto-upload="false">
|
||||
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传txt文件</div>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消</el-button>
|
||||
<el-button type="primary" @click="submit"> 确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { novelsAddTxtNovel} from '@/api/novelsManagement/novels'
|
||||
import * as jschadet from 'jschardet'
|
||||
export default {
|
||||
name: 'Addtotal',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
MediaSatusList: [],
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
fileList: [],
|
||||
},
|
||||
rules: {},
|
||||
labelList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
uploadChange( file, fileList) {
|
||||
this.form.fileList = fileList
|
||||
},
|
||||
uploadRemove(){
|
||||
this.form.fileList = []
|
||||
},
|
||||
|
||||
submit() {
|
||||
if (!this.form.fileList.length){
|
||||
this.$message.warning('请上传小说！')
|
||||
return
|
||||
}
|
||||
const file = this.form.fileList[0].raw;
|
||||
const reader = new FileReader();
|
||||
reader.readAsBinaryString(file);
|
||||
|
||||
reader.addEventListener('load', (event) => {
|
||||
let content = ''
|
||||
const txtBinary = event.target.result;
|
||||
const encoding = jschadet.detect(txtBinary)
|
||||
if (encoding && encoding.encoding) {
|
||||
const buf = new Buffer(txtBinary, 'binary')
|
||||
const decoder = new TextDecoder(encoding.encoding);
|
||||
content = decoder.decode(buf);
|
||||
const param = {
|
||||
novelId: this.data.data.id,
|
||||
txt: content
|
||||
}
|
||||
novelsAddTxtNovel(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('增加成功')
|
||||
} else {
|
||||
this.$message.error('增加失败')
|
||||
}
|
||||
this.Visible = false
|
||||
})
|
||||
} else {
|
||||
console.error('Failed to detect file encoding.');
|
||||
}
|
||||
});
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,100 @@
|
||||
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="120px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="是否VIP" prop="status">
|
||||
<el-select placeholder="请选择信息分类" clearable v-model="form.isVip" style="width: 180px">
|
||||
<el-option label="非VIP小说" :value="false" />
|
||||
<el-option label="VIP小说" :value="true" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="视频状态" prop="status">
|
||||
<el-select placeholder="请选择小说状态" clearable v-model="form.status" style="width: 180px">
|
||||
<el-option v-for="item in MediaSatusList" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { novelsUpdate } from '@/api/novelsManagement/novels'
|
||||
import { MediaSatusList } from '@/filters/novelsManagement/novelsTopic'
|
||||
|
||||
export default {
|
||||
name: 'batch',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
MediaSatusList: MediaSatusList(),
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
isVip: undefined,
|
||||
status: undefined,
|
||||
|
||||
},
|
||||
//
|
||||
dates: [],
|
||||
rules: {
|
||||
isVip: undefined,
|
||||
status: undefined
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 提交按钮
|
||||
submit() {
|
||||
if (this.data.length) {
|
||||
this.data.forEach((item) => {
|
||||
const data = {
|
||||
...item
|
||||
}
|
||||
data.isVip = this.form.isVip
|
||||
data.status = this.form.status
|
||||
|
||||
novelsUpdate(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: item.id + '修改成功'
|
||||
})
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: item.id + '修改失败'
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '未选择小说'
|
||||
})
|
||||
}
|
||||
this.Visible = false
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
},
|
||||
mounted() {},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,173 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="80px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="小说ID" prop="comicsId">
|
||||
<el-input v-model.number="form.comicsId" placeholder="请输入小说ID" disabled style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="章节序列" prop="chapterNum">
|
||||
<el-input v-model.number="form.chapterNum" placeholder="请输入章节序列" style="width: 180px">
|
||||
<template slot="prepend">第</template>
|
||||
<template slot="append">章</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="章节标题" prop="title">
|
||||
<el-input v-model="form.title" placeholder="请输入章节标题" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="章节字数" prop="wordCount">
|
||||
<el-input v-model.number="form.wordCount" placeholder="请输入章节字数" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="是否启用" prop="status">
|
||||
<el-switch v-model="form.status" active-color="#13ce66" inactive-color="#ff4949" active-text="开启" inactive-text="关闭"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="最新章节" prop="isNew">
|
||||
<el-switch v-model="form.isNew" active-color="#13ce66" inactive-color="#ff4949" active-text="最新" inactive-text="非最新"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="媒资库ID" prop="fileId">
|
||||
<el-input v-model="form.fileId" placeholder="请输入小说媒资库ID" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
||||
<el-form-item label="章节描述" prop="desc">
|
||||
<el-input placeholder="请输入章节描述" v-model="form.desc" type="textarea" style="width: 520px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
||||
<el-form-item label="内容" prop="content">
|
||||
<el-input v-model="form.content" :autosize="{ minRows: 2, maxRows: 4 }" placeholder="请输入内容" type="textarea" style="width: 520px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit('ruleForm')"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import { novelsChapterAdd, novelsChapterUpdate } from '@/api/resourceManagement/novel.js';
|
||||
export default {
|
||||
name: 'ChapterAddOrEdit',
|
||||
props: ['data'],
|
||||
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
content: undefined, //[]内容
|
||||
chapterNum: undefined, // 0,第几章节
|
||||
comicsId: undefined, // 0,小说ID
|
||||
desc: undefined, // "string",章节描述
|
||||
isNew: undefined, // true,是否为最新章节
|
||||
pageNum: undefined, // 0,章节页数
|
||||
status: undefined, // true,是否启用
|
||||
title: undefined, // "string",章节标题
|
||||
fileId: undefined, // '媒资库id'
|
||||
wordCount: undefined, //小说字数
|
||||
},
|
||||
rules: {},
|
||||
isUploadIng: false,
|
||||
isAddReqLoading: false,
|
||||
};
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title;
|
||||
if (this.title === '编辑') {
|
||||
this.form = { ...this.data.data };
|
||||
// this.form.jmid
|
||||
} else {
|
||||
this.form.jmid = this.data.data.jmid;
|
||||
this.form.comicsId = this.data.data.id;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//TODO：新增小说章节列表数据
|
||||
add(data) {
|
||||
if (this.isUploadIng) {
|
||||
this.$message('图片上传中,稍后尝试');
|
||||
|
||||
return false;
|
||||
}
|
||||
if (this.isAddReqLoading) {
|
||||
this.$message('小说添加中');
|
||||
return false;
|
||||
}
|
||||
this.isAddReqLoading = true;
|
||||
novelsChapterAdd(data)
|
||||
.then(res => {
|
||||
// this.Visible = false
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功');
|
||||
this.Visible = false;
|
||||
this.isAddReqLoading = false;
|
||||
} else {
|
||||
this.isAddReqLoading = false;
|
||||
this.$message.error(res.tip);
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
this.isAddReqLoading = false;
|
||||
this.$message.error(error.message);
|
||||
});
|
||||
},
|
||||
//TODO：编辑小说章节列表数据
|
||||
update(data) {
|
||||
novelsChapterUpdate(data).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功');
|
||||
this.Visible = false;
|
||||
} else {
|
||||
this.$message.error('更新失败');
|
||||
}
|
||||
});
|
||||
},
|
||||
// 提交按钮
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.title === '新增') {
|
||||
this.add(this.form);
|
||||
} else if (this.title === '编辑') {
|
||||
this.update(this.form);
|
||||
}
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close');
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.upLoadFormItem {
|
||||
label {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,223 @@
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog title="小说章节列表" :visible.sync="Visible" width="90%" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-row class="table-form">
|
||||
<el-form :inline="true" :model="searchData" class="form-inline" size="mini">
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入章节名称" clearable v-model.trim="searchData.title" @clear="onClear('title')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择是否启用" clearable v-model="searchData.status" @clear="onClear('status')">
|
||||
<el-option label="启用" :value="true" />
|
||||
<el-option label="未启用" :value="false" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="展示顺序" clearable v-model="searchData.sort" @clear="onClear('sort')">
|
||||
<el-option label="正序" :value="true" />
|
||||
<el-option label="倒序" :value="false" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="onSearch" icon="el-icon-search" plain type="primary">搜索</el-button>
|
||||
<el-button @click="add" icon="el-icon-circle-plus-outline" plain type="success">新增</el-button>
|
||||
<el-button @click="getList" icon="el-icon-refresh" plain type="info">刷新</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col>
|
||||
<el-table :data="resData" element-loading-text="拼命加载中" border height="550" highlight-current-row style="width: 100%" v-loading="loading">
|
||||
<el-table-column align="center" label="标题" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.title }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="小说ID" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.comicsId }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="媒资库ID" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.fileId }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="章节序列" width="80">
|
||||
<template slot-scope="scope">第{{ scope.row.chapterNum }}章</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="章节字数" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.wordCount }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否最新章节" width="90">
|
||||
<template slot-scope="scope">
|
||||
<el-button :type="scope.row.isNew ? 'success' : 'danger'" plain size="mini">{{ scope.row.isNew ? '最新' : '非最新' }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否启用" width="90">
|
||||
<template slot-scope="scope">
|
||||
<el-button :type="scope.row.status ? 'success' : 'danger'" plain size="mini">{{ scope.row.status ? '启用' : '未启用' }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="创建时间" width="180">
|
||||
<template slot-scope="scope">{{ scope.row.createdAt | BeiJingTime }} </template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="更新时间" width="180">
|
||||
<template slot-scope="scope">{{ scope.row.updatedAt | BeiJingTime }} </template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="180">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="handleEdit(scope.$index, scope.row)" size="mini" type="primary">编辑 </el-button>
|
||||
<el-button @click="handleDelete(scope.$index, scope.row)" size="mini" type="danger">删除 </el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="table-pagination">
|
||||
<el-pagination
|
||||
:current-page="searchData.pageNum"
|
||||
:page-size="searchData.pageSize"
|
||||
:page-sizes="[10, 20, 30, 50, 100]"
|
||||
:total="total"
|
||||
@current-change="handleCurrentChange"
|
||||
@size-change="handleSizeChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="Visible = false"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<ChapterAddOrEdit :data="editData" v-if="editVisible" @close="closeEdit" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { novelsChapterList, novelsChapterDel } from '@/api/resourceManagement/novel.js';
|
||||
import ShowImg from '@/components/ShowImg/index.vue';
|
||||
import ChapterAddOrEdit from './chapterAddOrEdit.vue';
|
||||
|
||||
export default {
|
||||
name: 'ChapterList',
|
||||
props: ['data'],
|
||||
components: {
|
||||
ShowImg,
|
||||
ChapterAddOrEdit,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
// 表单数据
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
title: undefined, //"string",
|
||||
status: undefined, // true
|
||||
id: undefined,
|
||||
sort: true,
|
||||
},
|
||||
resData: [],
|
||||
total: 0,
|
||||
loading: false, // 列表加载状态
|
||||
editVisible: false,
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {},
|
||||
},
|
||||
};
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.searchData.id = this.data.data.id;
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
//TODO:请求小说章节列表数据
|
||||
getList() {
|
||||
this.loading = true;
|
||||
novelsChapterList(this.searchData).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list;
|
||||
this.total = res.data.count;
|
||||
} else {
|
||||
this.$message.error('请求列表失败!');
|
||||
this.resData = [];
|
||||
this.total = 0;
|
||||
}
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
//TODO：删除小说章节列表数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}).then(() => {
|
||||
novelsChapterDel({ novelChapterId: row.id }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.getList();
|
||||
this.$message.success('成功删除!');
|
||||
} else {
|
||||
this.$message.error(res.tip);
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
onSearch() {
|
||||
this.searchData.pageNum = 1;
|
||||
this.searchData.pageSize = 10;
|
||||
this.getList();
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close');
|
||||
},
|
||||
// 新增按钮
|
||||
add() {
|
||||
this.editVisible = true;
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {
|
||||
id: this.data.data.id,
|
||||
jmid: this.data.data.jmid,
|
||||
},
|
||||
};
|
||||
},
|
||||
|
||||
// 编辑按钮
|
||||
handleEdit(index, row) {
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row,
|
||||
};
|
||||
this.editVisible = true;
|
||||
},
|
||||
|
||||
// 关闭编辑弹窗
|
||||
closeEdit() {
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {},
|
||||
};
|
||||
this.editVisible = false;
|
||||
this.getList();
|
||||
},
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val;
|
||||
this.getList();
|
||||
},
|
||||
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val;
|
||||
this.getList();
|
||||
},
|
||||
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined;
|
||||
this.getList();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,103 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-04-06 17:32:20
|
||||
* @LastEditTime: 2022-06-09 11:08:45
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @FilePath: /novels-admin/src/views/novelsManagement/novels/components/setTag.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="120px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="小说主题" prop="status">
|
||||
<el-select placeholder="请选择小说主题" clearable v-model="form.topics" style="width: 180px" multiple filterable>
|
||||
<el-option v-for="item in MediaSatusList" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="" prop="flag">
|
||||
<el-switch v-model="form.flag" active-text="增加" inactive-text="删除" active-color="#13ce66" inactive-color="#ff4949"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { novelsAddTopics } from '@/api/novelsManagement/novels'
|
||||
import { novelsTopicList } from '@/api/novelsManagement/novelsTopic'
|
||||
export default {
|
||||
name: 'SetTag',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
MediaSatusList: [],
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
topics: undefined,
|
||||
flag: true
|
||||
},
|
||||
rules: {}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getNovelsTopicList()
|
||||
},
|
||||
methods: {
|
||||
// TODO:批量设置小说主题
|
||||
submit() {
|
||||
if (this.data.length) {
|
||||
const novelIds = []
|
||||
this.data.forEach((item) => {
|
||||
novelIds.push(item.id)
|
||||
})
|
||||
const param = {
|
||||
novelIds: novelIds,
|
||||
flag: this.form.flag,
|
||||
topicsIds: this.form.topics
|
||||
}
|
||||
novelsAddTopics(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('设置标签成功')
|
||||
} else {
|
||||
this.$message.error('设置标签失败')
|
||||
}
|
||||
this.Visible = false
|
||||
})
|
||||
} else {
|
||||
this.$message.error('未选择小说')
|
||||
}
|
||||
},
|
||||
|
||||
// TODO:请求小说主题列表数据
|
||||
getNovelsTopicList(val) {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 5000
|
||||
}
|
||||
novelsTopicList(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.MediaSatusList = res.data.list
|
||||
} else {
|
||||
this.$message.error('请求小说主题列表失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,514 @@
|
||||
<template>
|
||||
<div class="pf-warpper">
|
||||
<el-row class="table-form">
|
||||
<!-- 查询条件 -->
|
||||
<el-form :inline="true" :model="searchData" class="form-inline" label-width="80px" size="mini">
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入小说ID" clearable v-model.number="searchData.id" @clear="onClear('id')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入小说标题" clearable v-model.trim="searchData.title" @clear="onClear('title')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入小说作者" clearable v-model.trim="searchData.author" @clear="onClear('author')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入小说唯一标识" clearable v-model.trim="searchData.jmid" @clear="onClear('jmid')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择小说上架状态" clearable v-model.number="searchData.status" @clear="onClear('status')">
|
||||
<el-option label="待上架" :value="0" />
|
||||
<el-option label="上架" :value="1" />
|
||||
<el-option label="下架" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择小说更新状态" clearable v-model.number="searchData.updateStatus" @clear="onClear('updateStatus')">
|
||||
<el-option label="待发布" :value="0" />
|
||||
<el-option label="连载中" :value="1" />
|
||||
<el-option label="已完结" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择小说主题" clearable v-model.number="searchData.topicId" @clear="onClear('topicId')" filterable>
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in topicIdList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入小说标签" clearable v-model.trim="searchData.tagStr" @clear="onClear('tagStr')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择小说付费类型" clearable v-model="searchData.novelPayType" @clear="onClear('novelPayType')">
|
||||
<el-option label="免费" :value="0" />
|
||||
<el-option label="会员" :value="1" />
|
||||
<el-option label="金币" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="排序方式" clearable v-model.number="searchData.sort" @clear="onClear('sort')">
|
||||
<el-option label="上架时间" :value="0" />
|
||||
<el-option label="真实观看数" :value="1" />
|
||||
<el-option label="章节数" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择小说类型" clearable v-model="searchData.novelType" @clear="onClear('novelType')">
|
||||
<el-option label="文本" :value="1" />
|
||||
<el-option label="小说" :value="2" />
|
||||
<el-option label="asmr" :value="3" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="onSearch" icon="el-icon-search" plain type="primary">搜索</el-button>
|
||||
<el-button @click="handleAdd()" icon="el-icon-circle-plus-outline" plain type="success">新增</el-button>
|
||||
<el-button @click="getData" icon="el-icon-refresh" plain type="info">刷新</el-button>
|
||||
<!-- <el-button @click="setTag" icon="el-icon-edit-outline" plain type="warning">批量设置主题</el-button>
|
||||
<el-button @click="setTags" icon="el-icon-edit-outline" plain type="warning">批量添加标签</el-button>
|
||||
<el-button @click="batch" icon="el-icon-edit-outline" plain type="warning">批量设置小说</el-button> -->
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col>
|
||||
<!-- 展示列表 -->
|
||||
<el-table :data="tableData" border height="750" highlight-current-row style="width: 100%" @selection-change="handleSelectionChange" :row-style="{ height: '70px' }">
|
||||
<el-table-column type="selection" width="50" fixed="left"> </el-table-column>
|
||||
<el-table-column align="center" label="ID">
|
||||
<template slot-scope="scope">{{ scope.row.id }}</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column align="center" label="唯一标识">-->
|
||||
<!-- <template slot-scope="scope">{{ scope.row.jmid }}</template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column align="center" label="排序">
|
||||
<template slot-scope="scope">{{ scope.row.rank }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="小说标题" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.title }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="封面">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width: 40px; height: 40px; margin: 0 auto; line-height: 40px" :urls="scope.row.coverImg"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="小说作者" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-tag v-for="(item, index) in scope.row.author" :key="index">{{ item }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="章节数量">
|
||||
<template slot-scope="scope">{{ scope.row.chapterCount }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="最新章节">
|
||||
<template slot-scope="scope">{{ scope.row.newChapter }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="最新章节更新时间">
|
||||
<template slot-scope="scope">{{ scope.row.newTime | BeiJingTime }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="小说总字数">
|
||||
<template slot-scope="scope">{{ scope.row.wordTotalCount }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="页数">
|
||||
<template slot-scope="scope">{{ scope.row.pageCount }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="售价">
|
||||
<template slot-scope="scope">{{ scope.row.price | changeMoneyYuan }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="免费章节">
|
||||
<template slot-scope="scope">{{ scope.row.noneChapter }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="周观看次数">
|
||||
<template slot-scope="scope">{{ scope.row.weekWatchTimes }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="月观看次数">
|
||||
<template slot-scope="scope">{{ scope.row.monthWatchTimes }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="最后观看时间">
|
||||
<template slot-scope="scope">{{ scope.row.lastWatchTime | BeiJingTime }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="小说发布者ID">
|
||||
<template slot-scope="scope">{{ scope.row.publishId }}</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column align="center" label="圈子">
|
||||
<template slot-scope="scope">{{ scope.row.circleId | changeName(circleList, 'id', 'name') }}</template>
|
||||
</el-table-column> -->
|
||||
<el-table-column align="center" label="描述信息" width="300" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.desc }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否VIP" width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-button :type="scope.row.isVip ? 'success' : 'danger'" plain size="mini">{{ scope.row.isVip ? 'VIP' : '非VIP' }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="上架状态">
|
||||
<template slot-scope="scope">{{ scope.row.status | changeStatus }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="上架时间" width="150">
|
||||
<template slot-scope="scope">{{ scope.row.addedTime | BeiJingTime }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="更新状态">
|
||||
<template slot-scope="scope">{{ scope.row.updateStatus | changeUpdateStatus }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="小说主题" width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :key="index" v-for="(item, index) in scope.row.topics" type="success">{{ item | changeName(topicIdList, 'id', 'name') }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="小说标签" width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :key="index" v-for="(item, index) in scope.row.tagName" type="success">{{ item.name }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="小说类型" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.novelType | novelChangeType }} </template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column align="center" label="配音角色" width="300">-->
|
||||
<!-- <template slot-scope="scope">-->
|
||||
<!-- <template>-->
|
||||
<!-- <el-table :data="scope.row.roleList" max-height="200" border style="width: 100%">-->
|
||||
<!-- <el-table-column align="center" prop="comicsCvId" label="CV-id" width="135">-->
|
||||
<!-- <template slot-scope="scopes">{{-->
|
||||
<!-- scopes.row.comicsCvId-->
|
||||
<!-- }}</template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<!-- <el-table-column align="center" prop="roleName" label="配音角色" width="135">-->
|
||||
<!-- <template slot-scope="scopes">{{-->
|
||||
<!-- scopes.row.roleName-->
|
||||
<!-- }}</template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<!-- </el-table>-->
|
||||
<!-- </template>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column align="center" label="评分">
|
||||
<template slot-scope="scope">{{ scope.row.novelNumber }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="创建时间" width="150">
|
||||
<template slot-scope="scope">{{ scope.row.createdAt | BeiJingTime }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="更新时间" width="150">
|
||||
<template slot-scope="scope">{{ scope.row.updatedAt | BeiJingTime }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="550">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="onAddComment(scope.row)" size="mini" type="success">添加评论</el-button>
|
||||
<el-button @click="addTotal(scope.$index, scope.row)" size="mini" type="primary">整本添加</el-button>
|
||||
<el-button @click="showChapterList(scope.$index, scope.row)" size="mini" type="primary">查看章节列表</el-button>
|
||||
<!-- <el-button @click="topNovels(scope.$index, scope.row)" size="mini" type="success">最新置顶</el-button> -->
|
||||
<el-button @click="handleEdit(scope.$index, scope.row)" size="mini" type="primary">编辑</el-button>
|
||||
<el-button @click="handleDelete(scope.$index, scope.row)" size="mini" type="danger">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 分页 -->
|
||||
<div class="table-pagination">
|
||||
<el-pagination
|
||||
:current-page="searchData.pageNum"
|
||||
:page-size="searchData.pageSize"
|
||||
:page-sizes="[10, 20, 30, 50, 100]"
|
||||
:total="total"
|
||||
@current-change="handleCurrentChange"
|
||||
@size-change="handleSizeChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
/>
|
||||
</div>
|
||||
<!-- 新增/编辑弹出框 -->
|
||||
<Edit :data="editData" v-if="dialogFormVisible" @close="closeEdit" :circleList="circleList"></Edit>
|
||||
<ChapterList :data="editData" v-if="chapterListVisible" @close="closeEdit" />
|
||||
<!-- <SetTag :data="selectBatch" v-if="setTagVisible" @close="closeEdit"></SetTag> -->
|
||||
<EditCom :data="editData" v-if="editComVisible" @close="closeEdit" />
|
||||
<!-- <AddTags :data="selectBatch" v-if="tagsVisible" @close="closeEdit" /> -->
|
||||
<AddTotal :data="editData" v-if="addTotalVisible" @close="closeEdit" />
|
||||
<!-- <Batch :data="selectBatch" v-if="batchVisible" @close="closeEdit"></Batch> -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { novelsList, novelsDel } from '@/api/resourceManagement/novel.js';
|
||||
import { novelsTopicList } from '@/api/novelsManagement/novelsTopic';
|
||||
import { novelsTagList } from '@/api/novelsManagement/novelsTag';
|
||||
import { circleListSearch } from '@/api/user/circleList';
|
||||
import ChapterList from './components/chapterList';
|
||||
import ShowImg from '@/components/ShowImg/index.vue';
|
||||
import Edit from './components/AddOrEdit';
|
||||
import SetTag from './components/setTag';
|
||||
import EditCom from './components/EditCom.vue';
|
||||
import AddTags from './components/addTags';
|
||||
import Batch from './components/batch';
|
||||
import AddTotal from './components/addTotal';
|
||||
|
||||
export default {
|
||||
name: 'Novels',
|
||||
components: {
|
||||
Edit,
|
||||
ShowImg,
|
||||
ChapterList,
|
||||
SetTag,
|
||||
EditCom,
|
||||
AddTags,
|
||||
AddTotal,
|
||||
Batch,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 请求列表筛选参数
|
||||
searchData: {
|
||||
id: undefined,
|
||||
status: undefined, // 激活状态
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
novelPayType: undefined, // true 是否VIp
|
||||
sort: undefined, // integer 排序，0创建时间，1rank排序，2观看数量排序，3收藏数量排序
|
||||
tagId: undefined, // integer 标签
|
||||
title: undefined, // "string",标题
|
||||
topicId: undefined, // integer 主题
|
||||
author: undefined, // 小说作者
|
||||
tagStr: undefined,
|
||||
isAudio:undefined
|
||||
},
|
||||
tableData: [],
|
||||
total: 0,
|
||||
dialogFormVisible: false,
|
||||
chapterListVisible: false,
|
||||
editComVisible: false, // 评论弹出框
|
||||
// setTagVisible: false,
|
||||
// tagsVisible: false, // 批量添加标签
|
||||
addTotalVisible: false, // 整本添加
|
||||
// batchVisible: false, // 批量设置小说
|
||||
editData: {},
|
||||
topicIdList: [],
|
||||
tagIdList: [],
|
||||
selectBatch: [],
|
||||
circleList: [],
|
||||
};
|
||||
},
|
||||
filters: {
|
||||
changeStatus(val) {
|
||||
switch (val) {
|
||||
case 0:
|
||||
return '待上架';
|
||||
case 1:
|
||||
return '上架';
|
||||
case 2:
|
||||
return '取消上架';
|
||||
case 3:
|
||||
return '待审核';
|
||||
case 4:
|
||||
return '拒绝';
|
||||
}
|
||||
},
|
||||
changeUpdateStatus(val) {
|
||||
switch (val) {
|
||||
case 0:
|
||||
return '待发布';
|
||||
case 1:
|
||||
return '连载中';
|
||||
case 2:
|
||||
return '已完结';
|
||||
}
|
||||
},
|
||||
novelChangeType(val){
|
||||
switch (val) {
|
||||
case 1:
|
||||
return '文本';
|
||||
case 2:
|
||||
return '有声';
|
||||
case 3:
|
||||
return 'asmr';
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
async mounted() {
|
||||
// this.getNovelsTagList()
|
||||
this.getNovelsTopicList();
|
||||
await this.getData();
|
||||
// this.getCircleListSearch();
|
||||
},
|
||||
methods: {
|
||||
// TODO：请求小说主题列表数据
|
||||
getNovelsTopicList() {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 500,
|
||||
status: true,
|
||||
};
|
||||
novelsTopicList(param).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.topicIdList = res.data.list;
|
||||
|
||||
this.$store.dispatch('novels/setNovelsTopicList', res.data.list);
|
||||
} else {
|
||||
this.topicIdList = [];
|
||||
this.$store.dispatch('novels/setNovelsTopicList', []);
|
||||
this.$message.error('请求小说主题列表失败');
|
||||
}
|
||||
});
|
||||
},
|
||||
// 批量设置
|
||||
// batch() {
|
||||
// this.batchVisible = true;
|
||||
// },
|
||||
// TODO:请求小说标签列表数据
|
||||
getNovelsTagList() {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 10000,
|
||||
};
|
||||
novelsTagList(param).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.tagIdList = res.data.list;
|
||||
this.$store.dispatch('novels/setNovelsTagList', res.data.list);
|
||||
} else {
|
||||
this.tagIdList = [];
|
||||
this.$store.dispatch('novels/setNovelsTagList', []);
|
||||
this.$message.error('请求小说标签列表失败!');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// TODO:请求小说列表数据
|
||||
getData() {
|
||||
novelsList(this.searchData).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.tableData = res.data.list;
|
||||
this.total = res.data.count;
|
||||
} else {
|
||||
this.tableData = [];
|
||||
this.total = 0;
|
||||
this.$message.error('请求小说列表数据失败');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// TODO:小说置顶
|
||||
// topNovels(index, row) {
|
||||
// novelsNewOne({ id: row.id }).then(res => {
|
||||
// if (res.code === 200) {
|
||||
// this.$message.success('置顶成功');
|
||||
// } else {
|
||||
// this.$message.error('置顶失败');
|
||||
// }
|
||||
// });
|
||||
// },
|
||||
|
||||
// TODO：删除小说列表数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}).then(() => {
|
||||
novelsDel({ novelId: row.id }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.getData({ pageNum: 1 }); // 刷新商品列表
|
||||
this.$message.success('删除成功');
|
||||
} else {
|
||||
this.$message.error('删除失败');
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
// TODO:请求圈子列表数据
|
||||
getCircleListSearch() {
|
||||
circleListSearch({ pageNum: 1, pageSize: 5000 }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.circleList = res.data.list;
|
||||
} else {
|
||||
this.$message.error('请求圈子列表失败!');
|
||||
this.circleList = [];
|
||||
}
|
||||
});
|
||||
},
|
||||
onSearch() {
|
||||
this.searchData.pageNum = 1;
|
||||
this.getData();
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
this.selectBatch = val;
|
||||
},
|
||||
// setTag() {
|
||||
// this.setTagVisible = true;
|
||||
// },
|
||||
// setTags() {
|
||||
// this.tagsVisible = true;
|
||||
// },
|
||||
showChapterList(index, row) {
|
||||
this.editData = {
|
||||
title: '视频列表',
|
||||
type: 3,
|
||||
data: row,
|
||||
};
|
||||
this.chapterListVisible = true;
|
||||
},
|
||||
addTotal(index, row) {
|
||||
this.editData = {
|
||||
title: '整本添加',
|
||||
data: row,
|
||||
};
|
||||
this.addTotalVisible = true;
|
||||
},
|
||||
// 列表编辑按钮点击事件
|
||||
handleAdd() {
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {},
|
||||
};
|
||||
this.dialogFormVisible = true;
|
||||
},
|
||||
|
||||
// 列表编辑按钮点击事件
|
||||
handleEdit(index, row) {
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row,
|
||||
};
|
||||
this.dialogFormVisible = true;
|
||||
},
|
||||
|
||||
closeEdit() {
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {},
|
||||
};
|
||||
this.editComVisible = false;
|
||||
this.setTagVisible = false;
|
||||
this.dialogFormVisible = false;
|
||||
this.chapterListVisible = false;
|
||||
// this.tagsVisible = false;
|
||||
// this.addTotalVisible = false;
|
||||
// this.batchVisible = false;
|
||||
this.getData();
|
||||
},
|
||||
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined;
|
||||
this.getData();
|
||||
},
|
||||
|
||||
// 切换每页显示的条数触发
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val;
|
||||
this.getData();
|
||||
},
|
||||
|
||||
// 切换页码时触发
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val;
|
||||
this.getData();
|
||||
},
|
||||
|
||||
onAddComment(row) {
|
||||
this.editData = {
|
||||
title: '添加评论',
|
||||
data: row,
|
||||
};
|
||||
this.editComVisible = true;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@/api/user/circleList
|
||||
@@ -0,0 +1,233 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="1200px" top="50px" center class="ac-dialog"
|
||||
:close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" class="demo-form-inline" label-width="120px"
|
||||
label-position="right" style="" ref="ruleForm">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="标题">
|
||||
<el-input v-model="form.title" style="width: 400px" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="番号">
|
||||
<el-input v-model="form.bango" style="width: 400px" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="视频类型">
|
||||
<el-select placeholder="请选择视频类型" v-model="form.contentType" clearable @change="changeContentType">
|
||||
<el-option :key="index" :label="item.label" :value="item.value" v-for="(item, index) in contentTypeList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="视频所属位置">
|
||||
<el-select placeholder="请选择视频所属位置" clearable v-model="form.location">
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in videoLocationListAll" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="上架时间">
|
||||
<el-date-picker v-model="form.addedTime" type="datetime" placeholder="请选择发布时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="发布者ID">
|
||||
<el-input v-model.number="form.publishId" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="排序">
|
||||
<el-input v-model.number="form.rank" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="剧集名称">
|
||||
<el-input v-model="form.SetName" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="集数">
|
||||
<el-input v-model.number="form.SetIndex" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="16" :sm="16" :md="16" :lg="16" :xl="16">
|
||||
<el-form-item label="详细描述">
|
||||
<el-input v-model="form.desc" type="textarea" :autosize="{ minRows: 6, maxRows: 10 }"
|
||||
style="width: 590px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="封面">
|
||||
<UploadImg @changeImgUrl="changeCoverImgUrl" :img="form.coverImg"></UploadImg>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider content-position="center">标签绑定设置</el-divider>
|
||||
<TagSelectV2 type="resourceManagement" @selectTags="selectTags" :formTags="form.tags" :allTags="mediatag" :mediatagCategory="mediatagCategory" />
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消</el-button>
|
||||
<el-button type="primary" @click="submit('ruleForm')">
|
||||
确 定
|
||||
</el-button>
|
||||
</div>
|
||||
<AddVideo :data="form" v-if="addVisible" @close="closeVideoInfo" @closeAll="close" @submit="videoInfo"></AddVideo>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import UploadImg from '@/components/UploadImg/index'
|
||||
import AddVideo from './addVideo'
|
||||
import moment from 'moment'
|
||||
import { stringToArry, arryToString, changeMoneyYuan, changeMoneyFen } from '@/filters/index'
|
||||
import { MediaSatusList } from '@/filters/videoManagement/videoList'
|
||||
import { mediaUpdate } from '@/api/resourceManagement/video.js'
|
||||
import {
|
||||
contentTypeList, videoLocationList
|
||||
} from '@/filters/mediaLibrary/videoList'
|
||||
import TagSelectV2 from '@/components/TagSelectV2/index'
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data', 'videoType', 'mediatag', 'mediaCollList', 'mediatagCategory'],
|
||||
components: {
|
||||
UploadImg,
|
||||
AddVideo,
|
||||
TagSelectV2
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
showTagsFlag: false,
|
||||
Visible: true,
|
||||
title: '',
|
||||
contentTypeList: contentTypeList(),
|
||||
MediaSatusList: MediaSatusList(),
|
||||
videoLocationListAll: [
|
||||
{id:1,name:'视频'},
|
||||
{id:2,name:'暗网'},
|
||||
{id:3,name:'动漫'},
|
||||
{id:4,name:'有声漫'},
|
||||
{id:5,name:'剧场'},
|
||||
{id:6,name:'电影'},
|
||||
{id:7,name:'声优'},
|
||||
],
|
||||
addVisible: false,
|
||||
mediatagCategoryId: null,
|
||||
form: {
|
||||
location: undefined, // 视频所属位置
|
||||
actors: undefined, // [],演员
|
||||
addedTime: undefined, // "string",上架时间
|
||||
bango: undefined, // 番号
|
||||
contentType: undefined, // 格式类型: 1:AV 2:小视频 3:动漫
|
||||
tags: [],
|
||||
rank: undefined, //排序
|
||||
coverImg: undefined, // [],封面
|
||||
desc: undefined, // "string",详细描述
|
||||
publishAvatar: undefined, // 视频发布者头像
|
||||
publishId: undefined, // 发布者ID
|
||||
status: undefined, // 0,视频状态
|
||||
title: undefined, // "string",标题
|
||||
topicIds: [], // 视频分类
|
||||
mediaSet: undefined, // 视频归属
|
||||
id: undefined, // 0,视频Id
|
||||
},
|
||||
rules: {},
|
||||
searchTagTxt: '', // 本地标签搜索
|
||||
allTags: [], // 拷贝出来的所有tabs
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
if (this.title === '编辑') {
|
||||
this.form = { ...this.data.data }
|
||||
this.form.mediaSet = arryToString(this.form.mediaSet)
|
||||
this.form.sortTime =
|
||||
moment(this.data.data.sortTime)
|
||||
.utcOffset(480)
|
||||
.format('YYYY-MM-DDTHH:mm:ss') + '+08:00'
|
||||
if (!this.form.tags) {
|
||||
this.form.tags = []
|
||||
}
|
||||
} else if (this.title === '新增') {
|
||||
this.addVisible = true
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
// TODO：
|
||||
update(data) {
|
||||
mediaUpdate(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.close()
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 标签已选
|
||||
selectTags(tags) {
|
||||
this.form.tags = tags
|
||||
},
|
||||
// 新增时视频ID绑定
|
||||
videoInfo(data) {
|
||||
this.form = { ...this.form, data }
|
||||
|
||||
// this.form.directors = arryToString(this.form.directors)
|
||||
// this.form.secondTags = arryToString(this.form.secondTags)
|
||||
this.addVisible = false
|
||||
},
|
||||
showTagsFun() {
|
||||
this.showTagsFlag = !this.showTagsFlag
|
||||
},
|
||||
|
||||
// 提交按钮
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
|
||||
const data = {
|
||||
id: this.form.id,
|
||||
param: JSON.parse(JSON.stringify(this.form)),
|
||||
}
|
||||
data.param.mediaSet = data.param.mediaSet ? stringToArry(data.param.mediaSet) : []
|
||||
data.param.companiesId = Number(data.param.companiesId)
|
||||
|
||||
this.update(data)
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
changeContentType(val) {
|
||||
this.form.topicIds = []
|
||||
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
// 上传图片返回地址
|
||||
changeCoverImgUrl(data) {
|
||||
this.form.coverImg = data
|
||||
},
|
||||
|
||||
// 关闭不通过原因弹框
|
||||
closeVideoInfo() {
|
||||
this.addVisible = false
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,58 @@
|
||||
<!--
|
||||
* @Author: 王涛
|
||||
* @Mail: no
|
||||
* @Date: 2020-10-02 23:41:38
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @LastEditTime: 2022-05-26 17:25:56
|
||||
-->
|
||||
<template>
|
||||
<el-dialog :visible.sync="Visible" width="400px" center class="ac-dialog" :close-on-click-modal="false" @close="close" title="绑定影片" append-to-body>
|
||||
<el-form :inline="true" :model="form" class="demo-form-inline" label-width="120px" label-position="right">
|
||||
<el-input v-model="form.fileId " placeholder="请输入媒资库影片ID" style="width: 100%;margin-top:10px"></el-input>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="close"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mediaAdd } from '@/api/videoManagement/videoList'
|
||||
export default {
|
||||
name: 'AvList',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
// 表单数据
|
||||
form: {
|
||||
fileId: undefined,
|
||||
},
|
||||
}
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
// 提交按钮
|
||||
submit() {
|
||||
mediaAdd(this.form).then((res) => {
|
||||
if (res.code === 200) {
|
||||
// this.$emit('submit', res.data)
|
||||
this.$message.success('添加成功')
|
||||
this.close()
|
||||
} else if (res.code === 8000) {
|
||||
this.$message.error('媒资库ID不存在')
|
||||
} else if (res.code === 1006) {
|
||||
this.$message.error('请输入媒资库ID')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
this.$emit('closeAll')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,60 @@
|
||||
<!--
|
||||
* @Author: 王涛
|
||||
* @Mail: no
|
||||
* @Date: 2020-10-02 23:41:38
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @LastEditTime: 2022-05-26 17:51:34
|
||||
-->
|
||||
<template>
|
||||
<el-dialog :visible.sync="Visible" width="400px" center class="ac-dialog" :close-on-click-modal="false" @close="close" title="绑定影片" append-to-body>
|
||||
<el-form :inline="true" :model="form" class="demo-form-inline" label-width="120px" label-position="right">
|
||||
<el-input v-model="form.fileId " placeholder="请输入媒资库影片ID" style="width: 100%;margin-top:10px"></el-input>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="close"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mediaAddTs } from '@/api/videoManagement/videoList'
|
||||
export default {
|
||||
name: 'AvList',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
// 表单数据
|
||||
form: {
|
||||
fileId: undefined,
|
||||
},
|
||||
}
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
// 提交按钮
|
||||
submit() {
|
||||
mediaAddTs(this.form).then((res) => {
|
||||
if (res.code === 200) {
|
||||
// this.$emit('submit', res.data)
|
||||
this.$message.success('添加成功')
|
||||
this.close()
|
||||
} else if (res.code === 8000) {
|
||||
this.$message.error('媒资库ID不存在')
|
||||
} else if (res.code === 1006) {
|
||||
this.$message.error('请输入媒资库ID')
|
||||
} else {
|
||||
this.$message.error('视频添加失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
this.$emit('closeAll')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,243 @@
|
||||
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="120px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="是否VIP" prop="status">
|
||||
<el-select placeholder="请选择信息分类" clearable v-model="form.isVip" style="width: 180px">
|
||||
<el-option label="非VIP视频" :value="false" />
|
||||
<el-option label="VIP视频" :value="true" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="视频状态" prop="status">
|
||||
<el-select placeholder="请选择视频状态" clearable v-model="form.status" style="width: 180px">
|
||||
<el-option v-for="item in MediaSatusList" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="主题分类">
|
||||
<el-select style="width: 180px" multiple placeholder="请选择主题分类" v-model="form.topicIds" filterable allow-create default-first-option>
|
||||
<el-option :key="item.value" :label="item.name" :value="item.id" v-for="item in newVideoType" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="视频所属位置" >
|
||||
<el-select placeholder="请选择视频所属位置" clearable v-model="form.location" @change="changeLocationFn">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in videoLocationList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="所属视频合集">
|
||||
<el-select placeholder="请选择所视频合集" v-model="form.collectionId" filterable allow-create default-first-option multiple
|
||||
>
|
||||
<el-option :key="index" :label="item.name" :value="item.id" v-for="(item, index) in newMediaCollList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="发布者ID">
|
||||
<el-input v-model.number="form.publishId" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="上架时间">
|
||||
<el-date-picker v-model="form.addedTime" type="datetime" placeholder="选择日期" style="width: 180px"> </el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="视频售价">
|
||||
<el-input v-model.number="form.price" placeholder="请输入价格" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="视频类型">
|
||||
<el-select placeholder="请选择视频类型" v-model="form.contentType" clearable style="width: 180px">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in contentTypeList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="圈子">
|
||||
<el-select style="width: 163px" placeholder="请选择圈子" v-model="form.circleId" filterable>
|
||||
<el-option :key="item.id + item.name" :label="item.name" :value="item.id" v-for="item in circleList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mediaUpdate } from '@/api/videoManagement/videoList';
|
||||
import { MediaSatusList } from '@/filters/videoManagement/videoList';
|
||||
import { arryToString, changeMoneyYuan, changeMoneyFen } from '@/filters/index';
|
||||
import {
|
||||
contentTypeList,videoLocationList
|
||||
} from '@/filters/mediaLibrary/videoList'
|
||||
export default {
|
||||
name: 'Batch',
|
||||
props: ['data', 'videoType', 'gatherList', 'studioList', 'actorList', 'circleList','mediaCollList'],
|
||||
data() {
|
||||
return {
|
||||
contentTypeList: contentTypeList(),
|
||||
MediaSatusList: MediaSatusList(),
|
||||
videoLocationList: videoLocationList(),
|
||||
Visible: true,
|
||||
title: '',
|
||||
newVideoType:[],
|
||||
// 表单数据
|
||||
form: {
|
||||
isVip: undefined,
|
||||
status: undefined,
|
||||
topicIds: [],
|
||||
gatherIds: [],
|
||||
collectionId:[], // 合集id
|
||||
// actorIds: [],
|
||||
actor: undefined,
|
||||
companiesId: undefined,
|
||||
publishId: undefined,
|
||||
addedTime: undefined,
|
||||
contentType: undefined,
|
||||
location: undefined,
|
||||
circleId: undefined,
|
||||
// price: undefined,
|
||||
},
|
||||
//
|
||||
dates: [],
|
||||
rules: {
|
||||
isVip: undefined,
|
||||
status: undefined,
|
||||
},
|
||||
};
|
||||
},
|
||||
computed:{
|
||||
newMediaCollList(){
|
||||
if(this.form.location){
|
||||
let arr = []
|
||||
arr = this.mediaCollList.filter(item=>{
|
||||
return item.location===this.form.location
|
||||
})
|
||||
return arr
|
||||
}else{
|
||||
return this.mediaCollList
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeLocationFn(val){
|
||||
this.newVideoType = this.newVideoType.filter(item=>{
|
||||
return item.location === val
|
||||
})
|
||||
},
|
||||
// 提交按钮
|
||||
submit() {
|
||||
if (this.data.length) {
|
||||
this.data.forEach(item => {
|
||||
const data = {
|
||||
id: item.id,
|
||||
param: item,
|
||||
};
|
||||
data.param.isVip = this.form.isVip;
|
||||
data.param.status = this.form.status;
|
||||
if (this.form.topicIds.length !== 0) {
|
||||
data.param.topicIds = this.form.topicIds;
|
||||
}
|
||||
|
||||
if (this.form.gatherIds.length !== 0) {
|
||||
data.param.gatherIds = this.form.gatherIds;
|
||||
} if (this.form.collectionId.length !== 0) {
|
||||
data.param.collectionId = this.form.collectionId;
|
||||
}
|
||||
|
||||
// if (this.form.actorIds.length !== 0) {
|
||||
// data.param.actorIds = this.form.actorIds;
|
||||
// const actorNameArr = [];
|
||||
// Object.keys(this.actorList).forEach(key => {
|
||||
// if (this.form.actorIds.length > 0) {
|
||||
// for (let index = 0; index < this.form.actorIds.length; index++) {
|
||||
// if (this.form.actorIds[index] === this.actorList[key].id) {
|
||||
// actorNameArr.push(this.actorList[key].name);
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
// data.param.actor = arryToString(actorNameArr);
|
||||
// } else {
|
||||
// data.param.actor = arryToString(data.param.actor);
|
||||
// }
|
||||
if (this.form.companiesId) {
|
||||
data.param.companiesId = this.form.companiesId;
|
||||
}
|
||||
if (this.form.publishId) {
|
||||
data.param.publishId = this.form.publishId;
|
||||
}
|
||||
if (this.form.addedTime) {
|
||||
data.param.addedTime = this.form.addedTime;
|
||||
}
|
||||
if (this.form.contentType) {
|
||||
data.param.contentType = this.form.contentType;
|
||||
}
|
||||
// if (this.form.coverType) {
|
||||
// data.param.coverType = this.form.coverType;
|
||||
// }
|
||||
if (this.form.circleId) {
|
||||
data.param.circleId = this.form.circleId;
|
||||
}
|
||||
if (this.form.location) {
|
||||
data.param.location = this.form.location;
|
||||
}
|
||||
// if (this.form.price) {
|
||||
// data.param.price = this.form.price * 100;
|
||||
// } else if (this.form.price === 0) {
|
||||
// data.param.price = 0;
|
||||
// }
|
||||
mediaUpdate(data).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: item.id + '修改成功',
|
||||
});
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: item.id + '修改失败',
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '未选择视频',
|
||||
});
|
||||
}
|
||||
this.Visible = false;
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close');
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.newVideoType = JSON.parse(JSON.stringify(this.videoType))
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,99 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-03-14 15:22:04
|
||||
* @LastEditTime: 2022-03-18 11:58:24
|
||||
* @LastEditors:
|
||||
* @FilePath: /comics-admin/src/views/videoManagement/videoList/components/setTag.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="120px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="视频标签" prop="status">
|
||||
<el-select placeholder="请选择视频标签" clearable v-model="form.tags" style="width: 180px" multiple filterable>
|
||||
<el-option v-for="item in MediaSatusList" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mediatagDelAll } from '@/api/videoManagement/mediatag'
|
||||
import { mediatagList } from '@/api/videoManagement/mediatag'
|
||||
export default {
|
||||
name: 'AvList',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
MediaSatusList: [],
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
tags: undefined
|
||||
},
|
||||
//
|
||||
rules: {
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getMediatagList()
|
||||
},
|
||||
methods: {
|
||||
// 提交按钮
|
||||
submit() {
|
||||
if (this.data.length) {
|
||||
const mediaIds = []
|
||||
this.data.forEach(item => {
|
||||
mediaIds.push(item.id)
|
||||
})
|
||||
const param = {
|
||||
ids: mediaIds,
|
||||
tags: this.form.tags
|
||||
}
|
||||
mediatagDelAll(param).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('设置标签成功')
|
||||
} else {
|
||||
this.$message.error('设置标签失败')
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '未选择视频'
|
||||
})
|
||||
}
|
||||
this.Visible = false
|
||||
},
|
||||
|
||||
getMediatagList(val) {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 5000
|
||||
}
|
||||
mediatagList(param).then((res) => {
|
||||
if (res.data.list) {
|
||||
this.MediaSatusList = res.data.list
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,99 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-03-14 15:22:04
|
||||
* @LastEditTime: 2022-03-18 11:58:24
|
||||
* @LastEditors:
|
||||
* @FilePath: /comics-admin/src/views/videoManagement/videoList/components/setTag.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="120px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="视频标签" prop="status">
|
||||
<el-select placeholder="请选择视频标签" clearable v-model="form.tags" style="width: 180px" multiple filterable>
|
||||
<el-option v-for="item in MediaSatusList" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mediatagAddTags } from '@/api/videoManagement/videoList'
|
||||
import { mediatagList } from '@/api/videoManagement/mediatag'
|
||||
export default {
|
||||
name: 'AvList',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
MediaSatusList: [],
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
tags: undefined
|
||||
},
|
||||
//
|
||||
rules: {
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getMediatagList()
|
||||
},
|
||||
methods: {
|
||||
// 提交按钮
|
||||
submit() {
|
||||
if (this.data.length) {
|
||||
const mediaIds = []
|
||||
this.data.forEach(item => {
|
||||
mediaIds.push(item.id)
|
||||
})
|
||||
const param = {
|
||||
mediaIds: mediaIds,
|
||||
tags: this.form.tags
|
||||
}
|
||||
mediatagAddTags(param).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('设置标签成功')
|
||||
} else {
|
||||
this.$message.error('设置标签失败')
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '未选择视频'
|
||||
})
|
||||
}
|
||||
this.Visible = false
|
||||
},
|
||||
|
||||
getMediatagList(val) {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 5000
|
||||
}
|
||||
mediatagList(param).then((res) => {
|
||||
if (res.data.list) {
|
||||
this.MediaSatusList = res.data.list
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,129 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
:title="title"
|
||||
:visible.sync="Visible"
|
||||
width="400px"
|
||||
top="50px"
|
||||
center
|
||||
class="ac-dialog"
|
||||
:close-on-click-modal="false"
|
||||
@close="close"
|
||||
>
|
||||
<el-select
|
||||
placeholder="请选择视频状态"
|
||||
clearable
|
||||
v-model="code"
|
||||
style="width: 180px"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in inviteCodeList"
|
||||
:key="item.value"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
<el-button @click="copy()"> 复制邀请链接 </el-button>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit('ruleForm')">
|
||||
确 定
|
||||
</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import { inviteList } from "@/api/inviteCodeM/inviteList.js";
|
||||
import { getSyscfg } from "@/api/system/systemConfig";
|
||||
export default {
|
||||
name: "AddOrEdit",
|
||||
props: ["data"],
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: "",
|
||||
code: undefined,
|
||||
inviteCodeList: [],
|
||||
h5ShareUrl: {},
|
||||
contentType: undefined,
|
||||
};
|
||||
},
|
||||
|
||||
async mounted() {
|
||||
this.contentType = this.data.data.contentType;
|
||||
this.id = this.data.data.objectId;
|
||||
this.getData();
|
||||
this.getInviteList();
|
||||
},
|
||||
methods: {
|
||||
removeTrailingSlash(str) {
|
||||
if (str.endsWith("/")) {
|
||||
return str.slice(0, -1);
|
||||
}
|
||||
return str;
|
||||
},
|
||||
copy() {
|
||||
if (this.code) {
|
||||
if (this.contentType === 1) {
|
||||
const url =
|
||||
this.removeTrailingSlash(this.h5ShareUrl) +
|
||||
"/#/play/shortVideo/" +
|
||||
this.id +
|
||||
"?pc=" +
|
||||
this.code +
|
||||
"&dc=h5share";
|
||||
this.$copyText(url).then(() => {
|
||||
this.$notify({
|
||||
type: "success",
|
||||
message: "複製成功，趕快去分享吧。",
|
||||
});
|
||||
});
|
||||
} else {
|
||||
const url =
|
||||
this.removeTrailingSlash(this.h5ShareUrl) +
|
||||
"/#/play/longVideo/" +
|
||||
this.id +
|
||||
"?pc=" +
|
||||
this.code +
|
||||
"&dc=h5share";
|
||||
this.$copyText(url).then(() => {
|
||||
this.$notify({
|
||||
type: "success",
|
||||
message: "複製成功，趕快去分享吧。",
|
||||
});
|
||||
});
|
||||
}
|
||||
} else {
|
||||
this.$message("请先选择邀请码");
|
||||
}
|
||||
},
|
||||
// TODO：请求邀请码列表
|
||||
getInviteList() {
|
||||
inviteList({ pageNum: 1, pageSize: 200 }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.inviteCodeList = res.data.list;
|
||||
} else {
|
||||
this.inviteCodeList = [];
|
||||
this.$message("请求渠道码列表失败");
|
||||
}
|
||||
});
|
||||
},
|
||||
close() {
|
||||
this.$emit("close");
|
||||
},
|
||||
// TODO:获取系统配置数据
|
||||
getData() {
|
||||
getSyscfg({}).then((res) => {
|
||||
if (res.code === 200) {
|
||||
console.log(res.data,"data")
|
||||
this.h5ShareUrl = JSON.parse(JSON.stringify(res.data.h5ShareUrl));
|
||||
console.log(this.h5ShareUrl, "h5ShareUrl");
|
||||
} else {
|
||||
this.$message.error("请求系统配置失败");
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,566 @@
|
||||
|
||||
<template>
|
||||
<div class="pf-warpper avlist">
|
||||
<el-row class="table-form">
|
||||
<el-form :inline="true" :model="searchData" class="form-inline" size="mini">
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入影片ID" clearable v-model="searchData.id" @clear="onClear('id')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入标题" clearable v-model="searchData.title" @clear="onClear('title')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入任务ID" clearable v-model="searchData.taskId" @clear="onClear('taskId')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入番号" clearable v-model="searchData.bango" @clear="onClear('bango')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择视频状态" clearable v-model="searchData.status" @clear="onClear('status')">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in MediaSatusList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入标题" clearable v-model="searchData.title" @clear="onClear('title')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择视频类型" clearable v-model="searchData.contentType" @clear="onClear('contentType')" @change="changeContentTypeFn">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in contentTypeList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择视频标签" clearable v-model="searchData.tagId" @clear="onClear('tagId')" filterable default-first-option>
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in mediatag" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择视频所属位置" clearable v-model="searchData.location" @clear="onClear('location')">
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in videoLocationListAll" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择排序方式" clearable v-model="searchData.sort" @clear="onClear('timeRange')">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in rankSo" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-date-picker
|
||||
:default-time="['00:00:00', '23:59:59']"
|
||||
end-placeholder="结束日期"
|
||||
range-separator="至"
|
||||
start-placeholder="开始日期"
|
||||
type="datetimerange"
|
||||
v-model="time"
|
||||
value-format="yyyy-MM-ddTHH:mm:ss+08:00"/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="onSeach" icon="el-icon-search" plain type="primary">搜索</el-button>
|
||||
<el-button @click="add" icon="el-icon-circle-plus-outline" plain type="success">新增</el-button>
|
||||
<el-button @click="addVideoArray" icon="el-icon-circle-plus-outline" plain type="warning">批量加入后台视频</el-button>
|
||||
<!-- <el-button @click="setTag" icon="el-icon-edit-outline" plain type="warning">批量设置标签</el-button> -->
|
||||
<!-- <el-button @click="delTag" icon="el-icon-edit-outline" plain type="danger">批量删除标签</el-button> -->
|
||||
<!-- <el-button @click="delAll" icon="el-icon-edit-outline" plain type="danger">批量删除视频</el-button> -->
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col>
|
||||
<el-table
|
||||
:data="resData"
|
||||
element-loading-text="拼命加载中"
|
||||
border
|
||||
height="700"
|
||||
highlight-current-row
|
||||
style="width: 100%"
|
||||
v-loading="loading"
|
||||
:row-style="{ height: '70px' }"
|
||||
@selection-change="handleSelectionChange"
|
||||
empty-text="暂无更多数据">
|
||||
<el-table-column type="selection" width="50" fixed="left"> </el-table-column>
|
||||
|
||||
<el-table-column align="center" label="视频Id">
|
||||
<template slot-scope="scope">{{ scope.row.id }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="任务ID" width="190px">
|
||||
<template slot-scope="scope">{{ scope.row.taskId }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="标题" width="100px" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.title }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="番号" width="100px" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.bango }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="发布者Id">
|
||||
<template slot-scope="scope">{{ scope.row.publishId }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="视频类型">
|
||||
<template slot-scope="scope">{{ scope.row.contentType | changeContentType }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="视频所属位置">
|
||||
<template slot-scope="scope">{{ scope.row.location | changeVideoLocationAll }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="剧集名称">
|
||||
<template slot-scope="scope">{{ scope.row.SetName }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="集数">
|
||||
<template slot-scope="scope">{{ scope.row.SetIndex }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="正片预览">
|
||||
<template slot-scope="scope">
|
||||
<i v-if="scope.row.fieldNameFs" class="el-icon-video-play views" title="点击预览" @click="checkMedia(scope.row.fieldNameFs, scope.row)"></i>
|
||||
<div v-else>暂无</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="视频封面" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg v-if="scope.row.coverType === 2" style="width: 50px; height: 70px; margin: 0 auto" :urls="scope.row.coverImg"></ShowImg>
|
||||
<ShowImg v-else style="width: 70px; height: 40px; margin: 0 auto" :urls="scope.row.coverImg"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="预览视频">
|
||||
<template slot-scope="scope">
|
||||
<i v-if="scope.row.preFileName" class="el-icon-video-play views" title="点击预览" @click="checkMedia(scope.row.preFileName, scope.row)"></i>
|
||||
<div v-else>暂无</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="详细描述" width="200px" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.desc }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="标签" width="300px">
|
||||
<template slot-scope="scope">
|
||||
<template v-for="(item, index) in scope.row.tagList">
|
||||
<el-tag style="margin: 2px" :key="index + 'tagData'" size="mini">
|
||||
{{ item | changeName(mediatag, 'id', 'name') }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="售价（元）" width="100px">
|
||||
<template slot-scope="scope">{{ scope.row.price | changeMoneyYuan }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="影片时长">
|
||||
<template slot-scope="scope">{{ scope.row.playTime | secondToHouseMinuteSecond }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="分辨率高">
|
||||
<template slot-scope="scope">{{ scope.row.height }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="分辨率宽">
|
||||
<template slot-scope="scope">{{ scope.row.width }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="文件大小(MB)">
|
||||
<template slot-scope="scope">{{ getSizeToMB(scope.row.size) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="视频状态" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<el-button :type="scope.row.status === 1 ? 'success' : scope.row.status === 2 ? 'danger' : 'warning'" plain size="mini">{{ scope.row.status | changMediaSatus }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="媒资库ID" width="150px">
|
||||
<template slot-scope="scope">{{ scope.row.fileId }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="上次观看时间" width="160px">
|
||||
<template slot-scope="scope">{{ scope.row.lastWatchTime | BeiJingTime }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="上架时间" width="160px">
|
||||
<template slot-scope="scope">{{ scope.row.addedTime | BeiJingTime }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="创建时间" width="160px">
|
||||
<template slot-scope="scope">{{ scope.row.createdAt | BeiJingTime }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="更新时间" width="160px">
|
||||
<template slot-scope="scope">{{ scope.row.updatedAt | BeiJingTime }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="430">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="warning" @click="H5Share(scope.row)">分享链接 </el-button>
|
||||
<el-button @click="handleEdit(scope.row)" size="mini" type="primary">编辑</el-button>
|
||||
<el-button @click="handleDelete(scope.row)" size="mini" type="danger">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="table-pagination">
|
||||
<el-pagination
|
||||
:current-page="searchData.pageNum"
|
||||
:page-size="searchData.pageSize"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:total="total"
|
||||
@current-change="handleCurrentChange"
|
||||
@size-change="handleSizeChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"/>
|
||||
</div>
|
||||
<!-- 新增及编辑 -->
|
||||
<Edit :mediatagCategory="mediatagCategory" :mediatag="mediatag" :videoType="videoType" :circleList="circleList" :mediaCollList="mediaCollList" :data="editData" v-if="editVisible" @close="closeEdit" />
|
||||
<ShowVideo ref="showvideo"></ShowVideo>
|
||||
<SetTag :data="selectBatch" v-if="setTagVisible" @close="closeEdit"></SetTag>
|
||||
<AddVideo2 :data="selectBatch" v-if="addVideoVisible" @close="closeEdit"></AddVideo2>
|
||||
<!-- <ShareUrl v-if="showH5Share" :data="editData" @close="closeEdit"></ShareUrl> -->
|
||||
<DelTag :data="selectBatch" v-if="delTagVisible" @close="closeEdit"></DelTag>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// 引入模块
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
import Edit from './components/AddOrEdit'
|
||||
import SetTag from './components/setTag'
|
||||
import AddVideo2 from './components/addVideo2.vue'
|
||||
import DelTag from './components/delTag'
|
||||
|
||||
import { contentTypeList, videoLocationList } from '@/filters/mediaLibrary/videoList'
|
||||
import { rankSo, MediaPayTypeList, MediaSatusList } from '@/filters/videoManagement/videoList'
|
||||
import { mediaSearch, mediaDel } from '@/api/resourceManagement/video.js'
|
||||
import ShowVideo from '@/components/ShowVideo/index.vue'
|
||||
import { mediatagAll } from '@/api/resourceManagement/video'
|
||||
import { topicSearch } from '@/api/videoManagement/topic'
|
||||
import { circleListSearch } from '@/api/user/circleList'
|
||||
import { mediatagCategoryList } from '@/api/resourceManagement/video'
|
||||
import ShareUrl from './components/shareUrl'
|
||||
export default {
|
||||
name: 'VideoList',
|
||||
components: {
|
||||
Edit,
|
||||
ShowImg,
|
||||
ShowVideo,
|
||||
SetTag,
|
||||
AddVideo2,
|
||||
ShareUrl,
|
||||
DelTag
|
||||
},
|
||||
filters: {
|
||||
changeVideoLocationAll(v) {
|
||||
switch (v) {
|
||||
case 1:
|
||||
return '视频'
|
||||
case 2:
|
||||
return '暗网'
|
||||
case 3:
|
||||
return '动漫'
|
||||
case 4:
|
||||
return '有声漫'
|
||||
case 5:
|
||||
return '剧场'
|
||||
case 6:
|
||||
return '电影'
|
||||
case 7:
|
||||
return '声优'
|
||||
default:
|
||||
return '未知'
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
mediatag: [],
|
||||
videoType: [],
|
||||
MediaPayTypeList: MediaPayTypeList(),
|
||||
circleList: [],
|
||||
mediaCollList: [],
|
||||
rankSo: rankSo(),
|
||||
MediaSatusList: MediaSatusList(),
|
||||
contentTypeList: contentTypeList(),
|
||||
videoLocationListAll: [
|
||||
{id:1,name:'视频'},
|
||||
{id:2,name:'暗网'},
|
||||
{id:3,name:'动漫'},
|
||||
{id:4,name:'有声漫'},
|
||||
{id:5,name:'剧场'},
|
||||
{id:6,name:'电影'},
|
||||
{id:7,name:'声优'},
|
||||
],
|
||||
mediatagCategory:[],
|
||||
// MediacolumnList: [],
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
id: undefined, // 0,视频Id
|
||||
bango: undefined,
|
||||
contentType: undefined, // 格式类型 1:AV 2:小视频 3:动漫
|
||||
end: undefined, // "string",结束时间
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
start: undefined, // "string",开始时间
|
||||
status: undefined, // 0,视频状态
|
||||
sort: undefined, // "string",媒体状态 operatAt(编辑时间)/addedTime(上架时间)/createdAt(创建时间)/updatedAt(更新时间)
|
||||
title: undefined, // "string",标题
|
||||
tagId: undefined,
|
||||
taskId:undefined,
|
||||
location:undefined
|
||||
},
|
||||
time: undefined,
|
||||
resData: [], // el-table表格数据
|
||||
total: 0, // 数据总条数
|
||||
loading: true, // 列表加载状态
|
||||
// 编辑数据
|
||||
editVisible: false, // 新增或编辑弹出框
|
||||
setTagVisible: false,
|
||||
addVideoVisible: false,
|
||||
showH5Share: false,
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {}
|
||||
},
|
||||
videoList: [],
|
||||
selectBatch: [],
|
||||
delTagVisible: false
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.getMediatagList()
|
||||
this.getmediatagCategoryList()
|
||||
this.getMediacategoryList()
|
||||
this.searchData = this.$store.getters.getSeachParam
|
||||
this.getMediaSearch()
|
||||
this.getCircleListSearch()
|
||||
},
|
||||
methods: {
|
||||
// 分享H5
|
||||
H5Share(row) {
|
||||
this.editData = {
|
||||
title: '分享链接',
|
||||
data: {
|
||||
objectId: row.id,
|
||||
contentType: row.contentType
|
||||
}
|
||||
}
|
||||
this.showH5Share = true
|
||||
},
|
||||
|
||||
// TODO:请求视频标签分类列表
|
||||
getmediatagCategoryList() {
|
||||
mediatagCategoryList({ pageNum: 1, pageSize: 100 }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.mediatagCategory = res.data.list
|
||||
} else {
|
||||
this.mediatagCategory = []
|
||||
}
|
||||
})
|
||||
},
|
||||
// 批量删除
|
||||
delAll() {
|
||||
if (!this.selectBatch.length) return this.$message.error('请选择视频！')
|
||||
this.$confirm('确认删除所选视频?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
this.selectBatch.map(item => {
|
||||
mediaDel({ id: item.id }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '删除成功!'
|
||||
})
|
||||
} else {
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
this.getMediaSearch()
|
||||
})
|
||||
.catch(() => {
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '已取消删除'
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
delTag() {
|
||||
console.log(111)
|
||||
this.delTagVisible = true
|
||||
},
|
||||
// TODO：请求视频标签列表
|
||||
getMediatagList(val) {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 5000,
|
||||
contentType: val || undefined
|
||||
}
|
||||
mediatagAll(param).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.mediatag = res.data.list
|
||||
this.mediatag.push({ id: 0, name: '未选择标签' })
|
||||
} else {
|
||||
this.mediatag = []
|
||||
this.$message.error('请求视频标签失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// TODO：请求视频分类列表
|
||||
getMediacategoryList(val) {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 500,
|
||||
contentType: val || undefined
|
||||
}
|
||||
topicSearch(param).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.videoType = res.data.list
|
||||
} else {
|
||||
this.videoType = []
|
||||
this.$message.error('请求视频类型列表失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 切换视频类型
|
||||
changeContentTypeFn(val) {
|
||||
this.getMediatagList(val)
|
||||
this.getMediacategoryList(val)
|
||||
},
|
||||
getSizeToMB(val) {
|
||||
return (val / 1024 / 1024).toFixed(2)
|
||||
},
|
||||
|
||||
// 批量选择
|
||||
handleSelectionChange(val) {
|
||||
this.selectBatch = val
|
||||
},
|
||||
|
||||
// 批量加入后台视频库按钮
|
||||
addVideoArray() {
|
||||
this.addVideoVisible = true
|
||||
},
|
||||
|
||||
|
||||
|
||||
// // 一键同步
|
||||
// onSynch() {
|
||||
// mediaSync().then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// this.$message.success('同步成功!')
|
||||
// } else {
|
||||
// this.$message.error(res.data)
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
// TODO：请求视频列表数据
|
||||
getMediaSearch() {
|
||||
this.loading = true
|
||||
const param = JSON.parse(JSON.stringify(this.searchData))
|
||||
if (this.time) {
|
||||
param.start = this.time[0]
|
||||
param.end = this.time[1]
|
||||
} else {
|
||||
param.start = undefined
|
||||
param.end = undefined
|
||||
}
|
||||
if (this.searchData.sort === '') {
|
||||
param.sort = undefined
|
||||
}
|
||||
this.$store.dispatch('videoManagement/setSeachParam', param)
|
||||
mediaSearch(param).then(res => {
|
||||
console.log(res)
|
||||
if (res.code === 200) {
|
||||
res.data.list.forEach(item => {
|
||||
item.actor ? (item.actor = item.actor.split(',')) : ''
|
||||
})
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.$message.error('请求列表失败!')
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
// TODO：删除视频列表数据
|
||||
handleDelete(row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
mediaDel({ id: row.id }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.getMediaSearch()
|
||||
this.$message.success('成功删除!')
|
||||
} else {
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
// TODO:请求圈子列表数据
|
||||
getCircleListSearch() {
|
||||
circleListSearch({ pageNum: 1, pageSize: 5000 }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.circleList = res.data.list
|
||||
} else {
|
||||
this.$message.error('请求圈子列表失败!')
|
||||
this.circleList = []
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
setTag() {
|
||||
this.setTagVisible = true
|
||||
},
|
||||
|
||||
onSeach() {
|
||||
this.searchData.pageNum = 1
|
||||
this.searchData.pageSize = 10
|
||||
this.getMediaSearch()
|
||||
},
|
||||
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getMediaSearch()
|
||||
},
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getMediaSearch()
|
||||
},
|
||||
|
||||
// 新增按钮
|
||||
add() {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {}
|
||||
}
|
||||
},
|
||||
// 编辑按钮
|
||||
handleEdit(row) {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row
|
||||
}
|
||||
},
|
||||
|
||||
// 关闭编辑弹窗
|
||||
closeEdit() {
|
||||
this.editVisible = false
|
||||
this.setTagVisible = false
|
||||
this.addVideoVisible = false
|
||||
this.showH5Share = false
|
||||
this.delTagVisible = false
|
||||
|
||||
this.getMediaSearch()
|
||||
},
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getMediaSearch()
|
||||
},
|
||||
// 视频查看
|
||||
checkMedia(url, data) {
|
||||
this.$refs.showvideo.open(url, data)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@/api/user/circleList
|
||||
@@ -0,0 +1,112 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="100px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="分类名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入分类名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="视频标签分类所属位置">
|
||||
<el-select placeholder="请选择视频标签分类所属位置" clearable v-model="form.location">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in videoLocationList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit('ruleForm')"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import { mediatagCategoryUpdate, mediatagCategoryAdd } from '@/api/resourceManagement/video'
|
||||
import {
|
||||
videoLocationList
|
||||
} from '@/filters/mediaLibrary/videoList'
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data'],
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
videoLocationList:videoLocationList(),
|
||||
// 表单数据
|
||||
form: {
|
||||
name: undefined,
|
||||
rank: undefined, // 0,排序
|
||||
status: true, // true,是否启用
|
||||
contentType: undefined,
|
||||
cover: undefined, // string 封面
|
||||
watchTimes: undefined, // 0 观看次数
|
||||
defaultType: undefined
|
||||
},
|
||||
rules: {
|
||||
name: [{ required: true, message: '必填', trigger: 'blur' }],
|
||||
rank: [{ required: true, message: '必填', trigger: 'blur' }]
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
if (this.title === '编辑') {
|
||||
this.form = { ...this.data.data }
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// TODO:新增视频标签列表
|
||||
add(data) {
|
||||
mediatagCategoryAdd(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('新增失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:编辑视频标签数据
|
||||
update(data) {
|
||||
mediatagCategoryUpdate(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 提交按钮
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.title === '新增') {
|
||||
this.add(this.form)
|
||||
} else if (this.title === '编辑') {
|
||||
const data = {
|
||||
id: this.data.data.id,
|
||||
param: this.form
|
||||
}
|
||||
this.update(data)
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,146 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close" append-to-body>
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" class="demo-form-inline" label-width="100px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="名称" prop="name">
|
||||
<el-input v-model="form.name" placeholder="请输入名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="排序" prop="rank">
|
||||
<el-input v-model.number="form.rank" placeholder="请输入排序" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="封面" prop="cover">
|
||||
<UploadImg @changeImgUrl='changeCover' :img='form.cover' :width='"150px"' :height='"150px"'></UploadImg>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="视频类型">
|
||||
<el-select placeholder="请选择视频类型" v-model="form.contentType" style="width: 163px" clearable>
|
||||
<el-option label="长视频" :value="1" />
|
||||
<el-option label="短视频" :value="2" />
|
||||
<el-option label="动漫" :value="3" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" >
|
||||
<el-form-item label="热度值">
|
||||
<el-input v-model.number="form.watchTimes" placeholder="请输入热度值" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="是否启用" prop="status">
|
||||
<el-switch v-model="form.status" active-color="#13ce66" inactive-color="#ff4949" active-text="开启" inactive-text="关闭"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
||||
<el-form-item label="标签描述">
|
||||
<el-input v-model="form.desc" placeholder="请输入标签描述" style="width: 520px" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit('ruleForm')"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import { mediatagUpdate, mediatagAdd } from '@/api/resourceManagement/video'
|
||||
import UploadImg from '@/components/UploadImg'
|
||||
export default {
|
||||
name: 'AddTag',
|
||||
props: ['data', 'categoryId'],
|
||||
components: {
|
||||
UploadImg
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
name: undefined,
|
||||
rank: undefined, // 0,排序
|
||||
status: true, // true,是否启用
|
||||
contentType: undefined,
|
||||
cover: undefined, // string 封面
|
||||
watchTimes: undefined, // 0 观看次数
|
||||
defaultType: undefined,
|
||||
categoryId: undefined
|
||||
},
|
||||
rules: {
|
||||
name: [{ required: true, message: '必填', trigger: 'blur' }],
|
||||
rank: [{ required: true, message: '必填', trigger: 'blur' }]
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
this.form.categoryId = this.categoryId
|
||||
if (this.title === '编辑') {
|
||||
this.form = { ...this.data.data }
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// TODO:新增视频标签列表
|
||||
add(data) {
|
||||
mediatagAdd(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('新增失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:编辑视频标签数据
|
||||
update(data) {
|
||||
mediatagUpdate(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 提交按钮
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.title === '新增') {
|
||||
this.add(this.form)
|
||||
} else if (this.title === '编辑') {
|
||||
const data = {
|
||||
id: this.data.data.id,
|
||||
param: this.form
|
||||
}
|
||||
this.update(data)
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
changeCover(url) {
|
||||
this.form.cover = url
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,88 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-03-14 15:22:04
|
||||
* @LastEditTime: 2024-07-04 11:00:48
|
||||
* @LastEditors: Administrator admin@example.com
|
||||
* @FilePath: /pidou_admin/src/views/videoManagement/videoTagType/components/setTag.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="400px" center :close-on-click-modal="false" @close="close" append-to-body>
|
||||
<el-form :inline="true" :model="form" :rules="rules" ref="ruleForm" label-width="120px" label-position="right">
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
||||
<el-form-item label="是否启用" prop="status">
|
||||
<el-switch
|
||||
v-model="form.status"
|
||||
active-color="#13ce66"
|
||||
inactive-color="#ff4949"
|
||||
active-text="开启"
|
||||
inactive-text="关闭"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mediatagUpdate } from '@/api/resourceManagement/video'
|
||||
export default {
|
||||
name: 'SetTag',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
MediaSatusList: [],
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
status: false
|
||||
},
|
||||
//
|
||||
rules: {
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
// 提交按钮
|
||||
submit() {
|
||||
if (this.data.length) {
|
||||
this.data.forEach(item => {
|
||||
item.status = this.form.status
|
||||
const data = {
|
||||
id: item.id,
|
||||
param: item
|
||||
}
|
||||
mediatagUpdate(data).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('设置标签成功')
|
||||
} else {
|
||||
this.$message.error('设置标签失败')
|
||||
}
|
||||
})
|
||||
})
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '未选择标签'
|
||||
})
|
||||
}
|
||||
this.Visible = false
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,263 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="1200px" center class="ac-dialog"
|
||||
:close-on-click-modal="false" @close="close">
|
||||
<div class="pf-warpper avlist">
|
||||
<el-row class="table-form">
|
||||
<el-form :inline="true" :model="searchData" class="form-inline" size="mini">
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入标签名称" clearable @clear="onClear('name')" v-model="searchData.name" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择视频类型" clearable @clear="onClear('contentType')" v-model="searchData.contentType">
|
||||
<el-option :label="item.label" :value="item.value" v-for="item in contentTypeList" :key="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择是否前端显示" clearable @clear="onClear('showType')" v-model="searchData.showType">
|
||||
<el-option label="不显示" :value="0" />
|
||||
<el-option label="显示" :value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择是否启用" clearable @clear="onClear('showType')" v-model="searchData.status">
|
||||
<el-option label="启用" :value="true" />
|
||||
<el-option label="不启用" :value="false" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="onSearch" icon="el-icon-search" plain type="primary">搜索</el-button>
|
||||
<el-button @click="add" icon="el-icon-circle-plus-outline" plain type="success">新增</el-button>
|
||||
<el-button @click="setTag" icon="el-icon-edit-outline" plain type="warning">批量设置标签</el-button>
|
||||
<!-- <el-button @click="delTag" icon="el-icon-edit-outline" plain type="danger">批量删除标签</el-button> -->
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col>
|
||||
<el-table :data="resData" element-loading-text="拼命加载中" border height="700" highlight-current-row
|
||||
style="width: 100%" v-loading="loading" @selection-change="handleSelectionChange"
|
||||
:row-style="{ height: '70px' }">
|
||||
<el-table-column type="selection" width="50" fixed="left"> </el-table-column>
|
||||
<el-table-column align="center" label="ID" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.id }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="排序" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.rank }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="名称">
|
||||
<template slot-scope="scope">{{ scope.row.name }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否启用" width="80">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :type='scope.row.status ? "success" : "danger"'>{{ scope.row.status ? "已开启" :
|
||||
"已关闭" }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="封面" width="150">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width: 70px; height: 70px; margin: 0 auto" :urls="scope.row.cover">
|
||||
</ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="视频类型" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.contentType | changeContentType }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="观看次数" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.watchTimes }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="180">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="handleEdit(scope.$index, scope.row)" size="mini" type="primary">编辑</el-button>
|
||||
<el-button @click="handleDelete(scope.$index, scope.row)" size="mini" type="danger">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="table-pagination">
|
||||
<el-pagination :current-page="searchData.pageNum" :page-size="searchData.pageSize"
|
||||
:page-sizes="[10, 20, 30, 50, 100]" :total="total" @current-change="handleCurrentChange"
|
||||
@size-change="handleSizeChange" layout="total, sizes, prev, pager, next, jumper" />
|
||||
</div>
|
||||
<SetTag :data="selectBatch" v-if="setTagVisible" @close="closeEdit">
|
||||
</SetTag>
|
||||
<!-- 新增及编辑 -->
|
||||
<Edit :categoryId="searchData.categoryId" :data="editData" v-if="editVisible" @close="closeEdit" />
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="Visible = false"> 取 消 </el-button>
|
||||
<el-button type="primary" @click="submit('ruleForm')"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import Edit from './AddTag.vue'
|
||||
import SetTag from './setTag.vue'
|
||||
import ShowImg from '@/components/ShowImg'
|
||||
|
||||
import { mediatagList, mediatagDel } from '@/api/resourceManagement/video'
|
||||
import { contentTypeList } from '@/filters/mediaLibrary/videoList'
|
||||
|
||||
export default {
|
||||
name: 'TagList',
|
||||
props: ['data'],
|
||||
components: {
|
||||
Edit,
|
||||
ShowImg,
|
||||
SetTag
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
contentTypeList: contentTypeList(),
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
showType: undefined,
|
||||
contentType: undefined,
|
||||
name: undefined,
|
||||
status: undefined,
|
||||
categoryId: undefined
|
||||
},
|
||||
resData: [], // el-table表格数据
|
||||
editVisible: false, // 新增或编辑弹出框
|
||||
total: 0, // 数据总条数
|
||||
loading: true, // 列表加载状态
|
||||
// 编辑数据
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {}
|
||||
},
|
||||
mediatagCategory: [],
|
||||
selectBatch: [],
|
||||
setTagVisible: false,
|
||||
Visible: true,
|
||||
title: ''
|
||||
// 表单数据
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
async mounted() {
|
||||
this.searchData.categoryId = this.data.data.id
|
||||
await this.getList()
|
||||
},
|
||||
methods: {
|
||||
// TODO:请求视频标签列表数据
|
||||
getList() {
|
||||
this.loading = true
|
||||
mediatagList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.$message.success('请求列表失败')
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
|
||||
setTag() {
|
||||
this.setTagVisible = true
|
||||
},
|
||||
// delTag() {
|
||||
// this.$confirm('确认批量删除？').then(() => {
|
||||
// const data = []
|
||||
// this.selectBatch.forEach(item => {
|
||||
// data.push(item.id)
|
||||
// })
|
||||
// mediatagBatchDel({ ids: data }).then(res => {
|
||||
// if (res.code === 200) {
|
||||
// this.$message.success('删除标签成功')
|
||||
// } else {
|
||||
// this.$message.error('删除标签失败')
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
// },
|
||||
// 批量选择
|
||||
handleSelectionChange(val) {
|
||||
this.selectBatch = val
|
||||
},
|
||||
// TODO：删除视频标签列表数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
mediatagDel({ id: row.id }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.getList()
|
||||
this.$message.success('成功删除!')
|
||||
} else {
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
onSearch() {
|
||||
this.searchData.pageNum = 1
|
||||
this.searchData.pageSize = 10
|
||||
this.getList()
|
||||
},
|
||||
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getList()
|
||||
},
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getList()
|
||||
},
|
||||
|
||||
// 新增按钮
|
||||
add() {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {}
|
||||
}
|
||||
},
|
||||
// 编辑按钮
|
||||
handleEdit(index, row) {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row
|
||||
}
|
||||
},
|
||||
|
||||
// 关闭编辑弹窗
|
||||
closeEdit() {
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {}
|
||||
}
|
||||
this.editVisible = false
|
||||
this.setTagVisible = false
|
||||
this.getList()
|
||||
},
|
||||
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getList()
|
||||
},
|
||||
// 提交按钮
|
||||
submit(formName) {
|
||||
this.$emit('close')
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,189 @@
|
||||
<template>
|
||||
<div class="pf-warpper avlist">
|
||||
<el-row class="table-form">
|
||||
<el-form :inline="true" :model="searchData" class="form-inline" size="mini">
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入标签名称" clearable @clear="onClear('name')" v-model="searchData.name" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="onSearch" icon="el-icon-search" plain type="primary">搜索</el-button>
|
||||
<el-button @click="add" icon="el-icon-circle-plus-outline" plain type="success">新增</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col>
|
||||
<el-table
|
||||
:data="resData"
|
||||
element-loading-text="拼命加载中"
|
||||
border
|
||||
height="700"
|
||||
highlight-current-row
|
||||
v-loading="loading"
|
||||
:row-style="{ height: '70px' }">
|
||||
<el-table-column align="center" label="ID" >
|
||||
<template slot-scope="scope">{{ scope.row.id }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="名称">
|
||||
<template slot-scope="scope">{{ scope.row.name }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="视频标签分类所属位置">
|
||||
<template slot-scope="scope">{{ scope.row.location | changeVideoLocation }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="下辖标签">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="success" @click="showTagList(scope.$index,scope.row)" size="mini">标签列表</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="180">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="handleEdit(scope.$index, scope.row)" size="mini" type="primary">编辑</el-button>
|
||||
<el-button @click="handleDelete(scope.$index, scope.row)" size="mini" type="danger">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="table-pagination">
|
||||
<el-pagination
|
||||
:current-page="searchData.pageNum"
|
||||
:page-size="searchData.pageSize"
|
||||
:page-sizes="[10, 20, 30, 50, 100]"
|
||||
:total="total"
|
||||
@current-change="handleCurrentChange"
|
||||
@size-change="handleSizeChange"
|
||||
layout="total, sizes, prev, pager, next, jumper" />
|
||||
</div>
|
||||
<!-- 新增及编辑 -->
|
||||
<Edit :data="editData" v-if="editVisible" @close="closeEdit" />
|
||||
<TagList :data="editData" v-if="tagListVisible" @close="closeEdit"></TagList>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// 引入模块
|
||||
import Edit from './components/AddOrEdit'
|
||||
import TagList from './components/tagList'
|
||||
import { mediatagCategoryList, mediatagCategoryDel } from '@/api/resourceManagement/video'
|
||||
export default {
|
||||
name: 'VideoTagType',
|
||||
components: {
|
||||
Edit, TagList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
name: undefined
|
||||
},
|
||||
resData: [], // el-table表格数据
|
||||
editVisible: false, // 新增或编辑弹出框
|
||||
tagListVisible: false,
|
||||
total: 0, // 数据总条数
|
||||
loading: true, // 列表加载状态
|
||||
// 编辑数据
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {}
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
// TODO:请求视频标签分类列表
|
||||
getList() {
|
||||
this.loading = true
|
||||
mediatagCategoryList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.$message.success('请求列表失败')
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
|
||||
// TODO：删除视频标签列表数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
mediatagCategoryDel({ id: row.id }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.getList()
|
||||
this.$message.success('成功删除!')
|
||||
} else {
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
onSearch() {
|
||||
this.searchData.pageNum = 1
|
||||
this.searchData.pageSize = 10
|
||||
this.getList()
|
||||
},
|
||||
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getList()
|
||||
},
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getList()
|
||||
},
|
||||
|
||||
// 新增按钮
|
||||
add() {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {}
|
||||
}
|
||||
},
|
||||
// 编辑按钮
|
||||
handleEdit(index, row) {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row
|
||||
}
|
||||
},
|
||||
showTagList(index, row) {
|
||||
this.tagListVisible = true
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row
|
||||
}
|
||||
},
|
||||
|
||||
// 关闭编辑弹窗
|
||||
closeEdit() {
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {}
|
||||
}
|
||||
this.editVisible = false
|
||||
this.tagListVisible = false
|
||||
this.getList()
|
||||
},
|
||||
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user