Final project #105

DmitriyBukreev · 2023-04-14T12:46:54Z

No description provided.

…tions

boris-catsvill · 2023-04-21T08:51:20Z

src/components/categories/index.js

+import SortableList from '../sortable-list';
+import NotificationMessage from '../notification';
+
+const BACKEND_URL = process.env.BACKEND_URL;


👍 good
лайк за переменные окружения

boris-catsvill · 2023-04-21T08:51:31Z

src/components/categories/index.js

+  categoryURL = new URL('/api/rest/categories?_sort=weight&_refs=subcategory', BACKEND_URL);
+  subcategoryURL = new URL('/api/rest/subcategories', BACKEND_URL);
+
+  onOpen = event => {


boris-catsvill · 2023-04-21T08:52:17Z

src/components/categories/index.js

+    this.element.addEventListener('list-updated', this.onListUpdate);
+  }
+
+  async loadData() {


тут не нужен async

boris-catsvill · 2023-04-21T08:52:29Z

src/components/column-chart/index.js

@@ -1,89 +1,123 @@
+import fetchJson from '../../utils/fetch-json.js';
+
+const BACKEND_URL = process.env.BACKEND_URL;


boris-catsvill · 2023-04-21T08:52:49Z

src/components/column-chart/index.js

-  update ({headerData, bodyData}) {
-    this.subElements.header.textContent = headerData;
-    this.subElements.body.innerHTML = this.getColumnBody(bodyData);
+  async loadData(from, to) {


boris-catsvill · 2023-04-21T08:53:15Z

src/components/filter/index.js

@@ -0,0 +1,99 @@
+import DoubleSlider from '../double-slider/index.js';
+
+export default class ProductFilter {


good 👍
лайк за отделение логики в собственный компонент

boris-catsvill · 2023-04-21T08:53:35Z

src/components/image-uploader/index.js

+
+const IMGUR_CLIENT_ID = process.env.IMGUR_CLIENT_ID;
+
+export default class ImageUploader {


boris-catsvill · 2023-04-21T08:53:44Z

src/components/image-uploader/index.js

+  onUpload = async () => {
+    try {
+      const [file] = this.input.files;
+      if (!file) return;


boris-catsvill · 2023-04-21T08:54:02Z

src/components/image-uploader/index.js

+    return wrapper.firstElementChild;
+  }
+
+  async upload(file) {


boris-catsvill · 2023-04-21T08:54:39Z

src/components/product-form/index.js

-  onSubmit = event => {
-    event.preventDefault();
+  onImageUploaded = event => {
+    const listElement = this.getImageListItem(event.detail.image);


boris-catsvill · 2023-04-21T08:55:11Z

src/components/product-form/index.js

-  };
+  async render() {
+    const categoriesPromise = this.loadCategories();
+    const productPromise = this.productId.length


boris-catsvill · 2023-04-21T08:55:36Z

src/components/product-form/index.js

-      const element = productForm.querySelector(`#${item}`);
-
-      element.value = this.formData[item] || this.defaultFormData[item];
+    if (!this.productId.length) elements.subcategory.selectedIndex = 0;


не экономьте на скобках в блоках if

boris-catsvill · 2023-04-21T08:56:04Z

src/components/product-form/index.js

+    for (const category of categories) {
+      for (const subcategory of category.subcategories) {
+        options.push(
+          `<option value="${subcategory.id}">${category.title} > ${subcategory.title}</option>`


обратите внимание на конструктор new Option

boris-catsvill · 2023-04-21T08:57:09Z

src/components/tooltip/index.js

-    this.element.style.left = left + 'px';
-    this.element.style.top = top + 'px';
+  destroy() {
+    document.removeEventListener('pointerover', this.addTooltipHandler);


good 👍
альтернатива может быть в использовании AbortController

boris-catsvill · 2023-04-21T08:57:24Z

src/index.js

@@ -3,6 +3,14 @@ import tooltip from './components/tooltip/index.js';

 tooltip.initialize();

+const button = document.querySelector('.sidebar__toggler');


boris-catsvill · 2023-04-21T08:58:37Z

src/index.js

@@ -14,4 +22,16 @@ router
  .addRoute(/^categories$/, 'categories')
  .addRoute(/^404\/?$/, 'error404')
  .setNotFoundPagePath('error404')
+  .addRouteHandler(route => {
+    for (let item of sidebarList) {


альтернатива:
выделить ссылки для навигации в отдельный компонент и внутри него описать логику подстановки active

boris-catsvill · 2023-04-21T08:58:50Z

src/pages/categories/index.js

+
+  destroy() {
+    this.remove();
+    for (const component of Object.values(this.components)) {


boris-catsvill · 2023-04-21T08:58:58Z

src/pages/dashboard/index.js

-    const ordersDataTotal = ordersData.reduce((accum, item) => accum + item);
-    const salesDataTotal = salesData.reduce((accum, item) => accum + item);
-    const customersDataTotal = customersData.reduce((accum, item) => accum + item);
+  loadData(from, to) {


boris-catsvill · 2023-04-21T08:59:55Z

src/pages/products/edit/index.js

+  }
+
+  initComponents() {
+    const path = decodeURI(window.location.pathname);


🔴 please don't do this
так делать нельзя, компонент не должен обращаться к window.location.
это дело роутера, и из роутера id товара должно попасть в данную страницу

boris-catsvill · 2023-04-21T09:02:00Z

src/pages/sales/index.js

+  initComponents() {
+    const now = new Date();
+    const to = new Date();
+    const from = new Date(now.setMonth(now.getMonth() - 1));


boris-catsvill

👍 good
посмотрите комменты

DmitriyBukreev added 7 commits April 4, 2023 19:15

Replaced dashboard page and related components with my own implementa…

3bee461

…tions

Implemented Products page

7cc2ed1

Implemented edit page for products

eab4152

Implemented categories page

f0e248d

Added notification message implementation

307b03a

Implemented Sales page

28a6746

Implemented Sidebar functionality

97bd54a

boris-catsvill reviewed Apr 21, 2023

View reviewed changes

src/components/image-uploader/index.js

return wrapper.firstElementChild;

}

async upload(file) {

Copy link

Owner

boris-catsvill Apr 21, 2023 •

edited

Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍 good

boris-catsvill reviewed Apr 21, 2023

View reviewed changes

src/pages/categories/index.js

destroy() {

this.remove();

for (const component of Object.values(this.components)) {

Copy link

Owner

boris-catsvill Apr 21, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

good 👍

boris-catsvill reviewed Apr 21, 2023

View reviewed changes

boris-catsvill approved these changes Apr 21, 2023

View reviewed changes

DmitriyBukreev added 2 commits April 21, 2023 16:39

Removed redundant async

5b908e9

Added abort controller for events

18ffc08

DmitriyBukreev added 2 commits April 21, 2023 17:31

Moved id separation logic to router

64485d1

Made use of Option constructor

4af92e5

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Final project #105

Final project #105

DmitriyBukreev commented Apr 14, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023 •

edited

Loading

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill Apr 21, 2023

boris-catsvill left a comment

		@@ -1,89 +1,123 @@
		import fetchJson from '../../utils/fetch-json.js';

		const BACKEND_URL = process.env.BACKEND_URL;

		@@ -0,0 +1,99 @@
		import DoubleSlider from '../double-slider/index.js';

		export default class ProductFilter {


		const IMGUR_CLIENT_ID = process.env.IMGUR_CLIENT_ID;

		export default class ImageUploader {

		@@ -3,6 +3,14 @@ import tooltip from './components/tooltip/index.js';

		tooltip.initialize();

		const button = document.querySelector('.sidebar__toggler');

Final project #105

Are you sure you want to change the base?

Final project #105

Conversation

DmitriyBukreev commented Apr 14, 2023

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

boris-catsvill Apr 21, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

boris-catsvill left a comment

Choose a reason for hiding this comment

boris-catsvill Apr 21, 2023 •

edited

Loading