fix:项目初始化
This commit is contained in:
ouyangxiu
@@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :rules="rules" :inline="true" :model="form" 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-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-input v-model="form.anotherName" placeholder="别名" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24">
|
||||
<el-form-item label="头像">
|
||||
<UploadImg @changeImgUrl="changeAvatarUrl" :img="form.avatar"></UploadImg>
|
||||
</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.recommentRank" placeholder="请输入排序" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24">
|
||||
<el-form-item label="是否推荐">
|
||||
<el-switch v-model="form.recomment" active-color="#13ce66" inactive-color="#ff4949"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24">
|
||||
<el-form-item label="是否启用">
|
||||
<el-switch v-model="form.status" active-color="#13ce66" inactive-color="#ff4949"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :lg="24" :md="24" :sm="24" :xl="24" :xs="24">
|
||||
<el-form-item label="详细描述">
|
||||
<el-input v-model="form.desc" placeholder="请输入详细描述" type="textarea" style="width: 420px" />
|
||||
</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 { actressAdd, actressUpdate } from '@/api/videoManagement/actressList'
|
||||
import UploadImg from '@/components/UploadImg/index'
|
||||
import { arryToString, stringToArry } from '@/filters/index'
|
||||
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data'],
|
||||
components: {
|
||||
UploadImg,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
avatar: undefined, // 头像
|
||||
desc: undefined,
|
||||
name: undefined, // 名称
|
||||
recommentRank: undefined, // 推荐排序
|
||||
status: true, // 是否启用
|
||||
anotherName: undefined, // 别名
|
||||
recomment: false
|
||||
},
|
||||
rules: {},
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
if (this.title === '编辑') {
|
||||
this.form = JSON.parse(JSON.stringify(this.data.data))
|
||||
this.form.anotherName = arryToString(this.data.data.anotherName)
|
||||
// this.form = { ...this.data.data, ...{} }
|
||||
// this.anotherName = arryToString(this.data.data.anotherName)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//TODO:新增女优列表数据
|
||||
add(data) {
|
||||
actressAdd(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//TODO：编辑女优列表数据
|
||||
update(data) {
|
||||
actressUpdate(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
})
|
||||
},
|
||||
changeAvatarUrl(data) {
|
||||
this.form.avatar = data
|
||||
},
|
||||
// 提交按钮
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
let param = JSON.parse(JSON.stringify(this.form))
|
||||
param.anotherName = stringToArry(param.anotherName)
|
||||
if (this.title === '新增') {
|
||||
this.add(param)
|
||||
} else if (this.title === '编辑') {
|
||||
const data = {
|
||||
id: this.data.data.id,
|
||||
param: param,
|
||||
}
|
||||
this.update(data)
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,244 @@
|
||||
<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.number="searchData.name" @clear="onClear('name')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入女优别名" clearable v-model.number="searchData.anotherName" @clear="onClear('anotherName')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="排序方式" clearable v-model="searchData.sortType" @clear="onClear('sortType')">
|
||||
<el-option label="推荐" :value="1" />
|
||||
<el-option label="影片数量" :value="2" />
|
||||
<el-option label="入库时间 " :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="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="750" highlight-current-row style="width: 100%" 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="别名" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :key="index + 'tagData'" style="margin: 2px" v-for="(item, index) in scope.row.anotherName" size="mini">
|
||||
{{ item }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="影片数量">
|
||||
<template slot-scope="scope">{{ scope.row.movieCount }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="观看次数">
|
||||
<template slot-scope="scope">{{ scope.row.watchCount }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="收藏次数">
|
||||
<template slot-scope="scope">{{ scope.row.likeCount }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="推荐排序">
|
||||
<template slot-scope="scope">{{ scope.row.recommentRank }}</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.avatar"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="详细描述" width="350">
|
||||
<template slot-scope="scope">{{ scope.row.desc }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否推荐" width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-button :type="scope.row.recomment ? 'success' : 'danger'" plain size="mini">{{ scope.row.recomment ? '推荐' : '不推荐' }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否启用" width="100">
|
||||
<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="300">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="showMediaList(scope.$index, scope.row)" size="mini" type="primary">查看视频列表
|
||||
</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="editVisible" @close="closeEdit" />
|
||||
<MediaList :data="editData" v-if="mediaListVisible" @close="closeEdit" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// 引入模块
|
||||
import Edit from './components/AddOrEdit'
|
||||
import MediaList from '@/views/videoManagement/topic/components/mediaList'
|
||||
import { actressDel, actressSearch } from '@/api/videoManagement/actressList'
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
|
||||
export default {
|
||||
name: 'ActressList',
|
||||
components: {
|
||||
Edit,
|
||||
ShowImg,
|
||||
MediaList,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
anotherName: undefined, // 别名
|
||||
id: undefined, // 女优ID
|
||||
name: undefined, // 名称
|
||||
sortType: undefined,
|
||||
},
|
||||
resData: [], // el-table表格数据
|
||||
editVisible: false, // 新增或编辑弹出框
|
||||
mediaListVisible: false,
|
||||
total: 0, // 数据总条数
|
||||
loading: true, // 列表加载状态
|
||||
// 编辑数据
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {},
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.onSearch()
|
||||
},
|
||||
methods: {
|
||||
//TODO:请求女友列表数据
|
||||
getDatingReportList() {
|
||||
this.loading = true
|
||||
actressSearch(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.$message.error('请求列表失败!')
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
}
|
||||
})
|
||||
this.loading = false
|
||||
},
|
||||
|
||||
//TODO：删除女友列表数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}).then(() => {
|
||||
actressDel({ id: row.id }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.getDatingReportList()
|
||||
this.$message.success('成功删除!')
|
||||
} else {
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
onSearch() {
|
||||
this.searchData.pageNum = 1
|
||||
this.searchData.pageSize = 10
|
||||
this.getDatingReportList()
|
||||
},
|
||||
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getDatingReportList()
|
||||
},
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getDatingReportList()
|
||||
},
|
||||
|
||||
// 新增按钮
|
||||
add() {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {},
|
||||
}
|
||||
},
|
||||
// 编辑按钮
|
||||
handleEdit(index, row) {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row,
|
||||
}
|
||||
},
|
||||
// 查看视频列表
|
||||
showMediaList(index, row) {
|
||||
this.mediaListVisible = true
|
||||
this.editData = {
|
||||
title: '视频列表',
|
||||
type: 1,
|
||||
data: row,
|
||||
}
|
||||
},
|
||||
|
||||
// 关闭编辑弹窗
|
||||
closeEdit() {
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {},
|
||||
}
|
||||
this.editVisible = false
|
||||
this.mediaListVisible = false
|
||||
this.getDatingReportList()
|
||||
},
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getDatingReportList()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,216 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :rules="rules" :inline="true" :model="form" 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="用户ID">
|
||||
<el-input v-model.number="form.userId" placeholder="请输入名称" />
|
||||
</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-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="视频合集分类">
|
||||
<el-select style="width: 163px" placeholder="请选择视频合集分类" v-model="form.collectionCategory" filterable>
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in mediacollectcategoryListData" />
|
||||
</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 v-model.number="form.likes" placeholder="请输入点赞数" />
|
||||
</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.sells" placeholder="请输入售卖数" />
|
||||
</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.watches" placeholder="请输入观看数" />
|
||||
</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.name" placeholder="请输入合集名称" style="width:500px" />
|
||||
</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-input v-model="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-input v-model.number="form.rank" placeholder="请输入排序" />
|
||||
</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="请选择视频所属位置" 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-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="视频类型">
|
||||
<el-select v-model="form.contentType" placeholder="请选择视频类型" style="width:163px">
|
||||
<el-option v-for="item in contentTypeList" :key="item.value" :label="item.label" :value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24">
|
||||
<el-form-item label="是否启用">
|
||||
<el-switch v-model="form.status" active-color="#13ce66" inactive-color="#ff4949"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24">
|
||||
<el-form-item label="封面图">
|
||||
<UploadImg @changeImgUrl="changeImageUrl('avatar',$event)" @onRemove="handleRemove('avatar')" :img="form.avatar"></UploadImg>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="24">
|
||||
<el-form-item label="背景图">
|
||||
<UploadImg @changeImgUrl="changeImageUrl('background',$event)" @onRemove="handleRemove('background')" :img="form.background"></UploadImg>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :lg="24" :md="24" :sm="24" :xl="24" :xs="24">
|
||||
<el-form-item label="详细描述">
|
||||
<el-input v-model="form.desc" placeholder="请输入详细描述" type="textarea" style="width: 420px" />
|
||||
</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 {
|
||||
mediacollAdd,
|
||||
mediacollUpdate,
|
||||
} from '@/api/videoManagement/collectionList'
|
||||
import UploadImg from '@/components/UploadImg/index'
|
||||
import { changeMoneyYuan, changeMoneyFen } from '@/filters/index'
|
||||
import { contentTypeList,videoLocationList } from '@/filters/mediaLibrary/videoList'
|
||||
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data', 'circleList','mediacollectcategoryListData'],
|
||||
components: {
|
||||
UploadImg,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
contentTypeList: contentTypeList(),
|
||||
videoLocationList:videoLocationList(),
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
avatar: undefined,
|
||||
collectionCategory:undefined, // 视频合集分类
|
||||
background: undefined,
|
||||
circleId: undefined,
|
||||
desc: undefined,
|
||||
name: undefined, // 名称
|
||||
userId: undefined,
|
||||
price: undefined,
|
||||
status: true, // 是否启用
|
||||
rank: undefined,
|
||||
contentType: undefined,
|
||||
location:undefined,
|
||||
likes: undefined,
|
||||
sells: undefined,
|
||||
watches: undefined,
|
||||
},
|
||||
rules: {},
|
||||
showVideoList: false,
|
||||
videoArr: [],
|
||||
choseVideoArr: [],
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
if (this.title === '编辑') {
|
||||
this.form = { ...this.data.data }
|
||||
this.form.price = changeMoneyYuan(this.form.price)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// TODO:新增合集列表数据
|
||||
add(data) {
|
||||
mediacollAdd(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功')
|
||||
this.close()
|
||||
} else {
|
||||
this.$message.error('新增失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO：编辑合集列表数据
|
||||
update(data) {
|
||||
mediacollUpdate(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.close()
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
changeImageUrl(key, data) {
|
||||
this.form[key] = data
|
||||
},
|
||||
handleRemove(key){
|
||||
this.form[key] = undefined
|
||||
},
|
||||
// 提交按钮
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
let param = JSON.parse(JSON.stringify(this.form))
|
||||
param.price = changeMoneyFen(this.form.price)
|
||||
if (this.title === '新增') {
|
||||
this.add(param)
|
||||
} else if (this.title === '编辑') {
|
||||
this.update(param)
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,208 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2021-11-30 10:57:29
|
||||
* @LastEditTime: 2022-05-28 16:41:58
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @FilePath: /web_admin/src/views/videoManagement/collectionList/components/AddvideoList.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog append-to-body title="将视频添加到集合中" :visible.sync="visible" width="1000px" :before-close="handleClose" class='spec-dialog'>
|
||||
<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.userId" @clear="onClear('userId')" />
|
||||
</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.priceType" @clear="onClear('priceType')">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in MediaPayTypeList" />
|
||||
</el-select>
|
||||
</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')">
|
||||
<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.location" @clear="onClear('location')">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in videoLocationList" />
|
||||
</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-button @click="onSearch" icon="el-icon-search" plain type="primary">搜索</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
</el-row>
|
||||
<div class="list_content">
|
||||
<div class="list_content_video" v-for="item in videoArr" :key="item.id" @click="choseVideo($event,item)">
|
||||
<ShowImg style="width:100%;height:110px" :urls="item.coverImg"></ShowImg>
|
||||
<div class="videoTitle">{{item.title}}</div>
|
||||
<div class="videoMask display">
|
||||
<img src="@/assets/select.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleClose">取 消</el-button>
|
||||
<el-button type="primary" @click="handleClose(true)">操作完毕</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
mediacollAddmediaList,
|
||||
mediacollMediaDel,
|
||||
mediacollMediaAdd
|
||||
} from '@/api/videoManagement/collectionList'
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
import { contentTypeList, videoLocationList } from '@/filters/mediaLibrary/videoList'
|
||||
|
||||
import { rankSo, MediaPayTypeList, MediaSatusList } from '@/filters/videoManagement/videoList'
|
||||
export default {
|
||||
name: 'AddVideoDialog',
|
||||
props: ['userId', 'collId'],
|
||||
components: {
|
||||
ShowImg
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visible: true,
|
||||
contentTypeList:contentTypeList(),
|
||||
videoLocationList:videoLocationList(),
|
||||
rankSo:rankSo(),
|
||||
MediaPayTypeList:MediaPayTypeList(),
|
||||
MediaSatusList:MediaSatusList(),
|
||||
searchData: {
|
||||
mediaId: undefined,
|
||||
title: undefined,
|
||||
userId: undefined,
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
contentType: undefined, // 格式类型 1:AV 2:小视频 3:动漫
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
priceType: undefined, // 0,收费状态
|
||||
publishId: undefined, // 发布者id
|
||||
status: undefined, // 0,视频状态
|
||||
sort: undefined, // "string",媒体状态 operatAt(编辑时间)/addedTime(上架时间)/createdAt(创建时间)/updatedAt(更新时间)
|
||||
title: undefined, // "string",标题
|
||||
tagId: undefined,
|
||||
topicId: undefined,
|
||||
location:undefined
|
||||
},
|
||||
videoArr: ''
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.searchData.userId = this.userId
|
||||
this.searchData.collId = this.collId
|
||||
this.getMediacollAddmediaList()
|
||||
},
|
||||
methods: {
|
||||
// TODO：请求可加入集合的视频列表
|
||||
getMediacollAddmediaList() {
|
||||
|
||||
mediacollAddmediaList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.videoArr = res.data.list
|
||||
}
|
||||
})
|
||||
},
|
||||
onSearch() {
|
||||
this.getMediacollAddmediaList()
|
||||
},
|
||||
// TODO:选择视频时，改样式和赋值（event点击的dom,val点击的视频数据）
|
||||
choseVideo(event, val) {
|
||||
if (event.currentTarget.children[2].className === 'videoMask display') {
|
||||
event.currentTarget.children[2].className = 'videoMask'
|
||||
const param = {
|
||||
collId: Number(this.searchData.collId),
|
||||
mediaId: val.id
|
||||
}
|
||||
mediacollMediaAdd(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('视频添加成功')
|
||||
}
|
||||
})
|
||||
} else {
|
||||
event.currentTarget.children[2].className = 'videoMask display'
|
||||
const param = {
|
||||
collId: Number(this.searchData.collId),
|
||||
mediaId: val.id
|
||||
}
|
||||
mediacollMediaDel(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('视频移除成功')
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
// 关闭窗口时调用
|
||||
handleClose(flog) {
|
||||
if (flog === true) {
|
||||
// 这个是判断取消还是添加视频
|
||||
this.$emit('close', this.choseVideoId)
|
||||
} else {
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang='scss' scoped>
|
||||
.list_content {
|
||||
width: 100%;
|
||||
height: 600px;
|
||||
overflow-y: auto;
|
||||
.list_content_video {
|
||||
float: left;
|
||||
width: 208px;
|
||||
height: 150px;
|
||||
margin: 10px;
|
||||
position: relative;
|
||||
.videoTitle {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
line-height: auto;
|
||||
text-align: center;
|
||||
background-color: rgb(212, 212, 212);
|
||||
}
|
||||
.display {
|
||||
display: none;
|
||||
}
|
||||
.videoMask {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
background-color: #000;
|
||||
opacity: 0.5;
|
||||
img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin: 65px 94px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,132 @@
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog title="视频列表" :visible.sync="Visible" width="90%" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-button type="info" style="margin:0 0 0px 0px" @click="addVideo">添加视频</el-button>
|
||||
<el-row>
|
||||
<el-col>
|
||||
<el-table :data="resData" border height="600px" style="width: 100%" highlight-current-row>
|
||||
<el-table-column align="center" label="视频Id" width="100px">
|
||||
<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.title }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="视频封面" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width:70px;height:40px;margin:0 auto" :urls="scope.row.coverImg"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="详细描述" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.desc }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="200" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="delMedia(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>
|
||||
<VideoList v-if="showAddVideo" @close='closeEdit' :userId='userId' :collId='searchData.id' />
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
import {
|
||||
mediacollMediaList,
|
||||
mediacollMediaDel
|
||||
} from '@/api/videoManagement/collectionList'
|
||||
import VideoList from './AddvideoList.vue'
|
||||
export default {
|
||||
name: 'ChannelRuleList',
|
||||
props: ['data'],
|
||||
components: {
|
||||
ShowImg,
|
||||
VideoList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
userId: undefined,
|
||||
// 表单数据
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
id: undefined
|
||||
},
|
||||
showAddVideo: false,
|
||||
rules: {},
|
||||
resData: [],
|
||||
total: 0
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.searchData.id = this.data.data.id
|
||||
this.userId = this.data.data.userId
|
||||
this.getMediacollMediaList()
|
||||
},
|
||||
methods: {
|
||||
// TODO:请求合集视频列表数据
|
||||
getMediacollMediaList() {
|
||||
mediacollMediaList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.$message.error('请求视频列表失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:删除合集视频列表数据
|
||||
delMedia(index, row) {
|
||||
const param = {
|
||||
mediaId: row.id,
|
||||
collId: this.searchData.id
|
||||
}
|
||||
mediacollMediaDel(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('删除成功')
|
||||
} else {
|
||||
this.$message.error('删除失败')
|
||||
}
|
||||
this.getMediacollMediaList()
|
||||
})
|
||||
},
|
||||
// 添加视频按钮
|
||||
addVideo() {
|
||||
this.showAddVideo = true
|
||||
},
|
||||
// 关闭添加视频弹窗
|
||||
closeEdit() {
|
||||
this.showAddVideo = false
|
||||
this.getMediacollMediaList()
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getMediacollMediaList()
|
||||
},
|
||||
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getMediacollMediaList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,305 @@
|
||||
|
||||
<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="searchData.name" @clear="onClear('name')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入用户ID" clearable v-model.number="searchData.userId" @clear="onClear('userId')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择内容类型" clearable v-model="searchData.objectType" @clear="onClear('objectType')">
|
||||
<el-option v-for="item in contentTypeList" :key="item.label+item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</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-input placeholder="请输入圈子ID" clearable v-model.number="searchData.circleId" @clear="onClear('circleId')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择视频所属位置" clearable v-model="searchData.location" @clear="onClear('location')">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in locationList" />
|
||||
</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-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" :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="用户ID">
|
||||
<template slot-scope="scope">{{ scope.row.userId }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="圈子">
|
||||
<template slot-scope="scope">{{ scope.row.circleId }}</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 | changeLocation}}</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.avatar"></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.background"></ShowImg>
|
||||
</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.price | changeMoneyYuan }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="影片数量">
|
||||
<template slot-scope="scope">{{ scope.row.count }}</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">{{ scope.row.sells }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="观看次数">
|
||||
<template slot-scope="scope">{{ scope.row.watches }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="点赞次数">
|
||||
<template slot-scope="scope">{{ scope.row.likes }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否启用" width="100">
|
||||
<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="350">
|
||||
<template slot-scope="scope">{{ scope.row.desc }}</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="300">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="showMediaList(scope.$index, scope.row)" size="mini" type="primary">查看视频列表</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 :mediacollectcategoryListData="mediacollectcategoryListData" :circleList="circleList" :data="editData" v-if="editVisible" @close="closeEdit" />
|
||||
<MediaList :data="editData" v-if="mediaListVisible" @close="closeEdit" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// 引入模块
|
||||
import Edit from './components/AddOrEdit'
|
||||
import MediaList from './components/mediaList'
|
||||
import {
|
||||
mediacollDel,
|
||||
mediacollList,
|
||||
} from '@/api/videoManagement/collectionList'
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
import { contentTypeList,locationList } from '@/filters/mediaLibrary/videoList'
|
||||
import { circleListSearch } from '@/api/user/circleList'
|
||||
import {
|
||||
mediacollectcategoryList
|
||||
|
||||
} from '@/api/videoManagement/videoCollectCategory'
|
||||
export default {
|
||||
name: 'CollectionList',
|
||||
components: {
|
||||
Edit,
|
||||
ShowImg,
|
||||
MediaList,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
contentTypeList: contentTypeList(),
|
||||
locationList:locationList(),
|
||||
mediacollectcategoryListData:[],
|
||||
circleList:[],
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
circleId: undefined,
|
||||
id: undefined,
|
||||
name: undefined,
|
||||
objectType: undefined,
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
status: undefined,
|
||||
userId: undefined,
|
||||
},
|
||||
resData: [], // el-table表格数据
|
||||
editVisible: false, // 新增或编辑弹出框
|
||||
mediaListVisible: false,
|
||||
total: 0, // 数据总条数
|
||||
loading: true, // 列表加载状态
|
||||
// 编辑数据
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {},
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
// this.getMediacollectcategoryList()
|
||||
this.getCircleListSearch()
|
||||
this.onSearch()
|
||||
},
|
||||
methods: {
|
||||
// TODO:请求视频合集分类列表数据
|
||||
// getMediacollectcategoryList() {
|
||||
// mediacollectcategoryList({
|
||||
// pageSize:500,
|
||||
// pageNum:1
|
||||
// }).then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// this.mediacollectcategoryListData = res.data.list
|
||||
// } else {
|
||||
// this.$message.error('请求列表失败!')
|
||||
// this.mediacollectcategoryListData = []
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
// TODO:请求圈子列表数据
|
||||
getCircleListSearch() {
|
||||
circleListSearch({ pageNum: 1, pageSize: 5000 }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.circleList = res.data.list
|
||||
} else {
|
||||
this.$message.error('请求圈子列表失败!')
|
||||
this.circleList = []
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO：请求合集列表数据
|
||||
getMediacollList() {
|
||||
this.loading = true
|
||||
mediacollList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.$message.error('请求列表失败')
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
// TODO:删除合集列表数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}).then(() => {
|
||||
mediacollDel({ id: row.id }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.getMediacollList()
|
||||
this.$message.success('成功删除')
|
||||
} else {
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
onSearch() {
|
||||
this.searchData.pageNum = 1
|
||||
this.searchData.pageSize = 10
|
||||
this.getMediacollList()
|
||||
},
|
||||
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getMediacollList()
|
||||
},
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getMediacollList()
|
||||
},
|
||||
|
||||
// 新增按钮
|
||||
add() {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {},
|
||||
}
|
||||
},
|
||||
// 编辑按钮
|
||||
handleEdit(index, row) {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row,
|
||||
}
|
||||
},
|
||||
|
||||
// 查看视频列表
|
||||
showMediaList(index, row) {
|
||||
this.mediaListVisible = true
|
||||
this.editData = {
|
||||
title: '视频列表',
|
||||
type: 2,
|
||||
data: row,
|
||||
}
|
||||
},
|
||||
|
||||
// 关闭编辑弹窗
|
||||
closeEdit() {
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {},
|
||||
}
|
||||
this.editVisible = false
|
||||
this.mediaListVisible = false
|
||||
this.getMediacollList()
|
||||
},
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getMediacollList()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,103 @@
|
||||
<!--
|
||||
* @Date: 2023-11-23 17:57:59
|
||||
* @LastEditors: Administrator admin@example.com
|
||||
* @LastEditTime: 2024-10-15 14:39:18
|
||||
* @FilePath: /md-admin/src/views/postManagement/commentLib/components/AddOrEdit.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 :lg="24" :md="24" :sm="24" :xl="24" :xs="24">
|
||||
<el-form-item label="评论内容">
|
||||
<el-input v-model="form.content" placeholder="请输入评论内容" type="textarea" style="width: 420px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="快捷评论开关">
|
||||
<el-switch v-model="form.quickReply" 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('ruleForm')"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
commentLibAdd,
|
||||
commentLibUpdate
|
||||
} from '@/api/videoManagement/commentLib'
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
content: undefined
|
||||
},
|
||||
rules: {}
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
if (this.title === '编辑') {
|
||||
this.form = { ...this.data.data, ...{}}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// TODO：新增评论库数据
|
||||
add(data) {
|
||||
commentLibAdd(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('新增失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:编辑评论库数据
|
||||
update(data) {
|
||||
commentLibUpdate(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,
|
||||
content: this.form.content,
|
||||
quickReply: this.form.quickReply
|
||||
}
|
||||
this.update(data)
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,170 @@
|
||||
|
||||
<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 v-model="searchData.key" @clear="onClear('key')" />
|
||||
</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="onSearch" 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" :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.content }}</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="200">
|
||||
<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 {
|
||||
commentLibSearch,
|
||||
commentLibDel
|
||||
} from '@/api/videoManagement/commentLib'
|
||||
export default {
|
||||
name: 'CommentLib',
|
||||
components: {
|
||||
Edit
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
key: undefined
|
||||
},
|
||||
resData: [], // el-table表格数据
|
||||
editVisible: false, // 新增或编辑弹出框
|
||||
total: 0, // 数据总条数
|
||||
loading: true, // 列表加载状态
|
||||
// 编辑数据
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.onSearch()
|
||||
},
|
||||
methods: {
|
||||
// TODO:请求评论库数据
|
||||
getList() {
|
||||
this.loading = true
|
||||
// 过滤参数
|
||||
commentLibSearch(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.$message.error('请求列表失败!')
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
// TODO:删除评论库数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
commentLibDel({ 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.getList()
|
||||
},
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,154 @@
|
||||
<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" v-if="title === '回复消息'">
|
||||
<el-col :lg="24" :md="24" :sm="24" :xl="24" :xs="24">
|
||||
<el-form-item label="用户ID">
|
||||
<el-input v-model="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-row :gutter="24" v-if="title === '添加评论'">
|
||||
<el-col :lg="24" :md="24" :sm="24" :xl="24" :xs="24">
|
||||
<el-form-item label="用户ID">
|
||||
<el-input v-model="form.userId" placeholder="请输入用户ID" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24" v-if="title === '添加评论'">
|
||||
<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-row :gutter="24" v-if="title === '批量添加评论'">
|
||||
<el-col :lg="24" :md="24" :sm="24" :xl="24" :xs="24">
|
||||
<el-form-item label="添加评论数">
|
||||
<el-input v-model.number="form.total" placeholder="请输入添加评论数" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="24" :md="24" :sm="24" :xl="24" :xs="24">
|
||||
<el-form-item label="对象类型">
|
||||
<el-select placeholder="请选择对象类型" size="mini" v-model="form.objectype" disabled>
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in commentManageTypelList" />
|
||||
</el-select>
|
||||
</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 { commentReply } from '@/api/videoManagement/commentManage'
|
||||
import { commentLibSelect } from '@/api/videoManagement/commentLib'
|
||||
import { commentManageTypelList } from '@/filters/videoManagement/commentManage'
|
||||
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
commentManageTypelList: commentManageTypelList(),
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
objectId: undefined, // 对象id
|
||||
parentsId: undefined, // 评论id
|
||||
replyId: undefined, // 回复ID
|
||||
text: undefined, // 评论内容
|
||||
userId: undefined, // 用户id
|
||||
total: undefined,
|
||||
objectType: undefined,
|
||||
},
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
this.form = { ...this.data.data }
|
||||
this.formData = Object.assign({}, this.form)
|
||||
if (this.title === '回复消息') {
|
||||
this.form.userId = 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//TODO:添加批量评论
|
||||
commentLibSelectFun(data) {
|
||||
commentLibSelect(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//TODO:添加评论/回复
|
||||
commentReplyFun(data) {
|
||||
commentReply(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('回复成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('回复失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 提交
|
||||
submit(formName) {
|
||||
if (this.title === '批量添加评论') {
|
||||
const data = {
|
||||
objectId: this.form.objectId,
|
||||
objectype: this.form.objectype,
|
||||
total: this.form.total,
|
||||
}
|
||||
this.commentLibSelectFun(data)
|
||||
} else {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.title === '添加评论') {
|
||||
this.form.objectId = this.form.objectId
|
||||
? Number(this.form.objectId)
|
||||
: 0
|
||||
this.form.userId = this.form.userId ? Number(this.form.userId) : 0
|
||||
this.form.parentsId = this.form.parentsId
|
||||
? Number(this.form.parentsId)
|
||||
: 0
|
||||
this.form.replyId = this.form.replyId
|
||||
? Number(this.form.replyId)
|
||||
: 0
|
||||
} else if (this.title === '回复消息') {
|
||||
if (this.form.parentsId === 0) {
|
||||
this.form.parentsId = Number(this.data.data.id)
|
||||
} else {
|
||||
this.form.parentsId = Number(this.form.parentsId)
|
||||
}
|
||||
this.form.replyId = Number(this.data.data.id)
|
||||
this.form.userId = Number(this.form.userId)
|
||||
}
|
||||
}
|
||||
})
|
||||
this.commentReplyFun(this.form)
|
||||
}
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close', false)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,97 @@
|
||||
<template>
|
||||
<el-dialog :close-on-click-modal="false" :title="title" :visible.sync="Visible" @close="close" center class="ac-dialog" width="350px">
|
||||
<el-form :inline="true" :model="form" class="demo-form-inline" label-position="right" label-width="100px" ref="form">
|
||||
<el-row :gutter="24">
|
||||
<el-form-item label="审核状态" prop="reviewStatus">
|
||||
<el-select
|
||||
placeholder="请选择审核状态"
|
||||
clearable
|
||||
v-model="form.reviewStatus"
|
||||
style="width: 180px"
|
||||
>
|
||||
<el-option label="未审核" :value="0" />
|
||||
<el-option label="审核通过" :value="1" />
|
||||
<el-option label="审核拒绝" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</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 { commentReview, commentReviewBatch } from '@/api/videoManagement/commentManage'
|
||||
export default {
|
||||
name: 'EditScore',
|
||||
props: ['data'],
|
||||
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '审核列表',
|
||||
// 表单数据
|
||||
form: {
|
||||
reviewStatus: undefined,
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
console.log(this.data,"datadatadata")
|
||||
this.title = this.data.title
|
||||
if(this.title !== '批量审核'){
|
||||
this.form = { ...this.data.data }
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// TODO:更新评分
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
if(this.data.title === '批量审核'){
|
||||
let id = []
|
||||
for (let index = 0; index < this.data.data.length; index++) {
|
||||
const element = this.data.data[index];
|
||||
id.push(element.id)
|
||||
}
|
||||
console.log(id,"ididididid")
|
||||
const data = {
|
||||
ids: id,
|
||||
reviewStatus: this.form.reviewStatus
|
||||
}
|
||||
commentReviewBatch(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
}else{
|
||||
const data = {
|
||||
id: this.data.data.id,
|
||||
reviewStatus: this.form.reviewStatus
|
||||
}
|
||||
commentReview(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close', false)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,75 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-03-25 19:35:37
|
||||
* @LastEditTime: 2022-05-28 11:56:53
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @FilePath: /web_admin/src/views/videoManagement/commentManage/components/toTop.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="置顶排序">
|
||||
<el-input v-model.number="form.topRank" />
|
||||
</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 { commentUpdate } from '@/api/videoManagement/commentManage'
|
||||
export default {
|
||||
name: 'ToTop',
|
||||
props: ['data'],
|
||||
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
id: undefined,
|
||||
topRank: undefined
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
this.form = {...this.data.data}
|
||||
|
||||
},
|
||||
methods: {
|
||||
// TODO:用户评论置顶
|
||||
submit(formName) {
|
||||
const param = {
|
||||
id: this.form.id,
|
||||
param: {
|
||||
topRank: this.form.topRank
|
||||
}
|
||||
}
|
||||
commentUpdate(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('设置置顶成功')
|
||||
this.$emit('close', false)
|
||||
} else {
|
||||
this.$message.error('设置置顶失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close', false)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,383 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-row>
|
||||
<el-form :inline="true" :model="searchData" label-width="80px" size="mini">
|
||||
<el-form-item>
|
||||
<el-input @clear="clear('userId')" clearable placeholder="请输入用户ID" v-model.number="searchData.userId" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input @clear="clear('userName')" clearable placeholder="请输入用户名称" v-model="searchData.userName" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input @clear="clear('commentCount')" clearable placeholder="请输入回复人数" v-model.number="searchData.commentCount" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select @clear="clear('level')" clearable placeholder="请选择评论级别" v-model="searchData.level">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in commentManageLevelList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input @clear="clear('objectId')" clearable placeholder="请输入对象ID" v-model.number="searchData.objectId" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select @clear="clear('objectType')" clearable placeholder="请选择评论类型" v-model="searchData.objectType">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in objectTypeList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input @clear="clear('text')" clearable placeholder="请输入评论内容" v-model="searchData.text" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select @clear="clear('reviewStatus')" clearable placeholder="选择审核状态" v-model="searchData.reviewStatus">
|
||||
<el-option label="未审核" :value="0" />
|
||||
<el-option label="审核通过" :value="1" />
|
||||
<el-option label="审核拒绝" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item class="search">
|
||||
<el-button @click="onSearch" icon="el-icon-search" plain type="primary">搜索</el-button>
|
||||
<el-button @click="onAddComment" icon="el-icon-circle-plus-outline" plain type="success">添加评论</el-button>
|
||||
<el-button @click="batchReview" 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="commentData"
|
||||
element-loading-text="拼命加载中"
|
||||
border
|
||||
height="760"
|
||||
highlight-current-row
|
||||
style="width: 100%"
|
||||
v-loading="loading"
|
||||
:row-style="{ height: '80px' }"
|
||||
@selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="50"> </el-table-column>
|
||||
<el-table-column align="center" label="ID" width="100">
|
||||
<template slot-scope="scope">{{ scope.row.id }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="用户ID" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.userId }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="用户名称" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.userName }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="用户头像" width="100">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width: 50px; height: 50px; margin: 0 auto" :urls="scope.row.userAvatar"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="图像" width="140">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width: 80px; height: 50px; margin: 0 auto" :urls="scope.row.imageUrls"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="评论级别" width="100">
|
||||
<template slot-scope="scope">{{ scope.row.level | changeCommentManageLevel }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="评论类型" width="100">
|
||||
<template slot-scope="scope">{{ scope.row.objectType | changeObjectType }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="评论内容" width="300">
|
||||
<template slot-scope="scope">{{ scope.row.text }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="状态" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.status | changeCommentStatus }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="对象ID" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.objectId }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="上级评论ID" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.parentsId }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="被评论消息ID" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.replyId }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="被评论用户名称" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.replyUserName }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="回复人数" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.commentCount }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="用户会员级别" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.vipType | changevipType }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="审核状态" width="120">
|
||||
<template slot-scope="scope">
|
||||
<el-button :type="scope.row.reviewStatus == 0 ? 'warning' : scope.row.reviewStatus == 1 ? 'success' : 'danger'" plain size="mini">{{ scope.row.reviewStatus | reviewType }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="创建时间" width="160">
|
||||
<template slot-scope="scope">{{ scope.row.createdAt | BeiJingTime }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="更新时间" width="160">
|
||||
<template slot-scope="scope">{{ scope.row.updatedAt | BeiJingTime }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="500">
|
||||
<template slot-scope="scope">
|
||||
<el-button v-if="scope.row.status === 1" @click="unbanUser(scope.row, 'status')" size="mini" type="success">解封</el-button>
|
||||
<el-button v-else @click="banUser(scope.row, 'status')" size="mini" type="danger">封禁</el-button>
|
||||
<el-button @click="review(scope.$index, scope.row)" size="mini" type="success">审核</el-button>
|
||||
<el-button v-if="scope.row.status !== 2" @click="changeStatus(scope.row, 'status')" size="mini" type="warning">禁言</el-button>
|
||||
<el-button v-if="scope.row.status === 2" @click="changeStatus(scope.row, 'status')" size="mini" type="success">解除禁言</el-button>
|
||||
<el-button @click="toTop(scope.row, 'status')" size="mini" type="primary">置顶 </el-button>
|
||||
<el-button @click="addToCommentLib(scope.$index, scope.row)">加入评论库</el-button>
|
||||
<el-button @click="reply(scope.$index, scope.row)" size="mini" type="success">回复</el-button>
|
||||
<el-button @click="delet(scope.$index, scope.row)" size="mini" type="danger">删除</el-button>
|
||||
<el-button @click="deletAll(scope.$index, scope.row)" size="mini" type="info">删除该用户所有评论</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" />
|
||||
<BanUser :data="editData" v-if="banUserVisible" @close="closeEdit"></BanUser>
|
||||
<Review :data="editData" v-if="revieweVisible" @close="closeEdit" />
|
||||
<ToTop :data="editData" v-if="toTopVisible" @close="closeEdit" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { commentList, commentDelete, commentDeluser } from '@/api/videoManagement/commentManage'
|
||||
import { userUnBan, userUpdate } from '@/api/user/userList'
|
||||
import { commentManageLevelList, objectTypeList } from '@/filters/videoManagement/commentManage'
|
||||
import Edit from './components/AddOrEdit'
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
import BanUser from '../../user/userList/components/banUser'
|
||||
import Review from './components/review'
|
||||
import ToTop from './components/toTop.vue'
|
||||
import { commentLibAdd } from '@/api/videoManagement/commentLib'
|
||||
export default {
|
||||
name: 'CommentManage',
|
||||
components: {
|
||||
Edit,
|
||||
ShowImg,
|
||||
BanUser,
|
||||
Review,
|
||||
ToTop
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
commentManageLevelList: commentManageLevelList(),
|
||||
objectTypeList: objectTypeList(),
|
||||
// 列表加载状态
|
||||
loading: true,
|
||||
toTopVisible: false,
|
||||
// 请求或搜索数据参数
|
||||
searchData: {
|
||||
userId: undefined, // 用户ID
|
||||
userName: undefined, // 用户昵称
|
||||
commentCount: undefined, // 回复人数
|
||||
level: undefined, // 评论级别
|
||||
// postId: undefined, //帖子ID
|
||||
text: undefined, // 评论内容
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
objectId: undefined, // 对象ID
|
||||
objectType: undefined // 评论类型
|
||||
},
|
||||
|
||||
// 用户列表数据
|
||||
commentData: [],
|
||||
// 数据总条数
|
||||
total: 0,
|
||||
|
||||
// 编辑数据
|
||||
editData: {},
|
||||
// 新增或编辑弹出框
|
||||
editVisible: false,
|
||||
// 封禁用户弹窗
|
||||
banUserVisible: false,
|
||||
revieweVisible: false,
|
||||
selectBatch: []
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.getcommentData()
|
||||
},
|
||||
methods: {
|
||||
toTop(row) {
|
||||
this.toTopVisible = true
|
||||
this.editData = {
|
||||
title: '置顶消息',
|
||||
data: row
|
||||
}
|
||||
},
|
||||
// 审核
|
||||
review(index, row) {
|
||||
this.revieweVisible = true
|
||||
this.editData = {
|
||||
title: '审核',
|
||||
data: row
|
||||
}
|
||||
},
|
||||
// 批量审核
|
||||
batchReview() {
|
||||
if (!this.selectBatch.length) {
|
||||
this.$message.error('请选勾选要审核的评论')
|
||||
return
|
||||
}
|
||||
this.revieweVisible = true
|
||||
this.editData = {
|
||||
title: '批量审核',
|
||||
data: this.selectBatch
|
||||
}
|
||||
},
|
||||
// 批量选择
|
||||
handleSelectionChange(val) {
|
||||
this.selectBatch = val
|
||||
},
|
||||
// TODO:添加评论管理数据到评论库
|
||||
addToCommentLib(index, row) {
|
||||
const data = {
|
||||
content: row.text
|
||||
}
|
||||
commentLibAdd(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('成功加入评论库!')
|
||||
} else {
|
||||
this.$message.error('加入评论库失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:请求评论管理列表数据
|
||||
getcommentData() {
|
||||
this.loading = true
|
||||
commentList(this.searchData).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.commentData = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.commentData = []
|
||||
this.total = 0
|
||||
this.$message.error('请求失败')
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
|
||||
// TODO:用户禁言/解除禁言
|
||||
changeStatus(row, key) {
|
||||
const data = {
|
||||
id: row.userId
|
||||
}
|
||||
if (row[key] === 0) {
|
||||
data[key] = 2
|
||||
} else if (row[key] === 2) {
|
||||
data[key] = 0
|
||||
}
|
||||
userUpdate(data).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.getcommentData()
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO：用户解封
|
||||
unbanUser(row) {
|
||||
userUnBan({ userId: row.userId }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('解封成功')
|
||||
this.getcommentData()
|
||||
} else {
|
||||
this.$message.error('解封失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO：删除用户单条评论
|
||||
delet(key, row) {
|
||||
commentDelete({ id: row.id }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('删除成功')
|
||||
this.getcommentData()
|
||||
} else {
|
||||
this.$message.error('删除失败')
|
||||
this.getcommentData()
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO：删除该用户所有评论
|
||||
deletAll(index, row) {
|
||||
commentDeluser({ id: row.userId }).then(ret => {
|
||||
if (ret.code === 200) {
|
||||
this.$message.success('删除所有评论成功')
|
||||
this.getcommentData()
|
||||
} else {
|
||||
this.$message.error('删除所有评论失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 封禁用户
|
||||
banUser(row) {
|
||||
this.editData = {
|
||||
id: row.userId
|
||||
}
|
||||
this.banUserVisible = true
|
||||
},
|
||||
|
||||
// 回复
|
||||
reply(index, row) {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '回复消息',
|
||||
data: row
|
||||
}
|
||||
},
|
||||
|
||||
onAddComment() {
|
||||
this.editData = {
|
||||
title: '添加评论',
|
||||
data: {}
|
||||
}
|
||||
this.editVisible = true
|
||||
},
|
||||
|
||||
clear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.onSearch()
|
||||
},
|
||||
// 搜索按钮
|
||||
onSearch() {
|
||||
this.searchData.pageNum = 1
|
||||
this.searchData.pageSize = 10
|
||||
this.getcommentData()
|
||||
},
|
||||
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getcommentData()
|
||||
},
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getcommentData()
|
||||
},
|
||||
|
||||
// 关闭编辑弹窗
|
||||
closeEdit() {
|
||||
this.editData = {}
|
||||
this.editVisible = false
|
||||
this.banUserVisible = false
|
||||
this.revieweVisible = false
|
||||
this.toTopVisible = false
|
||||
this.getcommentData()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,76 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="700px" center :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" 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="word">
|
||||
<el-input v-model="form.word" placeholder="请输入非法词" type="textarea" style="width:450px" />
|
||||
</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 { filterWordAdd } from '@/api/videoManagement/filterWord'
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
word: undefined,
|
||||
createdAt: undefined,
|
||||
id: undefined,
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
if (this.title === '编辑') {
|
||||
this.form = { ...this.data.data }
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//TODO:新增非法词管理数据
|
||||
add(data) {
|
||||
filterWordAdd(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) {
|
||||
const data = JSON.parse(JSON.stringify(this.form))
|
||||
if (this.title === '新增') {
|
||||
this.add(data)
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,153 @@
|
||||
|
||||
<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 v-model="searchData.word" @clear="onClear('word')" />
|
||||
</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="750" highlight-current-row style="width: 100%" v-loading="loading" :row-style="{ height: '70px' }">
|
||||
<el-table-column align="center" label="id" width="200">
|
||||
<template slot-scope="scope">{{ scope.row.id }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="非法词">
|
||||
<template slot-scope="scope">{{ scope.row.word }}</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" fixed="right" label="操作" width="100">
|
||||
<template slot-scope="scope">
|
||||
<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 { getFilterList, filterWordDel } from '@/api/videoManagement/filterWord'
|
||||
|
||||
export default {
|
||||
name: 'FilterWordList',
|
||||
components: {
|
||||
Edit,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
word: undefined, // 非法词
|
||||
},
|
||||
resData: [], // el-table表格数据
|
||||
editVisible: false, // 新增或编辑弹出框
|
||||
total: 0, // 数据总条数
|
||||
loading: true, // 列表加载状态
|
||||
// 编辑数据
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {},
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
// TODO:请求非法词管理列表
|
||||
getList() {
|
||||
this.loading = true
|
||||
getFilterList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.$message.error('请求列表失败!')
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
//TODO:删除非法词管理数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}).then(() => {
|
||||
filterWordDel({ 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: {},
|
||||
}
|
||||
},
|
||||
|
||||
// 关闭编辑弹窗
|
||||
closeEdit() {
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {},
|
||||
}
|
||||
this.editVisible = false
|
||||
this.getList()
|
||||
},
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getList()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,155 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="800px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :rules="rules" :inline="true" :model="form" 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-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-switch v-model="form.status" active-color="#13ce66"></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-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="视频所属位置" >
|
||||
<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-row :gutter="24">
|
||||
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="12">
|
||||
<el-form-item label="头像">
|
||||
<UploadImg @changeImgUrl="changeAvatarUrl" :img="form.avatar"></UploadImg>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="12">
|
||||
<el-form-item label="背景图">
|
||||
<UploadImg @changeImgUrl="changeBackUrl" :img="form.background"></UploadImg>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :lg="24" :md="24" :sm="24" :xl="24" :xs="24">
|
||||
<el-form-item label="详细描述">
|
||||
<el-input v-model="form.desc" placeholder="请输入详细描述" type="textarea" style="width: 420px" />
|
||||
</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 {
|
||||
mediaepisodeAdd,
|
||||
mediaepisodeUpdate
|
||||
} from '@/api/videoManagement/mediagpisode'
|
||||
import UploadImg from '@/components/UploadImg/index'
|
||||
import { changeMoneyYuan, changeMoneyFen } from '@/filters/index'
|
||||
import {
|
||||
contentTypeList,videoLocationList
|
||||
} from '@/filters/mediaLibrary/videoList'
|
||||
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data'],
|
||||
components: {
|
||||
UploadImg
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
contentTypeList:contentTypeList(),
|
||||
videoLocationList:videoLocationList(),
|
||||
// 表单数据
|
||||
form: {
|
||||
background: undefined,
|
||||
name: undefined, // 名称
|
||||
price: undefined,
|
||||
status: true, // 是否启用
|
||||
avatar: undefined,
|
||||
desc: undefined,
|
||||
objectIds: [],
|
||||
rank: undefined,
|
||||
location:undefined
|
||||
},
|
||||
rules: {}
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
if (this.title === '编辑') {
|
||||
this.form = { ...this.data.data }
|
||||
this.form.price = changeMoneyYuan(this.form.price)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// TODO:新增选集列表数据
|
||||
add(data) {
|
||||
mediaepisodeAdd(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('新增失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// TODO:编辑选集列表数据
|
||||
update(data) {
|
||||
mediaepisodeUpdate(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
changeAvatarUrl(data) {
|
||||
this.form.avatar = data
|
||||
},
|
||||
changeBackUrl(data) {
|
||||
this.form.background = data
|
||||
},
|
||||
// 提交按钮
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
this.form.price = changeMoneyFen(this.form.price)
|
||||
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,243 @@
|
||||
<template>
|
||||
<el-dialog append-to-body title="将视频添加到集合中" :visible.sync="visible" width="1000px" :before-close="handleClose" class="spec-dialog">
|
||||
<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.userId" @clear="onClear('userId')" />
|
||||
</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.priceType" @clear="onClear('priceType')">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in MediaPayTypeList" />
|
||||
</el-select>
|
||||
</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')">
|
||||
<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.location" @clear="onClear('location')">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in videoLocationList" />
|
||||
</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-button @click="onSearch" icon="el-icon-search" plain type="primary">搜索</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
</el-row>
|
||||
|
||||
<div class="list_content">
|
||||
<div class="list_content_video" v-for="item in videoArr" :key="item.id" @click="choseVideo($event, item)">
|
||||
<ShowImg style="width: 100%; height: 110px" :urls="item.coverImg"></ShowImg>
|
||||
<div class="videoTitle">{{ item.title }}</div>
|
||||
<div class="videoMask display"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div>
|
||||
<el-pagination
|
||||
:current-page="searchData.pageNum"
|
||||
:page-size="searchData.pageSize"
|
||||
:page-sizes="[20, 40, 80]"
|
||||
:total="total"
|
||||
@current-change="handleCurrentChange"
|
||||
@size-change="handleSizeChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"/>
|
||||
</div>
|
||||
<br>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleClose">取 消</el-button>
|
||||
<el-button type="primary" @click="handleClose(true)">操作完毕</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
mediacollAddmediaList,
|
||||
mediacollMediaDel,
|
||||
mediacollMediaAdd
|
||||
} from '@/api/videoManagement/mediagpisode'
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
import { contentTypeList, videoLocationList } from '@/filters/mediaLibrary/videoList'
|
||||
|
||||
import { rankSo, MediaPayTypeList, MediaSatusList } from '@/filters/videoManagement/videoList'
|
||||
export default {
|
||||
name: 'AddVideoDialog',
|
||||
props: ['data', 'collId'],
|
||||
components: {
|
||||
ShowImg
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visible: true,
|
||||
contentTypeList:contentTypeList(),
|
||||
videoLocationList:videoLocationList(),
|
||||
rankSo:rankSo(),
|
||||
MediaPayTypeList:MediaPayTypeList(),
|
||||
MediaSatusList:MediaSatusList(),
|
||||
searchData: {
|
||||
mediaId: undefined,
|
||||
title: undefined,
|
||||
userId: undefined,
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
contentType: undefined, // 格式类型 1:AV 2:小视频 3:动漫
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
priceType: undefined, // 0,收费状态
|
||||
publishId: undefined, // 发布者id
|
||||
status: undefined, // 0,视频状态
|
||||
sort: undefined, // "string",媒体状态 operatAt(编辑时间)/addedTime(上架时间)/createdAt(创建时间)/updatedAt(更新时间)
|
||||
title: undefined, // "string",标题
|
||||
tagId: undefined,
|
||||
topicId: undefined,
|
||||
location:undefined
|
||||
},
|
||||
videoArr: '',
|
||||
total: undefined
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.searchData.collId = this.collId
|
||||
this.getMediacollAddmediaList()
|
||||
},
|
||||
methods: {
|
||||
// TODO：请求可加入集合的视频列表
|
||||
getMediacollAddmediaList() {
|
||||
mediacollAddmediaList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.videoArr = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.$message.error('请求可加入视频列表数据失败')
|
||||
this.total = 0
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:选集列表添加视频
|
||||
mediacollMediaAddFun(data) {
|
||||
mediacollMediaAdd(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('视频添加成功')
|
||||
} else {
|
||||
this.$message.error('视频添加失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:选集列表移除视频
|
||||
mediacollMediaDelFun(data) {
|
||||
mediacollMediaDel(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('视频移除成功')
|
||||
} else {
|
||||
this.$message.error('视频移除失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 选择视频时，改样式和赋值（event点击的dom,val点击的视频数据）
|
||||
choseVideo(event, val) {
|
||||
if (event.currentTarget.children[2].className === 'videoMask display') {
|
||||
event.currentTarget.children[2].className = 'videoMask'
|
||||
const param = {
|
||||
collId: Number(this.searchData.collId),
|
||||
mediaId: val.id
|
||||
}
|
||||
this.mediacollMediaAddFun(param)
|
||||
} else {
|
||||
event.currentTarget.children[2].className = 'videoMask display'
|
||||
const param = {
|
||||
collId: Number(this.searchData.collId),
|
||||
mediaId: val.id
|
||||
}
|
||||
this.mediacollMediaDelFun(param)
|
||||
}
|
||||
},
|
||||
// 关闭窗口时调用
|
||||
handleClose(flog) {
|
||||
if (flog === true) {
|
||||
// 这个是判断取消还是添加视频
|
||||
this.$emit('close', this.choseVideoId)
|
||||
} else {
|
||||
this.$emit('close')
|
||||
}
|
||||
},
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getMediacollAddmediaList()
|
||||
},
|
||||
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getMediacollAddmediaList()
|
||||
},
|
||||
onSearch() {
|
||||
this.getMediacollAddmediaList()
|
||||
},
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getMediacollAddmediaList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang='scss' scoped>
|
||||
.list_content {
|
||||
width: 100%;
|
||||
height: 600px;
|
||||
overflow-y: auto;
|
||||
.list_content_video {
|
||||
float: left;
|
||||
width: 208px;
|
||||
height: 150px;
|
||||
margin: 10px;
|
||||
position: relative;
|
||||
.videoTitle {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
line-height: auto;
|
||||
text-align: center;
|
||||
background-color: rgb(212, 212, 212);
|
||||
}
|
||||
.display {
|
||||
display: none;
|
||||
}
|
||||
.videoMask {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
background-color: #000;
|
||||
opacity: 0.5;
|
||||
img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin: 65px 94px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,186 @@
|
||||
|
||||
<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-button @click="onSearch" icon="el-icon-search" plain type="primary">搜索</el-button>-->
|
||||
<el-button type="info" style="margin: 0 0 0px 0px" @click="addVideo">添加视频</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col>
|
||||
<el-table :data="resData" border height="600px" style="width: 100%" highlight-current-row id="mediaList">
|
||||
<el-table-column align="center" label="视频Id" width="100px">
|
||||
<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.title }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="视频封面" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width: 70px; height: 40px; margin: 0 auto" :urls="scope.row.coverImg"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="详细描述" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.desc }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="200" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="setIndex(scope.$index, scope.row)" size="mini" type="success">设置集数</el-button>
|
||||
<el-button @click="delMedia(scope.$index, scope.row)" size="mini" type="danger">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleEdit(1)" type="primary">提交</el-button>
|
||||
<el-button @click="handleEdit(2)" type="danger">取消</el-button>
|
||||
</div>
|
||||
<VideoList v-if="showAddVideo" @close="closeEdit" :data="data.data" :collId="searchData.id" />
|
||||
<SetIndex v-if="setIndexVisible" @close="closeEdit" :data="editData"></SetIndex>
|
||||
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
import Sortable from 'sortablejs'
|
||||
import {
|
||||
mediacollMediaList,
|
||||
mediacollMediaDel,
|
||||
mediaepisodeUpdate
|
||||
} from '@/api/videoManagement/mediagpisode'
|
||||
import VideoList from './AddvideoList.vue'
|
||||
import SetIndex from './setIndex'
|
||||
|
||||
export default {
|
||||
name: 'MediaList',
|
||||
props: ['data'],
|
||||
components: {
|
||||
ShowImg,
|
||||
VideoList,
|
||||
SetIndex
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
// 表单数据
|
||||
searchData: {
|
||||
id: undefined,
|
||||
},
|
||||
showAddVideo: false,
|
||||
setIndexVisible:false,
|
||||
resData: [],
|
||||
objectIds: []
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.searchData.id = this.data.data.id
|
||||
this.getMediacollMediaList()
|
||||
// this.objectIds = this.data.data.objectIds
|
||||
this.$nextTick(() => {
|
||||
this.rowDrop()
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
setIndex(index, row) {
|
||||
this.setIndexVisible = true
|
||||
this.editData = {
|
||||
title: '设置级数',
|
||||
data: row
|
||||
}
|
||||
},
|
||||
// 行拖拽
|
||||
rowDrop() {
|
||||
const tbody = document.querySelector(
|
||||
'.ac-dialog .el-dialog--center .el-table__body-wrapper tbody'
|
||||
)
|
||||
const _this = this
|
||||
const { objectIds } = { ..._this.data.data }
|
||||
Sortable.create(tbody, {
|
||||
onEnd({ oldIndex, newIndex }) {
|
||||
const currRow = objectIds.splice(oldIndex, 1)
|
||||
objectIds.splice(newIndex, 0, ...currRow)
|
||||
_this.objectIds = objectIds
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:请求视频列表数据
|
||||
getMediacollMediaList() {
|
||||
mediacollMediaList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
const arr = []
|
||||
res.data.list.map((item) => {
|
||||
arr.push(item.id)
|
||||
})
|
||||
this.objectIds = arr
|
||||
} else {
|
||||
this.$message.error('请求视频列表失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO：删除视频列表数据
|
||||
delMedia(index, row) {
|
||||
const param = {
|
||||
mediaId: row.id,
|
||||
collId: this.searchData.id
|
||||
}
|
||||
mediacollMediaDel(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('删除成功')
|
||||
} else {
|
||||
this.$message.error('删除失败')
|
||||
}
|
||||
this.getMediacollMediaList()
|
||||
})
|
||||
},
|
||||
// TODO：提交视频列表排序
|
||||
handleEdit(type) {
|
||||
if (type === 1) {
|
||||
mediaepisodeUpdate({
|
||||
id: this.data.data.id,
|
||||
objectIds: this.objectIds
|
||||
}).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
}
|
||||
this.$emit('close')
|
||||
},
|
||||
onSearch() {
|
||||
this.getMediacollMediaList()
|
||||
},
|
||||
|
||||
// 添加视频按钮
|
||||
addVideo() {
|
||||
this.showAddVideo = true
|
||||
},
|
||||
// 关闭添加视频弹窗
|
||||
closeEdit() {
|
||||
this.showAddVideo = false
|
||||
this.setIndexVisible = false
|
||||
this.getMediacollMediaList()
|
||||
},
|
||||
// 提交按钮
|
||||
submit(formName) {
|
||||
this.$emit('close')
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,100 @@
|
||||
<!--
|
||||
* @Date: 2024-07-11 20:11:19
|
||||
* @LastEditors: Administrator admin@example.com
|
||||
* @LastEditTime: 2024-07-11 20:21:37
|
||||
* @FilePath: /pidou_admin/src/views/videoManagement/mediaepisode/components/setIndex.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog
|
||||
:title="title"
|
||||
:visible.sync="Visible"
|
||||
width="800px"
|
||||
center
|
||||
class="ac-dialog"
|
||||
:close-on-click-modal="false"
|
||||
@close="close"
|
||||
append-to-body>
|
||||
<el-form
|
||||
:rules="rules"
|
||||
:inline="true"
|
||||
:model="form"
|
||||
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-input v-model.number="form.episodeIndex" placeholder="请输入选集级数" />
|
||||
</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 {
|
||||
mediaEpisodeindex
|
||||
} from '@/api/videoManagement/mediagpisode'
|
||||
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data'],
|
||||
components: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
collId: undefined,
|
||||
mediaId: undefined, // 名称
|
||||
episodeIndex: undefined
|
||||
},
|
||||
rules: {}
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
this.form.episodeId = this.data.data.episodeId
|
||||
this.form.mediaId = this.data.data.id
|
||||
},
|
||||
methods: {
|
||||
|
||||
// TODO:编辑选集列表数据
|
||||
update(data) {
|
||||
mediaEpisodeindex(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) {
|
||||
const data = JSON.parse(JSON.stringify(this.form))
|
||||
this.update(data)
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,241 @@
|
||||
|
||||
<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 v-model="searchData.name" @clear="onClear('name')" />
|
||||
</el-form-item>
|
||||
<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="请输入用户ID" clearable v-model.number="searchData.userId" @clear="onClear('userId')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择是否启用" clearable v-model="searchData.status" @clear="onClear('status')" filterable allow-create default-first-option>
|
||||
<el-option label="未启用" :value="false" />
|
||||
<el-option label="启用" :value="true" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择视频类型" clearable v-model="searchData.contentType" @clear="onClear('contentType')">
|
||||
<el-option :label="'长视频'" :value="2" />
|
||||
<el-option :label="'动漫'" :value="5" />
|
||||
</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-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" :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="用户ID">
|
||||
<template slot-scope="scope">{{ scope.row.userId }}</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">{{
|
||||
scope.row.sells
|
||||
}}</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">
|
||||
<ShowImg style="width: 70px; height: 40px; margin: 0 auto" :urls="scope.row.avatar"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="背景图">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width: 70px; height: 40px; margin: 0 auto" :urls="scope.row.background"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="详细描述" width="300">
|
||||
<template slot-scope="scope">{{ scope.row.desc }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="选集状态" width="100">
|
||||
<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="300">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="showMediaList(scope.$index, scope.row)" size="mini" type="primary">查看视频列表</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="editVisible" @close="closeEdit" />
|
||||
<MediaList :data="editData" v-if="mediaListVisible" @close="closeEdit" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// 引入模块
|
||||
import Edit from './components/AddOrEdit'
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
import MediaList from './components/mediaList'
|
||||
import {
|
||||
mediaepisodeSearch,
|
||||
mediaepisodeDel
|
||||
} from '@/api/videoManagement/mediagpisode'
|
||||
export default {
|
||||
name: 'Mediaepisode',
|
||||
components: {
|
||||
Edit,
|
||||
ShowImg,
|
||||
MediaList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
id: undefined, // id
|
||||
status: undefined, // 是否启用
|
||||
name: undefined, // 名称
|
||||
userId: undefined // 用户ID
|
||||
},
|
||||
resData: [], // el-table表格数据
|
||||
editVisible: false, // 新增或编辑弹出框
|
||||
mediaListVisible: false,
|
||||
total: 0, // 数据总条数
|
||||
loading: true, // 列表加载状态
|
||||
// 编辑数据
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.onSearch()
|
||||
},
|
||||
methods: {
|
||||
// TODO:请求选集列表数据
|
||||
getMediaepisodeSearch() {
|
||||
this.loading = true
|
||||
mediaepisodeSearch(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.$message.error('请求列表失败!')
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
// TODO:删除选集列表数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
mediaepisodeDel({ id: row.id }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.getMediaepisodeSearch()
|
||||
this.$message.success('成功删除!')
|
||||
} else {
|
||||
this.$message.error(res.data || res.tip)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
onSearch() {
|
||||
this.searchData.pageNum = 1
|
||||
this.searchData.pageSize = 10
|
||||
this.getMediaepisodeSearch()
|
||||
},
|
||||
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getMediaepisodeSearch()
|
||||
},
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getMediaepisodeSearch()
|
||||
},
|
||||
|
||||
// 查看视频列表
|
||||
showMediaList(index, row) {
|
||||
this.mediaListVisible = true
|
||||
this.editData = {
|
||||
title: '视频列表',
|
||||
type: 2,
|
||||
data: row
|
||||
}
|
||||
},
|
||||
// 新增按钮
|
||||
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.mediaListVisible = false
|
||||
this.getMediaepisodeSearch()
|
||||
},
|
||||
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getMediaepisodeSearch()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,429 @@
|
||||
<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="封面">
|
||||
<UploadImg @changeImgUrl="changeCoverImgUrl" :img="form.coverImg"></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.coverType" clearable>
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in coverTypeList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<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="预览视频URL">
|
||||
<el-input v-model="form.preFileName" style="width: 400px" />
|
||||
</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.actorIds" filterable allow-create default-first-option multiple style="width: 180px">
|
||||
<el-option :key="item.value" :label="item.name" :value="item.id" v-for="item in actorList" />
|
||||
</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="请选择视频类型" v-model="form.contentType" clearable @change="changeContentType" 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="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="主题分类">
|
||||
<el-select placeholder="请选择主题分类" v-model="form.topicIds" filterable allow-create default-first-option multiple style="width: 180px">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in chooseVideoType" />
|
||||
</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-select placeholder="请选择视频状态" clearable v-model="form.status">
|
||||
<el-option v-for="item in MediaSatusList" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="上架时间">
|
||||
<el-date-picker v-model="form.addedTime" type="date" placeholder="选择日期" value-format="yyyy-MM-ddTHH:mm:ss+08:00" style="width: 180px">
|
||||
</el-date-picker>
|
||||
</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.price" style="width: 180px">
|
||||
<template slot="append">元</template>
|
||||
</el-input>
|
||||
</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-input v-model.number="form.fake.watchTimes" 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.fake.likes" style="width: 180px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="是否是vip">
|
||||
<el-switch v-model="form.isVip" active-color="#13ce66" inactive-color="#ff4949" style="width: 180px"></el-switch>
|
||||
</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-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
||||
<el-form-item label="已选标签">
|
||||
<el-tag :key="index + 'tag'" v-for="(item, index) in form.tags" :disable-transitions="true" closable style="margin: 2px" @close="handleTagClose(item)">
|
||||
{{item|changeName(chooseMediatag,'id','name') }}
|
||||
</el-tag>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
||||
<el-form-item label="可选标签">
|
||||
<el-button :type="showTagsFlag?'warning':'success'" @click="showTagsFun">{{showTagsFlag?'隐藏标签':'展示标签'}}</el-button>
|
||||
<div>
|
||||
<el-tag v-show="showTagsFlag" :key="index + 'tagData'" style="margin: 2px; cursor: pointer" v-for="(item, index) in chooseMediatag" :disable-transitions="true" :type="fliterTagType(item.name)" @click="handleClickTag(item.id)">
|
||||
{{ item.name }}
|
||||
</el-tag>
|
||||
</div>
|
||||
</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>
|
||||
<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 { arryToString, changeMoneyYuan, changeMoneyFen } from '@/filters/index'
|
||||
import { MediaSatusList } from '@/filters/videoManagement/videoList'
|
||||
import { mediaUpdate } from '@/api/videoManagement/videoList'
|
||||
import {
|
||||
contentTypeList,
|
||||
coverTypeList,
|
||||
} from '@/filters/mediaLibrary/videoList'
|
||||
import { topicSearch } from '@/api/videoManagement/topic'
|
||||
import { mediatagList } from '@/api/videoManagement/mediatag'
|
||||
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data', 'videoType', 'mediatag', 'actorList'],
|
||||
components: {
|
||||
UploadImg,
|
||||
AddVideo,
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
showTagsFlag: false,
|
||||
Visible: true,
|
||||
title: '',
|
||||
coverTypeList: coverTypeList(),
|
||||
contentTypeList: contentTypeList(),
|
||||
MediaSatusList: MediaSatusList(),
|
||||
addVisible: false,
|
||||
longMediatag: [],
|
||||
longVideoType: [],
|
||||
shortMediatag: [],
|
||||
shortVideoType: [],
|
||||
chooseMediatag: [],
|
||||
chooseVideoType: [],
|
||||
form: {
|
||||
actors: undefined, // [],演员
|
||||
actorIds: [], // 演员分类
|
||||
addedTime: undefined, // "string",上架时间
|
||||
bango: undefined, // 番号
|
||||
contentType: undefined, // 格式类型: 1:AV 2:小视频 3:动漫
|
||||
tags: [],
|
||||
score: undefined, // 评分
|
||||
coverImg: undefined, // [],封面
|
||||
coverType: undefined, // 封面类型： 1:竖版封面 2:横版封面 3:未知
|
||||
desc: undefined, // "string",详细描述
|
||||
fake: {},
|
||||
isVip: undefined, // true,是否VIp
|
||||
preFileName: undefined, // "string",预览文件
|
||||
price: undefined, // 0,售价，单位分
|
||||
publishAvatar: undefined, // 视频发布者头像
|
||||
publishId: undefined, // 发布者ID
|
||||
status: undefined, // 0,视频状态
|
||||
title: undefined, // "string",标题
|
||||
topicIds: [], // 视频分类
|
||||
id: undefined, // 0,视频Id
|
||||
},
|
||||
rules: {},
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
if (this.title === '编辑') {
|
||||
this.showChooseTag()
|
||||
this.form = { ...this.data.data }
|
||||
this.form.price = changeMoneyYuan(this.form.price)
|
||||
this.form.addedTime =
|
||||
moment(this.data.data.addedTime)
|
||||
.utcOffset(480)
|
||||
.format('YYYY-MM-DDTHH:mm:ss') + '+08:00'
|
||||
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 = []
|
||||
}
|
||||
this.getTopicSearch(this.form.contentType)
|
||||
this.getMediatagList(this.form.contentType)
|
||||
} 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('更新失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取主题
|
||||
getTopicSearch(val) {
|
||||
this.chooseVideoType = []
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 500,
|
||||
contentType: val,
|
||||
}
|
||||
topicSearch(param).then((res) => {
|
||||
if (res.data.list) {
|
||||
res.data.list.forEach((item) => {
|
||||
this.chooseVideoType.push({
|
||||
label: item.name,
|
||||
value: item.id,
|
||||
})
|
||||
})
|
||||
} else {
|
||||
this.chooseVideoType = []
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取标签
|
||||
getMediatagList(val) {
|
||||
this.chooseMediatag = []
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 5000,
|
||||
contentType: val,
|
||||
}
|
||||
mediatagList(param).then((res) => {
|
||||
if (res.data.list) {
|
||||
res.data.list.forEach((item) => {
|
||||
this.chooseMediatag.push({
|
||||
name: item.name,
|
||||
id: item.id,
|
||||
})
|
||||
})
|
||||
} else {
|
||||
this.chooseMediatag = []
|
||||
}
|
||||
})
|
||||
},
|
||||
// 新增时视频ID绑定
|
||||
videoInfo(data) {
|
||||
console.log(data)
|
||||
this.form = { ...this.form, data }
|
||||
if (this.form.actorIds) {
|
||||
this.form.actorids = arryToString(this.form.actorids)
|
||||
}
|
||||
// this.form.directors = arryToString(this.form.directors)
|
||||
// this.form.secondTags = arryToString(this.form.secondTags)
|
||||
this.addVisible = false
|
||||
},
|
||||
showTagsFun() {
|
||||
this.showTagsFlag = !this.showTagsFlag
|
||||
},
|
||||
// 在可选择列表过滤出已选择的标签
|
||||
fliterTagType(tagID) {
|
||||
if (this.form.tags.indexOf(tagID) !== -1) {
|
||||
return 'danger'
|
||||
} else {
|
||||
return 'info'
|
||||
}
|
||||
},
|
||||
// 删除已选择列表中的标签
|
||||
handleTagClose(tag) {
|
||||
this.form.tags.splice(this.form.tags.indexOf(tag), 1)
|
||||
},
|
||||
// // 过滤出选择的标签名称
|
||||
// fliterTag(ID) {
|
||||
// let name = ''
|
||||
// this.mediatag.forEach((element) => {
|
||||
// if (element.id === ID) {
|
||||
// name = element.name
|
||||
// }
|
||||
// })
|
||||
// return name
|
||||
// },
|
||||
// 根据格式类型显示不同的视频标签和主题分类
|
||||
showChooseTag() {
|
||||
this.mediatag.forEach((element) => {
|
||||
if (element.contentType === 1) {
|
||||
this.shortMediatag.push(element)
|
||||
} else if (element.contentType === 2) {
|
||||
this.longMediatag.push(element)
|
||||
}
|
||||
})
|
||||
this.videoType.forEach((element) => {
|
||||
if (element.contentType === 1) {
|
||||
this.shortVideoType.push(element)
|
||||
} else if (element.contentType === 2) {
|
||||
this.longVideoType.push(element)
|
||||
}
|
||||
})
|
||||
|
||||
if (this.data.data.contentType === 1) {
|
||||
this.chooseMediatag = this.shortMediatag
|
||||
this.chooseVideoType = this.shortVideoType
|
||||
} else if (this.data.data.contentType === 2) {
|
||||
this.chooseMediatag = this.longMediatag
|
||||
this.chooseVideoType = this.longVideoType
|
||||
}
|
||||
},
|
||||
// 点击可选择列表中的标签
|
||||
handleClickTag(tagID) {
|
||||
console.log(tagID)
|
||||
if (this.form.tags.indexOf(tagID) === -1) {
|
||||
this.form.tags.push(tagID)
|
||||
}
|
||||
console.log(this.form.tags)
|
||||
},
|
||||
// 提交按钮
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
const actorNameArr = []
|
||||
if (this.actorList) {
|
||||
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)
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
this.form.actors = arryToString(actorNameArr)
|
||||
}
|
||||
const tagNameArr = []
|
||||
if (this.mediatag) {
|
||||
Object.keys(this.mediatag).forEach((key) => {
|
||||
if (this.form.actorIds.length > 0) {
|
||||
for (let index = 0; index < this.form.tags.length; index++) {
|
||||
if (this.form.tags[index] === this.mediatag[key].id) {
|
||||
tagNameArr.push(this.mediatag[key].name)
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
this.form.tagString = arryToString(tagNameArr)
|
||||
}
|
||||
this.form.score = parseFloat(this.form.score)
|
||||
const data = {
|
||||
id: this.form.id,
|
||||
param: JSON.parse(JSON.stringify(this.form)),
|
||||
}
|
||||
data.param.price = data.param.price
|
||||
? changeMoneyFen(data.param.price)
|
||||
: 0
|
||||
data.param.companiesId = Number(data.param.companiesId)
|
||||
data.param.fake.watchTimes = data.param.fake.watchTimes
|
||||
? Number(data.param.fake.watchTimes)
|
||||
: 0
|
||||
this.update(data)
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
changeContentType(val) {
|
||||
this.form.topicIds = []
|
||||
this.getTopicSearch(val)
|
||||
this.getMediatagList(val)
|
||||
// if (val === 1) {
|
||||
// this.chooseMediatag = this.shortMediatag
|
||||
// this.chooseVideoType = this.shortVideoType
|
||||
// } else if (val === 2) {
|
||||
// this.chooseMediatag = this.longMediatag
|
||||
// this.chooseVideoType = this.longVideoType
|
||||
// }
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
// 上传图片返回地址
|
||||
changeCoverImgUrl(data) {
|
||||
this.form.coverImg = data
|
||||
},
|
||||
|
||||
// 关闭不通过原因弹框
|
||||
closeVideoInfo() {
|
||||
this.addVisible = false
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,58 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-02-23 16:08:40
|
||||
* @LastEditTime: 2022-05-26 17:25:29
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @FilePath: /web_admin/src/views/videoManagement/videoList/components/addVideo.vue
|
||||
-->
|
||||
<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 { mediatsAddts } from '@/api/videoManagement/videoList'
|
||||
export default {
|
||||
name: 'AddVideo',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
// 表单数据
|
||||
form: {
|
||||
fileId: undefined
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
// TODO:新增视频时绑定煤资库提交按钮
|
||||
submit() {
|
||||
// mediatsAddts(this.form).then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// 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('closeAll')
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,153 @@
|
||||
|
||||
<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 videoType" />
|
||||
</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: 180px" multiple placeholder="请选择演员分类" v-model="form.actorIds" filterable allow-create default-first-option>
|
||||
<el-option :key="item.value" :label="item.name" :value="item.id" v-for="item in actorList" />
|
||||
</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-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 } from '@/filters/index'
|
||||
|
||||
export default {
|
||||
name: 'Batch',
|
||||
props: ['data', 'videoType', 'gatherList', 'studioList', 'actorList'],
|
||||
data() {
|
||||
return {
|
||||
MediaSatusList: MediaSatusList(),
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
isVip: undefined,
|
||||
status: undefined,
|
||||
topicIds: [],
|
||||
gatherIds: [],
|
||||
actorIds: [],
|
||||
actor: undefined,
|
||||
companiesId: undefined,
|
||||
publishId: undefined
|
||||
},
|
||||
//
|
||||
dates: [],
|
||||
rules: {}
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
// TODO:批量设置视频提交
|
||||
submit() {
|
||||
if (this.data.length) {
|
||||
this.data.forEach((item) => {
|
||||
const data = {
|
||||
id: item.id,
|
||||
param: item
|
||||
}
|
||||
console.log(data)
|
||||
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.companiesId) {
|
||||
data.param.companiesId = this.form.companiesId
|
||||
}
|
||||
if (this.form.publishId) {
|
||||
data.param.publishId = this.form.publishId
|
||||
}
|
||||
|
||||
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)
|
||||
}
|
||||
|
||||
mediaUpdate(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success(item.id + '修改成功')
|
||||
} else {
|
||||
this.$message.error(item.id + '修改失败')
|
||||
}
|
||||
})
|
||||
})
|
||||
} else {
|
||||
this.$message.error('未选择视频')
|
||||
}
|
||||
this.Visible = false
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,94 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-02-26 15:21:37
|
||||
* @LastEditTime: 2022-03-28 14:32:13
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @FilePath: /web_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: 'SetTag',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
MediaSatusList: [],
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
tags: undefined
|
||||
},
|
||||
rules: {}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getMediatagList()
|
||||
},
|
||||
methods: {
|
||||
// TODO:提交视频标签按钮
|
||||
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.error('未选择视频')
|
||||
}
|
||||
this.Visible = false
|
||||
},
|
||||
// TODO:请求视频标签列表
|
||||
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,294 @@
|
||||
|
||||
<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-select placeholder="请选择视频类型" clearable v-model="searchData.subType" @clear="onClear('subType')">
|
||||
<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.recommendLevel" @clear="onClear('recommendLevel')">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in recommendLevelList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择推荐状态" clearable v-model="searchData.recommendStatus" @clear="onClear('recommendStatus')">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in recommendStatusList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择排序方式" clearable v-model="searchData.sort" @clear="onClear('sort')">
|
||||
<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-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' }" empty-text="暂无更多数据">
|
||||
<el-table-column align="center" label="排名 " width="100">
|
||||
<template slot-scope="scope">{{ scope.row.rank }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="影片ID" width="100px">
|
||||
<template slot-scope="scope">{{ scope.row.mediaId }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="视频标题" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.media.title }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="视频封面" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width: 70px; height: 40px; margin: 0 auto" :urls="scope.row.media.coverImg"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="正片预览" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<i v-if="scope.row.media.fieldNameFs" class="el-icon-video-play views" title="点击预览" @click="checkMedia(scope.row.media.fieldNameFs, scope.row.media)"></i>
|
||||
<div v-else>暂无</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="观看次数" width="100px">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.watchTimes
|
||||
}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="👍点赞次数" width="100">
|
||||
<template slot-scope="scope">{{ scope.row.likes }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="👎倒彩次数" width="100px">
|
||||
<template slot-scope="scope">{{ scope.row.notLikes }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="推荐等级" width="100px">
|
||||
<template slot-scope="scope">{{ scope.row.recommendLevel|changeRecommendLevel }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="推荐状态" width="100px">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.recommendStatus|changeRecommendStatus
|
||||
}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="子类型" width="100px">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.subType|changeContentType
|
||||
}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="创建时间" width="180">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.media.createdAt | BeiJingTime
|
||||
}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="更新时间" width="180">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.media.updatedAt | BeiJingTime
|
||||
}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="200">
|
||||
<template slot-scope="scope">
|
||||
<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 :mediatag="mediatag" :videoType="videoType" :actorList="actorList" :data="editData" v-if="editVisible" @close="closeEdit" />
|
||||
<ShowVideo ref="showvideo"></ShowVideo>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// 引入模块
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
import ShowVideo from '@/components/ShowVideo/index.vue'
|
||||
import Edit from './components/AddOrEdit'
|
||||
import { mediatagList } from '@/api/videoManagement/mediatag'
|
||||
import { topicSearch } from '@/api/videoManagement/topic'
|
||||
import { actressSearch } from '@/api/videoManagement/actressList'
|
||||
import { recommendSeach, recommendDel } from '@/api/videoManagement/recommend'
|
||||
import { contentTypeList } from '@/filters/mediaLibrary/videoList'
|
||||
import {
|
||||
rankSo2,
|
||||
recommendLevelList,
|
||||
recommendStatusList,
|
||||
} from '@/filters/videoManagement/videoList'
|
||||
export default {
|
||||
name: 'VideoList',
|
||||
components: {
|
||||
ShowImg,
|
||||
ShowVideo,
|
||||
Edit,
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
mediatag: [],
|
||||
videoType: [],
|
||||
rankSo: rankSo2(),
|
||||
contentTypeList: contentTypeList(),
|
||||
recommendLevelList: recommendLevelList(),
|
||||
recommendStatusList: recommendStatusList(),
|
||||
|
||||
// MediacolumnList: [],
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
end: undefined, // "string",结束时间
|
||||
start: undefined, // "string",开始时间
|
||||
recommendLevel: undefined, // 推荐等级：0:新片 1:黑名单 2:一般 3:推荐
|
||||
recommendStatus: undefined, // integer推荐状态：0:采集数据，1:结果
|
||||
sort: undefined, // "string",媒体状态 operatAt(编辑时间)/addedTime(上架时间)/createdAt(创建时间)/updatedAt(更新时间)
|
||||
subType: undefined, // 格式类型 1:AV 2:小视频 3:动漫
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
},
|
||||
time: undefined,
|
||||
resData: [], // el-table表格数据
|
||||
total: 0, // 数据总条数
|
||||
loading: true, // 列表加载状态
|
||||
// 编辑数据
|
||||
editVisible: false,
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {},
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.getMediatagList()
|
||||
this.getActorList()
|
||||
this.getMediacategoryList()
|
||||
this.getMediaSearch()
|
||||
},
|
||||
methods: {
|
||||
// TODO：请求视频列表数据
|
||||
getMediaSearch() {
|
||||
this.loading = true
|
||||
if (this.time) {
|
||||
this.searchData.start = this.time[0]
|
||||
this.searchData.end = this.time[1]
|
||||
} else {
|
||||
this.searchData.start = undefined
|
||||
this.searchData.end = undefined
|
||||
}
|
||||
recommendSeach(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
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(() => {
|
||||
recommendDel({ id: row.id }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.getMediaSearch()
|
||||
this.$message.success('成功删除!')
|
||||
} else {
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
// TODO:请求演员列表数据
|
||||
getActorList() {
|
||||
actressSearch({ pageNum: 1, pageSize: 5000, param: {} }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.actorList = res.data.list
|
||||
} else {
|
||||
this.$message.error('请求演员列表失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// TODO：请求视频标签列表
|
||||
getMediatagList(val) {
|
||||
mediatagList({
|
||||
pageNum: 1,
|
||||
pageSize: 5000,
|
||||
subType: val || undefined,
|
||||
}).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.mediatag = res.data.list
|
||||
} else {
|
||||
this.$message.error('请求视频标签失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// TODO：请求视频分类列表
|
||||
getMediacategoryList(val) {
|
||||
topicSearch({
|
||||
pageNum: 1,
|
||||
pageSize: 500,
|
||||
subType: val || undefined,
|
||||
}).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.videoType = res.data.list
|
||||
} else {
|
||||
this.$message.error('请求视频类型列表失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑弹窗
|
||||
closeEdit() {
|
||||
this.editVisible = false
|
||||
this.getMediaSearch()
|
||||
},
|
||||
|
||||
handleEdit(row) {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row.media,
|
||||
}
|
||||
},
|
||||
|
||||
checkMedia(url, data) {
|
||||
this.$refs.showvideo.open(url, data)
|
||||
},
|
||||
|
||||
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()
|
||||
},
|
||||
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getMediaSearch()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,263 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="Visible" width="1000px" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-form :inline="true" :model="form" 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="主题名称">
|
||||
<el-input v-model="form.name" 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="排序">
|
||||
<el-input v-model.number="form.rank" placeholder="请输入排序" style="width: 180px" />
|
||||
</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-row :gutter="24">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="主题所属分类" label-width="100px">
|
||||
<el-select placeholder="请选择主题所属分类" v-model="form.categoryId" filterable allow-create default-first-option>
|
||||
<el-option :key="item.value" :label="item.name" :value="item.id" v-for="item in newMediatagCategory" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="所属位置" prop="location">
|
||||
<el-select placeholder="请选择所属位置置" @change="changeLocation" clearable v-model="form.location" filterable>
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in locationList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="主题展示模式" label-width="100px">
|
||||
<el-select placeholder="请选择主题展示模式" v-model="form.bindType" filterable allow-create default-first-option>
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in bindTypeList" />
|
||||
</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.showType">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in topicShowTypeList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12" v-if="form.showType === 3">
|
||||
<el-form-item label="是否轮播" prop="isCarousel">
|
||||
<el-switch v-model="form.isCarousel" 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="是否推荐" prop="isCarousel">
|
||||
<el-switch v-model="form.isCarousel" 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="状态">
|
||||
<el-switch v-model="form.status" 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="是否显示换一换" label-width="150px">
|
||||
<el-switch v-model="form.changeStatus" 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="sort">
|
||||
<el-input v-model.number="form.sort" placeholder="请输入排序值" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12" v-if="title === '新增'">
|
||||
<el-form-item label="虚拟参与人数">
|
||||
<el-input v-model.number="form.fakeJoinCount" placeholder="请输入虚拟参与人数" />
|
||||
</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.fakeWatchTimes" placeholder="请输入虚拟观看次数" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="34">
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="封面图">
|
||||
<UploadImg @changeImgUrl="changeCoverImgUrl('cover', $event)" :img="form.cover"></UploadImg>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="背景图">
|
||||
<UploadImg @changeImgUrl="changeCoverImgUrl('background', $event)" :img="form.background"></UploadImg>
|
||||
</el-form-item>
|
||||
</el-col>-->
|
||||
</el-row>
|
||||
<!-- 标签 -->
|
||||
<el-divider content-position="center">标签绑定设置</el-divider>
|
||||
<TagSelectV2 type="resourceManagement" ref="TagSelect" @selectTags="selectTags" :formTags="form.tagIds" :mediatagCategory="newMediatagCategory" :allTags="allTags" />
|
||||
</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 { topicAdd, topicUpdate } from '@/api/videoManagement/topic'
|
||||
import UploadImg from '@/components/UploadImg/index'
|
||||
import { topicShowTypeList, bindTypeList } from '@/filters/videoManagement/topic'
|
||||
import { mediacategoryList } from '@/api/videoManagement/mediacategory'
|
||||
import { numberToArry, arryToString, changeMoneyYuan, changeMoneyFen } from '@/filters/index'
|
||||
import TagSelectV2 from '@/components/TagSelectV2/index'
|
||||
|
||||
import { mediaAllList } from '@/api/postManagement/newList'
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data', 'mediatagArr', 'contentTypeList', 'locationList'],
|
||||
|
||||
data() {
|
||||
return {
|
||||
topicShowTypeList: topicShowTypeList(),
|
||||
bindTypeList: bindTypeList(),
|
||||
Visible: true,
|
||||
allTags: [],
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
categoryId: undefined, // 分类ID
|
||||
contentType: undefined, // integer 视频类型：1:AV 2:小视频 3:动漫
|
||||
desc: undefined, // 标题描述
|
||||
name: undefined, // "string",分类名称
|
||||
rank: undefined, // 0,排序
|
||||
showType: undefined, // 0,展示方式
|
||||
status: true, // true,是否启用
|
||||
fakeJoinCount: undefined, // 虚拟参与次数
|
||||
fakeWatchTimes: undefined, // 虚拟观看次数
|
||||
tagIds: [],
|
||||
sort: undefined,
|
||||
isCarousel: undefined
|
||||
// isShowAtPost: undefined
|
||||
},
|
||||
newMediatagCategory: []
|
||||
}
|
||||
},
|
||||
components: {
|
||||
UploadImg,
|
||||
TagSelectV2
|
||||
},
|
||||
|
||||
async mounted() {
|
||||
this.title = this.data.title
|
||||
await this.videoTypeInfo()
|
||||
if (this.title === '编辑') {
|
||||
this.form = JSON.parse(JSON.stringify(this.data.data))
|
||||
this.form.price = changeMoneyYuan(this.form.price)
|
||||
if (this.form.objectids) {
|
||||
this.form.objectids = arryToString(this.form.objectids)
|
||||
} else {
|
||||
this.form.objectids = ''
|
||||
}
|
||||
}
|
||||
await this.getMediaAllList(this.form.location)
|
||||
},
|
||||
methods: {
|
||||
// 选择标签组件返回
|
||||
selectTags(tags) {
|
||||
this.form.tagIds = tags
|
||||
},
|
||||
// 请求标签列表
|
||||
getMediaAllList(location) {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 5000,
|
||||
location
|
||||
}
|
||||
mediaAllList(param).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.allTags = res.data.list
|
||||
} else {
|
||||
this.allTags = []
|
||||
this.$message.error('请求标签列表数据失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
changeLocation(location) {
|
||||
this.getFilterTags(location)
|
||||
},
|
||||
// 上传图片返回地址
|
||||
changeCoverImgUrl(kay, data) {
|
||||
this.form[kay] = data
|
||||
},
|
||||
// TODO:请求视频分类列表
|
||||
videoTypeInfo(val) {
|
||||
mediacategoryList({ pageNum: 1, pageSize: 500 }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.newMediatagCategory = res.data.list
|
||||
} else {
|
||||
this.$message.error('请求分类列表失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO：新增视频主题列表数据
|
||||
add(data) {
|
||||
topicAdd(data).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('新增失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// TODO：编辑视频主题列表数据
|
||||
update(data) {
|
||||
topicUpdate(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) {
|
||||
const param = JSON.parse(JSON.stringify(this.form))
|
||||
param.rank = param.rank ? Number(param.rank) : 0
|
||||
param.objectids = numberToArry(param.objectids)
|
||||
param.price = changeMoneyFen(param.price)
|
||||
let data
|
||||
if (this.title === '新增') {
|
||||
data = param
|
||||
this.add(data)
|
||||
} else if (this.title === '编辑') {
|
||||
data = {
|
||||
id: param.id,
|
||||
param: param
|
||||
}
|
||||
this.update(data)
|
||||
}
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,86 @@
|
||||
<!--
|
||||
* @Author:
|
||||
* @Mail:
|
||||
* @Date: 2022-03-14 15:22:04
|
||||
* @LastEditTime: 2022-06-09 15:55:29
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @FilePath: /comics-admin/src/views/videoManagement/topic/components/editSort.vue
|
||||
-->
|
||||
<template>
|
||||
<el-dialog :close-on-click-modal="false" :title="title" :visible.sync="Visible" @close="close" center class="ac-dialog" width="700px">
|
||||
<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="12" :md="12" :sm="12" :xl="12" :xs="12">
|
||||
<el-form-item label="视频ID">
|
||||
<el-input v-model.number="form.mediaId" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="12">
|
||||
<el-form-item label="类型ID">
|
||||
<el-input v-model.number="form.objectId" disabled />
|
||||
</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-input v-model.number="form.rank" />
|
||||
</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 { sortMedia } from '@/api/videoManagement/topic'
|
||||
export default {
|
||||
name: 'EditSort',
|
||||
props: ['data'],
|
||||
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
mediaId: undefined,
|
||||
objectId: undefined,
|
||||
rank: undefined,
|
||||
type: undefined,
|
||||
},
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
this.form = { ...this.data.data }
|
||||
this.formData = Object.assign({}, this.form)
|
||||
},
|
||||
methods: {
|
||||
//TODO:设置视频排序
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
sortMedia(this.form).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close', false)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,316 @@
|
||||
|
||||
<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="请输入视频ID" clearable v-model.number="searchData.mediaId" @clear="onClear('mediaId')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="getTopicMediaSearch" icon="el-icon-search" plain type="primary">搜索</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col>
|
||||
<el-table :data="resData" border height="600px" style="width: 100%" highlight-current-row>
|
||||
<el-table-column align="center" label="视频Id" width="100">
|
||||
<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.title }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="预览视频" width="100">
|
||||
<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="100">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width:70px;height:40px;margin:0 auto" :urls="scope.row.coverImg"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="详细描述" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.desc }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="真实信息">
|
||||
<el-table-column align="center" label="评论数">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.real.comments
|
||||
}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="收藏数">
|
||||
<template slot-scope="scope">{{ scope.row.real.collects }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="售卖数">
|
||||
<template slot-scope="scope">{{ scope.row.real.sells }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="观看数">
|
||||
<template slot-scope="scope">{{
|
||||
scope.row.real.watchTimes
|
||||
}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" width="120px" label="本周观看次数">
|
||||
<template slot-scope="scope">{{ scope.row.real.weekWatchs }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" width="120px" label="本月观看次数">
|
||||
<template slot-scope="scope">{{ scope.row.real.monthWatchs }}</template>
|
||||
</el-table-column>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column fixed="right" label="操作" width="200" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="eidtMedia(scope.$index, scope.row)" size="mini" type="primary">编辑</el-button>
|
||||
<el-button @click="sortMedia(scope.$index, scope.row)" size="mini" type="primary">视频排序</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="submit('ruleForm')"> 确 定 </el-button>
|
||||
</div>
|
||||
<ShowVideo ref="showvideo"></ShowVideo>
|
||||
</el-dialog>
|
||||
<Edit :data="editData" v-if="editVisible" @close="closeEdit" />
|
||||
<EditMedia :mediatagCategory="mediatagCategory" :mediatag="mediatag" :videoType="videoType" :circleList="circleList" :data="editData" :mediaCollList="mediaCollList" :actorList="actorList" v-if="editMediaVisible" @close="closeEdit" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
topicMediaSearch,
|
||||
topicSearch
|
||||
// topicMediaTop,
|
||||
} from '@/api/videoManagement/topic'
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
import ShowVideo from '@/components/ShowVideo/index.vue'
|
||||
import Edit from './editSort.vue'
|
||||
import EditMedia from '@/views/videoManagement/videoList/components/AddOrEdit'
|
||||
import { mediatagList } from '@/api/videoManagement/mediatag'
|
||||
import { actressSearch } from '@/api/videoManagement/actressList'
|
||||
import { mediacollList } from '@/api/videoManagement/collectionList'
|
||||
import { mediatagCategoryList } from '@/api/videoManagement/videoTagType'
|
||||
import { circleListSearch } from '@/api/user/circleList'
|
||||
|
||||
export default {
|
||||
name: 'MediaList',
|
||||
props: ['data'],
|
||||
components: {
|
||||
ShowImg,
|
||||
ShowVideo,
|
||||
Edit,
|
||||
EditMedia
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
mediatag: [],
|
||||
videoType: [],
|
||||
actorList: [],
|
||||
mediaCollList: [],
|
||||
mediatagCategory:[],
|
||||
circleList:[],
|
||||
Visible: true,
|
||||
// 表单数据
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
mediaId: undefined,
|
||||
type: undefined,
|
||||
objectId: undefined
|
||||
},
|
||||
rules: {},
|
||||
resData: [],
|
||||
total: 0,
|
||||
editVisible: false,
|
||||
editMediaVisible: false,
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.getMediatagList()
|
||||
this.getMediacategoryList()
|
||||
this.searchData.objectId = this.data.data.id
|
||||
this.searchData.type = this.data.type
|
||||
this.getTopicMediaSearch()
|
||||
this.getMediacollList()
|
||||
this.getmediatagCategoryList()
|
||||
this.getCircleListSearch()
|
||||
},
|
||||
methods: {
|
||||
// TODO:请求圈子列表数据
|
||||
getCircleListSearch() {
|
||||
circleListSearch({ pageNum: 1, pageSize: 5000 }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.circleList = res.data.list
|
||||
} else {
|
||||
this.$message.error('请求圈子列表失败!')
|
||||
this.circleList = []
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:请求视频标签分类列表
|
||||
getmediatagCategoryList() {
|
||||
mediatagCategoryList({ pageNum: 1, pageSize: 100 }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.mediatagCategory = res.data.list
|
||||
} else {
|
||||
this.mediatagCategory = []
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:请求演员数据列表
|
||||
getActorList() {
|
||||
actressSearch({ pageNum: 1, pageSize: 5000, param: {} }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.actorList = res.data.list
|
||||
} else {
|
||||
this.actorList = []
|
||||
this.$message.error('请求演员列表失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:请求视频标签列表
|
||||
getMediatagList() {
|
||||
mediatagList({ pageNum: 1, pageSize: 5000, param: {} }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.mediatag = res.data.list
|
||||
} else {
|
||||
this.mediatag = []
|
||||
this.$message.error('请求视频标签失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:请求视频分类列表
|
||||
getMediacategoryList() {
|
||||
topicSearch({ pageNum: 1, pageSize: 500, param: {} }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.videoType = res.data.list
|
||||
} else {
|
||||
this.videoType = []
|
||||
this.$message.error('请求视频类型列表失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// TODO:请求视频列表数据
|
||||
getTopicMediaSearch() {
|
||||
topicMediaSearch(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
this.$message.error('请求视频列表失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO：请求合集列表数据
|
||||
getMediacollList() {
|
||||
mediacollList({ pageNum: 1, pageSize: 5000 }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.mediaCollList = res.data.list || []
|
||||
} else {
|
||||
this.$message.error('请求合集列表失败')
|
||||
this.mediaCollList = []
|
||||
}
|
||||
})
|
||||
},
|
||||
// // 置顶按钮
|
||||
// toTop(index, row) {
|
||||
// this.$confirm('确定置顶?', '警告', {
|
||||
// confirmButtonText: '确定',
|
||||
// cancelButtonText: '取消',
|
||||
// type: 'warning',
|
||||
// }).then(() => {
|
||||
// topicMediaTop({ id: row.id }).then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// this.$message.success('置顶成功!')
|
||||
// } else {
|
||||
// this.$message.error(res.tip)
|
||||
// }
|
||||
// })
|
||||
// this.getTopicMediaSearch()
|
||||
// })
|
||||
// },
|
||||
// 视频查看
|
||||
checkMedia(url, data) {
|
||||
this.$refs.showvideo.open(url, data, data.id)
|
||||
},
|
||||
// 提交按钮
|
||||
submit(formName) {
|
||||
this.$emit('close')
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
|
||||
// 编辑
|
||||
eidtMedia(index, row) {
|
||||
this.editMediaVisible = true
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row
|
||||
}
|
||||
},
|
||||
|
||||
// 排序
|
||||
sortMedia(index, row) {
|
||||
this.editData = {
|
||||
title: '编辑排序',
|
||||
data: {
|
||||
mediaId: row.id,
|
||||
rank: row.rank,
|
||||
objectId: this.searchData.objectId,
|
||||
type: this.searchData.type
|
||||
}
|
||||
}
|
||||
this.editVisible = true
|
||||
},
|
||||
|
||||
// 关闭编辑弹窗
|
||||
closeEdit() {
|
||||
this.editData = {
|
||||
title: '新增',
|
||||
data: {}
|
||||
}
|
||||
this.editVisible = false
|
||||
this.editMediaVisible = false
|
||||
this.getTopicMediaSearch()
|
||||
},
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getTopicMediaSearch()
|
||||
},
|
||||
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getTopicMediaSearch()
|
||||
},
|
||||
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getTopicMediaSearch()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,328 @@
|
||||
|
||||
<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 v-model="searchData.name" @clear="onClear('name')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入主题Id" clearable v-model.number="searchData.objectId" @clear="onClear('objectId')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择视频所属位置" clearable v-model="searchData.location" @clear="onClear('location')">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in videoLocationList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择分类" clearable v-model="searchData.categoryId" @clear="onClear('categoryId')" filterable allow-create default-first-option>
|
||||
<el-option v-for="item in filterCategory" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
<el-select placeholder="请选择状态" clearable v-model="searchData.status" @clear="onClear('status')" filterable allow-create default-first-option>
|
||||
<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-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" :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="主题名称" width="150">
|
||||
<template slot-scope="scope">{{ scope.row.name }}</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">{{ scope.row.price | changeMoneyYuan }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="主题所属分类">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.categoryId | changeName(videoList, 'id', 'name') }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="展示方式" width="180">
|
||||
<template slot-scope="scope">{{ scope.row.showType | changTopicshowType }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="所属位置" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.location | changeLocation }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否开启换一换" width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-button :type="scope.row.changeStatus ? 'success' : 'danger'" plain size="mini">{{ scope.row.changeStatus ? '开启' : '关闭' }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否开启轮播" width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-button :type="scope.row.isCarousel ? 'success' : 'danger'" plain size="mini">{{ scope.row.isCarousel ? '开启' : '关闭' }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="排序值" width="100">
|
||||
<template slot-scope="scope">{{ scope.row.sort }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="观看次数" width="150">
|
||||
<template slot-scope="scope">{{ scope.row.watchTimes }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="封面图" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width: 40px; height: 40px; margin: 0 auto; line-height: 40px" :urls="scope.row.cover"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="背景图" width="100px">
|
||||
<template slot-scope="scope">
|
||||
<ShowImg style="width: 40px; height: 40px; margin: 0 auto; line-height: 40px" :urls="scope.row.background"></ShowImg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="标签" width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-tag style="margin: 2px" v-for="item in scope.row.tagIds" :key='item' size="mini">
|
||||
{{ item |changeName(mediatagArr,'id','name')}}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="主题展示模式" width="600" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.bindType|changeBindTypeList }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="主题描述" width="600" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.desc }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="主题状态" width="100">
|
||||
<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="300">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="showMediaList(scope.$index, scope.row)" size="mini" type="primary">查看视频列表</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 :locationList="locationList" :contentTypeList="contentTypeList" :mediatagArr="mediatagArr" :data="editData" v-if="editVisible" @close="closeEdit" />
|
||||
<MediaList :data="editData" v-if="mediaListVisible" @close="closeEdit" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// 引入模块
|
||||
import Edit from './components/AddOrEdit'
|
||||
import MediaList from './components/mediaList'
|
||||
import { topicSearch, topicDel } from '@/api/videoManagement/topic'
|
||||
import { mediacategoryList } from '@/api/videoManagement/mediacategory'
|
||||
import { locationList, contentTypeList, videoLocationList } from '@/filters/mediaLibrary/videoList'
|
||||
import { mediatagList } from '@/api/videoManagement/mediatag'
|
||||
|
||||
import ShowImg from '@/components/ShowImg/index.vue'
|
||||
export default {
|
||||
name: 'Topic',
|
||||
components: {
|
||||
Edit,
|
||||
MediaList,
|
||||
ShowImg
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
contentTypeList: contentTypeList(),
|
||||
locationList: locationList(),
|
||||
videoLocationList: videoLocationList(),
|
||||
mediatagArr: [], // 存储所有标签
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
categoryId: undefined,
|
||||
name: undefined,
|
||||
objectId: undefined,
|
||||
contentType: undefined,
|
||||
status: undefined,
|
||||
location: undefined
|
||||
},
|
||||
resData: [], // el-table表格数据
|
||||
editVisible: false, // 新增或编辑弹出框
|
||||
mediaListVisible: false,
|
||||
total: 0, // 数据总条数
|
||||
loading: true, // 列表加载状态
|
||||
// 编辑数据
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {}
|
||||
},
|
||||
videoList: []
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// 过去分类列表
|
||||
filterCategory() {
|
||||
if (this.searchData.location) {
|
||||
const arr = this.videoList.filter(item => {
|
||||
return item.location === this.searchData.location
|
||||
})
|
||||
return arr
|
||||
} else {
|
||||
return this.videoList
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getMediatagList()
|
||||
this.videoTypeInfo()
|
||||
},
|
||||
methods: {
|
||||
// TODO:请求标签列表数据
|
||||
getMediatagList() {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 5000
|
||||
}
|
||||
mediatagList(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.mediatagArr = res.data.list
|
||||
} else {
|
||||
this.mediatagArr = []
|
||||
this.$message.error('请求标签列表数据失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO:请求主题分类列表数据
|
||||
videoTypeInfo() {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 500
|
||||
}
|
||||
mediacategoryList(param).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.videoList = res.data.list
|
||||
this.getTopicSearch()
|
||||
} else {
|
||||
this.$message.error('请求列表失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// TODO：请求主题列表数据
|
||||
getTopicSearch() {
|
||||
this.loading = true
|
||||
topicSearch(this.searchData).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.$message.error('请求列表失败!')
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
|
||||
// TODO：删除主题列表数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
topicDel({ id: row.id }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.getTopicSearch()
|
||||
this.$message.success('成功删除!')
|
||||
} else {
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
onSearch() {
|
||||
this.searchData.pageNum = 1
|
||||
this.searchData.pageSize = 10
|
||||
this.getTopicSearch()
|
||||
},
|
||||
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getTopicSearch()
|
||||
},
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getTopicSearch()
|
||||
},
|
||||
|
||||
// 新增按钮
|
||||
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.mediaListVisible = false
|
||||
this.getTopicSearch()
|
||||
},
|
||||
// 查看视频列表
|
||||
showMediaList(index, row) {
|
||||
this.mediaListVisible = true
|
||||
this.editData = {
|
||||
title: '视频列表',
|
||||
type: 3,
|
||||
data: row
|
||||
}
|
||||
},
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getTopicSearch()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,110 @@
|
||||
<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="请输入名称" 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="rank">
|
||||
<el-input v-model.number="form.rank" placeholder="请输入排序" 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="是否启用" 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 {
|
||||
mediacollectcategoryUpdate,
|
||||
mediacollectcategoryAdd
|
||||
} from '@/api/videoManagement/videoCollectCategory'
|
||||
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data'],
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
name: undefined, // "string"
|
||||
rank: undefined, // 0,排序
|
||||
status: true // true,是否启用
|
||||
},
|
||||
rules: {}
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
if (this.title === '编辑') {
|
||||
this.form = { ...this.data.data }
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// TODO：新增视频分类数据
|
||||
add(data) {
|
||||
mediacollectcategoryAdd(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('新增失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO：编辑视频分类数据
|
||||
update(data) {
|
||||
mediacollectcategoryUpdate(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,200 @@
|
||||
|
||||
<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-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="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="名称">
|
||||
<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.status ? "已开启" : "已关闭"
|
||||
}}</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="创建时间" 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 {
|
||||
mediacollectcategoryList,
|
||||
mediacollectcategoryDel
|
||||
} from '@/api/videoManagement/videoCollectCategory'
|
||||
export default {
|
||||
name: 'VideoType',
|
||||
components: {
|
||||
Edit
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
mediatagArr: [], // 存储所有标签
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 50,
|
||||
id: undefined // 视频位置
|
||||
},
|
||||
resData: [], // el-table表格数据
|
||||
editVisible: false, // 新增或编辑弹出框
|
||||
total: 0, // 数据总条数
|
||||
loading: true, // 列表加载状态
|
||||
// 编辑数据
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {}
|
||||
}
|
||||
}
|
||||
},
|
||||
filters: {
|
||||
// 展示方式过滤函数
|
||||
changeShowType(val) {
|
||||
switch (val) {
|
||||
case 1:
|
||||
return '主题'
|
||||
case 2:
|
||||
return '瀑布流'
|
||||
case 3:
|
||||
return '推荐'
|
||||
case 4:
|
||||
return '排行榜'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
|
||||
// TODO:请求视频分类列表数据
|
||||
getList() {
|
||||
this.loading = true
|
||||
mediacollectcategoryList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.$message.error('请求列表失败!')
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
// TODO:删除视频分类列表数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
mediacollectcategoryDel({ 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.mediaListVisible = false
|
||||
this.getList()
|
||||
},
|
||||
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,379 @@
|
||||
<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="请选择视频所属位置" clearable @change="changeLocationFn" 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-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-row>
|
||||
|
||||
<el-row :gutter="24">
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="视频状态">
|
||||
<el-select placeholder="请选择视频状态" clearable v-model="form.status">
|
||||
<el-option v-for="(item, index) in MediaSatusList" :key="index" :label="item.label" :value="item.value" />
|
||||
</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="请选择所视频合集" 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 mediaCollList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<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.price" style="width: 180px">
|
||||
<template slot="append">元</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="圈子">
|
||||
<el-select style="width: 163px" placeholder="请选择圈子" v-model="form.circleId" filterable>
|
||||
<el-option :key="index + item.name" :label="item.name" :value="item.id" v-for="(item, index) in circleList" />
|
||||
</el-select>
|
||||
</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.number="form.preTime" style="width: 180px" />
|
||||
</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-input v-model.number="form.fake.watchTimes" 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.fake.likes" 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.fake.comments" 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.fake.sells" 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.fake.shares" 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-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="是否是vip">
|
||||
<el-switch v-model="form.isVip" active-color="#13ce66" inactive-color="#ff4949" style="width: 180px"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="是否热搜">
|
||||
<el-switch v-model="form.isHotSearches" active-color="#13ce66" inactive-color="#ff4949" style="width: 180px"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
|
||||
<el-form-item label="是否精选">
|
||||
<el-switch v-model="form.isRecomend" active-color="#13ce66" inactive-color="#ff4949" style="width: 180px"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 主题 -->
|
||||
<el-divider content-position="center">主题绑定设置</el-divider>
|
||||
<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.topicIds" filterable allow-create default-first-option multiple @change="selectTopic">
|
||||
<el-option :key="index" :label="item.name" :value="item.id" v-for="(item, index) in chooseVideoType" />
|
||||
</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="标签绑定主题" v-model="form.tagTopicIds" disabled multiple>
|
||||
<el-option :key="index" :label="item.name" :value="item.id" v-for="(item, index) in chooseVideoType" />
|
||||
</el-select>
|
||||
</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-row>
|
||||
<!-- 标签 -->
|
||||
<el-divider content-position="center">标签绑定设置</el-divider>
|
||||
<TagSelectV2 type="resourceManagement" ref="TagSelect" @selectTags="selectTags" :formTags="form.tags" :mediatagCategory="newMediatagCategory" :allTags="allMediaList" />
|
||||
</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, mediatagTopic } from '@/api/videoManagement/videoList'
|
||||
import { contentTypeList, videoLocationList } from '@/filters/mediaLibrary/videoList'
|
||||
import { mediaAllList } from '@/api/postManagement/newList'
|
||||
import TagSelectV2 from '@/components/TagSelectV2/index'
|
||||
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data', 'videoType', 'actorList', 'circleList', 'mediaCollList', 'mediatagCategory'],
|
||||
components: {
|
||||
UploadImg,
|
||||
AddVideo,
|
||||
TagSelectV2
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
showTagsFlag: false,
|
||||
Visible: true,
|
||||
title: '',
|
||||
allMediaList: [],
|
||||
contentTypeList: contentTypeList(),
|
||||
MediaSatusList: MediaSatusList(),
|
||||
videoLocationList: videoLocationList(),
|
||||
chooseVideoType: [], // 过滤后的视频主题
|
||||
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",详细描述
|
||||
fake: {},
|
||||
isVip: undefined, // true,是否VIp
|
||||
price: undefined, // 0,售价，单位分
|
||||
publishAvatar: undefined, // 视频发布者头像
|
||||
publishId: undefined, // 发布者ID
|
||||
status: undefined, // 0,视频状态
|
||||
title: undefined, // "string",标题
|
||||
topicIds: [], // 视频分类
|
||||
mediaSet: undefined, // 视频归属
|
||||
id: undefined, // 0,视频Id
|
||||
isHotSearches: undefined,
|
||||
isRecomend: undefined,
|
||||
collectionId: [] // 合集id
|
||||
},
|
||||
rules: {},
|
||||
searchTagTxt: '' // 本地标签搜索
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
if (this.title === '编辑') {
|
||||
this.form = { ...this.data.data }
|
||||
this.form.price = Number(changeMoneyYuan(this.form.price))
|
||||
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
|
||||
}
|
||||
this.chooseVideoType = JSON.parse(JSON.stringify(this.videoType))
|
||||
this.getMediaAllList(this.form.location)
|
||||
},
|
||||
computed: {
|
||||
newMediatagCategory() {
|
||||
let arr = []
|
||||
if (this.form.location === 1 || this.form.location === 3) {
|
||||
arr = this.mediatagCategory.filter(item => {
|
||||
return item.location === this.form.location
|
||||
})
|
||||
return arr
|
||||
} else {
|
||||
return this.mediatagCategory
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 切换location
|
||||
changeLocationFn(val) {
|
||||
this.getMediaAllList(val)
|
||||
this.chooseVideoType = this.chooseVideoType.filter(item => {
|
||||
return item.location === val
|
||||
})
|
||||
},
|
||||
// 请求带分类的标签列表
|
||||
async getMediaAllList(location) {
|
||||
await mediaAllList({ pageNum: 1, pageSize: 100, location }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.allMediaList = res.data.list
|
||||
} else {
|
||||
this.allMediaList = []
|
||||
this.$message.error('请求标签分类失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
selectTopic() {
|
||||
this.form.tagTopicIds = []
|
||||
},
|
||||
|
||||
selectTags(tags) {
|
||||
if (!this.form.topicIds.length) {
|
||||
mediatagTopic({ ids: tags }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.form.tagTopicIds = [res.data.id]
|
||||
this.form.topicIds = []
|
||||
}
|
||||
})
|
||||
}
|
||||
this.form.tags = tags
|
||||
},
|
||||
|
||||
// TODO：
|
||||
update(data) {
|
||||
mediaUpdate(data).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.close()
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 新增时视频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
|
||||
},
|
||||
// 在可选择列表过滤出已选择的标签
|
||||
fliterTagType(tagID) {
|
||||
if (this.form.tags.indexOf(tagID) !== -1) {
|
||||
return 'danger'
|
||||
} else {
|
||||
return 'info'
|
||||
}
|
||||
},
|
||||
// 删除已选择列表中的标签
|
||||
handleTagClose(tag) {
|
||||
this.form.tags.splice(this.form.tags.indexOf(tag), 1)
|
||||
},
|
||||
|
||||
// 点击可选择列表中的标签
|
||||
handleClickTag(tagID) {
|
||||
if (this.form.tags.indexOf(tagID) === -1) {
|
||||
this.form.tags.push(tagID)
|
||||
}
|
||||
},
|
||||
// 提交按钮
|
||||
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) : []
|
||||
if (data.param.price !== undefined) {
|
||||
data.param.price = changeMoneyFen(data.param.price)
|
||||
}
|
||||
data.param.companiesId = Number(data.param.companiesId)
|
||||
data.param.fake.watchTimes = data.param.fake.watchTimes ? Number(data.param.fake.watchTimes) : 0
|
||||
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,252 @@
|
||||
|
||||
<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-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="是否精选" prop="status">
|
||||
<el-select placeholder="请选择信息分类" clearable v-model="form.isRecomend" style="width: 180px">
|
||||
<el-option label="否" :value="false" />
|
||||
<el-option label="是" :value="true" />
|
||||
</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,
|
||||
isRecomend: 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,
|
||||
isRecomend: 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
|
||||
data.param.isRecomend = this.form.isRecomend
|
||||
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,93 @@
|
||||
<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="12" :md="12" :sm="12" :xl="12" :xs="12">
|
||||
<el-form-item label="点赞数">
|
||||
<el-input v-model.number="form.likes" placeholder="请输入点赞数" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="12">
|
||||
<el-form-item label="评分">
|
||||
<el-input v-model="form.score" placeholder="请输入评分" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="12">
|
||||
<el-form-item label="评论置顶">
|
||||
<el-switch v-model="form.isTop" active-color="#13ce66" inactive-color="#ff4949">
|
||||
</el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :lg="12" :md="12" :sm="12" :xl="12" :xs="12">-->
|
||||
<!-- <el-form-item label="系统置顶">-->
|
||||
<!-- <el-switch v-model="form.isTopAll" :disabled="form.userId !== 1" active-color="#13ce66" inactive-color="#ff4949">-->
|
||||
<!-- </el-switch>-->
|
||||
<!-- </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 { commentUpdate } from '@/api/videoManagement/commentManage'
|
||||
export default {
|
||||
name: 'EditScore',
|
||||
props: ['data'],
|
||||
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
likes: undefined,
|
||||
score: undefined,
|
||||
isTop: undefined, // 是否置顶（当前媒体评论区）
|
||||
isTopAll: undefined // 是否置顶（所有媒体评论区+弹幕）
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
this.form = { ...this.data.data }
|
||||
this.formData = Object.assign({}, this.form)
|
||||
},
|
||||
methods: {
|
||||
// TODO:更新评分
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
this.form.score = this.form.score ? Number(this.form.score) : 0
|
||||
const data = {
|
||||
id: this.data.data.id,
|
||||
param: {
|
||||
likes: this.form.likes,
|
||||
score: this.form.score,
|
||||
isTop: this.form.isTop,
|
||||
isTopAll: this.form.isTopAll
|
||||
}
|
||||
}
|
||||
commentUpdate(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close', false)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,96 @@
|
||||
<template>
|
||||
<el-dialog :close-on-click-modal="false" :title="title" :visible.sync="Visible" @close="close" center class="ac-dialog" width="350px">
|
||||
<el-form :inline="true" :model="form" class="demo-form-inline" label-position="right" label-width="100px" ref="form">
|
||||
<el-row :gutter="24">
|
||||
<el-form-item label="审核状态" prop="reviewStatus">
|
||||
<el-select
|
||||
placeholder="请选择审核状态"
|
||||
clearable
|
||||
v-model="form.reviewStatus"
|
||||
style="width: 180px">
|
||||
<el-option label="未审核" :value="0" />
|
||||
<el-option label="审核通过" :value="1" />
|
||||
<el-option label="审核拒绝" :value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</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 { commentReview, commentReviewBatch } from '@/api/videoManagement/commentManage'
|
||||
export default {
|
||||
name: 'EditScore',
|
||||
props: ['data'],
|
||||
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
title: '审核列表',
|
||||
// 表单数据
|
||||
form: {
|
||||
reviewStatus: undefined
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
console.log(this.data, 'datadatadata')
|
||||
this.title = this.data.title
|
||||
if (this.title !== '批量审核') {
|
||||
this.form = { ...this.data.data }
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// TODO:提交评论审核
|
||||
submit(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.data.title === '批量审核') {
|
||||
const id = []
|
||||
for (let index = 0; index < this.data.data.length; index++) {
|
||||
const element = this.data.data[index]
|
||||
id.push(element.id)
|
||||
}
|
||||
console.log(id, 'ididididid')
|
||||
const data = {
|
||||
ids: id,
|
||||
reviewStatus: this.form.reviewStatus
|
||||
}
|
||||
commentReviewBatch(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
} else {
|
||||
const data = {
|
||||
id: this.data.data.id,
|
||||
reviewStatus: this.form.reviewStatus
|
||||
}
|
||||
commentReview(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('更新成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('更新失败')
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.$emit('close', false)
|
||||
}
|
||||
}
|
||||
}
|
||||
</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,276 @@
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog title="评论列表" :visible.sync="Visible" width="90%" center class="ac-dialog" :close-on-click-modal="false" @close="close">
|
||||
<el-row style="margin-bottom:10px">
|
||||
<el-col>
|
||||
<el-button @click="onAddComments()" size="mini" type="success">批量添加评论</el-button>
|
||||
<el-button @click="onAddComment()" size="mini" type="success">新增单条评论</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col>
|
||||
<el-table :data="resData" border height="600px" style="width: 100%" highlight-current-row>
|
||||
<el-table-column align="center" label="用户名称" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.userName }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="评论级别" width="100">
|
||||
<template slot-scope="scope">{{ scope.row.level|changeCommentManageLevel}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="评论内容" width="200">
|
||||
<template slot-scope="scope">{{ scope.row.text }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="状态" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.status | changeCommentStatus }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="评论置顶" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.isTop ? '是' : '否' }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="系统置顶" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.isTopAll ? '是' : '否' }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="点赞数" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.likes }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="评分" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.score }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="上级评论ID" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.parentsId }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="被评论消息ID" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.replyId }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="被评论用户名称" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.replyUserName }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="回复人数" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.commentCount }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="用户会员级别" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.vipType |changevipType}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="审核状态" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.reviewStatus | reviewType}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="创建时间" width="160">
|
||||
<template slot-scope="scope">{{ scope.row.createdAt |BeiJingTime}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="更新时间" width="160">
|
||||
<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 v-if='scope.row.status' @click="unbanUser(scope.row,'status')" size="mini" type="success">解封</el-button>
|
||||
<el-button v-else @click="banUser( scope.row,'status')" size="mini" type="danger">封禁</el-button>
|
||||
<el-button @click="review(scope.$index, scope.row)" size="mini" type="success">审核</el-button>
|
||||
<el-button @click="edit(scope.$index, scope.row)" size="mini" type="success">编辑</el-button>
|
||||
<el-button @click="reply(scope.$index, scope.row)" size="mini" type="success">回复</el-button>
|
||||
<el-button @click="delet(scope.$index, scope.row)" size="mini" type="danger">删除</el-button>
|
||||
<el-button @click="deletAll(scope.$index, scope.row)" size="mini" type="info">删除该用户所有评论</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="close()"> 确 定 </el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<Edit :data="editData" v-if='editVisible' @close="closeEdit" />
|
||||
<EditScore :data="editData" v-if='editScoreVisible' @close="closeEdit" />
|
||||
<Review :data="editData" v-if='revieweVisible' @close="closeEdit" />
|
||||
<BanUser :data="editData" v-if='banUserVisible' @close="closeEdit"></BanUser>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
commentList,
|
||||
commentDelete,
|
||||
commentDeluser
|
||||
} from '@/api/videoManagement/commentManage'
|
||||
import { userUnBan } from '@/api/user/userList'
|
||||
import BanUser from '@/views/user/userList/components/banUser'
|
||||
import Edit from '@/views/videoManagement/commentManage/components/AddOrEdit'
|
||||
import EditScore from '@/views/videoManagement/videoList/components/editScore'
|
||||
import Review from '@/views/videoManagement/videoList/components/review'
|
||||
|
||||
// import qs from 'qs'
|
||||
export default {
|
||||
name: 'VideoComment',
|
||||
props: ['data', 'objectype'],
|
||||
components: {
|
||||
Edit,
|
||||
EditScore,
|
||||
BanUser,
|
||||
Review
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
Visible: true,
|
||||
// 表单数据
|
||||
searchData: {
|
||||
objectId: undefined, // 对象ID
|
||||
pageNum: 1,
|
||||
pageSize: 10
|
||||
},
|
||||
resData: [],
|
||||
total: 0,
|
||||
banUserVisible: false,
|
||||
editVisible: false,
|
||||
editScoreVisible: false,
|
||||
revieweVisible: false
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.searchData.objectId = this.data.data.id
|
||||
this.getCommentListSearch()
|
||||
},
|
||||
methods: {
|
||||
// TODO:请求评论列表数据
|
||||
getCommentListSearch() {
|
||||
commentList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.totalCount
|
||||
} else {
|
||||
this.$message.error('请求列表失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO：用户解封
|
||||
unbanUser(row) {
|
||||
userUnBan({ userId: row.userId }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('解封成功')
|
||||
this.getCommentListSearch()
|
||||
} else {
|
||||
this.$message.error('解封失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO：删除评论列表数据
|
||||
delet(key, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
commentDelete({ id: row.id }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('删除成功')
|
||||
this.getCommentListSearch()
|
||||
} else {
|
||||
this.$message.error('删除失败')
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
// TODO:删除用户所有评论
|
||||
deletAll(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
commentDeluser({ id: row.userId }).then((ret) => {
|
||||
if (ret.code === 200) {
|
||||
this.$message.success('删除所有评论成功')
|
||||
this.getCommentListSearch()
|
||||
} else {
|
||||
this.$message.error('删除所有评论失败')
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
// 关闭编辑
|
||||
close() {
|
||||
this.banUserVisible = false
|
||||
this.editVisible = false
|
||||
this.editScoreVisible = false
|
||||
this.revieweVisible = false
|
||||
this.$emit('close')
|
||||
},
|
||||
// 关闭编辑弹窗
|
||||
closeEdit() {
|
||||
this.banUserVisible = false
|
||||
this.editVisible = false
|
||||
this.editScoreVisible = false
|
||||
this.revieweVisible = false
|
||||
this.getCommentListSearch()
|
||||
},
|
||||
|
||||
// 添加单条评论
|
||||
onAddComment(row) {
|
||||
this.editData = {
|
||||
title: '添加评论',
|
||||
data: {
|
||||
userId: 0,
|
||||
objectId: this.searchData.objectId,
|
||||
objectype: this.objectype
|
||||
}
|
||||
}
|
||||
this.editVisible = true
|
||||
},
|
||||
// 批量添加评论
|
||||
onAddComments() {
|
||||
this.editData = {
|
||||
title: '批量添加评论',
|
||||
data: {
|
||||
objectId: this.searchData.objectId,
|
||||
objectype: this.objectype
|
||||
}
|
||||
}
|
||||
this.editVisible = true
|
||||
},
|
||||
// 回复
|
||||
reply(index, row) {
|
||||
this.editVisible = true
|
||||
this.editData = {
|
||||
title: '回复消息',
|
||||
data: row
|
||||
}
|
||||
},
|
||||
// 审核
|
||||
review(index, row) {
|
||||
this.revieweVisible = true
|
||||
this.editData = {
|
||||
title: '审核列表',
|
||||
data: row
|
||||
}
|
||||
},
|
||||
// 更新评分
|
||||
edit(index, row) {
|
||||
this.editScoreVisible = true
|
||||
this.editData = {
|
||||
title: '编辑',
|
||||
data: row
|
||||
}
|
||||
},
|
||||
// 封禁用户
|
||||
banUser(row) {
|
||||
this.editData = {
|
||||
id: row.userId
|
||||
}
|
||||
this.banUserVisible = true
|
||||
},
|
||||
// 切换每页数据量
|
||||
handleSizeChange(val) {
|
||||
this.searchData.pageSize = val
|
||||
this.getCommentListSearch()
|
||||
},
|
||||
|
||||
// 切换页数
|
||||
handleCurrentChange(val) {
|
||||
this.searchData.pageNum = val
|
||||
this.getCommentListSearch()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,724 @@
|
||||
|
||||
<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="请输入发布者Id" clearable v-model.number="searchData.publishId" @clear="onClear('publishId')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-input placeholder="请输入演员Id" clearable v-model.number="searchData.actorId" @clear="onClear('actorId')" />
|
||||
</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.priceType" @clear="onClear('priceType')">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in MediaPayTypeList" />
|
||||
</el-select>
|
||||
</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')">
|
||||
<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.number="searchData.isRecomend" @clear="onClear('isRecomend')">
|
||||
<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.topicId" @clear="onClear('topicId')" filterable allow-create default-first-option>
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in videoType" />
|
||||
</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-input placeholder="请输入媒资库Id" clearable v-model="searchData.fileId" @clear="onClear('fileId')" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择视频所属位置" clearable v-model="searchData.location" @clear="onClear('location')">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in videoLocationList" />
|
||||
</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="batch" icon="el-icon-edit-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="排序">
|
||||
<template slot-scope="scope">{{ scope.row.rank }}</template>
|
||||
</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">
|
||||
<template slot-scope="scope">{{ scope.row.publishId }}</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="300px" show-overflow-tooltip>
|
||||
<template slot-scope="scope">
|
||||
<template v-for="(item, index) in scope.row.collectionId">
|
||||
<el-tag style="margin: 2px" :key="index + 'tagData'" size="mini">
|
||||
{{ item | changeName(mediaCollList, 'id', 'name') }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</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="视频类型">
|
||||
<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 | changeVideoLocation }}</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="100px" show-overflow-tooltip>
|
||||
<template slot-scope="scope">{{ scope.row.preTime }}</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.tags">
|
||||
<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="300px">
|
||||
<template slot-scope="scope">
|
||||
<template v-for="(item, index) in scope.row.topicIds">
|
||||
<el-tag style="margin: 2px" :key="index + 'tagData'" size="mini">
|
||||
{{ item | changeName(videoType, 'id', 'name') }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</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="100px">
|
||||
<template slot-scope="scope">{{ scope.row.price | changeMoneyYuan }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否VIp" width="120px">
|
||||
<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="是否热搜" width="120px">
|
||||
<template slot-scope="scope">
|
||||
<el-button :type="scope.row.isHotSearches ? 'success' : 'danger'" plain size="mini">{{ scope.row.isHotSearches ? '是' : '否' }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="是否精选" width="120px">
|
||||
<template slot-scope="scope">
|
||||
<el-button :type="scope.row.isRecomend ? 'success' : 'danger'" plain size="mini">{{ scope.row.isRecomend ? '是' : '否' }}</el-button>
|
||||
</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" width="120px" label="本周观看次数">
|
||||
<template slot-scope="scope">{{ scope.row.real.weekWatchs }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" width="120px" label="本月观看次数">
|
||||
<template slot-scope="scope">{{ scope.row.real.monthWatchs }}</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="真实信息">
|
||||
<el-table-column align="center" label="评论数">
|
||||
<template slot-scope="scope">{{ scope.row.real.comments }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="点赞数">
|
||||
<template slot-scope="scope">{{ scope.row.real.likes }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="收藏数">
|
||||
<template slot-scope="scope">{{ scope.row.real.collects }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="售卖数">
|
||||
<template slot-scope="scope">{{ scope.row.real.sells }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="分享数">
|
||||
<template slot-scope="scope">{{ scope.row.real.shares }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="观看数">
|
||||
<template slot-scope="scope">{{ scope.row.real.watchTimes }}</template>
|
||||
</el-table-column>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="虚拟信息">
|
||||
<el-table-column align="center" label="评论数">
|
||||
<template slot-scope="scope">{{ scope.row.fake.comments }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="点赞数">
|
||||
<template slot-scope="scope">{{ scope.row.fake.likes }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="收藏数">
|
||||
<template slot-scope="scope">{{ scope.row.fake.collects }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="售卖数">
|
||||
<template slot-scope="scope">{{ scope.row.fake.sells }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="分享数">
|
||||
<template slot-scope="scope">{{ scope.row.fake.shares }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="观看数">
|
||||
<template slot-scope="scope">{{ scope.row.fake.watchTimes }}</template>
|
||||
</el-table-column>
|
||||
</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="onAddComment(scope.row)" size="mini" type="success">添加评论</el-button>
|
||||
<el-button @click="handleEdit(scope.row)" size="mini" type="primary">编辑</el-button>
|
||||
<el-button @click="toTop(scope.$index, 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"
|
||||
:videoType="videoType"
|
||||
:actorList="actorList"
|
||||
:circleList="circleList"
|
||||
:mediaCollList="mediaCollList"
|
||||
:data="editData"
|
||||
v-if="editVisible"
|
||||
@close="closeEdit"/>
|
||||
<EditCom :data="editData" v-if="editComVisible" :objectype="1" @close="closeEdit" />
|
||||
|
||||
<ShowVideo ref="showvideo"></ShowVideo>
|
||||
<Batch :mediaCollList="mediaCollList" :data="selectBatch" :videoType="videoType" :actorList="actorList" :circleList="circleList" v-if="batchVisible" @close="closeEdit"></Batch>
|
||||
<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 EditCom from './components/videoComment'
|
||||
import Batch from './components/batch'
|
||||
import SetTag from './components/setTag'
|
||||
import AddVideo2 from './components/addVideo2.vue'
|
||||
import DelTag from './components/delTag'
|
||||
|
||||
import { actressSearch } from '@/api/videoManagement/actressList'
|
||||
import { contentTypeList, videoLocationList } from '@/filters/mediaLibrary/videoList'
|
||||
|
||||
import { rankSo, MediaPayTypeList, MediaSatusList } from '@/filters/videoManagement/videoList'
|
||||
import { mediaSearch, mediaDel } from '@/api/videoManagement/videoList'
|
||||
import ShowVideo from '@/components/ShowVideo/index.vue'
|
||||
import { mediatagList } from '@/api/videoManagement/mediatag'
|
||||
import { topicSearch, topicMediaTop } from '@/api/videoManagement/topic'
|
||||
import { circleListSearch } from '@/api/user/circleList'
|
||||
import { mediacollList } from '@/api/videoManagement/collectionList'
|
||||
import { mediatagCategoryList } from '@/api/videoManagement/videoTagType'
|
||||
// import ShareUrl from './components/shareUrl'
|
||||
export default {
|
||||
name: 'VideoList',
|
||||
components: {
|
||||
Edit,
|
||||
ShowImg,
|
||||
ShowVideo,
|
||||
Batch,
|
||||
EditCom,
|
||||
SetTag,
|
||||
AddVideo2,
|
||||
// ShareUrl,
|
||||
DelTag
|
||||
},
|
||||
filters: {
|
||||
videoType(v) {
|
||||
switch (v) {
|
||||
case 1:
|
||||
return '长视频'
|
||||
case 2:
|
||||
return '短视频'
|
||||
case 3:
|
||||
return '动漫'
|
||||
default:
|
||||
return '未知'
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isRecomendList: [
|
||||
{
|
||||
label: '是',
|
||||
value: true
|
||||
}
|
||||
],
|
||||
mediatag: [],
|
||||
videoType: [],
|
||||
actorList: [], // 女优列表
|
||||
MediaPayTypeList: MediaPayTypeList(),
|
||||
circleList: [],
|
||||
mediaCollList: [],
|
||||
rankSo: rankSo(),
|
||||
MediaSatusList: MediaSatusList(),
|
||||
contentTypeList: contentTypeList(),
|
||||
videoLocationList: videoLocationList(),
|
||||
mediatagCategory: [],
|
||||
// MediacolumnList: [],
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
fileId: undefined, // 媒资库id
|
||||
id: undefined, // 0,视频Id
|
||||
actorId: undefined, // 演员id
|
||||
bango: undefined,
|
||||
contentType: undefined, // 格式类型 1:AV 2:小视频 3:动漫
|
||||
end: undefined, // "string",结束时间
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
priceType: undefined, // 0,收费状态
|
||||
publishId: undefined, // 发布者id
|
||||
start: undefined, // "string",开始时间
|
||||
status: undefined, // 0,视频状态
|
||||
isRecomend: undefined, // 是否精选
|
||||
sort: undefined, // "string",媒体状态 operatAt(编辑时间)/addedTime(上架时间)/createdAt(创建时间)/updatedAt(更新时间)
|
||||
title: undefined, // "string",标题
|
||||
tagId: undefined,
|
||||
topicId: undefined,
|
||||
location: undefined
|
||||
},
|
||||
time: undefined,
|
||||
resData: [], // el-table表格数据
|
||||
total: 0, // 数据总条数
|
||||
loading: true, // 列表加载状态
|
||||
// 编辑数据
|
||||
editVisible: false, // 新增或编辑弹出框
|
||||
editComVisible: false, // 评论弹出框
|
||||
setTagVisible: false,
|
||||
addVideoVisible: false,
|
||||
showH5Share: false,
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {}
|
||||
},
|
||||
batchVisible: false,
|
||||
videoList: [],
|
||||
selectBatch: [],
|
||||
delTagVisible: false
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.getMediatagList()
|
||||
this.getmediatagCategoryList()
|
||||
this.getMediacategoryList()
|
||||
this.searchData = this.$store.getters.getSeachParam
|
||||
this.getMediaSearch()
|
||||
this.getCircleListSearch()
|
||||
this.getMediacollList()
|
||||
},
|
||||
methods: {
|
||||
// 分享H5
|
||||
H5Share(row) {
|
||||
this.editData = {
|
||||
title: '分享链接',
|
||||
data: {
|
||||
objectId: row.id,
|
||||
contentType: row.contentType
|
||||
}
|
||||
}
|
||||
this.showH5Share = true
|
||||
},
|
||||
// TODO:设置视频置顶
|
||||
toTop(index, row) {
|
||||
this.$confirm('确定置顶?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
topicMediaTop({ id: row.id }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('置顶成功!')
|
||||
} else {
|
||||
this.$message.error(res.tip)
|
||||
}
|
||||
})
|
||||
this.getMediaSearch()
|
||||
})
|
||||
},
|
||||
// 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: '已取消删除'
|
||||
})
|
||||
})
|
||||
},
|
||||
// TODO:请求演员列表数据
|
||||
getActorList() {
|
||||
actressSearch({ pageNum: 1, pageSize: 5000, param: {}}).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.actorList = res.data.list
|
||||
} else {
|
||||
this.actorList = []
|
||||
this.$message.error('请求演员列表失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
delTag() {
|
||||
console.log(111)
|
||||
this.delTagVisible = true
|
||||
},
|
||||
// TODO：请求视频标签列表
|
||||
getMediatagList(val) {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 5000,
|
||||
contentType: val || undefined
|
||||
}
|
||||
mediatagList(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('请求视频主题列表失败!')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
getSizeToMB(val) {
|
||||
return (val / 1024 / 1024).toFixed(2)
|
||||
},
|
||||
|
||||
// 批量选择
|
||||
handleSelectionChange(val) {
|
||||
this.selectBatch = val
|
||||
},
|
||||
|
||||
// 批量加入后台视频库按钮
|
||||
addVideoArray() {
|
||||
this.addVideoVisible = true
|
||||
},
|
||||
|
||||
onAddComment(row) {
|
||||
this.editData = {
|
||||
title: '添加评论',
|
||||
data: {
|
||||
userId: 0,
|
||||
objectId: row.id,
|
||||
objectType: 1
|
||||
}
|
||||
}
|
||||
this.editComVisible = 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 = []
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO：请求合集列表数据
|
||||
getMediacollList() {
|
||||
mediacollList({ pageNum: 1, pageSize: 5000 }).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.mediaCollList = res.data.list || []
|
||||
} else {
|
||||
this.$message.error('请求合集列表失败')
|
||||
this.mediaCollList = []
|
||||
}
|
||||
})
|
||||
},
|
||||
// 批量设置
|
||||
batch() {
|
||||
this.batchVisible = true
|
||||
},
|
||||
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.batchVisible = false
|
||||
this.editVisible = false
|
||||
this.editComVisible = 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>
|
||||
@@ -0,0 +1,118 @@
|
||||
<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="排序" 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="视频标签分类所属位置">
|
||||
<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/videoManagement/videoTagType'
|
||||
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,
|
||||
sort: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/videoManagement/mediatag'
|
||||
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/videoManagement/mediatag'
|
||||
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,303 @@
|
||||
<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, mediatagBatchDel } from '@/api/videoManagement/mediatag'
|
||||
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,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="请输入标签分类名称" clearable @clear="onClear('name')" v-model="searchData.name" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-select placeholder="请选择视频标签分类所属位置" clearable @clear="onClear('location')" v-model="searchData.location">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in videoLocationList" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item >
|
||||
<el-select placeholder="请选择排序" clearable @clear="onClear('sort')" v-model="searchData.sort">
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in [{id:0,name:'正序'},{id:1,name:'倒序'}]" />
|
||||
</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-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="排序" >
|
||||
<template slot-scope="scope">{{ scope.row.rank }}</template>
|
||||
</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.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/videoManagement/videoTagType'
|
||||
import {
|
||||
videoLocationList
|
||||
} from '@/filters/mediaLibrary/videoList'
|
||||
export default {
|
||||
name: 'VideoTagType',
|
||||
components: {
|
||||
Edit, TagList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
videoLocationList:videoLocationList(),
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
name: undefined,
|
||||
location:undefined,
|
||||
sort: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>
|
||||
@@ -0,0 +1,190 @@
|
||||
<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="请输入名称" 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="rank">
|
||||
<el-input v-model.number="form.rank" placeholder="请输入排序" 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="请选择视频标签" multiple clearable v-model="form.tagIds" filterable>
|
||||
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in mediatagArr" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="分类所属位置" label-width="100px">
|
||||
<el-select placeholder="请选择分类所属位置" clearable v-model="form.location" @change="changeLocation">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in locationList" />
|
||||
</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.adsType" filterable>
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in videoTypeMode" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="广告模式" prop="advertisingId">
|
||||
<el-select placeholder="请选择广告模式" clearable v-model="form.newAdsType" filterable>
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in videoNewTypeMode" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="展示方式" prop="advertisingId">
|
||||
<el-select placeholder="请选择展示方式" clearable v-model="form.showType">
|
||||
<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-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12" v-if="form.location===2">
|
||||
<el-form-item label="是否显示遮罩" prop="advertisingId">
|
||||
<el-select placeholder="请选择是否显示遮罩" clearable v-model="form.isBlur" >
|
||||
<el-option :key="0" label="显示" :value="true" />
|
||||
<el-option :key="1" label="关闭" :value="false" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="24" v-if="form.showType===2">
|
||||
<el-col :xs="12" :sm="12" :md="12" :lg="12" :xl="12">
|
||||
<el-form-item label="排序方式" prop="advertisingId">
|
||||
<el-select placeholder="请选择排序方式" clearable v-model="form.sortType">
|
||||
<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="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="rank">
|
||||
<el-input v-model="form.appName" placeholder="请输入应用内名称" style="width: 180px" />
|
||||
</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 {
|
||||
mediacategoryUpdate,
|
||||
mediacategoryAdd
|
||||
} from '@/api/videoManagement/mediacategory'
|
||||
import { locationList } from '@/filters/mediaLibrary/videoList'
|
||||
import { videoNewTypeMode } from '@/filters/videoManagement/videoType'
|
||||
export default {
|
||||
name: 'AddOrEdit',
|
||||
props: ['data', 'mediatagArr'],
|
||||
data() {
|
||||
return {
|
||||
videoNewTypeMode: videoNewTypeMode(),
|
||||
locationList: locationList(),
|
||||
Visible: true,
|
||||
title: '',
|
||||
// 表单数据
|
||||
form: {
|
||||
sortType: undefined, // 排序方式
|
||||
name: undefined, // "string"
|
||||
advertisingId: undefined, // 广告ID
|
||||
rank: undefined, // 0,排序
|
||||
status: true, // true,是否启用
|
||||
location: undefined, // 位置:
|
||||
showType: undefined, // 展示方式: 1:主题 2:竖版 3:横板
|
||||
tagIds: [],
|
||||
appName: undefined
|
||||
},
|
||||
rules: {}
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.title = this.data.title
|
||||
if (this.title === '编辑') {
|
||||
this.form = { ...this.data.data }
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// TODO：新增视频分类数据
|
||||
add(data) {
|
||||
mediacategoryAdd(data).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message.success('新增成功')
|
||||
this.Visible = false
|
||||
} else {
|
||||
this.$message.error('新增失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
// TODO：编辑视频分类数据
|
||||
update(data) {
|
||||
mediacategoryUpdate(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')
|
||||
},
|
||||
|
||||
// 切换位置
|
||||
changeLocation() {
|
||||
this.form.tagIds = []
|
||||
this.tagIdsList = []
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,250 @@
|
||||
|
||||
<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-select placeholder="请选择分类位置" clearable v-model="searchData.location" @clear="onClear('location')">
|
||||
<el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in videoLocationList" />
|
||||
</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-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="名称">
|
||||
<template slot-scope="scope">{{ scope.row.name }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column align="center" label="标签" width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-tag style="margin: 2px" v-for="item in scope.row.tagIds" :key='item' size="mini">
|
||||
{{ item |changeName(mediatagArr,'id','name')}}
|
||||
</el-tag>
|
||||
</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.isBlur ? "显示" : "关闭"
|
||||
}}</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column align="center" label="广告模式" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.adsType|changeVideoTypeMode}}</template>
|
||||
</el-table-column> -->
|
||||
<el-table-column align="center" label="广告模式" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.newAdsType | changeVideoNewTypeMode }}</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="分类所属位置" width="120">
|
||||
<template slot-scope="scope">{{ scope.row.location|changeLocation}}</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="展示方式" width="80">
|
||||
<template slot-scope="scope">{{ scope.row.showType|changeShowType}}</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" :mediatagArr="mediatagArr" v-if="editVisible" @close="closeEdit" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// 引入模块
|
||||
import Edit from './components/AddOrEdit'
|
||||
import {
|
||||
mediacategoryList,
|
||||
mediacategoryDel
|
||||
} from '@/api/videoManagement/mediacategory'
|
||||
import { videoLocationList } from '@/filters/mediaLibrary/videoList'
|
||||
import { mediatagList } from '@/api/videoManagement/mediatag'
|
||||
export default {
|
||||
name: 'VideoType',
|
||||
components: {
|
||||
Edit
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
mediatagArr: [], // 存储所有标签
|
||||
// 请求列表参数
|
||||
searchData: {
|
||||
pageNum: 1,
|
||||
pageSize: 50,
|
||||
location: undefined // 视频位置
|
||||
},
|
||||
videoLocationList: videoLocationList(),
|
||||
resData: [], // el-table表格数据
|
||||
editVisible: false, // 新增或编辑弹出框
|
||||
total: 0, // 数据总条数
|
||||
loading: true, // 列表加载状态
|
||||
// 编辑数据
|
||||
editData: {
|
||||
title: '新增',
|
||||
data: {}
|
||||
}
|
||||
}
|
||||
},
|
||||
filters: {
|
||||
// 展示方式过滤函数
|
||||
changeShowType(val) {
|
||||
switch (val) {
|
||||
case 1:
|
||||
return '主题'
|
||||
case 2:
|
||||
return '瀑布流'
|
||||
case 3:
|
||||
return '推荐'
|
||||
case 4:
|
||||
return '排行榜'
|
||||
case 5:
|
||||
return '标签'
|
||||
case 6:
|
||||
return '标签模式'
|
||||
case 7:
|
||||
return '头像模式'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.getList()
|
||||
this.getMediatagList()
|
||||
},
|
||||
methods: {
|
||||
// TODO:请求标签列表数据
|
||||
getMediatagList() {
|
||||
const param = {
|
||||
pageNum: 1,
|
||||
pageSize: 5000
|
||||
}
|
||||
mediatagList(param).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.mediatagArr = res.data.list
|
||||
} else {
|
||||
this.mediatagArr = []
|
||||
this.$message.error('请求标签列表数据失败')
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// TODO:请求视频分类列表数据
|
||||
getList() {
|
||||
this.loading = true
|
||||
mediacategoryList(this.searchData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.resData = res.data.list
|
||||
this.total = res.data.total
|
||||
} else {
|
||||
this.$message.error('请求列表失败!')
|
||||
this.resData = []
|
||||
this.total = 0
|
||||
}
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
// TODO:删除视频分类列表数据
|
||||
handleDelete(index, row) {
|
||||
this.$confirm('确定删除?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
mediacategoryDel({ 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.mediaListVisible = false
|
||||
this.getList()
|
||||
},
|
||||
|
||||
// 清空某一项筛选列表
|
||||
onClear(key) {
|
||||
this.searchData[key] = undefined
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user