Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Anhvu dev #2

Closed
wants to merge 4 commits into from
Closed

Anhvu dev #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
b685ce9
update event name type
lamanhvu62 Mar 26, 2024
b437370
update UTM Tracking
lamanhvu62 Mar 27, 2024
6df661e
Merge branch 'list-flow' of https://github.com/vietredweb/bi-app into…
lamanhvu62 Mar 27, 2024
a6c050b
Update common.json
lamanhvu62 Mar 27, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
56 changes: 55 additions & 1 deletion packages/aesirx-bi-app/src/containers/Dashboard/Dashboard.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -220,7 +220,7 @@ const Dashboard = observer(
/>
</Col>
</Row>
<Row className="my-24 pb-24">
<Row>
<Col lg={6} className="mb-24">
<div className="bg-white rounded-3 p-24 shadow-sm h-100 position-relative">
<h4 className="me-24 mb-24 fw-semibold fs-5">{t('txt_top_sources')}</h4>
Expand Down Expand Up @@ -282,6 +282,60 @@ const Dashboard = observer(
</div>
</Col>
</Row>
<Row>
<Col lg={12} className="mb-24">
<div className="bg-white rounded-3 p-24 shadow-sm h-100 position-relative">
<h4 className="me-24 mb-24 fw-semibold fs-5">{t('txt_event')}</h4>
<TopTable
data={this.dashboardListViewModel?.eventNameTypeTableData?.list}
pagination={this.dashboardListViewModel?.eventNameTypeTableData?.pagination}
isPagination={true}
simplePagination={true}
selectPage={async (value) => {
await this.dashboardListViewModel.handleFilterSources({ page: value });
}}
selectPageSize={async (value) => {
await this.dashboardListViewModel.handleFilterSources({
page: 1,
page_size: value,
});
}}
status={this.dashboardListViewModel?.browsersData}
sortAPI={true}
handleSort={this.handleSortSources}
sortBy={this.dashboardListViewModel?.sortByEventsType}
{...this.props}
/>
</div>
</Col>
</Row>
<Row>
<Col lg={12} className="mb-24">
<div className="bg-white rounded-3 p-24 shadow-sm h-100 position-relative">
<h4 className="me-24 mb-24 fw-semibold fs-5">{t('txt_menu_utm_tracking')}</h4>
<TopTable
data={this.dashboardListViewModel?.attributeTypeTableData?.list}
pagination={this.dashboardListViewModel?.attributeTypeTableData?.pagination}
isPagination={true}
simplePagination={true}
selectPage={async (value) => {
await this.dashboardListViewModel.handleFilterSources({ page: value });
}}
selectPageSize={async (value) => {
await this.dashboardListViewModel.handleFilterSources({
page: 1,
page_size: value,
});
}}
status={this.dashboardListViewModel?.browsersData}
sortAPI={true}
handleSort={this.handleSortSources}
sortBy={this.dashboardListViewModel?.sortByEventsType}
{...this.props}
/>
</div>
</Col>
</Row>
</div>
);
}
Expand Down
154 changes: 154 additions & 0 deletions packages/aesirx-bi-app/src/containers/Dashboard/DashboardModel/DashboardModel.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,12 +9,14 @@ import {
BI_DEVICES_FIELD_KEY,
BI_SUMMARY_FIELD_KEY,
BI_VISITORS_FIELD_KEY,
BI_EVENTS_TYPE_FIELD_KEY,
Helper,
enumerateDaysBetweenDates,
env,
} from 'aesirx-lib';
import { Image } from 'react-bootstrap';
import { BI_REFERER_FIELD_KEY } from 'aesirx-lib';
import { BI_ATTRIBUTE_FIELD_KEY } from 'aesirx-lib';

class DashboardModel {
data = [];
Expand Down Expand Up @@ -453,6 +455,158 @@ class DashboardModel {
};
}
};

toEventsTypeTableTop = () => {
const headerTable = ['text_keyword', 'txt_unique_visitors', 'txt_visitors'];
const accessor = [
BI_EVENTS_TYPE_FIELD_KEY.EVENT_NAME,
BI_EVENTS_TYPE_FIELD_KEY.UNIQUE_VISITOR,
BI_EVENTS_TYPE_FIELD_KEY.TOTAL_VISITOR,
];
const largestValue = Math.max(
...this.data.map((o) => o[BI_SUMMARY_FIELD_KEY.NUMBER_OF_VISITORS])
);
if (this.data?.length) {
const header = accessor.map((key, index) => {
return {
Header: headerTable[index],
accessor: key,
allowSort: true,
width:
key === BI_EVENTS_TYPE_FIELD_KEY.EVENT_NAME
? 250
: key === BI_SUMMARY_FIELD_KEY.NUMBER_OF_UNIQUE_PAGE_VIEWS
? 220
: 170,
Cell: ({ cell, column, row }) => {
return (
<>
{column.id === BI_EVENTS_TYPE_FIELD_KEY.EVENT_NAME ? (
<div
className={
'd-flex align-items-center text-capitalize py-sm px-20 position-relative'
}
>
<div className="z-1">{cell?.value === '' ? 'Unknown' : cell?.value}</div>
</div>
) : (
<div className={' text-end'}>{Helper.numberWithCommas(cell?.value) ?? null}</div>
)}
</>
);
},
};
});
const data = this.data?.map((item) => {
return {
...item,
...accessor
.map((i) => {
return {
[i]: item[i],
};
})
.reduce((accumulator, currentValue) => ({ ...currentValue, ...accumulator }), {}),
};
});
const filteredData = data?.map((obj) => {
for (let prop in obj) {
if (!accessor.includes(prop)) {
delete obj[prop];
}
}
return obj;
});

return {
header,
data: filteredData,
};
} else {
return {
header: [],
data: [],
};
}
};

