Merge pull request #1025 from visuddhinanda/agile

create anthology index table

dashboard/src/locales/zh-Hans/article/index.ts

@@ -1,5 +1,6 @@
 const items = {
-  "article.lable": "文章",
+	"article.lable": "文章",
+	"article.fields.article.count.label": "文章数量",
 };
 
 export default items;

dashboard/src/locales/zh-Hans/forms.ts

@@ -1,17 +1,19 @@
 const items = {
-  "forms.fields.email.label": "电子邮箱",
-  "forms.fields.password.label": "密码",
-  "forms.fields.id.label": "ID",
-  "forms.fields.message.label": "消息",
-  "forms.fields.created-at.label": "创建时间",
-  "forms.fields.update-at.label": "创建时间",
-  "forms.fields.lang.label": "语言",
-  "forms.create.message.no.lang": "请选择一种语言",
-  "forms.fields.title.label": "标题",
-  "forms.create.message.no.title": "请输入标题",
-  "forms.fields.subtitle.label": "副标题",
-  "forms.fields.summary.label": "简介",
-  "forms.fields.content.label": "内容",
+	"forms.fields.email.label": "电子邮箱",
+	"forms.fields.password.label": "密码",
+	"forms.fields.id.label": "ID",
+	"forms.fields.message.label": "消息",
+	"forms.fields.created-at.label": "创建时间",
+	"forms.fields.update-at.label": "创建时间",
+	"forms.fields.lang.label": "语言",
+	"forms.create.message.no.lang": "请选择一种语言",
+	"forms.fields.title.label": "标题",
+	"forms.create.message.no.title": "请输入标题",
+	"forms.fields.subtitle.label": "副标题",
+	"forms.fields.summary.label": "简介",
+	"forms.fields.content.label": "内容",
+	"forms.fields.tag.label": "标签",
+	"forms.fields.power.label": "权限",
 };
 
 export default items;

dashboard/src/locales/zh-Hans/index.ts

@@ -6,43 +6,45 @@ import channel from "./channel";
 import dict from "./dict";
 import term from "./term";
 import group from "./group";
+import article from "./article";
 
 const items = {
-  "flashes.success": "操作成功",
-  "columns.library.title": "藏经阁",
-  "columns.library.community.title": "社区",
-  "columns.library.palicanon.title": "圣典",
-  "columns.library.course.title": "课程",
-  "columns.library.term.title": "术语百科",
-  "columns.library.dict.title": "字典",
-  "columns.library.anthology.title": "文集",
-  "columns.library.help.title": "帮助",
-  "columns.library.more.title": "更多",
-  "columns.library.calendar.title": "佛历",
-  "columns.library.convertor.title": "巴利字符转换器",
-  "columns.library.palihandbook.title": "语法手册",
-  "columns.library.statistics.title": "单词统计",
-  "columns.studio.title": "译经楼",
-  "columns.studio.palicanon.title": "圣典",
-  "columns.studio.recent.title": "最近编辑",
-  "columns.studio.channel.title": "版本风格",
-  "columns.studio.group.title": "群组",
-  "columns.studio.userdict.title": "用户字典",
-  "columns.studio.term.title": "术语",
-  "columns.studio.article.title": "文章",
-  "columns.studio.anthology.title": "文集",
-  "columns.studio.analysis.title": "分析",
-  "columns.studio.collaboration.title": "协作",
-  "columns.studio.basic.title": "常用",
-  "columns.studio.advance.title": "高级",
-  ...buttons,
-  ...forms,
-  ...tables,
-  ...nut,
-  ...channel,
-  ...dict,
-  ...term,
-  ...group,
+	"flashes.success": "操作成功",
+	"columns.library.title": "藏经阁",
+	"columns.library.community.title": "社区",
+	"columns.library.palicanon.title": "圣典",
+	"columns.library.course.title": "课程",
+	"columns.library.term.title": "术语百科",
+	"columns.library.dict.title": "字典",
+	"columns.library.anthology.title": "文集",
+	"columns.library.help.title": "帮助",
+	"columns.library.more.title": "更多",
+	"columns.library.calendar.title": "佛历",
+	"columns.library.convertor.title": "巴利字符转换器",
+	"columns.library.palihandbook.title": "语法手册",
+	"columns.library.statistics.title": "单词统计",
+	"columns.studio.title": "译经楼",
+	"columns.studio.palicanon.title": "圣典",
+	"columns.studio.recent.title": "最近编辑",
+	"columns.studio.channel.title": "版本风格",
+	"columns.studio.group.title": "群组",
+	"columns.studio.userdict.title": "用户字典",
+	"columns.studio.term.title": "术语",
+	"columns.studio.article.title": "文章",
+	"columns.studio.anthology.title": "文集",
+	"columns.studio.analysis.title": "分析",
+	"columns.studio.collaboration.title": "协作",
+	"columns.studio.basic.title": "常用",
+	"columns.studio.advance.title": "高级",
+	...buttons,
+	...forms,
+	...tables,
+	...nut,
+	...channel,
+	...dict,
+	...term,
+	...group,
+	...article,
 };
 
 export default items;

