Data

Tools

Indexes

Applications

Experiments

Awesome

An open API service indexing awesome lists of open source software.

https://github.com/yasargis/jelata-framework

Jelata Framework
https://github.com/yasargis/jelata-framework

database framework jelata-framework plpgsql postgresql python python3 reactjs sql

Last synced: about 1 month ago
JSON representation

Jelata Framework

Awesome Lists containing this project

README 

          
# Current Version

Jelata Framework v. 0.0.6



# Getting Started

Jelata Framework is a tool combining a framework and development environment that you can use in your browser. 

The Jelata Framework is designed to simplify the development task with ready-made components that already have a bundle with data in the database.  

To start using you will need:  

                        
    

    							
  • python 3 (recommended to use python versions older than 3.4)
    • 

    							
  • PostgreSQL DBMS (PostgreSQL version 9.5 is recommended)
    • 

    							
  • node js 
    • 

    						


						
For python, you must install the following libraries:


                        
    

    							
  • tornado v. 4.5.3
    • 

    							
  • momoko
    • 

    							
  • xlsx2html
    • 

    						


						

pip install -Iv tornado==4.5.3 

pip install momoko

pip install xlsx2html




For start report service go to the path ./reports and install all modules and start node server (or use pm2 deamon).


npm i

node index.js




Next, you need to create the project database by running the script from the framework.sql file (If you already have a database to which you want to connect, you need to create all the objects from the framework.sql script in your database).

Base name can be renamed.

The last step is to check the settings for connecting to the database server in the settings.json file, if everything is correct, then start the server:




python3 run_server.py



After starting the server, in the browser, go to http://127.0.0.1:8080 and in the user menu click on the login item



login: admin


password: 123


PS Be sure to change the administrator password before release.


For see template components	follow the link  http://127.0.0.1:8080/list/test



Templates: 



You can write your own front-end for framework 



## Authors



* **Kazaryan Sargis**



Jelata Framework

To get started make sure:
    

  • all project files are in a folder called jelataframework .
    • 

  • all settings, including those for connecting to the database, are correctly specified in the settings.json file
    • 

  • your database contains all data and objects from framework.sql file
    • 


To start the server, type python3 run_server.py on Linux systems and python run_server.py on windows systems (if python is version 3).
To start the print server, you need to have node js> 6 v, install all dependencies for the project in the reports folder, for this, type the command npm i

Main Settings
The main project settings can be accessed through Project Settings-> Global Project Settings -> Global Settings or via the path / getone / mainsettings. All settings are stored in the settings.json file and are duplicated in the database in the framework.mainsettings table. Basic properties:
    

  • 

    db connection string - DB connection string

    • 

  • 

    project server port - the port on which the web server is running
    • 

  • 

    main domain - project domain in production
    • 

  • 

    primary authorization - sign of authorization, whether the project requires mandatory authorization to work
    • 

  • 

    redirect401 - redirects to this path in case of 401 error status
    • 

  • 

    home page - the main page of the project
    • 

  • 

    login_url - login page
    • 

  • 

    reports_url - report service server
    • 

  • 

    ischat - show the chat icon in the lower right corner
    • 

  • 

    template - project template (ant, materialize)
    • 



Views
View are the main components (configurations for rendering and data linking) used in the project. They are located in the framework.views table and also in the auxiliary tables: framework.config (framework.defaultval, framework.select_condition, framework.visible_condition), framework.actions (framework.act_parametrs, framework.act_visible_condions), framework.filters. The data is heaped using the framework function . "Fn_view_getByPath" (_path varchar, _viewtype varchar, out outjson json) and processed using the /libs/admin.py and /libs/sql_migration.py files .
We recommend creating and editing them from the admin panel, which is located in the menu item Project Settings-> Components -> Views , or along the path / list / views.
The main properties of a view are:
    

  • 

    table - the main table,
    • 

  • 

    path - path,
    • 

  • 

    title - title,
    • 

  • 

    roles - the roles of users with view rights (roles are in the framework.roles table),
    • 

  • 

    classname - the name of the CSS class that can be applied to the entire component,
    • 

  • 

    viewtype - component type (view) ,

    • 

  • 

    subscrible - opens a web-socket through which you can send messages and update the view ( framework.viewsnotification table). And for table types (tiles, table)
    • 

  • 

    pagination - turns on paging.
    • 


