fineui/demo/js/widget/multiselect/demo.multi_select_list.js

import { shortcut, Widget, createWidget, Func, bind, each, makeObject, filter, delay } from "@/core";
import { Msg } from "@/base";
import { MultiSelectCombo } from "@/widget"; 

@shortcut()
export class MultiSelectList extends Widget {
    static xtype = "demo.multi_select_list";

    props = { baseCls: "demo-multi-select-combo" };

    mounted() {
        this.list.populate();
    }

    _createMultiSelectCombo() {
        const self = this;
        const widget = createWidget({
            type: "bi.multi_select_insert_list",
            ref(ref) {
                self.list = ref;
            },
            itemsCreator: bind(this._itemsCreator, this),
            value: {
                type: 1,
                value: [
                    "柳州市城贸金属材料有限责任公司",
                    "柳州市建福房屋租赁有限公司",
                    "柳州市迅昌数码办公设备有限责任公司"
                ],
            },
        });

        widget.on(MultiSelectCombo.EVENT_CONFIRM, function () {
            Msg.toast(JSON.stringify(this.getValue()));
        });

        return widget;
    }

    _getItemsByTimes(items, times) {
        const res = [];
        for (let i = (times - 1) * 10; items[i] && i < times * 10; i++) {
            res.push(items[i]);
        }

        return res;
    }

    _hasNextByTimes(items, times) {
        return times * 10 < items.length;
    }

    _itemsCreator(options, callback) {
        const self = this;
        let items = Demo.CONSTANTS.ITEMS;
        const keywords = (options.keywords || []).slice();
        if (options.keyword) {
            keywords.push(options.keyword);
        }
        each(keywords, (i, kw) => {
            const search = Func.getSearchResult(items, kw);
            items = search.match.concat(search.find);
        });
        if (options.selectedValues) {
            // 过滤
            const filter = makeObject(options.selectedValues, true);
            items = filter(items, (i, ob) => !filter[ob.value]);
        }
        if (options.type == MultiSelectCombo.REQ_GET_ALL_DATA) {
            callback({
                items,
            });

            return;
        }
        if (options.type == MultiSelectCombo.REQ_GET_DATA_LENGTH) {
            callback({ count: items.length });

            return;
        }
        delay(() => {
            callback({
                items: self._getItemsByTimes(items, options.times),
                hasNext: self._hasNextByTimes(items, options.times),
            });
        }, 1000);
    }

    render() {
        return {
            type: "bi.absolute",
            scrolly: false,
            items: [
                {
                    el: this._createMultiSelectCombo(),
                    top: 50,
                    left: 50,
                    right: 50,
                    bottom: 50,
                }
            ],
        };
    }
}