import modal from './libs/function/modal' // 加载modal
import apis from './libs/function/apis' // 加载apis
import funs from './libs/function/funs' // 加载apis
import uploader from './libs/uploader/uploader' // 加载uploader
import form from './libs/function/form' // 加载form
import config from './config'  // 加载config
import dialog from './components/dialog' // 加载dialog
import VXETable from 'vxe-table'  // 加载vxe-table
import MkPrinter from './components/editors/MkPrinter.vue'
import MkCropper from './components/editors/MkCropper.vue'
import MkFormCropper from './components/editors/MkFormCropper.vue'
import MkFormInputShow from './components/editors/MkFormInputShow.vue'
import MkFormProgress from './components/editors/MkFormProgress.vue'
import MkGridSelect from './components/editors/MkGridSelect.vue' // 加载下拉表格
import MkGridDataSelector from './components/editors/MkGridDataSelector.vue' // 加载下拉表格
import MkFormDataSelector from './components/editors/MkFormDataSelector.vue'  // 加载下拉表单
import switchCompany from './components/switchCompany/switchCompany'  // 加载切换公司
import XEUtils from 'xe-utils'  // 加载xe-utils 
import MkFormUploader from './components/editors/MkFormUploader.vue'
import MkFormEditor from './components/editors/MkFormEditor.vue'
import hevueImgPreview from 'hevue-img-preview'
import BasicPageList from './basic-pages/list.vue'
import BasicPageEdit from './basic-pages/edit.vue'

// 创建一个下拉表格渲染
VXETable.renderer.add('MkGridDataSelector', { // 创建一个下拉表格渲染
    autofocus: '.vxe-input--inner',
    renderEdit(h, renderOpts, params) {
        return <mk-grid-data-selector params={params}></mk-grid-data-selector>
    }
})
VXETable.renderer.add('MkGridSelect', {
    autofocus: '.vxe-input--inner',
    renderEdit(h, renderOpts, params) {
        return <mk-grid-select params={params}></mk-grid-select>
    }
})

// 创建一个表单输入框渲染
VXETable.renderer.add('MkFormDataSelector', {
    // 项内容模板
    renderItemContent(h, renderOpts, params) {
        const { data, field } = params
        const props = renderOpts.props || {}
        return <mk-form-data-selector v-model={data[field]} {...{ props }}></mk-form-data-selector>
    }
})
VXETable.renderer.add('MkFormInputShow', {
    // 项内容模板
    renderItemContent(h, renderOpts, params) {
        const { data, field } = params
        const props = renderOpts.props || {}
        return <mk-form-input-show v-model={data[field]} {...{ props }}></mk-form-input-show>
    }
})
VXETable.renderer.add('MkFormProgress', {
    // 项内容模板
    renderItemContent(h, renderOpts, params) {
        const { data, field } = params
        const props = renderOpts.props || {}
        return <mk-form-progress v-model={data[field]} {...{ props }}></mk-form-progress>
    }
})


VXETable.renderer.add('MkFormUploader', {
    // 项内容模板
    renderItemContent(h, renderOpts, params) {
        const { data, field } = params
        const props = renderOpts.props || {}
        const options = renderOpts.options || []
        return <mk-form-uploader options={options} v-model={data[field]} {...{ props }}></mk-form-uploader>
    }
})
VXETable.renderer.add('MkFormCropper', {
    // 项内容模板
    renderItemContent(h, renderOpts, params) {
        const { data, field } = params
        const props = renderOpts.props || {}
        const options = renderOpts.options || []
        return <mk-form-cropper options={options} v-model={data[field]} {...{ props }}></mk-form-cropper>
    }
})
VXETable.renderer.add('MkFormEditor', {
    // 项内容模板
    renderItemContent(h, renderOpts, params) {
        const { data, field } = params
        const props = renderOpts.props || {}
        const options = renderOpts.options || []
        return <mk-form-editor options={options} v-model={data[field]} {...{ props }}></mk-form-editor>
    }
})
VXETable.formats.mixin({
    formatYesNo({ cellValue }) { // 格式化是否
        return cellValue ? '是' : '否'
    },
    formatRef({ cellValue, column }) { // 格式化参照

        if (column && column.params
            && column.params.dataType == "object"
            && column.params.textField && typeof (cellValue) == "object"

        ) {
            return cellValue[column.params.textField];
        }
        return cellValue && cellValue[1] ? cellValue[1] : ''
    },
    formatStatus({ cellValue }) { // 格式化状态
        if (cellValue && (cellValue.toLowerCase() == 'completed' || cellValue.toLowerCase() == 'approved')) {
            return '生效';
        }
        return '未审';
    },
    formatDateTime({ cellValue }) { // 日期时间格式化

        if (!cellValue) {
            return '';
        }
        if (typeof (cellValue) == "number") {
            cellValue = new Date(cellValue * 1000);
        }
        return XEUtils.toDateString(cellValue, 'yyyy-MM-dd HH:mm:ss')
    },
    formatDate({ cellValue }) { // 日期格式化
        if (!cellValue) {
            return '';
        }
        if (typeof (cellValue) == "number") {
            cellValue = new Date(cellValue * 1000);
        }
        return XEUtils.toDateString(cellValue, 'yyyy-MM-dd')
    },
    formatNumber({ cellValue }) { // 数字格式化
        if (cellValue === 0) return '0';
        if (!cellValue) return '';
        return parseFloat(cellValue).toFixed(2)
    },
    formatImage({ cellValue }) { // 格式化状态
        if (!cellValue) return '';
        return `<img src="${cellValue}">`;
    },
    formatEnum({ cellValue, column }) { // 格式化状态
        if (cellValue == null) return '';
        let params = column.params;
        if (params && params.data) {
            params = params.data;
        }
        if (!params) return '';
        for (let i = 0; i < params.length; i++) {
            if (params[i].value == cellValue) {
                return '' + params[i].label + '';
            }
        }
        return '';
    },
    formatPercentage({ cellValue }) { // 百分比的形式显示
        if (cellValue === 0) return '0%';
        if (!cellValue) return '';
        return parseFloat(cellValue).toFixed(2) + "%";
    },
})