Using the showsql button, you can get the SQL script that turned out according to your config.

At the moment there are 4 types of components in operation:
    

  • table - table
    • 

  • tiles - tiled list
    • 

  • form full - a form that instantly saves data (saves data after entering)
    • 

  • form not mutable - form without immediate saving
    • 


A link is attached to each type in the system, by which you can go to this view.
For type table - / list / <path>
Для form full и form not mutable - /getone/<path>
For tiles type - / tiles / <path>

A very important point is passing parameters in the address bar to the specified view, since these parameters are filters for the view.
For example, we have a view available on the path / list / myview with the field myfieldid, if we pass to the path / list / myview? Myfieldid = 13, then we will get records with myfieldid = 13, but myfieldid is not the name of the field in the table, and the "title" parameter in the config-e view (see the description for config).
For views of type form full and form not mutable, it is necessary to pass a parameter narrowing the returned lines to 1, most often this is an explicit id indication, for example, / getone / myform? Id = 1
To create a record in the form, you must specify a non-existent id, most often it is id = 0 (/ getone / myform? Id = 0).

relation parameter:
the relation parameter is needed to pass the name of the table fields, in which you need to write values ​​to the table when creating a record, except for those explicitly passed, their values ​​must also be indicated in the address bar in the parameters with the table field name and value.
For example, we add a record to the table mytable, which is specified as the main one in the view myview, of type form full, for this we went along the path / getone / myview? Id = 0, and since this is form full, then after the first change in the input, a request will be sent to save the data and a record will be created, but for example the table logically requires one more mandatory (not null) field - nnull_field, and in order to fill it in, we pass its name to the relation parameter - relation = nnull_field, and the nnull_field parameter with the value nnull_field = 1, as a result, for a full-fledged work, we get the path / getone / myview? id = 0 & relation = nnull_field & nnull_field = 1 .
If you need to pass several parameters, then we list them separated by commas, for example: / getone / myview? Id = 0 & relation = field1, field2 & field1 = 1 & field2 = teststring

userid:
If there is a userid field in the table , then when the row is changed by standard means (form full and action of type Save and Delete), the current user will be written.

Each type of view component has its own settings - config, depending on the type.

