Merged PR 61: 画面実装（入力確認画面＆登録完了画面）
## 概要 [Task1466: 画面実装（入力確認画面＆登録完了画面）](https://paruru.nds-tyo.co.jp:8443/tfs/ReciproCollection/fa4924a4-d079-4fab-9fb5-a9a11eb205f0/_workitems/edit/1466) - アカウント登録の確認画面と完了画面を実装しました。 ## レビューポイント - ページコンポーネントの配置、遷移に問題はないか - API呼び出しは適切か - エラー表示はスナックバー実装時にやる想定です。 - デザイン反映は適切か ## UIの変更 - Before/Afterのスクショなど - [Task1466](https://ndstokyo.sharepoint.com/:f:/r/sites/Piranha/Shared%20Documents/General/OMDS/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88/Task1466?csf=1&web=1&e=DGLJXs) ## 動作確認状況 - ローカルで確認
This commit is contained in:
makabe.t
parent
0099614a5f
commit
444cfda3b2
2091
dictation_client/package-lock.json
generated
2091
dictation_client/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -52,7 +52,7 @@
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.18.6",
|
||||
"@mdx-js/react": "^2.1.2",
|
||||
"@openapitools/openapi-generator-cli": "^0.0.6",
|
||||
"@openapitools/openapi-generator-cli": "^2.5.2",
|
||||
"@types/lodash": "^4.14.191",
|
||||
"@types/luxon": "^3.2.0",
|
||||
"@types/react": "^18.0.0",
|
||||
|
||||
@ -6,13 +6,18 @@ import { AuthErrorPage } from "pages/ErrorPage";
|
||||
import { NotFoundPage } from "pages/ErrorPage/notFound";
|
||||
import { RouteAuthGuard } from "components/auth/routeAuthGuard";
|
||||
import SignupPage from "pages/SignupPage";
|
||||
import SignupCompletePage from "pages/SignupCompletePage";
|
||||
|
||||
const AppRouter: React.FC = () => (
|
||||
<Routes>
|
||||
<Route path="/" element={<TopPage />} />
|
||||
<Route path="/login" element={<LoginPage />} />
|
||||
<Route path="/authError" element={<AuthErrorPage />} />
|
||||
<Route path="/signup" element={<SignupPage completeTo="/" />} />
|
||||
<Route
|
||||
path="/signup"
|
||||
element={<SignupPage completeTo="/signup/complete" />}
|
||||
/>
|
||||
<Route path="/signup/complete" element={<SignupCompletePage />} />
|
||||
<Route
|
||||
path="/xxx"
|
||||
element={<RouteAuthGuard component={<SamplePage />} />}
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
.gitignore
|
||||
.npmignore
|
||||
.openapi-generator-ignore
|
||||
api.ts
|
||||
base.ts
|
||||
common.ts
|
||||
|
||||
@ -36,6 +36,74 @@ export interface AccessTokenResponse {
|
||||
*/
|
||||
'accessToken': string;
|
||||
}
|
||||
/**
|
||||
*
|
||||
* @export
|
||||
* @interface ConfirmRequest
|
||||
*/
|
||||
export interface ConfirmRequest {
|
||||
/**
|
||||
*
|
||||
* @type {string}
|
||||
* @memberof ConfirmRequest
|
||||
*/
|
||||
'token': string;
|
||||
}
|
||||
/**
|
||||
*
|
||||
* @export
|
||||
* @interface CreateAccountRequest
|
||||
*/
|
||||
export interface CreateAccountRequest {
|
||||
/**
|
||||
*
|
||||
* @type {string}
|
||||
* @memberof CreateAccountRequest
|
||||
*/
|
||||
'companyName': string;
|
||||
/**
|
||||
* 国名(ISO 3166-1 alpha-2)
|
||||
* @type {string}
|
||||
* @memberof CreateAccountRequest
|
||||
*/
|
||||
'country': string;
|
||||
/**
|
||||
*
|
||||
* @type {number}
|
||||
* @memberof CreateAccountRequest
|
||||
*/
|
||||
'dealerAccountId': number | null;
|
||||
/**
|
||||
*
|
||||
* @type {string}
|
||||
* @memberof CreateAccountRequest
|
||||
*/
|
||||
'adminName': string;
|
||||
/**
|
||||
*
|
||||
* @type {string}
|
||||
* @memberof CreateAccountRequest
|
||||
*/
|
||||
'adminMail': string;
|
||||
/**
|
||||
*
|
||||
* @type {string}
|
||||
* @memberof CreateAccountRequest
|
||||
*/
|
||||
'adminPassword': string;
|
||||
/**
|
||||
* 同意済み利用規約のバージョン
|
||||
* @type {string}
|
||||
* @memberof CreateAccountRequest
|
||||
*/
|
||||
'acceptedTermsVersion': string;
|
||||
/**
|
||||
* reCAPTCHA Token
|
||||
* @type {string}
|
||||
* @memberof CreateAccountRequest
|
||||
*/
|
||||
'token': string;
|
||||
}
|
||||
/**
|
||||
*
|
||||
* @export
|
||||
@ -94,6 +162,113 @@ export interface TokenResponse {
|
||||
'accessToken': string;
|
||||
}
|
||||
|
||||
/**
|
||||
* AccountsApi - axios parameter creator
|
||||
* @export
|
||||
*/
|
||||
export const AccountsApiAxiosParamCreator = function (configuration?: Configuration) {
|
||||
return {
|
||||
/**
|
||||
*
|
||||
* @summary
|
||||
* @param {CreateAccountRequest} createAccountRequest
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
createAccount: async (createAccountRequest: CreateAccountRequest, options: AxiosRequestConfig = {}): Promise<RequestArgs> => {
|
||||
// verify required parameter 'createAccountRequest' is not null or undefined
|
||||
assertParamExists('createAccount', 'createAccountRequest', createAccountRequest)
|
||||
const localVarPath = `/accounts`;
|
||||
// use dummy base URL string because the URL constructor only accepts absolute URLs.
|
||||
const localVarUrlObj = new URL(localVarPath, DUMMY_BASE_URL);
|
||||
let baseOptions;
|
||||
if (configuration) {
|
||||
baseOptions = configuration.baseOptions;
|
||||
}
|
||||
|
||||
const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
|
||||
const localVarHeaderParameter = {} as any;
|
||||
const localVarQueryParameter = {} as any;
|
||||
|
||||
|
||||
|
||||
localVarHeaderParameter['Content-Type'] = 'application/json';
|
||||
|
||||
setSearchParams(localVarUrlObj, localVarQueryParameter);
|
||||
let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
|
||||
localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
|
||||
localVarRequestOptions.data = serializeDataIfNeeded(createAccountRequest, localVarRequestOptions, configuration)
|
||||
|
||||
return {
|
||||
url: toPathString(localVarUrlObj),
|
||||
options: localVarRequestOptions,
|
||||
};
|
||||
},
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* AccountsApi - functional programming interface
|
||||
* @export
|
||||
*/
|
||||
export const AccountsApiFp = function(configuration?: Configuration) {
|
||||
const localVarAxiosParamCreator = AccountsApiAxiosParamCreator(configuration)
|
||||
return {
|
||||
/**
|
||||
*
|
||||
* @summary
|
||||
* @param {CreateAccountRequest} createAccountRequest
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
async createAccount(createAccountRequest: CreateAccountRequest, options?: AxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<object>> {
|
||||
const localVarAxiosArgs = await localVarAxiosParamCreator.createAccount(createAccountRequest, options);
|
||||
return createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration);
|
||||
},
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* AccountsApi - factory interface
|
||||
* @export
|
||||
*/
|
||||
export const AccountsApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
|
||||
const localVarFp = AccountsApiFp(configuration)
|
||||
return {
|
||||
/**
|
||||
*
|
||||
* @summary
|
||||
* @param {CreateAccountRequest} createAccountRequest
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
createAccount(createAccountRequest: CreateAccountRequest, options?: any): AxiosPromise<object> {
|
||||
return localVarFp.createAccount(createAccountRequest, options).then((request) => request(axios, basePath));
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
/**
|
||||
* AccountsApi - object-oriented interface
|
||||
* @export
|
||||
* @class AccountsApi
|
||||
* @extends {BaseAPI}
|
||||
*/
|
||||
export class AccountsApi extends BaseAPI {
|
||||
/**
|
||||
*
|
||||
* @summary
|
||||
* @param {CreateAccountRequest} createAccountRequest
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
* @memberof AccountsApi
|
||||
*/
|
||||
public createAccount(createAccountRequest: CreateAccountRequest, options?: AxiosRequestConfig) {
|
||||
return AccountsApiFp(this.configuration).createAccount(createAccountRequest, options).then((request) => request(this.axios, this.basePath));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* AuthApi - axios parameter creator
|
||||
* @export
|
||||
@ -363,3 +538,110 @@ export class DefaultApi extends BaseAPI {
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* UsersApi - axios parameter creator
|
||||
* @export
|
||||
*/
|
||||
export const UsersApiAxiosParamCreator = function (configuration?: Configuration) {
|
||||
return {
|
||||
/**
|
||||
*
|
||||
* @summary
|
||||
* @param {ConfirmRequest} confirmRequest
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
confirmUser: async (confirmRequest: ConfirmRequest, options: AxiosRequestConfig = {}): Promise<RequestArgs> => {
|
||||
// verify required parameter 'confirmRequest' is not null or undefined
|
||||
assertParamExists('confirmUser', 'confirmRequest', confirmRequest)
|
||||
const localVarPath = `/users/confirm`;
|
||||
// use dummy base URL string because the URL constructor only accepts absolute URLs.
|
||||
const localVarUrlObj = new URL(localVarPath, DUMMY_BASE_URL);
|
||||
let baseOptions;
|
||||
if (configuration) {
|
||||
baseOptions = configuration.baseOptions;
|
||||
}
|
||||
|
||||
const localVarRequestOptions = { method: 'POST', ...baseOptions, ...options};
|
||||
const localVarHeaderParameter = {} as any;
|
||||
const localVarQueryParameter = {} as any;
|
||||
|
||||
|
||||
|
||||
localVarHeaderParameter['Content-Type'] = 'application/json';
|
||||
|
||||
setSearchParams(localVarUrlObj, localVarQueryParameter);
|
||||
let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
|
||||
localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
|
||||
localVarRequestOptions.data = serializeDataIfNeeded(confirmRequest, localVarRequestOptions, configuration)
|
||||
|
||||
return {
|
||||
url: toPathString(localVarUrlObj),
|
||||
options: localVarRequestOptions,
|
||||
};
|
||||
},
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* UsersApi - functional programming interface
|
||||
* @export
|
||||
*/
|
||||
export const UsersApiFp = function(configuration?: Configuration) {
|
||||
const localVarAxiosParamCreator = UsersApiAxiosParamCreator(configuration)
|
||||
return {
|
||||
/**
|
||||
*
|
||||
* @summary
|
||||
* @param {ConfirmRequest} confirmRequest
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
async confirmUser(confirmRequest: ConfirmRequest, options?: AxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<object>> {
|
||||
const localVarAxiosArgs = await localVarAxiosParamCreator.confirmUser(confirmRequest, options);
|
||||
return createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration);
|
||||
},
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* UsersApi - factory interface
|
||||
* @export
|
||||
*/
|
||||
export const UsersApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
|
||||
const localVarFp = UsersApiFp(configuration)
|
||||
return {
|
||||
/**
|
||||
*
|
||||
* @summary
|
||||
* @param {ConfirmRequest} confirmRequest
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
confirmUser(confirmRequest: ConfirmRequest, options?: any): AxiosPromise<object> {
|
||||
return localVarFp.confirmUser(confirmRequest, options).then((request) => request(axios, basePath));
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
/**
|
||||
* UsersApi - object-oriented interface
|
||||
* @export
|
||||
* @class UsersApi
|
||||
* @extends {BaseAPI}
|
||||
*/
|
||||
export class UsersApi extends BaseAPI {
|
||||
/**
|
||||
*
|
||||
* @summary
|
||||
* @param {ConfirmRequest} confirmRequest
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
* @memberof UsersApi
|
||||
*/
|
||||
public confirmUser(confirmRequest: ConfirmRequest, options?: AxiosRequestConfig) {
|
||||
return UsersApiFp(this.configuration).confirmUser(confirmRequest, options).then((request) => request(this.axios, this.basePath));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
11
dictation_client/src/assets/images/email_check.svg
Normal file
11
dictation_client/src/assets/images/email_check.svg
Normal file
@ -0,0 +1,11 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 27.3.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="レイヤー_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
|
||||
y="0px" viewBox="0 0 48 48" style="enable-background:new 0 0 48 48;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#A5A5A5;}
|
||||
</style>
|
||||
<path class="st0" d="M31.6,44l-8.1-8l2.1-2.2l5.9,5.9l12.2-12.2l2.2,2.1L31.6,44z M23.9,21.6L40.6,11H7.2L23.9,21.6z M23.9,24.6
|
||||
L7,13.8v22.6h12.8l3,3H7c-0.8,0-1.5-0.3-2.1-0.9S4,37.2,4,36.4V11c0-0.8,0.3-1.5,0.9-2.1C5.5,8.3,6.2,8,7,8h33.8
|
||||
c0.8,0,1.5,0.3,2.1,0.9c0.6,0.6,0.9,1.3,0.9,2.1v12.2l-3,3V13.8L23.9,24.6z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 725 B |
@ -9,7 +9,7 @@
|
||||
z-index: 4;
|
||||
}
|
||||
.headerLogo {
|
||||
margin: 1.8rem 2rem 1rem;
|
||||
margin: 1.2rem 2rem 1rem;
|
||||
font-size: 1.71rem;
|
||||
line-height: 2rem;
|
||||
letter-spacing: 0.07rem;
|
||||
@ -19,7 +19,7 @@
|
||||
width: 198px;
|
||||
}
|
||||
.headerSub {
|
||||
margin: 1.8rem 2rem 1rem;
|
||||
margin: 1.4rem 2rem 1rem;
|
||||
font-size: 1.2rem;
|
||||
line-height: 2rem;
|
||||
letter-spacing: 0.07rem;
|
||||
|
||||
33
dictation_client/src/features/signup/operations.ts
Normal file
33
dictation_client/src/features/signup/operations.ts
Normal file
@ -0,0 +1,33 @@
|
||||
import { createAsyncThunk } from "@reduxjs/toolkit";
|
||||
import type { RootState } from "app/store";
|
||||
import { AccountsApi, CreateAccountRequest } from "../../api/api";
|
||||
import { Configuration } from "../../api/configuration";
|
||||
|
||||
export const signupAsync = createAsyncThunk<
|
||||
{
|
||||
/* Empty Object */
|
||||
},
|
||||
CreateAccountRequest,
|
||||
{
|
||||
// rejectした時の返却値の型
|
||||
rejectValue: {
|
||||
/* Empty Object */
|
||||
};
|
||||
}
|
||||
>("login/signupAsync", async (args, thunkApi) => {
|
||||
const createAccountRequest = args;
|
||||
// apiのConfigurationを取得する
|
||||
const { getState } = thunkApi;
|
||||
const state = getState() as RootState;
|
||||
const { configuration } = state.auth;
|
||||
const config = new Configuration(configuration);
|
||||
const accountApi = new AccountsApi(config);
|
||||
|
||||
try {
|
||||
const { data } = await accountApi.createAccount(createAccountRequest);
|
||||
|
||||
return {};
|
||||
} catch (e) {
|
||||
return thunkApi.rejectWithValue({});
|
||||
}
|
||||
});
|
||||
@ -28,14 +28,6 @@ export const selectInputValidationErrors = (state: RootState) => {
|
||||
hasErrorIncorrectPassword,
|
||||
};
|
||||
};
|
||||
|
||||
export const selectEmail = (state: RootState) => state.signup.apps.email;
|
||||
|
||||
export const selectPassword = (state: RootState) => state.signup.apps.password;
|
||||
|
||||
export const selectPageState = (state: RootState) =>
|
||||
state.signup.apps.pageState;
|
||||
|
||||
export const checkErrorIncorrectPassword = (password: string): boolean => {
|
||||
// 英字の大文字、英字の小文字、アラビア数字、記号（!@#$%^&*()+-={}[]:;'<>,./?_∼\）から2種類以上組み合わせ
|
||||
const charaTypePattern =
|
||||
@ -54,3 +46,17 @@ export const checkErrorIncorrectPassword = (password: string): boolean => {
|
||||
);
|
||||
return !charaType || repeat || !unavailableChara;
|
||||
};
|
||||
|
||||
// Account Info
|
||||
export const selectCompany = (state: RootState) => state.signup.apps.company;
|
||||
export const selectCountry = (state: RootState) => state.signup.apps.country;
|
||||
export const selectDealer = (state: RootState) => state.signup.apps.dealer;
|
||||
|
||||
// Admin Info
|
||||
export const selectAdminName = (state: RootState) =>
|
||||
state.signup.apps.adminName;
|
||||
export const selectEmail = (state: RootState) => state.signup.apps.email;
|
||||
export const selectPassword = (state: RootState) => state.signup.apps.password;
|
||||
|
||||
export const selectPageState = (state: RootState) =>
|
||||
state.signup.apps.pageState;
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import { createSlice, PayloadAction } from "@reduxjs/toolkit";
|
||||
import { SignupState } from "./state";
|
||||
import { signupAsync } from "./operations";
|
||||
|
||||
const initialState: SignupState = {
|
||||
apps: {
|
||||
@ -19,7 +20,7 @@ export const signupSlice = createSlice({
|
||||
reducers: {
|
||||
changePageState: (
|
||||
state,
|
||||
action: PayloadAction<{ pageState: "input" | "confirm" }>
|
||||
action: PayloadAction<{ pageState: "input" | "confirm" | "complete" }>
|
||||
) => {
|
||||
const { pageState } = action.payload;
|
||||
state.apps.pageState = pageState;
|
||||
@ -49,8 +50,16 @@ export const signupSlice = createSlice({
|
||||
state.apps.password = password;
|
||||
},
|
||||
},
|
||||
extraReducers: () => {
|
||||
//
|
||||
extraReducers: (builder) => {
|
||||
builder.addCase(signupAsync.pending, (state) => {
|
||||
//
|
||||
});
|
||||
builder.addCase(signupAsync.fulfilled, (state) => {
|
||||
state.apps.pageState = "complete";
|
||||
});
|
||||
builder.addCase(signupAsync.rejected, (state) => {
|
||||
//
|
||||
});
|
||||
},
|
||||
});
|
||||
export const {
|
||||
|
||||
42
dictation_client/src/pages/SignupCompletePage/index.tsx
Normal file
42
dictation_client/src/pages/SignupCompletePage/index.tsx
Normal file
@ -0,0 +1,42 @@
|
||||
import { AppDispatch } from "app/store";
|
||||
import React from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { getTranslationID } from "translation";
|
||||
import Header from "components/header";
|
||||
import Footer from "components/footer";
|
||||
import styles from "styles/app.module.scss";
|
||||
import emailCheck from "../../assets/images/email_check.svg";
|
||||
|
||||
const SignupCompletePage: React.FC = (): JSX.Element => {
|
||||
const [t] = useTranslation();
|
||||
|
||||
return (
|
||||
<div className={styles.wrap}>
|
||||
<Header />
|
||||
<main className={styles.main}>
|
||||
<div className={styles.mainSmall}>
|
||||
<div>
|
||||
<h1 className={styles.marginBtm1}>
|
||||
{t(getTranslationID("signupCompletePage.label.title"))}
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<section>
|
||||
<dl className={`${styles.formList} ${styles.hasbg}`}>
|
||||
<dt className={styles.formTitle} />
|
||||
<dd className={`${styles.full} ${styles.alignCenter}`}>
|
||||
<img src={emailCheck} alt="check" className={styles.formDone} />
|
||||
</dd>
|
||||
<dd className={`${styles.full} ${styles.alignCenter}`}>
|
||||
{t(getTranslationID("signupCompletePage.text.createdInfo"))}
|
||||
</dd>
|
||||
</dl>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
<Footer />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default SignupCompletePage;
|
||||
@ -1,44 +1,44 @@
|
||||
export const COUNTRY_LIST = [
|
||||
{ value: "", label: "Select Country" },
|
||||
{ value: "Canada", label: "Canada" },
|
||||
{ value: "Cayman Islands", label: "Cayman Islands" },
|
||||
{ value: "U.S.A.", label: "U.S.A." },
|
||||
{ value: "Australia", label: "Australia" },
|
||||
{ value: "New Zealand", label: "New Zealand" },
|
||||
{ value: "Austria", label: "Austria" },
|
||||
{ value: "Belgium", label: "Belgium" },
|
||||
{ value: "Bulgaria", label: "Bulgaria" },
|
||||
{ value: "Croatia", label: "Croatia" },
|
||||
{ value: "Cyprus", label: "Cyprus" },
|
||||
{ value: "Czech Republic", label: "Czech Republic" },
|
||||
{ value: "Denmark", label: "Denmark" },
|
||||
{ value: "Estonia", label: "Estonia" },
|
||||
{ value: "Finland", label: "Finland" },
|
||||
{ value: "France", label: "France" },
|
||||
{ value: "Germany", label: "Germany" },
|
||||
{ value: "Greece", label: "Greece" },
|
||||
{ value: "Hungary", label: "Hungary" },
|
||||
{ value: "Iceland", label: "Iceland" },
|
||||
{ value: "Ireland", label: "Ireland" },
|
||||
{ value: "Italy", label: "Italy" },
|
||||
{ value: "Latvia", label: "Latvia" },
|
||||
{ value: "Liechtenstein", label: "Liechtenstein" },
|
||||
{ value: "Lithuania", label: "Lithuania" },
|
||||
{ value: "Luxembourg", label: "Luxembourg" },
|
||||
{ value: "Malta", label: "Malta" },
|
||||
{ value: "Netherlands", label: "Netherlands" },
|
||||
{ value: "Norway", label: "Norway" },
|
||||
{ value: "Poland", label: "Poland" },
|
||||
{ value: "Portugal", label: "Portugal" },
|
||||
{ value: "Romania", label: "Romania" },
|
||||
{ value: "Serbia", label: "Serbia" },
|
||||
{ value: "Slovakia", label: "Slovakia" },
|
||||
{ value: "Slovenia", label: "Slovenia" },
|
||||
{ value: "South Africa", label: "South Africa" },
|
||||
{ value: "Spain", label: "Spain" },
|
||||
{ value: "Sweden", label: "Sweden" },
|
||||
{ value: "Switzerland", label: "Switzerland" },
|
||||
{ value: "Turkey", label: "Turkey" },
|
||||
{ value: "United Kingdom", label: "United Kingdom" },
|
||||
{ value: "Thailand", label: "Thailand" },
|
||||
{ value: "CA", label: "Canada" },
|
||||
{ value: "KY", label: "Cayman Islands" },
|
||||
{ value: "US", label: "U.S.A." },
|
||||
{ value: "AU", label: "Australia" },
|
||||
{ value: "NZ", label: "New Zealand" },
|
||||
{ value: "AT", label: "Austria" },
|
||||
{ value: "BE", label: "Belgium" },
|
||||
{ value: "BG", label: "Bulgaria" },
|
||||
{ value: "HR", label: "Croatia" },
|
||||
{ value: "CY", label: "Cyprus" },
|
||||
{ value: "CZ", label: "Czech Republic" },
|
||||
{ value: "DK", label: "Denmark" },
|
||||
{ value: "EE", label: "Estonia" },
|
||||
{ value: "FI", label: "Finland" },
|
||||
{ value: "FR", label: "France" },
|
||||
{ value: "DE", label: "Germany" },
|
||||
{ value: "GR", label: "Greece" },
|
||||
{ value: "HU", label: "Hungary" },
|
||||
{ value: "IS", label: "Iceland" },
|
||||
{ value: "IE", label: "Ireland" },
|
||||
{ value: "IT", label: "Italy" },
|
||||
{ value: "LV", label: "Latvia" },
|
||||
{ value: "LI", label: "Liechtenstein" },
|
||||
{ value: "LT", label: "Lithuania" },
|
||||
{ value: "LU", label: "Luxembourg" },
|
||||
{ value: "MT", label: "Malta" },
|
||||
{ value: "NL", label: "Netherlands" },
|
||||
{ value: "NO", label: "Norway" },
|
||||
{ value: "PL", label: "Poland" },
|
||||
{ value: "PT", label: "Portugal" },
|
||||
{ value: "RO", label: "Romania" },
|
||||
{ value: "RS", label: "Serbia" },
|
||||
{ value: "SK", label: "Slovakia" },
|
||||
{ value: "SI", label: "Slovenia" },
|
||||
{ value: "ZA", label: "South Africa" },
|
||||
{ value: "ES", label: "Spain" },
|
||||
{ value: "SE", label: "Sweden" },
|
||||
{ value: "CH", label: "Switzerland" },
|
||||
{ value: "TR", label: "Turkey" },
|
||||
{ value: "GB", label: "United Kingdom" },
|
||||
{ value: "TH", label: "Thailand" },
|
||||
];
|
||||
|
||||
@ -5,6 +5,7 @@ import React from "react";
|
||||
import { useSelector } from "react-redux";
|
||||
import { Navigate } from "react-router-dom";
|
||||
import SignupInput from "./signupInput";
|
||||
import SignupConfirm from "./signupConfirm";
|
||||
|
||||
const SignupPage: React.FC<{ completeTo: string }> = ({
|
||||
completeTo,
|
||||
@ -29,7 +30,7 @@ const getComponent = (
|
||||
case "input":
|
||||
return <SignupInput />;
|
||||
case "confirm":
|
||||
return <div>確認画面</div>;
|
||||
return <SignupConfirm />;
|
||||
case "complete":
|
||||
return <Navigate to={completeTo} replace />;
|
||||
default:
|
||||
|
||||
@ -158,6 +158,12 @@
|
||||
}
|
||||
}
|
||||
|
||||
.formConfirm {
|
||||
width: 350px;
|
||||
padding: 0.6rem 0.6rem;
|
||||
background: #f0f0f0;
|
||||
}
|
||||
|
||||
.formButtonTx {
|
||||
padding: 0.2rem 2rem;
|
||||
border: none;
|
||||
@ -176,6 +182,10 @@
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
.formDone {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.linkTx {
|
||||
color: #0084b2;
|
||||
text-decoration: none;
|
||||
|
||||
@ -17,7 +17,9 @@ declare const classNames: {
|
||||
readonly formComment: "formComment";
|
||||
readonly formSubmit: "formSubmit";
|
||||
readonly formSubmitIsActive: "formSubmitIsActive";
|
||||
readonly formConfirm: "formConfirm";
|
||||
readonly formButtonTx: "formButtonTx";
|
||||
readonly formDone: "formDone";
|
||||
readonly linkTx: "linkTx";
|
||||
readonly alignCenter: "alignCenter";
|
||||
readonly marginBtm0: "marginBtm0";
|
||||
|
||||
120
dictation_client/src/pages/SignupPage/signupConfirm.tsx
Normal file
120
dictation_client/src/pages/SignupPage/signupConfirm.tsx
Normal file
@ -0,0 +1,120 @@
|
||||
import { AppDispatch } from "app/store";
|
||||
import React, { useCallback } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
import { getTranslationID } from "translation";
|
||||
import { changePageState } from "features/signup/signupSlice";
|
||||
import { COUNTRY_LIST } from "./constants";
|
||||
import styles from "./signup.module.scss";
|
||||
import {
|
||||
selectCompany,
|
||||
selectCountry,
|
||||
selectAdminName,
|
||||
selectEmail,
|
||||
selectPassword,
|
||||
} from "../../features/signup/selectors";
|
||||
import { signupAsync } from "../../features/signup/operations";
|
||||
|
||||
const SignupConfirm: React.FC = (): JSX.Element => {
|
||||
const dispatch: AppDispatch = useDispatch();
|
||||
const [t] = useTranslation();
|
||||
|
||||
const companyName = useSelector(selectCompany);
|
||||
const country = useSelector(selectCountry);
|
||||
const adminName = useSelector(selectAdminName);
|
||||
const adminMail = useSelector(selectEmail);
|
||||
const adminPassword = useSelector(selectPassword);
|
||||
|
||||
const onSubmit = useCallback(() => {
|
||||
dispatch(
|
||||
signupAsync({
|
||||
companyName,
|
||||
country,
|
||||
dealerAccountId: 0,
|
||||
adminName,
|
||||
adminMail,
|
||||
adminPassword,
|
||||
acceptedTermsVersion: "",
|
||||
token: "",
|
||||
})
|
||||
);
|
||||
}, [dispatch, companyName, country, adminName, adminMail, adminPassword]);
|
||||
|
||||
return (
|
||||
<main className={styles.main}>
|
||||
<div className={styles.mainSmall}>
|
||||
<div>
|
||||
<h1 className={styles.marginBtm1}>
|
||||
{t(getTranslationID("signupConfirmPage.text.title"))}
|
||||
</h1>
|
||||
<p className={styles.marginBtm2}>
|
||||
{t(getTranslationID("signupConfirmPage.text.pageExplanation"))}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<section className="form">
|
||||
<dl className={`${styles.formList} ${styles.formListHasbg}`}>
|
||||
<dt className={styles.formTitle}>
|
||||
{t(getTranslationID("signupConfirmPage.text.accountInfoTitle"))}
|
||||
</dt>
|
||||
<dt>{t(getTranslationID("signupConfirmPage.label.company"))}</dt>
|
||||
<dd>
|
||||
<p className={styles.formConfirm}>{companyName}</p>
|
||||
</dd>
|
||||
<dt>{t(getTranslationID("signupConfirmPage.label.country"))}</dt>
|
||||
<dd>
|
||||
<p className={styles.formConfirm}>
|
||||
{COUNTRY_LIST.find((x) => x.value === country)?.label}
|
||||
</p>
|
||||
</dd>
|
||||
<dt className={styles.marginBtm1}>
|
||||
{t(getTranslationID("signupConfirmPage.label.dealer"))}
|
||||
</dt>
|
||||
<dd />
|
||||
|
||||
<dt className={styles.formTitle}>
|
||||
{t(getTranslationID("signupConfirmPage.text.adminInfoTitle"))}
|
||||
</dt>
|
||||
<dt>{t(getTranslationID("signupConfirmPage.label.adminName"))}</dt>
|
||||
<dd>
|
||||
<p className={styles.formConfirm}>{adminName}</p>
|
||||
</dd>
|
||||
<dt>{t(getTranslationID("signupConfirmPage.label.email"))}</dt>
|
||||
<dd>
|
||||
<p className={styles.formConfirm}>{adminMail}</p>
|
||||
</dd>
|
||||
<dt className={styles.marginBtm1}>
|
||||
{t(getTranslationID("signupConfirmPage.label.password"))}
|
||||
</dt>
|
||||
<dd>
|
||||
<p className={styles.formConfirm}>**********</p>
|
||||
</dd>
|
||||
<dd className={`${styles.full} ${styles.alignCenter}`}>
|
||||
<input
|
||||
type="submit"
|
||||
name="submit"
|
||||
value={t(
|
||||
getTranslationID("signupConfirmPage.label.signupButton")
|
||||
)}
|
||||
className={`${styles.formSubmit} ${styles.marginBtm1} ${styles.formSubmitIsActive}`}
|
||||
onClick={onSubmit}
|
||||
/>
|
||||
<br />
|
||||
<input
|
||||
type="button"
|
||||
name="cancel"
|
||||
value={t(getTranslationID("common.label.cancel"))}
|
||||
className={styles.formButtonTx}
|
||||
onClick={() => {
|
||||
dispatch(changePageState({ pageState: "input" }));
|
||||
}}
|
||||
/>
|
||||
</dd>
|
||||
</dl>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
);
|
||||
};
|
||||
|
||||
export default SignupConfirm;
|
||||
@ -1,5 +1,11 @@
|
||||
import { AppDispatch } from "app/store";
|
||||
import { selectInputValidationErrors } from "features/signup/selectors";
|
||||
import {
|
||||
selectAdminName,
|
||||
selectCompany,
|
||||
selectCountry,
|
||||
selectEmail,
|
||||
selectInputValidationErrors,
|
||||
} from "features/signup/selectors";
|
||||
import {
|
||||
changeAdminName,
|
||||
changeCompany,
|
||||
@ -16,7 +22,7 @@ import { getTranslationID } from "translation";
|
||||
import { COUNTRY_LIST } from "./constants";
|
||||
import styles from "./signup.module.scss";
|
||||
|
||||
const SignupInputPage: React.FC = (): JSX.Element => {
|
||||
const SignupInput: React.FC = (): JSX.Element => {
|
||||
const dispatch: AppDispatch = useDispatch();
|
||||
const [t] = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
@ -56,6 +62,12 @@ const SignupInputPage: React.FC = (): JSX.Element => {
|
||||
hasErrorIncorrectEmail,
|
||||
hasErrorIncorrectPassword,
|
||||
]);
|
||||
|
||||
const company = useSelector(selectCompany);
|
||||
const country = useSelector(selectCountry);
|
||||
const adminName = useSelector(selectAdminName);
|
||||
const email = useSelector(selectEmail);
|
||||
|
||||
return (
|
||||
<div className={styles.wrap}>
|
||||
<header />
|
||||
@ -89,6 +101,7 @@ const SignupInputPage: React.FC = (): JSX.Element => {
|
||||
onChange={(e) => {
|
||||
dispatch(changeCompany({ company: e.target.value }));
|
||||
}}
|
||||
value={company}
|
||||
/>
|
||||
{isPushCreateButton && hasErrorEmptyCompany && (
|
||||
<span className={styles.formError}>
|
||||
@ -108,6 +121,9 @@ const SignupInputPage: React.FC = (): JSX.Element => {
|
||||
onChange={(event) => {
|
||||
dispatch(changeCountry({ country: event.target.value }));
|
||||
}}
|
||||
value={
|
||||
COUNTRY_LIST.find((x) => x.value === country)?.value ?? ""
|
||||
}
|
||||
>
|
||||
{COUNTRY_LIST.map((x) => (
|
||||
<option key={x.value} value={x.value}>
|
||||
@ -149,6 +165,7 @@ const SignupInputPage: React.FC = (): JSX.Element => {
|
||||
onChange={(e) => {
|
||||
dispatch(changeAdminName({ adminName: e.target.value }));
|
||||
}}
|
||||
value={adminName}
|
||||
/>
|
||||
{isPushCreateButton && hasErrorEmptyAdminName && (
|
||||
<span className={styles.formError}>
|
||||
@ -172,6 +189,7 @@ const SignupInputPage: React.FC = (): JSX.Element => {
|
||||
onChange={(e) => {
|
||||
dispatch(changeEmail({ email: e.target.value }));
|
||||
}}
|
||||
value={email}
|
||||
/>
|
||||
{isPushCreateButton && hasErrorEmptyEmail && (
|
||||
<span className={styles.formError}>
|
||||
@ -292,4 +310,4 @@ const SignupInputPage: React.FC = (): JSX.Element => {
|
||||
);
|
||||
};
|
||||
|
||||
export default SignupInputPage;
|
||||
export default SignupInput;
|
||||
|
||||
@ -1,3 +1,8 @@
|
||||
.wrap.home {
|
||||
background: url("../assets/images/top-bg04.png") no-repeat bottom center;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.wrap {
|
||||
display: grid;
|
||||
grid-template-rows: auto 1fr auto;
|
||||
@ -5,9 +10,705 @@
|
||||
grid-template-areas: "header" "main" "footer";
|
||||
min-height: 100vh;
|
||||
}
|
||||
.wrap.home {
|
||||
background: url("../assets/images/top-bg04.png") no-repeat bottom center;
|
||||
background-size: cover;
|
||||
|
||||
.header {
|
||||
grid-area: header;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
box-shadow: 0 0 3px #282828;
|
||||
background: linear-gradient(#ffffff, #ffffff 70%, #f0f0f0 100%);
|
||||
z-index: 4;
|
||||
}
|
||||
.headerLogo {
|
||||
margin: 1.8rem 2rem 1rem;
|
||||
font-size: 1.71rem;
|
||||
line-height: 2rem;
|
||||
letter-spacing: 0.07rem;
|
||||
font-weight: normal;
|
||||
}
|
||||
.headerLogo img {
|
||||
width: 198px;
|
||||
}
|
||||
.headerSub {
|
||||
margin: 1.8rem 2rem 1rem;
|
||||
font-size: 1.2rem;
|
||||
line-height: 2rem;
|
||||
letter-spacing: 0.07rem;
|
||||
font-weight: normal;
|
||||
font-weight: 600;
|
||||
text-align: right;
|
||||
}
|
||||
.headerMenu {
|
||||
width: 100%;
|
||||
}
|
||||
.headerMenu ul {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding: 0 2rem;
|
||||
}
|
||||
.headerMenu ul li {
|
||||
font-size: 1rem;
|
||||
line-height: 2rem;
|
||||
letter-spacing: 0.07rem;
|
||||
font-weight: normal;
|
||||
border-left: 1px #e6e6e6 solid;
|
||||
}
|
||||
.headerMenu ul li a {
|
||||
display: block;
|
||||
padding: 0 2rem;
|
||||
color: #333333;
|
||||
text-decoration: none;
|
||||
-moz-transition: all 0.3s ease-out;
|
||||
-ms-transition: all 0.3s ease-out;
|
||||
-webkit-transition: all 0.3s ease-out;
|
||||
transition: all 0.3s ease-out;
|
||||
}
|
||||
.headerMenu ul li a:hover {
|
||||
background: #fafafa;
|
||||
text-decoration: underline;
|
||||
}
|
||||
.headerMenu ul li a.isActive {
|
||||
font-weight: 500;
|
||||
pointer-events: none;
|
||||
position: relative;
|
||||
}
|
||||
.headerMenu ul li a.isActive::after {
|
||||
content: "";
|
||||
width: 100%;
|
||||
height: 5px;
|
||||
background: #f0f0f0;
|
||||
position: absolute;
|
||||
bottom: -4px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.accountInfo {
|
||||
position: absolute;
|
||||
right: 2rem;
|
||||
bottom: 0.3rem;
|
||||
font-size: 0.8rem;
|
||||
line-height: 1.6rem;
|
||||
letter-spacing: 0.04rem;
|
||||
font-weight: normal;
|
||||
}
|
||||
.accountIcon {
|
||||
width: 1.4rem;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
_:-ms-lang(x)::-ms-backdrop,
|
||||
.header {
|
||||
width: 100vw;
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
.main {
|
||||
grid-area: main;
|
||||
}
|
||||
.mainSmall {
|
||||
width: 600px;
|
||||
margin: 0 auto;
|
||||
padding: 3.2rem 0;
|
||||
}
|
||||
|
||||
_:-ms-lang(x)::-ms-backdrop,
|
||||
.main {
|
||||
padding-top: 116px;
|
||||
}
|
||||
|
||||
_:-ms-lang(x)::-ms-backdrop,
|
||||
.mainLogin {
|
||||
margin-top: 116px;
|
||||
}
|
||||
|
||||
.footer {
|
||||
grid-area: footer;
|
||||
padding: 0.6rem 0;
|
||||
text-align: center;
|
||||
font-size: 11px;
|
||||
line-height: 1.45;
|
||||
letter-spacing: 0.4px;
|
||||
font-weight: normal;
|
||||
color: #999999;
|
||||
background: #282828;
|
||||
}
|
||||
|
||||
.buttonNormal {
|
||||
display: inline-block;
|
||||
width: 15rem;
|
||||
padding: 0.8rem 2rem;
|
||||
color: #ffffff;
|
||||
background: #004086;
|
||||
border: 1px #004086 solid;
|
||||
text-decoration: none;
|
||||
border-radius: 0.3rem;
|
||||
position: relative;
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: 0;
|
||||
font-weight: normal;
|
||||
-moz-transition: all 0.3s ease-out;
|
||||
-ms-transition: all 0.3s ease-out;
|
||||
-webkit-transition: all 0.3s ease-out;
|
||||
transition: all 0.3s ease-out;
|
||||
}
|
||||
.buttonNormal:hover {
|
||||
background: rgba(0, 64, 134, 0.7);
|
||||
}
|
||||
.buttonNormal.small {
|
||||
width: auto;
|
||||
padding: 0.75rem 2rem;
|
||||
}
|
||||
.buttonNormal.red {
|
||||
background: #e60000;
|
||||
border: 1px #e60000 solid;
|
||||
}
|
||||
.buttonNormal.red:hover {
|
||||
background: rgba(230, 0, 0, 0.7);
|
||||
}
|
||||
.buttonBase {
|
||||
display: inline-block;
|
||||
width: 15rem;
|
||||
padding: 0.8rem 2rem;
|
||||
color: #004086;
|
||||
background: #ffffff;
|
||||
border: 1px #004086 solid;
|
||||
text-decoration: none;
|
||||
border-radius: 0.3rem;
|
||||
position: relative;
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: 0;
|
||||
font-weight: normal;
|
||||
-moz-transition: all 0.3s ease-out;
|
||||
-ms-transition: all 0.3s ease-out;
|
||||
-webkit-transition: all 0.3s ease-out;
|
||||
transition: all 0.3s ease-out;
|
||||
}
|
||||
.buttonBase:hover {
|
||||
background: rgba(0, 64, 134, 0.04);
|
||||
}
|
||||
.buttonBase.small {
|
||||
width: auto;
|
||||
padding: 0.75rem 2rem;
|
||||
}
|
||||
.buttonText {
|
||||
display: inline-block;
|
||||
padding: 0.8rem 0;
|
||||
color: #004086;
|
||||
text-decoration: none;
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: 0;
|
||||
font-weight: normal;
|
||||
-moz-transition: all 0.3s ease-out;
|
||||
-ms-transition: all 0.3s ease-out;
|
||||
-webkit-transition: all 0.3s ease-out;
|
||||
transition: all 0.3s ease-out;
|
||||
}
|
||||
.buttonText:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
.buttonText.small {
|
||||
width: auto;
|
||||
padding: 0.75rem 0;
|
||||
}
|
||||
|
||||
.formList {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
.formList dt,
|
||||
.formList dd {
|
||||
font-size: 14px;
|
||||
line-height: 1.7;
|
||||
letter-spacing: 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
.formList dt {
|
||||
width: 22%;
|
||||
padding: 0.5rem 4% 0;
|
||||
text-align: right;
|
||||
}
|
||||
.formList dt.formTitle {
|
||||
width: 100%;
|
||||
padding: 0.5rem 4%;
|
||||
text-align: left;
|
||||
font-size: 1.2rem;
|
||||
line-height: 1.7;
|
||||
letter-spacing: 0.07rem;
|
||||
font-weight: normal;
|
||||
}
|
||||
.formList dt.overLine {
|
||||
padding: 0 4% 0;
|
||||
line-height: 1.4;
|
||||
}
|
||||
.formList dd {
|
||||
width: 66%;
|
||||
padding-right: 4%;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
.formList dd.full {
|
||||
width: 100%;
|
||||
padding-right: 0;
|
||||
background: none;
|
||||
}
|
||||
.formList.hasbg {
|
||||
border-top: 2px #282828 solid;
|
||||
background: #fafafa;
|
||||
}
|
||||
.form select option[disabled] {
|
||||
background: #f5f5f5;
|
||||
}
|
||||
.form select option[value=""] {
|
||||
color: #999999;
|
||||
}
|
||||
.formInput {
|
||||
width: 350px;
|
||||
padding: 0.6rem 0.8rem;
|
||||
border: 1px #999999 solid;
|
||||
background: #ffffff;
|
||||
box-sizing: border-box;
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
.formInput:focus {
|
||||
outline: 0;
|
||||
}
|
||||
.formInput.isError {
|
||||
background: rgba(229, 0, 0, 0.08);
|
||||
}
|
||||
.formInput.password[type="password"] + span {
|
||||
background: url(../images/visibility_off.svg) no-repeat top right;
|
||||
}
|
||||
.formInput.password[type="text"] + span {
|
||||
background: url(../images/visibility.svg) no-repeat top right;
|
||||
}
|
||||
.formIconEye {
|
||||
display: inline-block;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
float: right;
|
||||
margin-top: -40px;
|
||||
margin-right: 45px;
|
||||
position: relative;
|
||||
}
|
||||
.formIconEye img {
|
||||
width: 2.5rem;
|
||||
}
|
||||
.formCheck {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
margin-right: 0.5rem;
|
||||
accent-color: #282828;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
.formRadio {
|
||||
width: 1.2rem;
|
||||
height: 1.2rem;
|
||||
margin-top: -0.2rem;
|
||||
margin-right: 0.3rem;
|
||||
accent-color: #282828;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.form label {
|
||||
display: inline-block;
|
||||
padding: 0.6rem 0;
|
||||
margin-right: 1rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.formComment {
|
||||
display: inline-block;
|
||||
padding-top: 0.5rem;
|
||||
color: #999999;
|
||||
font-size: 13px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
.formError {
|
||||
display: block;
|
||||
padding-top: 0.3rem;
|
||||
color: #e60000;
|
||||
font-size: 13px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
.formConfirm {
|
||||
width: 350px;
|
||||
padding: 0.6rem 0.6rem;
|
||||
background: #f0f0f0;
|
||||
}
|
||||
.formSubmit {
|
||||
min-width: 15rem;
|
||||
padding: 0.8rem 2rem;
|
||||
border: 1px #999999 solid;
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: 0.04rem;
|
||||
font-weight: normal;
|
||||
opacity: 0.7;
|
||||
pointer-events: none;
|
||||
border-radius: 0.3rem;
|
||||
position: relative;
|
||||
-moz-transition: all 0.3s ease-out;
|
||||
-ms-transition: all 0.3s ease-out;
|
||||
-webkit-transition: all 0.3s ease-out;
|
||||
transition: all 0.3s ease-out;
|
||||
}
|
||||
.formSubmit.isActive {
|
||||
cursor: pointer;
|
||||
opacity: 1;
|
||||
color: #ffffff;
|
||||
background: #004086;
|
||||
border: 1px #004086 solid;
|
||||
pointer-events: auto;
|
||||
}
|
||||
.formSubmit.isActive:hover {
|
||||
background: rgba(0, 94, 184, 0.7);
|
||||
}
|
||||
.formButton {
|
||||
padding: 0.8rem 0.8rem;
|
||||
border: 1px #999999 solid;
|
||||
background: #ffffff;
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: 0.04rem;
|
||||
font-weight: normal;
|
||||
cursor: pointer;
|
||||
border-radius: 0.3rem;
|
||||
position: relative;
|
||||
-moz-transition: all 0.3s ease-out;
|
||||
-ms-transition: all 0.3s ease-out;
|
||||
-webkit-transition: all 0.3s ease-out;
|
||||
transition: all 0.3s ease-out;
|
||||
}
|
||||
.formButton:hover {
|
||||
background: #f0f0f0;
|
||||
}
|
||||
.formBack {
|
||||
width: 15rem;
|
||||
padding: 0.8rem 2rem;
|
||||
border: 1px #999999 solid;
|
||||
background: #ffffff;
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: 0.04rem;
|
||||
font-weight: normal;
|
||||
cursor: pointer;
|
||||
-moz-transition: all 0.3s ease-out;
|
||||
-ms-transition: all 0.3s ease-out;
|
||||
-webkit-transition: all 0.3s ease-out;
|
||||
transition: all 0.3s ease-out;
|
||||
}
|
||||
.formBack:hover {
|
||||
background: #f0f0f0;
|
||||
}
|
||||
.formButtonTx {
|
||||
padding: 0.2rem 2rem;
|
||||
border: none;
|
||||
background: none;
|
||||
color: #0084b2;
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: 0.04rem;
|
||||
font-weight: normal;
|
||||
cursor: pointer;
|
||||
-moz-transition: all 0.3s ease-out;
|
||||
-ms-transition: all 0.3s ease-out;
|
||||
-webkit-transition: all 0.3s ease-out;
|
||||
transition: all 0.3s ease-out;
|
||||
}
|
||||
.formButtonTx:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.formDone {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.loadingBoxSpinner {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
margin: 40px auto;
|
||||
border: 3px solid #e6e6e6;
|
||||
border-top: 3px solid transparent;
|
||||
border-radius: 50%;
|
||||
animation: spin 0.8s linear 0s infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
from {
|
||||
transform: rotate(0);
|
||||
}
|
||||
to {
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
.modal {
|
||||
-moz-transition: all 0.3s ease-out;
|
||||
-ms-transition: all 0.3s ease-out;
|
||||
-webkit-transition: all 0.3s ease-out;
|
||||
transition: all 0.3s ease-out;
|
||||
}
|
||||
.modal.isShow {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
position: fixed;
|
||||
z-index: 5;
|
||||
}
|
||||
.modal.isShow .modalBox {
|
||||
display: block;
|
||||
}
|
||||
.modalBox {
|
||||
display: none;
|
||||
width: 600px;
|
||||
max-height: 95vh;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
border-radius: 0.3rem;
|
||||
overflow: auto;
|
||||
}
|
||||
.modalTitle {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 0.6rem 4% 0.6rem;
|
||||
background: #ffffff;
|
||||
font-size: 1.4rem;
|
||||
line-height: 2rem;
|
||||
letter-spacing: 0;
|
||||
font-weight: 600;
|
||||
}
|
||||
.modalTitle img:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
.modalTitle img.off {
|
||||
cursor: none;
|
||||
pointer-events: none;
|
||||
opacity: 0.4;
|
||||
}
|
||||
.modalTitleIcon {
|
||||
width: 1rem;
|
||||
}
|
||||
.modal .formList {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.modal .formList.hasbg {
|
||||
border-top: none;
|
||||
}
|
||||
.modal .formList dd {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
.modal .formList dd.last {
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
.modal .formList .slideSet {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
}
|
||||
.modal .formInput {
|
||||
padding: 0.5rem 0.8rem;
|
||||
}
|
||||
.modal .form label {
|
||||
padding: 0.5rem 0 0.2rem;
|
||||
}
|
||||
|
||||
.pageHeader {
|
||||
background: #f0f0f0;
|
||||
padding: 1.5rem 2.5rem;
|
||||
background: linear-gradient(#f0f0f0, #ffffff 70%, #ffffff 100%);
|
||||
}
|
||||
.pageTitle {
|
||||
font-size: 1.8rem;
|
||||
line-height: 2.5rem;
|
||||
letter-spacing: 0.07rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.pagenation {
|
||||
margin-bottom: 3rem;
|
||||
text-align: right; /*&-nav{ a{ display: inline-block; padding: .5rem; margin-right: .5rem; color: $color-blues;
|
||||
@include font-styling(.9rem, 1.6, 0.04rem); &:last-child{ margin-right: 0; } &:visited{ color: $color-blues; } svg{ margin: 0 .5rem; width: .5rem; vertical-align: middle; fill: $color-blues; &.prev{ } } &:hover{ opacity: .7; } &[href=""]{ color: $color-subtxt; text-decoration: none; pointer-events: none; svg{ fill: $color-subtxt; } } } }*/
|
||||
}
|
||||
.pagenationNav {
|
||||
font-size: 0.8rem;
|
||||
line-height: 1.6;
|
||||
letter-spacing: 0.04rem;
|
||||
font-weight: normal;
|
||||
}
|
||||
.pagenationNav a {
|
||||
display: inline-block;
|
||||
margin: 0 1px;
|
||||
padding: 0.3rem 0.7rem;
|
||||
font-size: 13px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: 0.04rem;
|
||||
font-weight: normal;
|
||||
text-decoration: none;
|
||||
color: #333333;
|
||||
border: 1px #a5a5a5 solid;
|
||||
border-radius: 0.2rem;
|
||||
opacity: 0.4;
|
||||
pointer-events: none;
|
||||
}
|
||||
.pagenationNav a.isActive {
|
||||
opacity: 1;
|
||||
pointer-events: inherit;
|
||||
}
|
||||
.pagenationNav a.isActive:hover {
|
||||
background: #f5f5f5;
|
||||
}
|
||||
.pagenationTotal {
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
_:-ms-lang(x)::-ms-backdrop,
|
||||
.pagenationNav a {
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.snackbar {
|
||||
width: 800px;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
padding: 0.8rem 1.5rem;
|
||||
color: #ffffff;
|
||||
background: #00b4aa;
|
||||
position: fixed;
|
||||
top: -100%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
border-radius: 0.3rem;
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
|
||||
box-sizing: border-box;
|
||||
z-index: 10;
|
||||
opacity: 0;
|
||||
-moz-transition: all 0.3s ease-out;
|
||||
-ms-transition: all 0.3s ease-out;
|
||||
-webkit-transition: all 0.3s ease-out;
|
||||
transition: all 0.3s ease-out;
|
||||
}
|
||||
.snackbar.isShow {
|
||||
opacity: 1;
|
||||
top: 0.2rem;
|
||||
left: 50%;
|
||||
z-index: 11;
|
||||
-moz-transition: all 0.3s ease-out;
|
||||
-ms-transition: all 0.3s ease-out;
|
||||
-webkit-transition: all 0.3s ease-out;
|
||||
transition: all 0.3s ease-out;
|
||||
}
|
||||
.snackbar.isAlert {
|
||||
background: #ff5a33;
|
||||
}
|
||||
.snackbarMessage {
|
||||
width: calc(800px - 3rem - 3.3rem);
|
||||
font-size: 14px;
|
||||
line-height: 1.7;
|
||||
letter-spacing: 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
.snackbarIcon {
|
||||
width: 1.5rem;
|
||||
margin-right: 1rem;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.snackbarIconClose {
|
||||
width: 0.8rem;
|
||||
}
|
||||
.snackbarIconClose:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.table {
|
||||
width: 100%;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.table tr:nth-child(2n + 3) {
|
||||
background: #f5f5f5;
|
||||
}
|
||||
.table tr:last-child {
|
||||
border-bottom: 0.1rem solid rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.tableHeader {
|
||||
background: #282828;
|
||||
}
|
||||
.tableHeader th {
|
||||
padding: 0.4rem 0.7rem;
|
||||
vertical-align: middle;
|
||||
color: #ffffff;
|
||||
font-size: 11px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: 0.04rem;
|
||||
font-weight: normal;
|
||||
text-align: left;
|
||||
position: relative;
|
||||
}
|
||||
.tableHeader th .hasSort {
|
||||
display: block;
|
||||
width: calc(100% - 0.5rem);
|
||||
}
|
||||
.tableHeader th .hasSort::before {
|
||||
content: "";
|
||||
border-top: 0.4rem #ffffff solid;
|
||||
border-right: 0.35rem transparent solid;
|
||||
border-left: 0.35rem transparent solid;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0.5rem;
|
||||
transform: translateY(-50%);
|
||||
opacity: 0;
|
||||
-moz-transition: all 0.3s ease-out;
|
||||
-ms-transition: all 0.3s ease-out;
|
||||
-webkit-transition: all 0.3s ease-out;
|
||||
transition: all 0.3s ease-out;
|
||||
}
|
||||
.tableHeader th .hasSort:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
.tableHeader th .hasSort:hover::before {
|
||||
opacity: 1;
|
||||
}
|
||||
.tableHeader th:not(:last-child) {
|
||||
border-right: 1px #999999 solid;
|
||||
}
|
||||
.tableHeader th:not(:last-child)::after {
|
||||
content: "";
|
||||
width: 0.6rem;
|
||||
height: 100%;
|
||||
cursor: col-resize;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: -0.3rem;
|
||||
z-index: 3;
|
||||
}
|
||||
.table td {
|
||||
padding: 0.8rem 0.5rem;
|
||||
font-size: 13px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
.table td:has(img) {
|
||||
text-align: center;
|
||||
}
|
||||
.table td .isAlert {
|
||||
color: #ff5a33;
|
||||
}
|
||||
|
||||
.icCheckCircle {
|
||||
width: 20px;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1280px) {
|
||||
@ -19,3 +720,203 @@
|
||||
min-height: 100vh;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1280px) {
|
||||
.header.home {
|
||||
display: block;
|
||||
padding-top: 30vh;
|
||||
padding-left: 40%;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.header.home .headerSub {
|
||||
font-size: 1.4rem;
|
||||
line-height: 2rem;
|
||||
letter-spacing: 0.07rem;
|
||||
font-weight: 600;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
.pgHome > div {
|
||||
width: 400px;
|
||||
margin: 15vh auto 0;
|
||||
padding: 2rem;
|
||||
background: #ffffff;
|
||||
box-shadow: 0 0 5px #aaa;
|
||||
border-radius: 0.3rem;
|
||||
}
|
||||
@media only screen and (min-width: 1280px) {
|
||||
.pgHome > div {
|
||||
margin: 25vh auto 0 50px;
|
||||
}
|
||||
}
|
||||
.pgHomeLinks {
|
||||
width: calc(400px - 4rem);
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
}
|
||||
.pgHomeLinks dt {
|
||||
padding: 0 0 0.5rem 1rem;
|
||||
font-size: 16px;
|
||||
line-height: 1.6;
|
||||
letter-spacing: 0;
|
||||
font-weight: normal;
|
||||
text-align: left;
|
||||
}
|
||||
.pgHomeLinks dt:first-of-type {
|
||||
display: inline-block;
|
||||
width: 45%;
|
||||
padding: 0 0 0.5rem 0;
|
||||
}
|
||||
.pgHomeLinks dd a .buttonIcon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 2rem;
|
||||
transform: translateY(-50%);
|
||||
opacity: 0;
|
||||
-moz-transition: all 0.3s ease-out;
|
||||
-ms-transition: all 0.3s ease-out;
|
||||
-webkit-transition: all 0.3s ease-out;
|
||||
transition: all 0.3s ease-out;
|
||||
}
|
||||
.pgHomeLinks dd a:hover .buttonIcon {
|
||||
top: 50%;
|
||||
right: 1.7rem;
|
||||
opacity: 1;
|
||||
}
|
||||
.pgHomeLinks dd:first-of-type {
|
||||
display: inline-block;
|
||||
width: 45%;
|
||||
text-align: left;
|
||||
}
|
||||
.pgHomeLinks dd .formInput {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.user > div {
|
||||
padding: 0 2rem;
|
||||
}
|
||||
.user .table tr:not(.tableHeader) {
|
||||
cursor: pointer;
|
||||
}
|
||||
.user .table tr:not(.tableHeader):hover {
|
||||
color: #0084b2;
|
||||
}
|
||||
.user .table tr:not(.tableHeader).isSelected {
|
||||
background: #0084b2;
|
||||
color: #ffffff;
|
||||
}
|
||||
.user .table tr:not(.tableHeader).isSelected:hover {
|
||||
color: #ffffff;
|
||||
}
|
||||
.user .table td {
|
||||
max-width: 300px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.menuAction {
|
||||
margin-bottom: 0.6rem;
|
||||
}
|
||||
.menuAction li {
|
||||
display: inline-block;
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.menuLink {
|
||||
display: block;
|
||||
padding: 0.3rem 0.5rem 0.3rem 0.3rem;
|
||||
font-size: 13px;
|
||||
line-height: 1.4;
|
||||
letter-spacing: 0.04rem;
|
||||
font-weight: normal;
|
||||
text-decoration: none;
|
||||
color: #333333;
|
||||
border: 1px #a5a5a5 solid;
|
||||
border-radius: 0.2rem;
|
||||
opacity: 0.4;
|
||||
pointer-events: none;
|
||||
}
|
||||
.menuLink.isActive {
|
||||
opacity: 1;
|
||||
pointer-events: inherit;
|
||||
}
|
||||
.menuLink.isActive:hover {
|
||||
background: #f5f5f5;
|
||||
}
|
||||
.menuIcon {
|
||||
width: 1.4rem;
|
||||
margin-right: 0.4rem;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
.alignCenter {
|
||||
text-align: center;
|
||||
}
|
||||
.alignLeft {
|
||||
text-align: left;
|
||||
}
|
||||
.alignRight {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.linkTx {
|
||||
color: #0084b2;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
.linkTx img {
|
||||
width: 1rem;
|
||||
margin: 0 4px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.linkTx:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.borderTop {
|
||||
border-top: 0.1rem solid rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.borderBottom {
|
||||
border-bottom: 0.1rem solid rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.marginBtm0 {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
.marginBtm1 {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.marginBtm2 {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
.marginBtm3 {
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
.marginBtm5 {
|
||||
margin-bottom: 5rem;
|
||||
}
|
||||
.marginRgt1 {
|
||||
margin-right: 0.9rem;
|
||||
}
|
||||
.marginRgt2 {
|
||||
margin-right: 1.5rem;
|
||||
}
|
||||
.marginRgt3 {
|
||||
margin-right: 3rem;
|
||||
}
|
||||
|
||||
.txNormal {
|
||||
font-size: 14px;
|
||||
line-height: 1.7;
|
||||
letter-spacing: 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
.txIcon {
|
||||
width: 1.1rem;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=style.css.map */
|
||||
|
||||
83
dictation_client/src/styles/app.module.scss.d.ts
vendored
83
dictation_client/src/styles/app.module.scss.d.ts
vendored
@ -1,5 +1,88 @@
|
||||
declare const classNames: {
|
||||
readonly wrap: "wrap";
|
||||
readonly home: "home";
|
||||
readonly header: "header";
|
||||
readonly headerLogo: "headerLogo";
|
||||
readonly headerSub: "headerSub";
|
||||
readonly headerMenu: "headerMenu";
|
||||
readonly isActive: "isActive";
|
||||
readonly accountInfo: "accountInfo";
|
||||
readonly accountIcon: "accountIcon";
|
||||
readonly main: "main";
|
||||
readonly mainSmall: "mainSmall";
|
||||
readonly mainLogin: "mainLogin";
|
||||
readonly footer: "footer";
|
||||
readonly buttonNormal: "buttonNormal";
|
||||
readonly small: "small";
|
||||
readonly red: "red";
|
||||
readonly buttonBase: "buttonBase";
|
||||
readonly buttonText: "buttonText";
|
||||
readonly formList: "formList";
|
||||
readonly formTitle: "formTitle";
|
||||
readonly overLine: "overLine";
|
||||
readonly full: "full";
|
||||
readonly hasbg: "hasbg";
|
||||
readonly form: "form";
|
||||
readonly formInput: "formInput";
|
||||
readonly isError: "isError";
|
||||
readonly password: "password";
|
||||
readonly formIconEye: "formIconEye";
|
||||
readonly formCheck: "formCheck";
|
||||
readonly formRadio: "formRadio";
|
||||
readonly formComment: "formComment";
|
||||
readonly formError: "formError";
|
||||
readonly formConfirm: "formConfirm";
|
||||
readonly formSubmit: "formSubmit";
|
||||
readonly formButton: "formButton";
|
||||
readonly formBack: "formBack";
|
||||
readonly formButtonTx: "formButtonTx";
|
||||
readonly formDone: "formDone";
|
||||
readonly loadingBoxSpinner: "loadingBoxSpinner";
|
||||
readonly modal: "modal";
|
||||
readonly isShow: "isShow";
|
||||
readonly modalBox: "modalBox";
|
||||
readonly modalTitle: "modalTitle";
|
||||
readonly off: "off";
|
||||
readonly modalTitleIcon: "modalTitleIcon";
|
||||
readonly last: "last";
|
||||
readonly slideSet: "slideSet";
|
||||
readonly pageHeader: "pageHeader";
|
||||
readonly pageTitle: "pageTitle";
|
||||
readonly pagenation: "pagenation";
|
||||
readonly pagenationNav: "pagenationNav";
|
||||
readonly pagenationTotal: "pagenationTotal";
|
||||
readonly snackbar: "snackbar";
|
||||
readonly isAlert: "isAlert";
|
||||
readonly snackbarMessage: "snackbarMessage";
|
||||
readonly snackbarIcon: "snackbarIcon";
|
||||
readonly snackbarIconClose: "snackbarIconClose";
|
||||
readonly table: "table";
|
||||
readonly tableHeader: "tableHeader";
|
||||
readonly hasSort: "hasSort";
|
||||
readonly icCheckCircle: "icCheckCircle";
|
||||
readonly pgHome: "pgHome";
|
||||
readonly pgHomeLinks: "pgHomeLinks";
|
||||
readonly buttonIcon: "buttonIcon";
|
||||
readonly user: "user";
|
||||
readonly isSelected: "isSelected";
|
||||
readonly menuAction: "menuAction";
|
||||
readonly menuLink: "menuLink";
|
||||
readonly menuIcon: "menuIcon";
|
||||
readonly alignCenter: "alignCenter";
|
||||
readonly alignLeft: "alignLeft";
|
||||
readonly alignRight: "alignRight";
|
||||
readonly linkTx: "linkTx";
|
||||
readonly borderTop: "borderTop";
|
||||
readonly borderBottom: "borderBottom";
|
||||
readonly marginBtm0: "marginBtm0";
|
||||
readonly marginBtm1: "marginBtm1";
|
||||
readonly marginBtm2: "marginBtm2";
|
||||
readonly marginBtm3: "marginBtm3";
|
||||
readonly marginBtm5: "marginBtm5";
|
||||
readonly marginRgt1: "marginRgt1";
|
||||
readonly marginRgt2: "marginRgt2";
|
||||
readonly marginRgt3: "marginRgt3";
|
||||
readonly txNormal: "txNormal";
|
||||
readonly txIcon: "txIcon";
|
||||
};
|
||||
export = classNames;
|
||||
|
||||
@ -46,5 +46,33 @@
|
||||
"termsCheckBox": "(de)Yes, I agree to the terms of use.",
|
||||
"createAccountButton": "(de)Create account"
|
||||
}
|
||||
},
|
||||
"signupConfirmPage": {
|
||||
"text": {
|
||||
"title": "(de)Confirmation",
|
||||
"pageExplanation": "(de)Explanation ......",
|
||||
"accountInfoTitle": "(de)Your account information",
|
||||
"adminInfoTitle": "(de)Primary administrator's information"
|
||||
},
|
||||
"message": {
|
||||
"emailConflictError": "(仮)"
|
||||
},
|
||||
"label": {
|
||||
"company": "(de)Company Name",
|
||||
"country": "(de)Country",
|
||||
"dealer": "(de)Dealer (Optional)",
|
||||
"adminName": "(de)Admin Name",
|
||||
"email": "(de)Email",
|
||||
"password": "(de)Password",
|
||||
"signupButton": "(de)Sign up"
|
||||
}
|
||||
},
|
||||
"signupCompletePage": {
|
||||
"text": {
|
||||
"createdInfo": "(de)Your account has been created and a verification email has been set to your registered email address. Please click on the verification link included in the email to activate your account."
|
||||
},
|
||||
"label": {
|
||||
"title": "(de)Account created"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -34,6 +34,9 @@
|
||||
"adminInfoTitle": "Register primary administrator's information",
|
||||
"passwordTerms": " Please set a password or issue an initial password. \nThe password must be more than 8 or less than 25 letters,numbers and symbols."
|
||||
},
|
||||
"message": {
|
||||
"emailConflictError": "(仮)"
|
||||
},
|
||||
"label": {
|
||||
"company": "Company Name",
|
||||
"country": "Country",
|
||||
@ -44,7 +47,33 @@
|
||||
"termsLink": "Click here to read the terms of use",
|
||||
"termsLinkFor": "for ODDS.",
|
||||
"termsCheckBox": "Yes, I agree to the terms of use.",
|
||||
"createAccountButton": "Create account"
|
||||
"createAccountButton": "Create account",
|
||||
"signupButton": "Sign up"
|
||||
}
|
||||
},
|
||||
"signupConfirmPage": {
|
||||
"text": {
|
||||
"title": "Confirmation",
|
||||
"pageExplanation": "Explanation ......",
|
||||
"accountInfoTitle": "Your account information",
|
||||
"adminInfoTitle": "Primary administrator's information"
|
||||
},
|
||||
"label": {
|
||||
"company": "Company Name",
|
||||
"country": "Country",
|
||||
"dealer": "Dealer (Optional)",
|
||||
"adminName": "Admin Name",
|
||||
"email": "Email",
|
||||
"password": "Password",
|
||||
"signupButton": "Sign up"
|
||||
}
|
||||
},
|
||||
"signupCompletePage": {
|
||||
"text": {
|
||||
"createdInfo": "Your account has been created and a verification email has been set to your registered email address. Please click on the verification link included in the email to activate your account."
|
||||
},
|
||||
"label": {
|
||||
"title": "Account created"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -46,5 +46,33 @@
|
||||
"termsCheckBox": "(es)Yes, I agree to the terms of use.",
|
||||
"createAccountButton": "(es)Create account"
|
||||
}
|
||||
},
|
||||
"signupConfirmPage": {
|
||||
"text": {
|
||||
"title": "(es)Confirmation",
|
||||
"pageExplanation": "(es)Explanation ......",
|
||||
"accountInfoTitle": "(es)Your account information",
|
||||
"adminInfoTitle": "(es)Primary administrator's information"
|
||||
},
|
||||
"message": {
|
||||
"emailConflictError": "(仮)"
|
||||
},
|
||||
"label": {
|
||||
"company": "(es)Company Name",
|
||||
"country": "(es)Country",
|
||||
"dealer": "(es)Dealer (Optional)",
|
||||
"adminName": "(es)Admin Name",
|
||||
"email": "(es)Email",
|
||||
"password": "(es)Password",
|
||||
"signupButton": "(es)Sign up"
|
||||
}
|
||||
},
|
||||
"signupCompletePage": {
|
||||
"text": {
|
||||
"createdInfo": "(es)Your account has been created and a verification email has been set to your registered email address. Please click on the verification link included in the email to activate your account."
|
||||
},
|
||||
"label": {
|
||||
"title": "(es)Account created"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -46,5 +46,33 @@
|
||||
"termsCheckBox": "(fr)Yes, I agree to the terms of use.",
|
||||
"createAccountButton": "(fr)Create account"
|
||||
}
|
||||
},
|
||||
"signupConfirmPage": {
|
||||
"text": {
|
||||
"title": "(fr)Confirmation",
|
||||
"pageExplanation": "(fr)Explanation ......",
|
||||
"accountInfoTitle": "(fr)Your account information",
|
||||
"adminInfoTitle": "(fr)Primary administrator's information"
|
||||
},
|
||||
"message": {
|
||||
"emailConflictError": "(仮)"
|
||||
},
|
||||
"label": {
|
||||
"company": "(fr)Company Name",
|
||||
"country": "(fr)Country",
|
||||
"dealer": "(fr)Dealer (Optional)",
|
||||
"adminName": "(fr)Admin Name",
|
||||
"email": "(fr)Email",
|
||||
"password": "(fr)Password",
|
||||
"signupButton": "(fr)Sign up"
|
||||
}
|
||||
},
|
||||
"signupCompletePage": {
|
||||
"text": {
|
||||
"createdInfo": "(fr)Your account has been created and a verification email has been set to your registered email address. Please click on the verification link included in the email to activate your account."
|
||||
},
|
||||
"label": {
|
||||
"title": "(fr)Account created"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user