decision-webui-dcm/src/modules/pages/maintain/forms/form.ts

import { shortcut, store } from '@core/core';
import { MaintainFormModelXtype, MaintainFormModel } from './form.model';
import { FormJdbc, FormJdbcXtype } from './components/form.jdbc';
import { FormJndiXtype } from './components/form.jndi';
import { FormPluginXtype } from './components/form.plugin';
import { connectionType } from '@constants/env';
import { ConnectionJDBC, Connection } from 'src/modules/crud/crud.typings';
import { TestStatusXtype, EVENT_RELOAD, EVENT_CLOSE } from 'src/modules/components/test_status/test_status';
import { DEFAULT_JNDI_DATA, DEFAULT_JDBC_POOL } from '@constants/constant';

export const MaintainFormXtype = 'dec.dcm.maintain.form';
@shortcut(MaintainFormXtype)
@store(MaintainFormModelXtype)
export class MaintainForm extends BI.Widget {
    props = {
        connectionType: '',
    }
    isEdit = false;
    connectionName = '';
    
    model: MaintainFormModel['model'];
    store: MaintainFormModel['store'];

    form: FormJdbc;
    testStatus: any;

    watch = {
        saveEvent: () => {
            if (!this.testValue()) {
                return;
            }
            if (this.connectionName) {
                this.store.updateConnection(this.connectionName, this.form.getSubmitValue());
            } else {
                this.store.addConnection(this.form.getSubmitValue());
            }
        },
        testEvent: () => {
            if (!this.testValue()) {
                return;
            }
            const id = BI.UUID();
            const testConnection = () => {
                this.store.testConnection(this.form.getSubmitValue()).then(re => {
                    if (re && re.errorCode) {
                        this.testStatus.setFail(re.errorMsg);
                    } else if (re.data) {
                        this.testStatus.setSuccess();
                        setTimeout(() => {
                            BI.Maskers.remove(id);
                        }, 1000 * 2);
                    } else {
                        BI.Msg.toast(BI.i18nText('Dec-Dcm_Connection_Error'), {
                            level: 'error',
                        });
                        BI.Maskers.remove(id);
                    }
                });
            };
            BI.Maskers.create(id, null, {
                render: {
                    type: TestStatusXtype,
                    loadingText: BI.i18nText('Dec-Dcm_Connection_Testing'),
                    loadingCls: 'upload-loading-icon',
                    successText: BI.i18nText('Dec-Dcm_Connection_Test_Success'),
                    successCls: 'upload-success-icon',
                    failText: BI.i18nText('Dec-Dcm_Connection_Test_Fail', name),
                    failCls: 'upload-fail-icon',
                    retryText: BI.i18nText('Dec-Dcm_Connection_ReConnect'),
                    ref: (_ref: any) => {
                        this.testStatus = _ref;
                    },
                    listeners: [
                        {
                            eventName: EVENT_RELOAD,
                            action: () => {
                                this.testStatus.setLoading();
                                testConnection();
                            },
                        },
                        {
                            eventName: EVENT_CLOSE,
                            action: () => {
                                BI.Maskers.remove(id);
                            },
                        },
                    ],
                },
            });
            BI.Maskers.show(id);
            testConnection();
        },
    }

    render() {
        return {
            type: this.getFormType(),
            formData: this.getFormData(),
            ref: (_ref: any) => {
                this.form = _ref;
            },
        };
    }

    private getFormType() {
        switch (this.options.connectionType) {
            case connectionType.JDBC:
                return FormJdbcXtype;
            case connectionType.JNDI:
                return FormJndiXtype;
            default:
                return FormPluginXtype;
        }
    }

    private getFormData():Connection {
        switch (this.options.connectionType) {
            case connectionType.JDBC:
                return this.getJdbcConnection();
            case connectionType.JNDI:
                return this.getJndiConnection();
            default:
                return this.getPluginConnection();
        }
    }

    private getJdbcConnection():Connection {
        const connectionName = this.getConnectionName();
        let editConnection: Connection;
        let connectionData: ConnectionJDBC;
        if (this.model.datebaseTypeSelected) {
            connectionData = {
                driver: this.model.datebaseTypeSelectedOne.driver,
                url: this.model.datebaseTypeSelectedOne.url,
                database: this.model.datebaseTypeSelectedOne.databaseType,
                connectionName,
                connectionPool: DEFAULT_JDBC_POOL,
                port:'',
                host: 'localhost',
            };
            editConnection = {
                connectionId: '',
                connectionData,
                connectionType: connectionType.JDBC,
                connectionName,
            };
            
            return editConnection;
        }
        this.isEdit = true;
        this.connectionName = this.model.connectionSelectedOne.connectionName;
        
        return this.model.connectionSelectedOne;
    }

    private getJndiConnection():Connection {
        if (this.model.datebaseTypeSelected) {
            return {
                connectionId: '',
                connectionType: connectionType.JNDI,
                connectionName: this.getConnectionName(),
                connectionData: DEFAULT_JNDI_DATA,
            };
        }
        this.connectionName = this.model.connectionSelectedOne.connectionName;
        this.isEdit = true;
        
        return this.model.connectionSelectedOne;
    }

    private getPluginConnection():Connection {
        if (!this.model.datebaseTypeSelected) {
            this.connectionName = this.model.connectionSelectedOne.connectionName;
            this.isEdit = true;
            
            return this.model.connectionSelectedOne;
        }
        
        return {
            connectionId: '',
            connectionType: this.model.datebaseTypeSelectedOne.databaseType,
            connectionName: this.getConnectionName(),
            connectionData: '',
        };
    }

    private testValue():boolean {
        const value = this.form.getSubmitValue();
        if (!value.connectionName) {
            BI.Msg.toast(BI.i18nText('Dec-Dcm_Connection_ConnectionName_Cannt_Null'), {
                level: 'error',
            });
            
            return false;
        }
        if (this.connectionName !== value.connectionName) {
            const hasNamed = this.model.connections.some(item => item.connectionName === value.connectionName);
            if (hasNamed) {
                BI.Msg.toast(BI.i18nText('Dec-Dcm_Connection_Is_Existence'), {
                    level: 'error',
                });
                
                return false;
            }
        }
        
        return true;
    }

    private getConnectionName() {
        const name = BI.i18nText('Dec-Dcm_Data_Connections');
        const connections = this.model.connections.filter(item => item.connectionName.startsWith(name));
        if (connections.length === 0) {
            return name;
        }
        let index = 0;
        connections.forEach(item => {
            const num = parseFloat(item.connectionName.replace(name, ''));
            if (num > index) {
                index = num;
            }
        });
        
        return `${name}${index + 1}`;
    }
}