Merged PR 302: 画面修正(注文履歴)
## 概要 [Task2339: 画面修正(注文履歴)](https://paruru.nds-tyo.co.jp:8443/tfs/ReciproCollection/fa4924a4-d079-4fab-9fb5-a9a11eb205f0/_workitems/edit/2339) 注文履歴画面について、以下の修正を行いました。 ・Issueボタン押下時の処理を追加 ・Issueボタン、Issue Cancelボタン、Order Cancelボタンのレイアウト修正 ※Issue Cancelボタン、Order Cancelボタン押下時の動作は今回は対象外です。 ## レビューポイント なし ## UIの変更 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/Task2339?csf=1&web=1&e=sUjf1e ## 動作確認状況 ローカルで動作確認済み ## 補足 なし
This commit is contained in:
parent
ef83477533
commit
c304271494
@ -42,4 +42,6 @@ export const errorCodes = [
|
||||
"E010701", // Blobファイル不在エラー
|
||||
"E010801", // ライセンス不在エラー
|
||||
"E010802", // ライセンス取り込み済みエラー
|
||||
"E010803", // ライセンス数不足エラー
|
||||
"E010804", // ライセンス発行済みエラー
|
||||
] as const;
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import { PayloadAction, createSlice } from "@reduxjs/toolkit";
|
||||
import { LicenseOrderHistoryState } from "./state";
|
||||
import { getLicenseOrderHistoriesAsync } from "./operations";
|
||||
import { getLicenseOrderHistoriesAsync, issueLicenseAsync } from "./operations";
|
||||
import { LIMIT_ORDER_HISORY_NUM } from "./constants";
|
||||
|
||||
const initialState: LicenseOrderHistoryState = {
|
||||
@ -52,6 +52,15 @@ export const licenseOrderHistorySlice = createSlice({
|
||||
builder.addCase(getLicenseOrderHistoriesAsync.rejected, (state) => {
|
||||
state.apps.isLoading = false;
|
||||
});
|
||||
builder.addCase(issueLicenseAsync.pending, (state) => {
|
||||
state.apps.isLoading = true;
|
||||
});
|
||||
builder.addCase(issueLicenseAsync.fulfilled, (state) => {
|
||||
state.apps.isLoading = false;
|
||||
});
|
||||
builder.addCase(issueLicenseAsync.rejected, (state) => {
|
||||
state.apps.isLoading = false;
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
@ -74,3 +74,70 @@ export const getLicenseOrderHistoriesAsync = createAsyncThunk<
|
||||
return thunkApi.rejectWithValue({ error });
|
||||
}
|
||||
});
|
||||
|
||||
export const issueLicenseAsync = createAsyncThunk<
|
||||
{
|
||||
/* Empty Object */
|
||||
},
|
||||
{
|
||||
// パラメータ
|
||||
orderedAccountId: number;
|
||||
poNumber: string;
|
||||
},
|
||||
{
|
||||
// rejectした時の返却値の型
|
||||
rejectValue: {
|
||||
error: ErrorObject;
|
||||
};
|
||||
}
|
||||
>("licenses/issueLicenseAsync", async (args, thunkApi) => {
|
||||
const { orderedAccountId, poNumber } = args;
|
||||
// apiのConfigurationを取得する
|
||||
const { getState } = thunkApi;
|
||||
const state = getState() as RootState;
|
||||
const { configuration, accessToken } = state.auth;
|
||||
const config = new Configuration(configuration);
|
||||
const accountsApi = new AccountsApi(config);
|
||||
|
||||
try {
|
||||
await accountsApi.issueLicense(
|
||||
{
|
||||
orderedAccountId,
|
||||
poNumber,
|
||||
},
|
||||
{
|
||||
headers: { authorization: `Bearer ${accessToken}` },
|
||||
}
|
||||
);
|
||||
thunkApi.dispatch(
|
||||
openSnackbar({
|
||||
level: "info",
|
||||
message: getTranslationID("common.message.success"),
|
||||
})
|
||||
);
|
||||
return {};
|
||||
} catch (e) {
|
||||
// e ⇒ errorObjectに変換"
|
||||
const error = createErrorObject(e);
|
||||
|
||||
let errorMessage = getTranslationID("common.message.internalServerError");
|
||||
|
||||
if (error.code === "E010803") {
|
||||
errorMessage = getTranslationID(
|
||||
"orderHistoriesPage.message.notEnoughOfNumberOfLicense"
|
||||
);
|
||||
} else if (error.code === "E010804") {
|
||||
errorMessage = getTranslationID(
|
||||
"orderHistoriesPage.message.alreadyIssueLicense"
|
||||
);
|
||||
}
|
||||
thunkApi.dispatch(
|
||||
openSnackbar({
|
||||
level: "error",
|
||||
message: errorMessage,
|
||||
})
|
||||
);
|
||||
|
||||
return thunkApi.rejectWithValue({ error });
|
||||
}
|
||||
});
|
||||
|
||||
@ -17,6 +17,7 @@ import {
|
||||
selectOrderHisory,
|
||||
selectTotal,
|
||||
selectTotalPage,
|
||||
issueLicenseAsync,
|
||||
selectOffset,
|
||||
savePageInfo,
|
||||
selectCompanyName,
|
||||
@ -50,6 +51,40 @@ export const LicenseOrderHistory: React.FC<LicenseOrderHistoryProps> = (
|
||||
onReturn();
|
||||
}, [isLoading, onReturn]);
|
||||
|
||||
// issue,issueCancel,orderCancelボタンの処理終了時の情報更新用
|
||||
const UpdateHistoriesList = () => {
|
||||
dispatch(
|
||||
getLicenseOrderHistoriesAsync({
|
||||
limit: LIMIT_ORDER_HISORY_NUM,
|
||||
offset,
|
||||
})
|
||||
);
|
||||
};
|
||||
|
||||
// issueボタンを押下時の処理
|
||||
const issueLicense = useCallback(
|
||||
async (poNumber: string) => {
|
||||
// ダイアログ確認
|
||||
// eslint-disable-next-line no-alert
|
||||
if (window.confirm(t(getTranslationID("common.message.dialogConfirm")))) {
|
||||
// 注文APIの呼び出し
|
||||
if (selectedRow) {
|
||||
const { meta } = await dispatch(
|
||||
issueLicenseAsync({
|
||||
orderedAccountId: selectedRow.accountId,
|
||||
poNumber,
|
||||
})
|
||||
);
|
||||
if (meta.requestStatus === "fulfilled") {
|
||||
UpdateHistoriesList();
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
[dispatch]
|
||||
);
|
||||
|
||||
// ページネーションのボタンクリック時のアクション
|
||||
const movePage = (targetOffset: number) => {
|
||||
dispatch(
|
||||
@ -130,7 +165,6 @@ export const LicenseOrderHistory: React.FC<LicenseOrderHistoryProps> = (
|
||||
{t(getTranslationID("orderHistoriesPage.label.status"))}
|
||||
</th>
|
||||
<th className={styles.noLine} />
|
||||
<th className={styles.noLine} />
|
||||
</tr>
|
||||
{!isLoading &&
|
||||
licenseOrderHistory.length !== 0 &&
|
||||
@ -168,63 +202,68 @@ export const LicenseOrderHistory: React.FC<LicenseOrderHistoryProps> = (
|
||||
})()}
|
||||
</td>
|
||||
<td>
|
||||
{selectedRow === undefined &&
|
||||
x.status === STATUS.ISSUE_REQESTING && (
|
||||
<ul
|
||||
className={`${styles.menuAction} ${styles.inTable}`}
|
||||
>
|
||||
<li>
|
||||
<a
|
||||
href=""
|
||||
className={`${styles.menuLink} ${styles.isActive}`}
|
||||
>
|
||||
{t(
|
||||
getTranslationID(
|
||||
"orderHistoriesPage.label.orderCancel"
|
||||
)
|
||||
)}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
)}
|
||||
{selectedRow !== undefined &&
|
||||
x.status === STATUS.ISSUE_REQESTING && (
|
||||
<ul
|
||||
className={`${styles.menuAction} ${styles.inTable}`}
|
||||
>
|
||||
<li>
|
||||
<a
|
||||
href=""
|
||||
className={`${styles.colorLink} ${styles.isActive}`}
|
||||
>
|
||||
{t(
|
||||
getTranslationID(
|
||||
"orderHistoriesPage.label.issue"
|
||||
)
|
||||
)}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
)}
|
||||
{selectedRow !== undefined &&
|
||||
x.status === STATUS.ISSUED && (
|
||||
<ul
|
||||
className={`${styles.menuAction} ${styles.inTable}`}
|
||||
>
|
||||
<li>
|
||||
<a
|
||||
href=""
|
||||
className={`${styles.menuLink} ${styles.isActive}`}
|
||||
>
|
||||
{t(
|
||||
getTranslationID(
|
||||
"orderHistoriesPage.label.issueCancel"
|
||||
)
|
||||
)}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
)}
|
||||
{!selectedRow && (
|
||||
<ul
|
||||
className={`${styles.menuAction} ${styles.inTable}`}
|
||||
>
|
||||
<li>
|
||||
<a
|
||||
className={`${styles.menuLink} ${
|
||||
x.status === STATUS.ISSUE_REQESTING
|
||||
? styles.isActive
|
||||
: ""
|
||||
}`}
|
||||
>
|
||||
{t(
|
||||
getTranslationID(
|
||||
"orderHistoriesPage.label.orderCancel"
|
||||
)
|
||||
)}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
)}
|
||||
{selectedRow && (
|
||||
<ul
|
||||
className={`${styles.menuAction} ${styles.inTable}`}
|
||||
>
|
||||
<li>
|
||||
{/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */}
|
||||
<a
|
||||
className={`${styles.colorLink} ${
|
||||
x.status === STATUS.ISSUE_REQESTING
|
||||
? styles.isActive
|
||||
: ""
|
||||
}`}
|
||||
onClick={(event) => {
|
||||
event.preventDefault();
|
||||
issueLicense(x.poNumber);
|
||||
}}
|
||||
>
|
||||
{t(
|
||||
getTranslationID(
|
||||
"orderHistoriesPage.label.issue"
|
||||
)
|
||||
)}
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
className={`${styles.menuLink} ${
|
||||
x.status === STATUS.ISSUED
|
||||
? styles.isActive
|
||||
: ""
|
||||
}`}
|
||||
>
|
||||
{t(
|
||||
getTranslationID(
|
||||
"orderHistoriesPage.label.issueCancel"
|
||||
)
|
||||
)}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
)}
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
|
||||
@ -324,6 +324,10 @@
|
||||
"issueCancel": "(de)Issue Cancel",
|
||||
"orderCancel": "(de)Order Cancel",
|
||||
"histories": "(de)histories"
|
||||
},
|
||||
"message": {
|
||||
"notEnoughOfNumberOfLicense": "(de)ライセンスが不足しているため、発行することができませんでした。ライセンスの注文を行ってください。",
|
||||
"alreadyIssueLicense": "(de)すでに発行済みの注文です。画面を更新してください。"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -324,6 +324,10 @@
|
||||
"issueCancel": "Issue Cancel",
|
||||
"orderCancel": "Order Cancel",
|
||||
"histories": "histories"
|
||||
},
|
||||
"message": {
|
||||
"notEnoughOfNumberOfLicense": "ライセンスが不足しているため、発行することができませんでした。ライセンスの注文を行ってください。",
|
||||
"alreadyIssueLicense": "すでに発行済みの注文です。画面を更新してください。"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -324,6 +324,10 @@
|
||||
"issueCancel": "(es)Issue Cancel",
|
||||
"orderCancel": "(es)Order Cancel",
|
||||
"histories": "(es)histories"
|
||||
},
|
||||
"message": {
|
||||
"notEnoughOfNumberOfLicense": "(es)ライセンスが不足しているため、発行することができませんでした。ライセンスの注文を行ってください。",
|
||||
"alreadyIssueLicense": "(es)すでに発行済みの注文です。画面を更新してください。"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -324,6 +324,10 @@
|
||||
"issueCancel": "(fr)Issue Cancel",
|
||||
"orderCancel": "(fr)Order Cancel",
|
||||
"histories": "(fr)histories"
|
||||
},
|
||||
"message": {
|
||||
"notEnoughOfNumberOfLicense": "(fr)ライセンスが不足しているため、発行することができませんでした。ライセンスの注文を行ってください。",
|
||||
"alreadyIssueLicense": "(fr)すでに発行済みの注文です。画面を更新してください。"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user