Description of config fields - a:
    

  • 

    column_order - the order in which the field is displayed
    • 

  • 

    fn is a function, for the type of columnar function, this is also a field, the value of which is returned by the specified plpgsql function, it also depends on the fncolumns parameter - parameters passed to the function, for example SELECT id, fn1 (id) FROM mytable, where fn1 is the value fn. It is most often used for simple functions, such as displaying a color, calculating something, or when foreign key relationships are not specified, which does not allow building further joins, or when there are ambiguous and complex relationships between tables in the database. It can slow down the work, check the speed of the function.
    • 

  • 

    fncolumns - parameters passed to the function
    • 

  • 

    col - the name of the field in the table
    • 

  • 

    title - the name of the field in the component, you can also filter data by the value of this field using the incoming parameters in the address bar, for example / list / myview? field title = test title
    • 

  • 

    type - the type of the field, the behavior of the field, its display and connection with data depends on this, for a more detailed description of each type, read the column types below
    • 

  • 

    visible - the sign of displaying the field, if true, then the user sees it on the component, if false, then the user does not see it, but the data is returned and can be manipulated
    • 

  • 

    required - whether it is mandatory to specify a filter for this field, protects against user attempts to change the value of the specified filter and view all records, use as needed
    • 

  • 

    orderby - sort by this field
    • 

  • 

    orderbydesc - rotate sorting, only works if orderby is selected
    • 

  • 

    updatable - used for a view of type form full, updates the data after each save, also used to update the entire composition (read below)
    • 

  • 

    classname - the application of css styles, the name of the css class
    • 

  • 

    editable - used for the table type - an editable cell in a table, makes it possible to change data inside a table cell
    • 

  • 

    join - if there is a connection with another table, it applies JOIN instead of LEFT JOIN, the connection with another table is stipulated in the relation field and the presence of a foreign key in the table.
    • 

  • 

    width - width, you can use 100px, 70%, or markup from 1-24, 24 is the whole line, by default 12 is half
    • 

  • 

    roles - the roles that the field is available to
    • 

  • 

    relation - the table with which the field is associated using a foreign key. In the case of the types select_api, typehead_api, multiselect_api, multitypehead_api - the path to the API method (read more in the description of types), in the case of the types multiselect, multitypehead - the table where the values ​​will be taken from (for more details, read the description of the types).
    • 

  • 

    relationcolums - fields that can be pulled from the relation table (LEFT JOIN), are also used as fields for values ​​of types select, typehead, etc. It is also possible to build joins based on links from expanded fields, the only condition is that the foreign key must be specified
    • 

  • 

    select_condition - conditions for fields of selct types, typehead for a list of values ​​from the table specified in relation
    • 

  • 

    visible_condition - field display conditions
    • 

  • 

    defaultval - the value that the filter goes to the sql query condition, for example WHERE field1 = 1
    • 


