import { throttle } from '@ibizstudio/runtime';
import { SearchBarControlBase } from '../../../widgets/searchbar-control-base';
/**
 * 搜索栏部件基类
 *
 * @export
 * @class AppSearchBarBase
 * @extends {SearchBarControlBase}
 */
export class AppSearchBarBase extends SearchBarControlBase {
    /**
     * 绘制过滤栏
     *
     * @param {{ controlname: string; action: string; data: any }} { controlname 部件名称, action 事件名称, data 事件参数 }
     * @memberof AppSearchBarBase
     */
    renderBarFilters(data) {
        const barFilters = this.controlInstance.getPSSearchBarFilters() || [];
        if (barFilters.length === 0 || !data.editor) {
            return null;
        }
        return barFilters.map((filter) => {
            if (!filter.name || !Object.is(data.editor, filter.name)) {
                return null;
            }
            const editor = filter.getPSEditor();
            if (editor) {
                let filterItem = this.filterItems.find((item) => {
                    return item.editor && Object.is(item.editor, editor.name);
                });
                if (filterItem) {
                    filterItem[editor.name] = data[editor.name];
                }
                return (<app-default-editor editorInstance={editor} value={data[editor.name]} contextData={data} context={this.context} viewparams={this.viewparams} service={this.service} disabled={false} ignorefieldvaluechange={false} on-change={this.editorChange.bind(this)}/>);
            }
        });
    }
    /**
     * 编辑器值变化
     *
     * @memberof AppSearchBarBase
     */
    editorChange({ name, value }) {
        if (this.filterItems.length == 0) {
            return;
        }
        this.filterItems.forEach((item) => {
            if (item.editor && Object.is(name, item.editor)) {
                item[name] = value;
            }
        });
    }
    /**
     * 绘制过滤树
     *
     * @memberof AppSearchBarBase
     */
    renderFilterTree() {
        if (!this.filterFields || this.filterFields.length == 0) {
            return null;
        }
        return (<div class='filter-group'>
        <filter-tree datas={this.filterItems} fields={this.filterFields} scopedSlots={{
                default: ({ data }) => {
                    return this.renderBarFilters(data);
                },
            }}></filter-tree>
      </div>);
    }
    /**
     * 绘制过滤存储集合
     *
     * @memberof AppSearchBarBase
     */
    renderFilterFooter() {
        var _a;
        return (<div class='search-bar-footer'>
        <div class='search-bar-action'>
          {((_a = this.historyItems) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (<el-select size='small' value={this.selectItem} on-change={this.onFilterChange.bind(this)}>
              {this.historyItems.map((item) => {
                    return <el-option key={item.value} label={item.name} value={item.value}></el-option>;
                })}
            </el-select>) : null}
          <i-button type='primary' on-click={(...params) => throttle(this.onSearch, params, this)}>
            {this.$t('app.searchbutton.search')}
          </i-button>
          <i-button on-click={this.onReset.bind(this)}>{this.$t('app.searchbutton.reset')}</i-button>
          <poptip ref='propip' trigger='hover' transfer placement='top-end' title='存储自定义查询' popper-class='searchbar-poptip' op-on-popper-show={this.openPoper.bind(this)}>
            <i-button>
              <i class='fa fa-floppy-o' aria-hidden='true'></i>
            </i-button>
            <div slot='content'>
              <i-input v-model={this.saveItemName} placeholder=''></i-input>
              <div class='save-action'>
                <i-button on-click={(...params) => throttle(this.onCancel, params, this)}>{this.$t('app.commonwords.cancel')}</i-button>
                <i-button type='primary' on-click={(...params) => throttle(this.onOk, params, this)}>
                  {this.$t('app.commonwords.save')}
                </i-button>
              </div>
            </div>
          </poptip>
        </div>
      </div>);
    }
    /**
     * 绘制搜索栏部件
     *
     * @memberof AppSearchBarBase
     */
    render() {
        if (!this.controlIsLoaded || !this.isExpandSearchForm) {
            return null;
        }
        const { controlClassNames } = this.renderOptions;
        return (<div class={Object.assign(Object.assign({}, controlClassNames), { 'app-searchbar': true })}>
        {this.renderFilterTree()}
        {this.renderFilterFooter()}
      </div>);
    }
}
