470 lines
15 KiB
HTML
470 lines
15 KiB
HTML
{extend name="public/base" /} {block name="body"}
|
|
<style>
|
|
.body-content{
|
|
width: 96%;
|
|
height:100%;
|
|
display: flex;
|
|
justify-content: center;
|
|
display:block;
|
|
margin: 0 auto;
|
|
padding-bottom: 50px;
|
|
}
|
|
.tit{
|
|
width: 100%;
|
|
padding-top:18px;
|
|
}
|
|
.inp{
|
|
width: 250px;
|
|
}
|
|
.avatar {
|
|
width: 178px;
|
|
display: block;
|
|
}
|
|
.avatar-uploader .el-upload {
|
|
border: 1px dashed #d9d9d9;
|
|
border-radius: 6px;
|
|
cursor: pointer;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
.avatar-uploader .el-upload:hover {
|
|
border-color: #409EFF;
|
|
}
|
|
.avatar-uploader-icon {
|
|
font-size: 28px;
|
|
color: #8c939d;
|
|
width: 178px;
|
|
height: 178px;
|
|
line-height: 178px;
|
|
text-align: center;
|
|
}
|
|
input[type=file]{
|
|
display: none;
|
|
}
|
|
</style>
|
|
|
|
|
|
<div class="main-box clearfix" id="app">
|
|
<div class="body-content">
|
|
|
|
<div class="tit">
|
|
<el-button type="primary" size="mini" @click="addskits">新增短剧</el-button>
|
|
<el-input v-model="searchinp1" placeholder="剧名" size="mini" style="width:150px;"></el-input>
|
|
<el-button type="primary" size="mini" @click="searchs">搜索</el-button>
|
|
</div>
|
|
|
|
|
|
<el-table
|
|
:data="tableData"
|
|
style="width: 100%">
|
|
|
|
<el-table-column
|
|
fixed
|
|
prop="id"
|
|
label="ID">
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
label="封面">
|
|
<template slot-scope="scope">
|
|
<el-image
|
|
style="width: 100px; height: 140px;border-radius:4px;"
|
|
:src="scope.row.cover"></el-image>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
prop="name"
|
|
label="短剧名">
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
prop="anthology"
|
|
label="集数">
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
prop="latest"
|
|
label="最新">
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
label="状态">
|
|
<template slot-scope="scope">
|
|
<el-tag type="success" v-if="scope.row.status==1">上架</el-tag>
|
|
<el-tag type="danger" v-if="scope.row.status==0">禁用</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
label="进程">
|
|
<template slot-scope="scope">
|
|
<el-tag type="warning" v-if="scope.row.process==0">未完继续</el-tag>
|
|
<el-tag type="success" v-if="scope.row.process==1">已完结</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
label="购买类型">
|
|
<template slot-scope="scope">
|
|
<el-tag v-if="scope.row.buytype==0">按集付费</el-tag>
|
|
<el-tag v-if="scope.row.buytype==1">全本购买</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column
|
|
fixed="right"
|
|
label="操作"
|
|
width="120">
|
|
<template slot-scope="scope">
|
|
|
|
<el-button
|
|
@click="geturl(scope.row.id)"
|
|
type="text"
|
|
size="small">
|
|
章节管理
|
|
</el-button>
|
|
|
|
<el-button
|
|
@click="exitRow(scope.row.id)"
|
|
type="text"
|
|
size="small">
|
|
编辑
|
|
</el-button>
|
|
|
|
<el-button
|
|
@click="deleteRow(scope.row.id)"
|
|
type="text"
|
|
size="small"
|
|
:loading="loadingdel">
|
|
删除
|
|
</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
|
|
|
|
<el-dialog title="新增短剧" :visible.sync="dialogFormVisible">
|
|
<el-form :model="addinfo">
|
|
|
|
<el-form-item label="短剧名" :label-width="formLabelWidth">
|
|
<el-input v-model="addinfo.name" autocomplete="off" class="inp"></el-input>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="简介" :label-width="formLabelWidth">
|
|
<el-input v-model="addinfo.description" autocomplete="off" class="inp" type="textarea"></el-input>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="是否完结" :label-width="formLabelWidth">
|
|
<el-select v-model="addinfo.process" placeholder="是否完结" style="width:108px;">
|
|
<el-option label="未完结" value="0"></el-option>
|
|
<el-option label="已完结" value="1"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="是否上架" :label-width="formLabelWidth">
|
|
<el-select v-model="addinfo.status" placeholder="是否上架" style="width:108px;">
|
|
<el-option label="禁用" value="0"></el-option>
|
|
<el-option label="上架" value="1"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="分类" :label-width="formLabelWidth">
|
|
<el-select v-model="addinfo.category_id" placeholder="分类" style="width:108px;">
|
|
<el-option :label="v.title" :value="v.id" v-for="(v, index) in assort"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="排序" :label-width="formLabelWidth">
|
|
<el-input-number v-model="addinfo.sort" :min="1" :max="100" label="排序" style="width:108px;" controls-position="right"></el-input-number>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="封面" :label-width="formLabelWidth">
|
|
<el-upload
|
|
class="avatar-uploader"
|
|
action="{:url('Skitmanagement/upimg')}"
|
|
:show-file-list="true"
|
|
:on-success="handleAvatarSuccess"
|
|
:before-upload="beforeAvatarUpload">
|
|
<img v-if="imageUrl" :src="imageUrl" class="avatar">
|
|
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
|
|
</el-upload>
|
|
</el-form-item>
|
|
|
|
</el-form>
|
|
<div slot="footer" class="dialog-footer">
|
|
<el-button @click="dialogFormVisible = false">取 消</el-button>
|
|
<el-button type="primary" @click="addinfoposa(addinfo)">确 定</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
|
|
|
|
<el-dialog title="编辑" :visible.sync="dialogFormVisible2">
|
|
<el-form :model="exitdata">
|
|
|
|
<el-form-item label="首页展示栏位" :label-width="formLabelWidth">
|
|
|
|
<el-select
|
|
v-model="exitdata.top"
|
|
multiple
|
|
filterable
|
|
allow-create
|
|
default-first-option
|
|
placeholder="请选择栏位" class="inp">
|
|
<el-option
|
|
v-for="item in exitoptions"
|
|
:key="item.value"
|
|
:label="item.label"
|
|
:value="item.value">
|
|
</el-option>
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="短剧名" :label-width="formLabelWidth">
|
|
<el-input v-model="exitdata.name" autocomplete="off" class="inp"></el-input>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="简介" :label-width="formLabelWidth">
|
|
<el-input v-model="exitdata.description" autocomplete="off" class="inp" type="textarea"></el-input>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="是否完结" :label-width="formLabelWidth">
|
|
<el-select v-model="exitdata.process" placeholder="是否完结" style="width:108px;">
|
|
<el-option label="未完结" value="0"></el-option>
|
|
<el-option label="已完结" value="1"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="是否上架" :label-width="formLabelWidth">
|
|
<el-select v-model="exitdata.status" placeholder="是否上架" style="width:108px;">
|
|
<el-option label="禁用" value="0"></el-option>
|
|
<el-option label="上架" value="1"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="分类" :label-width="formLabelWidth">
|
|
<el-select v-model="exitdata.category_id" placeholder="分类" style="width:108px;">
|
|
<el-option :label="v.title" :value="v.id" v-for="(v, index) in exitdata.assort"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="排序" :label-width="formLabelWidth">
|
|
<el-input-number v-model="exitdata.sort" :min="1" :max="100" label="排序" style="width:108px;" controls-position="right"></el-input-number>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="封面" :label-width="formLabelWidth">
|
|
<el-upload
|
|
class="avatar-uploader"
|
|
action="{:url('Skitmanagement/upimg')}"
|
|
:show-file-list="true"
|
|
:on-success="handleAvatarSuccess2"
|
|
:before-upload="beforeAvatarUpload">
|
|
<img v-if="exitdata.cover" :src="exitdata.cover" class="avatar">
|
|
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
|
|
</el-upload>
|
|
</el-form-item>
|
|
|
|
</el-form>
|
|
<div slot="footer" class="dialog-footer">
|
|
<el-button @click="dialogFormVisible2 = false">取 消</el-button>
|
|
<el-button type="primary" @click="exitdataca(exitdata)">确 定</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
{/block} {block name="script"}
|
|
<script>
|
|
var app = new Vue({
|
|
el: '#app',
|
|
data: {
|
|
tableData: [],
|
|
loading:false,
|
|
dialogFormVisible:false,
|
|
dialogFormVisible2:false,
|
|
addinfo:[],
|
|
formLabelWidth:"100px",
|
|
imageUrl:'',
|
|
assort:'',
|
|
exitdata:[],
|
|
exitoptions:[],
|
|
searchinp1:'',
|
|
loadingdel:false,
|
|
},
|
|
methods: {
|
|
refreshs() {
|
|
this.loading = true
|
|
var that = this
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "{:url('Skitmanagement/refreshs')}",
|
|
data: {},
|
|
dataType: "json",
|
|
success: function(data) {
|
|
that.loading = false
|
|
if (data.status == 1) {
|
|
that.tableData = data.data
|
|
}
|
|
}
|
|
});
|
|
},
|
|
addskits(){
|
|
this.dialogFormVisible = true
|
|
var that = this
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "{:url('Skitmanagement/getassort')}",
|
|
data: {},
|
|
dataType: "json",
|
|
success: function(data) {
|
|
if (data.status == 1) {
|
|
that.assort = data.assort
|
|
}
|
|
}
|
|
});
|
|
},
|
|
handleAvatarSuccess(res, file) {
|
|
this.imageUrl = res.thumb_url;
|
|
this.addinfo.cover = res.thumb_url;
|
|
},
|
|
handleAvatarSuccess2(res, file){
|
|
this.exitdata.cover = res.thumb_url;
|
|
},
|
|
beforeAvatarUpload(file) {
|
|
const isLt2M = file.size / 1024 / 1024 < 2;
|
|
if (!isLt2M) {
|
|
this.$message.error('上传头像图片大小不能超过 2MB!');
|
|
}
|
|
return isLt2M;
|
|
},
|
|
addinfoposa(s){
|
|
var that = this
|
|
//console.log(s)
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "{:url('Skitmanagement/addinfoposa')}",
|
|
data: {
|
|
name:s.name,
|
|
process:s.process,
|
|
status:s.status,
|
|
category_id:s.category_id,
|
|
cover:s.cover,
|
|
},
|
|
dataType: "json",
|
|
success: function(data) {
|
|
if (data.status == 1) {
|
|
that.dialogFormVisible = false
|
|
that.addinfo = []
|
|
that.refreshs();
|
|
that.imageUrl = '';
|
|
that.$message({
|
|
message: '成功',
|
|
type: 'success'
|
|
});
|
|
$('.el-upload-list__item-name').hide()
|
|
} else {
|
|
that.$message({
|
|
message: data.msg,
|
|
type: 'warning'
|
|
});
|
|
}
|
|
}
|
|
});
|
|
},
|
|
exitRow(id){
|
|
this.dialogFormVisible2 = true
|
|
var that = this
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "{:url('Skitmanagement/getexitinfo')}",
|
|
data: {id:id},
|
|
dataType: "json",
|
|
success: function(data) {
|
|
if (data.status == 1) {
|
|
that.exitdata = data.data
|
|
that.exitoptions = data.exitoptions
|
|
}
|
|
}
|
|
});
|
|
},
|
|
exitdataca(data){
|
|
//console.log(data);
|
|
var that = this
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "{:url('Skitmanagement/exitdataca')}",
|
|
data: {data:data},
|
|
dataType: "json",
|
|
success: function(data) {
|
|
if (data.status == 1) {
|
|
that.refreshs()
|
|
that.$message({
|
|
message: '成功',
|
|
type: 'success'
|
|
});
|
|
}else{
|
|
that.$message({
|
|
message: data.msg,
|
|
type: 'warning'
|
|
});
|
|
}
|
|
}
|
|
});
|
|
},
|
|
geturl(id){
|
|
location.href="/admin/Skitchapter/index?id="+id
|
|
},
|
|
searchs(){
|
|
this.loading = true
|
|
var that = this
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "{:url('Skitmanagement/searchs')}",
|
|
data: {searchinp1:that.searchinp1},
|
|
dataType: "json",
|
|
success: function(data) {
|
|
if (data.status == 1) {
|
|
that.loading = false
|
|
that.tableData = data.data
|
|
}
|
|
}
|
|
});
|
|
},
|
|
deleteRow(id){
|
|
this.$confirm('此操作将删除该短剧跟所有视频 确定?', '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning'
|
|
}).then(() => {
|
|
this.loadingdel = true
|
|
var that = this
|
|
$.ajax({
|
|
type: "POST",
|
|
url: "{:url('Skitmanagement/deleteRow')}",
|
|
data: {id:id},
|
|
dataType: "json",
|
|
success: function(data) {
|
|
that.loadingdel = false
|
|
if (data.status == 1) {
|
|
that.refreshs()
|
|
that.$message({
|
|
type: 'success',
|
|
message: '删除成功!'
|
|
});
|
|
}
|
|
}
|
|
});
|
|
}).catch(() => {
|
|
|
|
});
|
|
},
|
|
},
|
|
created: function() {
|
|
this.refreshs()
|
|
}
|
|
})
|
|
</script>
|
|
{/block} |