ui-soxo-bootstrap-core 2.4.24

package/core/lib/models/models/components/model-detail/model-detail.js

@@ -0,0 +1,137 @@
+/**
+ * Generic Detail accepts an array of fields to update any resource
+ */
+
+import React, { useState, useEffect } from 'react';
+
+import { Link } from 'react-router-dom';
+
+import { Typography, Button, Row, Skeleton, Tabs, Space, Tag } from 'antd';
+
+import { withRouter } from 'react-router-dom';
+
+import './model-detail.scss';
+
+import GenericList from './../../../../modules/generic/generic-list/generic-list';
+
+import { ReloadOutlined } from '@ant-design/icons';
+
+import { Columns } from '../../../../../lib/models';
+
+const { Title } = Typography;
+
+const { TabPane } = Tabs;
+
+/**
+ * Generic List
+ *
+ * @param {*} param0
+ */
+function ModelDetail({ match, model, columns: cols, schema = { custom_actions: [] }, disableEdit = schema.disableEdit }) {
+
+    const [record, setRecords] = useState([]);
+
+    const { params } = match;
+
+    console.log(params);
+
+    const [loading, setLoading] = useState(false);
+
+    useEffect(() => {
+        loadData();
+
+        console.log('hello');
+    }, []);
+
+    const loadData = () => {
+        setLoading(true);
+
+        getRecords(schema);
+    };
+
+    const getRecords = (schema) => {
+        // Get the model by queries
+        return model.getRecord(match.params.id, model).then((result) => {
+            setRecords(result);
+
+            setLoading(false);
+        });
+    };
+
+    function refresh() {
+        loadData();
+    }
+
+    return (
+        <section className="generic-list">
+            {/* Table Header */}
+            <div className="table-header">
+                <div className="table-title">
+                    <Title level={4}>{model.name}</Title>
+                </div>
+
+                <div className="table-actions">
+                    <div className="button-container">
+                        <Button onClick={refresh} type="secondary" size={'small'}>
+                            <ReloadOutlined />
+                        </Button>
+
+                        {disableEdit ? null : (
+                            <Space size="middle">
+                                <Button type="dashed">
+                                    <Link to={`/${model.name}/${match.params.id}/e/`}>Edit</Link>
+                                </Button>
+                            </Space>
+                        )}
+                    </div>
+                </div>
+            </div>
+
+            {/* Table Header Ends */}
+
+            {loading ? (
+                <Skeleton type="listing" />
+            ) : (
+                <>
+                    <div className="card">
+
+                        <div gutter={0} className="detail-wrapper">
+
+
+                            <div className="detail-element">
+                                <span>Name</span>
+                                <Row span={6}>
+                                    <h3>{record.name}</h3>
+                                </Row>
+                            </div>
+
+                            <div className="detail-element">
+                                <span>Description</span>
+                                <Row span={6}>
+                                    <h3>{record.description}</h3>
+                                </Row>
+                            </div>
+                        </div>
+                    </div>
+
+                    <Tabs>
+                        <TabPane tab="Columns" key="0">
+                            <GenericList
+                                index={'model_id'}
+                                model={Columns}
+                                additional_queries={[
+                                    {
+                                        field: 'model_id',
+                                        value: params.id,
+                                    },
+                                ]}
+                            />
+                        </TabPane>
+                    </Tabs>
+                </>
+            )}
+        </section>
+    );
+}
+
+export default withRouter(ModelDetail);

package/core/lib/models/models/components/models.js