dashboard/src/pages/studio/anthology/index.tsx

@@ -1,33 +1,171 @@
-import { useParams ,Link} from "react-router-dom";
+import { useParams } from "react-router-dom";
+import { ProTable } from "@ant-design/pro-components";
 import { useIntl } from "react-intl";
-import { Layout,Space } from "antd";
+import { Link } from "react-router-dom";
+import { Button, Layout, Space, Table } from "antd";
+import { EllipsisOutlined } from "@ant-design/icons";
+import { PlusOutlined } from "@ant-design/icons";
+
 import HeadBar from "../../../components/studio/HeadBar";
 import LeftSider from "../../../components/studio/LeftSider";
 import Footer from "../../../components/studio/Footer";
 
-const {  Content } = Layout;
+const { Content } = Layout;
+
+interface IItem {
+	id: number;
+	title: string;
+	subtitle: string;
+	tag: string;
+	articles: number;
+	createdAt: number;
+}
 
 const Widget = () => {
-	const intl = useIntl();//i18n
-	const { studioname } = useParams();//url 参数
-	const linkEdit = `/studio/${studioname}/anthology/edit/12345`;
-  return (
-    <Layout>
-		<HeadBar/>
+	const intl = useIntl();
+	const { studioname } = useParams();
+	return (
 		<Layout>
-			<LeftSider selectedKeys="anthology"/>
-			<Content>
-				<h2>studio/{studioname}/{intl.formatMessage({ id: "columns.studio.article.title" })}/文集列表</h2>
-				<div>
-					<Space>
-						<Link to={linkEdit}> anthology edit </Link>
-					</Space>
-				</div>
-	  		</Content>
+			<HeadBar />
+			<Layout>
+				<LeftSider selectedKeys="anthology" />
+				<Content>
+					<Layout>{studioname}</Layout>
+					<ProTable<IItem>
+						columns={[
+							{
+								title: intl.formatMessage({ id: "dict.fields.sn.label" }),
+								dataIndex: "id",
+								key: "id",
+								width: 80,
+								search: false,
+							},
+							{
+								title: intl.formatMessage({ id: "forms.fields.title.label" }),
+								dataIndex: "title",
+								key: "title",
+								tip: "过长会自动收缩",
+								ellipsis: true,
+								render: (text, row, index, action) => {
+									return <Link to="edit/12345">{row.title}</Link>;
+								},
+							},
+							{
+								title: intl.formatMessage({ id: "forms.fields.subtitle.label" }),
+								dataIndex: "subtitle",
+								key: "type",
+								search: false,
+							},
+							{
+								title: intl.formatMessage({ id: "forms.fields.power.label" }),
+								dataIndex: "tag",
+								key: "tag",
+								search: false,
+								filters: true,
+								onFilter: true,
+								valueEnum: {
+									all: { text: "全部", status: "Default" },
+									30: { text: "拥有者", status: "Success" },
+									20: { text: "可编辑", status: "Processing" },
+									10: { text: "只读", status: "Default" },
+								},
+							},
+							{
+								title: intl.formatMessage({ id: "article.fields.article.count.label" }),
+								dataIndex: "articles",
+								key: "articles",
+								search: false,
+								sorter: (a, b) => a.articles - b.articles,
+							},
+							{
+								title: intl.formatMessage({ id: "forms.fields.created-at.label" }),
+								key: "created-at",
+								width: 200,
+								search: false,
+								dataIndex: "createdAt",
+								valueType: "date",
+								sorter: (a, b) => a.createdAt - b.createdAt,
+							},
+							{
+								title: "操作",
+								key: "option",
+								width: 120,
+								valueType: "option",
+								render: () => [
+									<Button key="link">编辑</Button>,
+									<Button key="more">
+										<EllipsisOutlined />
+									</Button>,
+								],
+							},
+						]}
+						rowSelection={{
+							// 自定义选择项参考: https://ant.design/components/table-cn/#components-table-demo-row-selection-custom
+							// 注释该行则默认不显示下拉选项
+							selections: [Table.SELECTION_ALL, Table.SELECTION_INVERT],
+						}}
+						tableAlertRender={({ selectedRowKeys, selectedRows, onCleanSelected }) => (
+							<Space size={24}>
+								<span>
+									已选 {selectedRowKeys.length} 项
+									<Button type="link" style={{ marginInlineStart: 8 }} onClick={onCleanSelected}>
+										取消选择
+									</Button>
+								</span>
+							</Space>
+						)}
+						tableAlertOptionRender={() => {
+							return (
+								<Space size={16}>
+									<Button type="link">批量删除</Button>
+								</Space>
+							);
+						}}
+						request={async (params = {}, sorter, filter) => {
+							// TODO
+							console.log(params, sorter, filter);
+
+							const size = params.pageSize || 20;
+							return {
+								total: 1 << 12,
+								success: true,
+								data: Array.from(Array(size).keys()).map((x) => {
+									const id = ((params.current || 1) - 1) * size + x + 1;
+
+									var it: IItem = {
+										id,
+										title: `title ${id}`,
+										subtitle: `subtitle ${id}`,
+										tag: ((Math.floor(Math.random() * 3) + 1) * 10).toString(),
+										articles: Math.floor(Math.random() * 40),
+										createdAt: Date.now() - Math.floor(Math.random() * 2000000000),
+									};
+									return it;
+								}),
+							};
+						}}
+						rowKey="id"
+						bordered
+						pagination={{
+							showQuickJumper: true,
+							showSizeChanger: true,
+						}}
+						search={false}
+						options={{
+							search: true,
+						}}
+						headerTitle={intl.formatMessage({ id: "dict" })}
+						toolBarRender={() => [
+							<Button key="button" icon={<PlusOutlined />} type="primary">
+								新建
+							</Button>,
+						]}
+					/>
+				</Content>
+			</Layout>
+			<Footer />
 		</Layout>
-      <Footer/>
-    </Layout>
-  );
+	);
 };
 
 export default Widget;

dashboard/src/pages/studio/dict/index.tsx

@@ -178,6 +178,9 @@ const Widget = () => {
 							showQuickJumper: true,
 							showSizeChanger: true,
 						}}
+						search={{
+							filterType: "light",
+						}}
 						headerTitle={intl.formatMessage({ id: "dict" })}
 						toolBarRender={() => [
 							<Button key="button" icon={<PlusOutlined />} type="primary">

dashboard/src/pages/studio/index.tsx

@@ -12,7 +12,9 @@ const Widget = () => {
 		<div>
 			<HeadBar />
 			<LeftSider />
-			<h2>studio/{studioname}/首页</h2>
+			<h2>
+				{intl.formatMessage({ id: "columns.studio.title" })}/{studioname}/首页
+			</h2>
 			<div>
 				<Space>
 					<Link to=""> </Link>