e4bc4776b0
## 概要 [Task2015: [Task1895完了後][Sp11-2着手] ローディング表現に関する実装等を行う](https://paruru.nds-tyo.co.jp:8443/tfs/ReciproCollection/fa4924a4-d079-4fab-9fb5-a9a11eb205f0/_workitems/edit/2015) - 現在実装中のテーブル、ポップアップについてローディング表現を実装しました。 - ローディング中にローディング中を示すぐるぐるを表示 - ローディング中はボタンを非活性にする ## レビューポイント - 対応箇所は適切か - 表示内容に問題はないか ## UIの変更 - [Task2015](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/Task2015?csf=1&web=1&e=TmrOXa) ## 動作確認状況 - ローカルで確認
45 lines
1.2 KiB
TypeScript
45 lines
1.2 KiB
TypeScript
import { PayloadAction, createSlice } from "@reduxjs/toolkit";
|
|
import { LicenseOrdersState } from "./state";
|
|
import { orderLicenseAsync } from "./operations";
|
|
|
|
const initialState: LicenseOrdersState = {
|
|
apps: {
|
|
poNumber: "",
|
|
newOrder: 0,
|
|
isLoading: false,
|
|
},
|
|
};
|
|
export const licenseSlice = createSlice({
|
|
name: "license",
|
|
initialState,
|
|
reducers: {
|
|
changePoNumber: (state, action: PayloadAction<{ poNumber: string }>) => {
|
|
const { poNumber } = action.payload;
|
|
state.apps.poNumber = poNumber.toUpperCase();
|
|
},
|
|
changeNewOrder: (state, action: PayloadAction<{ newOrder: number }>) => {
|
|
const { newOrder } = action.payload;
|
|
state.apps.newOrder = newOrder;
|
|
},
|
|
cleanupApps: (state) => {
|
|
state.apps = initialState.apps;
|
|
},
|
|
},
|
|
extraReducers: (builder) => {
|
|
builder.addCase(orderLicenseAsync.pending, (state) => {
|
|
state.apps.isLoading = true;
|
|
});
|
|
builder.addCase(orderLicenseAsync.fulfilled, (state) => {
|
|
state.apps.isLoading = false;
|
|
});
|
|
builder.addCase(orderLicenseAsync.rejected, (state) => {
|
|
state.apps.isLoading = false;
|
|
});
|
|
},
|
|
});
|
|
|
|
export const { changePoNumber, changeNewOrder, cleanupApps } =
|
|
licenseSlice.actions;
|
|
|
|
export default licenseSlice.reducer;
|