demo-tabledata-redis/src/web/src/modules/components/pool/pool_edit.ts

import { shortcut, store } from '@core/core';
import { POOL_CONFIG } from '@constants/constant';
import { FormItem } from '../form_item/form_item';
import { PoolEditModel } from './pool_edit.model';

@shortcut()
@store(PoolEditModel)
export class PoolEdit extends BI.Widget {
    static xtype = 'dec.dcm.connection.plugin.redis.components.pool_edit'

    props = {
        poolConfig : {
            ...POOL_CONFIG,
        },
    }

    store: PoolEditModel['store']
    model: PoolEditModel['model']

    form = {
        maxTotal: null,
        maxWait: null,
        maxIdle: null,
        blockWhenExhausted: null,
        lifo: null,
        timeout: null,
    }

    render() {
        const { maxTotal, maxWait, maxIdle, blockWhenExhausted, lifo, timeout } = this.options.poolConfig;
        this.store.setBlockWhenExhausted(blockWhenExhausted);
        this.store.setLifo(lifo);
        
        return {
            type: BI.VerticalLayout.xtype,
            hgap: 15,
            vgap: 10,
            items: [
                {
                    type: FormItem.xtype,
                    name: BI.i18nText('Plugin-Redis_Pool_Max_Total'),
                    forms: [{
                        type: BI.TextEditor.xtype,
                        width: 300,
                        allowBlank: true,
                        value: maxTotal,
                        ref: (_ref: any) => {
                            this.form.maxTotal = _ref;
                        },
                    }],
                },
                {
                    type: FormItem.xtype,
                    name: BI.i18nText('Plugin-Redis_Pool_Max_Wait'),
                    forms: [{
                        type: BI.TextEditor.xtype,
                        width: 300,
                        allowBlank: true,
                        value: maxWait,
                        ref: (_ref: any) => {
                            this.form.maxWait = _ref;
                        },
                    }],
                },
                {
                    type: FormItem.xtype,
                    name: BI.i18nText('Plugin-Redis_Pool_Max_Idle'),
                    forms: [{
                        type: BI.TextEditor.xtype,
                        width: 300,
                        allowBlank: true,
                        value: maxIdle,
                        ref: (_ref: any) => {
                            this.form.maxIdle = _ref;
                        },
                    }],
                },
                {
                    type: FormItem.xtype,
                    name: BI.i18nText('Plugin-Redis_Pool_Block_When_Exhausted'),
                    forms: [{
                        type: BI.MultiSelectItem.xtype,
                        selected: blockWhenExhausted,
                        ref: (_ref: any) => {
                            this.form.blockWhenExhausted = _ref;
                        },
                        handler: () => {
                            this.store.setBlockWhenExhausted(!this.model.blockWhenExhausted);
                        },
                    }],
                },
                {
                    type: FormItem.xtype,
                    name: BI.i18nText('Plugin-Redis_Pool_Lifo'),
                    forms: [{
                        type: BI.MultiSelectItem.xtype,
                        selected: lifo,
                        ref: (_ref: any) => {
                            this.form.lifo = _ref;
                        },
                        handler: () => {
                            this.store.setLifo(!this.model.lifo);
                        },
                    }],
                },
                {
                    type: FormItem.xtype,
                    name: BI.i18nText('Plugin-Redis_Pool_Timeout'),
                    forms: [{
                        type: BI.TextEditor.xtype,
                        width: 300,
                        allowBlank: true,
                        value: timeout,
                        ref: (_ref: any) => {
                            this.form.timeout = _ref;
                        },
                    }],
                },
            ],
        };
    }

    public getSubmitValue() {
        return {
            maxTotal: this.form.maxTotal.getValue(),
            maxWait: this.form.maxWait.getValue(),
            maxIdle: this.form.maxIdle.getValue(),
            blockWhenExhausted: this.model.blockWhenExhausted,
            lifo: this.model.lifo,
            timeout: this.form.timeout.getValue(),
        };
    }
}