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

基础vue ui库

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

export class Picker extends Service {
    name = 'Picker';
    defaultOption = PICKER_DEFAULT_CONFIG;
    constructor(Vue, options) {
        super(options);
        let _that = this;
        _that.setDefaultOptions(options);
        _that._popup = new PopupBase(Vue, _that.defaultOption.picker);
        _that._popup._getParent = () => {
            return _that._getParent && _that._getParent();
        };
    }
    /**
     * 预加载
     *
     * @param {*} params 参数
     * @param {*} params.lists 需要加载lists数据的key
     * @memberof Picker
     * @returns {Promise}
     */
    preload(params) {
        let _that = this;
        params = params || {};
        let _lists = params.listKey;
        let _options = _that.defaultOption || {};
        if (_lists instanceof Array) {
            // list预加载
            _lists.forEach((key) => {
                let _props = _options[key] && _options[key].props;
                getBackData(_props && _props.lists);
            });
        }
        return super.preload(params);
    }
    /**
     * 选择省市区
     *
     * @param {IDatePickerProps} [options] 参数选项
     * @param {Function} cb 关闭时的回调
     * @returns {Observable<DatePickerComponent>}
     * @memberof SDialogService
     */
    cityPicker(options, cb) {
        let _options = this.getOptions({
            cityPicker: options || {}
        });
        return this.picker(_options.cityPicker, cb);
    }
    /**
     * 选择框
     *
     * @param {IPickerOptions} [options] 参数选项
     * @param {Function} cb 关闭时的回调
     * @returns {Observable<PickerComponent>}
     * @memberof SDialogService
     */
    picker(options, cb) {
        let _that = this;
        let _config = _that.getOptions({
            picker: options || {}
        });
        let _options = _config.picker || {};
        let _props = options && options.props;
        if (_options.type !== 'picker' && _options.props) {
            _options.props.lists = (_props && _props.lists) || null;
        }
        _options.wrapCla = (_options.wrapCla || '') + ' nu_picker';
        _that.inputBlur();
        return new Promise((resolve, reject) => {
            _that._popup.popupData(() => {
                return callFn(_options.getComponent, [_options.type || 'picker']);
            }, _options, cb).then((res) => {
                if (res.type === 'confirm') {
                    getBackData(_options.filterData || res.data, [res.data])
                        .then(resolve, reject);
                }
            }, reject);
        });
    }
    /**
     * 关闭指定的key的popup
     * @param {String} [key='default'] popup的key
     * @returns {Boolean}
     */
    closePopup(key) {
        return this._popup.closePopup(key || 'picker');
    }
    /**
     * 关闭指定的key的popup
     * @param {String} [key='default'] popup的key
     * @returns {Boolean}
     */
    close(key) {
        return this._popup.close(key || 'picker');
    }
    /**
     * 安装
     *
     * @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 {operateFactory}
 */
export default function pickerFactory(Vue, options) {
    return new Picker(Vue, options);
}