增加分区配置

src/model/datamodel.js

@@ -86,8 +86,16 @@ export function* modelCopy(payload) {
   return yield call(datamodelerService.modelCopy, payload);
 }
 
-export function* getSupportedPartitionTypes() {
-  return yield call(datamodelerService.getSupportedPartitionTypes);
+export function* getSupportedPartitionTypes(payload) {
+  return yield call(datamodelerService.getSupportedPartitionTypes, payload);
+}
+
+export function* savePartitionType(payload) {
+  return yield call(datamodelerService.savePartitionType, payload);
+}
+
+export function* deletePartitionType(payload) {
+  return yield call(datamodelerService.deletePartitionType, payload);
 }
 
 export function* extractExcelContent(payload) {

src/service/datamodeler.js

@@ -43,8 +43,16 @@ export function modelCopy(payload) {
   return GetJSON("/datamodeler/easyDataModelerCURD/copy", payload);
 }
 
-export function getSupportedPartitionTypes() {
-  return GetJSON("/datamodeler/easyDataModelerCURD/getSupportedPartitionTypes");
+export function getSupportedPartitionTypes(payload) {
+  return GetJSON("/datamodeler/easyDataModelerCURD/getSupportedPartitionTypes", payload);
+}
+
+export function savePartitionType(payload) {
+  return PostJSON("/datamodeler/easyDataModelerCURD/savePartitionType", payload);
+}
+
+export function deletePartitionType(payload) {
+  return PostJSON("/datamodeler/easyDataModelerCURD/deletePartitionType", payload);
 }
 
 export function extractExcelContent(payload) {

src/view/Manage/Model/Component/ImportAction.jsx

@@ -259,6 +259,9 @@ const ImportAction = (props) => {
   const getSupportedPartitionTypes = () => {
     dispatch({
       type: 'datamodel.getSupportedPartitionTypes',
+      payload: {
+        excludeBuiltin: false
+      },
       callback: data => {
         setSupportedPartitionTypes(data||[]);
       }

src/view/Manage/ModelConfig/Component/PartitionCURD.jsx

+import React, { useEffect, useState } from 'react';
+import { Table, Button, Tooltip, Modal, Divider } from 'antd';
+
+import { Action, TemplateId } from '../../../../util/constant';
+import { dispatch } from '../../../../model';
+import { showMessage } from '../../../../util';
+import UpdatePartitionModal from './UpdatePartitionModal';
+
+const PartitionCURD = (props) => {
+
+  const [ partitions, setPartitions ] = useState([]);
+  const [ loading, setLoading ] = useState(false);
+
+  const [ actionData, setActionData ] = useState({ action: '', updataPartitionModalVisible: false, item: null });
+
+  const { action, updataPartitionModalVisible, item } = actionData;
+
+  const [modal, contextHolder] = Modal.useModal();
+
+  useEffect(() => {
+
+    getPartitions();
+
+  }, [])
+
+  const columns = [
+    {
+      title: '序号',
+      dataIndex: 'key',
+      editable: false,
+      render: (text, record, index) => {
+        return (index+1).toString();
+      },
+      width: 60,
+    },
+    {
+      title: '分区名称',
+      dataIndex: 'name',
+      width: 180,
+      ellipsis: true,
+      render: (text, _, __) => {
+        return (
+          <Tooltip title={text||''}>
+            <span>{text||''}</span>
+          </Tooltip>
+        )
+      }
+    },
+    {
+      title: '分区中文名称',
+      dataIndex: 'cnName',
+      width: 180,
+      ellipsis: true,
+      render: (text, _, __) => {
+        return (
+          <Tooltip title={text||''}>
+            <span>{text||''}</span>
+          </Tooltip>
+        )
+      }
+    },
+    {
+      title: '定义',
+      dataIndex: 'definition',
+      width: 180,
+      ellipsis: true,
+      render: (text, _, __) => {
+        return (
+          <Tooltip title={text||''}>
+            <span>{text||''}</span>
+          </Tooltip>
+        )
+      }
+    },
+    {
+      title: '描述',
+      dataIndex: 'remark',
+      width: 180,
+      ellipsis: true,
+      render: (text, _, __) => {
+        return (
+          <Tooltip title={text||''}>
+            <span>{text||''}</span>
+          </Tooltip>
+        )
+      }
+    },
+    {
+      title: '操作',
+      key: 'action',
+      width: 120,
+
+      render: (text,record) => {
+        return (  
+          <div style={{ display: 'flex', alignItems: 'center'  }}>
+            <Button 
+              type='link'
+              size='small'
+              onClick={() => { editItem(record); }}
+              style={{ padding: 0 }}
+            >
+            编辑
+            </Button>
+            <div style={{ margin: '0 5px' }}>
+              <Divider type='vertical' />
+            </div>
+            <Button
+              type='link'
+              size='small'
+              onClick={() => { deleteItem(record); }}
+              style={{ padding: 0 }}
+            >
+            删除
+            </Button>
+          </div>
+        )
+      }
+    }
+  ];
+
+  const getPartitions = () => {
+    setLoading(true);
+    dispatch({
+      type: 'datamodel.getSupportedPartitionTypes',
+      payload: {
+        excludeBuiltin: true
+      },
+      callback: data => {
+        setPartitions(data||[]);
+        setLoading(false);
+      },
+      error: () => {
+        setLoading(false);
+      }
+    })
+  }
+
+  const editItem = (record) => {
+    setActionData({...actionData, ...{action: 'edit', updataPartitionModalVisible: true, item: record }});
+  }
+
+  const deleteItem = (record) => {
+    modal.confirm({
+      title: '提示!',
+      content: '您确定要删除该分区吗?',
+      onOk: () => {
+        dispatch({
+          type: 'datamodel.deletePartitionType',
+          payload: {
+            params: {
+              id: record.id
+            }
+          },
+          callback: () => {
+            showMessage('success', '模版分区成功');
+            getPartitions();
+          }
+        })
+      }
+    });
+  }
+
+  const onAddClick = () => {
+    setActionData({...actionData, ...{action: 'add', updataPartitionModalVisible: true }});
+  }
+
+  const onUpdatePartitionModalCancel = (refresh = false) => {
+    setActionData({...actionData, updataPartitionModalVisible: false} );
+
+    refresh && getPartitions();
+  }
+
+  return (
+    <div>
+      <div className='d-flex mb-3' style={{ alignItems: 'center' }}>
+        <Button 
+          onClick={onAddClick} 
+        >
+        新建
+        </Button>
+      </div>
+      <Table
+        loading={loading}
+        columns={columns} 
+        rowKey={'id'}
+        dataSource={partitions||[]}
+        pagination={false} 
+        sticky
+      />
+      <UpdatePartitionModal 
+        visible={updataPartitionModalVisible}
+        action={action}
+        item={item}
+        onCancel={onUpdatePartitionModalCancel}
+      />
+    { contextHolder }
+    </div>
+  );
+}
+
+export default PartitionCURD;
\ No newline at end of file

src/view/Manage/ModelConfig/Component/UpdatePartitionModal.jsx

+import React, { useEffect, useState } from 'react';
+import { Modal, Form, Input } from 'antd';
+
+import { dispatch } from '../../../../model';
+import { showNotifaction } from '../../../../util';
+
+const UpdatePartitionModal = (props) => {
+  const { visible, onCancel, item, action = 'add' } = props;
+
+  const [ form ] = Form.useForm();
+  const [ confirmLoading, setConfirmLoading ] = useState(false);
+
+  const formItemLayout = {
+    labelCol: {
+      xs: { span: 24 },
+      sm: { span: 4 },
+    },
+    wrapperCol: {
+      xs: { span: 24 },
+      sm: { span: 20 },
+    },
+  };
+
+  useEffect(() => {
+
+    if (visible) {
+      if (action !== 'add') {
+        form.setFieldsValue({ name: item?.name||'', cnName: item?.cnName||'', definition: item?.definition||'', remark: item?.remark||'' });
+      }
+    }
+
+  }, [visible])
+
+  const handleOk = async () => {
+
+    try {
+      const values = await form.validateFields();
+
+      let newItem = null;
+      if (action === 'add') {
+        newItem = {...values};
+      } else {
+        newItem = {...item, ...values};
+      }
+      
+      setConfirmLoading(true);
+      dispatch({
+        type: 'datamodel.savePartitionType',
+        payload: {
+          data: newItem
+        },
+        callback: data => {
+          setConfirmLoading(false);
+          reset();
+          onCancel && onCancel(true);
+        },
+        error: () => {
+          setConfirmLoading(false);
+        }
+      })
+
+    } catch (errInfo) {
+
+    }
+  }
+
+  const reset = () => {
+    setConfirmLoading(false);
+    form.resetFields();
+  }
+
+  return (
+    <Modal 
+      forceRender
+      visible={visible}
+      title={action==='add'?'新增分区':'编辑分区'}
+      width={520}
+      confirmLoading={confirmLoading}
+      onCancel={() => {
+        reset();
+        onCancel && onCancel();
+      }}
+      onOk={handleOk}
+    >
+    <Form 
+      {...formItemLayout}
+      form={form}
+    >
+      <Form.Item 
+        label="名称" 
+        name="name" 
+        rules={[{ required: true, message: '请输入分区名称' }]}
+      >
+        <Input />
+      </Form.Item>
+      <Form.Item 
+        label="中文名称" 
+        name="cnName" 
+        rules={[{ required: true, message: '请输入分区中文名称' }]}
+      >
+        <Input />
+      </Form.Item>
+      <Form.Item 
+        label="定义" 
+        name="definition" 
+      >
+        <Input />
+      </Form.Item>
+      <Form.Item 
+        label="描述" 
+        name="remark" 
+      >
+        <Input.TextArea row={4} />
+      </Form.Item>
+    </Form>
+    </Modal>
+  );
+}
+
+export default UpdatePartitionModal;
\ No newline at end of file

src/view/Manage/ModelConfig/index.jsx

@@ -4,6 +4,7 @@ import { Tabs } from 'antd';
 import WordTemplate from './Component/WordTemplate';
 import TemplateCURD from './Component/TemplateCURD';
 import ConstraintDetail from './Component/ConstraintDetail';
+import PartitionCURD from './Component/PartitionCURD';
 
 import './index.less';
 
@@ -28,6 +29,9 @@ const ModelConfig = () => {
         <TabPane tab='规范配置' key='3'>
           <ConstraintDetail />
         </TabPane>
+        <TabPane tab='分区配置' key='4'>
+          <PartitionCURD />
+        </TabPane>
       </Tabs>
     </div>
   )