@@ -0,0 +1,128 @@
+
+
+import { Link } from 'react-router-dom';
+
+import { Tag } from 'antd';
+
+
+import ModelDetail from './model-detail/model-detail';
+
+import FirebaseUtils from '../../../utils/firebase.utils';
+
+import { Base } from '../..';
+
+
+
+class Models extends Base {
+    constructor() {
+        super();
+
+        this.fields = [
+            {
+                field: 'name',
+                caption: 'Name',
+            },
+
+            {
+                field: 'description',
+                caption: 'Description',
+            },
+
+            {
+                field: 'path',
+                caption: 'Path',
+            },
+        ];
+
+        // this.columns = ;
+    }
+
+
+    /**
+     * Get the data from the table
+     */
+    getMethod(queries = []) {
+        // Get the records from firebase
+        return FirebaseUtils.getRecords(queries, this);
+    }
+
+    get getEndpoint() {
+        return 'models';
+    }
+
+    get path() {
+        return `models`;
+    }
+
+    get getName() {
+        return this.modelName + `s`;
+    }
+
+    get modelName() {
+        return `model`;
+    }
+
+    get columns() {
+        return [
+            {
+                field: 'name',
+                caption: 'Name',
+            },
+
+            {
+                field: 'description',
+                caption: 'Description',
+            },
+
+            {
+                field: 'path',
+                caption: 'Path',
+            },
+        ];
+    }
+
+    /**
+     * Get the data from the table
+     */
+    // get = (queries) => {
+
+    //     return this.getMethod(queries).then((result) => {
+
+    //         return Promise.all(result.collections.map(this.loadStaff)).then((result) => {
+
+    //             return { collections: result };
+
+    //         })
+    //     })
+    // }
+
+    // Attach the related staff with the object
+
+
+    /**
+     * Card Component for Staff
+     *
+     * @param {*} record
+     * @returns
+     */
+    Card = (record) => {
+        return (
+            <Link className="booking-card" to={`/models/${record['id']}`}>
+                <div className="card">
+                    <h2 className="">{record.name}</h2>
+
+                    <h3 className="title">{record.description}</h3>
+
+                    <p className="address">
+                        Created by {record.created_by}
+                        <Tag color="magenta">{record['Consultant Name']}</Tag>
+                    </p>
+                </div>
+            </Link>
+        );
+    };
+
+    DetailComponent = () => <ModelDetail model={this} />
+}
+
+export default Models;

package/core/lib/models/modules/modules.js

@@ -0,0 +1,204 @@
+
+import { Base } from './../';
+
+import { MenuRoles, Menus, Pages, Models } from './../';
+
+
+class Modules extends Base {
+
+    constructor() {
+        super();
+
+        this.fields = [
+            {
+                field: 'name',
+                caption: 'Name',
+            },
+
+            {
+                field: 'name',
+                caption: 'Name',
+            },
+
+            {
+                field: 'display_order',
+                caption: 'Display Order',
+            },
+        ];
+
+        // this.columns = ;
+    }
+
+    get getEndpoint() {
+        return 'modules';
+    }
+
+    get path() {
+        return `modules`;
+    }
+
+    get getName() {
+        return this.modelName + `s`;
+    }
+
+    get modelName() {
+        return `module`;
+    }
+
+    loadMenus = () => {
+        return this.get().then((result) => {
+            // console.log(result);
+
+            // return result;
+            return Promise.all(result.modules.map(this.loadDetail)).then((result) => {
+                // console.log(result);
+
+                return result;
+            });
+        });
+    };
+
+    /**
+     * Load all the related records of the module
+     * This should ideally be dependendent on the relationship of this model
+     * to pull out data in a generic way
+     *
+     * @param {*} item
+     * @returns
+     */
+    loadDetail = (item) => {
+        var queries = [
+            {
+                field: 'module_id',
+                value: item.id,
+            },
+        ];
+
+        // load the menus in the module
+        return Menus.get(queries)
+            .then((result) => {
+
+                console.log(result);
+
+                return {
+                    ...item,
+                    caption: item.name,
+                    menus: result.menus,
+                };
+            })
+            .then((result) => {
+                var menus = [];
+
+                // For each menu we check if the user has access
+                return Promise.all(
+                    result.menus.map((menu) => {
+                        return this.validateAccess(menu).then((response) => {
+                            if (response) {
+                                menus.push(response);
+                            }
+
+                            return response;
+                        });
+                    })
+                ).then(() => {
+                    // console.log(menus);
+
+                    return {
+                        ...result,
+                        menus: menus,
+                    };
+                });
+            })
+            .then((result) => {
+                return result;
+
+                // For Each Menu get the detail
+                // return Promise.all(result.menus.map(this.loadPageDetail)).then((response) => {
+                //     // console.log(response);
+
+                //     return {
+                //         ...result,
+                //         menus: response,
+                //     };
+                // });
+            }).catch((error) => {
+
+                console.log(error);
+            })
+        // .then((final) => {
+        //     console.log(final);
+
+        //     return {
+        //         ...final,
+        //     };
+        // });
+    };
+
+    /**
+     * Validate access for the user
+     */
+    validateAccess = (menu) => {
+
+        // Getting the user object
+        const user = this.getUser();
+
+        // return new Promise((resolve) => {
+        return MenuRoles.get([
+            {
+                field: 'menu_id',
+                value: menu.id,
+            },
+            {
+                field: 'role_id',
+                value: user.role.id,
+            },
+        ]).then((result) => {
+            // console.log(result);
+
+            if (result.menu_roles.length) {
+                return menu;
+            } else {
+                return false;
+            }
+        });
+        // });
+    };
+
+    /**
+     * Load the page detail of the menu
+     *
+     * @param {*} menu
+     * @returns
+     */
+    loadPageDetail = (menu) => {
+        // Get the page record
+        return Pages.getRecord(menu.page_id).then((response) => {
+            // Get the model record
+            return Models.getRecord(menu.model_id).then((model_response) => {
+                // Combine to form the total data
+                return {
+                    ...menu,
+                    caption: menu.name,
+                    page: response,
+                    model: model_response
+                };
+            });
+        });
+    };
+
+    get columns() {
+        return [
+            {
+                field: 'name',
+                caption: 'Name',
+            },
+            {
+                field: 'display_order',
+                caption: 'Display Order',
+            },
+        ];
+    }
+
+}
+
+export default Modules;