Config-a field types:
    

  • 

    label - the type for displaying the value - html component label
    • 

  • 

    text - html input of type text
    • 

  • 

    number - html input c типом number
    • 

  • 

    phone - html input with phone mask
    • 

  • 

    password - html input of type password. If this type is selected for a field, then the value written to the database is encrypted in md5. No value is returned to the form, input will always be empty.
    • 

  • 

    textarea - html textarea component
    • 

  • 

    texteditor - text editor, saves formatted text as html
    • 

  • 

    autocomplete - autocomplete, searches for data across the entire table by the entered excerpt, returns the entered text and found data as a list (only form)
    • 

  • 

    certificate - selection of a certificate of existing digital signatures, it may not work, because requires an extension in the browser and a script to work with the extension (only form)
    • 

  • 

    checkbox - for boolean types - html input of type checkbox
    • 

  • 

    codeEditor - code editor (ace editor based) (form only)
    • 

  • 

    color - display color
    • 

  • 

    colorpicker - color picker , writes a hash code (only form)
    • 

  • 

    colorrow - colors the text of a row in a table in the specified color (table only)
    • 

  • 

    date - date picker
    • 

  • 

    datetime - date and time picker
    • 

  • 

    time - time selection
    • 


    • 

  • 

    files - same as file, only for multiple downloads
    • 

  • 

    filelist - only to show files uploaded using file or files
    • 

  • 

    image - loading an image type file
    • 

  • 

    images - same as images, only for bulk upload
    • 

  • 

    gallery - only for displaying files uploaded using image or images
    • 

  • innerHtml - embeds html (it is dangerous to use without checking the incoming data for inline scripts)
    • 

  • 

    link - a link, can display just a link, for example http://github.com, if you return it in text. Or you can return a json object of type {title: 'mylink', link: 'mypath', target: '_ blank'}
    • 

  • 

    multidate - multiple date selection, saves to array ["2018-01-01", "2018-01-02"] (form only)
    • 

  • 

    select - html component select - drop-down list, used only if the relation field contains a table from a foreign key field, and the relationcolums specifies fields that will serve as values ​​for the list, if one field is selected, then it will be recorded and displayed if selected two fields, for example ["id", "title"], then id will be written as a value to the base, and title will be displayed for selection, if 3 or more fields are selected, then the first will be written, and all the rest will be concatenated for display. You can also apply a condition for displaying a list by specifying it in select_condition. It is important that the select type gives only 300 records from the table, if there are more records, we recommend using the typehead type.
    • 

  • 

    typehead - html component select - with search, works on the same principle as the select type, but requires a search string that the user enters, the search is performed over the entire table specified in the relation, according to the fields specified in relationcolums.
    • 

  • 

    multiselect - works on the principle of the select type, but does not require a foreign key, the table can be specified independently in the admin panel of the config. Multiple choice. Saves an array of selected values ​​to the JSON database, for example [15,155,14], so the field in the table must be of json type.
    • 

  • 

    multitypehead - works on the principle of the multiselect type, only with search
    • 

  • 

    select_api- works on the principle of the select type, but instead of a table link, the relation specifies the path to the API method (for example / api / gettables), which returns data for the list. The API method must be POST, must return an object with the outjson key containing an array of objects like {label: "val1", value: "1"}, where value is written to the database, and label is to be displayed to the user. Those. the method response should look like this: {outjson: [{label: "val1", value: "1"}, {"label": "val2", value: "2"}, ...]}. The body of the method will contain the object {config: [...], data: {...}, inputs: {...}}, where config is the config view, data is all the current data on the form, inputs are these are the current address bar parameters and can be used to manipulate data in your API method. Important,
    • 

  • 

    typehead_api - the same as the select type, but additionally the parameter goes subtr - the search query
    • 

  • 

    multiselect_api - works on the principles of multiselect and select_api, multiple choice, receives data from the API method, saves an array of selected data to a database table. It also accepts a parameter val - in which the current value, return a list by val, to initialize the form with a filled value.
    • 

  • 

    multitypehead_api - works on the principles of multitypehead and typehead_api, multiple selection, receives data from the method API, sends the substr parameter for search, saves an array of selected data to a database table. It also accepts a parameter val - in which the current value, return a list by val, to initialize the form with a filled value.
    • 

  • 

    rate - asterisks for ratings, we recommend using with the numeric type, because ratings can be 4.5, 2.5, etc.
    • 

  • 

    tags - tags, saves an array of entered lines, adds to the array on onEnter, stores in the database in a json field
    • 

  • 

    array is a table that has a one-to-many relationship with the main one, you can display it as a table, but with the names of the fields, as indicated in the database. Not recommended for use unless urgently needed. Configurable in relationcolums.
    • 

  • 

    diagram - выводит диаграмму в виде графика, Формат данных {"datasets" : [{"label" : "MyDiagram", "x" : ["1","2","3","4","5"], "color" : "green"}], "y" : ["1","2","3","4","5"]}
    • 


Filters:
For the types of views - table and tiles, it is possible to add filters.
Filters have several basic properties.
    

  • title is the title to display the filter,
    • 

  • col or columns - fields by which to filter data,
    • 

  • type - type,
    • 

  • position - location,
    • 

  • order - order.
    • 

Filters are distinguished in two categories, the first - is the location on the page - position , the second - this type of filter.
At the moment, two options are available by location, these are Up - on top of the form and Right - on the right, in the drop-down window.

By types:
    

  • 

    period - specified for a field of type date, filters data by two specified dates of the period, mydatefield> = filterdate1 and mydatefield <= filterdate2
    • 

  • 

    date_between - specified for a field of type date, filters data according to the principle mydatefield> = filterdate and mydatefield <= filterdate
    • 

  • 

    check - used for a field with boolean data type, checkbox - with values ​​true / false / null
    • 

  • 

    substr - search for a substring in a string. (lower (myfield) like lower (concat ('%', _ substr, '%')))
    • 

  • 

    typehead - search in several fields, you can also search by specifying the search values ​​separated by a space, in the case when 3 or more fields are specified. Good for searching by last name, first name, but may not work for a single field that contains values ​​with problems.
    • 

  • 

    select - select a filter value from the drop-down list, for fields with a foreign key, for the filter to work, the field must have a table in the relation and two fields in relationcolums must be specified - the value and the field to display, for example ["id", "title" ]
    • 

  • 

    multiselect - the same as select, only multiple choice, i.e. the filter will not be t1.myselectfield = val, but t1.myselectfield in (select value from json_array_elements (val))
    • 

  • 

    multijson - intersection of two arrays, one is the field value, the second is the selected array in the filter
    • 


