qimall/addons/DoubleCopy/backend/views/pool/level.php

<div id="app" v-cloak>
    <el-card shadow="never" body-style="background-color: #f3f3f3;padding: 10px 0 0;">
        <div slot="header">
            <div>
                <span>分红池等级</span>
                <div style="float: right; margin: -5px 0">
                    <el-button type="primary" @click="$navigate({r: 'double-copy/pool/level-edit'})" size="small">添加等级</el-button>
                </div>
            </div>
        </div>
        <div class="table-body">
            <el-table v-loading="listLoading" :data="list" stripe style="width: 100%">
                <el-table-column prop="id" label="ID" width="80" align="center"></el-table-column>

                <el-table-column prop="level" label="等级" width="80" align="center">
                    <template slot-scope="scope">
                        等级{{ scope.row.level }}
                    </template>
                </el-table-column>

                <el-table-column label="等级名称" align="center">
                    <template slot-scope="scope">
                        <com-ellipsis :line="1">{{scope.row.name}}</com-ellipsis>
                    </template>
                </el-table-column>

                <el-table-column label="所需一二市场业绩" prop="achievement" align="center"></el-table-column>

                <el-table-column label="单个市场业绩" prop="single_market" align="center"></el-table-column>

                <el-table-column label="当前池金额" prop="current_money" align="center"></el-table-column>

                <el-table-column label="累计池金额" prop="total_money" align="center"></el-table-column>

                <el-table-column label="奖励类型" prop="reward_currency" align="center"></el-table-column>

                <el-table-column label="当前人数" prop="bonus_num" align="center"></el-table-column>

                <el-table-column label="操作" width="180" align="center">
                    <template slot-scope="scope">
                        <el-button type="text" @click="handle('recharge', scope.row)">充值</el-button>
                        <el-button type="text" @click="handle('send', scope.row)">发放记录</el-button>
                        <el-button type="text" @click="handle('edit', scope.row)">编辑</el-button>
                        <el-button type="text" @click="handle('destroy', scope.row)">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>

            <div style="text-align: right;margin: 20px 0;">
                <el-pagination @current-change="pagination" background layout="prev, pager, next" :page-count="pageCount"></el-pagination>
            </div>
        </div>
    </el-card>

    <!-- 弹窗开始 -->
    <el-dialog :title="level_name + '发放记录'" :visible.sync="dialogVisible" width="60%" @close="handle('close')">
        <el-table v-loading="logLoading" :data="logList" stripe style="width: 100%">
            <el-table-column label="发放总额" prop="total_bonus_money" align="center"></el-table-column>

            <el-table-column label="发放人数" prop="bonus_num" align="center"></el-table-column>

            <el-table-column label="每人可得金额" prop="bonus_money" align="center"></el-table-column>

            <el-table-column label="发放周期" prop="cycle_type" align="center">
                <template slot-scope="scope">
                    {{ cycle_type_map[scope.row.cycle_type] }}
                </template>
            </el-table-column>

            <el-table-column label="发放时间" prop="upgrade_level_at" align="center">
                <template slot-scope="scope">
                    {{scope.row.created_at|dateTimeFormat('Y-m-d H:i:s')}}
                </template>
            </el-table-column>

            <el-table-column label="奖励类型" prop="reward_currency" align="center">
                <template slot-scope="scope">
                    {{ reward_currency_arr[scope.row.reward_currency] }}
                </template>
            </el-table-column>

        </el-table>

        <div style="text-align: right;margin: 20px 0;">
            <el-pagination @current-change="logPagination" background layout="prev, pager, next" :page-count="logPageCount"></el-pagination>
        </div>
    </el-dialog>
    <!-- 弹窗结束 -->
    <!-- 充值弹窗开始 -->
    <el-dialog :title="'充值金额'" :visible.sync="visible" width="30%">
        <el-form :model="form" :rules="rules" ref="form" label-width="100px" size="small">

            <el-form-item :label="'金额数量'" prop="num">
                <el-input v-model="form.num" style="width:350px" type="number" :placeholder="`请输入要加/减的分红金额(-1代表减1)`"></el-input>
            </el-form-item>
            <el-form-item label="备注" prop="desc">
                <el-input v-model="form.desc" placeholder="备注原因" style="width:350px"></el-input>
            </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
            <el-button @click="visible = false" size="mini" :loading="submitLoading">取 消</el-button>
            <el-button type="primary" @click="recharge('form')" size="mini" :loading="submitLoading">确 定</el-button>
        </span>
    </el-dialog>
    <!-- 充值弹窗结束 -->