package/core/lib/models/outbox/outbox.js

@@ -0,0 +1,73 @@
+
+import { Base } from './../';
+
+
+class Outbox extends Base {
+
+    constructor() {
+        super();
+
+        this.fields = [
+            {
+                field: 'name',
+                caption: 'Name',
+            },
+
+            {
+                field: 'name',
+                caption: 'Name',
+            },
+
+            {
+                field: 'display_order',
+                caption: 'Display Order',
+            },
+        ];
+    }
+
+    disableAddModal() {
+        return true;
+    }
+
+    get getEndpoint() {
+        return 'outbox';
+    }
+
+    get path() {
+        return `outbox`;
+    }
+
+    get getName() {
+        return this.modelName;
+    }
+
+    get modelName() {
+        return `outbox`;
+    }
+
+    get columns() {
+        return [
+            {
+                field: 'from',
+                caption: 'From',
+            },
+            {
+                field: 'to',
+                caption: 'To',
+            },
+
+            {
+                field: 'created_at',
+                caption: 'created_at',
+            },
+
+            {
+                field: 'status',
+                caption: 'Status',
+            },
+        ];
+    }
+
+}
+
+export default Outbox;

package/core/lib/models/pages/pages.js

@@ -0,0 +1,107 @@
+
+import React from "react";
+
+
+import { Base } from '..';
+
+import { Link } from 'react-router-dom';
+
+import { Tag } from 'antd';
+
+// import Staffs from '../../../models/staffs';
+
+class Pages extends Base {
+    constructor() {
+        super();
+
+        this.fields = [
+            {
+                field: 'name',
+                caption: 'Name',
+            },
+            {
+                field: 'description',
+                caption: 'Description',
+            },
+            {
+                field: 'path',
+                caption: 'Path',
+            },
+            {
+                field: 'identifier',
+                caption: 'Identifier',
+            },
+
+        ];
+
+        // this.columns = ;
+    }
+
+    get getEndpoint() {
+        return 'pages';
+    }
+
+    get path() {
+        return `pages`;
+    }
+
+    get getName() {
+        return this.modelName + `s`;
+    }
+
+    get modelName() {
+        return `page`;
+    }
+
+    get columns() {
+        return [
+            {
+                field: 'name',
+                caption: 'Name',
+            },
+            {
+                field: 'description',
+                caption: 'Description',
+            },
+            {
+                field: 'path',
+                caption: 'Path',
+            },
+
+            {
+                field: 'identifier',
+                caption: 'Identifier',
+            },
+        ];
+    }
+
+
+    /**
+     * Card Component for Staff
+     *
+     * @param {*} record
+     * @returns
+     */
+    Card = (record) => {
+        return (
+            <Link className="booking-card" to={`/collections/${record['id']}`}>
+                <div className="card">
+                    <h2 className="">{record.name}</h2>
+
+                    <p className="">{record.description}</p>
+
+                    <p>
+                        <small className="">{record.path}</small>{' '}
+                    </p>
+
+                    <p className="address">
+                        Created by Admin on {record.created_at}
+                        <Tag color="magenta">{record['Consultant Name']}</Tag>
+                    </p>
+                </div>
+            </Link>
+        );
+    };
+}
+
+export default Pages;