Actions:

The main functionality for managing a view is action. Framework.actions tables. Basic properties:
    

  • 

    title - the name of the button, or action
    • 

  • 

    type - type of action (see types of actions)
    • 

  • 

    isforevery - for each row, used for table and tiles
    • 

  • 

    ismain - fires on double click on a row, used for table and tiles
    • 

  • 

    act - path
    • 

  • 

    classname - CSS class
    • 

  • 

    icon - icon, antd icon v3. * https://3x.ant.design/components/icon/
    • 

  • 

    actapitype - the type of the API method, in case the type is API, GET, POST, PUT, DELETE
    • 

  • 

    actapirefresh - update the form after performing an action of the API type
    • 

  • 

    parametrs - parameters, read more description of parameters
    • 

  • 

    act_visible_condition - visibility conditions
    • 


Action types:
    

  • 

    Link - follow the link (without reloading the page)
    • 

  • 

    LinkTo - opens in a new page
    • 

  • 

    API - calling the API of the method, if the method returns message - it will be shown as a notification, if _redirect - it will redirect to the specified path
    • 

  • 

    Delete - delete a record, it is used only in views such as tables and tiles, isforevery must be true, i.e. fires only for a row in a table
    • 

  • 

    Save - saving data in the form form not mutable
    • 

  • 

    Save & Redirect - saving data in the form not mutable and redirecting to the path specified in act
    • 

  • 

    OnLoad is an API method that is executed before the component is loaded, so you can, for example, download or update data before loading
    • 

  • 

    Expand - an expanding component of a table row, is used only in a view of the table type - in act, the path to the getone or list component is indicated, for example / list / myview or / getone / myview, parameters are also passed to parametrs
    • 

  • 

    Modal - a modal window, opens the view specified in the act in the modal window, passing parameters, after closing the window, updates the view, the path to the component must be getone or list, for example / list / myview or / getone / myview, parameters are also passed to parameters
    • 


Description of parameters:
Parameters in actions have several basic properties and rules. title is the name of the parameter, then you should choose where to get the value for the parameter, it is possible to take from the component data - val_desc, specify a constant - const, or take it from the address bar - input. If isforevery false is used in table or tiles, and val_desc is specified, then the value will be taken from the first record of the table, but it may not appear, so be careful using a similar construction. For the onLoad action type, only the Input value can be used.

Service parameters:
_sub_title - If you pass the _sub_title parameter, then in the view, in addition to the main title, there will be a subtitle with the parameter value:
?id=1&_sub_title=My SubTitle
relation - The relation parameter is described above

Global parameters:
_checked_ - if you pass the constant _checked_ in the parameter value, you can pass an array of identifiers selected in the table, for this checker: true must be specified in the main view properties, only for the table type
_userid_ - if you pass the constant _userid_ in the parameter value, then you can pass the identifier of the current user, it can also be passed to config in defaulval, select_condition
_orgid_ - if you pass the constant _orgid_ in the parameter value, then you can pass the identifier of the current organization, the current user, it can also be passed to config in defaulval, select_condition
_orgs_ - if you pass the constant _orgs_ in the parameter value, then you can pass the JSON array identifiers of all organizations, the current user, they can also be passed to config in defaulval, select_condition
_sesid_ - session identifier
_viewid_ - view id from framework.views table

Composition

