bztang-admin/plugins/new-poster/views/admin/index.blade.php

524 lines
30 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

@extends('layouts.base')
@section('title', "海报列表")
@section('content')
<link rel="stylesheet" href="{{resource_get('plugins/new-poster/views/admin/index.css')}}">
<style>
.add-selected{color:#fff;background:#29BA9C;border-radius:50px;}
.add{padding:0 10px;line-height:40px;cursor:pointer;text-align: center;margin:0 5px 10px;}
.center-show .center-show-edit {
display: none;
}
.center-show .center-show-edited {
display: inline-block;
}
</style>
<div class="all">
<div id="app" v-cloak>
<div class="vue-crumbs">
海报 > 海报管理
</div>
<div class="vue-head">
<div class="vue-main-title" style="margin-bottom:20px">
<div class="vue-main-title-left"></div>
<div class="vue-main-title-content">海报管理</div>
<div class="vue-main-title-button">
</div>
</div>
<div class="vue-search">
<el-form :inline="true" :model="search_form" class="demo-form-inline">
<el-form-item label="">
<el-input v-model="search_form.title" placeholder="海报名称"></el-input>
</el-form-item>
<el-form-item label="">
<el-input v-model="search_form.keyword" placeholder="关键词"></el-input>
</el-form-item>
<el-form-item label="">
<el-select v-model="search_form.poster_type" clearable placeholder="海报类型">
<el-option label="微信公众号关注海报" value="1"></el-option>
<el-option label="微信小程序海报" value="2"></el-option>
<el-option label="H5商城海报" value="5"></el-option>
<el-option label="APP分享海报" value="7"></el-option>
<el-option label="商品详情页海报" value="15"></el-option>
<el-option label="聚合CPS邀请海报" value="16"></el-option>
<el-option label="定金阶梯团海报" value="17"></el-option>
<el-option label="群拓客海报" value="19"></el-option>
<el-option :label="love_name+'海报'" value="20"></el-option>
<el-option :label="coupon_store_name+'商户海报'" value="21"></el-option>
<el-option :label="coupon_store_name+'商品海报'" value="22"></el-option>
<el-option :label="package_deliver_name+'海报'" value="23"></el-option>
<el-option label="企微好友海报" value="30"></el-option>
<el-option label="众筹活动" value="31"></el-option>
<el-option label="小程序直播" value="32"></el-option>
<el-option label="拓客活动海报" value="100"></el-option>
</el-select>
</el-form-item>
<el-form-item label="">
<el-select v-model="search_form.status" clearable placeholder="状态">
<el-option label="启用" value="1"></el-option>
<el-option label="禁用" value="0"></el-option>
</el-select>
</el-form-item>
<el-form-item label="">
<el-select v-model="search_form.center_show" clearable placeholder="会员中心显示">
<el-option label="启用" value="1"></el-option>
<el-option label="禁用" value="0"></el-option>
</el-select>
</el-form-item>
<el-form-item label="">
<el-button type="primary" @click="search(1)">搜索</el-button>
</el-form-item>
</el-form>
</div>
</div>
<div class="vue-main">
<div>
<div class="vue-main-title" style="margin-bottom:20px">
<div class="vue-main-title-left"></div>
<div class="vue-main-title-content" style="flex:0 0 100px">海报列表</div>
<div class="" style="text-align:left;font-size:12px;color:#999">
<span>海报总数:[[total]]</span>&nbsp;&nbsp;&nbsp;
<span>微信公众号关注海报:[[count.wechat_count]]</span>&nbsp;&nbsp;&nbsp;
<span>微信小程序海报:[[count.mini_count]]</span>&nbsp;&nbsp;&nbsp;
<span>H5商城海报[[count.h5_count]]</span>&nbsp;&nbsp;&nbsp;
<span>APP分享海报[[count.app_count]]</span>&nbsp;&nbsp;&nbsp;
<span>商品详情页海报:[[count.goods_count]]</span>&nbsp;&nbsp;&nbsp;
<span>聚合CPS邀请海报[[count.cps_count]]</span>&nbsp;&nbsp;&nbsp;
<span>定金阶梯团海报:[[count.deposit_ladder_count]]</span>&nbsp;&nbsp;&nbsp;
<span>群拓客海报:[[count.chat_group_count]]</span>&nbsp;&nbsp;
<span>[[love_name]]海报:[[count.love_count]]</span>&nbsp;
<span>[[package_deliver_name]]海报:[[count.package_deliver_count]]</span>&nbsp;
<span>企微好友海报:[[count.package_deliver_count]]</span>&nbsp;
<span>[[coupon_store_name]]商户海报:[[count.coupon_store_count]]</span>&nbsp;
<span>[[coupon_store_name]]商品海报:[[count.coupon_store_goods_count]]</span>&nbsp;
<span>众筹活动:[[count.crowdfunding_activity_count]]</span>&nbsp;
<span>小程序直播:[[count.applets_live_count]]</span>&nbsp;
<span>拓客活动海报:[[count.activity_count]]</span>&nbsp;
&nbsp;
</div>
<div class="vue-main-title-button">
<el-button type="primary" plain icon="el-icon-plus" size="small" @click="addModal">添加海报</el-button>
</div>
</div>
<el-table :data="list" style="width: 100%">
<!-- <el-table-column label="ID" align="center" prop="id" width="70"></el-table-column> -->
<el-table-column label="添加日期" align="center" prop="created_at"></el-table-column>
<el-table-column label="海报名称" align="center" prop="title"></el-table-column>
<el-table-column label="关键词" align="center" prop="keyword"></el-table-column>
<el-table-column label="海报类型" align="center" prop="">
<template slot-scope="scope">
<div v-if="scope.row.poster_type==1">微信公众号关注海报</div>
<div v-if="scope.row.poster_type==2">微信小程序海报</div>
<div v-if="scope.row.poster_type==5">H5商城海报</div>
<div v-if="scope.row.poster_type==7">APP分享海报</div>
<div v-if="scope.row.poster_type==15">商品详情页海报</div>
<div v-if="scope.row.poster_type==16">聚合CPS邀请海报</div>
<div v-if="scope.row.poster_type==17">定金阶梯团海报</div>
<div v-if="scope.row.poster_type==19">群拓客海报</div>
<div v-if="scope.row.poster_type==20">[[love_name]]海报</div>
<div v-if="scope.row.poster_type==21">[[coupon_store_name]]商户海报</div>
<div v-if="scope.row.poster_type==22">[[coupon_store_name]]商品海报</div>
<div v-if="scope.row.poster_type==23">[[package_deliver_name]]海报</div>
<div v-if="scope.row.poster_type==30">企微好友海报</div>
<div v-if="scope.row.poster_type==31">众筹活动</div>
<div v-if="scope.row.poster_type==32">小程序直播</div>
<div v-if="scope.row.poster_type==100">拓客活动海报</div>
</template>
</el-table-column>
<el-table-column label="扫描数" align="center" prop="scan_count">
<template slot-scope="scope">
<div v-if="scope.row.poster_type==1">
[[scope.row.scan_count]]
</div>
</template>
</el-table-column>
<el-table-column label="引流注册人数" align="center" prop="award_count">
<template slot-scope="scope">
<div v-if="scope.row.poster_type==1">
[[scope.row.award_count]]
</div>
</template>
</el-table-column>
<el-table-column label="状态" align="center" prop="created_at">
<template slot-scope="scope">
<div>
<el-switch v-if="scope.row.poster_type==1" @change="changeStatus('status',scope.row.id,scope.$index,scope.row.status)" v-model="scope.row.status" :active-value="1" :inactive-value="0"></el-switch>
<el-switch v-if="scope.row.poster_type==15" @change="changeStatus('goods_status',scope.row.id,scope.$index,scope.row.status)" v-model="scope.row.status" :active-value="1" :inactive-value="0"></el-switch>
<el-switch v-if="scope.row.poster_type==17" @change="changeStatus('status',scope.row.id,scope.$index,scope.row.status)" v-model="scope.row.status" :active-value="1" :inactive-value="0"></el-switch>
<el-switch v-if="scope.row.poster_type==20" @change="changeStatus('love_status',scope.row.id,scope.$index,scope.row.status)" v-model="scope.row.status" :active-value="1" :inactive-value="0"></el-switch>
</div>
</template>
</el-table-column>
<el-table-column label="会员中心显示" align="center" prop="created_at" min-width="120">
<template slot-scope="scope">
<div class="center-show" @mouseover="changeIndex(scope.$index)" v-if="
scope.row.poster_type==1||
scope.row.poster_type==2||
scope.row.poster_type==5||
scope.row.poster_type==7||
scope.row.poster_type==16
">
<span class="type-box">
<i class="iconfont icon-ht_btn_wap" style="color: rgb(95, 32, 254);" title="H5" v-if="scope.row.center_show.includes('5')"></i>
<i class="iconfont icon-ht_btn_app" style="color: rgb(255, 168, 0);" title="APP" v-if="scope.row.center_show.includes('7')"></i>
<i class="iconfont icon-ht_btn_smallprogram" style="color: rgb(0, 223, 185);" title="小程序" v-if="scope.row.center_show.includes('2')"></i>
<i class="iconfont icon-ht_btn_gongzhonghao" style="color: rgb(41, 186, 156);" title="公众号" v-if="scope.row.center_show.includes('1')"></i>
<i class="iconfont icon-ht_btn_otherpage" style="color: rgb(255, 61, 56);" title="其他页面" v-if="scope.row.center_show.includes('0')"></i>
<el-popover placement="top" width="100" trigger="hover">
<div>
<el-checkbox-group v-model="scope.row.center_show">
<el-checkbox label="1" @change="changeCenterShow(scope.row,scope.$index)">微信公众号</el-checkbox>
<el-checkbox label="5" @change="changeCenterShow(scope.row,scope.$index)">H5</el-checkbox>
<el-checkbox label="2" @change="changeCenterShow(scope.row,scope.$index)">微信小程序</el-checkbox>
<el-checkbox label="7" @change="changeCenterShow(scope.row,scope.$index)">商城APP</el-checkbox>
<el-checkbox label="0" @change="changeCenterShow(scope.row,scope.$index,'other')">不显示</el-checkbox>
</el-checkbox-group>
</div>
<div slot="reference" style="display:inline-block">
<div class="center-show-edit" title="编辑" :class="{'center-show-edited':change_index==scope.$index}">
<i class="el-icon-edit-outline" style="color: rgb(41, 186, 156); cursor: pointer; font-size: 18px; margin-top: 3px;"></i>
</div>
</div>
</el-popover>
</span>
</div>
</template>
</el-table-column>
<el-table-column prop="refund_time" label="操作" align="center" width="300">
<template slot-scope="scope">
<span>
<el-link title="复制" :underline="false" @click="copy(scope.row)" style="width:28px;">
<i class="el-icon-document-copy"></i>
</el-link>
</span>
<span v-if="scope.row.poster_type!=15&&scope.row.poster_type!=20">
<el-link title="生成记录" :underline="false" @click="gotoMore(scope.row,1)" style="width:28px;">
<i class="iconfont icon-fontclass-shengchengjilu"></i>
</el-link>
</span>
<span v-if="scope.row.poster_type==1">
<el-link title="扫码记录" :underline="false" @click="gotoMore(scope.row,2)" style="width:28px;">
<i class="iconfont icon-fontclass-saomajilu"></i>
</el-link>
<el-link title="奖励记录" :underline="false" @click="gotoMore(scope.row,3)" style="width:28px;">
<i class="iconfont icon-fontclass-jianglijilu"></i>
</el-link>
</span>
<el-link title="编辑" :underline="false" @click="gotoDetail(scope.row)" style="width:28px;">
<i class="iconfont icon-ht_operation_edit"></i>
</el-link>
<el-link title="删除" :underline="false" @click="del(scope.row.id,scope.$index)" style="width:28px;">
<i class="iconfont icon-ht_operation_delete"></i>
</el-link>
</template>
</el-table-column>
</el-table>
</div>
</div>
<!-- 分页 -->
<div class="vue-page" v-if="total>0">
<el-row>
<el-col align="right">
<el-pagination layout="prev, pager, next,jumper" @current-change="search" :total="total"
:page-size="per_page" :current-page="current_page" background
></el-pagination>
</el-col>
</el-row>
</div>
<el-dialog :visible.sync="add_show" width="1150px" center title="请选择页面类型">
<div style="font-weight:500;display:flex;flex-wrap:wrap;justify-content: flex-start;">
<div style="width:70px;line-height: 40px;color:#999;">页面类型:</div>
<div class="add" @click="chooseAdd(1)" :class="add_index==1?'add-selected':''" type="text">微信公众号关注海报</div>
<div class="add" @click="chooseAdd(2)" :class="add_index==2?'add-selected':''" type="text">微信小程序海报</div>
<div class="add" @click="chooseAdd(5)" :class="add_index==5?'add-selected':''" type="text">H5商城海报</div>
<div class="add" @click="chooseAdd(7)" :class="add_index==7?'add-selected':''" type="text">APP分享海报</div>
<div class="add" @click="chooseAdd(15)" :class="add_index==15?'add-selected':''" type="text">商品详情页海报</div>
<div class="add" @click="chooseAdd(16)" :class="add_index==16?'add-selected':''" type="text">聚合CPS邀请海报</div>
<div class="add" @click="chooseAdd(17)" :class="add_index==17?'add-selected':''" type="text">定金阶梯团海报</div>
<div class="add" @click="chooseAdd(19)" :class="add_index==19?'add-selected':''" type="text">群拓客海报</div>
<div v-if="is_love_open==1" class="add" @click="chooseAdd(20)" :class="add_index==20?'add-selected':''" type="text">[[love_name]]海报</div>
<div v-if="coupon_store_open==1" class="add" @click="chooseAdd(21)" :class="add_index==21?'add-selected':''" type="text">[[coupon_store_name]]商户海报</div>
<div v-if="coupon_store_open==1" class="add" @click="chooseAdd(22)" :class="add_index==22?'add-selected':''" type="text">[[coupon_store_name]]商品海报</div>
<div v-if="package_deliver_open==1" class="add" @click="chooseAdd(23)" :class="add_index==23?'add-selected':''" type="text">[[package_deliver_name]]海报</div>
<div v-if="customer_increase_open==1" class="add" @click="chooseAdd(30)" :class="add_index==30?'add-selected':''" type="text">企微好友海报</div>
<div class="add" @click="chooseAdd(31)" :class="add_index==31?'add-selected':''" type="text">众筹活动</div>
<div class="add" @click="chooseAdd(32)" :class="add_index==32?'add-selected':''" type="text">小程序直播</div>
<div class="add" @click="chooseAdd(100)" :class="add_index==100?'add-selected':''" type="text">拓客活动海报</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="sureGotoAdd"> </el-button>
<el-button @click="add_show = false"> </el-button>
</span>
</el-dialog>
</div>
</div>
<script>
let is_love_open = {!! $is_love_open !!};
let customer_increase_open = {!! $customer_increase_open !!};
let love_name = '{!! $love_name !!}';
let coupon_store_open = {!! $coupon_store_open !!};
let coupon_store_name = '{!! $coupon_store_name !!}';
let package_deliver_name = '{!! $package_deliver_name !!}';
let package_deliver_open = {!! $package_deliver_open !!};
var app = new Vue({
el: "#app",
delimiters: ['[[', ']]'],
name: 'test',
data() {
return {
add_show:false,
add_index:1,
search_form:{},
times:[],
list:[],
count:{},
change_index:-1,
rules: {},
current_page:1,
total:1,
per_page:1,
is_love_open:is_love_open,
love_name:love_name,
customer_increase_open:customer_increase_open,
coupon_store_open:coupon_store_open,
coupon_store_name:coupon_store_name,
package_deliver_name:package_deliver_name,
package_deliver_open:package_deliver_open,
}
},
created() {
},
mounted() {
this.getData(1);
},
methods: {
getData(page) {
let json = {
page:page,
search:{
title:this.search_form.title,
keyword:this.search_form.keyword,
poster_type:this.search_form.poster_type,
status:this.search_form.status,
center_show:this.search_form.center_show,
}
}
if(this.times.length>0) {
json.search.start_time = this.times[0]/1000;
json.search.end_time = this.times[1]/1000;
}
let loading = this.$loading({target:document.querySelector(".content"),background: 'rgba(0, 0, 0, 0)'});
this.$http.post('{!! yzWebFullUrl('plugin.new-poster.admin.poster.getList') !!}',json).then(function(response) {
if (response.data.result) {
this.list = response.data.data.list.data;
this.list.forEach((item,index) => {
this.list[index].center_show = this.list[index].center_show&&this.list[index].center_show.length>=0?this.list[index].center_show:[]
})
this.current_page=response.data.data.list.current_page;
this.total=response.data.data.list.total;
this.per_page=response.data.data.list.per_page;
this.count = response.data.data.count;
loading.close();
} else {
this.$message({
message: response.data.msg,
type: 'error'
});
}
loading.close();
}, function(response) {
this.$message({
message: response.data.msg,
type: 'error'
});
loading.close();
});
},
gotoDetail(item) {
let link = `{!! yzWebFullUrl('plugin.new-poster.admin.poster.edit') !!}`+`&id=`+item.id;
link += `&poster_type=`+item.poster_type;
window.location.href = link;
},
gotoMore(row,type) {
if(type==1) {
let link = `{!! yzWebFullUrl('plugin.new-poster.admin.poster-record.index') !!}`+`&id=`+row.id;
window.location.href = link;
}
else if(type==2) {
let link = `{!! yzWebFullUrl('plugin.new-poster.admin.poster-scan.index') !!}`+`&id=`+row.id;
window.location.href = link;
}
else if(type==3) {
let link = `{!! yzWebFullUrl('plugin.new-poster.admin.poster-award.index') !!}`+`&id=`+row.id;
window.location.href = link;
}
},
copy(row) {
let link = `{!! yzWebFullUrl('plugin.new-poster.admin.poster.edit') !!}`+`&id=`+row.id+'&is_copy=1&poster_type='+row.poster_type;
window.location.href = link;
},
search(val) {
this.getData(val);
},
addModal() {
this.add_show = true;
},
chooseAdd(index) {
this.add_index = index;
this.$forceUpdate()
},
sureGotoAdd() {
let link = `{!! yzWebFullUrl('plugin.new-poster.admin.poster.add') !!}`;
link += `&poster_type=`+this.add_index;
window.location.href = link;
},
// 快速修改
changeStatus(type,id,index,value,row) {
let that = this;
let json = {};
let link = "";
if(type == 'status') {
link = "{!! yzWebFullUrl('plugin.new-poster.admin.poster.changeStatus') !!}";
json = {
id:id,
status:value,
}
}
else if(type == 'goods_status') {
link = "{!! yzWebFullUrl('plugin.new-poster.admin.poster.changeGoodsStatus') !!}";
json = {
id:id,
status:value,
}
}
else if(type == 'love_status') {
link = "{!! yzWebFullUrl('plugin.new-poster.admin.poster.changeLoveStatus') !!}";
json = {
id:id,
status:value,
}
}
else if(type == 'center_show') {
link = "{!! yzWebFullUrl('plugin.new-poster.admin.poster.changeCenterShow') !!}"
json = {
id:id,
center_show:value,
poster_type:row.poster_type,
}
}
let loading = this.$loading({target:document.querySelector(".content"),background: 'rgba(0, 0, 0, 0)'});
that.$http.post(link, json).then(response => {
console.log(response);
if (response.data.result == 1) {
that.$message.success('操作成功!');
} else {
that.$message.error(response.data.msg);
that.list[index][type] == 1 ? 0 : 1;
}
that.search(this.current_page);
loading.close();
}), function (res) {
console.log(res);
loading.close();
};
},
del(id,index) {
console.log(id,index)
this.$confirm('确定删除吗', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning'}).then(() => {
let loading = this.$loading({target:document.querySelector(".content"),background: 'rgba(0, 0, 0, 0)'});
this.$http.post('{!! yzWebFullUrl('plugin.new-poster.admin.poster.delete') !!}',{id:id}).then(function (response) {
if (response.data.result) {
this.list.splice(index,1);
this.$message({type: 'success',message: '删除成功!'});
}
else{
this.$message({type: 'error',message: response.data.msg});
}
loading.close();
this.search(this.current_page)
},function (response) {
this.$message({type: 'error',message: response.data.msg});
loading.close();
}
);
}).catch(() => {
this.$message({type: 'info',message: '已取消删除'});
});
},
uploadSuccess(res, file) {
if (res.result == 1) {
// this.form.file = res.data.thumb;
this.$message.success(res.msg);
} else {
this.$message.error(res.msg);
}
window.location.reload();
// this.submit_loading = false;
},
beforeUpload(file) {
// this.submit_loading = true;
},
changeCenterShow(row,index,type) {
let that = this;
if(type=="other"&&this.list[index].center_show.indexOf(0)>=-1) {
this.list[index].center_show = []
this.list[index].center_show.push(0)
}
else {
let arr = []
for(let i=0;i<this.list[index].center_show.length;i++) {
if(this.list[index].center_show[i]!=0) {
arr.push(this.list[index].center_show[i])
}
}
this.list[index].center_show = arr;
}
let link = "{!! yzWebFullUrl('plugin.new-poster.admin.poster.changeCenterShow') !!}"
let json = {
id:row.id,
center_show:row.center_show,
// poster_type:row.poster_type,
}
let loading = this.$loading({target:document.querySelector(".content"),background: 'rgba(0, 0, 0, 0)'});
that.$http.post(link, json).then(response => {
console.log(response);
if (response.data.result == 1) {
that.$message.success('操作成功!');
} else {
that.$message.error(response.data.msg);
// that.list[index][type] == 1 ? 0 : 1;
}
that.search(this.current_page);
loading.close();
}), function (res) {
console.log(res);
loading.close();
};
console.log(json)
this.$forceUpdate();
},
changeIndex(index) {
this.change_index = index
}
},
})
</script>
@endsection