qimall/addons/Distribution/backend/views/default/commission-basic-log.php

<?php
/**
 * @link:http://www.goodmall.com/
 * @copyright: Copyright (c) 2020
 * Created by PhpStorm
 * Author: ganxiaohao
 * Date: 2020-05-08
 * Time: 16:11
 */
?>

<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>
        </div>
        <div class="table-body">
            <div class="input-item">
                <el-input @keyup.enter.native="search" size="small"
                          placeholder="请输入来源表id"
                          v-model="source_table_id"
                          clearable
                          @clear="search">
                    <el-button slot="append" icon="el-icon-search" @click="search"></el-button>
                </el-input>
            </div>
            <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="source_table" label="来源表" width="100" align="center"></el-table-column>
                <el-table-column prop="source_table_id" label="来源表id" width="100" align="center"></el-table-column>
                <el-table-column prop="type" label="类型" width="100" align="center"></el-table-column>
                <el-table-column prop="from_type" label="来源类型" width="100" align="center"></el-table-column>
                <el-table-column prop="basic_config" label="基础配置" align="center">
                    <template slot-scope="scope">
                        <el-input type="textarea" size="small" v-model="scope.row.basic_config"></el-input>
                    </template>
                </el-table-column>
                <el-table-column prop="level_config" label="等级配置"  align="center">
                    <template slot-scope="scope">
                        <el-input type="textarea" size="small" v-model="scope.row.level_config"></el-input>
                    </template>
                </el-table-column>
                <el-table-column prop="goods_config" label="商品独立配置" align="center">
                    <template slot-scope="scope">
                        <el-input type="textarea" size="small" v-model="scope.row.goods_config"></el-input>
                    </template>
                </el-table-column>
                <el-table-column prop="relation_ship" label="关系链等级" align="center">
                    <template slot-scope="scope">
                        <el-input type="textarea" size="small" v-model="scope.row.relation_ship"></el-input>
                    </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>
</div>
<script>
    const app = new Vue({
        el: '#app',
        data() {
            return {
                list: [],
                source_table_id: '',
                listLoading: false,
                page: 1,
                pageCount: 0,

            };
        },
        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: 'distribution/default/commission-basic-log',
                        page: self.page,
                        source_table_id: this.source_table_id
                    },
                    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);
                });
            },
        }
    });
</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>