VXETable.renderer.add('enum', {
    renderDefault(h, renderOpts, params) {
        let { row, column } = params
        let cellValue = row[column.field];
        for (let i = 0; column.params && i < column.params.data.length; i++) {
            if (column.params.data[i].value == cellValue) {
                let cls = column.params.cls + ' ' + column.params.cls + '_' + column.params.data[i].value;
                return <span class={cls}>{column.params.data[i].label}</span>;
            }
        }
        return <span></span>;
    }
})

VXETable.renderer.add('progress', {
    renderDefault(h, renderOpts, params) {
        let { row, column } = params
        let cellValue = row[column.field] || 0;
        return <a-progress  percent={cellValue} />; 
    }
})


var mk = {

    ...modal,  // modal

    ...apis,  //API调用相关的方法

    ...funs, //常用的方法

    ...form, //表单常用的方法

    config: config,

    dialog: dialog,

    uploadFile: uploader.uploadFile,
    getPreviewSrc: uploader.getPreviewSrc,

    getWindowSize: () => {
        return {
            width: document.documentElement.clientWidth || document.body.clientWidth,
            height: document.documentElement.clientHeight || document.body.clientHeight
        };
    },

    getOffsetTop: (el) => {
        function getTop(e) {
            var offset = e.offsetTop;
            if (e.offsetParent != null) offset += getTop(e.offsetParent);
            return offset;
        }
        return getTop(el);
    },

    init: (Vue) => {
        Vue.component("mk-toolbar", () => import("./components/toolbar/toolbar"));


        Vue.component(MkFormDataSelector.name, MkFormDataSelector)
        Vue.component(MkGridDataSelector.name, MkGridDataSelector)
        Vue.component(MkGridSelect.name, MkGridSelect)
        Vue.component(MkPrinter.name, MkPrinter)
        Vue.component(MkCropper.name, MkCropper)

        Vue.component(switchCompany.name, switchCompany)

        Vue.component(MkFormUploader.name, MkFormUploader);
        Vue.component(MkFormEditor.name, MkFormEditor);
        Vue.component(MkFormCropper.name, MkFormCropper);
        Vue.component(MkFormInputShow.name, MkFormInputShow);
        Vue.component(MkFormProgress.name, MkFormProgress);

        
        Vue.component(BasicPageList.name, BasicPageList);
        Vue.component(BasicPageEdit.name, BasicPageEdit);



        //图片预览组件
        //使用方法：this.$hevueImgPreview(url)
        Vue.use(hevueImgPreview)


    },



    createFilter: (o, p, d) => {
        var filter = {
            rules: [],
            groups: [],
            op: 'and'
        };
        if (o) {
            for (let name in o) {
                filter.rules.push({
                    field: name,
                    value: o[name],
                    op: 'equal'
                });
            }
        }
        if (p) {
            for (let name in p) {
                filter.rules.push({
                    field: name,
                    value: p[name],
                    op: 'notequal'
                });
            }
        }
        if (d) {
            for (let name in d) {
                filter.rules.push({
                    field: name,
                    value: d[name],
                    op: 'notequal'
                });
            }
        }
        return filter;
    }
};
export default mk; 