+
+
+
);
}
diff --git a/src/Content/LeftPanel/Chart.jsx b/src/Content/LeftPanel/Chart.jsx
new file mode 100644
index 0000000..8097bef
--- /dev/null
+++ b/src/Content/LeftPanel/Chart.jsx
@@ -0,0 +1,55 @@
+import { useEffect, useRef } from "react";
+import { Chart, Layout } from "@dhx/trial-suite";
+import { getData } from "../../data";
+
+export default function ChartComponent() {
+ const { seriesData, hotelsData } = getData();
+ const layout_container = useRef(null);
+
+ useEffect(() => {
+ const layout = new Layout(layout_container.current, {
+ type: "line",
+ rows: [
+ {
+ header: "HOTELS",
+ height: "500px",
+ padding: 40,
+ id: "chart",
+ collapsable: true
+ }
+ ]
+ });
+
+ const chart = new Chart(null, {
+ data: hotelsData,
+ type: "bar",
+ scales: {
+ bottom: {
+ text: "month"
+ },
+ left: {
+ maxTicks: 10,
+ max: 100,
+ min: 0
+ }
+ },
+ series: seriesData,
+ legend: {
+ series: ["A", "B", "all"],
+ halign: "right",
+ valign: "top",
+ itemPadding: 20,
+ margin: 40
+ }
+ });
+
+ layout.getCell("chart").attach(chart);
+
+ return () => {
+ layout?.destructor();
+ chart?.destructor();
+ };
+ }, []);
+
+ return ;
+}
diff --git a/src/Content/LeftPanel/Grid.jsx b/src/Content/LeftPanel/Grid.jsx
index bc6336c..1ab4fc7 100644
--- a/src/Content/LeftPanel/Grid.jsx
+++ b/src/Content/LeftPanel/Grid.jsx
@@ -1,14 +1,15 @@
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useRef } from "react";
import { Grid, Pagination } from "@dhx/trial-suite";
-import store from "../../store";
+import { getData } from "../../data";
export default function GridComponent() {
- let [grid, setGrid] = useState(null);
- const gNode = useRef(null);
- const pNode = useRef(null);
+ const { gridData } = getData();
+ const grid_container = useRef(null);
+ const pagination_container = useRef(null);
useEffect(() => {
const gridConfig = {
+ data: gridData,
autoWidth: true,
columns: [
{
@@ -58,29 +59,22 @@ export default function GridComponent() {
editable: true,
};
- const grid = new Grid(gNode.current, gridConfig);
- const paginator = new Pagination(pNode.current, {
+ const grid = new Grid(grid_container.current, gridConfig);
+ const pagination = new Pagination(pagination_container.current, {
pageSize: 20,
data: grid.data,
});
- // Initialize grid and paginator here
- setGrid(grid);
- // Cleanup
return () => {
grid?.destructor();
- paginator?.destructor();
+ pagination?.destructor();
};
}, []);
- useEffect(() => {
- grid?.data.parse(store.gridDataset);
- }, [grid]);
-
return (
-
-
-
+
+
+
);
}
diff --git a/src/Content/LeftPanel/LeftContent.jsx b/src/Content/LeftPanel/LeftContent.jsx
index 40ee448..ef4b293 100644
--- a/src/Content/LeftPanel/LeftContent.jsx
+++ b/src/Content/LeftPanel/LeftContent.jsx
@@ -1,26 +1,23 @@
-import Accardion from "./Accardion";
-import Calendars from "./Calendars";
-import Grid from "./Grid";
-import Ribbon from "./Ribbon";
-import SlidersLayout from "./SlidersLayout";
-import TicketsDataview from "./TicketsDataview";
-import Tree from "./Tree";
+import ChartComponent from "./Chart";
+import CalendarsComponent from "./Calendars";
+import GridComponent from "./Grid";
+import RibbonComponent from "./Ribbon";
+import SlidersLayoutComponent from "./SlidersLayout";
+import TicketsDataviewComponent from "./TicketsDataview";
+import TreeComponent from "./Tree";
-export default function LeftContent() {
+export default function LeftContentComponent() {
return (
-
-
-
+
);
}
diff --git a/src/Content/LeftPanel/Ribbon.jsx b/src/Content/LeftPanel/Ribbon.jsx
index a4fc22d..b180e44 100644
--- a/src/Content/LeftPanel/Ribbon.jsx
+++ b/src/Content/LeftPanel/Ribbon.jsx
@@ -1,32 +1,19 @@
import { useEffect, useRef, useState } from "react";
import { Ribbon } from "@dhx/trial-suite";
-import store from "../../store";
+import { getData } from "../../data";
export default function RibbonComponent() {
- const node = useRef(null);
- let [ribbon, setRibbon] = useState(null);
+ const { ribbonData } = getData();
+ const ribbon_container = useRef(null);
useEffect(() => {
- const ribbon = new Ribbon(node.current, {
- css: "dhx_widget--bordered",
+ const ribbon = new Ribbon(ribbon_container.current, {
+ data: ribbonData,
+ css: "dhx_widget--bordered"
});
- setRibbon(ribbon);
-
- // Cleanup
return () => ribbon.destructor();
}, []);
- useEffect(() => {
- if (!ribbon) return;
- ribbon.data.parse(store.ribbonData);
- }, [ribbon]);
-
- return (
-
- );
+ return ;
}
diff --git a/src/Content/LeftPanel/SlidersLayout.jsx b/src/Content/LeftPanel/SlidersLayout.jsx
index 11efaa3..23096ad 100644
--- a/src/Content/LeftPanel/SlidersLayout.jsx
+++ b/src/Content/LeftPanel/SlidersLayout.jsx
@@ -1,13 +1,13 @@
import { useEffect, useRef } from "react";
import { Layout, Slider } from "@dhx/trial-suite";
-export default function SlidersLayout() {
- const node = useRef(null);
+export default function SlidersLayoutComponent() {
+ const layout_container = useRef(null);
const tickTemplate = (value) => `${value}`;
useEffect(() => {
- const layout = new Layout(node.current, {
+ const layout = new Layout(layout_container.current, {
type: "none",
height: "fit-content",
cols: [
@@ -18,49 +18,48 @@ export default function SlidersLayout() {
{
padding: 10,
height: "content",
- id: "slider1",
+ id: "slider1"
},
{
padding: 10,
height: "content",
- id: "slider2",
+ id: "slider2"
},
{
padding: 10,
height: "content",
- id: "slider3",
+ id: "slider3"
},
{
padding: 10,
height: "content",
- id: "slider4",
- },
- ],
+ id: "slider4"
+ }
+ ]
},
{
padding: "10px 20px",
height: "260px",
width: "20%",
- id: "slider5",
- },
- ],
+ id: "slider5"
+ }
+ ]
});
+
const slider1 = new Slider(null, {
min: 0,
max: 40,
- step: 1,
+ step: 1
});
- // Slider 2 initialization
const slider2 = new Slider(null, {
min: 0,
max: 40,
range: true,
value: [10, 20],
- step: 1,
+ step: 1
});
- // Slider 3 initialization
const slider3 = new Slider(null, {
min: 0,
max: 40,
@@ -69,19 +68,17 @@ export default function SlidersLayout() {
value: [0, 20],
tick: 1,
majorTick: 5,
- tickTemplate,
+ tickTemplate
});
- // Slider 4 initialization
const slider4 = new Slider(null, {
min: 0,
max: 40,
step: 10,
range: true,
- value: [0, 20],
+ value: [0, 20]
});
- // Slider 5 initialization
const slider5 = new Slider(null, {
mode: "vertical",
range: true,
@@ -91,17 +88,18 @@ export default function SlidersLayout() {
tick: 1,
majorTick: 5,
value: [0, 20],
- tickTemplate,
+ tickTemplate
});
- // Attached all sliders in sliderLayout, which is main layout's cell
+ // Attached all sliders in layout, which is main layout's cell
layout.getCell("slider1").attach(slider1);
layout.getCell("slider2").attach(slider2);
layout.getCell("slider3").attach(slider3);
layout.getCell("slider4").attach(slider4);
layout.getCell("slider5").attach(slider5);
- return () => layout.destructor();
+
+ return () => layout?.destructor();
}, []);
- return ;
+ return ;
}
diff --git a/src/Content/LeftPanel/TicketsDataview.jsx b/src/Content/LeftPanel/TicketsDataview.jsx
index a0e2860..956a1e1 100644
--- a/src/Content/LeftPanel/TicketsDataview.jsx
+++ b/src/Content/LeftPanel/TicketsDataview.jsx
@@ -1,11 +1,11 @@
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useRef } from "react";
import { DataView } from "@dhx/trial-suite";
import "@dhx/trial-suite/codebase/suite.min.css";
-import store from "../../store";
+import { getData } from "../../data";
-export default function TicketsDataview() {
- const node = useRef(null);
- let [dataview, setDataview] = useState(null);
+export default function TicketsDataviewComponent() {
+ const { ticketsDataviewData } = getData();
+ const dataview_container = useRef(null);
const template = ({ title, text, type, avatar, name, comments, time }) => `
+
-
@@ -31,20 +31,15 @@ export default function TicketsDataview() {
`;
useEffect(() => {
- const dataview = new DataView(node.current, {
+ const dataview = new DataView(dataview_container.current, {
+ data: ticketsDataviewData,
template,
itemsInRow: 2,
- css: "dhx_dataview_template_a_box",
+ css: "dhx_dataview_template_a_box"
});
- setDataview(dataview);
- // Cleanup
- return () => dataview.destructor();
+
+ return () => dataview?.destructor();
}, []);
- useEffect(() => {
- if (!dataview) return;
- dataview.data.parse(store.ticketsDataviewData);
- }, [dataview]);
-
- return ;
+ return ;
}
diff --git a/src/Content/LeftPanel/Tree.jsx b/src/Content/LeftPanel/Tree.jsx
index f318217..a855837 100644
--- a/src/Content/LeftPanel/Tree.jsx
+++ b/src/Content/LeftPanel/Tree.jsx
@@ -1,29 +1,29 @@
import { useEffect, useRef, useState } from "react";
import { Tree } from "@dhx/trial-suite";
-import store from "../../store";
+import { getData } from "../../data";
-export default function TreeComponent() {
- const node = useRef(null);
+export default function TreeComponent () {
+ const { treeData } = getData();
+ const tree_container = useRef(null);
let [tree, setTree] = useState(null);
useEffect(() => {
- const tree = new Tree(node.current, {
+ const tree = new Tree(tree_container.current, {
checkbox: true,
editable: true,
keyNavigation: true,
- dragMode: "both",
+ dragMode: "both"
});
setTree(tree);
- // Cleanup
- return () => tree.destructor();
+ return () => tree?.destructor();
}, []);
useEffect(() => {
if (!tree) return;
- tree.data.parse(store.treeData);
+ tree.data.parse(treeData);
}, [tree]);
- return ;
+ return ;
}
diff --git a/src/Content/RightPanel/ButtonsForm.jsx b/src/Content/RightPanel/ButtonsForm.jsx
index c2e3f23..0bddfaa 100644
--- a/src/Content/RightPanel/ButtonsForm.jsx
+++ b/src/Content/RightPanel/ButtonsForm.jsx
@@ -1,11 +1,11 @@
import { useEffect, useRef } from "react";
import { Form } from "@dhx/trial-suite";
-export default function ButtonsForm() {
- const node = useRef(null);
+export default function ButtonsFormComponent() {
+ const buttons_form_container = useRef(null);
useEffect(() => {
- const form = new Form(node.current, {
+ const form = new Form(buttons_form_container.current, {
height: "content",
padding: 40,
align: "between",
@@ -42,8 +42,8 @@ export default function ButtonsForm() {
full: true,
disabled: true,
size: "small",
- },
- ],
+ }
+ ]
},
{
align: "between",
@@ -77,8 +77,8 @@ export default function ButtonsForm() {
full: true,
size: "small",
disabled: true,
- },
- ],
+ }
+ ]
},
{
align: "between",
@@ -112,8 +112,8 @@ export default function ButtonsForm() {
full: true,
size: "small",
disabled: true,
- },
- ],
+ }
+ ]
},
{
align: "between",
@@ -147,15 +147,14 @@ export default function ButtonsForm() {
full: true,
size: "small",
disabled: true,
- },
- ],
- },
- ],
+ }
+ ]
+ }
+ ]
});
- // Cleanup
- return () => form.destructor();
+ return () => form?.destructor();
}, []);
- return ;
+ return ;
}
diff --git a/src/Content/RightPanel/Chart.jsx b/src/Content/RightPanel/Chart.jsx
index abecbd9..08de6a1 100644
--- a/src/Content/RightPanel/Chart.jsx
+++ b/src/Content/RightPanel/Chart.jsx
@@ -1,13 +1,14 @@
import { useEffect, useRef, useState } from "react";
import { Chart } from "@dhx/trial-suite";
-import store from "../../store";
+import { getData } from "../../data";
export default function ChartComponent() {
- const node = useRef(null);
- let [chart, setChart] = useState(null);
+ const chart_container = useRef(null);
useEffect(() => {
- const chart = new Chart(node.current, {
+ const { chartData } = getData();
+ const chart = new Chart(chart_container.current, {
+ data: chartData,
type: "pie",
series: [
{
@@ -17,32 +18,24 @@ export default function ChartComponent() {
opacity: "opacity",
text: "month",
stroke: "var(--dhx-background-primary)",
- strokeWidth: 0,
- },
+ strokeWidth: 0
+ }
],
legend: {
values: {
id: "value",
text: "id",
- color: "color",
+ color: "color"
},
// monochrome: "#0288D1",
align: "right",
valign: "middle",
- width: 30,
- },
+ width: 30
+ }
});
- setChart(chart);
- chart.data.parse(store.chartData);
- // Cleanup
- return () => chart.destructor();
+ return () => chart?.destructor();
}, []);
- useEffect(() => {
- if (!chart) return;
- chart.data.parse(store.chartData);
- }, [chart]);
-
- return ;
+ return ;
}
diff --git a/src/Content/RightPanel/Colorpicker.jsx b/src/Content/RightPanel/Colorpicker.jsx
index b8a9615..97e7402 100644
--- a/src/Content/RightPanel/Colorpicker.jsx
+++ b/src/Content/RightPanel/Colorpicker.jsx
@@ -1,8 +1,8 @@
import { useEffect, useRef } from "react";
import { Colorpicker, awaitRedraw } from "@dhx/trial-suite";
-export default function ColorpickerComponent() {
- const node = useRef(null);
+export default function ColorpickerComponent () {
+ const colorpicker_container = useRef(null);
const hexToHSLChema = (HEX) => {
let r = 0,
@@ -50,7 +50,7 @@ export default function ColorpickerComponent() {
};
useEffect(() => {
- const colorpicker = new Colorpicker(node.current, {
+ const colorpicker = new Colorpicker(colorpicker_container.current, {
mode: "picker",
});
@@ -65,14 +65,13 @@ export default function ColorpickerComponent() {
});
// return () => colorpicker.destructor();
- return () => awaitRedraw().then(() => colorpicker.destructor());
+ return () => awaitRedraw().then(() => colorpicker?.destructor());
}, []);
return (
);
}
diff --git a/src/Content/RightPanel/Form.jsx b/src/Content/RightPanel/Form.jsx
index a55ccdd..67bbe4e 100644
--- a/src/Content/RightPanel/Form.jsx
+++ b/src/Content/RightPanel/Form.jsx
@@ -1,36 +1,13 @@
import { useEffect, useRef } from "react";
import { Form } from "@dhx/trial-suite";
+import { getData } from "../../data";
export default function FormComponent() {
- const node = useRef(null);
-
- const country = [
- {
- id: "austria",
- value: "Austria",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/at.png",
- },
- {
- value: "Belarus",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/by.png",
- },
- {
- value: "Belgium",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/be.png",
- },
- {
- value: "Bulgaria",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/bg.png",
- },
- {
- value: "Cyprus",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/cy.png",
- },
- // ... add more countries here
- ];
+ const { country } = getData();
+ const form_container = useRef(null);
useEffect(() => {
- const form = new Form(node.current, {
+ const form = new Form(form_container.current, {
padding: 40,
width: "auto",
rows: [
@@ -54,8 +31,8 @@ export default function FormComponent() {
label: "Surname",
placeholder: "Type text",
required: true,
- },
- ],
+ }
+ ]
},
{
name: "country",
@@ -107,9 +84,9 @@ export default function FormComponent() {
type: "radioButton",
text: "Advanced",
value: "2",
- },
- ],
- },
+ }
+ ]
+ }
},
{
name: "backgroundColor",
@@ -156,18 +133,15 @@ export default function FormComponent() {
id: "4",
type: "checkbox",
text: "Your option",
- },
- ],
- },
- },
- ],
+ }
+ ]
+ }
+ }
+ ]
});
- // Parse the data into the form
-
- // Cleanup
- return () => form.destructor();
+ return () => form?.destructor();
}, []);
- return ;
+ return ;
}
diff --git a/src/Content/RightPanel/MessageDataview.jsx b/src/Content/RightPanel/MessageDataview.jsx
index d0e347d..6ed0a38 100644
--- a/src/Content/RightPanel/MessageDataview.jsx
+++ b/src/Content/RightPanel/MessageDataview.jsx
@@ -1,9 +1,10 @@
import { useEffect, useRef } from "react";
import { DataView } from "@dhx/trial-suite";
-import store from "../../store";
+import { getData } from "../../data";
-export default function MessageDataview() {
- const node = useRef(null);
+export default function MessageDataviewComponent() {
+ const { messageDataviewData } = getData();
+ const dataview_container = useRef(null);
function template({ mail, name, avatar, status, delivered }) {
return `
@@ -22,17 +23,15 @@ export default function MessageDataview() {
}
useEffect(() => {
- const dataview = new DataView(node.current, {
+ const dataview = new DataView(dataview_container.current, {
+ data: messageDataviewData,
template,
itemsInRow: 2,
- css: "dhx_dataview_template_b_box",
+ css: "dhx_dataview_template_b_box"
});
- dataview.data.parse(store.messageDataviewData);
-
- // Cleanup
- return () => dataview.destructor();
+ return () => dataview?.destructor();
}, []);
- return ;
+ return ;
}
diff --git a/src/Content/RightPanel/RightContent.jsx b/src/Content/RightPanel/RightContent.jsx
index 8ed0563..3127f19 100644
--- a/src/Content/RightPanel/RightContent.jsx
+++ b/src/Content/RightPanel/RightContent.jsx
@@ -1,20 +1,17 @@
-import ButtonsForm from "./ButtonsForm";
-import Chart from "./Chart";
-import Colorpicker from "./Colorpicker";
+import ButtonsFormComponent from "./ButtonsForm";
+import ChartComponent from "./Chart";
+import ColorpickerComponent from "./Colorpicker";
import FormComponent from "./Form";
-import MessageDataview from "./MessageDataview";
+import MessageDataviewComponent from "./MessageDataview";
-export default function RightContent() {
+export default function RightContentComponent() {
return (
-
-
diff --git a/src/store.js b/src/store.js
deleted file mode 100644
index 1e31ab0..0000000
--- a/src/store.js
+++ /dev/null
@@ -1,1427 +0,0 @@
-const sidebarData = [
- {
- id: "toggle",
- css: "toggle-button",
- icon: "mdi mdi-backburger",
- },
- {
- type: "customHTML",
- id: "userInfo",
- css: "user-info_item",
- html:
- "
+
);
}
diff --git a/src/MainContainer.jsx b/src/MainContainer.jsx
deleted file mode 100644
index 5389555..0000000
--- a/src/MainContainer.jsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import Content from "./Content/Content";
-import Tabbar from "./Tabbar";
-import Toolbar from "./Toolbar";
-
-const MainContainer = () => {
- return (
-
-
- );
-};
-
-export default MainContainer;
diff --git a/src/MainContainer/MainContainer.jsx b/src/MainContainer/MainContainer.jsx
new file mode 100644
index 0000000..da0aa37
--- /dev/null
+++ b/src/MainContainer/MainContainer.jsx
@@ -0,0 +1,13 @@
+import ContentComponent from "../Content/Content";
+import TabbarComponent from "./Tabbar";
+import ToolbarComponent from "./Toolbar";
+
+export default function MainContainerComponent () {
+ return (
+
+
+ );
+};
diff --git a/src/Tabbar.jsx b/src/MainContainer/Tabbar.jsx
similarity index 61%
rename from src/Tabbar.jsx
rename to src/MainContainer/Tabbar.jsx
index 86479a8..e292ec7 100644
--- a/src/Tabbar.jsx
+++ b/src/MainContainer/Tabbar.jsx
@@ -1,11 +1,11 @@
import { useEffect, useRef } from "react";
import { Tabbar } from "@dhx/trial-suite";
-const TabbarComponent = () => {
- const node = useRef(null);
+export default function TabbarComponent () {
+ const tabbar_container = useRef(null);
useEffect(() => {
- const newTabbar = new Tabbar(node.current, {
+ const tabbar = new Tabbar(tabbar_container.current, {
tabAlign: "center",
disabled: ["reports", "tickets", "users", "applications"],
views: [
@@ -13,16 +13,14 @@ const TabbarComponent = () => {
{ id: "reports", tab: "Reports" },
{ id: "tickets", tab: "Tickets" },
{ id: "users", tab: "Users" },
- { id: "applications", tab: "Applications" },
- ],
+ { id: "applications", tab: "Applications" }
+ ]
});
return () => {
- newTabbar.destructor();
+ tabbar?.destructor();
};
}, []);
- return ;
+ return ;
};
-
-export default TabbarComponent;
diff --git a/src/Toolbar.jsx b/src/MainContainer/Toolbar.jsx
similarity index 73%
rename from src/Toolbar.jsx
rename to src/MainContainer/Toolbar.jsx
index a40b81b..26f53e6 100644
--- a/src/Toolbar.jsx
+++ b/src/MainContainer/Toolbar.jsx
@@ -1,17 +1,20 @@
import { useRef, useEffect, useState } from "react";
import { Toolbar, setTheme } from "@dhx/trial-suite";
-import store from "./store";
+import { getData } from "../data";
-const ToolbarComponent = () => {
+export default function ToolbarComponent () {
+ const { toolbarData } = getData();
let [theme, setThemeState] = useState("light");
let [contrast, setContrast] = useState(false);
let [toolbar, setToolbar] = useState(null);
- const node = useRef(null);
+ const toolbar_container = useRef(null);
useEffect(() => {
- const toolbar = new Toolbar(node.current, {});
+ const toolbar = new Toolbar(toolbar_container.current, {
+ data: toolbarData
+ });
setToolbar(toolbar);
- return () => toolbar.destructor();
+ return () => toolbar?.destructor();
}, []);
useEffect(() => {
@@ -35,14 +38,12 @@ const ToolbarComponent = () => {
}
}
});
- toolbar.data.parse(store.toolbarData);
+ toolbar.data.parse(toolbarData);
}, [toolbar]);
useEffect(() => {
setTheme(`${contrast ? "contrast-" : ""}${theme}`);
}, [contrast, theme]);
- return ;
+ return ;
};
-
-export default ToolbarComponent;
diff --git a/src/Sidebar.jsx b/src/Sidebar/Sidebar.jsx
similarity index 60%
rename from src/Sidebar.jsx
rename to src/Sidebar/Sidebar.jsx
index 492b4ba..683efc7 100644
--- a/src/Sidebar.jsx
+++ b/src/Sidebar/Sidebar.jsx
@@ -1,16 +1,17 @@
import { useEffect, useRef, useState } from "react";
import { Sidebar } from "@dhx/trial-suite";
-import store from "./store";
+import { getData } from "../data";
-const SidebarComponent = () => {
+export default function SidebarComponent () {
+ const { sidebarData } = getData();
let [sidebar, setSidebar] = useState(null);
- const nodeRef = useRef(null);
+ const sidebar_container = useRef(null);
useEffect(() => {
- const sidebar = new Sidebar(nodeRef.current, {});
+ const sidebar = new Sidebar(sidebar_container.current, {});
setSidebar(sidebar);
return () => {
- sidebar.destructor();
+ sidebar?.destructor();
};
}, []);
@@ -25,10 +26,8 @@ const SidebarComponent = () => {
: "mdi mdi-backburger";
}
});
- sidebar.data.parse(store.sidebarData);
+ sidebar.data.parse(sidebarData);
}, [sidebar]);
- return ;
+ return ;
};
-
-export default SidebarComponent;
diff --git a/src/data.js b/src/data.js
new file mode 100644
index 0000000..4a7f300
--- /dev/null
+++ b/src/data.js
@@ -0,0 +1,1450 @@
+export function getData() {
+
+ const sidebarData = [
+ {
+ id: "toggle",
+ css: "toggle-button",
+ icon: "mdi mdi-backburger",
+ },
+ {
+ type: "customHTML",
+ id: "userInfo",
+ css: "user-info_item",
+ html:
+ "" +
+ "
" +
+ "" +
+ "" +
+ "
",
+ },
+ {
+ type: "separator",
+ },
+ {
+ id: "today",
+ value: "Today",
+ icon: "mdi mdi-calendar-star",
+ },
+ {
+ id: "overdue",
+ value: "Overdue",
+ icon: "mdi mdi-calendar-start",
+ },
+ {
+ id: "unscheduled",
+ value: "Unscheduled",
+ icon: "mdi mdi-calendar-blank",
+ },
+ {
+ type: "separator",
+ },
+ {
+ id: "projects",
+ value: "Projects",
+ icon: "mdi mdi-folder-star-outline",
+ items: [
+ {
+ id: "project1",
+ value: "Project 1",
+ icon: "mdi mdi-plus",
+ },
+ {
+ id: "project2",
+ value: "Project 2",
+ icon: "mdi mdi-plus",
+ },
+ {
+ id: "project3",
+ value: "Project 3",
+ icon: "mdi mdi-plus",
+ },
+ ],
+ },
+ {
+ type: "separator",
+ },
+ {
+ id: "assigned",
+ value: "Assigned",
+ icon: "mdi mdi-account-search-outline",
+ items: [
+ {
+ id: "person1",
+ value: "Person 1",
+ icon: "mdi mdi-plus",
+ },
+ {
+ id: "person2",
+ value: "Person 2",
+ icon: "mdi mdi-plus",
+ },
+ {
+ id: "Person3",
+ value: "person 3",
+ icon: "mdi mdi-plus",
+ },
+ ],
+ },
+ {
+ type: "separator",
+ },
+ {
+ type: "spacer",
+ },
+ {
+ type: "separator",
+ },
+ {
+ id: "notification",
+ value: "Notification",
+ count: 18,
+ icon: "mdi mdi-bell-outline",
+ countColor: "#D60000",
+ },
+ {
+ id: "configuration",
+ value: "Configuration",
+ icon: "mdi mdi-tune",
+ items: [
+ {
+ id: "myAccount",
+ value: "My Account",
+ icon: "mdi mdi-account-settings",
+ },
+ {
+ id: "general",
+ value: "General Configuration",
+ icon: "mdi mdi-tune",
+ },
+ ],
+ },
+ ];
+
+ const toolbarData = [
+ {
+ id: "topMenuButton",
+ type: "button",
+ value: "Toolbar button",
+ view: "flat",
+ icon: "dxi dxi-plus",
+ size: "small",
+ circle: true,
+ color: "secondary",
+ },
+
+ {
+ type: "spacer",
+ },
+ {
+ id: "theme",
+ circle: true,
+ icon: "mdi mdi-weather-night",
+ checked: false,
+ },
+
+ {
+ id: "contrast",
+ twoState: true,
+ active: false,
+ icon: "mdi mdi-contrast-circle",
+ },
+ {
+ id: "avatar",
+ type: "imageButton",
+ src: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_63.jpg",
+ count: 15,
+ },
+ ];
+
+ const gridData = [
+ {
+ time: new Date("Jan 28, 2021"),
+ nights: 7,
+ price: 68,
+ contactPerson: "Yoshio Slater",
+ contactEmail: "phasellus.fermentum@yahoo.net",
+ },
+ {
+ time: new Date("Apr 13, 2021"),
+ nights: 6,
+ price: 66,
+ contactPerson: "Christopher Kirk",
+ contactEmail: "posuere.vulputate.lacus@outlook.org",
+ },
+ {
+ time: new Date("Jan 31, 2021"),
+ nights: 15,
+ price: 64,
+ contactPerson: "Jana Meyers",
+ contactEmail: "mollis@aol.edu",
+ },
+ {
+ time: new Date("Feb 22, 2021"),
+ nights: 11,
+ price: 57,
+ contactPerson: "Sawyer Smith",
+ contactEmail: "lorem.ipsum.sodales@icloud.org",
+ },
+ {
+ time: new Date("Feb 3, 2021"),
+ nights: 10,
+ price: 68,
+ contactPerson: "Gabriel Gates",
+ contactEmail: "sollicitudin.a@icloud.com",
+ },
+ {
+ time: new Date("Apr 6, 2021"),
+ nights: 7,
+ price: 67,
+ contactPerson: "Emily Reynolds",
+ contactEmail: "suspendisse.aliquet@outlook.edu",
+ },
+ {
+ time: new Date("May 22, 2021"),
+ nights: 11,
+ price: 70,
+ contactPerson: "Xavier Middleton",
+ contactEmail: "eu@icloud.net",
+ },
+ {
+ time: new Date("Jul 9, 2021"),
+ nights: 11,
+ price: 61,
+ contactPerson: "Tamara Raymond",
+ contactEmail: "vivamus@yahoo.ca",
+ },
+ {
+ time: new Date("Jun 15, 2021"),
+ nights: 15,
+ price: 61,
+ contactPerson: "Jolene Lamb",
+ contactEmail: "vulputate.posuere@outlook.org",
+ },
+ {
+ time: new Date("Jan 31, 2021"),
+ nights: 15,
+ price: 70,
+ contactPerson: "David Wilkins",
+ contactEmail: "ipsum@icloud.org",
+ },
+ {
+ time: new Date("Aug 16, 2021"),
+ nights: 8,
+ price: 65,
+ contactPerson: "Nita Padilla",
+ contactEmail: "quis.pede@google.net",
+ },
+ {
+ time: new Date("Apr 4, 2021"),
+ nights: 13,
+ price: 73,
+ contactPerson: "Martha Fischer",
+ contactEmail: "elit.pharetra@hotmail.org",
+ },
+ {
+ time: new Date("Jun 7, 2021"),
+ nights: 14,
+ price: 69,
+ contactPerson: "Rudyard Powell",
+ contactEmail: "ridiculus.mus@aol.com",
+ },
+ {
+ time: new Date("Sep 14, 2021"),
+ nights: 11,
+ price: 68,
+ contactPerson: "Clementine Mercer",
+ contactEmail: "nec@aol.couk",
+ },
+ {
+ time: new Date("Aug 3, 2021"),
+ nights: 14,
+ price: 74,
+ contactPerson: "Hu Pace",
+ contactEmail: "phasellus.dolor.elit@hotmail.net",
+ },
+ {
+ time: new Date("Sep 12, 2021"),
+ nights: 13,
+ price: 73,
+ contactPerson: "Petra James",
+ contactEmail: "luctus.et@yahoo.net",
+ },
+ {
+ time: new Date("Aug 4, 2021"),
+ nights: 14,
+ price: 60,
+ contactPerson: "Chaney Henson",
+ contactEmail: "in.condimentum@protonmail.net",
+ },
+ {
+ time: new Date("Jul 15, 2021"),
+ nights: 13,
+ price: 59,
+ contactPerson: "Cole Wallace",
+ contactEmail: "in.aliquet@outlook.org",
+ },
+ {
+ time: new Date("Jan 15, 2021"),
+ nights: 13,
+ price: 57,
+ contactPerson: "Emmanuel Miller",
+ contactEmail: "pharetra.quisque.ac@aol.edu",
+ },
+ {
+ time: new Date("Sep 18, 2021"),
+ nights: 9,
+ price: 69,
+ contactPerson: "Uriah Ayers",
+ contactEmail: "nunc.sed.pede@google.net",
+ },
+ {
+ time: new Date("May 24, 2021"),
+ nights: 13,
+ price: 73,
+ contactPerson: "Illiana Floyd",
+ contactEmail: "rhoncus.nullam@hotmail.ca",
+ },
+ {
+ time: new Date("Jul 4, 2021"),
+ nights: 3,
+ price: 61,
+ contactPerson: "Cara Merritt",
+ contactEmail: "sagittis@yahoo.ca",
+ },
+ {
+ time: new Date("Jan 27, 2021"),
+ nights: 4,
+ price: 70,
+ contactPerson: "Yetta O'Neill",
+ contactEmail: "nullam@aol.net",
+ },
+ {
+ time: new Date("Aug 16, 2021"),
+ nights: 9,
+ price: 63,
+ contactPerson: "Chadwick Holland",
+ contactEmail: "congue.turpis@aol.net",
+ },
+ {
+ time: new Date("Mar 22, 2021"),
+ nights: 3,
+ price: 59,
+ contactPerson: "Nell Copeland",
+ contactEmail: "nulla.vulputate@google.edu",
+ },
+ {
+ time: new Date("Feb 26, 2021"),
+ nights: 14,
+ price: 74,
+ contactPerson: "Vivian Fletcher",
+ contactEmail: "bibendum.ullamcorper@icloud.net",
+ },
+ {
+ time: new Date("Jun 26, 2021"),
+ nights: 11,
+ price: 58,
+ contactPerson: "Tatiana Mckay",
+ contactEmail: "ac.arcu@hotmail.ca",
+ },
+ {
+ time: new Date("Jul 30, 2021"),
+ nights: 9,
+ price: 61,
+ contactPerson: "Jamalia Mitchell",
+ contactEmail: "sed.id.risus@aol.edu",
+ },
+ {
+ time: new Date("Jun 15, 2021"),
+ nights: 13,
+ price: 66,
+ contactPerson: "Hedy Kirby",
+ contactEmail: "praesent.luctus@hotmail.com",
+ },
+ {
+ time: new Date("Aug 16, 2021"),
+ nights: 9,
+ price: 67,
+ contactPerson: "Solomon Ortiz",
+ contactEmail: "sem.vitae@yahoo.com",
+ },
+ {
+ time: new Date("Jul 15, 2021"),
+ nights: 3,
+ price: 67,
+ contactPerson: "Adrienne O'Neill",
+ contactEmail: "dapibus.gravida@protonmail.ca",
+ },
+ {
+ time: new Date("Jul 1, 2021"),
+ nights: 7,
+ price: 72,
+ contactPerson: "Alma Rollins",
+ contactEmail: "orci@protonmail.ca",
+ },
+ {
+ time: new Date("Jul 22, 2021"),
+ nights: 11,
+ price: 74,
+ contactPerson: "Gregory Boyd",
+ contactEmail: "curabitur.consequat.lectus@yahoo.net",
+ },
+ {
+ time: new Date("Apr 24, 2021"),
+ nights: 8,
+ price: 74,
+ contactPerson: "Damon Curry",
+ contactEmail: "aliquam.fringilla@hotmail.org",
+ },
+ {
+ time: new Date("Mar 8, 2021"),
+ nights: 5,
+ price: 63,
+ contactPerson: "Imelda Tyson",
+ contactEmail: "nunc.interdum@icloud.edu",
+ },
+ {
+ time: new Date("Apr 13, 2021"),
+ nights: 8,
+ price: 57,
+ contactPerson: "Yen Cannon",
+ contactEmail: "nunc@outlook.couk",
+ },
+ {
+ time: new Date("Feb 27, 2021"),
+ nights: 5,
+ price: 73,
+ contactPerson: "Olivia Patterson",
+ contactEmail: "posuere@google.org",
+ },
+ {
+ time: new Date("Apr 21, 2021"),
+ nights: 13,
+ price: 59,
+ contactPerson: "Ramona Logan",
+ contactEmail: "est@hotmail.ca",
+ },
+ {
+ time: new Date("Jul 8, 2021"),
+ nights: 4,
+ price: 67,
+ contactPerson: "Risa Butler",
+ contactEmail: "suscipit.est.ac@yahoo.net",
+ },
+ {
+ time: new Date("Feb 19, 2021"),
+ nights: 3,
+ price: 71,
+ contactPerson: "Charity Price",
+ contactEmail: "lobortis.augue.scelerisque@protonmail.couk",
+ },
+ {
+ time: new Date("Feb 23, 2021"),
+ nights: 15,
+ price: 59,
+ contactPerson: "Rina Macdonald",
+ contactEmail: "quisque@outlook.com",
+ },
+ {
+ time: new Date("Apr 8, 2021"),
+ nights: 16,
+ price: 68,
+ contactPerson: "Travis Steele",
+ contactEmail: "natoque.penatibus@google.edu",
+ },
+ {
+ time: new Date("Apr 30, 2021"),
+ nights: 9,
+ price: 64,
+ contactPerson: "Deanna Reyes",
+ contactEmail: "dolor@hotmail.net",
+ },
+ {
+ time: new Date("Feb 15, 2021"),
+ nights: 14,
+ price: 67,
+ contactPerson: "Faith Rojas",
+ contactEmail: "sagittis.duis.gravida@hotmail.edu",
+ },
+ {
+ time: new Date("Mar 1, 2021"),
+ nights: 4,
+ price: 73,
+ contactPerson: "Hyacinth Fuentes",
+ contactEmail: "nec.urna@google.com",
+ },
+ {
+ time: new Date("May 9, 2021"),
+ nights: 2,
+ price: 71,
+ contactPerson: "Brenden Sloan",
+ contactEmail: "a.dui.cras@google.net",
+ },
+ {
+ time: new Date("Feb 17, 2021"),
+ nights: 8,
+ price: 74,
+ contactPerson: "Nora Bruce",
+ contactEmail: "egestas.blandit@google.org",
+ },
+ {
+ time: new Date("Jul 20, 2021"),
+ nights: 10,
+ price: 68,
+ contactPerson: "Riley Harrison",
+ contactEmail: "lacus@outlook.ca",
+ },
+ {
+ time: new Date("May 24, 2021"),
+ nights: 12,
+ price: 74,
+ contactPerson: "Mariko Lewis",
+ contactEmail: "volutpat@google.couk",
+ },
+ {
+ time: new Date("Feb 16, 2021"),
+ nights: 2,
+ price: 68,
+ contactPerson: "Todd Jones",
+ contactEmail: "cras.eu.tellus@icloud.org",
+ },
+ {
+ time: new Date("Apr 21, 2021"),
+ nights: 16,
+ price: 69,
+ contactPerson: "Tasha Mcleod",
+ contactEmail: "quam.a@protonmail.org",
+ },
+ {
+ time: new Date("Aug 28, 2021"),
+ nights: 10,
+ price: 74,
+ contactPerson: "Fletcher Bird",
+ contactEmail: "tincidunt@yahoo.com",
+ },
+ {
+ time: new Date("Apr 19, 2021"),
+ nights: 3,
+ price: 57,
+ contactPerson: "Alan Murphy",
+ contactEmail: "tempor.erat.neque@icloud.com",
+ },
+ {
+ time: new Date("Jan 26, 2021"),
+ nights: 13,
+ price: 71,
+ contactPerson: "Hakeem Booth",
+ contactEmail: "porttitor.tellus@hotmail.com",
+ },
+ {
+ time: new Date("Feb 4, 2021"),
+ nights: 11,
+ price: 67,
+ contactPerson: "Courtney Sellers",
+ contactEmail: "penatibus.et@outlook.ca",
+ },
+ {
+ time: new Date("Jul 28, 2021"),
+ nights: 11,
+ price: 67,
+ contactPerson: "Frances Mcdonald",
+ contactEmail: "libero.dui@aol.org",
+ },
+ {
+ time: new Date("Jan 24, 2021"),
+ nights: 6,
+ price: 72,
+ contactPerson: "Devin Mathews",
+ contactEmail: "proin.nisl.sem@google.couk",
+ },
+ {
+ time: new Date("May 13, 2021"),
+ nights: 10,
+ price: 71,
+ contactPerson: "Arden Sparks",
+ contactEmail: "arcu.sed@google.edu",
+ },
+ {
+ time: new Date("Apr 1, 2021"),
+ nights: 2,
+ price: 55,
+ contactPerson: "Roanna Calhoun",
+ contactEmail: "nisi.aenean@outlook.edu",
+ },
+ {
+ time: new Date("Feb 9, 2021"),
+ nights: 12,
+ price: 66,
+ contactPerson: "Zeph Ellis",
+ contactEmail: "nonummy.ipsum.non@aol.org",
+ },
+ {
+ time: new Date("Jun 10, 2021"),
+ nights: 10,
+ price: 73,
+ contactPerson: "Harriet Lee",
+ contactEmail: "mauris.quis@aol.edu",
+ },
+ {
+ time: new Date("Jan 25, 2021"),
+ nights: 7,
+ price: 60,
+ contactPerson: "Chanda Gay",
+ contactEmail: "egestas.blandit.nam@yahoo.ca",
+ },
+ {
+ time: new Date("Aug 22, 2021"),
+ nights: 12,
+ price: 56,
+ contactPerson: "Tiger Roman",
+ contactEmail: "et@aol.org",
+ },
+ {
+ time: new Date("Aug 6, 2021"),
+ nights: 13,
+ price: 59,
+ contactPerson: "Yuri Booker",
+ contactEmail: "pretium.neque@google.ca",
+ },
+ {
+ time: new Date("Apr 12, 2021"),
+ nights: 7,
+ price: 56,
+ contactPerson: "Blaze Gardner",
+ contactEmail: "sed.leo@aol.ca",
+ },
+ {
+ time: new Date("Jun 13, 2021"),
+ nights: 4,
+ price: 73,
+ contactPerson: "Vanna Nieves",
+ contactEmail: "amet.consectetuer@google.edu",
+ },
+ {
+ time: new Date("May 8, 2021"),
+ nights: 4,
+ price: 58,
+ contactPerson: "Malik Mullins",
+ contactEmail: "pede.nec@yahoo.org",
+ },
+ {
+ time: new Date("Apr 25, 2021"),
+ nights: 5,
+ price: 60,
+ contactPerson: "Sarah Goodwin",
+ contactEmail: "condimentum.eget@icloud.couk",
+ },
+ {
+ time: new Date("Jan 13, 2021"),
+ nights: 5,
+ price: 73,
+ contactPerson: "Nigel Griffin",
+ contactEmail: "ornare@yahoo.edu",
+ },
+ {
+ time: new Date("Mar 25, 2021"),
+ nights: 6,
+ price: 67,
+ contactPerson: "Lysandra Gregory",
+ contactEmail: "in.ornare@protonmail.edu",
+ },
+ {
+ time: new Date("Sep 28, 2021"),
+ nights: 8,
+ price: 70,
+ contactPerson: "Breanna Williamson",
+ contactEmail: "nulla.integer@yahoo.ca",
+ },
+ {
+ time: new Date("Feb 10, 2021"),
+ nights: 5,
+ price: 61,
+ contactPerson: "Edward Black",
+ contactEmail: "lobortis.mauris@icloud.couk",
+ },
+ {
+ time: new Date("Jul 28, 2021"),
+ nights: 5,
+ price: 56,
+ contactPerson: "Imogene Stafford",
+ contactEmail: "donec@icloud.net",
+ },
+ {
+ time: new Date("Aug 7, 2021"),
+ nights: 15,
+ price: 56,
+ contactPerson: "Clark Garcia",
+ contactEmail: "sed.leo@hotmail.com",
+ },
+ {
+ time: new Date("Sep 6, 2021"),
+ nights: 6,
+ price: 55,
+ contactPerson: "Uma Tate",
+ contactEmail: "quam@hotmail.ca",
+ },
+ {
+ time: new Date("Apr 9, 2021"),
+ nights: 16,
+ price: 60,
+ contactPerson: "Kennedy Newton",
+ contactEmail: "et.ultrices@protonmail.com",
+ },
+ {
+ time: new Date("Jan 17, 2021"),
+ nights: 13,
+ price: 55,
+ contactPerson: "Tana Fields",
+ contactEmail: "felis.ullamcorper@aol.org",
+ },
+ {
+ time: new Date("Sep 13, 2021"),
+ nights: 9,
+ price: 67,
+ contactPerson: "Chelsea Burke",
+ contactEmail: "nisi@aol.couk",
+ },
+ {
+ time: new Date("Aug 6, 2021"),
+ nights: 13,
+ price: 66,
+ contactPerson: "Samantha Hood",
+ contactEmail: "ac.eleifend@outlook.ca",
+ },
+ {
+ time: new Date("Jan 5, 2021"),
+ nights: 11,
+ price: 65,
+ contactPerson: "Chester Wooten",
+ contactEmail: "id.nunc.interdum@protonmail.net",
+ },
+ {
+ time: new Date("Jun 8, 2021"),
+ nights: 14,
+ price: 69,
+ contactPerson: "Vaughan Hopkins",
+ contactEmail: "morbi.metus.vivamus@google.couk",
+ },
+ {
+ time: new Date("Jan 28, 2021"),
+ nights: 6,
+ price: 58,
+ contactPerson: "Sydnee Montoya",
+ contactEmail: "donec.feugiat@protonmail.edu",
+ },
+ {
+ time: new Date("Jun 4, 2021"),
+ nights: 11,
+ price: 73,
+ contactPerson: "Kelly Espinoza",
+ contactEmail: "ligula.donec@aol.com",
+ },
+ {
+ time: new Date("May 18, 2021"),
+ nights: 2,
+ price: 70,
+ contactPerson: "Jonah Solis",
+ contactEmail: "orci.sem@google.couk",
+ },
+ {
+ time: new Date("Jun 8, 2021"),
+ nights: 3,
+ price: 58,
+ contactPerson: "Denton Taylor",
+ contactEmail: "metus.urna@protonmail.couk",
+ },
+ {
+ time: new Date("Feb 14, 2021"),
+ nights: 4,
+ price: 68,
+ contactPerson: "Keely Sutton",
+ contactEmail: "rutrum.non@hotmail.ca",
+ },
+ {
+ time: new Date("May 17, 2021"),
+ nights: 8,
+ price: 67,
+ contactPerson: "Derek Meyer",
+ contactEmail: "posuere.enim.nisl@aol.org",
+ },
+ {
+ time: new Date("Apr 18, 2021"),
+ nights: 9,
+ price: 73,
+ contactPerson: "Phelan Pena",
+ contactEmail: "ullamcorper.duis@google.net",
+ },
+ {
+ time: new Date("Apr 3, 2021"),
+ nights: 11,
+ price: 71,
+ contactPerson: "Maxwell Morales",
+ contactEmail: "eu.nibh@outlook.ca",
+ },
+ {
+ time: new Date("Aug 1, 2021"),
+ nights: 6,
+ price: 74,
+ contactPerson: "Hope Hines",
+ contactEmail: "rutrum.fusce@hotmail.couk",
+ },
+ {
+ time: new Date("May 28, 2021"),
+ nights: 11,
+ price: 67,
+ contactPerson: "Cullen Woodward",
+ contactEmail: "luctus.et@protonmail.ca",
+ },
+ {
+ time: new Date("Feb 5, 2021"),
+ nights: 11,
+ price: 63,
+ contactPerson: "Leah Tanner",
+ contactEmail: "neque.sed@icloud.couk",
+ },
+ {
+ time: new Date("Sep 27, 2021"),
+ nights: 15,
+ price: 61,
+ contactPerson: "Fletcher Blair",
+ contactEmail: "non.bibendum@yahoo.edu",
+ },
+ {
+ time: new Date("Mar 17, 2021"),
+ nights: 15,
+ price: 63,
+ contactPerson: "Jennifer Daugherty",
+ contactEmail: "ligula@yahoo.couk",
+ },
+ {
+ time: new Date("Mar 29, 2021"),
+ nights: 10,
+ price: 66,
+ contactPerson: "Zeus Riggs",
+ contactEmail: "ac.metus.vitae@outlook.com",
+ },
+ {
+ time: new Date("Jan 5, 2021"),
+ nights: 6,
+ price: 64,
+ contactPerson: "Chelsea Talley",
+ contactEmail: "nec.quam.curabitur@yahoo.net",
+ },
+ {
+ time: new Date("May 12, 2021"),
+ nights: 15,
+ price: 71,
+ contactPerson: "Sara Key",
+ contactEmail: "elementum.lorem@aol.com",
+ },
+ {
+ time: new Date("Jun 27, 2021"),
+ nights: 4,
+ price: 70,
+ contactPerson: "Uriel Mcconnell",
+ contactEmail: "curabitur.consequat@outlook.net",
+ },
+ {
+ time: new Date("Jun 10, 2021"),
+ nights: 10,
+ price: 74,
+ contactPerson: "Molly Atkins",
+ contactEmail: "magna.et@protonmail.ca",
+ },
+ {
+ time: new Date("Feb 11, 2021"),
+ nights: 13,
+ price: 66,
+ contactPerson: "Dieter Burnett",
+ contactEmail: "ac.ipsum.phasellus@google.net",
+ },
+ ];
+
+ gridData.forEach((item) => (item.totalCost = item.nights * item.price));
+
+ const chartData = [
+ {
+ id: "Jan",
+ value: 44.33,
+ month: "Jan",
+ color: "var(--dhx-color-primary-light-active)",
+ opacity: 1,
+ },
+ {
+ id: "Feb",
+ value: 22.12,
+ month: "Feb",
+ color: "var(--dhx-color-primary-active)",
+ opacity: 0.4,
+ },
+ {
+ id: "Mar",
+ value: 53.21,
+ month: "Mar",
+ color: "var(--dhx-color-primary-disabled)",
+ opacity: 0.6,
+ },
+ {
+ id: "Apr",
+ value: 34.25,
+ month: "Apr",
+ color: "var(--dhx-color-primary-light-hover)",
+ opacity: 0.2,
+ },
+ ];
+
+ const hotelsData = [
+ { month: "Jan.", "Won deals": 35, "Lost deals": 14, "All deals": 40 },
+ { month: "Feb.", "Won deals": 80, "Lost deals": 59, "All deals": 94 },
+ { month: "Mar.", "Won deals": 35, "Lost deals": 62, "All deals": 48 },
+ { month: "Apr.", "Won deals": 45, "Lost deals": 13, "All deals": 59 },
+ { month: "May.", "Won deals": 45, "Lost deals": 22, "All deals": 59 },
+ { month: "Jun.", "Won deals": 74, "Lost deals": 52, "All deals": 90 },
+ { month: "Jul.", "Won deals": 85, "Lost deals": 78, "All deals": 98 },
+ ];
+
+ const seriesData = [
+ {
+ id: 'A',
+ value: 'Won deals',
+ color: 'none',
+ fill: 'var(--dhx-color-primary)',
+ showText: true,
+ showTextTemplate: (sum) => `$${sum}`
+ },
+ {
+ id: 'B',
+ value: 'Lost deals',
+ color: 'none',
+ fill: 'var(--dhx-color-primary-light-active)',
+ showText: true,
+ showTextTemplate: (sum) => `$${sum}`
+ },
+ {
+ id: 'all',
+ value: 'All deals',
+ color: 'none',
+ fill: 'var(--dhx-color-primary-disabled)',
+ type: 'area',
+ strokeWidth: 0
+ }
+ ];
+
+ const ribbonData = [
+ {
+ id: "fileBlock",
+ type: "block",
+ title: "File",
+ items: [
+ {
+ type: "block",
+ direction: "col",
+ items: [
+ {
+ value: "File",
+ id: "file",
+ icon: "mdi mdi-file-outline",
+ size: "small",
+ ribbonHeight: "auto",
+ },
+ {
+ type: "block",
+ items: [
+ { id: "folder", icon: "mdi mdi-folder-outline" },
+ { id: "cloud", icon: "mdi mdi-weather-cloudy" },
+ ],
+ },
+ ],
+ },
+ {
+ id: "save",
+ value: "Save",
+ icon: "mdi mdi-content-save",
+ size: "auto",
+ },
+ ],
+ },
+ {
+ type: "block",
+ title: "Action",
+ direction: "col",
+ items: [
+ { id: "copy", icon: "mdi mdi-content-copy", value: "Copy" },
+ { id: "cut", icon: "mdi mdi-content-cut", value: "Cut" },
+ ],
+ },
+ {
+ type: "block",
+ title: "Text",
+ items: [
+ {
+ type: "block",
+ direction: "col",
+ items: [
+ {
+ id: "left",
+ group: "align",
+ value: "Left",
+ icon: "mdi mdi-format-align-left",
+ },
+ {
+ id: "center",
+ group: "align",
+ value: "Center",
+ icon: "mdi mdi-format-align-center",
+ },
+ ],
+ },
+ {
+ type: "block",
+ direction: "col",
+ items: [
+ {
+ id: "right",
+ group: "align",
+ value: "Right",
+ icon: "mdi mdi-format-align-right",
+ },
+ {
+ id: "justify",
+ group: "align",
+ value: "Justify",
+ icon: "mdi mdi-format-align-justify",
+ },
+ ],
+ },
+ ],
+ },
+ {
+ type: "block",
+ title: "Output",
+ items: [
+ { id: "print", value: "Print", icon: "mdi mdi-printer", size: "auto" },
+ ],
+ },
+ ];
+
+ const ticketsDataviewData = [
+ {
+ title: "Ticket for Technical Support #T742",
+ text: "Need some support to add a new widget to Dashboard.",
+ type: "major",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_14.jpg",
+ name: "Margaret King",
+ comments: "0",
+ time: "12:15",
+ },
+ {
+ title: "Ticket for Sales Manager #S210",
+ text: "Can you tell me about pricing plans? I didn't understand the difference.",
+ type: "minor",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_13.jpg",
+ name: "Patsy Rhyne",
+ comments: "2",
+ time: "12:15",
+ },
+ {
+ title: "Ticket for Marketing Manager #M112",
+ text: "Want to mention our scheduler case study in your social media. The company has to be mentioned.",
+ type: "minor",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_06.jpg",
+ name: "Ravi Chakrabarti",
+ comments: "6",
+ time: "12:15",
+ },
+ {
+ title: "Ticket for Account Manager #A984",
+ text: "The trial period will end next week. Can you make a discount for us?",
+ type: "normal",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_04.jpg",
+ name: "Lucy Miller",
+ comments: "1",
+ time: "12:15",
+ },
+ {
+ title: "Ticket for QA #Q394",
+ text: "I found a bug. When I change the skin settings some buttons don't change.",
+ type: "major",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_10.jpg",
+ name: "Michael Willis",
+ comments: "4",
+ time: "12:15",
+ },
+ {
+ title: "Ticket for Technical Support #T741",
+ text: "I can't sign in to my account. Maybe I entered wrong password, help me!",
+ type: "major",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_11.jpg",
+ name: "Casey Garcia",
+ comments: "0",
+ time: "12:15",
+ },
+ ];
+
+ const treeData = [
+ {
+ value: "Books",
+ id: "Books",
+ opened: true,
+ items: [
+ {
+ value: "Thrillers",
+ id: "Thrillers",
+ opened: true,
+ items: [
+ {
+ value: "Bestsellers",
+ id: "Bestsellers",
+ checked: true,
+ items: [
+ {
+ value: "Lawrence Block",
+ id: "Lawrence Block",
+ },
+ ],
+ },
+ {
+ value: "Robert Crais",
+ id: "Robert Crais",
+ },
+ {
+ value: "Ian Rankin",
+ id: "Ian Rankin",
+ },
+ {
+ value: "James Johns",
+ id: "James Johns",
+ },
+ {
+ value: "Nancy Atherton",
+ id: "Nancy Atherton",
+ },
+ ],
+ },
+ {
+ value: "History",
+ id: "History",
+ items: [
+ {
+ value: "John Mack Faragher",
+ id: "John Mack Faragher",
+ },
+ {
+ value: "Jim Dwyer",
+ id: "Jim Dwyer",
+ },
+ {
+ value: "Larry Schweikart",
+ id: "Larry Schweikart",
+ },
+ {
+ value: "R. Lee Ermey",
+ id: "R. Lee Ermey",
+ },
+ ],
+ },
+ {
+ value: "Horror",
+ id: "Horror",
+ items: [
+ {
+ value: "Stephen King",
+ id: "Stephen King",
+ },
+ {
+ value: "Dan Brown",
+ id: "Dan Brown",
+ },
+ {
+ value: "Mary Janice Davidson",
+ id: "Mary Janice Davidson",
+ },
+ {
+ value: "Katie Macalister",
+ id: "Katie Macalister",
+ },
+ ],
+ },
+ {
+ value: "Fiction & Fantasy",
+ id: "Fiction & Fantasy",
+ items: [
+ {
+ value: "Audrey Niffenegger",
+ id: "Audrey Niffenegger",
+ },
+ {
+ value: "Philip Roth",
+ id: "Philip Roth",
+ },
+ ],
+ },
+ {
+ value: "Teens",
+ id: "Teens",
+ items: [
+ {
+ value: "Joss Whedon",
+ id: "Joss Whedon",
+ },
+ {
+ value: "Meg Cabot",
+ id: "Meg Cabot",
+ },
+ {
+ value: "Garth Nix",
+ id: "Garth Nix",
+ },
+ {
+ value: "Ann Brashares",
+ id: "Ann Brashares",
+ },
+ ],
+ },
+ ],
+ },
+ ];
+
+ const messageDataviewData = [
+ {
+ mail: "pmccoy@flowers.com",
+ name: "Philip Mccoy",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_02.jpg",
+ status: "online",
+ delivered: "0/3",
+ },
+ {
+ mail: "clores@flowers.com",
+ name: "Calvin Flores",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_04.jpg",
+ status: "online",
+ delivered: "0/3",
+ },
+ {
+ mail: "dwight@flowers.com",
+ name: "Dwight Jones",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_05.jpg",
+ status: "offline",
+ delivered: "0/3",
+ },
+ {
+ mail: "flores@flowers.com",
+ name: "Esther Flores",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_11.jpg",
+ status: "offline",
+ delivered: "3/3",
+ },
+ {
+ mail: "gregory@flowers.com",
+ name: "Gregory Bell",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_10.jpg",
+ status: "online",
+ delivered: "0/3",
+ },
+ {
+ mail: "guy@flowers.com",
+ name: "Guy Webb",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_06.jpg",
+ status: "online",
+ delivered: "2/3",
+ },
+ {
+ mail: "pat@flowers.com",
+ name: "Pat Cooper",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_15.jpg",
+ status: "offline",
+ delivered: "1/3",
+ },
+ {
+ name: "Shaeleigh Lopez",
+ mail: "odio@hotmail.com",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_01.jpg",
+ status: "online",
+ delivered: "0/3",
+ },
+ {
+ name: "Craig Pope",
+ mail: "fermentum.metus.aenean@icloud.edu",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_03.jpg",
+ status: "offline",
+ delivered: "1/3",
+ },
+ {
+ name: "Angela Clements",
+ mail: "nonummy.ut@icloud.net",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_07.jpg",
+ status: "offline",
+ delivered: "3/3",
+ },
+ {
+ name: "Howard Villarreal",
+ mail: "libero.donec.consectetuer@icloud.com",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_08.jpg",
+ status: "online",
+ delivered: "1/3",
+ },
+ {
+ name: "Prescott Stafford",
+ mail: "nunc.ac.sem@icloud.edu",
+ avatar:
+ "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_09.jpg",
+ status: "offline",
+ delivered: "2/3",
+ },
+ ];
+
+ const country = [
+ {
+ id: "austria",
+ value: "Austria",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/at.png",
+ },
+ {
+ value: "Belarus",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/by.png",
+ },
+ {
+ value: "Belgium",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/be.png",
+ },
+ {
+ value: "Bulgaria",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/bg.png",
+ },
+ {
+ value: "Cyprus",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/cy.png",
+ },
+ {
+ value: "Czech Republic",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/cz.png",
+ },
+ {
+ value: "Denmark",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/dk.png",
+ },
+ {
+ id: "estonia",
+ value: "Estonia",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/ee.png",
+ },
+ {
+ value: "Finland",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/fi.png",
+ },
+ {
+ value: "France",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/fr.png",
+ },
+ {
+ value: "Germany",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/de.png",
+ },
+ {
+ value: "Greece",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/gr.png",
+ },
+ {
+ value: "Hungary",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/hu.png",
+ },
+ {
+ value: "Ireland",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/ie.png",
+ },
+ {
+ value: "Italy",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/it.png",
+ },
+ {
+ value: "Latvia",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/lv.png",
+ },
+ {
+ value: "Lithuania",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/lt.png",
+ },
+ {
+ value: "Luxembourg",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/lu.png",
+ },
+ {
+ value: "Malta",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/mt.png",
+ },
+ {
+ value: "Netherlands",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/nl.png",
+ },
+ {
+ value: "Poland",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/pl.png",
+ },
+ {
+ value: "Portugal",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/pt.png",
+ },
+ {
+ value: "Russia",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/ru.png",
+ },
+ {
+ value: "Romania",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/ro.png",
+ },
+ {
+ value: "Slovakia",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/sk.png",
+ },
+ {
+ value: "Slovenia",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/si.png",
+ },
+ {
+ value: "Spain",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/es.png",
+ },
+ {
+ value: "Sweden",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/se.png",
+ },
+ {
+ value: "United Kingdom",
+ src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/gb.png",
+ },
+ ];
+
+ return{
+ gridData,
+ chartData,
+ hotelsData,
+ seriesData,
+ ribbonData,
+ ticketsDataviewData,
+ treeData,
+ messageDataviewData,
+ country,
+ sidebarData,
+ toolbarData
+ };
+}
diff --git a/src/index.css b/src/index.css
deleted file mode 100644
index 1e76557..0000000
--- a/src/index.css
+++ /dev/null
@@ -1,389 +0,0 @@
-* {
- box-sizing: border-box;
-}
-
-main {
- height: 100%;
- width: 100%;
- display: flex;
-}
-
-:root {
- font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
- line-height: 1.5;
- font-weight: 400;
- width: 100%;
- height: 100%;
-
-
- font-synthesis: none;
- text-rendering: optimizeLegibility;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
-}
-
-body {
- margin: 0;
- place-items: center;
- height: 100vh;
- width: 100vw;
-}
-
-#app {
- text-align: center;
- height: 100%;
- width: 100%;
-}
-
-.container {
- display: flex;
- flex-grow: 1;
- overflow: hidden;
-}
-
-.flex-cols {
- display: flex;
- flex-direction: column;
-}
-
-.grow {
- flex-grow: 1;
-}
-
-/* Grid styling */
-.contact_email {
- color: var(--dhx-color-primary);
-}
-
-.grid .dhx_grid-content {
- border: none;
-}
-
-/* Tickets dataview styling */
-.dhx_dataview_template_a {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-flex-direction: column;
- -ms-flex-direction: column;
- flex-direction: column;
- -webkit-justify-content: space-between;
- -ms-flex-pack: justify;
- justify-content: space-between;
- height: 100%;
-}
-
-.dhx_dataview_template_a_box {
- background-color: var(--dhx-background-secondary) !important;
-}
-
-.dhx_dataview_template_a_box .dhx_dataview-item__inner-html {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between;
- height: 100%;
-}
-
-.dhx_dataview_template_a_box .dhx_dataview-item {
- padding: 20px;
- -webkit-box-sizing: border-box;
- box-sizing: border-box;
- background-color: var(--dhx-background-primary);
- border: var(--dhx-border) !important;
- margin-bottom: 8px !important;
- margin-left: 8px !important;
-}
-
-.dhx_dataview_template_a_box .dhx_dataview-item:first-child {
- margin-left: 0 !important;
-}
-
-.dhx_dataview_template_a__head {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
-}
-
-.dhx_dataview_template_a__type {
- color: var(--dhx-font-color-contrast);
- text-align: center;
- text-transform: capitalize;
- width: 55px;
- height: 20px;
- border-radius: 2px;
-}
-
-.dhx_dataview_template_a__type--major {
- background-color: var(--dhx-color-danger);
-}
-
-.dhx_dataview_template_a__type--minor {
- background-color: var(--dhx-color-success);
-}
-
-.dhx_dataview_template_a__type--normal {
- background-color: var(--dhx-color-primary);
-}
-
-.dhx_dataview_template_a__content {
- padding-left: 16px;
- width: 80%;
-}
-
-.dhx_dataview_template_a__title {
- font: var(--dhx-font-family);
- font-weight: var(--dhx-font-weight-medium);
- padding-bottom: 8px;
-}
-
-.dhx_dataview_template_a__comment {
- display: -webkit-box;
- max-height: 40px;
- text-overflow: ellipsis;
- overflow: hidden;
- -webkit-box-orient: vertical;
- -webkit-line-clamp: 2;
-}
-
-.dhx_dataview_template_a__body {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-pack: justify;
- -ms-flex-pack: justify;
- justify-content: space-between;
- margin-top: 20px;
-}
-
-.dhx_dataview_template_a__person {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
-}
-
-.dhx_dataview_template_a__avatar {
- width: 40px;
- height: 40px;
- margin-left: 15px;
- margin-right: 16px;
- border-radius: 20px;
- background: center center/cover no-repeat #f7f7f7;
-}
-
-.dhx_dataview_template_a__name {
- color: var(--dhx-font-color-secondary);
-}
-
-.dhx_dataview_template_a__comments {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-align: end;
- -ms-flex-align: end;
- align-items: flex-end;
- line-height: 20px;
-}
-
-.dhx_dataview_template_a__comments .mdi:before {
- position: relative;
- top: 4px;
- color: var(--dhx-font-color-secondary);
- font-size: 20px;
- margin-left: 6px;
-}
-
-
-/* Message dataview styling */
-.dhx_dataview_template_b_box {
- background-color: var(--dhx-background-secondary) !important;
-}
-
-.dhx_dataview_template_b_box .dhx_dataview-item {
- padding: 0;
- border: var(--dhx-border) !important;
- border-radius: 6px;
- overflow: hidden;
- background-color: var(--dhx-background-primary);
- margin-bottom: 8px !important;
- margin-left: 8px !important;
-}
-
-.dhx_dataview_template_b_box .dhx_dataview-item:first-child {
- margin-left: 0 !important;
-}
-
-.dhx_dataview_template_b {
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- -webkit-box-orient: vertical;
- -webkit-box-direction: normal;
- -ms-flex-direction: column;
- flex-direction: column;
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- width: 100%;
- height: 200px;
-}
-
-.dhx_dataview_template_b__avatar {
- position: relative;
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- margin-top: 16px;
- width: 80px;
- height: 80px;
- border-radius: 50%;
- background-size: 80px 80px;
-}
-
-.dhx_dataview_template_b__status {
- position: absolute;
- bottom: 1px;
- right: 9px;
- width: 12px;
- height: 12px;
- border-radius: 50%;
- border: 1px solid var(--dhx-color-white);
- background-color: var(--dhx-color-success);
-}
-
-.dhx_dataview_template_b__status.dhx_dataview_template_b__status--offline {
- display: none;
-}
-
-.dhx_dataview_template_b__title,
-.dhx_dataview_template_b__name,
-.dhx_dataview_template_b__message-label {
- font: var(--dhx-font-family);
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
-}
-
-.dhx_dataview_template_b__title {
- font-weight: var(--dhx-font-weight-medium);
- margin-top: 8px;
-}
-
-.dhx_dataview_template_b__message {
- border-top: 1px solid var(--dhx-border-color);
- display: -webkit-box;
- display: -ms-flexbox;
- display: flex;
- height: 44px;
- width: 100%;
- -webkit-box-align: center;
- -ms-flex-align: center;
- align-items: center;
- -webkit-box-pack: center;
- -ms-flex-pack: center;
- justify-content: center;
- text-decoration: none;
- position: absolute;
- left: 0;
- bottom: 0;
-}
-
-.dhx_dataview_template_b__message-icon {
- margin-right: 4px;
- font-size: 16px;
- color: var(--dhx-color-primary);
-}
-
-.dhx_dataview_template_b__message-label {
- color: var(--dhx-color-primary);
- font-weight: 500;
-}
-
-/* Layout cell styling */
-.dhx_layout_cell--overflow-auto {
- overflow: auto;
-}
-
-.dhx_layout_cell--border-none {
- border: none !important;
-}
-
-.dhx_layout_cell-align_content--center {
- display: flex;
- align-items: center;
- justify-content: center;
-}
-
-/* Colorpicker cell styling */
-.dhx_layout_colorpicker_cell {
- display: flex;
- justify-content: center;
- padding: 40px 0;
- background-color: var(--dhx-background-primary);
-}
-
-/* Calendar/Timepicker cell styling */
-.dhx_layout_calendar_cell {
- display: flex;
- justify-content: center;
- align-items: center;
- min-width: 248px;
-}
-
-/* Sidebar custom elements styling */
-.dhx_navbar--vertical {
- overflow: hidden;
-}
-
-.user-info_container {
- padding-top: 8px;
- display: flex;
- flex-direction: column;
- justify-content: flex-start;
- align-items: center;
-}
-
-.user-info_avatar {
- height: 40px;
- width: 40px;
- border-radius: 100%;
-}
-
-.user-info_title {
- font-family: Roboto;
- font-style: normal;
- font-weight: 500;
- font-size: 16px;
- line-height: 24px;
- margin-top: 8px;
-}
-
-.user-info_contact {
- font-family: Roboto;
- font-style: normal;
- font-weight: normal;
- font-size: 14px;
- line-height: 20px;
- margin-bottom: 28px;
-}
-
-.dhx_sidebar--minimized .user-info_avatar {
- height: 30px;
- width: 30px;
-}
-
-.dhx_sidebar--minimized .user-info_title,
-.dhx_sidebar--minimized .user-info_contact {
- visibility: hidden;
-}
-
-.dhx-container,
-.dhx-container__widget {
- height: 100%;
-}
diff --git a/src/main.jsx b/src/main.jsx
index b91620d..e5ce6a7 100644
--- a/src/main.jsx
+++ b/src/main.jsx
@@ -1,7 +1,7 @@
import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App.jsx";
-import "./index.css";
+import "./App.css";
ReactDOM.createRoot(document.getElementById("root")).render(
" +
+ "" +
+ "" +
+ "" +
- "" +
- "" +
- "" +
- "
",
- },
- {
- type: "separator",
- },
- {
- id: "today",
- value: "Today",
- icon: "mdi mdi-calendar-star",
- },
- {
- id: "overdue",
- value: "Overdue",
- icon: "mdi mdi-calendar-start",
- },
- {
- id: "unscheduled",
- value: "Unscheduled",
- icon: "mdi mdi-calendar-blank",
- },
- {
- type: "separator",
- },
- {
- id: "projects",
- value: "Projects",
- icon: "mdi mdi-folder-star-outline",
- items: [
- {
- id: "project1",
- value: "Project 1",
- icon: "mdi mdi-plus",
- },
- {
- id: "project2",
- value: "Project 2",
- icon: "mdi mdi-plus",
- },
- {
- id: "project3",
- value: "Project 3",
- icon: "mdi mdi-plus",
- },
- ],
- },
- {
- type: "separator",
- },
- {
- id: "assigned",
- value: "Assigned",
- icon: "mdi mdi-account-search-outline",
- items: [
- {
- id: "person1",
- value: "Person 1",
- icon: "mdi mdi-plus",
- },
- {
- id: "person2",
- value: "Person 2",
- icon: "mdi mdi-plus",
- },
- {
- id: "Person3",
- value: "person 3",
- icon: "mdi mdi-plus",
- },
- ],
- },
- {
- type: "separator",
- },
- {
- type: "spacer",
- },
- {
- type: "separator",
- },
- {
- id: "notification",
- value: "Notification",
- count: 18,
- icon: "mdi mdi-bell-outline",
- countColor: "#D60000",
- },
- {
- id: "configuration",
- value: "Configuration",
- icon: "mdi mdi-tune",
- items: [
- {
- id: "myAccount",
- value: "My Account",
- icon: "mdi mdi-account-settings",
- },
- {
- id: "general",
- value: "General Configuration",
- icon: "mdi mdi-tune",
- },
- ],
- },
-];
-
-const toolbarData = [
- {
- id: "topMenuButton",
- type: "button",
- value: "Toolbar button",
- view: "flat",
- icon: "dxi dxi-plus",
- size: "small",
- circle: true,
- color: "secondary",
- },
-
- {
- type: "spacer",
- },
- {
- id: "theme",
- circle: true,
- icon: "mdi mdi-weather-night",
- checked: false,
- },
-
- {
- id: "contrast",
- twoState: true,
- active: false,
- icon: "mdi mdi-contrast-circle",
- },
- {
- id: "avatar",
- type: "imageButton",
- src: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_63.jpg",
- count: 15,
- },
-];
-
-// Data for grid
-const gridDataset = [
- {
- time: new Date("Jan 28, 2021"),
- nights: 7,
- price: 68,
- contactPerson: "Yoshio Slater",
- contactEmail: "phasellus.fermentum@yahoo.net",
- },
- {
- time: new Date("Apr 13, 2021"),
- nights: 6,
- price: 66,
- contactPerson: "Christopher Kirk",
- contactEmail: "posuere.vulputate.lacus@outlook.org",
- },
- {
- time: new Date("Jan 31, 2021"),
- nights: 15,
- price: 64,
- contactPerson: "Jana Meyers",
- contactEmail: "mollis@aol.edu",
- },
- {
- time: new Date("Feb 22, 2021"),
- nights: 11,
- price: 57,
- contactPerson: "Sawyer Smith",
- contactEmail: "lorem.ipsum.sodales@icloud.org",
- },
- {
- time: new Date("Feb 3, 2021"),
- nights: 10,
- price: 68,
- contactPerson: "Gabriel Gates",
- contactEmail: "sollicitudin.a@icloud.com",
- },
- {
- time: new Date("Apr 6, 2021"),
- nights: 7,
- price: 67,
- contactPerson: "Emily Reynolds",
- contactEmail: "suspendisse.aliquet@outlook.edu",
- },
- {
- time: new Date("May 22, 2021"),
- nights: 11,
- price: 70,
- contactPerson: "Xavier Middleton",
- contactEmail: "eu@icloud.net",
- },
- {
- time: new Date("Jul 9, 2021"),
- nights: 11,
- price: 61,
- contactPerson: "Tamara Raymond",
- contactEmail: "vivamus@yahoo.ca",
- },
- {
- time: new Date("Jun 15, 2021"),
- nights: 15,
- price: 61,
- contactPerson: "Jolene Lamb",
- contactEmail: "vulputate.posuere@outlook.org",
- },
- {
- time: new Date("Jan 31, 2021"),
- nights: 15,
- price: 70,
- contactPerson: "David Wilkins",
- contactEmail: "ipsum@icloud.org",
- },
- {
- time: new Date("Aug 16, 2021"),
- nights: 8,
- price: 65,
- contactPerson: "Nita Padilla",
- contactEmail: "quis.pede@google.net",
- },
- {
- time: new Date("Apr 4, 2021"),
- nights: 13,
- price: 73,
- contactPerson: "Martha Fischer",
- contactEmail: "elit.pharetra@hotmail.org",
- },
- {
- time: new Date("Jun 7, 2021"),
- nights: 14,
- price: 69,
- contactPerson: "Rudyard Powell",
- contactEmail: "ridiculus.mus@aol.com",
- },
- {
- time: new Date("Sep 14, 2021"),
- nights: 11,
- price: 68,
- contactPerson: "Clementine Mercer",
- contactEmail: "nec@aol.couk",
- },
- {
- time: new Date("Aug 3, 2021"),
- nights: 14,
- price: 74,
- contactPerson: "Hu Pace",
- contactEmail: "phasellus.dolor.elit@hotmail.net",
- },
- {
- time: new Date("Sep 12, 2021"),
- nights: 13,
- price: 73,
- contactPerson: "Petra James",
- contactEmail: "luctus.et@yahoo.net",
- },
- {
- time: new Date("Aug 4, 2021"),
- nights: 14,
- price: 60,
- contactPerson: "Chaney Henson",
- contactEmail: "in.condimentum@protonmail.net",
- },
- {
- time: new Date("Jul 15, 2021"),
- nights: 13,
- price: 59,
- contactPerson: "Cole Wallace",
- contactEmail: "in.aliquet@outlook.org",
- },
- {
- time: new Date("Jan 15, 2021"),
- nights: 13,
- price: 57,
- contactPerson: "Emmanuel Miller",
- contactEmail: "pharetra.quisque.ac@aol.edu",
- },
- {
- time: new Date("Sep 18, 2021"),
- nights: 9,
- price: 69,
- contactPerson: "Uriah Ayers",
- contactEmail: "nunc.sed.pede@google.net",
- },
- {
- time: new Date("May 24, 2021"),
- nights: 13,
- price: 73,
- contactPerson: "Illiana Floyd",
- contactEmail: "rhoncus.nullam@hotmail.ca",
- },
- {
- time: new Date("Jul 4, 2021"),
- nights: 3,
- price: 61,
- contactPerson: "Cara Merritt",
- contactEmail: "sagittis@yahoo.ca",
- },
- {
- time: new Date("Jan 27, 2021"),
- nights: 4,
- price: 70,
- contactPerson: "Yetta O'Neill",
- contactEmail: "nullam@aol.net",
- },
- {
- time: new Date("Aug 16, 2021"),
- nights: 9,
- price: 63,
- contactPerson: "Chadwick Holland",
- contactEmail: "congue.turpis@aol.net",
- },
- {
- time: new Date("Mar 22, 2021"),
- nights: 3,
- price: 59,
- contactPerson: "Nell Copeland",
- contactEmail: "nulla.vulputate@google.edu",
- },
- {
- time: new Date("Feb 26, 2021"),
- nights: 14,
- price: 74,
- contactPerson: "Vivian Fletcher",
- contactEmail: "bibendum.ullamcorper@icloud.net",
- },
- {
- time: new Date("Jun 26, 2021"),
- nights: 11,
- price: 58,
- contactPerson: "Tatiana Mckay",
- contactEmail: "ac.arcu@hotmail.ca",
- },
- {
- time: new Date("Jul 30, 2021"),
- nights: 9,
- price: 61,
- contactPerson: "Jamalia Mitchell",
- contactEmail: "sed.id.risus@aol.edu",
- },
- {
- time: new Date("Jun 15, 2021"),
- nights: 13,
- price: 66,
- contactPerson: "Hedy Kirby",
- contactEmail: "praesent.luctus@hotmail.com",
- },
- {
- time: new Date("Aug 16, 2021"),
- nights: 9,
- price: 67,
- contactPerson: "Solomon Ortiz",
- contactEmail: "sem.vitae@yahoo.com",
- },
- {
- time: new Date("Jul 15, 2021"),
- nights: 3,
- price: 67,
- contactPerson: "Adrienne O'Neill",
- contactEmail: "dapibus.gravida@protonmail.ca",
- },
- {
- time: new Date("Jul 1, 2021"),
- nights: 7,
- price: 72,
- contactPerson: "Alma Rollins",
- contactEmail: "orci@protonmail.ca",
- },
- {
- time: new Date("Jul 22, 2021"),
- nights: 11,
- price: 74,
- contactPerson: "Gregory Boyd",
- contactEmail: "curabitur.consequat.lectus@yahoo.net",
- },
- {
- time: new Date("Apr 24, 2021"),
- nights: 8,
- price: 74,
- contactPerson: "Damon Curry",
- contactEmail: "aliquam.fringilla@hotmail.org",
- },
- {
- time: new Date("Mar 8, 2021"),
- nights: 5,
- price: 63,
- contactPerson: "Imelda Tyson",
- contactEmail: "nunc.interdum@icloud.edu",
- },
- {
- time: new Date("Apr 13, 2021"),
- nights: 8,
- price: 57,
- contactPerson: "Yen Cannon",
- contactEmail: "nunc@outlook.couk",
- },
- {
- time: new Date("Feb 27, 2021"),
- nights: 5,
- price: 73,
- contactPerson: "Olivia Patterson",
- contactEmail: "posuere@google.org",
- },
- {
- time: new Date("Apr 21, 2021"),
- nights: 13,
- price: 59,
- contactPerson: "Ramona Logan",
- contactEmail: "est@hotmail.ca",
- },
- {
- time: new Date("Jul 8, 2021"),
- nights: 4,
- price: 67,
- contactPerson: "Risa Butler",
- contactEmail: "suscipit.est.ac@yahoo.net",
- },
- {
- time: new Date("Feb 19, 2021"),
- nights: 3,
- price: 71,
- contactPerson: "Charity Price",
- contactEmail: "lobortis.augue.scelerisque@protonmail.couk",
- },
- {
- time: new Date("Feb 23, 2021"),
- nights: 15,
- price: 59,
- contactPerson: "Rina Macdonald",
- contactEmail: "quisque@outlook.com",
- },
- {
- time: new Date("Apr 8, 2021"),
- nights: 16,
- price: 68,
- contactPerson: "Travis Steele",
- contactEmail: "natoque.penatibus@google.edu",
- },
- {
- time: new Date("Apr 30, 2021"),
- nights: 9,
- price: 64,
- contactPerson: "Deanna Reyes",
- contactEmail: "dolor@hotmail.net",
- },
- {
- time: new Date("Feb 15, 2021"),
- nights: 14,
- price: 67,
- contactPerson: "Faith Rojas",
- contactEmail: "sagittis.duis.gravida@hotmail.edu",
- },
- {
- time: new Date("Mar 1, 2021"),
- nights: 4,
- price: 73,
- contactPerson: "Hyacinth Fuentes",
- contactEmail: "nec.urna@google.com",
- },
- {
- time: new Date("May 9, 2021"),
- nights: 2,
- price: 71,
- contactPerson: "Brenden Sloan",
- contactEmail: "a.dui.cras@google.net",
- },
- {
- time: new Date("Feb 17, 2021"),
- nights: 8,
- price: 74,
- contactPerson: "Nora Bruce",
- contactEmail: "egestas.blandit@google.org",
- },
- {
- time: new Date("Jul 20, 2021"),
- nights: 10,
- price: 68,
- contactPerson: "Riley Harrison",
- contactEmail: "lacus@outlook.ca",
- },
- {
- time: new Date("May 24, 2021"),
- nights: 12,
- price: 74,
- contactPerson: "Mariko Lewis",
- contactEmail: "volutpat@google.couk",
- },
- {
- time: new Date("Feb 16, 2021"),
- nights: 2,
- price: 68,
- contactPerson: "Todd Jones",
- contactEmail: "cras.eu.tellus@icloud.org",
- },
- {
- time: new Date("Apr 21, 2021"),
- nights: 16,
- price: 69,
- contactPerson: "Tasha Mcleod",
- contactEmail: "quam.a@protonmail.org",
- },
- {
- time: new Date("Aug 28, 2021"),
- nights: 10,
- price: 74,
- contactPerson: "Fletcher Bird",
- contactEmail: "tincidunt@yahoo.com",
- },
- {
- time: new Date("Apr 19, 2021"),
- nights: 3,
- price: 57,
- contactPerson: "Alan Murphy",
- contactEmail: "tempor.erat.neque@icloud.com",
- },
- {
- time: new Date("Jan 26, 2021"),
- nights: 13,
- price: 71,
- contactPerson: "Hakeem Booth",
- contactEmail: "porttitor.tellus@hotmail.com",
- },
- {
- time: new Date("Feb 4, 2021"),
- nights: 11,
- price: 67,
- contactPerson: "Courtney Sellers",
- contactEmail: "penatibus.et@outlook.ca",
- },
- {
- time: new Date("Jul 28, 2021"),
- nights: 11,
- price: 67,
- contactPerson: "Frances Mcdonald",
- contactEmail: "libero.dui@aol.org",
- },
- {
- time: new Date("Jan 24, 2021"),
- nights: 6,
- price: 72,
- contactPerson: "Devin Mathews",
- contactEmail: "proin.nisl.sem@google.couk",
- },
- {
- time: new Date("May 13, 2021"),
- nights: 10,
- price: 71,
- contactPerson: "Arden Sparks",
- contactEmail: "arcu.sed@google.edu",
- },
- {
- time: new Date("Apr 1, 2021"),
- nights: 2,
- price: 55,
- contactPerson: "Roanna Calhoun",
- contactEmail: "nisi.aenean@outlook.edu",
- },
- {
- time: new Date("Feb 9, 2021"),
- nights: 12,
- price: 66,
- contactPerson: "Zeph Ellis",
- contactEmail: "nonummy.ipsum.non@aol.org",
- },
- {
- time: new Date("Jun 10, 2021"),
- nights: 10,
- price: 73,
- contactPerson: "Harriet Lee",
- contactEmail: "mauris.quis@aol.edu",
- },
- {
- time: new Date("Jan 25, 2021"),
- nights: 7,
- price: 60,
- contactPerson: "Chanda Gay",
- contactEmail: "egestas.blandit.nam@yahoo.ca",
- },
- {
- time: new Date("Aug 22, 2021"),
- nights: 12,
- price: 56,
- contactPerson: "Tiger Roman",
- contactEmail: "et@aol.org",
- },
- {
- time: new Date("Aug 6, 2021"),
- nights: 13,
- price: 59,
- contactPerson: "Yuri Booker",
- contactEmail: "pretium.neque@google.ca",
- },
- {
- time: new Date("Apr 12, 2021"),
- nights: 7,
- price: 56,
- contactPerson: "Blaze Gardner",
- contactEmail: "sed.leo@aol.ca",
- },
- {
- time: new Date("Jun 13, 2021"),
- nights: 4,
- price: 73,
- contactPerson: "Vanna Nieves",
- contactEmail: "amet.consectetuer@google.edu",
- },
- {
- time: new Date("May 8, 2021"),
- nights: 4,
- price: 58,
- contactPerson: "Malik Mullins",
- contactEmail: "pede.nec@yahoo.org",
- },
- {
- time: new Date("Apr 25, 2021"),
- nights: 5,
- price: 60,
- contactPerson: "Sarah Goodwin",
- contactEmail: "condimentum.eget@icloud.couk",
- },
- {
- time: new Date("Jan 13, 2021"),
- nights: 5,
- price: 73,
- contactPerson: "Nigel Griffin",
- contactEmail: "ornare@yahoo.edu",
- },
- {
- time: new Date("Mar 25, 2021"),
- nights: 6,
- price: 67,
- contactPerson: "Lysandra Gregory",
- contactEmail: "in.ornare@protonmail.edu",
- },
- {
- time: new Date("Sep 28, 2021"),
- nights: 8,
- price: 70,
- contactPerson: "Breanna Williamson",
- contactEmail: "nulla.integer@yahoo.ca",
- },
- {
- time: new Date("Feb 10, 2021"),
- nights: 5,
- price: 61,
- contactPerson: "Edward Black",
- contactEmail: "lobortis.mauris@icloud.couk",
- },
- {
- time: new Date("Jul 28, 2021"),
- nights: 5,
- price: 56,
- contactPerson: "Imogene Stafford",
- contactEmail: "donec@icloud.net",
- },
- {
- time: new Date("Aug 7, 2021"),
- nights: 15,
- price: 56,
- contactPerson: "Clark Garcia",
- contactEmail: "sed.leo@hotmail.com",
- },
- {
- time: new Date("Sep 6, 2021"),
- nights: 6,
- price: 55,
- contactPerson: "Uma Tate",
- contactEmail: "quam@hotmail.ca",
- },
- {
- time: new Date("Apr 9, 2021"),
- nights: 16,
- price: 60,
- contactPerson: "Kennedy Newton",
- contactEmail: "et.ultrices@protonmail.com",
- },
- {
- time: new Date("Jan 17, 2021"),
- nights: 13,
- price: 55,
- contactPerson: "Tana Fields",
- contactEmail: "felis.ullamcorper@aol.org",
- },
- {
- time: new Date("Sep 13, 2021"),
- nights: 9,
- price: 67,
- contactPerson: "Chelsea Burke",
- contactEmail: "nisi@aol.couk",
- },
- {
- time: new Date("Aug 6, 2021"),
- nights: 13,
- price: 66,
- contactPerson: "Samantha Hood",
- contactEmail: "ac.eleifend@outlook.ca",
- },
- {
- time: new Date("Jan 5, 2021"),
- nights: 11,
- price: 65,
- contactPerson: "Chester Wooten",
- contactEmail: "id.nunc.interdum@protonmail.net",
- },
- {
- time: new Date("Jun 8, 2021"),
- nights: 14,
- price: 69,
- contactPerson: "Vaughan Hopkins",
- contactEmail: "morbi.metus.vivamus@google.couk",
- },
- {
- time: new Date("Jan 28, 2021"),
- nights: 6,
- price: 58,
- contactPerson: "Sydnee Montoya",
- contactEmail: "donec.feugiat@protonmail.edu",
- },
- {
- time: new Date("Jun 4, 2021"),
- nights: 11,
- price: 73,
- contactPerson: "Kelly Espinoza",
- contactEmail: "ligula.donec@aol.com",
- },
- {
- time: new Date("May 18, 2021"),
- nights: 2,
- price: 70,
- contactPerson: "Jonah Solis",
- contactEmail: "orci.sem@google.couk",
- },
- {
- time: new Date("Jun 8, 2021"),
- nights: 3,
- price: 58,
- contactPerson: "Denton Taylor",
- contactEmail: "metus.urna@protonmail.couk",
- },
- {
- time: new Date("Feb 14, 2021"),
- nights: 4,
- price: 68,
- contactPerson: "Keely Sutton",
- contactEmail: "rutrum.non@hotmail.ca",
- },
- {
- time: new Date("May 17, 2021"),
- nights: 8,
- price: 67,
- contactPerson: "Derek Meyer",
- contactEmail: "posuere.enim.nisl@aol.org",
- },
- {
- time: new Date("Apr 18, 2021"),
- nights: 9,
- price: 73,
- contactPerson: "Phelan Pena",
- contactEmail: "ullamcorper.duis@google.net",
- },
- {
- time: new Date("Apr 3, 2021"),
- nights: 11,
- price: 71,
- contactPerson: "Maxwell Morales",
- contactEmail: "eu.nibh@outlook.ca",
- },
- {
- time: new Date("Aug 1, 2021"),
- nights: 6,
- price: 74,
- contactPerson: "Hope Hines",
- contactEmail: "rutrum.fusce@hotmail.couk",
- },
- {
- time: new Date("May 28, 2021"),
- nights: 11,
- price: 67,
- contactPerson: "Cullen Woodward",
- contactEmail: "luctus.et@protonmail.ca",
- },
- {
- time: new Date("Feb 5, 2021"),
- nights: 11,
- price: 63,
- contactPerson: "Leah Tanner",
- contactEmail: "neque.sed@icloud.couk",
- },
- {
- time: new Date("Sep 27, 2021"),
- nights: 15,
- price: 61,
- contactPerson: "Fletcher Blair",
- contactEmail: "non.bibendum@yahoo.edu",
- },
- {
- time: new Date("Mar 17, 2021"),
- nights: 15,
- price: 63,
- contactPerson: "Jennifer Daugherty",
- contactEmail: "ligula@yahoo.couk",
- },
- {
- time: new Date("Mar 29, 2021"),
- nights: 10,
- price: 66,
- contactPerson: "Zeus Riggs",
- contactEmail: "ac.metus.vitae@outlook.com",
- },
- {
- time: new Date("Jan 5, 2021"),
- nights: 6,
- price: 64,
- contactPerson: "Chelsea Talley",
- contactEmail: "nec.quam.curabitur@yahoo.net",
- },
- {
- time: new Date("May 12, 2021"),
- nights: 15,
- price: 71,
- contactPerson: "Sara Key",
- contactEmail: "elementum.lorem@aol.com",
- },
- {
- time: new Date("Jun 27, 2021"),
- nights: 4,
- price: 70,
- contactPerson: "Uriel Mcconnell",
- contactEmail: "curabitur.consequat@outlook.net",
- },
- {
- time: new Date("Jun 10, 2021"),
- nights: 10,
- price: 74,
- contactPerson: "Molly Atkins",
- contactEmail: "magna.et@protonmail.ca",
- },
- {
- time: new Date("Feb 11, 2021"),
- nights: 13,
- price: 66,
- contactPerson: "Dieter Burnett",
- contactEmail: "ac.ipsum.phasellus@google.net",
- },
-];
-
-gridDataset.forEach((item) => (item.totalCost = item.nights * item.price));
-
-// Data for chart
-const chartData = [
- {
- id: "Jan",
- value: 44.33,
- month: "Jan",
- color: "var(--dhx-color-primary-light-active)",
- opacity: 1,
- },
- {
- id: "Feb",
- value: 22.12,
- month: "Feb",
- color: "var(--dhx-color-primary-active)",
- opacity: 0.4,
- },
- {
- id: "Mar",
- value: 53.21,
- month: "Mar",
- color: "var(--dhx-color-primary-disabled)",
- opacity: 0.6,
- },
- {
- id: "Apr",
- value: 34.25,
- month: "Apr",
- color: "var(--dhx-color-primary-light-hover)",
- opacity: 0.2,
- },
-];
-
-// Hotels chart data
-const hotelsData = [
- { month: "Jan.", "Won deals": 35, "Lost deals": 14, "All deals": 40 },
- { month: "Feb.", "Won deals": 80, "Lost deals": 59, "All deals": 94 },
- { month: "Mar.", "Won deals": 35, "Lost deals": 62, "All deals": 48 },
- { month: "Apr.", "Won deals": 45, "Lost deals": 13, "All deals": 59 },
- { month: "May.", "Won deals": 45, "Lost deals": 22, "All deals": 59 },
- { month: "Jun.", "Won deals": 74, "Lost deals": 52, "All deals": 90 },
- { month: "Jul.", "Won deals": 85, "Lost deals": 78, "All deals": 98 },
-];
-
-// Ribbon data
-const ribbonData = [
- {
- id: "fileBlock",
- type: "block",
- title: "File",
- items: [
- {
- type: "block",
- direction: "col",
- items: [
- {
- value: "File",
- id: "file",
- icon: "mdi mdi-file-outline",
- size: "small",
- ribbonHeight: "auto",
- },
- {
- type: "block",
- items: [
- { id: "folder", icon: "mdi mdi-folder-outline" },
- { id: "cloud", icon: "mdi mdi-weather-cloudy" },
- ],
- },
- ],
- },
- {
- id: "save",
- value: "Save",
- icon: "mdi mdi-content-save",
- size: "auto",
- },
- ],
- },
- {
- type: "block",
- title: "Action",
- direction: "col",
- items: [
- { id: "copy", icon: "mdi mdi-content-copy", value: "Copy" },
- { id: "cut", icon: "mdi mdi-content-cut", value: "Cut" },
- ],
- },
- {
- type: "block",
- title: "Text",
- items: [
- {
- type: "block",
- direction: "col",
- items: [
- {
- id: "left",
- group: "align",
- value: "Left",
- icon: "mdi mdi-format-align-left",
- },
- {
- id: "center",
- group: "align",
- value: "Center",
- icon: "mdi mdi-format-align-center",
- },
- ],
- },
- {
- type: "block",
- direction: "col",
- items: [
- {
- id: "right",
- group: "align",
- value: "Right",
- icon: "mdi mdi-format-align-right",
- },
- {
- id: "justify",
- group: "align",
- value: "Justify",
- icon: "mdi mdi-format-align-justify",
- },
- ],
- },
- ],
- },
- {
- type: "block",
- title: "Output",
- items: [
- { id: "print", value: "Print", icon: "mdi mdi-printer", size: "auto" },
- ],
- },
-];
-
-// Tickets Dataview Data
-const ticketsDataviewData = [
- {
- title: "Ticket for Technical Support #T742",
- text: "Need some support to add a new widget to Dashboard.",
- type: "major",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_14.jpg",
- name: "Margaret King",
- comments: "0",
- time: "12:15",
- },
- {
- title: "Ticket for Sales Manager #S210",
- text: "Can you tell me about pricing plans? I didn't understand the difference.",
- type: "minor",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_13.jpg",
- name: "Patsy Rhyne",
- comments: "2",
- time: "12:15",
- },
- {
- title: "Ticket for Marketing Manager #M112",
- text: "Want to mention our scheduler case study in your social media. The company has to be mentioned.",
- type: "minor",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_06.jpg",
- name: "Ravi Chakrabarti",
- comments: "6",
- time: "12:15",
- },
- {
- title: "Ticket for Account Manager #A984",
- text: "The trial period will end next week. Can you make a discount for us?",
- type: "normal",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_04.jpg",
- name: "Lucy Miller",
- comments: "1",
- time: "12:15",
- },
- {
- title: "Ticket for QA #Q394",
- text: "I found a bug. When I change the skin settings some buttons don't change.",
- type: "major",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_10.jpg",
- name: "Michael Willis",
- comments: "4",
- time: "12:15",
- },
- {
- title: "Ticket for Technical Support #T741",
- text: "I can't sign in to my account. Maybe I entered wrong password, help me!",
- type: "major",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_11.jpg",
- name: "Casey Garcia",
- comments: "0",
- time: "12:15",
- },
-];
-
-// Data for tree
-const treeData = [
- {
- value: "Books",
- id: "Books",
- opened: true,
- items: [
- {
- value: "Thrillers",
- id: "Thrillers",
- opened: true,
- items: [
- {
- value: "Bestsellers",
- id: "Bestsellers",
- checked: true,
- items: [
- {
- value: "Lawrence Block",
- id: "Lawrence Block",
- },
- ],
- },
- {
- value: "Robert Crais",
- id: "Robert Crais",
- },
- {
- value: "Ian Rankin",
- id: "Ian Rankin",
- },
- {
- value: "James Johns",
- id: "James Johns",
- },
- {
- value: "Nancy Atherton",
- id: "Nancy Atherton",
- },
- ],
- },
- {
- value: "History",
- id: "History",
- items: [
- {
- value: "John Mack Faragher",
- id: "John Mack Faragher",
- },
- {
- value: "Jim Dwyer",
- id: "Jim Dwyer",
- },
- {
- value: "Larry Schweikart",
- id: "Larry Schweikart",
- },
- {
- value: "R. Lee Ermey",
- id: "R. Lee Ermey",
- },
- ],
- },
- {
- value: "Horror",
- id: "Horror",
- items: [
- {
- value: "Stephen King",
- id: "Stephen King",
- },
- {
- value: "Dan Brown",
- id: "Dan Brown",
- },
- {
- value: "Mary Janice Davidson",
- id: "Mary Janice Davidson",
- },
- {
- value: "Katie Macalister",
- id: "Katie Macalister",
- },
- ],
- },
- {
- value: "Fiction & Fantasy",
- id: "Fiction & Fantasy",
- items: [
- {
- value: "Audrey Niffenegger",
- id: "Audrey Niffenegger",
- },
- {
- value: "Philip Roth",
- id: "Philip Roth",
- },
- ],
- },
- {
- value: "Teens",
- id: "Teens",
- items: [
- {
- value: "Joss Whedon",
- id: "Joss Whedon",
- },
- {
- value: "Meg Cabot",
- id: "Meg Cabot",
- },
- {
- value: "Garth Nix",
- id: "Garth Nix",
- },
- {
- value: "Ann Brashares",
- id: "Ann Brashares",
- },
- ],
- },
- ],
- },
-];
-
-const messageDataviewData = [
- {
- mail: "pmccoy@flowers.com",
- name: "Philip Mccoy",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_02.jpg",
- status: "online",
- delivered: "0/3",
- },
- {
- mail: "clores@flowers.com",
- name: "Calvin Flores",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_04.jpg",
- status: "online",
- delivered: "0/3",
- },
- {
- mail: "dwight@flowers.com",
- name: "Dwight Jones",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_05.jpg",
- status: "offline",
- delivered: "0/3",
- },
- {
- mail: "flores@flowers.com",
- name: "Esther Flores",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_11.jpg",
- status: "offline",
- delivered: "3/3",
- },
- {
- mail: "gregory@flowers.com",
- name: "Gregory Bell",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_10.jpg",
- status: "online",
- delivered: "0/3",
- },
- {
- mail: "guy@flowers.com",
- name: "Guy Webb",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_06.jpg",
- status: "online",
- delivered: "2/3",
- },
- {
- mail: "pat@flowers.com",
- name: "Pat Cooper",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_15.jpg",
- status: "offline",
- delivered: "1/3",
- },
- {
- name: "Shaeleigh Lopez",
- mail: "odio@hotmail.com",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_01.jpg",
- status: "online",
- delivered: "0/3",
- },
- {
- name: "Craig Pope",
- mail: "fermentum.metus.aenean@icloud.edu",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_03.jpg",
- status: "offline",
- delivered: "1/3",
- },
- {
- name: "Angela Clements",
- mail: "nonummy.ut@icloud.net",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_07.jpg",
- status: "offline",
- delivered: "3/3",
- },
- {
- name: "Howard Villarreal",
- mail: "libero.donec.consectetuer@icloud.com",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_08.jpg",
- status: "online",
- delivered: "1/3",
- },
- {
- name: "Prescott Stafford",
- mail: "nunc.ac.sem@icloud.edu",
- avatar:
- "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_09.jpg",
- status: "offline",
- delivered: "2/3",
- },
-];
-
-const country = [
- {
- id: "austria",
- value: "Austria",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/at.png",
- },
- {
- value: "Belarus",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/by.png",
- },
- {
- value: "Belgium",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/be.png",
- },
- {
- value: "Bulgaria",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/bg.png",
- },
- {
- value: "Cyprus",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/cy.png",
- },
- {
- value: "Czech Republic",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/cz.png",
- },
- {
- value: "Denmark",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/dk.png",
- },
- {
- id: "estonia",
- value: "Estonia",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/ee.png",
- },
- {
- value: "Finland",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/fi.png",
- },
- {
- value: "France",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/fr.png",
- },
- {
- value: "Germany",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/de.png",
- },
- {
- value: "Greece",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/gr.png",
- },
- {
- value: "Hungary",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/hu.png",
- },
- {
- value: "Ireland",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/ie.png",
- },
- {
- value: "Italy",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/it.png",
- },
- {
- value: "Latvia",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/lv.png",
- },
- {
- value: "Lithuania",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/lt.png",
- },
- {
- value: "Luxembourg",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/lu.png",
- },
- {
- value: "Malta",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/mt.png",
- },
- {
- value: "Netherlands",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/nl.png",
- },
- {
- value: "Poland",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/pl.png",
- },
- {
- value: "Portugal",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/pt.png",
- },
- {
- value: "Russia",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/ru.png",
- },
- {
- value: "Romania",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/ro.png",
- },
- {
- value: "Slovakia",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/sk.png",
- },
- {
- value: "Slovenia",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/si.png",
- },
- {
- value: "Spain",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/es.png",
- },
- {
- value: "Sweden",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/se.png",
- },
- {
- value: "United Kingdom",
- src: "https://snippet.dhtmlx.com/codebase/data/combobox/01/img/gb.png",
- },
-];
-
-const store = {
- gridDataset,
- chartData,
- hotelsData,
- ribbonData,
- ticketsDataviewData,
- treeData,
- messageDataviewData,
- country,
- sidebarData,
- toolbarData,
-};
-
-export default store;
" +
- "" +
- "" +
- "