book_admin/public/assets/js/backend/booklist/book.js

define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'clipboard'], function ($, undefined, Backend, Table, Form, Clipboard) {
    var contentArr = [];

    var Controller = {
        index: function () {
            // 初始化表格参数配置
            Table.api.init({
                extend: {
                    index_url: 'booklist/book/index',
                    add_url: 'booklist/book/add',
                    edit_url: 'booklist/book/edit',
                    del_url: 'booklist/book/del',
                    multi_url: 'booklist/book/multi',
                    table: 'book_list',
                }
            });

            var table = $("#table");

            if (Config.limitShow == true) {
                //渠道商
                // 初始化表格
                table.bootstrapTable({
                    url: $.fn.bootstrapTable.defaults.extend.index_url,
                    pk: 'id',
                    sortName: 'id',
                    showColumns: false,
                    showToggle: false,
                    showExport: false,
                    searchFormVisible: false,
                    search: false,
                    commonSearch: false,
                    columns: [
                        [
                            {checkbox: true},
                            {field: 'id', title: __('Id')},
                            {field: 'url', title: __('Url'), formatter: Controller.api.source_url, operate: false},
                            {field: 'title', title: __('Title')},
                            {field: 'name', title: __('Name')},
                            {field: 'status', title: __('Status'), visible:false, searchList: {"normal":__('normal'),"hidden":__('hidden'),"deleted":__('deleted')}},
                            {field: 'status_text', title: __('Status'), operate:false},
                            {field: 'createtime', title: __('Createtime'), operate:'RANGE', addclass:'datetimerange', formatter: Table.api.formatter.datetime},
                            {field: 'updatetime', title: __('Updatetime'), operate:'RANGE', addclass:'datetimerange', formatter: Table.api.formatter.datetime},
                            {
                                field: 'status',
                                title: __('Operate'),
                                operate: false,
                                formatter: function (value) {
                                    if (value == 'normal') {
                                        return '<a href="javascript:;" class="btn btn-click btn-operate-copy" title="复制" data-table-id="table" data-field-index="8" data-row-index="0" data-button-index="0">复制&nbsp;&nbsp;<i class="fa fa-copy copy"></i></a>';
                                    } else {
                                        return '-';
                                    }
                                }
                            }
                        ]
                    ]
                });

                var clipboard = new Clipboard('.btn-operate-copy', {
                    target: function (trigger) {
                        var stxt = $(trigger).parent().parent().find('.url_text i').data('clipboard-text');
                        trigger = document.querySelector('#many_copy_dom');
                        $('#many_copy_dom').html(stxt);
                        return trigger;
                    }
                });
                clipboard.on('success',function (data) {
                    Toastr.success('复制成功');
                }).on('error',function (data) {
                    Toastr.error('复制失败');
                });
            } else {
                // 初始化表格
                table.bootstrapTable({
                    url: $.fn.bootstrapTable.defaults.extend.index_url,
                    pk: 'id',
                    sortName: 'id',
                    columns: [
                        [
                            {checkbox: true},
                            {field: 'id', title: __('Id')},
                            {field: 'title', title: __('Title')},
                            {field: 'name', title: __('Name')},
                            {field: 'status', title: __('Status'), visible:false, searchList: {"normal":__('normal'),"hidden":__('hidden'),"deleted":__('deleted')}},
                            {field: 'status_text', title: __('Status'), operate:false},
                            {field: 'createtime', title: __('Createtime'), operate:'RANGE', addclass:'datetimerange', formatter: Table.api.formatter.datetime},
                            {field: 'updatetime', title: __('Updatetime'), operate:'RANGE', addclass:'datetimerange', formatter: Table.api.formatter.datetime},
                            {field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate,buttons:Controller.api.formatter.showBtn()}
                        ]
                    ]
                });
            }

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

        },
        add: function () {
            Controller.api.bindevent();
        },
        edit: function () {
            contentArr = JSON.parse(Config.row.content);

            if (contentArr.length > 0) {
                var html = '';

                for (var j = 0; j < contentArr.length; j++) {
                    var arr = contentArr[j];
                    var id = arr.id, image = arr.image, description = arr.description;

                    html += '<div class="page-per" id="content-page'+id+'">'+
                                '<p><img class="content-image" src="'+image+'" alt="图片"><span>'+description+'</span></p>'+
                                '<div class="no-border btn-opreate" data-row_id="'+id+'">'+
                                '<span><a href="javascript:;" class="btn btn-modify"><i class="fa fa-pencil-square-o" aria-hidden="true"></i>编辑</a></span>'+
                                '<span><a href="javascript:;" class="btn btn-deleted"><i class="fa fa-trash-o" aria-hidden="true"></i>删除</a></span>'+
                                '</div>'+
                            '</div>';

                }

                $(".img_txt_list").append(html);
                $("#content_json").val(JSON.stringify(contentArr));
            }

            Controller.api.bindevent();
        },
        api: {
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));

                //弹出选择
                $(document).on('click', '#select-resources', function () {
                    Fast.api.open('booklist/media/select', '选择', {
                        callback: function (rows) {

                            if (rows.length > 0) {
                                for (var m=0; m < rows.length; m++) {
                                    parseData(rows[m]);
                                }
                            }
                        }
                    });
                });

                //弹出新增
                $(document).on('click', '#add-resources', function () {
                    Fast.api.open('booklist/media/add?from_window=new', '新增', {
                        callback: function (data) {
                            parseData(data);
                        }
                    });
                });

                //初始化结果
                var parseData = function (row) {
                    var id = row.id;

                    //判断是否存在
                    if (contentArr.length > 0) {
                        for(var i = 0; i< contentArr.length; i++) {
                            if (contentArr[i].id == id) {
                                //已存在 不在添加
                                Toastr.error("书单已存在该资源，请勿重复选择");
                                return false;
                                break;
                            }
                        }
                    }

                    var html = '<div class="page-per" id="content-page'+id+'">'+
                                    '<p><img class="content-image" src="'+row.image+'" alt="图片"><span>'+row.description+'</span></p>'+
                                    '<div class="no-border btn-opreate" data-row_id="'+id+'">'+
                                        '<span><a href="javascript:;" class="btn btn-modify"><i class="fa fa-pencil-square-o" aria-hidden="true"></i>编辑</a></span>'+
                                        '<span><a href="javascript:;" class="btn btn-deleted"><i class="fa fa-trash-o" aria-hidden="true"></i>删除</a></span>'+
                                    '</div>'+
                                '</div>';

                    $(".img_txt_list").append(html);
                    contentArr.push(row);
                    addContent();
                };

                var addContent = function() {
                    $("#content_json").val(JSON.stringify(contentArr));
                };

                var delContent = function(id)
                {
                    for(var i = 0; i< contentArr.length; i++) {
                        if (contentArr[i].id == id) {
                            contentArr.splice(i, 1);
                            $("#content-page"+id).remove();
                            break;
                        }
                    }

                    $("#content_json").val(JSON.stringify(contentArr));
                };

                //编辑
                $(document).on('click', '.btn-modify', function () {
                    var id = $(this).parent().parent().data('row_id');
                    Fast.api.open('booklist/media/edit/ids/'+id+'?from_window=edit', '编辑', {
                        callback: function (data) {
                            delContent(id);
                            parseData(data);
                        }
                    });
                });

                //删除
                $(document).on('click', '.btn-deleted', function () {
                    var id = $(this).parent().parent().data('row_id');
                    delContent(id);
                });

                $(document).on('click', '.btn-operate-copy', function () {
                    $(this).parent().parent().find('.url_text').click();
                    //$(this).parent().parent().find('.url_text').trigger("click");
                });
            },
            source_url: function (value, row, index) {
                var html = [];

                value = row.url;

                if (row.status == "normal") {
                    html.push('<div class="link_txt"></div><div class="url_text">' + value + '&nbsp;<i class="fa fa-copy copy" data-clipboard-text="' + value + '"></i>');
                } else {
                    html.push('<div class="link_txt">该书单已关闭不可使用</div>');
                }

                return html.join('<br>');
            },
            formatter: {
                showBtn: function(){
                    return [
                        {name: 'clear_cache', text: '清除书单缓存', title: '清除书单缓存', classname: 'btn btn-xs btn-danger btn-ajax', url: '/admin/booklist/book/clearcache', callback:function(data){}}
                    ];
                },
            }
        }
    };
    return Controller;
});