toAttributeTableTop = () => {
const headerTable = [
'text_campaign',
'txt_page_views',
'txt_unique_page_views',
'txt_visitors',
'txt_bounce_rate',
'txt_avg_page_session',
'txt_avg_session_duration',
];
const accessor = [
BI_ATTRIBUTE_FIELD_KEY.VALUE,
BI_SUMMARY_FIELD_KEY.NUMBER_OF_PAGE_VIEWS,
BI_SUMMARY_FIELD_KEY.NUMBER_OF_UNIQUE_PAGE_VIEWS,
BI_SUMMARY_FIELD_KEY.NUMBER_OF_VISITORS,
BI_SUMMARY_FIELD_KEY.BOUNCE_RATE,
BI_SUMMARY_FIELD_KEY.NUMBER_OF_PAGES_PER_SESSION,
BI_SUMMARY_FIELD_KEY.AVERAGE_SESSION_DURATION,
];
if (this.data?.length > 0) {
const header = accessor.map((key, index) => {
return {
Header: headerTable[index],
accessor: key,
allowSort: true,
width: key === BI_ATTRIBUTE_FIELD_KEY.VALUE && 250,
Cell: ({ cell, column, row }) => {
return (
<>
{column.id === BI_ATTRIBUTE_FIELD_KEY.VALUE ? (
<div
className={
'd-flex align-items-center text-capitalize py-sm px-20 position-relative'
}
>
<div className="z-1">{cell?.value === '' ? 'Unknown' : cell?.value}</div>
</div>
) : (
<div className={' text-end'}>{Helper.numberWithCommas(cell?.value) ?? null}</div>
)}
</>
);
},
};
});
const data = this.data?.map((item) => {
return {
...item,
...accessor
.map((i) => {
return {
[i]: item[i],
};
})
.reduce((accumulator, currentValue) => ({ ...currentValue, ...accumulator }), {}),
};
});
const filteredData = data?.map((obj) => {
for (let prop in obj) {
if (!accessor.includes(prop)) {
delete obj[prop];
}
}
return obj;
});

return {
header,
data: filteredData,
};
} else {
return {
header: [],
data: [],
};
}
};
}

export default DashboardModel;
62 changes: 62 additions & 0 deletions packages/aesirx-bi-app/src/containers/Dashboard/DashboardStore/DashboardStore.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -219,6 +219,68 @@ export class DashboardStore {
});
}
};

getEventsType = async (dataFilter, dateFilter, callbackOnSuccess, callbackOnError) => {
try {
const biService = new AesirxBiApiService();
const responseDataFromLibrary = await biService.getEventsType(dataFilter, dateFilter);
if (responseDataFromLibrary) {
runInAction(() => {
callbackOnSuccess(responseDataFromLibrary);
});
} else {
callbackOnError({
message: 'Something went wrong from Server response',
});
}
} catch (error) {
console.log('errorrrr', error);
runInAction(() => {
if (error.response?.data.message) {
callbackOnError({
message: error.response?.data?.message,
});
} else {
callbackOnError({
message: error?.response?.data?._messages
? error.response?.data?._messages[0]?.message
: 'Something went wrong from Server response',
});
}
});
}
};

getAttribute = async (dataFilter, dateFilter, callbackOnSuccess, callbackOnError) => {
try {
const biService = new AesirxBiApiService();
const responseDataFromLibrary = await biService.getAttribute(dataFilter, dateFilter);
if (responseDataFromLibrary) {
runInAction(() => {
callbackOnSuccess(responseDataFromLibrary);
});
} else {
callbackOnError({
message: 'Something went wrong from Server response',
});
}
} catch (error) {
console.log('errorrrr', error);
runInAction(() => {
if (error.response?.data.message) {
callbackOnError({
message: error.response?.data?.message,
});
} else {
callbackOnError({
message: error?.response?.data?._messages
? error.response?.data?._messages[0]?.message
: 'Something went wrong from Server response',
});
}
});
}
};
}

export default DashboardStore;
Loading
Loading