ほかブランチのマージで消えた実装をもとに戻す
This commit is contained in:
saito.k
parent
8e317f5aca
commit
3f018d1100
@ -1,4 +1,4 @@
|
|||||||
import React, { useEffect } from "react";
|
import React, { useEffect, useState } from "react";
|
||||||
import Header from "components/header";
|
import Header from "components/header";
|
||||||
import Footer from "components/footer";
|
import Footer from "components/footer";
|
||||||
import styles from "styles/app.module.scss";
|
import styles from "styles/app.module.scss";
|
||||||
@ -14,10 +14,13 @@ import { listWorkflowAsync } from "features/workflow/operations";
|
|||||||
import { selectIsLoading, selectWorkflows } from "features/workflow";
|
import { selectIsLoading, selectWorkflows } from "features/workflow";
|
||||||
import progress_activit from "assets/images/progress_activit.svg";
|
import progress_activit from "assets/images/progress_activit.svg";
|
||||||
import { getTranslationID } from "translation";
|
import { getTranslationID } from "translation";
|
||||||
|
import { AddWorkflowPopup } from "./addworkflowPopup";
|
||||||
|
|
||||||
const WorkflowPage: React.FC = (): JSX.Element => {
|
const WorkflowPage: React.FC = (): JSX.Element => {
|
||||||
const dispatch: AppDispatch = useDispatch();
|
const dispatch: AppDispatch = useDispatch();
|
||||||
const [t] = useTranslation();
|
const [t] = useTranslation();
|
||||||
|
// 追加Popupの表示制御
|
||||||
|
const [isShowAddPopup, setIsShowAddPopup] = useState<boolean>(false);
|
||||||
const workflows = useSelector(selectWorkflows);
|
const workflows = useSelector(selectWorkflows);
|
||||||
const isLoading = useSelector(selectIsLoading);
|
const isLoading = useSelector(selectIsLoading);
|
||||||
|
|
||||||
@ -25,139 +28,167 @@ const WorkflowPage: React.FC = (): JSX.Element => {
|
|||||||
dispatch(listWorkflowAsync());
|
dispatch(listWorkflowAsync());
|
||||||
}, [dispatch]);
|
}, [dispatch]);
|
||||||
return (
|
return (
|
||||||
<div className={styles.wrap}>
|
<>
|
||||||
<Header userName="XXXXXX" />
|
{isShowAddPopup && (
|
||||||
<UpdateTokenTimer />
|
<AddWorkflowPopup
|
||||||
<main className={styles.main}>
|
onClose={() => {
|
||||||
<div className="">
|
setIsShowAddPopup(false);
|
||||||
<div className={styles.pageHeader}>
|
}}
|
||||||
<h1 className={styles.pageTitle}>
|
/>
|
||||||
{t(getTranslationID("workflowPage.label.title"))}
|
)}
|
||||||
</h1>
|
<div className={styles.wrap}>
|
||||||
</div>
|
<Header userName="XXXXXX" />
|
||||||
<section className={styles.workflow}>
|
<UpdateTokenTimer />
|
||||||
<div>
|
<main className={styles.main}>
|
||||||
<ul className={`${styles.menuAction} ${styles.alignRight}`}>
|
<div className="">
|
||||||
<li className={styles.floatLeft}>
|
<div className={styles.pageHeader}>
|
||||||
<a className={`${styles.menuLink} ${styles.isActive}`}>
|
<h1 className={styles.pageTitle}>
|
||||||
<img
|
{t(getTranslationID("workflowPage.label.title"))}
|
||||||
src={ruleAddImg}
|
</h1>
|
||||||
alt="addRoutingRule"
|
|
||||||
className={styles.menuIcon}
|
|
||||||
/>
|
|
||||||
{t(getTranslationID("workflowPage.label.addRoutingRule"))}
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li>
|
|
||||||
<a
|
|
||||||
href="/workflow/template"
|
|
||||||
className={`${styles.menuLink} ${styles.isActive}`}
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
src={templateSettingImg}
|
|
||||||
alt="templateSetting"
|
|
||||||
className={styles.menuIcon}
|
|
||||||
/>
|
|
||||||
{t(getTranslationID("workflowPage.label.templateSetting"))}
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a
|
|
||||||
href="/workflow/worktype-id"
|
|
||||||
className={`${styles.menuLink} ${styles.isActive}`}
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
src={worktypeSettingImg}
|
|
||||||
alt="worktypeIdSetting"
|
|
||||||
className={styles.menuIcon}
|
|
||||||
/>
|
|
||||||
{t(
|
|
||||||
getTranslationID("workflowPage.label.worktypeIdSetting")
|
|
||||||
)}
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a
|
|
||||||
href="/workflow/typist-group"
|
|
||||||
className={`${styles.menuLink} ${styles.isActive}`}
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
src={groupSettingImg}
|
|
||||||
alt="typistGroupSetting"
|
|
||||||
className={styles.menuIcon}
|
|
||||||
/>
|
|
||||||
{t(
|
|
||||||
getTranslationID("workflowPage.label.typistGroupSetting")
|
|
||||||
)}
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<table className={`${styles.table} ${styles.workflow}`}>
|
|
||||||
<tr className={styles.tableHeader}>
|
|
||||||
<th className={styles.clm0}>{/** empty th */}</th>
|
|
||||||
<th>{t(getTranslationID("workflowPage.label.authorID"))}</th>
|
|
||||||
<th>{t(getTranslationID("workflowPage.label.worktype"))}</th>
|
|
||||||
<th>
|
|
||||||
{t(getTranslationID("workflowPage.label.transcriptionist"))}
|
|
||||||
</th>
|
|
||||||
<th>{t(getTranslationID("workflowPage.label.template"))}</th>
|
|
||||||
</tr>
|
|
||||||
{workflows?.map((workflow) => (
|
|
||||||
<tr key={workflow.id}>
|
|
||||||
<td className={styles.clm0}>
|
|
||||||
<ul className={styles.menuInTable}>
|
|
||||||
<li>
|
|
||||||
<a href="">
|
|
||||||
{t(getTranslationID("workflowPage.label.editRule"))}
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a href="">
|
|
||||||
{t(getTranslationID("common.label.delete"))}
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</td>
|
|
||||||
<td>{workflow.author.authorId}</td>
|
|
||||||
<td>{workflow.worktype?.worktypeId ?? "-"}</td>
|
|
||||||
|
|
||||||
<td className={styles.txWsline}>
|
|
||||||
{workflow.typists.map((typist, i) => (
|
|
||||||
<>
|
|
||||||
{typist.typistName}
|
|
||||||
{i !== workflow.typists.length - 1 && <br />}
|
|
||||||
</>
|
|
||||||
))}
|
|
||||||
</td>
|
|
||||||
<td>{workflow.template?.fileName ?? "-"}</td>
|
|
||||||
</tr>
|
|
||||||
))}
|
|
||||||
</table>
|
|
||||||
{!isLoading &&
|
|
||||||
(workflows === undefined || workflows.length === 0) && (
|
|
||||||
<p
|
|
||||||
style={{
|
|
||||||
margin: "10px",
|
|
||||||
textAlign: "center",
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{t(getTranslationID("common.message.listEmpty"))}
|
|
||||||
</p>
|
|
||||||
)}
|
|
||||||
{isLoading && (
|
|
||||||
<img
|
|
||||||
src={progress_activit}
|
|
||||||
className={styles.icLoading}
|
|
||||||
alt="Loading"
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
<section className={styles.workflow}>
|
||||||
</div>
|
<div>
|
||||||
</main>
|
<ul className={`${styles.menuAction} ${styles.alignRight}`}>
|
||||||
<Footer />
|
<li className={styles.floatLeft}>
|
||||||
</div>
|
{/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */}
|
||||||
|
<a
|
||||||
|
className={`${styles.menuLink} ${styles.isActive}`}
|
||||||
|
onClick={() => {
|
||||||
|
setIsShowAddPopup(true);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
src={ruleAddImg}
|
||||||
|
alt="addRoutingRule"
|
||||||
|
className={styles.menuIcon}
|
||||||
|
/>
|
||||||
|
{t(getTranslationID("workflowPage.label.addRoutingRule"))}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
href="/workflow/template"
|
||||||
|
className={`${styles.menuLink} ${styles.isActive}`}
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
src={templateSettingImg}
|
||||||
|
alt="templateSetting"
|
||||||
|
className={styles.menuIcon}
|
||||||
|
/>
|
||||||
|
{t(
|
||||||
|
getTranslationID("workflowPage.label.templateSetting")
|
||||||
|
)}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
href="/workflow/worktype-id"
|
||||||
|
className={`${styles.menuLink} ${styles.isActive}`}
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
src={worktypeSettingImg}
|
||||||
|
alt="worktypeIdSetting"
|
||||||
|
className={styles.menuIcon}
|
||||||
|
/>
|
||||||
|
{t(
|
||||||
|
getTranslationID("workflowPage.label.worktypeIdSetting")
|
||||||
|
)}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
href="/workflow/typist-group"
|
||||||
|
className={`${styles.menuLink} ${styles.isActive}`}
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
src={groupSettingImg}
|
||||||
|
alt="typistGroupSetting"
|
||||||
|
className={styles.menuIcon}
|
||||||
|
/>
|
||||||
|
{t(
|
||||||
|
getTranslationID(
|
||||||
|
"workflowPage.label.typistGroupSetting"
|
||||||
|
)
|
||||||
|
)}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<table className={`${styles.table} ${styles.workflow}`}>
|
||||||
|
<tr className={styles.tableHeader}>
|
||||||
|
<th className={styles.clm0}>{/** empty th */}</th>
|
||||||
|
<th>
|
||||||
|
{t(getTranslationID("workflowPage.label.authorID"))}
|
||||||
|
</th>
|
||||||
|
<th>
|
||||||
|
{t(getTranslationID("workflowPage.label.worktype"))}
|
||||||
|
</th>
|
||||||
|
<th>
|
||||||
|
{t(
|
||||||
|
getTranslationID("workflowPage.label.transcriptionist")
|
||||||
|
)}
|
||||||
|
</th>
|
||||||
|
<th>
|
||||||
|
{t(getTranslationID("workflowPage.label.template"))}
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
{workflows?.map((workflow) => (
|
||||||
|
<tr key={workflow.id}>
|
||||||
|
<td className={styles.clm0}>
|
||||||
|
<ul className={styles.menuInTable}>
|
||||||
|
<li>
|
||||||
|
<a href="">
|
||||||
|
{t(
|
||||||
|
getTranslationID("workflowPage.label.editRule")
|
||||||
|
)}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="">
|
||||||
|
{t(getTranslationID("common.label.delete"))}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</td>
|
||||||
|
<td>{workflow.author.authorId}</td>
|
||||||
|
<td>{workflow.worktype?.worktypeId ?? "-"}</td>
|
||||||
|
|
||||||
|
<td className={styles.txWsline}>
|
||||||
|
{workflow.typists.map((typist, i) => (
|
||||||
|
<>
|
||||||
|
{typist.typistName}
|
||||||
|
{i !== workflow.typists.length - 1 && <br />}
|
||||||
|
</>
|
||||||
|
))}
|
||||||
|
</td>
|
||||||
|
<td>{workflow.template?.fileName ?? "-"}</td>
|
||||||
|
</tr>
|
||||||
|
))}
|
||||||
|
</table>
|
||||||
|
{!isLoading &&
|
||||||
|
(workflows === undefined || workflows.length === 0) && (
|
||||||
|
<p
|
||||||
|
style={{
|
||||||
|
margin: "10px",
|
||||||
|
textAlign: "center",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{t(getTranslationID("common.message.listEmpty"))}
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
|
{isLoading && (
|
||||||
|
<img
|
||||||
|
src={progress_activit}
|
||||||
|
className={styles.icLoading}
|
||||||
|
alt="Loading"
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
<Footer />
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user