fastadmin_tailored/public/assets/js/backend/commission/level.js

define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefined, Backend, Table, Form) {

    var Controller = {
        index: function () {
            // 初始化表格参数
            Table.api.init({
                extend: {
                    index_url: 'commission/level/index' + location.search,
                    add_url: 'commission/level/add',
                    edit_url: 'commission/level/edit',
                    del_url: 'commission/level/delete',
                    multi_url: 'commission/level/multi',
                    import_url: 'commission/level/import',
                    table: 'commission_level',
                }
            });

            var table = $("#table");

            // 初始化表格
            table.bootstrapTable({
                url: $.fn.bootstrapTable.defaults.extend.index_url,
                pk: 'level',
                sortName: 'level',
                columns: [
                    [
                        {checkbox: true},
                        {field: 'level', title: __('等级权重'), width: 80, formatter: function(value, row, index) {
                            return '等级' + value;
                        }},
                        {field: 'name', title: __('等级名称'), operate: 'LIKE'},
                        {field: 'image', title: __('等级徽章'), operate: false, events: Table.api.events.image, formatter: Table.api.formatter.image},
                        {field: 'commission_rules', title: __('一级佣金比例'), operate: false, formatter: function(value, row, index) {
                            if (typeof value === 'string') {
                                try {
                                    value = JSON.parse(value);
                                } catch (e) {
                                    value = {};
                                }
                            }
                            return (value.commission_1 || '0.00') + '%';
                        }},
                        {field: 'commission_rules', title: __('二级佣金比例'), operate: false, formatter: function(value, row, index) {
                            if (typeof value === 'string') {
                                try {
                                    value = JSON.parse(value);
                                } catch (e) {
                                    value = {};
                                }
                            }
                            return (value.commission_2 || '0.00') + '%';
                        }},
                        {field: 'commission_rules', title: __('三级佣金比例'), operate: false, formatter: function(value, row, index) {
                            if (typeof value === 'string') {
                                try {
                                    value = JSON.parse(value);
                                } catch (e) {
                                    value = {};
                                }
                            }
                            return (value.commission_3 || '0.00') + '%';
                        }},
                        {field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, 
                         buttons: [
                             {
                                 name: 'edit',
                                 text: __('编辑'),
                                 title: __('编辑'),
                                 classname: 'btn btn-xs btn-success btn-editone',
                                 icon: 'fa fa-edit',
                                 url: 'commission/level/edit',
                                 callback: function (data) {
                                     table.bootstrapTable('refresh');
                                 }
                             }
                         ], 
                         formatter: Table.api.formatter.operate}
                    ]
                ]
            });

            // 为表格绑定事件
            Table.api.bindevent(table);
        },
        add: function () {
            Controller.api.bindevent();
        },
        edit: function () {
            Controller.api.bindevent();
        },
        select: function () {
            // 初始化表格参数
            Table.api.init({
                extend: {
                    index_url: 'commission/level/select' + location.search,
                }
            });

            var table = $("#table");

            // 初始化表格
            table.bootstrapTable({
                url: $.fn.bootstrapTable.defaults.extend.index_url,
                pk: 'level',
                sortName: 'level',
                columns: [
                    [
                        {checkbox: true},
                        {field: 'level', title: __('等级权重'), width: 80},
                        {field: 'name', title: __('等级名称')},
                        {field: 'image', title: __('等级徽章'), operate: false, events: Table.api.events.image, formatter: Table.api.formatter.image},
                        {field: 'commission_rules.commission_1', title: __('一级佣金比例'), operate: false, formatter: function(value, row, index) {
                            return (value || '0.00') + '%';
                        }},
                        {field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, 
                         buttons: [
                             {
                                 name: 'choose',
                                 text: __('选择'),
                                 title: __('选择'),
                                 classname: 'btn btn-xs btn-primary btn-choose',
                                 icon: 'fa fa-check',
                                 click: function (data) {
                                     var multiple = Backend.api.query('multiple');
                                     multiple = multiple == 'true' ? true : false;
                                     Fast.api.close(data);
                                 }
                             }
                         ], 
                         formatter: Table.api.formatter.operate}
                    ]
                ]
            });

            // 为表格绑定事件
            Table.api.bindevent(table);
        },
        api: {
            // 默认等级选项
            defaultLevels: [
                {name: '一级', level: 1},
                {name: '二级', level: 2},
                {name: '三级', level: 3},
                {name: '四级', level: 4},
                {name: '五级', level: 5},
                {name: '六级', level: 6},
                {name: '七级', level: 7},
                {name: '八级', level: 8},
                {name: '九级', level: 9},
                {name: '十级', level: 10}
            ],
            
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
                
                var self = this;
                
                // 初始化页面数据
                self.initPageData();
                
                // 绑定等级选择事件
                $(document).on('click', '.level-select-item', function() {
                    var level = $(this).data('level');
                    
                    // 如果是禁用的按钮，不执行任何操作
                    if ($(this).hasClass('disabled')) {
                        return false;
                    }
                    
                    var existLevels = $('.level-select-item.disabled').map(function() {
                        return $(this).data('level');
                    }).get();
                    
                    if (existLevels.indexOf(level) === -1) {
                        $('.level-select-item').removeClass('active');
                        $(this).addClass('active');
                        $('input[name="row[level]"]').val(level);
                    }
                });
            },
            
            initPageData: function() {
                var self = this;
                var currentLevel = $('input[name="row[level]"]').val();
                var isEdit = currentLevel ? true : false;
                
                // 获取已存在的等级
                $.ajax({
                    url: Fast.api.fixurl('commission/level/select'),
                    type: 'GET',
                    success: function(ret) {
                        if (ret.code === 1) {
                            var existLevels = ret.data.map(function(item) {
                                return parseInt(item.level);
                            });
                            
                            if (isEdit) {
                                // 编辑模式，移除当前编辑的等级
                                var index = existLevels.indexOf(parseInt(currentLevel));
                                if (index > -1) {
                                    existLevels.splice(index, 1);
                                }
                            }
                            
                            self.renderLevelSelect(existLevels, currentLevel);
                        } else {
                            // 请求成功但返回错误，至少显示基本的等级选择器
                            self.renderLevelSelect([], currentLevel);
                        }
                    },
                    error: function(xhr, status, error) {
                        // Ajax请求失败，至少显示基本的等级选择器
                        self.renderLevelSelect([], currentLevel);
                    }
                });
            },
            
            renderLevelSelect: function(existLevels, currentLevel) {
                var html = '';
                
                // 如果是编辑1级（默认等级），只显示1级并禁用选择
                if (currentLevel && parseInt(currentLevel) === 1) {
                    html += '<div class="level-select-item btn btn-default active disabled" data-level="1">';
                    html += '一级（默认等级，不可修改）';
                    html += '</div>';
                } else {
                    // 非1级或新建时，显示可选等级
                    this.defaultLevels.forEach(function(item) {
                        var disabled = existLevels.indexOf(item.level) !== -1 ? 'disabled' : '';
                        var active = (currentLevel && parseInt(currentLevel) === item.level) ? 'active' : '';
                        
                        html += '<div class="level-select-item btn btn-default ' + disabled + ' ' + active + '" data-level="' + item.level + '">';
                        html += item.name;
                        html += '</div>';
                    });
                }
                
                $('.level-select-container').html(html);
            }
        }
    };
    return Controller;
});