guochanhua/zskk_new_manage/public/assets/js/backend/template/template.js

define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefined, Backend, Table, Form) {
    let table1_extend = {
        index_url: 'template/template/publicParentIndex/' + location.search,
        add_url: 'template/template/publicAddParent',
        edit_url: 'template/template/publicEditParent',
        del_url: 'template/template/publicDelParent',
        multi_url: 'template/template/multi',
        table: 'templates',
    };
    let table2_extend = {
        index_url: 'template/template/publicChildIndex/' + location.search,
        add_url: 'template/template/publicAddChild',
        edit_url: 'template/template/publicEditChild',
        del_url: 'template/template/del',
        multi_url: 'template/template/multi',
        table: 'templates',
    };
    let Controller = {
        index: function () {
            // 初始化表格参数配置
            Table.api.init();
            this.table.first();
            this.table.second();
        },
        table: {
            first: function () {
                // 初始化表格参数配置
                Table.api.init({
                    extend: table1_extend
                });

                let table1 = $("#table1");
                // 初始化表格
                table1.bootstrapTable({
                    url: $.fn.bootstrapTable.defaults.extend.index_url,
                    pk: 'id',
                    pageSize: 10,
                    toolbar: '#toolbar1',
                    showToggle: false,
                    showExport: false,
                    showColumns: false,
                    commonSearch: false,
                    singleSelect: true, //是否启用单选
                    clickToSelect: true,
                    onCheck: function (rows) {  // 选中事件
                        // 刷新子级列表
                        $('#child_name').text(rows.title);
                        $('#selected_parent').data('pid',rows.id);
                        $('#toolbar2 .btn-refresh').trigger('click');
                    },
                    columns: [
                        [
                            {checkbox: true,},
                            {field: 'title', title: __('Title')},
                            {field: 'exam_class_id', title: __('Exam_class_id')},
                            {
                                field: 'operate',
                                title: __('Operate'),
                                table: table1,
                                events: Controller.api.events.table1_operate,
                                formatter: Table.api.formatter.operate
                            }
                        ]
                    ]
                });

                // 默认选中第一条
                table1.on('post-body.bs.table', function () {
                    $('#table1 tr[data-index="0"] td input[data-index="0"]').trigger('click');
                });
                
                // 为表格绑定事件
                Table.api.bindevent(table1);

                // 自定义添加按钮事件
                $('#toolbar1 .btn-add-1').on('click', function () {
                    let ids = Table.api.selectedids(table1);
                    let url = table1_extend.add_url;
                    if (url.indexOf("{ids}") !== -1) {
                        url = Table.api.replaceurl(url, {ids: ids.length > 0 ? ids.join(",") : 0}, table1);
                    }
                    Fast.api.open(url, __('Add'), $(this).data() || {});
                });
            },
            second: function () {
                // 初始化表格参数配置
                Table.api.init({
                    extend: table2_extend
                });


                let table2 = $("#table2");

                // 初始化表格
                table2.bootstrapTable({
                    url: $.fn.bootstrapTable.defaults.extend.index_url,
                    pk: 'id',
                    toolbar: '#toolbar2',
                    sortName: 'createdAt',
                    showToggle: false,
                    showColumns: false,
                    queryParams: function queryParams(params) {
                        params.pid = $('#selected_parent').data('pid');
                        return params;
                    },
                    columns: [
                    [
                        {field: 'title', title: __('Title'), align: "left"},
                        {field: 'exam_class_id', title: __('Exam_class_id'),searchable:false},
                        {field: 'description', title: __('Description'), searchable:false, hover: true, formatter:Table.api.formatter.content, width: '200'},
                        {field: 'impression', title: __('Impression'), searchable:false, hover: true, formatter:Table.api.formatter.content, width: '200'},
                        {field: 'createdAt', title: __('Createdat'), operate: 'RANGE', addclass: 'datetimerange'},
                        {
                            field: 'operate',
                            title: __('Operate'),
                            table: table2,
                            events: Table.api.events.operate,
                            formatter: Table.api.formatter.operate
                        }
                    ]
                ]
                });

                // 为表格绑定事件
                Table.api.bindevent(table2);

                $('#toolbar2 .btn-add-2').on('click', function () {
                    let pid = $('#selected_parent').data('pid');
                    let url = table2_extend.add_url;
                    url = Table.api.replaceurl(url, {ids: pid}, table2);
                    Fast.api.open(url, __('Add'), $(this).data() || {});
                });

                return table2;
            },
        },
        publicaddparent: function () {
            Controller.api.bindevent();
        },
        publiceditparent: function () {
            Controller.api.bindevent();
        },
        publicaddchild: function () {
            Controller.api.bindevent();
        },
        publiceditchild: function () {
            Controller.api.bindevent();
        },
        api: {
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
            },
            formatter: {
                name: function (value) {
                    return "<strong>" + value + "</strong>";
                }
            },
            events: {
                table1_operate: {
                    'click .btn-editone': function (e, value, row, index) {
                        e.stopPropagation();
                        e.preventDefault();
                        let table = $(this).closest('table');
                        let options = table.bootstrapTable('getOptions');
                        let ids = row[options.pk];
                        row = $.extend({}, row ? row : {}, {ids: ids});
                        let url = table1_extend.edit_url;
                        Fast.api.open(Table.api.replaceurl(url, row, table), __('Edit'), $(this).data() || {});
                    },
                    'click .btn-delone': function (e, value, row, index) {
                        e.stopPropagation();
                        e.preventDefault();
                        let that = this;
                        $(that).data('url',table1_extend.del_url);
                        let top = $(that).offset().top - $(window).scrollTop();
                        let left = $(that).offset().left - $(window).scrollLeft() - 260;
                        if (top + 154 > $(window).height()) {
                            top = top - 154;
                        }
                        if ($(window).width() < 480) {
                            top = left = undefined;
                        }
                        Layer.confirm(
                            __('Are you sure you want to delete this item?'),
                            {icon: 3, title: __('Warning'), offset: [top, left], shadeClose: true},
                            function (index) {
                                let table = $(that).closest('table');
                                let options = table.bootstrapTable('getOptions');
                                Table.api.multi("del", row[options.pk], table, that);
                                Layer.close(index);
                            }
                        );
                    }
                }
            }
        },

    };
    return Controller;
});