ui-soxo-bootstrap-core 2.6.5 → 2.6.6

package/core/lib/models/process/components/process-dashboard/process-dashboard.scss

@@ -1,62 +1,62 @@
-.process-dashboard {
-    &.card {
-        .process-title {
-            margin: 10px 0px;
-        }
-
-        .process-description {
-            margin-bottom: 0px;
-        }
-
-        .process-timeline {
-            margin: 15px 0px;
-
-            .ant-timeline-item {
-                padding-bottom: 0px;
-            }
-
-            .task-form-card {
-                margin-bottom: 15px;
-            }
-
-            .ant-timeline-item-content {
-                padding: 10px;
-                border: 1px solid #e6e6e6;
-                margin-bottom: 15px;
-            }
-
-            .timeline-content {
-                display: flex;
-                justify-content: space-between;
-
-                .timeline-title {
-                    margin-bottom: 0px;
-                }
-
-                .timeline-description {
-                    margin-bottom: 0px;
-
-                    small {
-                        color: brown;
-                    }
-                }
-
-                .actions {
-                }
-            }
-
-            .ant-tag {
-                text-transform: capitalize;
-                margin-top: 10px;
-            }
-
-            i.pending-tag {
-                color: brown;
-
-                &.ongoing {
-                    color: #d66716;
-                }
-            }
-        }
-    }
-}
+.process-dashboard {
+    &.card {
+        .process-title {
+            margin: 10px 0px;
+        }
+
+        .process-description {
+            margin-bottom: 0px;
+        }
+
+        .process-timeline {
+            margin: 15px 0px;
+
+            .ant-timeline-item {
+                padding-bottom: 0px;
+            }
+
+            .task-form-card {
+                margin-bottom: 15px;
+            }
+
+            .ant-timeline-item-content {
+                padding: 10px;
+                border: 1px solid #e6e6e6;
+                margin-bottom: 15px;
+            }
+
+            .timeline-content {
+                display: flex;
+                justify-content: space-between;
+
+                .timeline-title {
+                    margin-bottom: 0px;
+                }
+
+                .timeline-description {
+                    margin-bottom: 0px;
+
+                    small {
+                        color: brown;
+                    }
+                }
+
+                .actions {
+                }
+            }
+
+            .ant-tag {
+                text-transform: capitalize;
+                margin-top: 10px;
+            }
+
+            i.pending-tag {
+                color: brown;
+
+                &.ongoing {
+                    color: #d66716;
+                }
+            }
+        }
+    }
+}

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

@@ -1,140 +1,140 @@
-/**
- * Generic Detail accepts an array of fields to update any resource
- */
-
-import React, { useState, useEffect, useContext } from 'react';
-
-import { Link } from 'react-router-dom';
-
-import { Typography, Button, Descriptions, Skeleton, Tabs, Space, Row } from 'antd';
-
-import { withRouter } from 'react-router-dom';
-
-import './process-detail.scss';
-
-import GenericList from './../../../../modules/generic/generic-list/generic-list';
-
-import { ReloadOutlined, OrderedListOutlined, PicCenterOutlined, CaretLeftOutlined, CaretRightOutlined } from '@ant-design/icons';
-
-
-import { Steps } from '../../../../models';
-
-const { Title } = Typography;
-
-const { TabPane } = Tabs;
-
-/**
- * Generic List
- *
- * @param {*} param0
- */
-function ProcessDetail({ 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="Sub Process" key="0">
-                            <GenericList
-                                model={Steps}
-                                config={
-                                    { orderBy: 'order' }
-                                }
-                                additional_queries={[
-                                    {
-                                        field: 'process_id',
-                                        value: params.id,
-                                    },
-                                ]}
-                            />
-                        </TabPane>
-                    </Tabs>
-                </>
-            )}
-        </section>
-    );
-}
-
-export default withRouter(ProcessDetail);
+/**
+ * Generic Detail accepts an array of fields to update any resource
+ */
+
+import React, { useState, useEffect, useContext } from 'react';
+
+import { Link } from 'react-router-dom';
+
+import { Typography, Button, Descriptions, Skeleton, Tabs, Space, Row } from 'antd';
+
+import { withRouter } from 'react-router-dom';
+
+import './process-detail.scss';
+
+import GenericList from './../../../../modules/generic/generic-list/generic-list';
+
+import { ReloadOutlined, OrderedListOutlined, PicCenterOutlined, CaretLeftOutlined, CaretRightOutlined } from '@ant-design/icons';
+
+
+import { Steps } from '../../../../models';
+
+const { Title } = Typography;
+
+const { TabPane } = Tabs;
+
+/**
+ * Generic List
+ *
+ * @param {*} param0
+ */
+function ProcessDetail({ 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="Sub Process" key="0">
+                            <GenericList
+                                model={Steps}
+                                config={
+                                    { orderBy: 'order' }
+                                }
+                                additional_queries={[
+                                    {
+                                        field: 'process_id',
+                                        value: params.id,
+                                    },
+                                ]}
+                            />
+                        </TabPane>
+                    </Tabs>
+                </>
+            )}
+        </section>
+    );
+}
+
+export default withRouter(ProcessDetail);

package/core/lib/models/process/components/process-timeline/process-timeline.js

