2016-08-11 07:16:58 +08:00
|
|
|
import ko from 'ko';
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
import {
|
|
|
|
LoginSignMeType,
|
|
|
|
LoginSignMeTypeAsString,
|
|
|
|
ClientSideKeyName,
|
|
|
|
StorageResultType,
|
|
|
|
Magics,
|
|
|
|
Notification
|
|
|
|
} from 'Common/Enums';
|
|
|
|
|
2020-07-20 20:33:33 +08:00
|
|
|
import { trim, convertLangName, triggerAutocompleteInputChange } from 'Common/Utils';
|
2016-08-17 06:01:20 +08:00
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
import { $win } from 'Common/Globals';
|
|
|
|
import { getNotification, getNotificationFromResponse, reload as translatorReload } from 'Common/Translator';
|
2016-08-17 06:01:20 +08:00
|
|
|
|
|
|
|
import * as Plugins from 'Common/Plugins';
|
|
|
|
|
|
|
|
import AppStore from 'Stores/User/App';
|
|
|
|
import LanguageStore from 'Stores/Language';
|
|
|
|
|
|
|
|
import * as Settings from 'Storage/Settings';
|
|
|
|
import * as Local from 'Storage/Client';
|
|
|
|
|
|
|
|
import Remote from 'Remote/User/Ajax';
|
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
import { getApp } from 'Helper/Apps/User';
|
2016-08-17 06:01:20 +08:00
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
import { view, command, ViewType, routeOff, showScreenPopup } from 'Knoin/Knoin';
|
|
|
|
import { AbstractViewNext } from 'Knoin/AbstractViewNext';
|
2016-08-17 06:01:20 +08:00
|
|
|
|
|
|
|
@view({
|
2016-09-16 04:34:30 +08:00
|
|
|
name: ['View/App/Login', 'View/User/Login'],
|
2016-08-17 06:01:20 +08:00
|
|
|
type: ViewType.Center,
|
|
|
|
templateID: 'Login'
|
|
|
|
})
|
2019-07-05 03:19:24 +08:00
|
|
|
class LoginUserView extends AbstractViewNext {
|
2016-08-17 06:01:20 +08:00
|
|
|
constructor() {
|
|
|
|
super();
|
2014-08-21 23:08:34 +08:00
|
|
|
|
2016-09-29 05:40:17 +08:00
|
|
|
this.hideSubmitButton = !!Settings.appSettingsGet('hideSubmitButton');
|
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.welcome = ko.observable(!!Settings.settingsGet('UseLoginWelcomePage'));
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.email = ko.observable('');
|
|
|
|
this.password = ko.observable('');
|
|
|
|
this.signMe = ko.observable(false);
|
2014-04-06 03:48:22 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.additionalCode = ko.observable('');
|
|
|
|
this.additionalCode.error = ko.observable(false);
|
2019-07-05 03:19:24 +08:00
|
|
|
this.additionalCode.errorAnimation = ko.observable(false).extend({ falseTimeout: 500 });
|
2016-08-17 06:01:20 +08:00
|
|
|
this.additionalCode.focused = ko.observable(false);
|
|
|
|
this.additionalCode.visibility = ko.observable(false);
|
|
|
|
this.additionalCodeSignMe = ko.observable(false);
|
2015-06-01 01:40:54 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.logoImg = trim(Settings.settingsGet('LoginLogo'));
|
|
|
|
this.loginDescription = trim(Settings.settingsGet('LoginDescription'));
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.mobile = !!Settings.appSettingsGet('mobile');
|
|
|
|
this.mobileDevice = !!Settings.appSettingsGet('mobileDevice');
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.forgotPasswordLinkUrl = Settings.appSettingsGet('forgotPasswordLinkUrl');
|
|
|
|
this.registrationLinkUrl = Settings.appSettingsGet('registrationLinkUrl');
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.emailError = ko.observable(false);
|
|
|
|
this.passwordError = ko.observable(false);
|
2016-05-01 09:07:10 +08:00
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
this.emailErrorAnimation = ko.observable(false).extend({ falseTimeout: 500 });
|
|
|
|
this.passwordErrorAnimation = ko.observable(false).extend({ falseTimeout: 500 });
|
2014-11-18 05:13:50 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.formHidden = ko.observable(false);
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.formError = ko.computed(
|
2019-07-05 03:19:24 +08:00
|
|
|
() =>
|
|
|
|
this.emailErrorAnimation() ||
|
|
|
|
this.passwordErrorAnimation() ||
|
2016-08-17 06:01:20 +08:00
|
|
|
(this.additionalCode.visibility() && this.additionalCode.errorAnimation())
|
|
|
|
);
|
2015-04-14 02:45:09 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.emailFocus = ko.observable(false);
|
|
|
|
this.passwordFocus = ko.observable(false);
|
2015-04-14 02:45:09 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.email.subscribe(() => {
|
|
|
|
this.emailError(false);
|
|
|
|
this.additionalCode('');
|
|
|
|
this.additionalCode.visibility(false);
|
|
|
|
});
|
2015-04-14 02:45:09 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.password.subscribe(() => {
|
|
|
|
this.passwordError(false);
|
|
|
|
});
|
2014-04-06 03:48:22 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.additionalCode.subscribe(() => {
|
|
|
|
this.additionalCode.error(false);
|
|
|
|
});
|
2014-04-06 03:48:22 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.additionalCode.visibility.subscribe(() => {
|
|
|
|
this.additionalCode.error(false);
|
|
|
|
});
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.emailError.subscribe((bV) => {
|
|
|
|
this.emailErrorAnimation(!!bV);
|
|
|
|
});
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.passwordError.subscribe((bV) => {
|
|
|
|
this.passwordErrorAnimation(!!bV);
|
|
|
|
});
|
2015-04-14 02:45:09 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.additionalCode.error.subscribe((bV) => {
|
|
|
|
this.additionalCode.errorAnimation(!!bV);
|
|
|
|
});
|
2015-04-14 02:45:09 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.submitRequest = ko.observable(false);
|
|
|
|
this.submitError = ko.observable('');
|
|
|
|
this.submitErrorAddidional = ko.observable('');
|
2015-04-14 02:45:09 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.submitError.subscribe((value) => {
|
2019-07-05 03:19:24 +08:00
|
|
|
if ('' === value) {
|
2016-08-17 06:01:20 +08:00
|
|
|
this.submitErrorAddidional('');
|
|
|
|
}
|
|
|
|
});
|
2015-01-08 22:00:03 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.allowLanguagesOnLogin = AppStore.allowLanguagesOnLogin;
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.langRequest = ko.observable(false);
|
|
|
|
this.language = LanguageStore.language;
|
|
|
|
this.languages = LanguageStore.languages;
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.bSendLanguage = false;
|
2015-01-26 07:09:22 +08:00
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
this.languageFullName = ko.computed(() => convertLangName(this.language()));
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.signMeType = ko.observable(LoginSignMeType.Unused);
|
2014-07-25 06:28:10 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.signMeType.subscribe((iValue) => {
|
|
|
|
this.signMe(LoginSignMeType.DefaultOn === iValue);
|
|
|
|
});
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
this.signMeVisibility = ko.computed(() => LoginSignMeType.Unused !== this.signMeType());
|
2014-07-29 18:28:02 +08:00
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
if (Settings.settingsGet('AdditionalLoginError') && !this.submitError()) {
|
2016-08-17 06:01:20 +08:00
|
|
|
this.submitError(Settings.settingsGet('AdditionalLoginError'));
|
|
|
|
}
|
2016-09-03 07:19:37 +08:00
|
|
|
}
|
2016-09-02 04:41:36 +08:00
|
|
|
|
2016-12-15 05:56:17 +08:00
|
|
|
windowOpenFeatures(wh) {
|
|
|
|
return `left=200,top=100,width=${wh},height=${wh},menubar=no,status=no,resizable=yes,scrollbars=yes`;
|
|
|
|
}
|
|
|
|
|
2016-09-03 07:19:37 +08:00
|
|
|
@command((self) => !self.submitRequest())
|
2016-09-02 04:41:36 +08:00
|
|
|
submitCommand() {
|
|
|
|
triggerAutocompleteInputChange();
|
|
|
|
|
|
|
|
this.emailError(false);
|
|
|
|
this.passwordError(false);
|
|
|
|
|
|
|
|
this.emailError('' === trim(this.email()));
|
|
|
|
this.passwordError('' === trim(this.password()));
|
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
if (this.additionalCode.visibility()) {
|
2016-09-02 04:41:36 +08:00
|
|
|
this.additionalCode.error(false);
|
|
|
|
this.additionalCode.error('' === trim(this.additionalCode()));
|
|
|
|
}
|
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
if (
|
|
|
|
this.emailError() ||
|
|
|
|
this.passwordError() ||
|
|
|
|
(this.additionalCode.visibility() && this.additionalCode.error())
|
|
|
|
) {
|
|
|
|
switch (true) {
|
2016-09-02 04:41:36 +08:00
|
|
|
case this.emailError():
|
|
|
|
this.emailFocus(true);
|
|
|
|
break;
|
|
|
|
case this.passwordError():
|
|
|
|
this.passwordFocus(true);
|
|
|
|
break;
|
|
|
|
case this.additionalCode.visibility() && this.additionalCode.error():
|
|
|
|
this.additionalCode.focused(true);
|
|
|
|
break;
|
|
|
|
// no default
|
|
|
|
}
|
|
|
|
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
let pluginResultCode = 0,
|
2016-09-02 04:41:36 +08:00
|
|
|
pluginResultMessage = '';
|
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
const fSubmitResult = (iResultCode, sResultMessage) => {
|
|
|
|
pluginResultCode = iResultCode || 0;
|
|
|
|
pluginResultMessage = sResultMessage || '';
|
|
|
|
};
|
2016-09-02 04:41:36 +08:00
|
|
|
|
|
|
|
Plugins.runHook('user-login-submit', [fSubmitResult]);
|
2019-07-05 03:19:24 +08:00
|
|
|
if (0 < pluginResultCode) {
|
2016-09-02 04:41:36 +08:00
|
|
|
this.submitError(getNotification(pluginResultCode));
|
|
|
|
return false;
|
2019-07-05 03:19:24 +08:00
|
|
|
} else if ('' !== pluginResultMessage) {
|
2016-09-02 04:41:36 +08:00
|
|
|
this.submitError(pluginResultMessage);
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
|
|
|
|
this.submitRequest(true);
|
2016-09-29 05:40:17 +08:00
|
|
|
$win.trigger('rl.tooltips.diactivate');
|
2016-09-02 04:41:36 +08:00
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
const fLoginRequest = (sLoginPassword) => {
|
|
|
|
Remote.login(
|
|
|
|
(sResult, oData) => {
|
|
|
|
$win.trigger('rl.tooltips.diactivate');
|
|
|
|
$win.trigger('rl.tooltips.activate');
|
|
|
|
|
|
|
|
if (StorageResultType.Success === sResult && oData && 'Login' === oData.Action) {
|
|
|
|
if (oData.Result) {
|
|
|
|
if (oData.TwoFactorAuth) {
|
|
|
|
this.additionalCode('');
|
|
|
|
this.additionalCode.visibility(true);
|
2017-06-25 03:26:27 +08:00
|
|
|
this.submitRequest(false);
|
2019-07-05 03:19:24 +08:00
|
|
|
|
2020-07-23 02:28:25 +08:00
|
|
|
setTimeout(() => this.additionalCode.focused(true), Magics.Time100ms);
|
2019-07-05 03:19:24 +08:00
|
|
|
} else if (oData.Admin) {
|
|
|
|
getApp().redirectToAdminPanel();
|
|
|
|
} else {
|
|
|
|
getApp().loginAndLogoutReload(false);
|
2016-09-02 04:41:36 +08:00
|
|
|
}
|
2019-07-05 03:19:24 +08:00
|
|
|
} else if (oData.ErrorCode) {
|
2016-09-02 04:41:36 +08:00
|
|
|
this.submitRequest(false);
|
2020-07-20 20:33:33 +08:00
|
|
|
if ([Notification.InvalidInputArgument].includes(oData.ErrorCode)) {
|
2019-07-05 03:19:24 +08:00
|
|
|
oData.ErrorCode = Notification.AuthError;
|
|
|
|
}
|
2016-09-02 04:41:36 +08:00
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
this.submitError(getNotificationFromResponse(oData));
|
2016-09-02 04:41:36 +08:00
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
if ('' === this.submitError()) {
|
|
|
|
this.submitError(getNotification(Notification.UnknownError));
|
|
|
|
} else if (oData.ErrorMessageAdditional) {
|
|
|
|
this.submitErrorAddidional(oData.ErrorMessageAdditional);
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
this.submitRequest(false);
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
this.submitRequest(false);
|
|
|
|
this.submitError(getNotification(Notification.UnknownError));
|
|
|
|
}
|
|
|
|
},
|
|
|
|
this.email(),
|
|
|
|
'',
|
|
|
|
sLoginPassword,
|
|
|
|
!!this.signMe(),
|
|
|
|
this.bSendLanguage ? this.language() : '',
|
|
|
|
this.additionalCode.visibility() ? this.additionalCode() : '',
|
|
|
|
this.additionalCode.visibility() ? !!this.additionalCodeSignMe() : false
|
|
|
|
);
|
|
|
|
|
|
|
|
Local.set(ClientSideKeyName.LastSignMe, this.signMe() ? '-1-' : '-0-');
|
|
|
|
};
|
2016-09-02 04:41:36 +08:00
|
|
|
|
|
|
|
fLoginRequest(this.password());
|
|
|
|
|
|
|
|
return true;
|
2016-06-30 08:02:45 +08:00
|
|
|
}
|
2016-08-17 06:01:20 +08:00
|
|
|
|
|
|
|
displayMainForm() {
|
|
|
|
this.welcome(false);
|
2016-06-30 08:02:45 +08:00
|
|
|
}
|
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
onShow() {
|
|
|
|
routeOff();
|
|
|
|
}
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
onShowWithDelay() {
|
2019-07-05 03:19:24 +08:00
|
|
|
if ('' !== this.email() && '' !== this.password()) {
|
2016-09-16 04:34:30 +08:00
|
|
|
this.passwordFocus(true);
|
2019-07-05 03:19:24 +08:00
|
|
|
} else if ('' === this.email()) {
|
2016-08-17 06:01:20 +08:00
|
|
|
this.emailFocus(true);
|
2019-07-05 03:19:24 +08:00
|
|
|
} else if ('' === this.password()) {
|
2016-08-17 06:01:20 +08:00
|
|
|
this.passwordFocus(true);
|
2019-07-05 03:19:24 +08:00
|
|
|
} else {
|
2016-08-17 06:01:20 +08:00
|
|
|
this.emailFocus(true);
|
|
|
|
}
|
|
|
|
}
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
onHide() {
|
|
|
|
this.emailFocus(false);
|
|
|
|
this.passwordFocus(false);
|
|
|
|
}
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
onBuild() {
|
2019-07-05 03:19:24 +08:00
|
|
|
const signMeLocal = Local.get(ClientSideKeyName.LastSignMe),
|
2020-03-11 21:17:52 +08:00
|
|
|
signMe = (Settings.settingsGet('SignMe') || 'unused').toLowerCase();
|
2014-08-21 23:08:34 +08:00
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
switch (signMe) {
|
2016-08-17 06:01:20 +08:00
|
|
|
case LoginSignMeTypeAsString.DefaultOff:
|
|
|
|
case LoginSignMeTypeAsString.DefaultOn:
|
2019-07-05 03:19:24 +08:00
|
|
|
this.signMeType(
|
|
|
|
LoginSignMeTypeAsString.DefaultOn === signMe ? LoginSignMeType.DefaultOn : LoginSignMeType.DefaultOff
|
|
|
|
);
|
2016-08-17 06:01:20 +08:00
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
switch (signMeLocal) {
|
2016-08-17 06:01:20 +08:00
|
|
|
case '-1-':
|
|
|
|
this.signMeType(LoginSignMeType.DefaultOn);
|
|
|
|
break;
|
|
|
|
case '-0-':
|
|
|
|
this.signMeType(LoginSignMeType.DefaultOff);
|
|
|
|
break;
|
|
|
|
// no default
|
|
|
|
}
|
|
|
|
|
|
|
|
break;
|
|
|
|
case LoginSignMeTypeAsString.Unused:
|
|
|
|
default:
|
|
|
|
this.signMeType(LoginSignMeType.Unused);
|
|
|
|
break;
|
|
|
|
}
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
this.email(AppStore.devEmail);
|
|
|
|
this.password(AppStore.devPassword);
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2020-07-23 02:28:25 +08:00
|
|
|
setTimeout(() => {
|
2016-08-22 05:30:34 +08:00
|
|
|
LanguageStore.language.subscribe((value) => {
|
2016-08-17 06:01:20 +08:00
|
|
|
this.langRequest(true);
|
2016-06-30 08:02:45 +08:00
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
translatorReload(false, value).then(
|
|
|
|
() => {
|
|
|
|
this.langRequest(false);
|
|
|
|
this.bSendLanguage = true;
|
|
|
|
},
|
|
|
|
() => {
|
|
|
|
this.langRequest(false);
|
|
|
|
}
|
|
|
|
);
|
2014-08-21 23:08:34 +08:00
|
|
|
});
|
2016-08-17 06:01:20 +08:00
|
|
|
}, Magics.Time50ms);
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
triggerAutocompleteInputChange(true);
|
|
|
|
}
|
2014-07-25 06:28:10 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
submitForm() {
|
|
|
|
this.submitCommand();
|
|
|
|
}
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
selectLanguage() {
|
2019-07-05 03:19:24 +08:00
|
|
|
showScreenPopup(require('View/Popup/Languages'), [this.language, this.languages(), LanguageStore.userLanguage()]);
|
2016-08-17 06:01:20 +08:00
|
|
|
}
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
selectLanguageOnTab(bShift) {
|
2019-07-05 03:19:24 +08:00
|
|
|
if (!bShift) {
|
2020-07-23 02:28:25 +08:00
|
|
|
setTimeout(() => {
|
2016-08-17 06:01:20 +08:00
|
|
|
this.emailFocus(true);
|
|
|
|
}, Magics.Time50ms);
|
2015-04-25 21:50:10 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
return false;
|
|
|
|
}
|
2015-04-25 21:50:10 +08:00
|
|
|
|
2016-08-17 06:01:20 +08:00
|
|
|
return true;
|
|
|
|
}
|
|
|
|
}
|
2013-11-16 06:21:12 +08:00
|
|
|
|
2019-07-05 03:19:24 +08:00
|
|
|
export { LoginUserView, LoginUserView as default };
|