import { tpl, tbodyTpl } from './anchorTpl';
import PageTable from '@core/component/pageTable';
import sendHttp,{fetch} from '@core/component/httpClient';
import ShortPagination from '@core/component/shortPagination';
import { Messager } from '@core/component/msgDistribute';
import LinkTool from '../../linkTool';
const Anchor = (($) => {
    const DefaultConfig = {
        tpl,
        tbodyTpl
    };
    class Anchor {
        constructor(config) {
            this._config = this._getConfig(config);
            this.el = this._config.node;
            this.$el = $(this.el);
            let html = template.render(this._config.tpl, this._config);
            this.$el.html(html);
            let self = this;
            this.pageTable = new PageTable({
                node: this.$el.find('.J_table')[0],
                className: "cd-mytable",
                theadRenderer: ['楼层序号', '楼层名称', '楼层ID'],
                columnWidth: ["33%", "33%", "34%"],
                itemRenderer: this._config.tbodyTpl,
                pageSize: 10,
                loading: true,
                fixedThead: true,
                frontEndPaging: true,
                pagination: ShortPagination,
                onDomReady: ($node) => {
                    console.log("onDomReady:");
                },
                onPageChange: (data) => {
                    console.log("pageChange selected:" + data.selected);
                    self.queryData(data.selected);
                },
                onDomUpdate: this._config.onDomUpdate
            })
            this.queryData();
            this._addEvent();
        }
        
        queryData() {
            let list;
            if (this._config.env.platformId === 0) { 
                list = Array.from(
                    $('.J_LayoutWrap'), (val) => {
                        let result = {};
                        let $module = $(val);
                        result.id = $module.attr('id');
                        result.index = $module.index('.J_LayoutWrap');
                        result.name = $module.attr('name');
                        result.platformId = 0;
                        return result;
                    });
            } else if (this._config.env.platformId === 1) { 
                if(window.page_data.isSDKM && window.page_data.isEditor){
                    list = [
                        {
                            "id":"9341033198845",
                            "configEmpty":false,
                            "index":1,
                            "name":"导航",
                            "alias":"",
                            "moduleFlag":"MobNavi",
                            "platformId":1
                        },
                        {
                            "id":"9351509246949",
                            "configEmpty":false,
                            "index":2,
                            "name":"视频",
                            "alias":"",
                            "moduleFlag":"mVideo",
                            "platformId":1
                        },
                        {
                            "id":"640478663845",
                            "configEmpty":false,
                            "index":3,
                            "name":"轮播",
                            "alias":"",
                            "moduleFlag":"mBanner",
                            "platformId":1
                        }
                    ];
                }
                else{
                    const currentModule = window._Module.getActiveModule(); 
                    const currentModuleFlag = currentModule.$el.attr('data-module-flag');
                    list = Array.from(
                        $('.J_module[data-floor-position="content"]:not([data-parent-id])', document.querySelector('iframe[name="iframe"]').contentWindow.document), (val) => {
                            let result = {};
                            let $module = $(val);
                            result.id = $module.attr('data-floor-id');
                            result.configEmpty = $module.attr('data-config-empty') === 'true' ? true : false;
                            result.index = $module.index();
                            result.name = $module.attr('data-module-name');
                            result.alias = $module.attr('data-module-alias');
                            result.moduleFlag = $module.attr('data-module-flag') || ''; 
                            result.platformId = 1;
                            let status = Number($module.attr('data-floor-status')).toString(2).split('').reverse().join('').substring(4,6);
                            result.floorStatus = status  == '11' || status == '01' ? true : false;
                            if (currentModuleFlag.includes('MobNavi') && result.index < currentModule.$el.index() && !result.floorStatus) {
                                result.disabled = true;
                            }
                            return result;
                        })
                }
            }
            this.pageTable.update({
                loading: false,
                dataProvider: list
            })
        }
        
        _addEvent() {
            let _this = this;
            
            this.linkChangeKey = Messager.on('linkChange', (req, res) => {
                this.$el.find('[' + _this._config.linkAttr + ']').each(function() {
                    let val = $(this).attr(_this._config.linkAttr);
                    if (val === res.link) {
                        this.checked = true;
                    } else {
                        this.checked = false;
                    }
                })
            })
            
            this.$el.on('change.anchor', '[' + _this._config.linkAttr + ']', function() {
                let $this = $(this);
                let link = $this.attr(_this._config.linkAttr);
                let originalData = $this.attr(_this._config.originalDataAttr);
                let linkType = LinkTool.Type.Anchor;
                Messager.trigger('linkChange', {
                    link,
                    originalData,
                    linkType,
                });
            })
            
            this.$el.on('click.anchor', 'table tbody tr', function() {
                $(this).find('input[type=radio]').trigger('change');
            })
            
            this.$el.on('dblclick.anchor', 'table tbody tr', function() {
                Messager.trigger('confirm');
            })
            
            this.$el.on('click.anchor', '.J_ok', function() {
                Messager.trigger('confirm');
            })
            
            this.$el.on('click.anchor', '.J_cancel', function() {
                Messager.trigger('cancel');
            })
        }
        
        _getConfig(config) {
            return $.extend(true, {}, DefaultConfig, config);
        }
        
        dispose() {
            Messager.off(this.linkChangeKey);
            this.$el.off('linkChange.anchor').off('change.anchor').off('click.anchor').off('dblclick.anchor');
        }
    }
    return Anchor;
})($);
export default Anchor;