@@ -1,140 +1,140 @@
-
-import React, { useEffect, useState, Fragment } from "react";
-
-import { Button, Skeleton, Timeline, Typography } from 'antd';
-
-import { Steps, Forms, Columns, Scripts, ProcessTransactions, StepTransactions } from '../../..';
-
-import { SettingOutlined, ExclamationCircleOutlined, CheckCircleOutlined } from '@ant-design/icons'
-
-import { Location } from "../../../../utils";
-
-
-export default function ProcessTimeline({ step, record }) {
-
-    let { process_transaction_id, } = Location.search();
-
-    const [steps, setSteps] = useState([])
-
-    const [transactions, setTransactions] = useState([]);
-
-    useEffect(() => {
-
-        getStepTransactions().then((transactions) => {
-
-            getProcess(step, transactions);
-
-        });
-
-
-        return () => {
-
-        }
-
-    }, [])
-
-    /**
-     * Get the process
-     * 
-     * @param {*} step 
-     * @param {*} transactions 
-     */
-    function getProcess(step, transactions) {
-
-        var queries = [{
-            field: 'process_id',
-            value: step.process_id
-        }, {
-            field: 'active',
-            value: true
-        }]
-
-        Steps.get(queries).then((result) => {
-
-            var modified_steps = Steps.orderArray(result.steps, 'order').map((step) => {
-
-                var matching = transactions.filter((ele) => ele.step_id === step.id)
-
-                if (matching.length) {
-
-                    step = {
-                        ...step,
-                        complete: true,
-                        transactions: matching
-                    }
-
-                } else {
-
-
-                }
-
-                return step;
-            });
-
-            setSteps(modified_steps);
-
-            console.log(modified_steps);
-        })
-
-    }
-
-    /**
-     * Get the step transaction
-     */
-    function getStepTransactions() {
-
-        var queries = [{
-            field: 'process_transaction_id',
-            value: process_transaction_id
-        }]
-
-        return StepTransactions.get(queries).then((result) => {
-
-            console.log(result);
-
-            return result.step_transactions;
-
-        })
-    }
-
-    // color={Candidates.status === 'Schedule Pending' ? 'green' : 'gray'}
-    // dot={Candidates.status === 'Schedule Pending' ? <CheckCircleOutlined /> : <ExclamationCircleOutlined />}
-
-
-    return (<>
-
-        <Timeline>
-
-            {
-                steps.sort((record) => record.order).map((entry) => {
-
-                    return (<Timeline.Item color={entry.complete ? 'green' : 'gray'} dot={entry.complete ? <CheckCircleOutlined /> : <ExclamationCircleOutlined />}>
-                        {entry.name}
-
-
-                        <p>
-                            <small>
-                                {
-                                    entry.complete
-                                        ?
-                                        <>
-
-                                            Completed at {entry.transactions[0].created_at}
-
-                                        </>
-                                        :
-                                        null
-                                }
-                            </small>
-                        </p>
-
-                    </Timeline.Item>)
-
-                })
-            }
-
-        </Timeline>
-
-    </>)
-
+
+import React, { useEffect, useState, Fragment } from "react";
+
+import { Button, Skeleton, Timeline, Typography } from 'antd';
+
+import { Steps, Forms, Columns, Scripts, ProcessTransactions, StepTransactions } from '../../..';
+
+import { SettingOutlined, ExclamationCircleOutlined, CheckCircleOutlined } from '@ant-design/icons'
+
+import { Location } from "../../../../utils";
+
+
+export default function ProcessTimeline({ step, record }) {
+
+    let { process_transaction_id, } = Location.search();
+
+    const [steps, setSteps] = useState([])
+
+    const [transactions, setTransactions] = useState([]);
+
+    useEffect(() => {
+
+        getStepTransactions().then((transactions) => {
+
+            getProcess(step, transactions);
+
+        });
+
+
+        return () => {
+
+        }
+
+    }, [])
+
+    /**
+     * Get the process
+     * 
+     * @param {*} step 
+     * @param {*} transactions 
+     */
+    function getProcess(step, transactions) {
+
+        var queries = [{
+            field: 'process_id',
+            value: step.process_id
+        }, {
+            field: 'active',
+            value: true
+        }]
+
+        Steps.get(queries).then((result) => {
+
+            var modified_steps = Steps.orderArray(result.steps, 'order').map((step) => {
+
+                var matching = transactions.filter((ele) => ele.step_id === step.id)
+
+                if (matching.length) {
+
+                    step = {
+                        ...step,
+                        complete: true,
+                        transactions: matching
+                    }
+
+                } else {
+
+
+                }
+
+                return step;
+            });
+
+            setSteps(modified_steps);
+
+            console.log(modified_steps);
+        })
+
+    }
+
+    /**
+     * Get the step transaction
+     */
+    function getStepTransactions() {
+
+        var queries = [{
+            field: 'process_transaction_id',
+            value: process_transaction_id
+        }]
+
+        return StepTransactions.get(queries).then((result) => {
+
+            console.log(result);
+
+            return result.step_transactions;
+
+        })
+    }
+
+    // color={Candidates.status === 'Schedule Pending' ? 'green' : 'gray'}
+    // dot={Candidates.status === 'Schedule Pending' ? <CheckCircleOutlined /> : <ExclamationCircleOutlined />}
+
+
+    return (<>
+
+        <Timeline>
+
+            {
+                steps.sort((record) => record.order).map((entry) => {
+
+                    return (<Timeline.Item color={entry.complete ? 'green' : 'gray'} dot={entry.complete ? <CheckCircleOutlined /> : <ExclamationCircleOutlined />}>
+                        {entry.name}
+
+
+                        <p>
+                            <small>
+                                {
+                                    entry.complete
+                                        ?
+                                        <>
+
+                                            Completed at {entry.transactions[0].created_at}
+
+                                        </>
+                                        :
+                                        null
+                                }
+                            </small>
+                        </p>
+
+                    </Timeline.Item>)
+
+                })
+            }
+
+        </Timeline>
+
+    </>)
+
 }