133 lines
3.6 KiB
TypeScript
133 lines
3.6 KiB
TypeScript
import { Button, Space, Modal, FormInstance } from "antd";
|
|
import { inject, observer } from "mobx-react";
|
|
import BTable from "@/components/b_table";
|
|
import { useEffect, useState } from "react";
|
|
import { Store } from "antd/lib/form/interface";
|
|
import SimpleForm from "@/components/form/simple_form";
|
|
import React from "react";
|
|
import { columns, defaultConfig } from "./political_column";
|
|
|
|
const PoliticalStudy = (props: Store) => {
|
|
const { politicalStudyStore } = props;
|
|
const [isModalOpen, setIsModalOpen] = useState<boolean>(false);
|
|
const [projectConfig, setProjectConfig] = useState<any>([]);
|
|
const formRef = React.useRef<FormInstance>(null);
|
|
const [record, setRecord] = useState<any>(null);
|
|
useEffect(() => {
|
|
politicalStudyStore.getlist();
|
|
setProjectConfig(defaultConfig);
|
|
}, [politicalStudyStore]);
|
|
const column_widget = (any, record) => {
|
|
return (
|
|
<Space wrap>
|
|
<Button
|
|
type="dashed"
|
|
size="small"
|
|
onClick={() => {
|
|
edit(record);
|
|
}}
|
|
>
|
|
编辑
|
|
</Button>
|
|
|
|
<Button
|
|
type="dashed"
|
|
danger
|
|
size="small"
|
|
onClick={() => {
|
|
politicalStudyStore.deleteItem(record.id);
|
|
}}
|
|
>
|
|
删除
|
|
</Button>
|
|
</Space>
|
|
);
|
|
};
|
|
const edit = (record) => {
|
|
setIsModalOpen(true);
|
|
setRecord(record);
|
|
};
|
|
const onFinish = (values: any) => {
|
|
let data = {
|
|
...values,
|
|
score: Number(values.score),
|
|
};
|
|
if (values.file_url) {
|
|
data.file_url = values.file_url[0].url;
|
|
}
|
|
if (!record?.id) {
|
|
politicalStudyStore.add(data);
|
|
} else {
|
|
politicalStudyStore.putItem(record.id, data);
|
|
}
|
|
setIsModalOpen(false);
|
|
};
|
|
|
|
const onFinishFailed = () => {};
|
|
return (
|
|
<div className="contentBox">
|
|
<Space direction="vertical" size="middle" style={{ display: "flex" }}>
|
|
<Space direction="horizontal" size={"middle"}>
|
|
<Button
|
|
type="default"
|
|
onClick={() => {
|
|
setRecord(null);
|
|
setProjectConfig(defaultConfig);
|
|
setIsModalOpen(true);
|
|
}}
|
|
>
|
|
发布文章
|
|
</Button>
|
|
</Space>
|
|
<BTable
|
|
store={politicalStudyStore}
|
|
columns={[
|
|
...columns,
|
|
{
|
|
title: "操作",
|
|
dataIndex: "id",
|
|
ellipsis: {
|
|
showTitle: false,
|
|
},
|
|
render: (any, record) => column_widget(any, record),
|
|
},
|
|
]}
|
|
dataSource={politicalStudyStore.list}
|
|
/>
|
|
<Modal
|
|
title={!record?.id ? "添加文章" : "编辑文章"}
|
|
width={1200}
|
|
open={isModalOpen}
|
|
afterClose={() => formRef.current?.resetFields()}
|
|
onOk={() => formRef.current?.submit()}
|
|
okText="确定"
|
|
cancelText="取消"
|
|
onCancel={() => {
|
|
setIsModalOpen(false);
|
|
}}
|
|
>
|
|
<SimpleForm
|
|
formRef={formRef}
|
|
createCallback={() => {
|
|
if (record?.id) {
|
|
formRef.current?.setFieldsValue(record);
|
|
} else {
|
|
formRef.current?.setFieldsValue(null);
|
|
}
|
|
}}
|
|
formName="card_basic"
|
|
colProps={25}
|
|
subBtnName="提交"
|
|
formDatas={projectConfig}
|
|
onFinish={onFinish}
|
|
initialValues={true}
|
|
onFinishFailed={onFinishFailed}
|
|
/>
|
|
</Modal>
|
|
</Space>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default inject("politicalStudyStore")(observer(PoliticalStudy));
|