ui-soxo-bootstrap-core 2.6.5 → 2.6.6

package/core/models/pages/components/page-details/page-details.js

@@ -1,210 +1,210 @@
-/**
- * Generic List accepts an array of fields to update any resource
- */
-
- import React, { useState, useRef, useEffect, useContext } from 'react';
-
- import { Link, match, useParams } from 'react-router-dom';
- 
- import { Typography, Modal, Select, Space, Switch, Popconfirm, message, DatePicker, Skeleton, Tabs } from 'antd';
- 
- import { Table, Card, Button } from './../../../../lib';
- 
- import { ReloadOutlined, OrderedListOutlined, PicCenterOutlined, DeleteOutlined } from '@ant-design/icons';
-  
- const { Title } = Typography;
- 
- const { TabPane } = Tabs;
- 
- 
- const PageDetails = ({ history, model, columns, relativeAdd = false, match }) => {
- 
-     const actions = [];
- 
-     // const { params } = match;
- 
-     match = useParams();
- 
-     const id = match.id;
- 
-     console.log(model);
- 
-     const [loading, setLoading] = useState(false);
- 
-     const [record, setRecords] = useState([]);
- 
-     const [pagedetail, setPageDetail] = useState<PageDetail>({});
- 
-     const [view, setView] = useState(false);
- 
-     const [visible, setVisible] = useState(false);
-
-    const [single, setSingle] = useState({});
-
- 
-     useEffect(() => {
- 
-         loadData();
-     }, []);
- 
- 
-     const loadData = () => {
-         setLoading(true);
- 
-         getRecords();
-     };
- 
- 
-     const getRecords = () => {
-         setLoading(true);
- 
-         model
-             .getDetail({ id }).then((result) => {
-
-                 if (result) {
- 
-                    setPageDetail(result)
-
-                    setLoading(false);
-
-                 }
-             })
-     };
- 
- 
-     function changeView(result) {
-         setView(result);
-     }
- 
-     function closeModal() {
-         setVisible(false);
-     }
- 
-     function refresh() {
-         loadData();
-     }
- 
-     return (
- 
-        <div className="generic-list">
-        {/* Table Header */}
-        <div className="table-header">
-            <div className="table-title">
-                <Title level={4}>{model.name}</Title>
-
-                {/* <p>{loading ? 'Loading records' : `${record.length} records`}</p> */}
-            </div>
-
-            <div className="table-bar">
-                {/* Table Filters */}
-                <div className="table-filters">
-                    <Space direction="vertical" size={12}></Space>
-                </div>
-                {/* Table Filters Ends */}
-
-                <div className="table-actions">
-                    <div className="button-container">
-                        <Space size="small">
-                            <Button onClick={getRecords} size={'small'}>
-                                <ReloadOutlined />
-                            </Button>
-
-                            <Switch
-                                defaultChecked
-                                onChange={changeView}
-                                checked={view}
-                                checkedChildren={<OrderedListOutlined />}
-                                unCheckedChildren={<PicCenterOutlined />}
-                            />
-
-                            {/* Edit */}
-                        {!model.ModalAddComponent ? null : (
-                            <Button type="dashed" onClick={() => {
-
-                                setSingle({ ...pagedetail });
-
-                                setVisible(true);
-                            }}>
-                                Edit
-                            </Button>
-                        )}
-                        {/* Edit Ends */}
-
-                        </Space>
-                    </div>
-                </div>
-            </div>
-        </div>
-
-        {/* Table Header Ends */}
-
-        {loading ? (
-            <Skeleton/>
-        ) : (
-            <>
-                <div className="card">
-            <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'flex-start' }}>
-                <div style={{ display: 'flex', flexDirection: 'column', padding: '3%' }}>
-                    <table>
-
-                        <tr>
-                            <td>
-                                <p>Name :</p>
-                            </td>
-                            <td>
-                                <p>{pagedetail.name}</p>
-                            </td>
-                        </tr>
-                        <tr>
-                            <td>
-                                <p>Code :</p>
-                            </td>
-                            <td>
-                                <p>{pagedetail.code}</p>
-                            </td>
-                        </tr>
-
-                        <tr>
-                            <td>
-                                <p>Description :</p>
-                            </td>
-                            <td>
-                                <p>{pagedetail.description}</p>
-                            </td>
-                        </tr>
-                    </table>
-                </div>
-            </div>
-
-        </div>
-            </>
-        )}
-
-        {/* Add Modal */}
-        <Modal destroyOnClose confirmLoading={loading} visible={visible} onCancel={closeModal} footer={null}>
-            <model.ModalAddComponent
-            match={match}
-            model={model}
-                formContent={single}
-                callback={() => {
-                    closeModal();
-                }}
-            />
-            {/* <FormCreator formContent={{ [model]: {} }} modelIndex="requestId" model={model} onSubmit={createRecord} config={step} /> */}
-        </Modal>
-        
- 
-        </div>
- 
- 
-     );
- }
- 
- function CardList({ model, data, url, ...props }) {
-     return data.map((record, index) => {
-         return <model.Card record={record} model={model} index={index} key={index} {...record} {...props} />;
-     });
- }
- export default PageDetails;
- 
+/**
+ * Generic List accepts an array of fields to update any resource
+ */
+
+ import React, { useState, useRef, useEffect, useContext } from 'react';
+
+ import { Link, match, useParams } from 'react-router-dom';
+ 
+ import { Typography, Modal, Select, Space, Switch, Popconfirm, message, DatePicker, Skeleton, Tabs } from 'antd';
+ 
+ import { Table, Card, Button } from './../../../../lib';
+ 
+ import { ReloadOutlined, OrderedListOutlined, PicCenterOutlined, DeleteOutlined } from '@ant-design/icons';
+  
+ const { Title } = Typography;
+ 
+ const { TabPane } = Tabs;
+ 
+ 
+ const PageDetails = ({ history, model, columns, relativeAdd = false, match }) => {
+ 
+     const actions = [];
+ 
+     // const { params } = match;
+ 
+     match = useParams();
+ 
+     const id = match.id;
+ 
+     console.log(model);
+ 
+     const [loading, setLoading] = useState(false);
+ 
+     const [record, setRecords] = useState([]);
+ 
+     const [pagedetail, setPageDetail] = useState<PageDetail>({});
+ 
+     const [view, setView] = useState(false);
+ 
+     const [visible, setVisible] = useState(false);
+
+    const [single, setSingle] = useState({});
+
+ 
+     useEffect(() => {
+ 
+         loadData();
+     }, []);
+ 
+ 
+     const loadData = () => {
+         setLoading(true);
+ 
+         getRecords();
+     };
+ 
+ 
+     const getRecords = () => {
+         setLoading(true);
+ 
+         model
+             .getDetail({ id }).then((result) => {
+
+                 if (result) {
+ 
+                    setPageDetail(result)
+
+                    setLoading(false);
+
+                 }
+             })
+     };
+ 
+ 
+     function changeView(result) {
+         setView(result);
+     }
+ 
+     function closeModal() {
+         setVisible(false);
+     }
+ 
+     function refresh() {
+         loadData();
+     }
+ 
+     return (
+ 
+        <div className="generic-list">
+        {/* Table Header */}
+        <div className="table-header">
+            <div className="table-title">
+                <Title level={4}>{model.name}</Title>
+
+                {/* <p>{loading ? 'Loading records' : `${record.length} records`}</p> */}
+            </div>
+
+            <div className="table-bar">
+                {/* Table Filters */}
+                <div className="table-filters">
+                    <Space direction="vertical" size={12}></Space>
+                </div>
+                {/* Table Filters Ends */}
+
+                <div className="table-actions">
+                    <div className="button-container">
+                        <Space size="small">
+                            <Button onClick={getRecords} size={'small'}>
+                                <ReloadOutlined />
+                            </Button>
+
+                            <Switch
+                                defaultChecked
+                                onChange={changeView}
+                                checked={view}
+                                checkedChildren={<OrderedListOutlined />}
+                                unCheckedChildren={<PicCenterOutlined />}
+                            />
+
+                            {/* Edit */}
+                        {!model.ModalAddComponent ? null : (
+                            <Button type="dashed" onClick={() => {
+
+                                setSingle({ ...pagedetail });
+
+                                setVisible(true);
+                            }}>
+                                Edit
+                            </Button>
+                        )}
+                        {/* Edit Ends */}
+
+                        </Space>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        {/* Table Header Ends */}
+
+        {loading ? (
+            <Skeleton/>
+        ) : (
+            <>
+                <div className="card">
+            <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'flex-start' }}>
+                <div style={{ display: 'flex', flexDirection: 'column', padding: '3%' }}>
+                    <table>
+
+                        <tr>
+                            <td>
+                                <p>Name :</p>
+                            </td>
+                            <td>
+                                <p>{pagedetail.name}</p>
+                            </td>
+                        </tr>
+                        <tr>
+                            <td>
+                                <p>Code :</p>
+                            </td>
+                            <td>
+                                <p>{pagedetail.code}</p>
+                            </td>
+                        </tr>
+
+                        <tr>
+                            <td>
+                                <p>Description :</p>
+                            </td>
+                            <td>
+                                <p>{pagedetail.description}</p>
+                            </td>
+                        </tr>
+                    </table>
+                </div>
+            </div>
+
+        </div>
+            </>
+        )}
+
+        {/* Add Modal */}
+        <Modal destroyOnClose confirmLoading={loading} visible={visible} onCancel={closeModal} footer={null}>
+            <model.ModalAddComponent
+            match={match}
+            model={model}
+                formContent={single}
+                callback={() => {
+                    closeModal();
+                }}
+            />
+            {/* <FormCreator formContent={{ [model]: {} }} modelIndex="requestId" model={model} onSubmit={createRecord} config={step} /> */}
+        </Modal>
+        
+ 
+        </div>
+ 
+ 
+     );
+ }
+ 
+ function CardList({ model, data, url, ...props }) {
+     return data.map((record, index) => {
+         return <model.Card record={record} model={model} index={index} key={index} {...record} {...props} />;
+     });
+ }
+ export default PageDetails;
+