253 lines
9.4 KiB
HTML
253 lines
9.4 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;
|
||
}
|
||
.saixuan{
|
||
width:100%;
|
||
height: 40px;
|
||
display: flex;
|
||
margin-top: 20px;
|
||
}
|
||
.martop{
|
||
margin-top: -20px;
|
||
}
|
||
.reds{
|
||
color:red;
|
||
}
|
||
.xian{
|
||
width:100%;
|
||
border:1px solid #eee;
|
||
margin-bottom: 10px;
|
||
}
|
||
.dialogFormVisibletitles{
|
||
color: 000;
|
||
font-size: 20px;
|
||
}
|
||
</style>
|
||
|
||
|
||
<div class="main-box clearfix" id="app">
|
||
<div class="body-content">
|
||
|
||
<div class="body-content-zhon demo-form-inline">
|
||
<div class="saixuan">
|
||
<div style="width:120px;margin-right:10px;">
|
||
<el-input v-model="linkid" placeholder="推广链接ID"></el-input>
|
||
</div>
|
||
<el-button type="primary" @click="searchs">搜索</el-button>
|
||
<el-radio-group v-model="tim" @change="refreshs" style="margin-left:20px">
|
||
<el-radio-button label="今日"></el-radio-button>
|
||
<el-radio-button label="昨日"></el-radio-button>
|
||
</el-radio-group>
|
||
|
||
<el-radio-group v-model="order" @change="refreshs" style="margin-left:20px">
|
||
<el-radio-button label="latest">最新创建</el-radio-button>
|
||
<el-radio-button label="money">充值金额</el-radio-button>
|
||
<el-radio-button label="paynum">充值笔数</el-radio-button>
|
||
<el-radio-button label="regnum">注册人数</el-radio-button>
|
||
<el-radio-button label="moneytotal">总充值</el-radio-button>
|
||
</el-radio-group>
|
||
|
||
</div>
|
||
|
||
<el-table :data="tableData" border v-loading="loading" style="width: 100%;margin-top:25px;" header-cell-style="color:#484848;">
|
||
|
||
<el-table-column prop="id" label="ID" width="66px">
|
||
</el-table-column>
|
||
|
||
<el-table-column label="渠道">
|
||
<template slot-scope="scope">
|
||
<span>{{scope.row.remark}}</span>
|
||
<span>剧名：123</span>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column label="推广集数">
|
||
<template slot-scope="scope">
|
||
<span>第{{scope.row.chapter}}集</span>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column label="小程序链接">
|
||
<template slot-scope="scope">
|
||
<el-button type="primary" icon="el-icon-document" size="mini">复制链接</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column label="注册人数">
|
||
<template slot-scope="scope">
|
||
<el-tag type="success">{{scope.row.regnum}}</el-tag>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column label="充值笔数">
|
||
<template slot-scope="scope">
|
||
<el-tag type="success">{{scope.row.paynum}}</el-tag>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column label="充值金额">
|
||
<template slot-scope="scope">
|
||
<el-tag type="danger">{{scope.row.money}}</el-tag>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column prop="moneytotal" label="总充值">
|
||
<template slot-scope="scope">
|
||
<el-tag type="danger">{{scope.row.moneytotal}}</el-tag>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column prop="addtime" label="创建时间">
|
||
</el-table-column>
|
||
|
||
<el-table-column fixed="right" label="操作">
|
||
<template slot-scope="scope">
|
||
<el-button @click="moneyinfo(scope.row)" type="text" size="small">详情</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
|
||
<el-pagination
|
||
background
|
||
layout="prev, pager, next"
|
||
:total="pagetotal"
|
||
@current-change="handleCurrentChange"
|
||
style="margin-top:20px">
|
||
</el-pagination>
|
||
|
||
<el-dialog title="" :visible.sync="dialogFormVisible" width="80%">
|
||
<span Slot="title" class="dialogFormVisibletitles">
|
||
{{dialogFormVisibletitle}}
|
||
<el-date-picker
|
||
v-model="linkid"
|
||
type="date"
|
||
placeholder="开始日期"
|
||
size="mini">
|
||
</el-date-picker>
|
||
-
|
||
<el-date-picker
|
||
v-model="linkid"
|
||
type="date"
|
||
placeholder="结束日期"
|
||
size="mini">
|
||
</el-date-picker>
|
||
<el-button @click="" type="primary" size="mini">搜索</el-button>
|
||
</span>
|
||
<div class="martop" v-loading="loading2">
|
||
<el-descriptions :column="5">
|
||
<el-descriptions-item label="今日首充" content-class-name="reds">0</el-descriptions-item>
|
||
<el-descriptions-item label="当天注册用户复充" content-class-name="reds">0</el-descriptions-item>
|
||
<el-descriptions-item label="往日注册用户复充" content-class-name="reds">0</el-descriptions-item>
|
||
<el-descriptions-item label="今日复充" content-class-name="reds">0</el-descriptions-item>
|
||
<el-descriptions-item label="今日总充值" content-class-name="reds">0</el-descriptions-item>
|
||
<el-descriptions-item label="总复充" content-class-name="reds">0</el-descriptions-item>
|
||
<el-descriptions-item label="总充值" content-class-name="reds">0</el-descriptions-item>
|
||
</el-descriptions>
|
||
<div class="xian"></div>
|
||
<el-descriptions :column="5">
|
||
<el-descriptions-item label="今日首充笔数">0</el-descriptions-item>
|
||
<el-descriptions-item label="今日复充笔数">0</el-descriptions-item>
|
||
<el-descriptions-item label="总首充笔数">0</el-descriptions-item>
|
||
<el-descriptions-item label="总复充笔数">0</el-descriptions-item>
|
||
<el-descriptions-item label="今日注册人数">0</el-descriptions-item>
|
||
<el-descriptions-item label="总注册人数">0</el-descriptions-item>
|
||
</el-descriptions>
|
||
<div class="xian"></div>
|
||
<el-descriptions :column="5">
|
||
<el-descriptions-item label="1次复充" content-class-name="reds">0</el-descriptions-item>
|
||
<el-descriptions-item label="2次复充" content-class-name="reds">0</el-descriptions-item>
|
||
<el-descriptions-item label="3次复充" content-class-name="reds">0</el-descriptions-item>
|
||
<el-descriptions-item label="4次复充" content-class-name="reds">0</el-descriptions-item>
|
||
<el-descriptions-item label="4次复充以上" content-class-name="reds">0</el-descriptions-item>
|
||
</el-descriptions>
|
||
<div class="xian"></div>
|
||
<el-descriptions :column="5">
|
||
<el-descriptions-item label="复充1次人数">0</el-descriptions-item>
|
||
<el-descriptions-item label="复充2次人数">0</el-descriptions-item>
|
||
<el-descriptions-item label="复充3次人数">0</el-descriptions-item>
|
||
<el-descriptions-item label="复充4次人数">0</el-descriptions-item>
|
||
<el-descriptions-item label="复充4次以上人数">0</el-descriptions-item>
|
||
</el-descriptions>
|
||
</div>
|
||
</el-dialog>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
{/block} {block name="script"}
|
||
<script src="https://cdn.staticfile.org/echarts/4.3.0/echarts.min.js"></script>
|
||
<script>
|
||
var app = new Vue({
|
||
el: '#app',
|
||
data: {
|
||
tableData: [],
|
||
loading:false,
|
||
loading2:false,
|
||
page:1,
|
||
pagetotal:0,
|
||
linkid:'',
|
||
tim:'今日',
|
||
order:'latest',
|
||
dialogFormVisible:false,
|
||
dialogFormVisibletitle:'',
|
||
},
|
||
methods: {
|
||
refreshs() {
|
||
this.loading = true
|
||
var that = this
|
||
$.ajax({
|
||
type: "POST",
|
||
url: "{:url('Spread/refreshs')}",
|
||
data: {page:that.page,linkid:that.linkid,order:that.order},
|
||
dataType: "json",
|
||
success: function(data) {
|
||
that.loading = false
|
||
if (data.status == 1) {
|
||
that.tableData = data.list
|
||
that.pagetotal = data.pagetotal
|
||
}
|
||
}
|
||
});
|
||
},
|
||
handleCurrentChange(val) {
|
||
this.page = val
|
||
this.refreshs()
|
||
},
|
||
searchs(){
|
||
this.order = 'latest'
|
||
this.refreshs()
|
||
},
|
||
moneyinfo(info){
|
||
this.dialogFormVisibletitle = info.remark
|
||
this.dialogFormVisible = true
|
||
this.loading2 = true
|
||
var that = this
|
||
$.ajax({
|
||
type: "POST",
|
||
url: "{:url('Spread/moneyinfo')}",
|
||
data: {id:info.id},
|
||
dataType: "json",
|
||
success: function(data) {
|
||
that.loading2 = false
|
||
if (data.status == 1) {
|
||
|
||
}
|
||
}
|
||
});
|
||
}
|
||
},
|
||
created: function() {
|
||
this.refreshs()
|
||
}
|
||
})
|
||
</script>
|
||
{/block} |