wood/certimate
1
0
Fork 0
mirror of https://github.com/woodchen-ink/certimate.git synced 2025-07-19 09:51:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): responsive table

Browse Source
This commit is contained in:
Fu Diwei 2024-12-09 19:32:09 +08:00
parent be27789ea8
commit 7b85da901d
3 changed files with 13 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
ui/src/pages/accesses/AccessList.tsx
View File

@ -23,7 +23,7 @@ const AccessList = () => {
{
key: "$index",
align: "center",
title: "",
fixed: "left",
width: 50,
render: (_, __, index) => (page - 1) * pageSize + index + 1,
},
@ -36,11 +36,12 @@ const AccessList = () => {
{
key: "provider",
title: t("common.text.provider"),
ellipsis: true,
render: (_, record) => {
return (
<Space className="max-w-full" size={4}>
<Space className="max-w-full truncate" size={4}>
<Avatar src={accessProvidersMap.get(record.configType)?.icon} size="small" />
<Typography.Text>{t(accessProvidersMap.get(record.configType)?.name ?? "")}</Typography.Text>
<Typography.Text ellipsis>{t(accessProvidersMap.get(record.configType)?.name ?? "")}</Typography.Text>
</Space>
);
},
@ -156,8 +157,6 @@ const AccessList = () => {
});
};
// TODO: 响应式表格
return (
<>
{ModelContextHolder}
@ -199,6 +198,7 @@ const AccessList = () => {
},
}}
rowKey={(record) => record.id}
scroll={{ x: "max(100%, 960px)" }}
/>
</>
);

7
ui/src/pages/certificates/CertificateList.tsx
View File

@ -27,7 +27,7 @@ const CertificateList = () => {
{
key: "$index",
align: "center",
title: "",
fixed: "left",
width: 50,
render: (_, __, index) => (page - 1) * pageSize + index + 1,
},
@ -39,6 +39,7 @@ const CertificateList = () => {
{
key: "expiry",
title: t("certificate.props.expiry"),
ellipsis: true,
defaultFilteredValue: searchParams.has("state") ? [searchParams.get("state") as string] : undefined,
filterDropdown: ({ setSelectedKeys, confirm, clearFilters }) => {
const items: Required<MenuProps>["items"] = [
@ -107,6 +108,7 @@ const CertificateList = () => {
{
key: "source",
title: t("certificate.props.source"),
ellipsis: true,
render: (_, record) => {
const workflowId = record.workflow;
return workflowId ? (
@ -213,8 +215,6 @@ const CertificateList = () => {
setCurrentRecord(certificate);
};
// TODO: 响应式表格
return (
<>
{NotificationContextHolder}
@ -242,6 +242,7 @@ const CertificateList = () => {
},
}}
rowKey={(record) => record.id}
scroll={{ x: "max(100%, 960px)" }}
/>
<CertificateDetailDrawer

7
ui/src/pages/workflows/WorkflowList.tsx
View File

@ -43,13 +43,14 @@ const WorkflowList = () => {
{
key: "$index",
align: "center",
title: "",
fixed: "left",
width: 50,
render: (_, __, index) => (page - 1) * pageSize + index + 1,
},
{
key: "name",
title: t("common.text.name"),
ellipsis: true,
render: (_, record) => (
<Space className="max-w-full" direction="vertical" size={4}>
<Typography.Text ellipsis>{record.name}</Typography.Text>
@ -62,6 +63,7 @@ const WorkflowList = () => {
{
key: "type",
title: t("workflow.props.executionMethod"),
ellipsis: true,
render: (_, record) => {
const method = record.type;
if (!method) {
@ -279,8 +281,6 @@ const WorkflowList = () => {
navigate("/workflows/detail");
};
// TODO: 响应式表格
return (
<>
{ModelContextHolder}
@ -323,6 +323,7 @@ const WorkflowList = () => {
},
}}
rowKey={(record) => record.id}
scroll={{ x: "max(100%, 960px)" }}
/>
</>
);