bztang-admin/plugins/cultural-space/views/index/index.blade.php

306 lines
14 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')
<style>
.user{
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: flex-start;
overflow: hidden;
height: 80px;
}
.user .user-avatar{
height: 50px;
width: 50px;
margin-right: 5px;
border-radius: 50%;
overflow: hidden;
}
.user .user-avatar .avatar-image{
width: 100% !important;
height: 100% !important;
}
.user .user-info{
height: 50px;
text-align: left;
}
.user .user-info .user-nickname{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.user .user-info .user-status{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.level_0{
background-color: #5bc0de!important;
}
.level_1{
background-color: #f0ad4e!important;
}
.level_2{
background-color: #5cb85c!important;
}
.level_3{
background-color: #337ab7!important;
}
.level_4{
background-color: #d9534f!important;
}
.panel-body .label{
display: inline-block;
margin-bottom: 2px;
border-radius: 2px;
font-size: 14px!important;
padding: 5px !important;
text-transform: uppercase;
font-weight: 700;
line-height: 1;
color: #fff;
text-align: center;
white-space: nowrap;
vertical-align: baseline;
}
.el-pagination{
text-align: right!important;
margin-top: 20px!important;
}
.panel-body{
padding-top: 0;
margin-bottom: 30px;
overflow: auto;
padding-right: 30px;
}
</style>
@section('content')
<div class="w1200 m0a" id="weightValueIndexContent">
<div class="panel panel-default">
<div class="panel-body">
<el-tabs v-model="tabs_active" @tab-click="changeTabs">
<el-tab-pane label="变更明细" name="show_detail">
{{--搜索--}}
<el-form :inline="true" :model="search_list">
<el-form-item label="变更类型">
<el-select v-model="search_list.change_type" placeholder="全部">
<el-option label="全部" value=""></el-option>
<el-option label="减少" value="0"></el-option>
<el-option label="增加" value="1"></el-option>
</el-select>
</el-form-item>
<el-form-item label="会员ID">
<el-input v-model="search_list.member_id" placeholder="请输入会员ID"></el-input>
</el-form-item>
<el-form-item label="权重值类型">
<el-select v-model="search_list.team_dividend_agency_level_id" placeholder="全部">
<el-option label="全部" value=""></el-option>
<el-option v-for="(item,index) in level_list" :key="index" :label="item.level_name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="clickSearch">查询</el-button>
</el-form-item>
</el-form>
{{--表单--}}
<el-table :data="list" style="width: 100%">
<el-table-column align="center" prop="id" label="ID" width="80"></el-table-column>
<el-table-column align="center" prop="member" label="用户信息" width="230">
<template slot-scope="scope">
<div class="user">
<div class="user-avatar">
<img class="avatar-image" :src="scope.row.member.avatar_image || ''" />
</div>
<div class="user-info">
<div class="user-nickname">昵称:[[scope.row.member.nickname || '']]</div>
<div class="user-status">ID[[scope.row.member.uid || '']]</div>
</div>
</div>
</template>
</el-table-column>
<el-table-column align="center" prop="change_front" label="变更前持有数" width="150"></el-table-column>
<el-table-column align="center" prop="change_type" label="变更类型" width="100">
<template slot-scope="scope">
<el-tag :type="scope.row.change_type == 0 ? 'danger' : 'success'" disable-transitions>
[[scope.row.change_type == 0 ? '减少' : '增加']]
</el-tag>
</template>
</el-table-column>
<el-table-column align="center" prop="change_quantity" label="变更数量" width="150"></el-table-column>
<el-table-column align="center" prop="change_after" label="变更后持有数" width="150"></el-table-column>
<el-table-column align="center" prop="change_quantity" label="权重值类型" width="150">
<template slot-scope="scope">
<span :class="'label level_'+scope.row.sort">
[[scope.row.level.level_name ? scope.row.level.level_name + '权重值' : '']]
</span>
</template>
</el-table-column>
<el-table-column align="center" prop="remark" label="变更原因"></el-table-column>
<el-table-column align="center" prop="created_at" label="变更时间" width="200"></el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="统计明细" name="show_group">
{{--搜索--}}
<el-form :inline="true" :model="search_list">
<el-form-item label="会员ID">
<el-input v-model="search_list.member_id" placeholder="请输入会员ID"></el-input>
</el-form-item>
<el-form-item label="权重值类型">
<el-select v-model="search_list.team_dividend_agency_level_id" placeholder="全部">
<el-option label="全部" value=""></el-option>
<el-option v-for="(item,index) in level_list" :key="index" :label="item.level_name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="clickSearch">查询</el-button>
</el-form-item>
</el-form>
{{--表单--}}
<el-table :data="list" style="width: 100%">
<el-table-column align="center" prop="id" label="ID" width="100"></el-table-column>
<el-table-column align="center" prop="member" label="用户信息" width="300">
<template slot-scope="scope">
<div class="user">
<div class="user-avatar">
<img class="avatar-image" :src="scope.row.member.avatar_image || ''" />
</div>
<div class="user-info">
<div class="user-nickname">昵称:[[scope.row.member.nickname || '']]</div>
<div class="user-status">ID[[scope.row.member.uid || '']]</div>
</div>
</div>
</template>
</el-table-column>
<el-table-column align="center" prop="change_quantity" label="权重值类型">
<template slot-scope="scope">
<span :class="'label level_'+scope.row.sort">
[[scope.row.level.level_name ? scope.row.level.level_name + '权重值' : '']]
</span>
</template>
</el-table-column>
<el-table-column align="center" prop="change_front">
<template slot="header" slot-scope="scope">
<span class="label label-default">平台总数</span>
<span class="label label-info">用户持有</span>
<span class="label label-warning">占比(%)</span>
</template>
<template slot-scope="scope">
<span class="label label-default">[[scope.row.total_quantity || '0.00' ]]</span>
<span class="label label-info">[[scope.row.quantity || '0.00' ]]</span>
<span class="label label-warning">[[scope.row.ratio ? scope.row.ratio + '%' : '0.00' ]]</span>
</template>
</el-table-column>
<el-table-column align="center" prop="created_at" label="操作">
<template slot-scope="scope">
<el-button type="primary" @click="seeDetail(scope.row.member_id,scope.row.team_dividend_agency_level_id)">变更明细</el-button>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
{{--分页--}}
<el-pagination
v-if="total_page > 1"
background
layout="prev, pager, next"
:page-count="total_page"
:current-page="page"
@current-change="changePage">
</el-pagination>
</div>
</div>
</div>
<script type="text/javascript">
new Vue({
el: '#weightValueIndexContent',
delimiters: ['[[', ']]'],
name: 'cultural_space_index_content',
data: {
tabs_active: 'show_detail',
level_list: JSON.parse('{!! json_encode($level_list) !!}'),
// 分页信息
page: 1,
total_page: 1,
list: [],
search_list: {
member_id: '',
team_dividend_agency_level_id: '',
change_type: '',
}
},
watch:{},
mounted () {
// this.getData();
},
methods: {
// 获取数据 根据当前选项卡获取对应的信息
getData(){
let _this = this;
let loading = _this.showLoading();
let link = "{!! yzWebUrl('plugin.cultural-space.admin.index.changeRecord') !!}";
if(_this.tabs_active === 'show_group') link = "{!! yzWebUrl('plugin.cultural-space.admin.index.changeGroupRecord') !!}";
$.ajax({
url: link,
type: "post",
data: {
page: _this.page,
search: _this.search_list,
is_get: 1
},
success: function(result) {
loading.close(0);
let data = result.data;
if(parseInt(result.result) === 1){
// 处理数据
_this.list = data.data;
_this.total_page = data.last_page;
}
}
});
},
// 切换选项卡
changeTabs(){
this.page = 1;
this.search_list = {
member_id: '',
team_dividend_agency_level_id: '',
change_type: '',
};
this.total_page = 1;
this.list = [];
this.getData();
},
// 数据分页
changePage(val){
this.page = val;
this.getData();
},
// 相关搜索
clickSearch(){
this.page = 1;
this.getData()
},
// 显示加载动画
showLoading(){
return this.$loading({
lock: true,
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
},
// 查看分组的变更明细
seeDetail(member_id,level_id){
let link = "{{yzWebUrl('plugin.cultural-space.admin.index.changeRecord')}}" + `&member_id=${member_id}&level_id=${level_id}`;
let popup = util.ajaxshow(link,'权重值变更明细',{
width: $(window).width() * 0.8 > 1200 ? $(window).width() * 0.8 : 1200,
height: $(window).height() * 0.8 > 1200 ? $(window).height() * 0.8 : 1200,
});
}
},
})
</script>
@endsection