nimble-ui/src/Services/dialog/dialog.js

基础vue ui库

import { callFn, extend } from 'nimble-lib';
import { PopupBase } from '../popup/PopupBase';
import Service from '../services';

export class Dialog extends Service {
    name = 'Dialog';
    constructor(Vue, options) {
        super(options);
        let _that = this;
        _that.setDefaultOptions(options);
        _that._popup = new PopupBase(Vue, _that.defaultOption);
        _that._popup._getParent = () => {
            return _that._getParent && _that._getParent();
        };
    }

    /**
     * 模态框
     * @param {Objec} options 弹框文本内容
     * @returns {*}
     */
    dialog(options) {
        let _that = this;
        let _options = _that.getOptions({
            key: 'dialog',
            wrapCla: '', // 最外层追加的Class名
            alignCla: 'centerMiddle', // ''|'bottom'|'top'|'fullScreen'|'centerMiddle',
            transitionCls: '', // ''|'bottom'|'top'|'fullScreen'|'centerMiddle',
            maskCloseFlag: 0,
            maskFlag: 1,
            props: {
                btns: [{
                    text: '确定',
                    className: 'nu_btn-highlight'
                }],
                isCloseBtn: false
            }
        }, options);
        if (options && options.props) {
            _options.props = extend(false, _options.props, options.props);
        }
        _options.wrapCla = (_options.wrapCla || '') + ' nu_dialog-popup';
        return _that._popup.popupData(() => {
            return callFn(_options.getComponent, [_options.type || 'dialog']);
        }, _options);
    }
    /**
     * alert 弹框
     * @param {String} contentText 弹框文本内容
     * @param {String} titleText 弹框标题或其它选项
     * @returns {*}
     */
    alert (contentText, titleText) {
        let _that = this;
        let _param = titleText;
        if (typeof _param === 'string') {
            _param = {
                props: {
                    title: _param
                }
            };
        }
        return new Promise((resolve, reject) => {
            _that.dialog(extend({
                key: 'alert',
                type: 'alert',
                wrapCla: 'nu_alert' // 最外层追加的Class名
            }, _param, {
                props: {
                    content: contentText
                }
            })).then((res) => {
                if (res && res.type === 'confirm' && res.data && res.data.index === 0) {
                    resolve(res.data);
                }
            }, reject);
        });
    }
    /**
     * confirm 弹框
     * @param {String} contentText 弹框文本内容
     * @param {String} titleText 弹框标题或其它选项
     * @returns {*}
     */
    confirm (contentText, titleText) {
        let _that = this;
        let _param = titleText;
        if (typeof _param === 'string') {
            _param = {
                props: {
                    title: _param
                }
            };
        }
        return new Promise((resolve, reject) => {
            _that.dialog(extend({
                key: 'confirm',
                type: 'confirm',
                wrapCla: 'nu_confirm', // 最外层追加的Class名
                props: {
                    content: contentText,
                    btns: [{
                        text: '取消',
                        className: ''
                    }, {
                        text: '确定',
                        className: 'nu_btn-highlight'
                    }],
                    title: titleText
                }
            }, _param)).then((res) => {
                if (res && res.type === 'confirm') {
                    let _data = res.data;
                    if (_data && _data.index === 1) {
                        _data.type = 'ok';
                    } else if (_data && _data.index === 0) {
                        _data.type = 'cancel';
                    }
                    resolve(_data);
                } else {
                    resolve(res);
                }
            }, reject);
        });
    }
    /**
     * 安装
     *
     * @param {Vue} Vue Vue
     * @param {Object} options 选项
     * @memberof Service
     * @returns {Object}
     */
    install(Vue, options) {
        let _that = this;
        super.install(Vue, options);
        _that._popup && _that._popup._setSPopup(Vue);
        return _that;
    }
}
/**
 *
 * 实例化工厂方法
 * @export
 * @param {Vue} Vue vue
 * @param {any} options 配置选项
 * @returns {Dialog}
 */
export default function dialogFactory(Vue, options) {
    return new Dialog(Vue, options);
}