Merged PR 551: 画面実装(代行操作中のヘッダー表示)
## 概要 [Task2911: 画面実装(代行操作中のヘッダー表示)](https://paruru.nds-tyo.co.jp:8443/tfs/ReciproCollection/fa4924a4-d079-4fab-9fb5-a9a11eb205f0/_workitems/edit/2911) - 代行操作中に表示されるヘッダのタブを以下のタブのみに設定しました。 - User - Workflow - License ## レビューポイント - 代行操作タブ表示の判断材料としてヘッダコンポーネント内でselectorで代行操作の有無を判断してタブ表示用メソッドに渡していますが、データの取り扱いとして不自然なところはないでしょうか? ## UIの変更 - [Task2911](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/Task2911?csf=1&web=1&e=zFW1zj) ## 動作確認状況 - ローカルで確認
This commit is contained in:
parent
bc110712b0
commit
ef4f22029b
@ -70,3 +70,12 @@ export const TIER1_TO_TIER4_ONLY_TABS = [HEADER_MENUS_PARTNER];
|
|||||||
* admin,standardでなく、第1~5階層でもないアカウントに表示する空のヘッダータブ
|
* admin,standardでなく、第1~5階層でもないアカウントに表示する空のヘッダータブ
|
||||||
*/
|
*/
|
||||||
export const INVALID_ACCOUNT_TABS = [];
|
export const INVALID_ACCOUNT_TABS = [];
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 代行操作中に表示するヘッダータブ
|
||||||
|
*/
|
||||||
|
export const DELEGATE_TABS = [
|
||||||
|
HEADER_MENUS_LICENSE,
|
||||||
|
HEADER_MENUS_USER,
|
||||||
|
HEADER_MENUS_WORKFLOW,
|
||||||
|
];
|
||||||
|
|||||||
@ -12,6 +12,7 @@ import {
|
|||||||
clearUserInfo,
|
clearUserInfo,
|
||||||
} from "features/login";
|
} from "features/login";
|
||||||
import { useNavigate } from "react-router-dom";
|
import { useNavigate } from "react-router-dom";
|
||||||
|
import { selectDelegationAccessToken } from "features/auth/selectors";
|
||||||
import { getFilteredMenus } from "./utils";
|
import { getFilteredMenus } from "./utils";
|
||||||
import logo from "../../assets/images/OMS_logo_black.svg";
|
import logo from "../../assets/images/OMS_logo_black.svg";
|
||||||
import ac from "../../assets/images/account_circle.svg";
|
import ac from "../../assets/images/account_circle.svg";
|
||||||
@ -27,12 +28,15 @@ interface HeaderProps {
|
|||||||
// ログイン後のヘッダー
|
// ログイン後のヘッダー
|
||||||
const LoginedHeader: React.FC<HeaderProps> = (props: HeaderProps) => {
|
const LoginedHeader: React.FC<HeaderProps> = (props: HeaderProps) => {
|
||||||
const { activePath } = props;
|
const { activePath } = props;
|
||||||
const filterMenus = getFilteredMenus();
|
|
||||||
const dispatch: AppDispatch = useDispatch();
|
const dispatch: AppDispatch = useDispatch();
|
||||||
const { instance } = useMsal();
|
const { instance } = useMsal();
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
|
|
||||||
|
// メニューの代行操作表示制御
|
||||||
|
const isDelegation = useSelector(selectDelegationAccessToken) !== null;
|
||||||
|
const filterMenus = getFilteredMenus(isDelegation);
|
||||||
|
|
||||||
// Headerのユーザー情報を取得する
|
// Headerのユーザー情報を取得する
|
||||||
const isUserNameEmpty = useSelector(selectIsUserNameEmpty);
|
const isUserNameEmpty = useSelector(selectIsUserNameEmpty);
|
||||||
const userName = useSelector(selectUserName);
|
const userName = useSelector(selectUserName);
|
||||||
|
|||||||
@ -5,6 +5,7 @@ import {
|
|||||||
HEADER_MENUS,
|
HEADER_MENUS,
|
||||||
TIER1_TO_TIER4_ONLY_TABS,
|
TIER1_TO_TIER4_ONLY_TABS,
|
||||||
INVALID_ACCOUNT_TABS,
|
INVALID_ACCOUNT_TABS,
|
||||||
|
DELEGATE_TABS,
|
||||||
} from "./constants";
|
} from "./constants";
|
||||||
import { TIERS } from "../auth/constants";
|
import { TIERS } from "../auth/constants";
|
||||||
|
|
||||||
@ -29,7 +30,7 @@ export const isLoginPaths = (d: string): d is LoginedPaths => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
// 権限、階層ごとに表示するヘッダーをわける
|
// 権限、階層ごとに表示するヘッダーをわける
|
||||||
export const getFilteredMenus = () => {
|
export const getFilteredMenus = (isDelegation: boolean) => {
|
||||||
const isAdmin = isAdminUser();
|
const isAdmin = isAdminUser();
|
||||||
const isStandard = isStandardUser();
|
const isStandard = isStandardUser();
|
||||||
const isTier5 = isApproveTier([TIERS.TIER5]);
|
const isTier5 = isApproveTier([TIERS.TIER5]);
|
||||||
@ -40,6 +41,10 @@ export const getFilteredMenus = () => {
|
|||||||
TIERS.TIER4,
|
TIERS.TIER4,
|
||||||
]);
|
]);
|
||||||
|
|
||||||
|
if (isDelegation) {
|
||||||
|
return HEADER_MENUS.filter((item) => DELEGATE_TABS.includes(item.key));
|
||||||
|
}
|
||||||
|
|
||||||
if (tier1ToTier4) {
|
if (tier1ToTier4) {
|
||||||
if (isAdmin) {
|
if (isAdmin) {
|
||||||
return HEADER_MENUS;
|
return HEADER_MENUS;
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user