Compositions is a component in which you can combine several views into one, available at the path / composition / <mycompopath>.
Composition properties:
    

  • 

    title - title of the composition - title,
    • 

  • 

    path - the path of the composition along this path the component will be available,
    • 

  • 

    viscond_function is a function that returns a json array of view identifiers that need to be displayed, takes as input all the address bar parameters - inputs and path of the composition, an example of the framework.fn_views_compo_visible function.
    • 

  • 

    config - a list of views to display.
    • 

Config, in turn, contains view display properties,
    

  • 

    rownum - the order
    • 

  • 

    width - width from 1 to 24, by default it is always 24 - full screen. those. 100%,
    • 

  • 

    path - object containing id, path, viewtype - view identifier, path and view type.
    • 


The parameters are passed the same as they should come to the view. those. if you combined in view table and getone of the same table and sent id = 0, then it will apply to both views.
Compositions update data if there is at least one updatable in the view in the config (in the config).
The database is stored in the framework.compos table.

Trees

Tree is a tree-like menu where you can specify items and a view or composition corresponding to an item, you can also specify parent records, for each item you need to specify a name and an icon. Trees are available along the path / trees / <mytreepath>, where <mytreepath> is the path of the tree. It is also possible to specify the main item that will open when the tree is initialized. You can get to the desired tree item by specifying # <item identifier> in the address bar, for example: / trees / <mytreepath>? Oid = 12 # 15, where # 15 is the item identifier. The parameters in the tree, as well as in the composition, are passed through to the view.


SPAPI
SpApi are API methods that are stored in the framework.spapi table and are executed on the principle of direct execution of the specified function, i.e. each method has its own pl / pgsql function. The function must have an input injson parameter of the JSON type, into which the body and request parameters will be passed. The function can return any data type, the message and _redirect return service parameters are described in the API action type. API methods have the following properties:
    

  • method name - the name of the API method, the method is available at the path / api / <method name>
    • 

  • function - plpgsql function
    • 

  • methotype - API type of the method, get, post, put, delete
    • 

  • roles - user roles for which the method is available, if nothing is selected, the method will be available to everyone, even to unauthorized users
    • 

The method is available at the path / api / <mymethodname>

Menu
The table - framework.menus - stores data about the menus that are added to the project and their location, i.e. Left Menu - left menu, Header Menu - top menu, etc. The table - framework.mainmenu - stores the menu list. In order to add / edit a menu, go to the menu item Project Settings -> Auxiliary settings -> Menu Settings .
Properties:
    

  • title - the title of the menu item
    • 

  • parent - parent record
    • 

  • roles - the roles for which the menu item is available
    • 

  • order by - the order of the item
    • 

  • path - path
    • 

  • icon - item icon https://3x.ant.design/components/icon/
    • 

  • no session - show menu item only if user is not logged in
    • 

  • ws messagetype - specify the type of notification from the framework.notification table, add a counter
    • 

  • is title - whether to show the title of the item
    • 


Notifications
Sending notifications to a project is possible by adding records to the framework.notification table. Basic properties:
    

  • message - message
    • 

  • messagetype - notification type, specified in the menu, for the 'notifs' counter by default
    • 

  • for_userid - identifier of the user for whom the notification
    • 

  • sended_sessions - sessions received notifications
    • 

  • isread - read
    • 

  • sessid - session for which notification, if for_userid is not specified
    • 


User CSS
user.css is a file connected to the project's index.html. You can write new CSS classes in this file by going to the menu item Project Settings -> Global Project Settings -> User Css .


Updates
  • Added functions for transferring views from one database to another
framework. "fn_view_genJson" - getting JSON view for transfer
framework."fn_view_fromJson" - добавление view из JSON

  • Changing the interface language
To change the interface language, in the jelataframework / files folder in the languages.js file, change the value of the LnG variable, RU and ENG are available, if necessary, you can add a translation to json LaNg by adding your language code to each array object, as a key and a translation, in as a value, for example: "List": {
"EN":"list:",
"RU":"Список:",
"CN": "List"
}

Presentation