fineui是帆软报表和BI产品线所使用的前端框架。
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

176 lines
5.8 KiB

import {
shortcut,
find,
i18nText,
isNotEmptyString,
VerticalAdaptLayout
} from "@/core";
import {
ButtonGroup,
Trigger,
Searcher,
IconButton
} from "@/base";
import { TriggerIconButton } from "../../button";
import { DefaultTextEditor } from "../../editor";
@shortcut()
export class SearchTextValueTrigger extends Trigger {
static xtype = "bi.search_text_value_trigger";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_STOP = "EVENT_STOP";
static EVENT_START = "EVENT_START";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_CLEAR = "EVENT_CLEAR";
props() {
return {
baseCls: "bi-search-text-value-trigger",
height: 24,
watermark: i18nText("BI-Basic_Search"),
allowClear: false,
title: () => this.editor.getText(),
};
}
render() {
const o = this.options;
const triggerButton = {
type: TriggerIconButton.xtype,
cls: "trigger-icon-button",
ref: _ref => {
this.triggerBtn = _ref;
},
width: o.height,
height: o.height,
};
const stateText = this._digest(o.value, o.items) || o.text;
return {
type: "bi.horizontal_fill",
columnSize: ["fill", 24],
items: [
{
el: {
type: Searcher.xtype,
ref: _ref => {
this.searcher = this;
},
isAutoSearch: false,
el: {
type: DefaultTextEditor.xtype,
ref: _ref => {
this.editor = _ref;
},
watermark: o.watermark,
defaultText: o.defaultText,
text: stateText,
value: o.value,
height: o.height,
},
popup: {
type: "bi.search_text_value_combo_popup",
cls: "bi-card",
chooseType: ButtonGroup.CHOOSE_TYPE_SINGLE,
tipText: i18nText("BI-No_Select"),
},
onSearch (obj, callback) {
const keyword = obj.keyword;
const finding = BI.Func.getSearchResult(
o.items,
keyword
);
const matched = finding.match,
find = finding.find;
callback(matched, find);
},
listeners: [
{
eventName: Searcher.EVENT_CHANGE,
action: () => {
this.fireEvent(
SearchTextValueTrigger.EVENT_CHANGE
);
},
}
],
},
},
{
el: o.allowClear
? {
type: VerticalAdaptLayout.xtype,
horizontalAlign: "left",
scrollable: false,
items: [
{
el: {
type: IconButton.xtype,
ref: _ref => {
this.clearBtn = _ref;
},
cls:
`close-h-font ${
o.allowClear
? "clear-button"
: ""}`,
stopPropagation: true,
invisible:
!isNotEmptyString(stateText),
width: o.height,
height: o.height,
handler: () => {
this.fireEvent(
SearchTextValueTrigger.EVENT_CLEAR
);
},
},
},
{
el: triggerButton,
}
],
}
: triggerButton,
width: 24,
}
],
};
}
_setState(v) {
this.editor.setState(v);
}
_digest(value, items) {
const result = find(items, (i, item) => item.value === value);
return result?.text;
}
stopEditing() {
this.searcher.stopSearch();
}
getSearcher() {
return this.searcher;
}
populate(items) {
this.options.items = items;
}
setValue(vals) {
const digestText = this._digest(vals, this.options.items);
this._setState(digestText);
this.options.allowClear &&
this.clearBtn.setVisible(isNotEmptyString(digestText));
}
getValue() {
return this.searcher.getValue();
}
}