hemall.terabimsoft.com.cn/plugins/room/views/admin/code/detail.blade.php

@extends('layouts.base')
@section('title', '授权码明细')
@section('content')
<style>
.panel{
    margin-bottom:10px!important;
    border-radius: 10px;
    padding-left: 20px;
}   
.panel .active a {
	background-color: #29ba9c!important;
	border-radius: 18px!important;
    color:#fff;
}
.panel a{
    border:none!important;
    background-color:#fff!important;
}
.content{
    background: #eff3f6;
    padding: 10px!important;
}
.con{
    padding-bottom:20px;
    position:relative;
    border-radius: 8px;
    min-height: 100vh;
    background: #fff;
}
.con .setting .block{
    padding:10px;
    background-color:#fff;
    border-radius: 8px;
}
.con .setting .block .title{
    font-size:18px;
    margin-bottom:15px;
    display:flex;
    align-items:center;
    justify-content:space-between;
}
.add{
    width: 154px;
	height: 36px;
	border-radius: 4px;
    border: solid 1px #29ba9c;
    color:#29ba9c;
    display:flex;
    align-items:center;
    justify-content:center;
}
.el-table--fit{
    margin-top:-10px;
}
b{
    font-size:14px;
}
.vue-crumbs a {
  color: #333;
}
.vue-crumbs a:hover {
  color: #29ba9c;
}
.vue-crumbs {
  margin: 0 20px;
  font-size: 14px;
  color: #333;
  font-weight: 400;
  padding-bottom: 10px;
  line-height: 32px;
}
.el-table--border::after, .el-table--group::after, .el-table::before{
    background-color:#fff;
}
</style>
<div id='re_content' >

    <div class="con">
        <div class="setting">
            <el-row>
                <el-button type="primary" @click="codeBasic()">基础设置</el-button>
                <el-button type="success" @click="code()">授权码管理</el-button>
                <el-button type="info" @click="codeLog()">使用记录</el-button>
            </el-row>

            <div style="background: #eff3f6;width:100%;height:15px;margin-top: 1em;"></div>

            <div class="block">

            <div class="title">
                <div style="display:flex;align-items:center;"><span style="width: 4px;height: 18px;background-color: #29ba9c;margin-right:15px;display:inline-block;"></span><b>授权码明细</b></div></div>
            </div>

            <div style="background: #eff3f6;width:100%;height:15px;"></div>

            <template style="margin-top:-10px;">
                <el-table :data="tableData" style="padding:0 10px">

                    <el-table-column prop="id" align="center" label="ID">
                    </el-table-column>

                    <el-table-column prop="created_at" align="center" label="时间">
                    </el-table-column>

                    <el-table-column prop="type_name" align="center" label="类型">
                    </el-table-column>

                    <el-table-column prop="old_num" align="center" label="变动前数量">
                    </el-table-column>

                    <el-table-column prop="change_num" align="center" label="变动数量">
                    </el-table-column>

                    <el-table-column prop="new_num" align="center" label="变动后数量">
                    </el-table-column>

                </el-table>
  </template>
        <el-row style="background-color:#fff;">
        <el-col :span="24" align="center" migra style="padding:15px 5% 15px 0" v-loading="loading">
                <el-pagination background  @current-change="currentChange"
                    :current-page="current_page"
                    layout="prev, pager, next"
                    :page-size="Number(page_size)" :current-page="current_page" :total="page_total"></el-pagination>
            </el-col>
        </el-row>
        </div>
    </div>
</div>
<script>
    var vm = new Vue({
        el: "#re_content",
        delimiters: ['[[', ']]'],
        data() {
            let member_id={!!$member_id?:'{}' !!};
            let level_id={!!$level_id?:'{}' !!};
           return {
                loading:false,
                search_loading:false,
                all_loading:false,
                page_total:0,
                page_size:0,
                current_page:0,
                tableData: [],
                search_form:{
                    member_id:member_id,
                    level_id:level_id,
                },
                real_search_form:{},
           }
        },
        mounted () {
              this.search();
        },
        methods: {
              search() {
                this.search_loading = true;
                let json={
                    search:this.search_form,
                }
                this.$http.post('{!! yzWebFullUrl('plugin.room.admin.anchor-manage.codeDetailSearch') !!}',json
                ).then(function (response) {
                    if (response.data.result){
                        
                              let datas = response.data.data.list;
                              console.log(datas);
                              this.tableData=datas.data 
                              this.page_total = datas.total;
                              this.page_size = datas.per_page;
                              this.current_page = datas.current_page;
                              this.loading = false;
                        this.real_search_form=Object.assign({},this.search_form);
                    }
                    else {
                        this.$message({message: response.data.msg,type: 'error'});
                    }
                    this.search_loading = false;
                },function (response) {
                    this.search_loading = false;
                    this.$message({message: response.data.msg,type: 'error'});
                }
                );
            },
              currentChange(val) {
                    this.loading = true;
                    this.$http.post('{!! yzWebFullUrl('plugin.room.admin.anchor-manage.codeDetailSearch') !!}',{page:val,search:this.real_search_form}).then(function (response){
                        if (response.data.result){
                              let datas = response.data.data.list;
                              this.tableData=datas.data 
                              this.page_total = datas.total;
                              this.page_size = datas.per_page;
                              this.current_page = datas.current_page;
                              this.loading = false;
                        } else {
                            this.$message({message: response.data.msg,type: 'error'});
                        }
                    },function (response) {
                        console.log(response);
                        this.loading = false;
                    }
                    );
                },
            codeBasic() {
            window.location.href = "{!! yzWebFullUrl('plugin.room.admin.anchor-manage.basicCode') !!}";
            },
            code() {
                window.location.href = "{!! yzWebFullUrl('plugin.room.admin.anchor-manage.codeList') !!}";
            },
            codeLog() {
                window.location.href = "{!! yzWebFullUrl('plugin.room.admin.anchor-manage.usageRecord') !!}";
            }
        },
    });
</script>
@endsection