# Ez Dashboard + OpenAI

<figure><img src="/files/DZI9ZZieY6adifkGrfwh" alt=""><figcaption></figcaption></figure>

***

## 🔗Links

&#x20;      [**Template Link on Bubble Marketplace**](https://bubble.io/template/ez-dashboard-+-openai-1571845225384x467072888827019260)

&#x20;      [**Template Link on Our Website**](https://eazycode.com/template/ez-dashboard-+-openai-1692021501548x331026900496931100)

&#x20;      [**Preview Link** ](https://ezdashboard.bubbleapps.io/)

&#x20;      [**Forum Link**](https://forum.bubble.io/t/new-free-dashboard-template-by-ezcode/83632/26)

***

## Photos

{% tabs %}
{% tab title="1" %}

<figure><img src="/files/roweEeTCuR7we7ZLgZfN" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="2" %}

<figure><img src="/files/K7fdU79W0Rs34C5MOfom" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="3" %}

<figure><img src="/files/OJSaFaYyjpiXyUNTApsG" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="4" %}

<figure><img src="/files/wfGyyDbsKTMz8gLZcLok" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="5" %}

<figure><img src="/files/EQvqDPOwmMAJl4vH5B9Y" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="6" %}

<figure><img src="/files/tp9ILyFifp0BCfEP06D9" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="7" %}

<figure><img src="/files/apwsqmPy1gA2JM2eTLh6" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

***

## Introduction&#x20;

Ez Dashboard + OpenAI is an information panel designed for a convenient and concise visual display of key data, indicators, and statistics. Our template provides powerful visualization, analysis, and data management tools.&#x20;

It can be used both in the financial sector to track investments, manage assets, and analyze financial markets, and in the IT sector to create interactive and informative dashboards, which is useful when developing applications. The areas of activity where this template can be useful are endless.

Our team carefully selected color solutions to create a modern look. This template is fully responsive for viewing on mobile devices, tablets, and desktop computers. Our template can be easily integrated into any bubble application and customized to suit any needs. Includes a huge number of variations with charts, forms, groups, and tabs, which makes our application flexible and easy to customize. We have also integrated the <mark style="color:green;">**OpenAI solution**</mark> for maximum efficiency in solving set plans and tasks.\
Ez Dashboard + OpenAI is the right choice to start your project.

The template is completely free, although additional modifications may be discussed. Feel free to contact us with any questions and we will be happy to find a solution to your idea.

***

## <mark style="color:red;">Notice</mark>

{% hint style="danger" %} <mark style="color:red;">While purchasing this template, you will need to enter your own Open AI key to process and generate questions.</mark>
{% endhint %}

You can enter your Open AI key in the API Connector plugin settings.

Also, for AI to work correctly in your application, make sure that the fields (Key and Value)for Shared headers for all calls are filled out correctly like in the following picture<br>

<figure><img src="/files/RM7QD8myCrTYGZZUaFiu" alt=""><figcaption></figcaption></figure>

***

## Features&#x20;

* **Any type of Graphs**
* **Huge Forms range**
* **Sidebar**
* **Tabs**
* **User account**
* <mark style="color:green;">**OpenAI Solutions**</mark>

***

## Notes

{% hint style="info" %} <mark style="color:blue;">**Important note**</mark><mark style="color:blue;">:</mark> After purchasing this template and customizing it, be sure that you had a chance to learn how to set up data security.&#x20;

