import GridManager from 'gridmanager-vue';
Vue.use(GridManager);

import GridManager from 'gridmanager-vue';

new Vue({
    el: '#app',
    components: {
        GridManager
    }
});

    // 表格
    gridOption = {
        // 表格唯一标识
        gridManagerName: 'test-gm',

        // 高度
        height: '300px',

        // 首次是否加载
        firstLoading: false,

        // 列配置
        columnData: [
            {
                key: 'shopId',
                width: '180px',
                text: '店铺id',
                align: 'center'
            },{
                key: 'platId',
                text: '平台',

                // template=> function: return dom
                template: platId => {
                    const span = document.createElement('span');
                    span.style.color = 'blue';
                    span.innerText = platId;
                    return span;
                }
            },{
                key: 'platNick',
                text: '店铺名称',

                // template=> string dom
                template: `<span style="color: red">跟据相关法规，该单元格被过滤</span>`
            },{
                key: 'createTime',
                text: '创建时间',
            },{
                key: 'updateTime',
                text: '更新时间',

                // template=> function: return string dom
                template: updateTime => {
                    return `<span style="color: blue">${updateTime}</span>`;
                }
            },{
                key: 'action',
                text: '操作',
                width: '100px',
                align: 'center',

                // tempalte中使用了vue模块，则必须将参数useCompile配置为true，否则vue模版将不会解析。
                useCompile: true,

                // template=> function: return vue template, 需配置useCompile=true
                // vue模版中将自动添加row字段，该字段为当前行所使用的数据
                // vue模版将不允许再使用template函数中传入的参数
                template:() => {
                    return '<el-button size="mini" type="danger" @click="delRelation(row)">解除绑定</el-button>';
                }
            }
        ],
        // 使用分页
        supportAjaxPage: true,

        // 数据来源，类型: string url || data || function return[promise || string url || data]
        ajax_data: settings => {
            return tenantRelateShop(Object.assign({}, this.searchParams, settings.pageData));
        },

        // 请求失败后事件
        ajax_error: err => {
            console.log(err);
        },

        // checkbox选择事件
        checkedAfter: rowList => {
            this.selectedCheck(rowList);
        },

        // 每页显示条数
        pageSize: 20

        // ...更多配置请参考API
    };

// 刷新
this.$refs['grid'].$el.GM('refreshGrid');

// 更新查询条件
this.$refs['grid'].$el.GM('setQuery', this.searchForm);

// ...其它更多请直接访问API

import GridManager from 'gridmanager-vue';
console.log('GridManager', GridManager.version);