</div>
<script>
    const app = new Vue({
        el: '#app',
        data() {
            return {
                list: [],
                listLoading: false,
                page: 1,
                pageCount: 0,
                cycle_type_map: {
                    0: '每日',
                    1: '每周',
                    2: '每月',
                },
                reward_currency_arr: {
                    'score' : '积分',
                    'commission' : '佣金',
                },
                dialogVisible: false,
                logLoading: false,
                logList: [],
                logPage: 1,
                logPageCount: 0,
                level: 0,
                level_name: '',
                visible: false,
                submitLoading: false,
                form: {
                    num: '',
                    desc: '',
                    level_id : ','
                },
            };
        },
        mounted: function () {
            this.getList();
        },
        methods: {
            search() {
                this.page = 1;
                this.getList();
            },
            pagination(currentPage) {
                let self = this;
                self.page = currentPage;
                self.getList();
            },
            getList() {
                let self = this;
                self.listLoading = true;
                request({
                    params: {
                        r: 'double-copy/pool/level',
                        page: self.page,
                    },
                    method: 'get',
                }).then(e => {
                    self.listLoading = false;
                    self.list = e.data.data.list;
                    self.pageCount = e.data.data.page_count;
                }).catch(e => {
                    console.log(e);
                });
            },
            logPagination(currentPage) {
                let self = this;
                self.logPage = currentPage;
                self.getLogList();
            },
            getLogList() {
                let self = this;
                self.logLoading = true;
                let params = {
                    r: 'double-copy/pool/send',
                    page:self.logPage,
                    level:self.level,
                };
                request({
                    params: params,
                    method: 'get',
                }).then(e => {
                    self.logLoading = false;
                    self.logList = e.data.data.list;
                    self.logPageCount = e.data.data.page_count;
                }).catch(e => {
                    console.log(e);
                });
            },
            // 操作处理
            handle(type, data = null) {
                let id = data ? parseInt(data.id) : '';
                switch (type) {
                    case 'edit':// 编辑
                        params = {
                            r: 'double-copy/pool/level-edit'
                        };
                        if (id) params = Object.assign(params, {
                            id: id
                        });
                        navigateTo(params);
                        break;
                    case 'destroy':
                        params = {id: data.id, status: -1};
                        this.$confirm('删除该条数据后不可以恢复, 是否继续?', '警告', {type: 'warning'}).then(() => {this.send(params,'double-copy/pool/handle')})
                        break;
                    case 'send':// 编辑
                        this.level = data.level
                        this.level_name = data.name
                        this.dialogVisible = true
                        this.getLogList()
                        break;
                    case 'close':// 关闭弹窗
                        this.log_user_id = 0
                        this.dialogVisible = false
                        this.logPage = 1
                        this.logList = []
                        break;
                    case  'recharge' :
                        this.visible = true
                        this.form.num = 0
                        this.form.desc = ''
                        this.form.level_id = data.id
                        break;
                }
            },
            send(params,url) {
                let self = this;
                let basic_params = {
                    r: url
                };
                params = Object.assign(basic_params, params);
                request({
                    params: params,
                    method: 'get'
                }).then(e => {
                    if (e.data.code == 0) {
                        self.$message.success(e.data.msg);
                        self.getList();
                    } else {
                        self.$message.error(e.data.msg);
                    }
                }).catch(e => {
                    console.log(e);
                });
            },

            recharge(formName) {
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        this.submitLoading = true
                        let params = {
                            r: 'double-copy/pool/recharge'
                        };
                        request({
                            params: params,
                            method: 'post',
                            data: this.form
                        }).then(e => {
                            this.submitLoading = false;
                            if (e.data.code == 0) {
                                this.$message.success(e.data.msg);
                                this.visible = false
                                this.getList();
                            } else {
                                this.$message.error(e.data.msg);
                            }
                        }).catch(e => {
                            this.submitLoading = false;
                        });
                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
        }
    });
</script>

<style>
    .table-body {
        padding: 20px;
        background-color: #fff;
    }

    .input-item {
        display: inline-block;
        width: 250px;
        margin: 0 0 20px;
    }

    .input-item .el-input__inner {
        border-right: 0;
    }

    .input-item .el-input__inner:hover {
        border: 1px solid #dcdfe6;
        border-right: 0;
        outline: 0;
    }

    .input-item .el-input__inner:focus {
        border: 1px solid #dcdfe6;
        border-right: 0;
        outline: 0;
    }

    .input-item .el-input-group__append {
        background-color: #fff;
        border-left: 0;
        width: 10%;
        padding: 0;
    }

    .input-item .el-input-group__append .el-button {
        padding: 0;
    }

    .input-item .el-input-group__append .el-button {
        margin: 0;
    }

    .table-body .el-button {
        padding: 0 !important;
        border: 0;
        margin: 0 5px;
    }
	
	
	.el-table th>.cell{
	  color: #333;
	  font-weight: bold;
	  font-size: 14px;
	 }
	 .el-table__footer-wrapper, .el-table__header-wrapper{
	  border-bottom: 1.4px solid #D6D6D6;
	 }
</style>