Check all privacy settings by the following link before launch: [*<mark style="color:blue;">**Bubble Privacy**</mark>* ](https://manual.bubble.io/help-guides/data/the-database/protecting-data-with-privacy-rules)

Since access to objects differs in each application and is unique for each case, ensure you have established all the privacy rules.
{% endhint %}

{% hint style="danger" %} <mark style="color:red;">This template is not the final product. Any part of the application can be modified for different needs.</mark>
{% endhint %}

{% hint style="danger" %} <mark style="color:red;">While purchasing this template, you will need to enter your own Open AI key to process and generate questions.</mark>
{% endhint %}

You can enter your Open AI key in the API Connector plugin settings.

Also, for AI to work correctly in your application, make sure that the fields (Key and Value)for Shared headers for all calls are filled out correctly like in the following picture<br>

<figure><img src="/files/RM7QD8myCrTYGZZUaFiu" alt=""><figcaption></figcaption></figure>

***

## Pages

### index <a href="#index" id="index"></a>

On this page, users can find a list of the features and services the app can offer.

### dashboard

The dashboard is the main page of the app. This page contains six tabs with a wide functionality range.

* **Dashboard** - This tab collects all statistical information, with the possibility to choose the date range, and categories.
* **Graphs** - This tab contains a variety of charts from which the user can choose the solution that suits his needs.
* **Forms** - Here all possible forms are clearly presented, from which the client can choose the appropriate option for him.
* **Groups** - This tab shows the list of all possible groups, which users can customize.
* **Tabs** - Multiple tab options designed for every need.
* <mark style="color:green;">**OpenAI Solution**</mark> - Helps to find a solution for a large number of tasks.

### index\_old

This is one more landing page, which the user can choose to customize his app. Also fully responsive for any screen width.

### profile&#x20;

This page contains an email change popup, password change popup, sidebar menu, and personal account settings.

### reset\_pw

This page allows the user to reset the password.

### 404

This page appears when something goes wrong in the app's work.

***

## Reusable elements&#x20;

### about\_us

This reusable element includes images and texts that contain information about the company.

### apps

This reusable element contains ways to get the app.

### banner

This reusable element has a background, image, buttons, and trigger for pop-up with videos from YouTube.

### call\_to\_action

This reusable element contains a call to action bloc. It contains information, features, and images.

### dash\_header

This reusable element is the header displayed on the dashboard page. It contains a logo, a link to the <mark style="color:green;">Eazy</mark><mark style="color:red;">Code</mark> new Dashboard Pro template, a user's image and name, a profile button, and a burger menu.

### features

This reusable element contains information about the item's features.&#x20;

### footer

This reusable element contains a subscription, logo, and links to EzCode plugins, templates, and socials.&#x20;

### NavMob

This reusable element contains a mobile navigation menu.

### pricing

This reusable element contains groups with pricing information and more learn buttons.

### sidebar&#x20;

This reusable element contains tabs for navigation on the dashboard page.

### Signup / Login Popup

This reusable element contains sign-up/log-in/reset password forms.

### testimonials

This reusable element contains images and tabs with testimonials.

### why\_us&#x20;

This reusable element contains reasons to choose this company, item, or else. It contains tabs with information about benefits.

***

## Workflow

Highlighting the workflow with color is a great way to separate actions in essence and significance. Below is the <mark style="color:green;">Eazy</mark><mark style="color:red;">Code</mark> standard for the use of colors with a detailed explanation.

{% hint style="warning" %} <mark style="color:orange;">The standards below are for informational purposes only. Any discrepancy is not related to the functionality of the application.</mark>
{% endhint %}

**Blue** - The actions taking place on our screen do not utilize the application's resources. For instance, when an element is clicked and a popup is opened or closed.

<div align="center"><figure><img src="/files/jXBLqAqnhRtr8trT1P4y" alt="" width="200"><figcaption></figcaption></figure></div>

**Green** - These actions involve creating or modifying entries in the database. For example, "Create a new Thing," "Make changes to a thing or a list of things," as well as "Copy a list of things," and so on.

<figure><img src="/files/IhsNgLQzEqD60jRJQ1nn" alt="" width="200"><figcaption></figcaption></figure>

**Red** - This action involves deleting or resetting values. For instance, "Delete a thing or a list of things," as well as "Reset a group" and "Reset inputs."

<figure><img src="/files/Bvmu9eBxmVDTHmejQBzN" alt="" width="200"><figcaption></figcaption></figure>

**Orange** - Actions related to your navigation. For example, "Navigate to a page," or "Do when a condition is true" – when you use specific values for checking, such as "When the current user is logged in," and so on.

<figure><img src="/files/6V3DXdnLhMYwqnWDpiP8" alt="" width="200"><figcaption></figcaption></figure>

**Cyan** - Actions utilizing Custom Events – lengthy tasks that involve the creation, modification, deletion, and plugins within a single comprehensive workflow as steps.

<figure><img src="/files/GPrMgq8tXbrjY9yyZVyH" alt="" width="200"><figcaption></figcaption></figure>

**Brown** - Custom workflow, API workflow, and similar tasks.

<figure><img src="/files/keW5zGLMCW3tTyyEOWOZ" alt="" width="200"><figcaption></figcaption></figure>

**Purple** - The significance of this color is determined by the developer themselves, as it is done due to the fact that everyone has their own approach to development.

<figure><img src="/files/XNzKj8OwRFRk1HFOGqvy" alt="" width="200"><figcaption></figcaption></figure>

**Grey** - All other actions.

<figure><img src="/files/HC9QqjagbZp1qTBebH6y" alt="test" width="201"><figcaption></figcaption></figure>

***

## Data Types&#x20;

{% hint style="info" %} <mark style="color:blue;">This data type contains information only for demonstration purposes.</mark>
{% endhint %}

### EzChart

This data type is used to store day-of-week names which are displayed in charts.&#x20;

<table data-full-width="false"><thead><tr><th>Field name</th><th>Type</th><th>Notes</th><th data-hidden>Notes</th></tr></thead><tbody><tr><td><code>DataNumber</code></td><td><code>number</code></td><td>Stores the number in chart.</td><td></td></tr><tr><td><code>Lable</code></td><td><code>text</code></td><td>Stores the day-of-week name.</td><td></td></tr></tbody></table>

### EzChart2

This data type is used for month names which are displayed in charts.

<table data-full-width="false"><thead><tr><th>Field name</th><th>Type</th><th>Notes</th><th data-hidden>Notes</th></tr></thead><tbody><tr><td><code>DataNumber</code></td><td><code>number</code></td><td>Stores the number in chart.</td><td></td></tr><tr><td><code>Lable</code></td><td><code>text</code></td><td>Stores the month name.</td><td></td></tr></tbody></table>

### Group

This data type is used to store group-type proprieties.&#x20;

<table data-full-width="false"><thead><tr><th>Field name</th><th>Type</th><th>Notes</th><th data-hidden>Notes</th></tr></thead><tbody><tr><td><code>created</code></td><td><code>text</code></td><td>Stores the date group created.</td><td></td></tr><tr><td><code>first name</code></td><td><code>text</code></td><td>Stores the user name in group.</td><td></td></tr><tr><td><code>product</code></td><td><code>text</code></td><td>Stores the product title in group.</td><td></td></tr><tr><td><code>sale</code></td><td><code>number</code></td><td>Stores the sales number.</td><td></td></tr><tr><td><code>status</code></td><td><code>text</code></td><td>Stores the status in group.</td><td></td></tr><tr><td><code>user</code></td><td><code>text</code></td><td>Stores the user name.</td><td></td></tr><tr><td><code>vatno.</code></td><td><code>text</code></td><td>Stores the VAT number.</td><td></td></tr></tbody></table>

### Group1

This data type is used to store group-type proprieties.&#x20;

<table data-full-width="false"><thead><tr><th>Field name</th><th>Type</th><th>Notes</th><th data-hidden>Notes</th></tr></thead><tbody><tr><td><code>amount</code></td><td><code>number</code></td><td>Stores the amount in group.</td><td></td></tr><tr><td><code>deadline</code></td><td><code>text</code></td><td>Stores the deadline date.</td><td></td></tr><tr><td><code>First Name</code></td><td><code>text</code></td><td>Stores the assigned user name.</td><td></td></tr><tr><td><code>image</code></td><td><code>image</code></td><td>Stores the user image.</td><td></td></tr><tr><td><code>product</code></td><td><code>text</code></td><td>Stores the product title.</td><td></td></tr><tr><td><code>progress</code></td><td><code>number</code></td><td>Stores the progress percentage.</td><td></td></tr><tr><td><code>status</code></td><td><code>text</code></td><td>Stores the status in group.</td><td></td></tr></tbody></table>

### Invoices

This data type is used to store invoice proprieties.&#x20;

<table data-full-width="false"><thead><tr><th>Field name</th><th>Type</th><th>Notes</th><th data-hidden>Notes</th></tr></thead><tbody><tr><td><code>customer</code></td><td><code>text</code></td><td>Stores the customer name.</td><td></td></tr><tr><td><code>invoice</code></td><td><code>text</code></td><td>Stores the invoice number.</td><td></td></tr><tr><td><code>p_price</code></td><td><code>text</code></td><td>Stores the purchased price.</td><td></td></tr><tr><td><code>price</code></td><td><code>image</code></td><td>Stores the best price.</td><td></td></tr><tr><td><code>ship</code></td><td><code>text</code></td><td>Stores the shipping country.</td><td></td></tr><tr><td><code>status</code></td><td><code>number</code></td><td>Stores the invoice status.</td><td></td></tr></tbody></table>

### Refund Request

This data type is used to store refund request proprieties.&#x20;

<table data-full-width="false"><thead><tr><th>Field name</th><th>Type</th><th>Notes</th><th data-hidden>Notes</th></tr></thead><tbody><tr><td><code>Asker</code></td><td><a href="#user"><code>User</code></a></td><td>Stores the user data type.</td><td></td></tr><tr><td><code>Open</code></td><td><code>yes/no</code></td><td>Stores the request status.</td><td></td></tr><tr><td><code>Template</code></td><td><a href="#template"><code>Template</code></a></td><td>Stores the template data type.</td><td></td></tr></tbody></table>

### Sales

This data type is used to store sales proprieties.

<table data-full-width="false"><thead><tr><th>Field name</th><th>Type</th><th>Notes</th><th data-hidden>Notes</th></tr></thead><tbody><tr><td><code>invoices</code></td><td><code>number</code></td><td>Stores the number of invoices.</td><td></td></tr><tr><td><code>offline</code></td><td><code>number</code></td><td>Stores the number of offline users.</td><td></td></tr><tr><td><code>online</code></td><td><code>number</code></td><td>Stores the number of online users.</td><td></td></tr><tr><td><code>projects</code></td><td><code>number</code></td><td>Stores the number of projects.</td><td></td></tr><tr><td><code>Queries</code></td><td><code>number</code></td><td>Stores the number of queries.</td><td></td></tr><tr><td><code>Returns</code></td><td><code>number</code></td><td>Stores the number of returns.</td><td></td></tr><tr><td><code>revenue</code></td><td><code>number</code></td><td>Stores the number of revenues.</td><td></td></tr><tr><td><code>users</code></td><td><code>number</code></td><td>Stores the number of total users amount.</td><td></td></tr></tbody></table>

### Tickets

This data type is used to store ticket proprieties.

<table data-full-width="false"><thead><tr><th>Field name</th><th>Type</th><th>Notes</th><th data-hidden>Notes</th></tr></thead><tbody><tr><td><code>date</code></td><td><code>text</code></td><td>Stores the ticket's date of creation.</td><td></td></tr><tr><td><code>destination</code></td><td><code>text</code></td><td>Stores the ticket's destinaation</td><td></td></tr><tr><td><code>initials</code></td><td><code>text</code></td><td>Stores the client initial.</td><td></td></tr><tr><td><code>name</code></td><td><code>text</code></td><td>Stores the client name.</td><td></td></tr><tr><td><code>place</code></td><td><code>text</code></td><td>Stores the state where order was placed.</td><td></td></tr><tr><td><code>status</code></td><td><code>text</code></td><td>Stores the ticket status.</td><td></td></tr><tr><td><code>time</code></td><td><code>text</code></td><td>Stores the ticket's time of creation.</td><td></td></tr></tbody></table>

### Transaction&#x20;

This data type is used to store transaction proprieties.

<table data-full-width="false"><thead><tr><th>Field name</th><th>Type</th><th>Notes</th><th data-hidden>Notes</th></tr></thead><tbody><tr><td><code>Amount</code></td><td><code>number</code></td><td>Stores the transaction numbers.</td><td></td></tr><tr><td><code>Template</code></td><td><a href="#template"><code>Template</code></a></td><td>Stores the template data type.</td><td></td></tr></tbody></table>

### User

This data type is used to store user proprieties.

<table data-full-width="false"><thead><tr><th>Field name</th><th>Type</th><th>Notes</th><th data-hidden>Notes</th></tr></thead><tbody><tr><td><code>Demo</code></td><td><code>yes/no</code></td><td>Stores the user type information.</td><td></td></tr><tr><td><code>first name</code></td><td><code>text</code></td><td>Stores the user first name.</td><td></td></tr><tr><td><code>image</code></td><td><code>image</code></td><td>Stores the user image.</td><td></td></tr><tr><td><code>last name</code></td><td><code>text</code></td><td>Stores the user last name.</td><td></td></tr><tr><td><code>phone</code></td><td><code>text</code></td><td>Stores the user phone number.</td><td></td></tr></tbody></table>

### Video

This data type is used to store video proprieties.

<table data-full-width="false"><thead><tr><th>Field name</th><th>Type</th><th>Notes</th><th data-hidden>Notes</th></tr></thead><tbody><tr><td><code>link</code></td><td><code>Get YouTube video</code></td><td>Uses Youtube Videos plugin.</td><td></td></tr><tr><td><code>video</code></td><td><code>text</code></td><td>Stores the video title.</td><td></td></tr></tbody></table>

***

<div align="left"><figure><img src="/files/FWlRXstCc6xNIGrX5Eqb" alt="" width="188"><figcaption></figcaption></figure></div>

The template is sold as is, although additional modifications can be discussed. Feel free to contact us for any inquiries and we’ll be happy to find a solution for your ideas – <http://eazycode.com/>

**Hire us:**

<img src="/files/4KPeHfCmX2d7zpd83cXF" alt="" data-size="line"> <https://www.fiverr.com/share/qQoDQZ>\ <img src="/files/h0wwtUMwvDod7FamBfIq" alt="" data-size="line"> <https://www.upwork.com/freelancers/~01c1a4cbef44ecb5f1>\
\
**Follow us:**

<img src="/files/67Q41mFR1z6nYwKvqJeJ" alt="" data-size="line"> <https://www.facebook.com/eazycode>\ <img src="/files/6MUa0InxwRzMoVStCu5q" alt="" data-size="line"> <https://twitter.com/ezcode_official>  \ <img src="/files/IUseXDC1i7zfvZcQgctx" alt="" data-size="line"> <https://www.instagram.com/eazycodecom/>\ <img src="/files/0dMeGeMKCjKSGW3RBP6P" alt="" data-size="line"> <https://www.linkedin.com/company/eazycodecom/>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.eazycode.com/ezcode-documentation/templates/ez-dashboard-+-openai.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.