ほかブランチのマージで消えた実装をもとに戻す
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 Footer from "components/footer";
|
||||
import styles from "styles/app.module.scss";
|
||||
@ -14,10 +14,13 @@ import { listWorkflowAsync } from "features/workflow/operations";
|
||||
import { selectIsLoading, selectWorkflows } from "features/workflow";
|
||||
import progress_activit from "assets/images/progress_activit.svg";
|
||||
import { getTranslationID } from "translation";
|
||||
import { AddWorkflowPopup } from "./addworkflowPopup";
|
||||
|
||||
const WorkflowPage: React.FC = (): JSX.Element => {
|
||||
const dispatch: AppDispatch = useDispatch();
|
||||
const [t] = useTranslation();
|
||||
// 追加Popupの表示制御
|
||||
const [isShowAddPopup, setIsShowAddPopup] = useState<boolean>(false);
|
||||
const workflows = useSelector(selectWorkflows);
|
||||
const isLoading = useSelector(selectIsLoading);
|
||||
|
||||
@ -25,139 +28,167 @@ const WorkflowPage: React.FC = (): JSX.Element => {
|
||||
dispatch(listWorkflowAsync());
|
||||
}, [dispatch]);
|
||||
return (
|
||||
<div className={styles.wrap}>
|
||||
<Header userName="XXXXXX" />
|
||||
<UpdateTokenTimer />
|
||||
<main className={styles.main}>
|
||||
<div className="">
|
||||
<div className={styles.pageHeader}>
|
||||
<h1 className={styles.pageTitle}>
|
||||
{t(getTranslationID("workflowPage.label.title"))}
|
||||
</h1>
|
||||
</div>
|
||||
<section className={styles.workflow}>
|
||||
<div>
|
||||
<ul className={`${styles.menuAction} ${styles.alignRight}`}>
|
||||
<li className={styles.floatLeft}>
|
||||
<a className={`${styles.menuLink} ${styles.isActive}`}>
|
||||
<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"
|
||||
/>
|
||||
)}
|
||||
<>
|
||||
{isShowAddPopup && (
|
||||
<AddWorkflowPopup
|
||||
onClose={() => {
|
||||
setIsShowAddPopup(false);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
<div className={styles.wrap}>
|
||||
<Header userName="XXXXXX" />
|
||||
<UpdateTokenTimer />
|
||||
<main className={styles.main}>
|
||||
<div className="">
|
||||
<div className={styles.pageHeader}>
|
||||
<h1 className={styles.pageTitle}>
|
||||
{t(getTranslationID("workflowPage.label.title"))}
|
||||
</h1>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
<Footer />
|
||||
</div>
|
||||
<section className={styles.workflow}>
|
||||
<div>
|
||||
<ul className={`${styles.menuAction} ${styles.alignRight}`}>
|
||||
<li className={styles.floatLeft}>
|
||||
{/* 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